@dropins/storefront-product-discovery 1.0.2 → 1.1.0-alpha1

package/containers/SearchBarInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBarInput.js","sources":["../../node_modules/@adobe-commerce/elsie/src/icons/Search.svg","/@dropins/storefront-product-discovery/src/components/SearchBarInput/SearchBarInput.tsx","/@dropins/storefront-product-discovery/src/containers/SearchBarInput/utils/getSearchBarInputSearch.ts","/@dropins/storefront-product-discovery/src/containers/SearchBarInput/SearchBarInput.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgSearch = (props) => /* @__PURE__ */ React.createElement(\"svg\", { id: \"Icon_Search_Base\", \"data-name\": \"Icon \\\\u2013 Search \\\\u2013 Base\", xmlns: \"http://www.w3.org/2000/svg\", width: 24, height: 24, fill: \"none\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"g\", { id: \"Large\" }, /* @__PURE__ */ React.createElement(\"rect\", { id: \"Placement_area\", \"data-name\": \"Placement area\", width: 24, height: 24, fill: \"#fff\", opacity: 0 }), /* @__PURE__ */ React.createElement(\"g\", { id: \"Search_icon\", \"data-name\": \"Search icon\", transform: \"translate(3.75 3.75)\" }, /* @__PURE__ */ React.createElement(\"circle\", { vectorEffect: \"non-scaling-stroke\", id: \"Ellipse_186\", \"data-name\": \"Ellipse 186\", cx: 6, cy: 6, r: 6, fill: \"none\", stroke: \"currentColor\" }), /* @__PURE__ */ React.createElement(\"line\", { vectorEffect: \"non-scaling-stroke\", id: \"Line_556\", \"data-name\": \"Line 556\", x2: 6, y2: 6, transform: \"translate(10.5 10.5)\", fill: \"none\", stroke: \"currentColor\" }))));\nexport default SvgSearch;\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, TargetedEvent } from 'preact/compat';\nimport { Input } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\n\nimport '@/plp/components/SearchBarInput/SearchBarInput.css';\n\nconst KEY_PRESS_EVENTS = {\n  ENTER: 'Enter',\n  ESCAPE: 'Escape',\n} as const;\n\nexport interface SearchBarInputProps extends HTMLAttributes<HTMLDivElement> {\n  searchIcon?: VNode;\n  searchQuery?: string;\n  defaultQueryPlaceholder?: string;\n  isLoading?: boolean;\n  error?: string | null;\n  onQueryInput?: (query: string) => void;\n  onExecuteSearch?: (query: string) => void;\n  onClose?: () => void;\n}\n\nexport const SearchBarInput: FunctionComponent<SearchBarInputProps> = ({\n  searchQuery = '',\n  defaultQueryPlaceholder,\n  searchIcon,\n  onQueryInput,\n  onExecuteSearch,\n  onClose,\n}) => {\n  const translations = useText({ placeholder: 'Search.SearchInput.placeholder' });\n\n  const handleKeyPress = (event: TargetedEvent<HTMLInputElement, KeyboardEvent>) => {\n    const { key } = event;\n    const inputValue = event.currentTarget?.value?.trim() || '';\n\n    if (key === KEY_PRESS_EVENTS.ENTER && inputValue) {\n      onExecuteSearch?.(inputValue);\n    } else if (key === KEY_PRESS_EVENTS.ESCAPE) {\n      onClose?.();\n    }\n  };\n\n  const handleQueryInput = (event: TargetedEvent<HTMLInputElement, Event>) => {\n    onQueryInput?.(event.currentTarget?.value || '');\n  };\n\n  return (\n    <div className={classes(['product-discovery--search-bar-input__container'])}>\n      <Input\n        id=\"search-bar-input-form\"\n        role=\"searchbox\"\n        aria-label=\"Search Input\"\n        value={searchQuery}\n        placeholder={defaultQueryPlaceholder || translations.placeholder}\n        icon={\n          searchIcon ? (\n            <VComponent className=\"product-discovery--search-bar-input__form\" node={searchIcon} />\n          ) : undefined\n        }\n        onKeyDown={handleKeyPress}\n        onChange={handleQueryInput}\n      />\n    </div>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { productSearch as productSearchQuery } from '@/plp/api';\nimport { SearchVariables } from '@/plp/data/models';\nimport { Product } from '@/plp/data/models/product';\nimport { transformSearchResultProducts } from '@/plp/data/transforms';\nimport {\n  SEARCH_UNIT_ID,\n  searchRequestSent,\n  searchResponseReceived,\n  searchResultsView,\n  updateSearchInputCtx,\n  updateSearchResultsCtx,\n} from '@/plp/utils/acdlEvents';\n\n// Constants\nconst DEFAULT_VISIBILITY_FILTER = {\n  attribute: 'visibility',\n  in: ['Search', 'Catalog, Search'],\n};\n\ninterface PageInfo {\n  currentPage: number;\n  pageSize: number;\n  totalPages: number;\n  totalItems: number;\n}\n\nconst handleDataCollectionError = (error: any, context: string): void => {\n  console.error(`Error collecting ${context}:`, error);\n};\n\nconst createPageInfo = (itemsLength: number): PageInfo => ({\n  currentPage: 1,\n  pageSize: itemsLength,\n  totalPages: 1,\n  totalItems: itemsLength,\n});\n\nconst trackSearchRequest = (searchRequestVariable: SearchVariables): string => {\n  let searchRequestId = '';\n\n  try {\n    searchRequestId = self.crypto.randomUUID();\n    updateSearchInputCtx(\n      SEARCH_UNIT_ID,\n      searchRequestId,\n      searchRequestVariable.phrase || '',\n      searchRequestVariable.filter || [],\n      searchRequestVariable.pageSize || 0,\n      searchRequestVariable.currentPage || 0,\n      searchRequestVariable.sort || [],\n    );\n    searchRequestSent(SEARCH_UNIT_ID);\n  } catch (e) {\n    handleDataCollectionError(e, 'search input context');\n  }\n\n  return searchRequestId;\n};\n\nconst updateSearchResults = (searchRequestId: string, items: Product[], hasPhrase: boolean): void => {\n  try {\n    updateSearchResultsCtx(SEARCH_UNIT_ID, searchRequestId, {\n      items: Array.isArray(items) ? items : [],\n      facets: [],\n      pageInfo: createPageInfo(items?.length || 0),\n      totalCount: items?.length || 0,\n    });\n    searchResponseReceived(SEARCH_UNIT_ID);\n\n    if (hasPhrase) {\n      searchResultsView(SEARCH_UNIT_ID);\n    }\n  } catch (e) {\n    handleDataCollectionError(e, 'search input data');\n  }\n};\n\nconst prepareSearchRequest = (searchRequestVariable: SearchVariables): SearchVariables => {\n  const searchRequestObject = structuredClone(searchRequestVariable);\n\n  if (!searchRequestObject.filter) {\n    searchRequestObject.filter = [];\n  }\n  searchRequestObject.filter.push(DEFAULT_VISIBILITY_FILTER);\n\n  return searchRequestObject;\n};\n\nexport const getSearchBarInputSearch = (query: string): Promise<Product[]> => {\n  if (!query?.trim()) {\n    return Promise.resolve([]);\n  }\n\n  const searchRequestVariable: SearchVariables = { phrase: query.trim() };\n  const searchRequestId = trackSearchRequest(searchRequestVariable);\n  const searchRequestObject = prepareSearchRequest(searchRequestVariable);\n\n  return productSearchQuery(searchRequestObject)\n    .then((response: any | null) => {\n      const transformedItems = (transformSearchResultProducts(response) || []).slice(0, 8);\n\n      updateSearchResults(searchRequestId, transformedItems, !!searchRequestVariable.phrase);\n\n      return transformedItems;\n    })\n    .catch((error: any) => {\n      console.error('SearchInput query failed:', error);\n      throw new Error('Error fetching search input data.');\n    });\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { HTMLAttributes } from 'preact/compat';\nimport { useCallback, useEffect, useMemo, useState } from 'preact/hooks';\nimport { Icon } from '@adobe-commerce/elsie/components';\nimport { Search } from '@adobe-commerce/elsie/icons';\nimport { Container, Slot, SlotProps, debounce } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\n\nimport { SearchBarInput as SearchBarInputComponent } from '@/plp/components/SearchBarInput';\nimport { Product, SearchInputRequest, SearchInputResult } from '@/plp/data/models/product';\n\nimport { getSearchBarInputSearch } from './utils/getSearchBarInputSearch';\n\nexport interface SearchBarInputProps extends HTMLAttributes<HTMLDivElement> {\n  searchQuery?: string;\n  minimumQueryLength?: number;\n  debounceDelay?: number;\n  defaultQueryPlaceholder?: string;\n  routeSearch?: (searchQuery: string) => void;\n  slots?: {\n    InputForm?: SlotProps;\n    SearchIcon?: SlotProps;\n  };\n}\n\n// debounced function type helper method\ntype DebouncedFunction<T extends (...args: any[]) => any> = T & {\n  cancel?: () => void;\n};\n\nconst useSearchBarInput = (\n  minimumQueryLength: number,\n  debounceDelay: number,\n  routeSearch: (searchQuery: string) => void,\n) => {\n  const [isLoading, setIsLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  const handleSearch = useCallback(async (query: string) => {\n    setIsLoading(true);\n    setError(null);\n\n    try {\n      events.emit('search-input/request', { phrase: query });\n      const searchInputResults = await getSearchBarInputSearch(query);\n      events.emit('search-input/result', {\n        result: searchInputResults as Product[],\n        request: { phrase: query },\n      } as SearchInputResult);\n    } catch (err) {\n      const errorMessage = err instanceof Error ? err.message : 'Search Input failed';\n      setError(errorMessage);\n      // may need to emit an error event here?\n    } finally {\n      setIsLoading(false);\n    }\n  }, []);\n\n  // the adobe elsie debounce function *should* have a cancel, but it doesnt seem to be typed correctly\n  const debouncedSearch = useMemo(\n    () => debounce(handleSearch, debounceDelay) as DebouncedFunction<typeof handleSearch>,\n    [handleSearch, debounceDelay],\n  );\n\n  // need to cancel any pending debounced calls when component unmounts or debouncedSearch changes\n  useEffect(() => {\n    return () => {\n      if (debouncedSearch.cancel) {\n        debouncedSearch.cancel();\n      }\n    };\n  }, [debouncedSearch]);\n\n  const clearSearchResults = useCallback(() => {\n    events.emit('search-input/result', {\n      result: [],\n      request: { phrase: '' },\n    } as SearchInputResult);\n  }, []);\n\n  const handleQueryInput = useCallback(\n    (query: string) => {\n      if (error) {\n        setError(null);\n      }\n\n      if (query.length < 1) {\n        clearSearchResults();\n        return;\n      }\n\n      if (query.length >= minimumQueryLength) {\n        debouncedSearch(query);\n      }\n    },\n    [minimumQueryLength, debouncedSearch, error, clearSearchResults],\n  );\n\n  const handleExecuteSearch = useCallback(\n    (query: string) => {\n      // if a `routeSearch` cb function is provided, use it to handle any navigation\n      routeSearch && routeSearch(query);\n      events.emit('search/request', { phrase: query } as SearchInputRequest);\n    },\n    [routeSearch],\n  );\n\n  const handleClose = useCallback(() => {\n    setError(null);\n    setIsLoading(false);\n    clearSearchResults();\n  }, [clearSearchResults]);\n\n  return {\n    isLoading,\n    error,\n    handleQueryInput,\n    handleExecuteSearch,\n    handleClose,\n  };\n};\n\nexport const SearchBarInput: Container<SearchBarInputProps> = ({\n  searchQuery,\n  minimumQueryLength = 3,\n  debounceDelay = 300,\n  defaultQueryPlaceholder,\n  routeSearch = () => {},\n  slots,\n}) => {\n  const { isLoading, error, handleQueryInput, handleExecuteSearch, handleClose } = useSearchBarInput(\n    minimumQueryLength,\n    debounceDelay,\n    routeSearch,\n  );\n\n  const searchIcon = useMemo(\n    () => (\n      <Slot name=\"InputFormSearchIcon\" slot={slots?.SearchIcon}>\n        <Icon source={Search} size=\"24\" />\n      </Slot>\n    ),\n    [slots?.SearchIcon],\n  );\n\n  const inputForm = useMemo(\n    () => (\n      <Slot name=\"InputForm\" slot={slots?.InputForm}>\n        <SearchBarInputComponent\n          searchQuery={searchQuery}\n          defaultQueryPlaceholder={defaultQueryPlaceholder}\n          searchIcon={searchIcon}\n          onQueryInput={handleQueryInput}\n          onExecuteSearch={handleExecuteSearch}\n          onClose={handleClose}\n          isLoading={isLoading}\n          error={error}\n        />\n      </Slot>\n    ),\n    [\n      searchQuery,\n      defaultQueryPlaceholder,\n      searchIcon,\n      handleQueryInput,\n      handleExecuteSearch,\n      handleClose,\n      isLoading,\n      error,\n      slots?.InputForm,\n    ],\n  );\n\n  return <>{inputForm}</>;\n};\n"],"names":["SvgSearch","props","React","KEY_PRESS_EVENTS","SearchBarInput","searchQuery","defaultQueryPlaceholder","searchIcon","onQueryInput","onExecuteSearch","onClose","translations","useText","handleKeyPress","event","key","inputValue","_b","_a","handleQueryInput","classes","jsx","Input","VComponent","DEFAULT_VISIBILITY_FILTER","handleDataCollectionError","error","context","createPageInfo","itemsLength","trackSearchRequest","searchRequestVariable","searchRequestId","updateSearchInputCtx","SEARCH_UNIT_ID","searchRequestSent","e","updateSearchResults","items","hasPhrase","updateSearchResultsCtx","searchResponseReceived","searchResultsView","prepareSearchRequest","searchRequestObject","getSearchBarInputSearch","query","productSearchQuery","response","transformedItems","transformSearchResultProducts","useSearchBarInput","minimumQueryLength","debounceDelay","routeSearch","isLoading","setIsLoading","useState","setError","handleSearch","useCallback","events","searchInputResults","err","errorMessage","debouncedSearch","useMemo","debounce","useEffect","clearSearchResults","handleExecuteSearch","handleClose","slots","Slot","Icon","Search","inputForm","SearchBarInputComponent"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"SearchBarInput.js","sources":["../../node_modules/@adobe-commerce/elsie/src/icons/Search.svg","/@dropins/storefront-product-discovery/src/components/SearchBarInput/SearchBarInput.tsx","/@dropins/storefront-product-discovery/src/containers/SearchBarInput/utils/getSearchBarInputSearch.ts","/@dropins/storefront-product-discovery/src/containers/SearchBarInput/SearchBarInput.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgSearch = (props) => /* @__PURE__ */ React.createElement(\"svg\", { id: \"Icon_Search_Base\", \"data-name\": \"Icon \\\\u2013 Search \\\\u2013 Base\", xmlns: \"http://www.w3.org/2000/svg\", width: 24, height: 24, fill: \"none\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"g\", { id: \"Large\" }, /* @__PURE__ */ React.createElement(\"rect\", { id: \"Placement_area\", \"data-name\": \"Placement area\", width: 24, height: 24, fill: \"#fff\", opacity: 0 }), /* @__PURE__ */ React.createElement(\"g\", { id: \"Search_icon\", \"data-name\": \"Search icon\", transform: \"translate(3.75 3.75)\" }, /* @__PURE__ */ React.createElement(\"circle\", { vectorEffect: \"non-scaling-stroke\", id: \"Ellipse_186\", \"data-name\": \"Ellipse 186\", cx: 6, cy: 6, r: 6, fill: \"none\", stroke: \"currentColor\" }), /* @__PURE__ */ React.createElement(\"line\", { vectorEffect: \"non-scaling-stroke\", id: \"Line_556\", \"data-name\": \"Line 556\", x2: 6, y2: 6, transform: \"translate(10.5 10.5)\", fill: \"none\", stroke: \"currentColor\" }))));\nexport default SvgSearch;\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, TargetedEvent } from 'preact/compat';\nimport { Input } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\n\nimport '@/plp/components/SearchBarInput/SearchBarInput.css';\n\nconst KEY_PRESS_EVENTS = {\n  ENTER: 'Enter',\n  ESCAPE: 'Escape',\n} as const;\n\nexport interface SearchBarInputProps extends HTMLAttributes<HTMLDivElement> {\n  searchIcon?: VNode;\n  searchQuery?: string;\n  defaultQueryPlaceholder?: string;\n  isLoading?: boolean;\n  error?: string | null;\n  onQueryInput?: (query: string) => void;\n  onExecuteSearch?: (query: string) => void;\n  onClose?: () => void;\n}\n\nexport const SearchBarInput: FunctionComponent<SearchBarInputProps> = ({\n  searchQuery = '',\n  defaultQueryPlaceholder,\n  searchIcon,\n  onQueryInput,\n  onExecuteSearch,\n  onClose,\n}) => {\n  const translations = useText({ placeholder: 'Search.SearchInput.placeholder' });\n\n  const handleKeyPress = (event: TargetedEvent<HTMLInputElement, KeyboardEvent>) => {\n    const { key } = event;\n    const inputValue = event.currentTarget?.value?.trim() || '';\n\n    if (key === KEY_PRESS_EVENTS.ENTER && inputValue) {\n      onExecuteSearch?.(inputValue);\n    } else if (key === KEY_PRESS_EVENTS.ESCAPE) {\n      onClose?.();\n    }\n  };\n\n  const handleQueryInput = (event: TargetedEvent<HTMLInputElement, Event>) => {\n    onQueryInput?.(event.currentTarget?.value || '');\n  };\n\n  return (\n    <div className={classes(['product-discovery--search-bar-input__container'])}>\n      <Input\n        id=\"search-bar-input-form\"\n        role=\"searchbox\"\n        aria-label=\"Search Input\"\n        value={searchQuery}\n        placeholder={defaultQueryPlaceholder || translations.placeholder}\n        icon={\n          searchIcon ? (\n            <VComponent className=\"product-discovery--search-bar-input__form\" node={searchIcon} />\n          ) : undefined\n        }\n        onKeyDown={handleKeyPress}\n        onChange={handleQueryInput}\n      />\n    </div>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { productSearch as productSearchQuery } from '@/plp/api';\nimport { SearchVariables } from '@/plp/data/models';\nimport { Product } from '@/plp/data/models/product';\nimport { transformSearchResultProducts } from '@/plp/data/transforms';\nimport {\n  SEARCH_UNIT_ID,\n  searchRequestSent,\n  searchResponseReceived,\n  searchResultsView,\n  updateSearchInputCtx,\n  updateSearchResultsCtx,\n} from '@/plp/utils/acdlEvents';\n\n// Constants\nconst DEFAULT_VISIBILITY_FILTER = {\n  attribute: 'visibility',\n  in: ['Search', 'Catalog, Search'],\n};\n\ninterface PageInfo {\n  currentPage: number;\n  pageSize: number;\n  totalPages: number;\n  totalItems: number;\n}\n\nconst handleDataCollectionError = (error: any, context: string): void => {\n  console.error(`Error collecting ${context}:`, error);\n};\n\nconst createPageInfo = (itemsLength: number): PageInfo => ({\n  currentPage: 1,\n  pageSize: itemsLength,\n  totalPages: 1,\n  totalItems: itemsLength,\n});\n\nconst trackSearchRequest = (searchRequestVariable: SearchVariables): string => {\n  let searchRequestId = '';\n\n  try {\n    searchRequestId = self.crypto.randomUUID();\n    updateSearchInputCtx(\n      SEARCH_UNIT_ID,\n      searchRequestId,\n      searchRequestVariable.phrase || '',\n      searchRequestVariable.filter || [],\n      searchRequestVariable.pageSize || 0,\n      searchRequestVariable.currentPage || 0,\n      searchRequestVariable.sort || [],\n    );\n    searchRequestSent(SEARCH_UNIT_ID);\n  } catch (e) {\n    handleDataCollectionError(e, 'search input context');\n  }\n\n  return searchRequestId;\n};\n\nconst updateSearchResults = (searchRequestId: string, items: Product[], hasPhrase: boolean): void => {\n  try {\n    updateSearchResultsCtx(SEARCH_UNIT_ID, searchRequestId, {\n      items: Array.isArray(items) ? items : [],\n      facets: [],\n      pageInfo: createPageInfo(items?.length || 0),\n      totalCount: items?.length || 0,\n    });\n    searchResponseReceived(SEARCH_UNIT_ID);\n\n    if (hasPhrase) {\n      searchResultsView(SEARCH_UNIT_ID);\n    }\n  } catch (e) {\n    handleDataCollectionError(e, 'search input data');\n  }\n};\n\nconst prepareSearchRequest = (searchRequestVariable: SearchVariables): SearchVariables => {\n  const searchRequestObject = structuredClone(searchRequestVariable);\n\n  if (!searchRequestObject.filter) {\n    searchRequestObject.filter = [];\n  }\n  searchRequestObject.filter.push(DEFAULT_VISIBILITY_FILTER);\n\n  return searchRequestObject;\n};\n\nexport const getSearchBarInputSearch = (query: string): Promise<Product[]> => {\n  if (!query?.trim()) {\n    return Promise.resolve([]);\n  }\n\n  const searchRequestVariable: SearchVariables = { phrase: query.trim() };\n  const searchRequestId = trackSearchRequest(searchRequestVariable);\n  const searchRequestObject = prepareSearchRequest(searchRequestVariable);\n\n  return productSearchQuery(searchRequestObject)\n    .then((response: any | null) => {\n      const transformedItems = (transformSearchResultProducts(response) || []).slice(0, 8);\n\n      updateSearchResults(searchRequestId, transformedItems, !!searchRequestVariable.phrase);\n\n      return transformedItems;\n    })\n    .catch((error: any) => {\n      console.error('SearchInput query failed:', error);\n      throw new Error('Error fetching search input data.');\n    });\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { HTMLAttributes } from 'preact/compat';\nimport { useCallback, useEffect, useMemo, useState } from 'preact/hooks';\nimport { Icon } from '@adobe-commerce/elsie/components';\nimport { Search } from '@adobe-commerce/elsie/icons';\nimport { Container, Slot, SlotProps, debounce } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\n\nimport { SearchBarInput as SearchBarInputComponent } from '@/plp/components/SearchBarInput';\nimport { Product, SearchInputRequest, SearchInputResult } from '@/plp/data/models/product';\n\nimport { getSearchBarInputSearch } from './utils/getSearchBarInputSearch';\n\nexport interface SearchBarInputProps extends HTMLAttributes<HTMLDivElement> {\n  searchQuery?: string;\n  minimumQueryLength?: number;\n  debounceDelay?: number;\n  defaultQueryPlaceholder?: string;\n  routeSearch?: (searchQuery: string) => void;\n  slots?: {\n    InputForm?: SlotProps;\n    SearchIcon?: SlotProps;\n  };\n}\n\n// debounced function type helper method\ntype DebouncedFunction<T extends (...args: any[]) => any> = T & {\n  cancel?: () => void;\n};\n\nconst useSearchBarInput = (\n  minimumQueryLength: number,\n  debounceDelay: number,\n  routeSearch: (searchQuery: string) => void,\n) => {\n  const [isLoading, setIsLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  const handleSearch = useCallback(async (query: string) => {\n    setIsLoading(true);\n    setError(null);\n\n    try {\n      events.emit('search-input/request', { phrase: query });\n      const searchInputResults = await getSearchBarInputSearch(query);\n      events.emit('search-input/result', {\n        result: searchInputResults as Product[],\n        request: { phrase: query },\n      } as SearchInputResult);\n    } catch (err) {\n      const errorMessage = err instanceof Error ? err.message : 'Search Input failed';\n      setError(errorMessage);\n      // may need to emit an error event here?\n    } finally {\n      setIsLoading(false);\n    }\n  }, []);\n\n  // the adobe elsie debounce function *should* have a cancel, but it doesnt seem to be typed correctly\n  const debouncedSearch = useMemo(\n    () => debounce(handleSearch, debounceDelay) as DebouncedFunction<typeof handleSearch>,\n    [handleSearch, debounceDelay],\n  );\n\n  // need to cancel any pending debounced calls when component unmounts or debouncedSearch changes\n  useEffect(() => {\n    return () => {\n      if (debouncedSearch.cancel) {\n        debouncedSearch.cancel();\n      }\n    };\n  }, [debouncedSearch]);\n\n  const clearSearchResults = useCallback(() => {\n    events.emit('search-input/result', {\n      result: [],\n      request: { phrase: '' },\n    } as SearchInputResult);\n  }, []);\n\n  const handleQueryInput = useCallback(\n    (query: string) => {\n      if (error) {\n        setError(null);\n      }\n\n      if (query.length < 1) {\n        clearSearchResults();\n        return;\n      }\n\n      if (query.length >= minimumQueryLength) {\n        debouncedSearch(query);\n      }\n    },\n    [minimumQueryLength, debouncedSearch, error, clearSearchResults],\n  );\n\n  const handleExecuteSearch = useCallback(\n    (query: string) => {\n      // if a `routeSearch` cb function is provided, use it to handle any navigation\n      routeSearch && routeSearch(query);\n      events.emit('search/request', { phrase: query } as SearchInputRequest);\n    },\n    [routeSearch],\n  );\n\n  const handleClose = useCallback(() => {\n    setError(null);\n    setIsLoading(false);\n    clearSearchResults();\n  }, [clearSearchResults]);\n\n  return {\n    isLoading,\n    error,\n    handleQueryInput,\n    handleExecuteSearch,\n    handleClose,\n  };\n};\n\nexport const SearchBarInput: Container<SearchBarInputProps> = ({\n  searchQuery,\n  minimumQueryLength = 3,\n  debounceDelay = 300,\n  defaultQueryPlaceholder,\n  routeSearch = () => {},\n  slots,\n}) => {\n  const { isLoading, error, handleQueryInput, handleExecuteSearch, handleClose } = useSearchBarInput(\n    minimumQueryLength,\n    debounceDelay,\n    routeSearch,\n  );\n\n  const searchIcon = useMemo(\n    () => (\n      <Slot name=\"InputFormSearchIcon\" slot={slots?.SearchIcon}>\n        <Icon source={Search} size=\"24\" />\n      </Slot>\n    ),\n    [slots?.SearchIcon],\n  );\n\n  const inputForm = useMemo(\n    () => (\n      <Slot name=\"InputForm\" slot={slots?.InputForm}>\n        <SearchBarInputComponent\n          searchQuery={searchQuery}\n          defaultQueryPlaceholder={defaultQueryPlaceholder}\n          searchIcon={searchIcon}\n          onQueryInput={handleQueryInput}\n          onExecuteSearch={handleExecuteSearch}\n          onClose={handleClose}\n          isLoading={isLoading}\n          error={error}\n        />\n      </Slot>\n    ),\n    [\n      searchQuery,\n      defaultQueryPlaceholder,\n      searchIcon,\n      handleQueryInput,\n      handleExecuteSearch,\n      handleClose,\n      isLoading,\n      error,\n      slots?.InputForm,\n    ],\n  );\n\n  return <>{inputForm}</>;\n};\n"],"names":["SvgSearch","props","React","KEY_PRESS_EVENTS","SearchBarInput","searchQuery","defaultQueryPlaceholder","searchIcon","onQueryInput","onExecuteSearch","onClose","translations","useText","handleKeyPress","event","key","inputValue","_b","_a","handleQueryInput","classes","jsx","Input","VComponent","DEFAULT_VISIBILITY_FILTER","handleDataCollectionError","error","context","createPageInfo","itemsLength","trackSearchRequest","searchRequestVariable","searchRequestId","updateSearchInputCtx","SEARCH_UNIT_ID","searchRequestSent","e","updateSearchResults","items","hasPhrase","updateSearchResultsCtx","searchResponseReceived","searchResultsView","prepareSearchRequest","searchRequestObject","getSearchBarInputSearch","query","productSearchQuery","response","transformedItems","transformSearchResultProducts","useSearchBarInput","minimumQueryLength","debounceDelay","routeSearch","isLoading","setIsLoading","useState","setError","handleSearch","useCallback","events","searchInputResults","err","errorMessage","debouncedSearch","useMemo","debounce","useEffect","clearSearchResults","handleExecuteSearch","handleClose","slots","Slot","Icon","Search","inputForm","SearchBarInputComponent"],"mappings":"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","x_google_ignoreList":[0]}

