{
  "version": 3,
  "sources": ["../../assets/scripts/store/features/search/SearchForm/SearchResults.tsx", "../../assets/scripts/store/hooks/useDebounce.ts", "../../assets/scripts/store/features/search/SearchForm/index.tsx"],
  "sourcesContent": ["import fetcher from '@app/utils/fetcher';\r\nimport Loader from '@store/components/Loader';\r\nimport type { FC} from 'react';\r\nimport React, { createRef, useEffect, useState } from 'react';\r\nimport { useTranslation } from 'react-i18next';\r\nimport useSWR from 'swr';\r\n\r\nimport type { ISearchResult, ISearchResultItem } from './types';\r\n\r\ninterface IProps {\r\n  apiUrl: string;\r\n  searchTerm: string;\r\n  searchLink: string;\r\n}\r\n\r\nconst ItemsGroup: FC<{ items: ISearchResultItem[]; title: string }> = ({ items, title }) => {\r\n  if (!items || items.length === 0) return <></>;\r\n\r\n  return (\r\n    <div className=\"py-2 border-t-0 border-b border-gray-300 last:border-b-0\">\r\n      <span className=\"block pb-1 px-4 text-gray-500 text-sm font-medium font-heading text-left\">\r\n        {title}\r\n      </span>\r\n      <div className=\"grid gap-y-1\">\r\n        {items.map(item => (\r\n          <SearchListItem key={item.id} {...item} />\r\n        ))}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nconst SearchListItem: FC<ISearchResultItem> = props => {\r\n  const [hasImage, setValidPicture] = useState(!!props.imageUrl);\r\n\r\n  return (\r\n    <a\r\n      href={props.url}\r\n      key={props.id}\r\n      title={`${props.code} - ${props.name}`}\r\n      className=\"flex gap-2 text-sm h-10 px-4 hover:text-primary\">\r\n      <div className=\"max-w-[2.5rem] w-full inline-flex justify-center items-center flex-shrink-0 overflow-hidden\">\r\n        {hasImage && props.imageUrl && (\r\n          <img\r\n            className=\"max-h-full object-scale-down\"\r\n            src={props.imageUrl}\r\n            alt={props.name}\r\n            onError={() => setValidPicture(false)}\r\n          />\r\n        )}\r\n      </div>\r\n      <span className=\"inline-flex items-center overflow-hidden\">\r\n        <span className=\"w-[30ch] inline-block font-medium truncate\">{props.name}</span>\r\n      </span>\r\n    </a>\r\n  );\r\n};\r\n\r\nexport default function SearchResults({ apiUrl, searchTerm, searchLink }: IProps) {\r\n  const { t } = useTranslation();\r\n\r\n  const ref = createRef<HTMLDivElement>();\r\n  const [isFocused, setFocused] = useState(true);\r\n\r\n  const { data, error } = useSWR({ apiUrl, searchTerm }, ({ apiUrl, searchTerm }) =>\r\n    fetcher<ISearchResult>(apiUrl, { searchParams: { searchTerm } })\r\n  );\r\n\r\n  useEffect(() => {\r\n    const handler = (event: MouseEvent) => {\r\n      if (ref.current?.contains(event.target as Node)) {\r\n        event.stopPropagation();\r\n        return;\r\n      }\r\n\r\n      if (isFocused) {\r\n        setFocused(false);\r\n      }\r\n    };\r\n\r\n    document.addEventListener('click', handler, false);\r\n    return () => document.removeEventListener('click', handler);\r\n  });\r\n\r\n  if (error) {\r\n    console.error(error);\r\n    return <></>;\r\n  }\r\n\r\n  return (\r\n    <div\r\n      ref={ref}\r\n      className={`w-full absolute top-10 z-50 border border-gray-300 rounded-none bg-white text-black -mt-px overflow-hidden ${\r\n        isFocused ? 'block' : 'hidden'\r\n      }`}>\r\n      {!data && (\r\n        <div className=\"h-12 flex justify-center items-center\">\r\n          <Loader className=\"text-base text-primary\" />\r\n        </div>\r\n      )}\r\n      {data && (\r\n        <>\r\n          <div className=\"grid\">\r\n            <ItemsGroup items={data.products} title={t('Products')} />\r\n            <ItemsGroup items={data.categories} title={t('Categories')} />\r\n            {data.products.length === 0 && data.categories.length === 0 && (\r\n              <div className=\"py-2 px-4 text-center\">\r\n                <span className=\"text-gray-500 text-sm\">Neboli n\u00E1jden\u00E9 \u017Eiadne v\u00FDsledky</span>\r\n              </div>\r\n            )}\r\n          </div>\r\n          {(data.products.length > 0 || data.categories.length > 0) && (\r\n            <div>\r\n              <a\r\n                href={searchLink}\r\n                className=\"block text-center py-1 text-sm bg-gray-100 text-gray-700 mt-2 hover:bg-gray-500 hover:text-gray-100\">\r\n                {t('ToShowAllResults')}\r\n              </a>\r\n            </div>\r\n          )}\r\n        </>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n", "import { useEffect, useState } from 'react';\r\n\r\nexport function useDebounce<T>(value: T, delay = 100): T {\r\n  // State and setters for debounced value\r\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\r\n\r\n  useEffect(\r\n    () => {\r\n      // Update debounced value after delay\r\n      const handler = setTimeout(() => {\r\n        setDebouncedValue(value);\r\n      }, delay);\r\n\r\n      // Cancel the timeout if value changes (also on delay change or unmount)\r\n      // This is how we prevent debounced value from updating if value is changed ...\r\n      // .. within the delay period. Timeout gets cleared and restarted.\r\n      return () => {\r\n        clearTimeout(handler);\r\n      };\r\n    },\r\n    [value, delay] // Only re-call effect if value or delay changes\r\n  );\r\n\r\n  return debouncedValue;\r\n}\r\n", "import SearchResults from '@features/search/SearchForm/SearchResults';\r\nimport { useDebounce } from '@store/hooks/useDebounce';\r\nimport React, { useMemo, useState } from 'react';\r\nimport { useTranslation } from 'react-i18next';\r\n\r\nexport interface SearchFormProps {\r\n  apiUrl: string;\r\n  formUrl: string;\r\n}\r\n\r\nexport default function SearchForm({ apiUrl, formUrl }: SearchFormProps) {\r\n  const { t } = useTranslation();\r\n\r\n  const [searchTerm, setSearchTerm] = useState<string | undefined>();\r\n  const debounceSearchTerm = useDebounce(searchTerm, 300);\r\n\r\n  const searchLink = useMemo(() => {\r\n    const url = new URL(formUrl, window.location.origin);\r\n    url.searchParams.set('searchTerm', debounceSearchTerm);\r\n    return url.toString();\r\n  }, [debounceSearchTerm, formUrl]);\r\n\r\n  return (\r\n    <form action={formUrl} className=\"form relative w-full\" method=\"get\">\r\n      <div className=\"flex w-full\">\r\n        <div className=\"input w-full\">\r\n          <input\r\n            aria-disabled=\"true\"\r\n            autoComplete=\"off\"\r\n            className=\"w-full h-10 p-2 appearance-none focus:ring-0 focus:ring-offset-0 !text-primary border border-r-0 !rounded-none tracking-widest\"\r\n            name=\"searchTerm\"\r\n            placeholder={t('WhatAreYouLookingFor')}\r\n            required\r\n            type=\"search\"\r\n            onChange={event => setSearchTerm(event.currentTarget.value)}\r\n          />\r\n        </div>\r\n        <button\r\n          aria-disabled=\"true\"\r\n          aria-label={t('ToSearch')}\r\n          className=\"flex justify-center items-center border border-l-0 border-primary bg-primary text-white p-3 w-12 h-10 outline-none hover:text-accent-dark\">\r\n          <i className=\"fa-solid fa-magnifying-glass\"></i>\r\n        </button>\r\n      </div>\r\n\r\n      {debounceSearchTerm && debounceSearchTerm.length >= 3 && (\r\n        <SearchResults apiUrl={apiUrl} searchTerm={debounceSearchTerm} searchLink={searchLink} />\r\n      )}\r\n    </form>\r\n  );\r\n}\r\n"],
  "mappings": "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",
  "names": ["apiUrl", "searchTerm", "import_react", "import_react", "import_jsx_runtime"]
}