@constructor-io/constructorio-ui-autocomplete 1.1.8 → 1.1.9

package/lib/mjs/constants.js

@@ -0,0 +1,176 @@
+// Autocomplete key index
+export const apiKey = 'key_Gep3oQOu5IMcNh9A';
+/// //////////////////////////////
+// Storybook Folder Descriptions
+/// //////////////////////////////
+export const componentDescription = `- import \`CioAutocomplete\` to render in your JSX.
+- This component handles state management, data fetching, and rendering logic.
+- To use this component, an \`apiKey\` or \`cioJsClient\` are required, all other values are optional.
+- Use different props to configure the behavior of this component.
+- The following stories shows how different props affect the component's behavior
+
+> Note: when we say \`cioJsClient\`, we are referring to an instance of the [constructorio-client-javascript](https://www.npmjs.com/package/@constructor-io/constructorio-client-javascript)
+`;
+export const hookDescription = `- import \`useCioAutocomplete\` and call this custom hook in a functional component.
+- This hook handles state management & data fetching, but leaves rendering logic up to you
+- To use this hook, an \`apiKey\` or \`cioJsClient\` are required, all other values are optional.
+- Pass different options to the \`useCioAutocomplete\` hook to configure behavior.
+- The following stories shows how different options affect the hook's behavior
+
+Calling the \`useCioAutocomplete\` hook returns an object with the following keys:
+
+\`\`\`jsx
+const {
+  // must be used for a hooks integrations
+  query: string, // current input field value
+  sections: [{...}], // array of sections data to render in menu list,
+  getFormProps: () => ({...})), // prop getter for jsx form element
+  getLabelProps: () => ({...})), // optional: prop getter for jsx label element
+  getInputProps: () => ({...})), // prop getter for jsx input element
+  getMenuProps: () => ({...})), // prop getter for jsx element serving as menu container
+  getItemProps: () => ({...})), // prop getter for jsx element serving as each result
+  isOpen: boolean,
+
+  // available for advanced hooks integration use cases
+  openMenu: () => void, // open menu
+  closeMenu: () => void, // close menu
+  setQuery: () => void, // update the current input field value
+  cioJsClient, // instance of constructorio-client-javascript
+ } = useCioAutocomplete(args);
+\`\`\`
+
+> Note: when we say \`cioJsClient\`, we are referring to an instance of the [constructorio-client-javascript](https://www.npmjs.com/package/@constructor-io/constructorio-client-javascript)
+`;
+/// //////////////////////////////
+// Storybook Pages
+/// //////////////////////////////
+export const sectionsDescription = `- by default, typing a query will fetch data for search suggestions and Products
+- to override this, pass a an array of sections objects
+- the order of the objects in the \`sections\` array determines the order of the results
+- each section object must have an \`identifier\`
+- each section object can specify a \`type\`
+- each section object can override the default \`numResults\` of 8
+
+When no values are passed for the \`sections\` argument, the following defaults are used:
+
+\`\`\`jsx
+[
+  {
+    identifier: 'Search Suggestions',
+    type: 'autocomplete',
+    numResults: 8
+  },
+  {
+    identifier: 'Products',
+    type: 'autocomplete',
+    numResults: 8
+  }
+]
+\`\`\`
+`;
+export const userEventsDescription = `- pass callback functions to respond to user events
+- if provided, the onFocus callback function will be called each time the user focuses on the text input field
+- if provided, the onChange callback function will be called each time the user changes the value in the text input field
+- if provided, the onSubmit callback function will be called each time the user submits the form
+- the user can submit the form by pressing the enter key in the text input field, clicking a submit button within the form, clicking on a result, or pressing enter while a result is selected
+
+> ⚠️ NOTE ⚠️ Use the Storybook Canvas Actions tab to explore the behavior of all of these \`OnEvent\` callback functions as you interact with our Default User Events example rendered in the Canvas. In the stories below, Storybook Canvas Actions have been disabled to focus on each of these callback functions in isolation. Each of the example callback functions in the stories below log output to the console tab of the browser's developer tools.`;
+export const zeroStateDescription = `- when the text input field has no text, we call this zero state
+- by default, the autocomplete shows nothing in the menu it's for zero state
+- to show zero state results, pass an array of section objects for \`zeroStateSections\`
+- when \`zeroStateSections\` has sections, the menu will open on user focus by default
+- set \`openOnFocus\` to false, to only show \`zeroStateSections\` after user has typed and then cleared the text input, instead of as soon as the user focuses on the text input
+- the order of the objects in the \`zeroStateSections\` array determines the order of the results
+- each section object must have an \`identifier\`
+- each section object can specify a \`type\`
+- each section object can override the default \`numResults\` of 8`;
+/// //////////////////////////////
+// Storybook Stories
+/// //////////////////////////////
+export const apiKeyDescription = `Pass an \`apiKey\` to request results from constructor's servers`;
+export const cioJsClientDescription = `If you are already using an instance of the \`ConstructorIOClient\`, you can pass a \`cioJsClient\` instead of an \`apiKey\` to request results from constructor's servers
+
+> Note: when we say \`cioJsClient\`, we are referring to an instance of the [constructorio-client-javascript](https://www.npmjs.com/package/@constructor-io/constructorio-client-javascript)`;
+export const placeholderDescription = `Pass a \`placeholder\` to override the default input field placeholder text shown to users before they start typing their query`;
+export const searchSuggestionsDescription = `Override default \`sections\` to only suggest search terms`;
+export const productsDescription = `Override default \`sections\` to only suggested products`;
+export const contentDescription = `Override default \`sections\` to only suggest content`;
+export const numResultsDescription = `Override default \`numResults\` to only suggest 2 products per query`;
+export const sectionOrderDescription = `Override default \`numResults\` to suggest products, then terms`;
+export const recommendationsDescription = `Use constructor's recommendations service, with \`"type": "recommendations"\``;
+export const customSectionDescription = `Use a custom section, by managing and passing your own data, with \`"type": "custom"\` and \`"data":[{...}]\``;
+export const onFocusDescription = `Pass an \`onFocus\` callback function to execute some code each time the user applies focus to the text input field`;
+export const onChangeDescription = `Pass an \`onChange\` callback function to execute some code each time the user changes the value of the text input field`;
+export const onSubmitDescription = `Pass an \`onSubmit\` callback function to execute some code after a user submits the search form.
+
+  Your callback function will be invoked with a submit event containing useful metadata about the submit event:
+  - if the user submits the text input:
+    - the \`query\` field will provide the value of that input field
+  - if the user selects a suggested item from the dropdown list:
+    - the \`originalQuery\` field will provide the value of the input field that generated the selected item
+    - an \`item\` object with information about the suggestion that the user selected`;
+export const zeroStateSectionsDescription = `Use \`zeroStateSections\` to show suggestions after a user applies focus to the search input field and before they start typing a query`;
+export const openOnFocusDescription = `Use \`openOnFocus: false\` to show suggestions after a user clears their query, but not when they initially apply focus to the search input field`;
+export const multipleSectionsDescription = `Use as many different \`recommendations\` and \`custom\` sections as you'd like and in whatever order you would like!`;
+// from .storybook/custom-styles-story.css
+export const customStylesDescription = `
+By default, importing react components or hooks from this library does not pull any css into your project.
+
+If you wish to use some starter styles from this library, add an import statement similar to the example import statement below:
+
+\`
+import 'node_modules/@constructor-io/constructorio-ui-autocomplete/lib/mjs/components/Autocomplete/Autocomplete.css';
+\`
+
+<i></i>
+
+- To opt out of all default styling, do not import the \`Autocomplete.css\` stylesheet.
+- The path and syntax in the example above may change depending on your module bundling strategy
+- These starter styles can be used as a foundation to build on top of, or just as a reference for you to replace completely.
+- All starter styles in this library are scoped within the \`.cio-autocomplete\` css selector.
+- These starter styles are intended to be extended by layering in your own css rules
+- If you like, you can override the container's className like so:
+\`autocompleteClassName='custom-autocomplete-container'\`
+- If you like, you can pass additional className(s) of your choosing like so:
+\`autocompleteClassName='cio-autocomplete custom-autocomplete-container'\`
+
+
+\`\`\`css
+/* Custom Style Sheet */
+.cio-autocomplete.custom-autocomplete-styles form {
+  height: 44px;
+  width: 600px;
+  border-radius: 8px;
+  background-color: rgb(247, 247, 247);
+}
+
+.cio-autocomplete.custom-autocomplete-styles .cio-input {
+  font-weight: bold;
+}
+
+.cio-autocomplete.custom-autocomplete-styles .cio-form button {
+  width: 44px;
+}
+
+.cio-autocomplete.custom-autocomplete-styles .cio-clear-btn {
+  right: 24px;
+}
+
+.cio-autocomplete.custom-autocomplete-styles .cio-sectionName {
+  margin: 5px 3px;
+}
+
+.cio-autocomplete.custom-autocomplete-styles .cio-results {
+  width: 620px;
+  max-height: 334px;
+  overflow: hidden;
+  border-radius: 0px 0px 8px 8px;
+  color: rgb(51, 51, 51);
+}
+
+.cio-autocomplete.custom-autocomplete-styles .Products p {
+  padding: 5px 5px 0;
+}
+\`\`\`
+`;
+//# sourceMappingURL=constants.js.map