package/containers/SearchBarResults.js

@@ -1,5 +1,5 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsx as n,jsxs as x}from"@dropins/tools/preact-jsx-runtime.js";import{useRef as K,useCallback as u,useEffect as j,useMemo as p,useState as S}from"@dropins/tools/preact-compat.js";import{Image as Q,Price as V,Button as z}from"@dropins/tools/components.js";import{VComponent as _,Slot as b}from"@dropins/tools/lib.js";import{events as k}from"@dropins/tools/event-bus.js";/* empty css                   */import{s as C,S as H}from"../chunks/acdlEvents.js";import{useText as M}from"@dropins/tools/i18n.js";const F=({productList:i,viewAllButton:s,onClose:c,...r})=>{const a=i&&i.length>0,d=K(null),t=u(l=>{d.current&&!d.current.contains(l.target)&&(c==null||c())},[c]),h=u(l=>{l.key==="Escape"&&(c==null||c())},[c]);return j(()=>{if(a)return document.addEventListener("mousedown",t),document.addEventListener("keydown",h),()=>{document.removeEventListener("mousedown",t),document.removeEventListener("keydown",h)}},[a,t,h]),a?n("div",{className:"product-discovery--search-bar-results",...r,children:n("div",{className:"product-discovery--search-bar-results__popover",ref:d,role:"region","aria-label":"Search results","aria-live":"polite",children:x("div",{className:"product-discovery--search-bar-results__outer-container",...r,children:[n("div",{className:"product-discovery--search-bar-results__grid",role:"list","aria-label":`${(i==null?void 0:i.length)||0} search results`,children:i==null?void 0:i.map((l,m)=>n("div",{role:"listitem",children:l},m))}),s&&n("div",{className:"product-discovery--search-bar-results__view-all-wrapper",children:n(_,{className:"product-discovery--search-bar-results__view-all-button",node:s})})]})})}):null},G=({productRouteSearch:i=t=>(t==null?void 0:t.url)||"",productItem:s,productImage:c,productName:r,productPrice:a,...d})=>{const t=p(()=>{const{name:l="",sku:m="",url:y=""}=s||{};return{tooltipText:[l,m&&`SKU: ${m}`].filter(Boolean).join(`
-`),url:y}},[s]),h=l=>{C(l.sku,H)};return x("a",{className:"product-discovery--product-item",href:i(s),rel:"noopener noreferrer",title:t.tooltipText,onClick:()=>h(s),...d,children:[n("div",{className:"product-discovery--product-item__image",children:n(_,{node:c})}),x("div",{className:"product-discovery--product-item__details",children:[n(_,{node:r}),n(_,{node:a})]})]})},re=({products:i=[],productRouteSearch:s=a=>(a==null?void 0:a.url)||"",routeSearch:c=()=>{},slots:r})=>{const[a,d]=S(i),[t,h]=S(""),[l,m]=S(i.length>0),y=M({viewAllButton:"Search.SearchInput.viewAllButton"}),N=u(({result:e=[],request:v={}})=>{const{phrase:o=""}=v;d(e),h(o),m(e.length>0&&o.length>0)},[]);j(()=>{const e=k.on("search-input/result",N);return()=>{e==null||e.off()}},[N]);const w=u(()=>{k.emit("search-input/result",{result:[],request:{phrase:""}}),m(!1)},[]),B=u(()=>{c&&c(t),k.emit("search/request",{phrase:t}),w()},[c,t,w]),R=u(e=>{var o,P,f,g;const v={loading:"lazy",src:((P=(o=e.images)==null?void 0:o[0])==null?void 0:P.url)||"",alt:((g=(f=e.images)==null?void 0:f[0])==null?void 0:g.label)||"",width:"165",height:"165"};return n(b,{name:"ProductImage",slot:r==null?void 0:r.ProductImage,context:{productItem:e,defaultImageProps:v},children:n(Q,{...v,"aria-label":e.sku})})},[r==null?void 0:r.ProductImage]),E=u(e=>n(b,{name:"ProductName",slot:r==null?void 0:r.ProductName,context:{productItem:e},children:(e==null?void 0:e.name)||""}),[r==null?void 0:r.ProductName]),A=u(e=>{var f,g,T,O,U;const{value:v,currency:o="USD"}=((g=(f=e==null?void 0:e.price)==null?void 0:f.final)==null?void 0:g.amount)||((U=(O=(T=e==null?void 0:e.priceRange)==null?void 0:T.minimum)==null?void 0:O.final)==null?void 0:U.amount)||{},P=Intl.supportedValuesOf("currency").indexOf(o||"")===-1?"USD":o;return n(b,{name:"ProductPrice",slot:r==null?void 0:r.ProductPrice,context:{productItem:e},children:n(V,{amount:typeof v=="number"?v:void 0,currency:P})})},[r==null?void 0:r.ProductPrice]),D=u(e=>n(G,{productRouteSearch:s,productItem:e,productImage:R(e),productName:E(e),productPrice:A(e)}),[s,R,E,A]),$=p(()=>n(z,{variant:"tertiary",onClick:B,children:y.viewAllButton}),[y.viewAllButton,B]),q=p(()=>a==null?void 0:a.map(e=>D(e)),[a,D]);return!a.length||!l?null:n(F,{productList:q,viewAllButton:$,onClose:w})};export{re as SearchBarResults,re as default};
+import{jsx as n,jsxs as x}from"@dropins/tools/preact-jsx-runtime.js";import{useRef as K,useCallback as u,useEffect as j,useMemo as p,useState as S}from"@dropins/tools/preact-compat.js";import{Image as Q,Price as V,Button as z}from"@dropins/tools/components.js";import{VComponent as _,Slot as b}from"@dropins/tools/lib.js";import{events as k}from"@dropins/tools/event-bus.js";/* empty css                   */import{s as C,S as H}from"../chunks/acdlEvents.js";import{useText as M}from"@dropins/tools/i18n.js";const F=({productList:c,viewAllButton:s,onClose:i,...r})=>{const a=c&&c.length>0,d=K(null),t=u(l=>{d.current&&!d.current.contains(l.target)&&(i==null||i())},[i]),h=u(l=>{l.key==="Escape"&&(i==null||i())},[i]);return j(()=>{if(a)return document.addEventListener("mousedown",t),document.addEventListener("keydown",h),()=>{document.removeEventListener("mousedown",t),document.removeEventListener("keydown",h)}},[a,t,h]),a?n("div",{className:"product-discovery--search-bar-results",...r,children:n("div",{className:"product-discovery--search-bar-results__popover",ref:d,role:"region","aria-label":"Search results","aria-live":"polite",children:x("div",{className:"product-discovery--search-bar-results__outer-container",...r,children:[n("div",{className:"product-discovery--search-bar-results__grid",role:"list","aria-label":`${(c==null?void 0:c.length)||0} search results`,children:c==null?void 0:c.map((l,m)=>n("div",{role:"listitem",children:l},m))}),s&&n("div",{className:"product-discovery--search-bar-results__view-all-wrapper",children:n(_,{className:"product-discovery--search-bar-results__view-all-button",node:s})})]})})}):null},G=({productRouteSearch:c=t=>(t==null?void 0:t.url)||"",productItem:s,productImage:i,productName:r,productPrice:a,...d})=>{const t=p(()=>{const{name:l="",sku:m="",url:y=""}=s||{};return{tooltipText:[l,m&&`SKU: ${m}`].filter(Boolean).join(`
+`),url:y}},[s]),h=l=>{C(l.sku,H)};return x("a",{className:"product-discovery--product-item",href:c(s),rel:"noopener noreferrer",title:t.tooltipText,onClick:()=>h(s),...d,children:[n("div",{className:"product-discovery--product-item__image",children:n(_,{node:i})}),x("div",{className:"product-discovery--product-item__details",children:[n(_,{node:r}),n(_,{node:a})]})]})},re=({products:c=[],productRouteSearch:s=a=>(a==null?void 0:a.url)||"",routeSearch:i=()=>{},slots:r})=>{const[a,d]=S(c),[t,h]=S(""),[l,m]=S(c.length>0),y=M({viewAllButton:"Search.SearchInput.viewAllButton"}),w=u(({result:e=[],request:v={}})=>{const{phrase:o=""}=v;d(e),h(o),m(e.length>0&&o.length>0)},[]);j(()=>{const e=k.on("search-input/result",w);return()=>{e==null||e.off()}},[w]);const N=u(()=>{k.emit("search-input/result",{result:[],request:{phrase:""}}),m(!1)},[]),B=u(()=>{i&&i(t),k.emit("search/request",{phrase:t}),N()},[i,t,N]),R=u(e=>{var o,P,f,g;const v={loading:"lazy",src:((P=(o=e.images)==null?void 0:o[0])==null?void 0:P.url)||"",alt:((g=(f=e.images)==null?void 0:f[0])==null?void 0:g.label)||"",width:165,height:165,params:{width:165}};return n(b,{name:"ProductImage",slot:r==null?void 0:r.ProductImage,context:{productItem:e,defaultImageProps:v},children:n(Q,{...v,"aria-label":e.sku})})},[r==null?void 0:r.ProductImage]),E=u(e=>n(b,{name:"ProductName",slot:r==null?void 0:r.ProductName,context:{productItem:e},children:(e==null?void 0:e.name)||""}),[r==null?void 0:r.ProductName]),A=u(e=>{var f,g,T,O,U;const{value:v,currency:o="USD"}=((g=(f=e==null?void 0:e.price)==null?void 0:f.final)==null?void 0:g.amount)||((U=(O=(T=e==null?void 0:e.priceRange)==null?void 0:T.minimum)==null?void 0:O.final)==null?void 0:U.amount)||{},P=Intl.supportedValuesOf("currency").indexOf(o||"")===-1?"USD":o;return n(b,{name:"ProductPrice",slot:r==null?void 0:r.ProductPrice,context:{productItem:e},children:n(V,{amount:typeof v=="number"?v:void 0,currency:P})})},[r==null?void 0:r.ProductPrice]),D=u(e=>n(G,{productRouteSearch:s,productItem:e,productImage:R(e),productName:E(e),productPrice:A(e)}),[s,R,E,A]),$=p(()=>n(z,{variant:"tertiary",onClick:B,children:y.viewAllButton}),[y.viewAllButton,B]),q=p(()=>a==null?void 0:a.map(e=>D(e)),[a,D]);return!a.length||!l?null:n(F,{productList:q,viewAllButton:$,onClose:N})};export{re as SearchBarResults,re as default};
 //# sourceMappingURL=SearchBarResults.js.map