package/lib/mjs/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/constants.ts"],"names":[],"mappings":"AAAA,yBAAyB;AACzB,MAAM,CAAC,MAAM,MAAM,GAAG,sBAAsB,CAAC;AAE7C,kCAAkC;AAClC,gCAAgC;AAChC,kCAAkC;AAElC,MAAM,CAAC,MAAM,oBAAoB,GAAG;;;;;;;CAOnC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6B9B,CAAC;AAEF,kCAAkC;AAClC,kBAAkB;AAClB,kCAAkC;AAElC,MAAM,CAAC,MAAM,mBAAmB,GAAG;;;;;;;;;;;;;;;;;;;;;;;CAuBlC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG;;;;;;+bAM0Z,CAAC;AAEhc,MAAM,CAAC,MAAM,oBAAoB,GAAG;;;;;;;;mEAQ+B,CAAC;AAEpE,kCAAkC;AAClC,oBAAoB;AACpB,kCAAkC;AAElC,MAAM,CAAC,MAAM,iBAAiB,GAAG,kEAAkE,CAAC;AACpG,MAAM,CAAC,MAAM,sBAAsB,GAAG;;6LAEuJ,CAAC;AAC9L,MAAM,CAAC,MAAM,sBAAsB,GAAG,iIAAiI,CAAC;AACxK,MAAM,CAAC,MAAM,4BAA4B,GAAG,4DAA4D,CAAC;AACzG,MAAM,CAAC,MAAM,mBAAmB,GAAG,0DAA0D,CAAC;AAC9F,MAAM,CAAC,MAAM,kBAAkB,GAAG,uDAAuD,CAAC;AAC1F,MAAM,CAAC,MAAM,qBAAqB,GAAG,sEAAsE,CAAC;AAC5G,MAAM,CAAC,MAAM,uBAAuB,GAAG,iEAAiE,CAAC;AACzG,MAAM,CAAC,MAAM,0BAA0B,GAAG,+EAA+E,CAAC;AAC1H,MAAM,CAAC,MAAM,wBAAwB,GAAG,+GAA+G,CAAC;AACxJ,MAAM,CAAC,MAAM,kBAAkB,GAAG,qHAAqH,CAAC;AACxJ,MAAM,CAAC,MAAM,mBAAmB,GAAG,0HAA0H,CAAC;AAC9J,MAAM,CAAC,MAAM,mBAAmB,GAAG;;;;;;;sFAOmD,CAAC;AACvF,MAAM,CAAC,MAAM,4BAA4B,GAAG,yIAAyI,CAAC;AACtL,MAAM,CAAC,MAAM,sBAAsB,GAAG,mJAAmJ,CAAC;AAC1L,MAAM,CAAC,MAAM,2BAA2B,GAAG,uHAAuH,CAAC;AAEnK,0CAA0C;AAC1C,MAAM,CAAC,MAAM,uBAAuB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DtC,CAAC"}

package/lib/mjs/hooks/useCioAutocomplete.js

@@ -0,0 +1,118 @@
+import { useState } from 'react';
+import useCioClient from './useCioClient';
+import useDownShift from './useDownShift';
+import useDebouncedFetchSection from './useDebouncedFetchSections';
+import useFetchRecommendationPod from './useFetchRecommendationPod';
+import usePrevious from './usePrevious';
+import { getIndexOffset } from '../utils';
+export const defaultSections = [
+    {
+        identifier: 'Search Suggestions',
+        type: 'autocomplete',
+    },
+    {
+        identifier: 'Products',
+        type: 'autocomplete',
+    },
+];
+const useCioAutocomplete = (options) => {
+    const defaultPlaceholder = 'What can we help you find today?';
+    const { onSubmit, onChange, openOnFocus, apiKey, cioJsClient, placeholder = defaultPlaceholder, sections = defaultSections, zeroStateSections, autocompleteClassName = 'cio-autocomplete', } = options;
+    const [query, setQuery] = useState('');
+    const previousQuery = usePrevious(query);
+    const cioClient = useCioClient({ apiKey, cioJsClient });
+    const zeroStateSectionsActive = !query.length && zeroStateSections;
+    let activeSections = zeroStateSectionsActive ? zeroStateSections : sections;
+    if (sections && !Array.isArray(sections)) {
+        // eslint-disable-next-line
+        console.error('useCioAutocomplete expects sections to reference an array of section configuration objects');
+        activeSections = [];
+    }
+    if (zeroStateSections && !Array.isArray(zeroStateSections)) {
+        // eslint-disable-next-line
+        console.error('useCioAutocomplete expects zeroStateSections to reference an array of section configuration objects');
+        activeSections = [];
+    }
+    const autocompleteSections = activeSections?.filter((config) => config.type === 'autocomplete' || !config.type);
+    const recommendationsSections = activeSections?.filter((config) => config.type === 'recommendations');
+    const autocompleteResults = useDebouncedFetchSection(query, cioClient, autocompleteSections);
+    const recommendationsResults = useFetchRecommendationPod(cioClient, recommendationsSections);
+    const sectionResults = { ...autocompleteResults, ...recommendationsResults };
+    const activeSectionsWithData = [];
+    activeSections?.forEach((config) => {
+        const { identifier, data: customData } = config;
+        const data = sectionResults[identifier] || customData;
+        if (data && data !== undefined) {
+            activeSectionsWithData.push({ ...config, data });
+        }
+    });
+    const items = [];
+    activeSectionsWithData?.forEach((config) => {
+        if (config?.data) {
+            items.push(...config.data);
+        }
+    });
+    const downshift = useDownShift({ setQuery, onChange, items, onSubmit, cioClient, previousQuery });
+    const { isOpen, getMenuProps, getLabelProps, openMenu, closeMenu } = downshift;
+    return {
+        query,
+        sections: activeSectionsWithData,
+        isOpen: isOpen && items?.length > 0,
+        getMenuProps: () => ({
+            ...getMenuProps(),
+            className: 'cio-results',
+            'data-testid': 'cio-results',
+        }),
+        getLabelProps,
+        openMenu,
+        closeMenu,
+        getItemProps: ({ item, index = 0, sectionIdentifier = 'Products' }) => {
+            const indexOffset = getIndexOffset({
+                activeSections: activeSectionsWithData,
+                sectionIdentifier,
+            });
+            const sectionItemTestId = `cio-item-${sectionIdentifier.replace(' ', '')}`;
+            return {
+                ...downshift.getItemProps({ item, index: index + indexOffset }),
+                className: `cio-item ${sectionItemTestId}`,
+                'data-testid': sectionItemTestId,
+            };
+        },
+        getInputProps: () => ({
+            ...downshift.getInputProps(),
+            value: query,
+            onFocus: () => {
+                if (options.onFocus) {
+                    options.onFocus();
+                }
+                if (zeroStateSectionsActive && openOnFocus !== false) {
+                    downshift.openMenu();
+                }
+                if (query?.length) {
+                    downshift.openMenu();
+                }
+                cioClient?.tracker?.trackInputFocus();
+            },
+            className: 'cio-input',
+            'data-testid': 'cio-input',
+            placeholder,
+        }),
+        getFormProps: () => ({
+            onSubmit: (event) => {
+                event.preventDefault();
+                if (onSubmit) {
+                    onSubmit({ query });
+                }
+                cioClient?.tracker.trackSearchSubmit(query, { original_query: query });
+                return { query };
+            },
+            className: 'cio-form',
+            'data-testid': 'cio-form',
+        }),
+        setQuery,
+        cioClient,
+        autocompleteClassName,
+    };
+};
+export default useCioAutocomplete;
+//# sourceMappingURL=useCioAutocomplete.js.map