package/containers/SearchBarResults.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBarResults.js","sources":["/@dropins/storefront-product-discovery/src/components/SearchBarResults/SearchBarResults.tsx","/@dropins/storefront-product-discovery/src/components/ProductItem/ProductItem.tsx","/@dropins/storefront-product-discovery/src/containers/SearchBarResults/SearchBarResults.tsx"],"sourcesContent":["/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, useEffect, useRef, useCallback } from 'preact/compat';\nimport { VComponent } from '@adobe-commerce/elsie/lib';\n\nimport '@/plp/components/SearchBarResults/SearchBarResults.css';\n\nexport interface SearchBarResultsProps extends HTMLAttributes<HTMLDivElement> {\n  productList?: VNode[];\n  viewAllButton?: VNode;\n  onClose?: () => void;\n}\n\nexport const SearchBarResults: FunctionComponent<SearchBarResultsProps> = ({\n  productList,\n  viewAllButton,\n  onClose,\n  ...props\n}) => {\n  const hasData = productList && productList.length > 0;\n  const popoverRef = useRef<HTMLDivElement>(null);\n\n  const handleClickOutside = useCallback(\n    (event: MouseEvent) => {\n      if (popoverRef.current && !popoverRef.current.contains(event.target as Node)) {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  const handleEscapeKey = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  useEffect(() => {\n    if (!hasData) return;\n\n    document.addEventListener('mousedown', handleClickOutside);\n    document.addEventListener('keydown', handleEscapeKey);\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside);\n      document.removeEventListener('keydown', handleEscapeKey);\n    };\n  }, [hasData, handleClickOutside, handleEscapeKey]);\n\n  if (!hasData) return null;\n\n  return (\n    <div className=\"product-discovery--search-bar-results\" {...props}>\n      <div\n        className=\"product-discovery--search-bar-results__popover\"\n        ref={popoverRef}\n        role=\"region\"\n        aria-label=\"Search results\"\n        aria-live=\"polite\"\n      >\n        <div className=\"product-discovery--search-bar-results__outer-container\" {...props}>\n          <div\n            className=\"product-discovery--search-bar-results__grid\"\n            role=\"list\"\n            aria-label={`${productList?.length || 0} search results`}\n          >\n            {productList?.map((item, index) => (\n              <div key={index} role=\"listitem\">\n                {item}\n              </div>\n            ))}\n          </div>\n          {viewAllButton && (\n            <div className=\"product-discovery--search-bar-results__view-all-wrapper\">\n              <VComponent className=\"product-discovery--search-bar-results__view-all-button\" node={viewAllButton} />\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n ***************************************************************************/\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { AnchorHTMLAttributes, useMemo } from 'preact/compat';\nimport { VComponent } from '@adobe-commerce/elsie/lib';\nimport { Product } from '@/plp/data/models/product';\n\nimport '@/plp/components/ProductItem/ProductItem.css';\nimport { SEARCH_UNIT_ID, searchProductClick } from '@/plp/utils/acdlEvents';\n\nexport interface ProductItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  productRouteSearch?: (product: Product) => string;\n  productItem: Product;\n  productImage?: VNode;\n  productName?: VNode;\n  productPrice?: VNode;\n}\n\nexport const ProductItem: FunctionComponent<ProductItemProps> = ({\n  productRouteSearch = (product: Product) => product?.url || '',\n  productItem,\n  productImage,\n  productName,\n  productPrice,\n  ...props\n}) => {\n  const productData = useMemo(() => {\n    const { name = '', sku = '', url = '' } = productItem || {};\n\n    // create tooltip text depending on available data\n    const tooltipText = [name, sku && `SKU: ${sku}`].filter(Boolean).join('\\n');\n\n    return { tooltipText, url };\n  }, [productItem]);\n\n  const handleProductClick = (product: Product): void => {\n    searchProductClick(product.sku, SEARCH_UNIT_ID);\n  };\n\n  return (\n    <a\n      className=\"product-discovery--product-item\"\n      href={productRouteSearch(productItem)}\n      rel=\"noopener noreferrer\"\n      title={productData.tooltipText}\n      onClick={() => handleProductClick(productItem)}\n      {...props}\n    >\n      <div className=\"product-discovery--product-item__image\">\n        <VComponent node={productImage} />\n      </div>\n      <div className=\"product-discovery--product-item__details\">\n        <VComponent node={productName} />\n        <VComponent node={productPrice} />\n      </div>\n    </a>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { HTMLAttributes, useState, useEffect, useCallback, useMemo } from 'preact/compat';\nimport { Button, Image, ImageProps, Price } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\n\nimport { Product, SearchInputRequest, SearchInputResult } from '@/plp/data/models/product';\nimport { SearchVariables } from '@/plp/data/models/api';\nimport { SearchBarResults as SearchBarResultsComponent } from '@/plp/components/SearchBarResults';\nimport { ProductItem as ProductItemComponent } from '@/plp/components/ProductItem';\n\nexport interface SearchBarResultsProps extends HTMLAttributes<HTMLDivElement> {\n  products?: Product[];\n  productRouteSearch?: (product: Product) => string;\n  routeSearch?: (searchQuery: string) => void;\n  slots?: {\n    ProductImage?: SlotProps;\n    ProductName?: SlotProps;\n    ProductPrice?: SlotProps;\n  };\n}\n\nexport const SearchBarResults: Container<SearchBarResultsProps> = ({\n  products = [],\n  productRouteSearch = (product: Product) => product?.url || '',\n  routeSearch = () => {},\n  slots,\n}) => {\n  const [searchResults, setSearchResults] = useState<Product[]>(products);\n  const [searchQuery, setSearchQuery] = useState('');\n  const [showResults, setShowResults] = useState(products.length > 0);\n\n  const translations = useText({ viewAllButton: 'Search.SearchInput.viewAllButton' });\n\n  const handleSearchInputResult = useCallback(\n    ({ result = [], request = {} }: { result?: Product[]; request?: Pick<SearchVariables, 'phrase'> }) => {\n      const { phrase = '' } = request;\n      setSearchResults(result);\n      setSearchQuery(phrase);\n      setShowResults(result.length > 0 && phrase.length > 0);\n    },\n    [],\n  );\n\n  useEffect(() => {\n    const searchInputEvent = events.on('search-input/result', handleSearchInputResult);\n\n    return () => {\n      searchInputEvent?.off();\n    };\n  }, [handleSearchInputResult]);\n\n  const handleClose = useCallback(() => {\n    // emit \"search-input/result\" event with empty payloads to clear anything listening for that\n    events.emit('search-input/result', {\n      result: [],\n      request: { phrase: '' },\n    } as SearchInputResult);\n\n    setShowResults(false);\n  }, []);\n\n  const handleOnSearchAll = useCallback(() => {\n    // if a `routeSearch` cb function is provided, use it to handle any navigation needed\n    routeSearch && routeSearch(searchQuery);\n\n    // emit \"search/request\" event to trigger listeners of the search event\n    events.emit('search/request', { phrase: searchQuery } as SearchInputRequest);\n\n    handleClose();\n  }, [routeSearch, searchQuery, handleClose]);\n\n  const getProductImage = useCallback(\n    (productItem: Product) => {\n      const defaultImageProps: ImageProps = {\n        loading: 'lazy',\n        src: productItem.images?.[0]?.url || '',\n        alt: productItem.images?.[0]?.label || '',\n        width: '165',\n        height: '165',\n      };\n      return (\n        <Slot name=\"ProductImage\" slot={slots?.ProductImage} context={{ productItem, defaultImageProps }}>\n          <Image {...defaultImageProps} aria-label={productItem.sku} />\n        </Slot>\n      );\n    },\n    [slots?.ProductImage],\n  );\n\n  const getProductName = useCallback(\n    (productItem: Product) => (\n      <Slot name=\"ProductName\" slot={slots?.ProductName} context={{ productItem }}>\n        {productItem?.name || ''}\n      </Slot>\n    ),\n    [slots?.ProductName],\n  );\n\n  const getProductPrice = useCallback(\n    (productItem: Product) => {\n      const { value, currency: returnedCurrency = 'USD' } =\n        productItem?.price?.final?.amount || productItem?.priceRange?.minimum?.final?.amount || {};\n\n      // validate and fallback to USD if returnedCurrency is not supported\n      const currency =\n        Intl.supportedValuesOf('currency').indexOf(returnedCurrency || '') === -1 ? 'USD' : returnedCurrency;\n\n      return (\n        <Slot name=\"ProductPrice\" slot={slots?.ProductPrice} context={{ productItem }}>\n          <Price amount={typeof value === 'number' ? value : undefined} currency={currency} />\n        </Slot>\n      );\n    },\n    [slots?.ProductPrice],\n  );\n\n  const productContainer = useCallback(\n    (productItem: Product) => (\n      <ProductItemComponent\n        productRouteSearch={productRouteSearch}\n        productItem={productItem}\n        productImage={getProductImage(productItem)}\n        productName={getProductName(productItem)}\n        productPrice={getProductPrice(productItem)}\n      />\n    ),\n    [productRouteSearch, getProductImage, getProductName, getProductPrice],\n  );\n\n  const viewAllButton = useMemo(\n    () => (\n      <Button variant=\"tertiary\" onClick={handleOnSearchAll}>\n        {translations.viewAllButton}\n      </Button>\n    ),\n    [translations.viewAllButton, handleOnSearchAll],\n  );\n\n  const productList = useMemo(\n    () => searchResults?.map((product) => productContainer(product)),\n    [searchResults, productContainer],\n  );\n\n  if (!searchResults.length || !showResults) {\n    return null;\n  }\n\n  return <SearchBarResultsComponent productList={productList} viewAllButton={viewAllButton} onClose={handleClose} />;\n};\n"],"names":["SearchBarResults","productList","viewAllButton","onClose","props","hasData","popoverRef","useRef","handleClickOutside","useCallback","event","handleEscapeKey","useEffect","jsx","jsxs","item","index","VComponent","ProductItem","productRouteSearch","product","productItem","productImage","productName","productPrice","productData","useMemo","name","sku","url","handleProductClick","searchProductClick","SEARCH_UNIT_ID","products","routeSearch","slots","searchResults","setSearchResults","useState","searchQuery","setSearchQuery","showResults","setShowResults","translations","useText","handleSearchInputResult","result","request","phrase","searchInputEvent","events","handleClose","handleOnSearchAll","getProductImage","defaultImageProps","_b","_a","_d","_c","Slot","Image","getProductName","getProductPrice","value","returnedCurrency","_e","currency","Price","productContainer","ProductItemComponent","Button","SearchBarResultsComponent"],"mappings":"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"}
+{"version":3,"file":"SearchBarResults.js","sources":["/@dropins/storefront-product-discovery/src/components/SearchBarResults/SearchBarResults.tsx","/@dropins/storefront-product-discovery/src/components/ProductItem/ProductItem.tsx","/@dropins/storefront-product-discovery/src/containers/SearchBarResults/SearchBarResults.tsx"],"sourcesContent":["/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, useEffect, useRef, useCallback } from 'preact/compat';\nimport { VComponent } from '@adobe-commerce/elsie/lib';\n\nimport '@/plp/components/SearchBarResults/SearchBarResults.css';\n\nexport interface SearchBarResultsProps extends HTMLAttributes<HTMLDivElement> {\n  productList?: VNode[];\n  viewAllButton?: VNode;\n  onClose?: () => void;\n}\n\nexport const SearchBarResults: FunctionComponent<SearchBarResultsProps> = ({\n  productList,\n  viewAllButton,\n  onClose,\n  ...props\n}) => {\n  const hasData = productList && productList.length > 0;\n  const popoverRef = useRef<HTMLDivElement>(null);\n\n  const handleClickOutside = useCallback(\n    (event: MouseEvent) => {\n      if (popoverRef.current && !popoverRef.current.contains(event.target as Node)) {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  const handleEscapeKey = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  useEffect(() => {\n    if (!hasData) return;\n\n    document.addEventListener('mousedown', handleClickOutside);\n    document.addEventListener('keydown', handleEscapeKey);\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside);\n      document.removeEventListener('keydown', handleEscapeKey);\n    };\n  }, [hasData, handleClickOutside, handleEscapeKey]);\n\n  if (!hasData) return null;\n\n  return (\n    <div className=\"product-discovery--search-bar-results\" {...props}>\n      <div\n        className=\"product-discovery--search-bar-results__popover\"\n        ref={popoverRef}\n        role=\"region\"\n        aria-label=\"Search results\"\n        aria-live=\"polite\"\n      >\n        <div className=\"product-discovery--search-bar-results__outer-container\" {...props}>\n          <div\n            className=\"product-discovery--search-bar-results__grid\"\n            role=\"list\"\n            aria-label={`${productList?.length || 0} search results`}\n          >\n            {productList?.map((item, index) => (\n              <div key={index} role=\"listitem\">\n                {item}\n              </div>\n            ))}\n          </div>\n          {viewAllButton && (\n            <div className=\"product-discovery--search-bar-results__view-all-wrapper\">\n              <VComponent className=\"product-discovery--search-bar-results__view-all-button\" node={viewAllButton} />\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n ***************************************************************************/\n\nimport { FunctionComponent, VNode } from 'preact';\nimport { AnchorHTMLAttributes, useMemo } from 'preact/compat';\nimport { VComponent } from '@adobe-commerce/elsie/lib';\nimport { Product } from '@/plp/data/models/product';\n\nimport '@/plp/components/ProductItem/ProductItem.css';\nimport { SEARCH_UNIT_ID, searchProductClick } from '@/plp/utils/acdlEvents';\n\nexport interface ProductItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  productRouteSearch?: (product: Product) => string;\n  productItem: Product;\n  productImage?: VNode;\n  productName?: VNode;\n  productPrice?: VNode;\n}\n\nexport const ProductItem: FunctionComponent<ProductItemProps> = ({\n  productRouteSearch = (product: Product) => product?.url || '',\n  productItem,\n  productImage,\n  productName,\n  productPrice,\n  ...props\n}) => {\n  const productData = useMemo(() => {\n    const { name = '', sku = '', url = '' } = productItem || {};\n\n    // create tooltip text depending on available data\n    const tooltipText = [name, sku && `SKU: ${sku}`].filter(Boolean).join('\\n');\n\n    return { tooltipText, url };\n  }, [productItem]);\n\n  const handleProductClick = (product: Product): void => {\n    searchProductClick(product.sku, SEARCH_UNIT_ID);\n  };\n\n  return (\n    <a\n      className=\"product-discovery--product-item\"\n      href={productRouteSearch(productItem)}\n      rel=\"noopener noreferrer\"\n      title={productData.tooltipText}\n      onClick={() => handleProductClick(productItem)}\n      {...props}\n    >\n      <div className=\"product-discovery--product-item__image\">\n        <VComponent node={productImage} />\n      </div>\n      <div className=\"product-discovery--product-item__details\">\n        <VComponent node={productName} />\n        <VComponent node={productPrice} />\n      </div>\n    </a>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { HTMLAttributes, useState, useEffect, useCallback, useMemo } from 'preact/compat';\nimport { Button, Image, ImageProps, Price } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\n\nimport { Product, SearchInputRequest, SearchInputResult } from '@/plp/data/models/product';\nimport { SearchVariables } from '@/plp/data/models/api';\nimport { SearchBarResults as SearchBarResultsComponent } from '@/plp/components/SearchBarResults';\nimport { ProductItem as ProductItemComponent } from '@/plp/components/ProductItem';\n\nexport interface SearchBarResultsProps extends HTMLAttributes<HTMLDivElement> {\n  products?: Product[];\n  productRouteSearch?: (product: Product) => string;\n  routeSearch?: (searchQuery: string) => void;\n  slots?: {\n    ProductImage?: SlotProps;\n    ProductName?: SlotProps;\n    ProductPrice?: SlotProps;\n  };\n}\n\nexport const SearchBarResults: Container<SearchBarResultsProps> = ({\n  products = [],\n  productRouteSearch = (product: Product) => product?.url || '',\n  routeSearch = () => {},\n  slots,\n}) => {\n  const [searchResults, setSearchResults] = useState<Product[]>(products);\n  const [searchQuery, setSearchQuery] = useState('');\n  const [showResults, setShowResults] = useState(products.length > 0);\n\n  const translations = useText({ viewAllButton: 'Search.SearchInput.viewAllButton' });\n\n  const handleSearchInputResult = useCallback(\n    ({ result = [], request = {} }: { result?: Product[]; request?: Pick<SearchVariables, 'phrase'> }) => {\n      const { phrase = '' } = request;\n      setSearchResults(result);\n      setSearchQuery(phrase);\n      setShowResults(result.length > 0 && phrase.length > 0);\n    },\n    [],\n  );\n\n  useEffect(() => {\n    const searchInputEvent = events.on('search-input/result', handleSearchInputResult);\n\n    return () => {\n      searchInputEvent?.off();\n    };\n  }, [handleSearchInputResult]);\n\n  const handleClose = useCallback(() => {\n    // emit \"search-input/result\" event with empty payloads to clear anything listening for that\n    events.emit('search-input/result', {\n      result: [],\n      request: { phrase: '' },\n    } as SearchInputResult);\n\n    setShowResults(false);\n  }, []);\n\n  const handleOnSearchAll = useCallback(() => {\n    // if a `routeSearch` cb function is provided, use it to handle any navigation needed\n    routeSearch && routeSearch(searchQuery);\n\n    // emit \"search/request\" event to trigger listeners of the search event\n    events.emit('search/request', { phrase: searchQuery } as SearchInputRequest);\n\n    handleClose();\n  }, [routeSearch, searchQuery, handleClose]);\n\n  const getProductImage = useCallback(\n    (productItem: Product) => {\n      const defaultImageProps: ImageProps = {\n        loading: 'lazy',\n        src: productItem.images?.[0]?.url || '',\n        alt: productItem.images?.[0]?.label || '',\n        width: 165,\n        height: 165,\n        params: { width: 165 },\n      };\n      return (\n        <Slot name=\"ProductImage\" slot={slots?.ProductImage} context={{ productItem, defaultImageProps }}>\n          <Image {...defaultImageProps} aria-label={productItem.sku} />\n        </Slot>\n      );\n    },\n    [slots?.ProductImage],\n  );\n\n  const getProductName = useCallback(\n    (productItem: Product) => (\n      <Slot name=\"ProductName\" slot={slots?.ProductName} context={{ productItem }}>\n        {productItem?.name || ''}\n      </Slot>\n    ),\n    [slots?.ProductName],\n  );\n\n  const getProductPrice = useCallback(\n    (productItem: Product) => {\n      const { value, currency: returnedCurrency = 'USD' } =\n        productItem?.price?.final?.amount || productItem?.priceRange?.minimum?.final?.amount || {};\n\n      // validate and fallback to USD if returnedCurrency is not supported\n      const currency =\n        Intl.supportedValuesOf('currency').indexOf(returnedCurrency || '') === -1 ? 'USD' : returnedCurrency;\n\n      return (\n        <Slot name=\"ProductPrice\" slot={slots?.ProductPrice} context={{ productItem }}>\n          <Price amount={typeof value === 'number' ? value : undefined} currency={currency} />\n        </Slot>\n      );\n    },\n    [slots?.ProductPrice],\n  );\n\n  const productContainer = useCallback(\n    (productItem: Product) => (\n      <ProductItemComponent\n        productRouteSearch={productRouteSearch}\n        productItem={productItem}\n        productImage={getProductImage(productItem)}\n        productName={getProductName(productItem)}\n        productPrice={getProductPrice(productItem)}\n      />\n    ),\n    [productRouteSearch, getProductImage, getProductName, getProductPrice],\n  );\n\n  const viewAllButton = useMemo(\n    () => (\n      <Button variant=\"tertiary\" onClick={handleOnSearchAll}>\n        {translations.viewAllButton}\n      </Button>\n    ),\n    [translations.viewAllButton, handleOnSearchAll],\n  );\n\n  const productList = useMemo(\n    () => searchResults?.map((product) => productContainer(product)),\n    [searchResults, productContainer],\n  );\n\n  if (!searchResults.length || !showResults) {\n    return null;\n  }\n\n  return <SearchBarResultsComponent productList={productList} viewAllButton={viewAllButton} onClose={handleClose} />;\n};\n"],"names":["SearchBarResults","productList","viewAllButton","onClose","props","hasData","popoverRef","useRef","handleClickOutside","useCallback","event","handleEscapeKey","useEffect","jsx","jsxs","item","index","VComponent","ProductItem","productRouteSearch","product","productItem","productImage","productName","productPrice","productData","useMemo","name","sku","url","handleProductClick","searchProductClick","SEARCH_UNIT_ID","products","routeSearch","slots","searchResults","setSearchResults","useState","searchQuery","setSearchQuery","showResults","setShowResults","translations","useText","handleSearchInputResult","result","request","phrase","searchInputEvent","events","handleClose","handleOnSearchAll","getProductImage","defaultImageProps","_b","_a","_d","_c","Slot","Image","getProductName","getProductPrice","value","returnedCurrency","_e","currency","Price","productContainer","ProductItemComponent","Button","SearchBarResultsComponent"],"mappings":"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"}

package/fragments.d.ts

@@ -0,0 +1 @@
+export * from './api/fragments'

package/fragments.js

@@ -0,0 +1,112 @@
+/*! Copyright 2025 Adobe
+All Rights Reserved. */
+const e=`
+  fragment Facet on Aggregation {
+    title
+    attribute
+    buckets {
+      title
+      __typename
+      ... on CategoryView {
+        name
+        count
+        path
+      }
+      ... on ScalarBucket {
+        count
+      }
+      ... on RangeBucket {
+        from
+        to
+        count
+      }
+      ... on StatsBucket {
+        min
+        max
+      }
+    }
+  }
+`,t=`
+  fragment ProductView on ProductSearchItem {
+    productView {
+      __typename
+      sku
+      name
+      inStock
+      url
+      urlKey
+      images {
+        label
+        url
+        roles
+      }
+      ... on ComplexProductView {
+        priceRange {
+          maximum {
+            final {
+              amount {
+                value
+                currency
+              }
+            }
+            regular {
+              amount {
+                value
+                currency
+              }
+            }
+          }
+          minimum {
+            final {
+              amount {
+                value
+                currency
+              }
+            }
+            regular {
+              amount {
+                value
+                currency
+              }
+            }
+          }
+        }
+        options {
+          id
+          title
+          values {
+            title
+            ... on ProductViewOptionValueSwatch {
+              id
+              inStock
+              type
+              value
+            }
+          }
+        }
+      }
+      ... on SimpleProductView {
+        price {
+          final {
+            amount {
+              value
+              currency
+            }
+          }
+          regular {
+            amount {
+              value
+              currency
+            }
+          }
+        }
+      }
+    }
+    highlights {
+      attribute
+      value
+      matched_words
+    }
+  }
+`;export{e as Facet,t as ProductView};
+//# sourceMappingURL=fragments.js.map

package/fragments.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fragments.js","sources":["/@dropins/storefront-product-discovery/src/api/graphql/fragments.graphql.ts"],"sourcesContent":["/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nconst Facet = /* GraphQL */ `\n  fragment Facet on Aggregation {\n    title\n    attribute\n    buckets {\n      title\n      __typename\n      ... on CategoryView {\n        name\n        count\n        path\n      }\n      ... on ScalarBucket {\n        count\n      }\n      ... on RangeBucket {\n        from\n        to\n        count\n      }\n      ... on StatsBucket {\n        min\n        max\n      }\n    }\n  }\n`;\n\nconst ProductView = /* GraphQL */ `\n  fragment ProductView on ProductSearchItem {\n    productView {\n      __typename\n      sku\n      name\n      inStock\n      url\n      urlKey\n      images {\n        label\n        url\n        roles\n      }\n      ... on ComplexProductView {\n        priceRange {\n          maximum {\n            final {\n              amount {\n                value\n                currency\n              }\n            }\n            regular {\n              amount {\n                value\n                currency\n              }\n            }\n          }\n          minimum {\n            final {\n              amount {\n                value\n                currency\n              }\n            }\n            regular {\n              amount {\n                value\n                currency\n              }\n            }\n          }\n        }\n        options {\n          id\n          title\n          values {\n            title\n            ... on ProductViewOptionValueSwatch {\n              id\n              inStock\n              type\n              value\n            }\n          }\n        }\n      }\n      ... on SimpleProductView {\n        price {\n          final {\n            amount {\n              value\n              currency\n            }\n          }\n          regular {\n            amount {\n              value\n              currency\n            }\n          }\n        }\n      }\n    }\n    highlights {\n      attribute\n      value\n      matched_words\n    }\n  }\n`;\n\nexport { Facet, ProductView };\n"],"names":["Facet","ProductView"],"mappings":"AASA,MAAMA,EAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA4BtBC,EAA4B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/package.json

@@ -1 +1 @@
-{"name": "@dropins/storefront-product-discovery", "version": "1.0.2", "@dropins/tools": "^1.3.0", "license": "SEE LICENSE IN LICENSE.md"}
+{"name": "@dropins/storefront-product-discovery", "version": "1.1.0-alpha1", "@dropins/tools": "^1.4.0-beta3", "license": "SEE LICENSE IN LICENSE.md"}

package/render.js

@@ -1,9 +1,9 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-(function(o,t){try{if(typeof document<"u"){const r=document.createElement("style"),d=t.styleId;for(const e in t.attributes)r.setAttribute(e,t.attributes[e]);r.setAttribute("data-dropin",d),r.appendChild(document.createTextNode(o));const i=document.querySelector('style[data-dropin="sdk"]');if(i)i.after(r);else{const e=document.querySelector('link[rel="stylesheet"], style');e?e.before(r):document.head.append(r)}}}catch(r){console.error("dropin-styles (injectCodeFunction)",r)}})(`.dropin-product-item-card__skeleton{gap:var(--spacing-small)}.dropin-product-item-card__skeleton__image{height:375px}.dropin-product-item-card__skeleton__content{grid-column:1/-1}.dropin-product-item-card{display:grid;position:relative;grid-auto-flow:row;background:var(--color-neutral-50);border:1px solid var(--color-neutral-400);color:var(--color-neutral-800);font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing);margin:var(--spacing-small);width:300px}.dropin-product-item-card__image-container{overflow:hidden;width:100%;height:auto}.dropin-product-item-card__image img{width:100%;max-height:375px}.dropin-product-item-card__content{display:grid;grid-template-columns:1fr 1fr;padding:var(--spacing-small);gap:var(--spacing-xxsmall);align-items:center;color:var(--color-neutral-800)}.dropin-product-item-card__title,.dropin-product-item-card__sku,.dropin-product-item-card__price,.dropin-product-item-card__swatches,.dropin-product-item-card__action{grid-column:1/3}.dropin-product-item-card__title{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-1-strong-letter-spacing)}.dropin-product-item-card__sku,.dropin-product-item-card__price{font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.dropin-product-item-card__swatches{margin-top:var(--spacing-xsmall)}.dropin-product-item-card__action{margin-top:var(--spacing-xsmall);width:100%}
-.product-discovery-product-list,.product-discovery-product-list__container{display:flex;flex-direction:column;width:100%}.product-discovery-product-list__grid{display:grid;grid-template-columns:1fr 1fr;margin-top:var(--spacing-small)}.product-discovery-product-list__grid .dropin-product-item-card{text-align:left;border:1px solid transparent;width:200px}.product-discovery-product-list__grid .dropin-product-item-card:hover{border:1px solid var(--color-neutral-400);box-shadow:0 0 var(--spacing-xsmall) 0 #a9a9a9;padding:none}.product-discovery-product-list__grid .dropin-product-item-card a:hover{text-decoration:none;color:var(--color-neutral-800)}.product-discovery-product-list__header{display:flex;flex-direction:row-reverse;width:100%}.product-discovery-product-list__picker{width:15.625rem;display:inline-block}.product-discovery-product-item__image{min-height:250px}@media only screen and (min-width: 768px){.product-discovery-product-list__grid{grid-template-columns:repeat(3,1fr)}}@media only screen and (min-width: 1366px){.product-discovery-product-list__grid{grid-template-columns:repeat(4,1fr)}}.product-discovery-search-alert-message__wrapper{display:flex;flex-direction:column;justify-content:center;width:100%;min-height:300px}.product-discovery-search-alert-message__content{display:flex;justify-content:center}.product-discovery-facet__bucket .dropin-price-range .dropin-price--small.dropin-price--bold{font:var(--type-body-2-default-font)}.product-discovery-facet__bucket .dropin-radio-button__label:before{margin-right:var(--spacing-xsmall)}.product-discovery-facet-list{display:flex;flex-direction:column;width:100%}.product-discovery-facet-list__selected-filters{display:flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--spacing-xxsmall);padding:0 0 var(--spacing-xxsmall) 0}.product-discovery-facet-list__selected-filters button{padding:0 var(--spacing-xxsmall);margin:0 var(--spacing-xxsmall);border-radius:var(--shape-border-radius-2)}.product-discovery-facet-list__selected-filters .dropin-price-range .dropin-price--small.dropin-price--bold{font:var(--type-button-2-font)}.product-discovery-facet-list__facet-options{text-align:left}.product-discovery-facet-list__facet-options button{padding:0}.product-discovery-facet-list__facet-options .dropin-radio-button{padding:var(--spacing-xxsmall) 0}.product-discovery-facet-list__facet-options--hidden{display:none}.product-discovery-facet-list__show-filters-button{display:flex;margin:0 0 var(--spacing-xsmall) 0}.product-discovery-facet-list .dropin-divider{margin:var(--spacing-xsmall) 0 var(--spacing-xsmall) 0}@media only screen and (min-width: 768px){.product-discovery-facet-list{min-width:13.12rem}.product-discovery-facet-list__facet-options{display:flex;flex-direction:column}.product-discovery-facet-list__show-filters-button{display:none}}
+(function(o,t){try{if(typeof document<"u"){const r=document.createElement("style"),d=t.styleId;for(const e in t.attributes)r.setAttribute(e,t.attributes[e]);r.setAttribute("data-dropin",d),r.appendChild(document.createTextNode(o));const i=document.querySelector('style[data-dropin="sdk"]');if(i)i.after(r);else{const e=document.querySelector('link[rel="stylesheet"], style');e?e.before(r):document.head.append(r)}}}catch(r){console.error("dropin-styles (injectCodeFunction)",r)}})(`.product-discovery--search-bar-input__container{display:flex;align-items:center;width:100%}.product-discovery--search-bar-input__form{display:flex;align-items:center}
+.product-discovery-results-info{display:none}.product-discovery-results-info__search-phrase--upercase{text-transform:capitalize}@media only screen and (min-width: 768px){.product-discovery-results-info{display:flex;flex-direction:row;gap:var(--spacing-xsmall);width:100%;padding:var(--spacing-xsmall);text-align:center}}
 .product-discovery--search-bar-results{position:absolute;top:100%;left:0;right:0;z-index:1000;display:flex;align-items:flex-start;justify-content:flex-end;pointer-events:none}.product-discovery--search-bar-results__popover{position:relative;background:var(--color-neutral-50, #fff);box-shadow:0 10px 25px -3px #0000001a,0 4px 6px -2px #0000000d,0 0 0 1px #0000000d;width:100%;overflow:hidden;z-index:1001;animation:popoverSlideIn .2s ease-out;pointer-events:auto;display:flex;flex-direction:column;height:100%;min-height:0}.product-discovery--search-bar-results__outer-container{display:flex;flex-direction:column;padding:var(--spacing-small, 1rem)}@keyframes popoverSlideIn{0%{opacity:0;transform:translateY(-10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.product-discovery--search-bar-results__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-small, 1rem);overflow-y:auto;flex:1;min-height:0}.product-discovery--search-bar-results__grid>*{min-width:0;overflow:hidden}.product-discovery--search-bar-results__view-all-wrapper{flex-shrink:0;border-top:1px solid var(--color-neutral-200, #e5e5e5);background:var(--color-neutral-300)}.product-discovery--search-bar-results__view-all-button{display:flex;justify-content:center;width:100%}.product-discovery--search-bar-results__grid::-webkit-scrollbar{width:.5rem}.product-discovery--search-bar-results__grid::-webkit-scrollbar-track{background:var(--color-neutral-100, #f5f5f5);border-radius:.25rem}.product-discovery--search-bar-results__grid::-webkit-scrollbar-thumb{background:var(--color-neutral-400, #d4d4d4);border-radius:.25rem}.product-discovery--search-bar-results__grid::-webkit-scrollbar-thumb:hover{background:var(--color-neutral-500, #a3a3a3)}@media only screen and (min-width: 48rem){.product-discovery--search-bar-results{padding-top:.25rem}.product-discovery--search-bar-results__grid{gap:var(--spacing-medium, 1.5rem);padding:var(--spacing-medium, 1.5rem)}}.product-discovery--product-item{display:flex;flex-flow:column nowrap;gap:var(--spacing-small);width:auto;align-items:center;cursor:pointer;text-decoration:none;color:inherit;font-weight:var(--font-weight-regular, 600)}.product-discovery--product-item:hover,.product-discovery--product-item:focus{box-shadow:0 2px 8px #0000001a;text-decoration:none}.product-discovery--product-item__image .dropin-image{width:10rem;height:10rem;max-width:10rem;max-height:10rem;object-fit:cover;border-radius:var(--shape-border-radius-2, 4px)}.product-discovery--product-item__details{display:flex;flex-flow:column nowrap;justify-content:space-between;width:100%}.product-discovery--product-item__details [data-slot=ProductPrice]{text-align:start}
-.product-discovery--search-bar-input__container{display:flex;align-items:center;width:100%}.product-discovery--search-bar-input__form{display:flex;align-items:center}
-.product-discovery-results-info{display:none}.product-discovery-results-info__search-phrase--upercase{text-transform:capitalize}@media only screen and (min-width: 768px){.product-discovery-results-info{display:flex;flex-direction:row;gap:var(--spacing-xsmall);width:100%;padding:var(--spacing-xsmall);text-align:center}}`,{styleId:"storefront-product-discovery"});
+.product-discovery-product-list,.product-discovery-product-list__container{display:flex;flex-direction:column;width:100%}.product-discovery-product-list__grid{display:grid;grid-template-columns:1fr 1fr;margin-top:var(--spacing-small)}.product-discovery-product-list__grid .dropin-product-item-card{text-align:left;border:1px solid transparent;width:200px}.product-discovery-product-list__grid .dropin-product-item-card:hover{border:1px solid var(--color-neutral-400);box-shadow:0 0 var(--spacing-xsmall) 0 #a9a9a9;padding:none}.product-discovery-product-list__grid .dropin-product-item-card a:hover{text-decoration:none;color:var(--color-neutral-800)}.product-discovery-product-list__header{display:flex;flex-direction:row-reverse;width:100%}.product-discovery-product-list__picker{width:15.625rem;display:inline-block}.product-discovery-product-item__image{min-height:250px}@media only screen and (min-width: 768px){.product-discovery-product-list__grid{grid-template-columns:repeat(3,1fr)}}@media only screen and (min-width: 1366px){.product-discovery-product-list__grid{grid-template-columns:repeat(4,1fr)}}.product-discovery-search-alert-message__wrapper{display:flex;flex-direction:column;justify-content:center;width:100%;min-height:300px}.product-discovery-search-alert-message__content{display:flex;justify-content:center}.product-discovery-facet__bucket .dropin-price-range .dropin-price--small.dropin-price--bold{font:var(--type-body-2-default-font)}.product-discovery-facet__bucket .dropin-radio-button__label:before{margin-right:var(--spacing-xsmall)}.product-discovery-facet-list{display:flex;flex-direction:column;width:100%}.product-discovery-facet-list__selected-filters{display:flex;flex-direction:row;flex-wrap:wrap;row-gap:var(--spacing-xxsmall);padding:0 0 var(--spacing-xxsmall) 0}.product-discovery-facet-list__selected-filters button{padding:0 var(--spacing-xxsmall);margin:0 var(--spacing-xxsmall);border-radius:var(--shape-border-radius-2)}.product-discovery-facet-list__selected-filters .dropin-price-range .dropin-price--small.dropin-price--bold{font:var(--type-button-2-font)}.product-discovery-facet-list__facet-options{text-align:left}.product-discovery-facet-list__facet-options button{padding:0}.product-discovery-facet-list__facet-options .dropin-radio-button{padding:var(--spacing-xxsmall) 0}.product-discovery-facet-list__facet-options--hidden{display:none}.product-discovery-facet-list__show-filters-button{display:flex;margin:0 0 var(--spacing-xsmall) 0}.product-discovery-facet-list .dropin-divider{margin:var(--spacing-xsmall) 0 var(--spacing-xsmall) 0}@media only screen and (min-width: 768px){.product-discovery-facet-list{min-width:13.12rem}.product-discovery-facet-list__facet-options{display:flex;flex-direction:column}.product-discovery-facet-list__show-filters-button{display:none}}
+.dropin-product-item-card__skeleton{gap:var(--spacing-small)}.dropin-product-item-card__skeleton__image{height:375px}.dropin-product-item-card__skeleton__content{grid-column:1/-1}.dropin-product-item-card{display:grid;position:relative;grid-auto-flow:row;background:var(--color-neutral-50);border:1px solid var(--color-neutral-400);color:var(--color-neutral-800);font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing);margin:var(--spacing-small);width:300px}.dropin-product-item-card__image-container{overflow:hidden;width:100%;height:auto}.dropin-product-item-card__image img{width:100%;max-height:375px}.dropin-product-item-card__content{display:grid;grid-template-columns:1fr 1fr;padding:var(--spacing-small);gap:var(--spacing-xxsmall);align-items:center;color:var(--color-neutral-800)}.dropin-product-item-card__title,.dropin-product-item-card__sku,.dropin-product-item-card__price,.dropin-product-item-card__swatches,.dropin-product-item-card__action{grid-column:1/3}.dropin-product-item-card__title{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-1-strong-letter-spacing)}.dropin-product-item-card__sku,.dropin-product-item-card__price{font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.dropin-product-item-card__swatches{margin-top:var(--spacing-xsmall)}.dropin-product-item-card__action{margin-top:var(--spacing-xsmall);width:100%}`,{styleId:"storefront-product-discovery"});
 import{jsx as o}from"@dropins/tools/preact-jsx-runtime.js";import{Render as c}from"@dropins/tools/lib.js";import{useState as i,useEffect as a}from"@dropins/tools/preact-hooks.js";import{UIProvider as l}from"@dropins/tools/components.js";import{events as u}from"@dropins/tools/event-bus.js";const h={PLP:{Warning:{minQueryLength:"Your search term {SEARCH_PHRASE} has not reached the minimum of {{minQueryLength}} characters.",noResults:"Your search returned no results.",searchError:"An error occurred while searching."},SortDropdown:{title:"Sort by",option:"Sort by: {{selectedOption}}",relevanceLabel:"Most Relevant",positionLabel:"Position",sortAttributeASC:"{{label}}: Low to High",sortAttributeDESC:"{{label}}: High to Low",sortASC:"Price: Low to High",sortDESC:"Price: High to Low",productName:"Product Name",productInStock:"In Stock",productLowStock:"Low Stock"}},Facet:{showMore:"Show more",showLess:"Show less",clearAll:"Clear all"},ResultsInfo:{resultsFor:"Results for",products:"products"},SearchInput:{placeholder:"Search",viewAllButton:"View All"}},S={Search:h},m={default:S},d=({children:r})=>{const[t,n]=i("en_US");return a(()=>{const e=u.on("locale",s=>{n(s)},{eager:!0});return()=>{e==null||e.off()}},[]),o(l,{lang:t,langDefinitions:m,children:r})},A=new c(o(d,{}));export{A as render};
 //# sourceMappingURL=render.js.map

package/render.js.map

@@ -1 +1 @@
-{"version":3,"file":"render.js","sources":["/@dropins/storefront-product-discovery/src/render/Provider.tsx","/@dropins/storefront-product-discovery/src/render/render.tsx"],"sourcesContent":["/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { FunctionComponent } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { UIProvider } from '@adobe-commerce/elsie/components';\nimport { Lang } from '@adobe-commerce/elsie/i18n';\nimport { events } from '@adobe-commerce/event-bus';\n\nimport en_US from '../i18n/en_US.json';\n\n// Langs\nconst langDefinitions = {\n  default: en_US,\n};\n\ninterface CartProviderProps {\n  children?: any;\n}\n\nexport const Provider: FunctionComponent<CartProviderProps> = ({ children }) => {\n  const [lang, setLang] = useState<Lang>('en_US');\n\n  //   Events\n  useEffect(() => {\n    const localeEvent = events.on(\n      'locale',\n      (locale: string) => {\n        setLang(locale as Lang);\n      },\n      { eager: true },\n    );\n    return () => {\n      localeEvent?.off();\n    };\n  }, []);\n\n  return (\n    <UIProvider lang={lang} langDefinitions={langDefinitions}>\n      {children}\n    </UIProvider>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { Render } from '@adobe-commerce/elsie/lib';\nimport { Provider } from './Provider';\n\nexport const render = new Render(<Provider />);\n"],"names":["langDefinitions","en_US","Provider","children","lang","setLang","useState","useEffect","localeEvent","events","locale","jsx","UIProvider","render","Render"],"mappings":"kjCAkBMA,EAAkB,CACtB,QAASC,CACX,EAMaC,EAAiD,CAAC,CAAE,SAAAC,KAAe,CAC9E,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAe,OAAO,EAG9C,OAAAC,EAAU,IAAM,CACd,MAAMC,EAAcC,EAAO,GACzB,SACCC,GAAmB,CAClBL,EAAQK,CAAc,CAAA,EAExB,CAAE,MAAO,EAAA,CAAK,EAEhB,MAAO,IAAM,CACXF,GAAA,MAAAA,EAAa,KAAI,CACnB,EACC,EAAE,EAGHG,EAACC,EAAA,CAAW,KAAAR,EAAY,gBAAAJ,EACrB,SAAAG,CAAA,CACH,CAEJ,ECpCaU,EAAS,IAAIC,EAAOH,EAACT,IAAS,CAAE"}
+{"version":3,"file":"render.js","sources":["/@dropins/storefront-product-discovery/src/render/Provider.tsx","/@dropins/storefront-product-discovery/src/render/render.tsx"],"sourcesContent":["/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { FunctionComponent } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { UIProvider } from '@adobe-commerce/elsie/components';\nimport { Lang } from '@adobe-commerce/elsie/i18n';\nimport { events } from '@adobe-commerce/event-bus';\n\nimport en_US from '../i18n/en_US.json';\n\n// Langs\nconst langDefinitions = {\n  default: en_US,\n};\n\ninterface CartProviderProps {\n  children?: any;\n}\n\nexport const Provider: FunctionComponent<CartProviderProps> = ({ children }) => {\n  const [lang, setLang] = useState<Lang>('en_US');\n\n  //   Events\n  useEffect(() => {\n    const localeEvent = events.on(\n      'locale',\n      (locale: string) => {\n        setLang(locale as Lang);\n      },\n      { eager: true },\n    );\n    return () => {\n      localeEvent?.off();\n    };\n  }, []);\n\n  return (\n    <UIProvider lang={lang} langDefinitions={langDefinitions}>\n      {children}\n    </UIProvider>\n  );\n};\n","/********************************************************************\n *  Copyright 2025 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  Adobe permits you to use, modify, and distribute this\n * file in accordance with the terms of the Adobe license agreement\n * accompanying it.\n *******************************************************************/\n\nimport { Render } from '@adobe-commerce/elsie/lib';\nimport { Provider } from './Provider';\n\nexport const render = new Render(<Provider />);\n"],"names":["langDefinitions","en_US","Provider","children","lang","setLang","useState","useEffect","localeEvent","events","locale","jsx","UIProvider","render","Render"],"mappings":"kjCAkBMA,EAAkB,CACtB,QAASC,CACX,EAMaC,EAAiD,CAAC,CAAE,SAAAC,KAAe,CAC9E,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAe,OAAO,EAG9C,OAAAC,EAAU,IAAM,CACd,MAAMC,EAAcC,EAAO,GACzB,SACCC,GAAmB,CAClBL,EAAQK,CAAc,CACxB,EACA,CAAE,MAAO,EAAA,CAAK,EAEhB,MAAO,IAAM,CACXF,GAAA,MAAAA,EAAa,KACf,CACF,EAAG,CAAA,CAAE,EAGHG,EAACC,EAAA,CAAW,KAAAR,EAAY,gBAAAJ,EACrB,SAAAG,CAAA,CACH,CAEJ,ECpCaU,EAAS,IAAIC,EAAOH,EAACT,IAAS,CAAE"}