package/lib/mjs/hooks/useCioAutocomplete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCioAutocomplete.js","sourceRoot":"","sources":["../../../src/hooks/useCioAutocomplete.ts"],"names":[],"mappings":"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"}

package/lib/mjs/hooks/useCioClient.js

@@ -0,0 +1,20 @@
+import { useEffect, useState } from 'react';
+import ConstructorIOClient from '@constructor-io/constructorio-client-javascript';
+const useCioClient = ({ apiKey, cioJsClient }) => {
+    const [cioClient, setCioClient] = useState(cioJsClient);
+    useEffect(() => {
+        if (apiKey && !cioJsClient) {
+            const client = new ConstructorIOClient({
+                apiKey,
+                sendTrackingEvents: true,
+            });
+            setCioClient(client);
+        }
+        else if (cioJsClient) {
+            setCioClient(cioJsClient);
+        }
+    }, [apiKey, cioJsClient]);
+    return cioClient;
+};
+export default useCioClient;
+//# sourceMappingURL=useCioClient.js.map

package/lib/mjs/hooks/useCioClient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCioClient.js","sourceRoot":"","sources":["../../../src/hooks/useCioClient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,mBAAmB,MAAM,iDAAiD,CAAC;AAuBlF,MAAM,YAAY,GAAiB,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,EAAE;IAC7D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,CAAC;IAExD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,IAAI,CAAC,WAAW,EAAE;YAC1B,MAAM,MAAM,GAAG,IAAI,mBAAmB,CAAC;gBACrC,MAAM;gBACN,kBAAkB,EAAE,IAAI;aACzB,CAAC,CAAC;YAEH,YAAY,CAAC,MAAM,CAAC,CAAC;SACtB;aAAM,IAAI,WAAW,EAAE;YACtB,YAAY,CAAC,WAAW,CAAC,CAAC;SAC3B;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC;IAE1B,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/mjs/hooks/useDebounce.js

@@ -0,0 +1,22 @@
+import { useEffect, useState } from 'react';
+// adapted from: https://usehooks.com/useDebounce/
+const useDebounce = (value, delay = 250) => {
+    // State and setters for debounced value
+    const [debouncedValue, setDebouncedValue] = useState(value);
+    useEffect(() => {
+        // Update debounced value after delay
+        const handler = setTimeout(() => {
+            setDebouncedValue(value);
+        }, delay);
+        // Cancel the timeout if value changes (also on delay change or unmount)
+        // This is how we prevent debounced value from updating if value is changed ...
+        // .. within the delay period. Timeout gets cleared and restarted.
+        return () => {
+            clearTimeout(handler);
+        };
+    }, [value, delay] // Only re-call effect if value or delay changes
+    );
+    return debouncedValue;
+};
+export default useDebounce;
+//# sourceMappingURL=useDebounce.js.map

package/lib/mjs/hooks/useDebounce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce.js","sourceRoot":"","sources":["../../../src/hooks/useDebounce.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,kDAAkD;AAClD,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,KAAK,GAAG,GAAG,EAAE,EAAE;IACjD,wCAAwC;IACxC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5D,SAAS,CACP,GAAG,EAAE;QACH,qCAAqC;QACrC,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YAC9B,iBAAiB,CAAC,KAAK,CAAC,CAAC;QAC3B,CAAC,EAAE,KAAK,CAAC,CAAC;QACV,wEAAwE;QACxE,+EAA+E;QAC/E,kEAAkE;QAClE,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,OAAO,CAAC,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EACD,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,gDAAgD;KAChE,CAAC;IACF,OAAO,cAAc,CAAC;AACxB,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/mjs/hooks/useDebouncedFetchSections.js

@@ -0,0 +1,41 @@
+import { useEffect, useState } from 'react';
+import useDebounce from './useDebounce';
+const autocompleteParameters = {
+    resultsPerSection: {},
+    // numResults: 8,
+    // hiddenFields: [],
+    // filters: {},
+    // variationsMap: {}
+};
+const useDebouncedFetchSection = (query, cioClient, autocompleteSections) => {
+    const [sectionsData, setSectionsData] = useState({});
+    const debouncedSearchTerm = useDebounce(query);
+    if (autocompleteSections) {
+        autocompleteParameters.resultsPerSection = autocompleteSections.reduce((acc, sectionConfig) => ({
+            ...acc,
+            [sectionConfig.identifier]: sectionConfig?.numResults || 8,
+        }), {});
+    }
+    useEffect(() => {
+        if (debouncedSearchTerm) {
+            cioClient?.autocomplete
+                .getAutocompleteResults(debouncedSearchTerm, autocompleteParameters)
+                .then((response) => {
+                const newSectionsData = {};
+                Object.keys(response.sections).forEach((section) => {
+                    newSectionsData[section] = response.sections[section].map((item) => ({
+                        ...item,
+                        section,
+                    }));
+                });
+                setSectionsData(newSectionsData);
+            });
+        }
+        else if (!debouncedSearchTerm) {
+            setSectionsData({});
+        }
+    }, [debouncedSearchTerm, cioClient]);
+    return sectionsData;
+};
+export default useDebouncedFetchSection;
+//# sourceMappingURL=useDebouncedFetchSections.js.map

package/lib/mjs/hooks/useDebouncedFetchSections.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedFetchSections.js","sourceRoot":"","sources":["../../../src/hooks/useDebouncedFetchSections.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,WAAW,MAAM,eAAe,CAAC;AAaxC,MAAM,sBAAsB,GAAG;IAC7B,iBAAiB,EAAE,EAAE;IACrB,iBAAiB;IACjB,oBAAoB;IACpB,eAAe;IACf,oBAAoB;CACM,CAAC;AAE7B,MAAM,wBAAwB,GAAG,CAC/B,KAAa,EACb,SAA+B,EAC/B,oBAA6C,EAC7C,EAAE;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAA6B,EAAE,CAAC,CAAC;IACjF,MAAM,mBAAmB,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAE/C,IAAI,oBAAoB,EAAE;QACxB,sBAAsB,CAAC,iBAAiB,GAAG,oBAAoB,CAAC,MAAM,CACpE,CAAC,GAAG,EAAE,aAAa,EAAE,EAAE,CAAC,CAAC;YACvB,GAAG,GAAG;YACN,CAAC,aAAa,CAAC,UAAU,CAAC,EAAE,aAAa,EAAE,UAAU,IAAI,CAAC;SAC3D,CAAC,EACF,EAAE,CACH,CAAC;KACH;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,mBAAmB,EAAE;YACvB,SAAS,EAAE,YAAY;iBACpB,sBAAsB,CAAC,mBAAmB,EAAE,sBAAsB,CAAC;iBACnE,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;gBACjB,MAAM,eAAe,GAA+B,EAAE,CAAC;gBACvD,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAe,EAAE,EAAE;oBACzD,eAAe,CAAC,OAAO,CAAC,GAAG,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;wBACnE,GAAG,IAAI;wBACP,OAAO;qBACR,CAAC,CAAC,CAAC;gBACN,CAAC,CAAC,CAAC;gBACH,eAAe,CAAC,eAAe,CAAC,CAAC;YACnC,CAAC,CAAC,CAAC;SACN;aAAM,IAAI,CAAC,mBAAmB,EAAE;YAC/B,eAAe,CAAC,EAAE,CAAC,CAAC;SACrB;IACH,CAAC,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC,CAAC;IAErC,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC;AAEF,eAAe,wBAAwB,CAAC"}

package/lib/mjs/hooks/useDownShift.js

@@ -0,0 +1,33 @@
+import { useCombobox } from 'downshift';
+let idCounter = 0;
+const useDownShift = ({ setQuery, items, onSubmit, cioClient, previousQuery = '', onChange, }) => useCombobox({
+    id: `cio-autocomplete-${idCounter++}`,
+    items,
+    itemToString: (item) => item?.value || '',
+    onInputValueChange: async ({ inputValue = '' }) => {
+        setQuery(inputValue);
+        if (onChange) {
+            onChange(inputValue);
+        }
+    },
+    onSelectedItemChange({ selectedItem }) {
+        if (selectedItem) {
+            setQuery(selectedItem.value || '');
+            if (selectedItem?.value) {
+                if (onSubmit)
+                    onSubmit({ item: selectedItem, originalQuery: previousQuery });
+                if (!selectedItem?.data?.url) {
+                    cioClient?.tracker.trackSearchSubmit(selectedItem.value, {
+                        original_query: previousQuery,
+                    });
+                }
+                cioClient?.tracker.trackAutocompleteSelect(selectedItem.value, {
+                    original_query: previousQuery,
+                    section: selectedItem.section,
+                });
+            }
+        }
+    },
+});
+export default useDownShift;
+//# sourceMappingURL=useDownShift.js.map

package/lib/mjs/hooks/useDownShift.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDownShift.js","sourceRoot":"","sources":["../../../src/hooks/useDownShift.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAA0B,MAAM,WAAW,CAAC;AAIhE,IAAI,SAAS,GAAG,CAAC,CAAC;AAelB,MAAM,YAAY,GAAiB,CAAC,EAClC,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,SAAS,EACT,aAAa,GAAG,EAAE,EAClB,QAAQ,GACT,EAAE,EAAE,CACH,WAAW,CAAC;IACV,EAAE,EAAE,oBAAoB,SAAS,EAAE,EAAE;IACrC,KAAK;IACL,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;IACzC,kBAAkB,EAAE,KAAK,EAAE,EAAE,UAAU,GAAG,EAAE,EAAE,EAAE,EAAE;QAChD,QAAQ,CAAC,UAAU,CAAC,CAAC;QACrB,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,UAAU,CAAC,CAAC;SACtB;IACH,CAAC;IACD,oBAAoB,CAAC,EAAE,YAAY,EAAE;QACnC,IAAI,YAAY,EAAE;YAChB,QAAQ,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;YACnC,IAAI,YAAY,EAAE,KAAK,EAAE;gBACvB,IAAI,QAAQ;oBAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC,CAAC;gBAC7E,IAAI,CAAC,YAAY,EAAE,IAAI,EAAE,GAAG,EAAE;oBAC5B,SAAS,EAAE,OAAO,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,EAAE;wBACvD,cAAc,EAAE,aAAa;qBAC9B,CAAC,CAAC;iBACJ;gBACD,SAAS,EAAE,OAAO,CAAC,uBAAuB,CAAC,YAAY,CAAC,KAAK,EAAE;oBAC7D,cAAc,EAAE,aAAa;oBAC7B,OAAO,EAAE,YAAY,CAAC,OAAO;iBAC9B,CAAC,CAAC;aACJ;SACF;IACH,CAAC;CACF,CAAC,CAAC;AAEL,eAAe,YAAY,CAAC"}

package/lib/mjs/hooks/useFetchRecommendationPod.js

@@ -0,0 +1,27 @@
+import { useEffect, useState } from 'react';
+const useFetchRecommendationPod = (cioClient, recommendationPods) => {
+    const [recommendationResults, setRecommendationResults] = useState({});
+    useEffect(() => {
+        if (!cioClient || !Array.isArray(recommendationPods) || recommendationPods.length === 0)
+            return;
+        const fetchRecommendationResults = async () => {
+            const responses = await Promise.all(recommendationPods.map(({ identifier: podId, ...parameters }) => cioClient.recommendations.getRecommendations(podId, parameters)));
+            const recommendationPodResults = {};
+            responses.forEach(({ response }) => {
+                const { pod, results } = response;
+                if (pod?.id) {
+                    recommendationPodResults[pod.id] = results?.map((item) => ({
+                        ...item,
+                        section: pod.id,
+                    }));
+                }
+            });
+            setRecommendationResults(recommendationPodResults);
+        };
+        fetchRecommendationResults();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [cioClient]);
+    return recommendationResults;
+};
+export default useFetchRecommendationPod;
+//# sourceMappingURL=useFetchRecommendationPod.js.map

package/lib/mjs/hooks/useFetchRecommendationPod.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchRecommendationPod.js","sourceRoot":"","sources":["../../../src/hooks/useFetchRecommendationPod.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI5C,MAAM,yBAAyB,GAAG,CAChC,SAA0C,EAC1C,kBAAyD,EACzD,EAAE;IACF,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAChE,EAAE,CACH,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,kBAAkB,CAAC,IAAI,kBAAkB,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO;QAChG,MAAM,0BAA0B,GAAG,KAAK,IAAI,EAAE;YAC5C,MAAM,SAAS,GAAG,MAAM,OAAO,CAAC,GAAG,CACjC,kBAAkB,CAAC,GAAG,CAAC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,EAAE,EAAE,CAC9D,SAAS,CAAC,eAAe,CAAC,kBAAkB,CAAC,KAAK,EAAE,UAAU,CAAC,CAChE,CACF,CAAC;YACF,MAAM,wBAAwB,GAAG,EAAE,CAAC;YAEpC,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;gBACjC,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,QAAQ,CAAC;gBAClC,IAAI,GAAG,EAAE,EAAE,EAAE;oBACX,wBAAwB,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,GAAG,CAAC,CAAC,IAAU,EAAE,EAAE,CAAC,CAAC;wBAC/D,GAAG,IAAI;wBACP,OAAO,EAAE,GAAG,CAAC,EAAE;qBAChB,CAAC,CAAC,CAAC;iBACL;YACH,CAAC,CAAC,CAAC;YAEH,wBAAwB,CAAC,wBAAwB,CAAC,CAAC;QACrD,CAAC,CAAC;QACF,0BAA0B,EAAE,CAAC;QAC7B,uDAAuD;IACzD,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,qBAAqB,CAAC;AAC/B,CAAC,CAAC;AAEF,eAAe,yBAAyB,CAAC"}

package/lib/mjs/hooks/usePrevious.js

@@ -0,0 +1,10 @@
+import { useEffect, useRef } from 'react';
+const usePrevious = (value) => {
+    const ref = useRef();
+    useEffect(() => {
+        ref.current = value; // assign the value of ref to the argument
+    }, [value]); // this code will run when the value of 'value' changes
+    return ref.current; // in the end, return the current ref value.
+};
+export default usePrevious;
+//# sourceMappingURL=usePrevious.js.map

package/lib/mjs/hooks/usePrevious.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePrevious.js","sourceRoot":"","sources":["../../../src/hooks/usePrevious.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,EAAE;IACpC,MAAM,GAAG,GAAG,MAAM,EAAU,CAAC;IAC7B,SAAS,CAAC,GAAG,EAAE;QACb,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC,CAAC,0CAA0C;IACjE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,uDAAuD;IACpE,OAAO,GAAG,CAAC,OAAO,CAAC,CAAC,4CAA4C;AAClE,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/mjs/index.js

@@ -0,0 +1,7 @@
+export { default as AutocompleteResults } from './components/Autocomplete/AutocompleteResults/AutocompleteResults';
+export { default as CioAutocomplete } from './components/Autocomplete/CioAutocomplete/CioAutocomplete';
+export { default as SearchInput } from './components/Autocomplete/SearchInput/SearchInput';
+export { default as SectionItem } from './components/Autocomplete/SectionItem/SectionItem';
+export { default as SectionItemsList } from './components/Autocomplete/SectionItemsList/SectionItemsList';
+export { default as useCioAutocomplete } from './hooks/useCioAutocomplete';
+//# sourceMappingURL=index.js.map

package/lib/mjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,mEAAmE,CAAC;AACnH,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2DAA2D,CAAC;AACvG,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mDAAmD,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mDAAmD,CAAC;AAC3F,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,6DAA6D,CAAC;AAC1G,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,4BAA4B,CAAC"}

package/lib/mjs/stories/Autocomplete/argTypes.js

@@ -0,0 +1,62 @@
+// eslint-disable-next-line
+export const argTypes = {
+    placeholder: {
+        description: 'Search input placeholder',
+        table: {
+            type: {
+                summary: 'string',
+            },
+        },
+        control: {
+            type: 'text',
+        },
+    },
+    apiKey: {
+        type: { name: 'string' },
+        description: 'Your constructor API key',
+        table: {
+            type: {
+                summary: 'string',
+            },
+        },
+        control: {
+            type: 'text',
+        },
+    },
+    onSubmit: {
+        type: {
+            name: 'function',
+        },
+        description: `On search submit callback function`,
+        table: {
+            type: {
+                summary: 'Function',
+            },
+        },
+        control: null,
+    },
+    onFocus: {
+        type: {
+            name: 'function',
+        },
+        description: `On focus callback function`,
+        table: {
+            type: {
+                summary: 'Function',
+            },
+        },
+        control: null,
+    },
+    openOnFocus: {
+        description: 'Open results on focus',
+        table: {
+            type: {
+                summary: 'boolean',
+            },
+        },
+        control: {
+            type: 'boolean',
+        },
+    },
+};
+//# sourceMappingURL=argTypes.js.map

package/lib/mjs/stories/Autocomplete/argTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"argTypes.js","sourceRoot":"","sources":["../../../../src/stories/Autocomplete/argTypes.ts"],"names":[],"mappings":"AAAA,2BAA2B;AAC3B,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,WAAW,EAAE;QACX,WAAW,EAAE,0BAA0B;QACvC,KAAK,EAAE;YACL,IAAI,EAAE;gBACJ,OAAO,EAAE,QAAQ;aAClB;SACF;QACD,OAAO,EAAE;YACP,IAAI,EAAE,MAAM;SACb;KACF;IACD,MAAM,EAAE;QACN,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;QACxB,WAAW,EAAE,0BAA0B;QACvC,KAAK,EAAE;YACL,IAAI,EAAE;gBACJ,OAAO,EAAE,QAAQ;aAClB;SACF;QACD,OAAO,EAAE;YACP,IAAI,EAAE,MAAM;SACb;KACF;IACD,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,IAAI,EAAE,UAAU;SACjB;QACD,WAAW,EAAE,oCAAoC;QACjD,KAAK,EAAE;YACL,IAAI,EAAE;gBACJ,OAAO,EAAE,UAAU;aACpB;SACF;QACD,OAAO,EAAE,IAAI;KACd;IACD,OAAO,EAAE;QACP,IAAI,EAAE;YACJ,IAAI,EAAE,UAAU;SACjB;QACD,WAAW,EAAE,4BAA4B;QACzC,KAAK,EAAE;YACL,IAAI,EAAE;gBACJ,OAAO,EAAE,UAAU;aACpB;SACF;QACD,OAAO,EAAE,IAAI;KACd;IACD,WAAW,EAAE;QACX,WAAW,EAAE,uBAAuB;QACpC,KAAK,EAAE;YACL,IAAI,EAAE;gBACJ,OAAO,EAAE,SAAS;aACnB;SACF;QACD,OAAO,EAAE;YACP,IAAI,EAAE,SAAS;SAChB;KACF;CACF,CAAC"}

package/lib/mjs/typeGuards.js

@@ -0,0 +1,6 @@
+// Type Guard
+// eslint-disable-next-line
+export function isProduct(item) {
+    return item.data.image_url !== undefined;
+}
+//# sourceMappingURL=typeGuards.js.map

package/lib/mjs/typeGuards.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typeGuards.js","sourceRoot":"","sources":["../../src/typeGuards.ts"],"names":[],"mappings":"AAEA,aAAa;AACb,2BAA2B;AAC3B,MAAM,UAAU,SAAS,CAAC,IAAU;IAClC,OAAQ,IAAgB,CAAC,IAAI,CAAC,SAAS,KAAK,SAAS,CAAC;AACxD,CAAC"}

package/lib/mjs/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/lib/mjs/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":""}