@constructor-io/constructorio-ui-autocomplete 1.1.6

package/lib/cjs/hooks/useCioAutocomplete.js

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultSections = void 0;
+const react_1 = require("react");
+const useCioClient_1 = require("./useCioClient");
+const useDownShift_1 = require("./useDownShift");
+const useDebouncedFetchSections_1 = require("./useDebouncedFetchSections");
+const useFetchRecommendationPod_1 = require("./useFetchRecommendationPod");
+const usePrevious_1 = require("./usePrevious");
+const utils_1 = require("../utils");
+exports.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 = exports.defaultSections, zeroStateSections, autocompleteClassName = 'cio-autocomplete' } = options;
+    const [query, setQuery] = (0, react_1.useState)('');
+    const previousQuery = (0, usePrevious_1.default)(query);
+    const cioClient = (0, useCioClient_1.default)({ 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 === null || activeSections === void 0 ? void 0 : activeSections.filter((config) => config.type === 'autocomplete' || !config.type);
+    const recommendationsSections = activeSections === null || activeSections === void 0 ? void 0 : activeSections.filter((config) => config.type === 'recommendations');
+    const autocompleteResults = (0, useDebouncedFetchSections_1.default)(query, cioClient, autocompleteSections);
+    const recommendationsResults = (0, useFetchRecommendationPod_1.default)(cioClient, recommendationsSections);
+    const sectionResults = Object.assign(Object.assign({}, autocompleteResults), recommendationsResults);
+    const activeSectionsWithData = [];
+    activeSections === null || activeSections === void 0 ? void 0 : activeSections.forEach((config) => {
+        const { identifier, data: customData } = config;
+        const data = sectionResults[identifier] || customData;
+        if (data && data !== undefined) {
+            activeSectionsWithData.push(Object.assign(Object.assign({}, config), { data }));
+        }
+    });
+    const items = [];
+    activeSectionsWithData === null || activeSectionsWithData === void 0 ? void 0 : activeSectionsWithData.forEach((config) => {
+        if (config === null || config === void 0 ? void 0 : config.data) {
+            items.push(...config.data);
+        }
+    });
+    const downshift = (0, useDownShift_1.default)({ setQuery, onChange, items, onSubmit, cioClient, previousQuery });
+    const { isOpen, getMenuProps, getLabelProps, openMenu, closeMenu } = downshift;
+    return {
+        query,
+        sections: activeSectionsWithData,
+        isOpen: isOpen && (items === null || items === void 0 ? void 0 : items.length) > 0,
+        getMenuProps: () => (Object.assign(Object.assign({}, getMenuProps()), { className: 'cio-results', 'data-testid': 'cio-results' })),
+        getLabelProps,
+        openMenu,
+        closeMenu,
+        getItemProps: ({ item, index = 0, sectionIdentifier = 'Products' }) => {
+            const indexOffset = (0, utils_1.getIndexOffset)({
+                activeSections: activeSectionsWithData,
+                sectionIdentifier
+            });
+            const sectionItemTestId = `cio-item-${sectionIdentifier.replace(' ', '')}`;
+            return Object.assign(Object.assign({}, downshift.getItemProps({ item, index: index + indexOffset })), { className: `cio-item ${sectionItemTestId}`, 'data-testid': sectionItemTestId });
+        },
+        getInputProps: () => (Object.assign(Object.assign({}, downshift.getInputProps()), { value: query, onFocus: () => {
+                var _a;
+                if (options.onFocus) {
+                    options.onFocus();
+                }
+                if (zeroStateSectionsActive && openOnFocus !== false) {
+                    downshift.openMenu();
+                }
+                if (query === null || query === void 0 ? void 0 : query.length) {
+                    downshift.openMenu();
+                }
+                (_a = cioClient === null || cioClient === void 0 ? void 0 : cioClient.tracker) === null || _a === void 0 ? void 0 : _a.trackInputFocus();
+            }, className: 'cio-input', 'data-testid': 'cio-input', placeholder })),
+        getFormProps: () => ({
+            onSubmit: (event) => {
+                event.preventDefault();
+                if (onSubmit) {
+                    onSubmit({ query });
+                }
+                cioClient === null || cioClient === void 0 ? void 0 : cioClient.tracker.trackSearchSubmit(query, { original_query: query });
+                return { query };
+            },
+            className: 'cio-form',
+            'data-testid': 'cio-form'
+        }),
+        setQuery,
+        cioClient,
+        autocompleteClassName
+    };
+};
+exports.default = useCioAutocomplete;
+//# sourceMappingURL=useCioAutocomplete.js.map

package/lib/cjs/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/cjs/hooks/useCioClient.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const constructorio_client_javascript_1 = require("@constructor-io/constructorio-client-javascript");
+const useCioClient = ({ apiKey, cioJsClient }) => {
+    const [cioClient, setCioClient] = (0, react_1.useState)(cioJsClient);
+    (0, react_1.useEffect)(() => {
+        if (apiKey && !cioJsClient) {
+            const client = new constructorio_client_javascript_1.default({
+                apiKey,
+                sendTrackingEvents: true
+            });
+            setCioClient(client);
+        }
+        else if (cioJsClient) {
+            setCioClient(cioJsClient);
+        }
+    }, [apiKey, cioJsClient]);
+    return cioClient;
+};
+exports.default = useCioClient;
+//# sourceMappingURL=useCioClient.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useCioClient.js","sourceRoot":"","sources":["../../../src/hooks/useCioClient.ts"],"names":[],"mappings":";;AAAA,iCAA4C;AAC5C,qGAAkF;AAuBlF,MAAM,YAAY,GAAiB,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,EAAE;IAC7D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,WAAW,CAAC,CAAC;IAExD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,MAAM,IAAI,CAAC,WAAW,EAAE;YAC1B,MAAM,MAAM,GAAG,IAAI,yCAAmB,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,kBAAe,YAAY,CAAC"}

package/lib/cjs/hooks/useDebounce.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+// adapted from: https://usehooks.com/useDebounce/
+const useDebounce = (value, delay = 250) => {
+    // State and setters for debounced value
+    const [debouncedValue, setDebouncedValue] = (0, react_1.useState)(value);
+    (0, react_1.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;
+};
+exports.default = useDebounce;
+//# sourceMappingURL=useDebounce.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce.js","sourceRoot":"","sources":["../../../src/hooks/useDebounce.ts"],"names":[],"mappings":";;AAAA,iCAA4C;AAE5C,kDAAkD;AAClD,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,KAAK,GAAG,GAAG,EAAE,EAAE;IACjD,wCAAwC;IACxC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5D,IAAA,iBAAS,EACP,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,kBAAe,WAAW,CAAC"}

package/lib/cjs/hooks/useDebouncedFetchSections.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const useDebounce_1 = require("./useDebounce");
+const autocompleteParameters = {
+    resultsPerSection: {}
+    // numResults: 8,
+    // hiddenFields: [],
+    // filters: {},
+    // variationsMap: {}
+};
+const useDebouncedFetchSection = (query, cioClient, autocompleteSections) => {
+    const [sectionsData, setSectionsData] = (0, react_1.useState)({});
+    const debouncedSearchTerm = (0, useDebounce_1.default)(query);
+    if (autocompleteSections) {
+        autocompleteParameters.resultsPerSection = autocompleteSections.reduce((acc, sectionConfig) => (Object.assign(Object.assign({}, acc), { [sectionConfig.identifier]: (sectionConfig === null || sectionConfig === void 0 ? void 0 : sectionConfig.numResults) || 8 })), {});
+    }
+    (0, react_1.useEffect)(() => {
+        if (debouncedSearchTerm) {
+            cioClient === null || cioClient === void 0 ? void 0 : cioClient.autocomplete.getAutocompleteResults(debouncedSearchTerm, autocompleteParameters).then((response) => {
+                const newSectionsData = {};
+                Object.keys(response.sections).forEach((section) => {
+                    newSectionsData[section] = response.sections[section].map((item) => (Object.assign(Object.assign({}, item), { section })));
+                });
+                setSectionsData(newSectionsData);
+            });
+        }
+        else if (!debouncedSearchTerm) {
+            setSectionsData({});
+        }
+    }, [debouncedSearchTerm, cioClient]);
+    return sectionsData;
+};
+exports.default = useDebouncedFetchSection;
+//# sourceMappingURL=useDebouncedFetchSections.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedFetchSections.js","sourceRoot":"","sources":["../../../src/hooks/useDebouncedFetchSections.ts"],"names":[],"mappings":";;AAAA,iCAA4C;AAE5C,+CAAwC;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,IAAA,gBAAQ,EAA6B,EAAE,CAAC,CAAC;IACjF,MAAM,mBAAmB,GAAG,IAAA,qBAAW,EAAC,KAAK,CAAC,CAAC;IAE/C,IAAI,oBAAoB,EAAE;QACxB,sBAAsB,CAAC,iBAAiB,GAAG,oBAAoB,CAAC,MAAM,CACpE,CAAC,GAAG,EAAE,aAAa,EAAE,EAAE,CAAC,iCACnB,GAAG,KACN,CAAC,aAAa,CAAC,UAAU,CAAC,EAAE,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,UAAU,KAAI,CAAC,IAC1D,EACF,EAAE,CACH,CAAC;KACH;IAED,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,mBAAmB,EAAE;YACvB,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,YAAY,CACpB,sBAAsB,CAAC,mBAAmB,EAAE,sBAAsB,EAClE,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,iCAC/D,IAAI,KACP,OAAO,IACP,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,kBAAe,wBAAwB,CAAC"}

package/lib/cjs/hooks/useDownShift.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const downshift_1 = require("downshift");
+let idCounter = 0;
+const useDownShift = ({ setQuery, items, onSubmit, cioClient, previousQuery = '', onChange }) => (0, downshift_1.useCombobox)({
+    id: `cio-autocomplete-${idCounter++}`,
+    items,
+    itemToString: (item) => (item === null || item === void 0 ? void 0 : item.value) || '',
+    onInputValueChange: ({ inputValue = '' }) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+        setQuery(inputValue);
+        if (onChange) {
+            onChange(inputValue);
+        }
+    }),
+    onSelectedItemChange({ selectedItem }) {
+        var _a;
+        if (selectedItem) {
+            setQuery(selectedItem.value || '');
+            if (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value) {
+                if (onSubmit)
+                    onSubmit({ item: selectedItem, originalQuery: previousQuery });
+                if (!((_a = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.data) === null || _a === void 0 ? void 0 : _a.url)) {
+                    cioClient === null || cioClient === void 0 ? void 0 : cioClient.tracker.trackSearchSubmit(selectedItem.value, {
+                        original_query: previousQuery
+                    });
+                }
+                cioClient === null || cioClient === void 0 ? void 0 : cioClient.tracker.trackAutocompleteSelect(selectedItem.value, {
+                    original_query: previousQuery,
+                    section: selectedItem.section
+                });
+            }
+        }
+    }
+});
+exports.default = useDownShift;
+//# sourceMappingURL=useDownShift.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useDownShift.js","sourceRoot":"","sources":["../../../src/hooks/useDownShift.ts"],"names":[],"mappings":";;;AAAA,yCAAgE;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,EACT,EAAE,EAAE,CACH,IAAA,uBAAW,EAAC;IACV,EAAE,EAAE,oBAAoB,SAAS,EAAE,EAAE;IACrC,KAAK;IACL,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,KAAI,EAAE;IACzC,kBAAkB,EAAE,CAAO,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,CAAA;IACD,oBAAoB,CAAC,EAAE,YAAY,EAAE;;QACnC,IAAI,YAAY,EAAE;YAChB,QAAQ,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;YACnC,IAAI,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,KAAK,EAAE;gBACvB,IAAI,QAAQ;oBAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC,CAAC;gBAC7E,IAAI,CAAC,CAAA,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,0CAAE,GAAG,CAAA,EAAE;oBAC5B,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,EAAE;wBACvD,cAAc,EAAE,aAAa;qBAC9B,CAAC,CAAC;iBACJ;gBACD,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,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,kBAAe,YAAY,CAAC"}

package/lib/cjs/hooks/useFetchRecommendationPod.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = require("react");
+const useFetchRecommendationPod = (cioClient, recommendationPods) => {
+    const [recommendationResults, setRecommendationResults] = (0, react_1.useState)({});
+    (0, react_1.useEffect)(() => {
+        if (!cioClient || !Array.isArray(recommendationPods) || recommendationPods.length === 0)
+            return;
+        const fetchRecommendationResults = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+            const responses = yield Promise.all(recommendationPods.map((_a) => {
+                var { identifier: podId } = _a, parameters = tslib_1.__rest(_a, ["identifier"]);
+                return cioClient.recommendations.getRecommendations(podId, parameters);
+            }));
+            const recommendationPodResults = {};
+            responses.forEach(({ response }) => {
+                const { pod, results } = response;
+                if (pod === null || pod === void 0 ? void 0 : pod.id) {
+                    recommendationPodResults[pod.id] = results === null || results === void 0 ? void 0 : results.map((item) => (Object.assign(Object.assign({}, item), { section: pod.id })));
+                }
+            });
+            setRecommendationResults(recommendationPodResults);
+        });
+        fetchRecommendationResults();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [cioClient]);
+    return recommendationResults;
+};
+exports.default = useFetchRecommendationPod;
+//# sourceMappingURL=useFetchRecommendationPod.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchRecommendationPod.js","sourceRoot":"","sources":["../../../src/hooks/useFetchRecommendationPod.ts"],"names":[],"mappings":";;;AAAA,iCAA4C;AAI5C,MAAM,yBAAyB,GAAG,CAChC,SAA0C,EAC1C,kBAAyD,EACzD,EAAE;IACF,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,IAAA,gBAAQ,EAChE,EAAE,CACH,CAAC;IAEF,IAAA,iBAAS,EAAC,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,GAAS,EAAE;YAC5C,MAAM,SAAS,GAAG,MAAM,OAAO,CAAC,GAAG,CACjC,kBAAkB,CAAC,GAAG,CAAC,CAAC,EAAoC,EAAE,EAAE;oBAAxC,EAAE,UAAU,EAAE,KAAK,OAAiB,EAAZ,UAAU,sBAAlC,cAAoC,CAAF;gBACxD,OAAA,SAAS,CAAC,eAAe,CAAC,kBAAkB,CAAC,KAAK,EAAE,UAAU,CAAC,CAAA;aAAA,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,aAAH,GAAG,uBAAH,GAAG,CAAE,EAAE,EAAE;oBACX,wBAAwB,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,CAAC,CAAC,IAAU,EAAE,EAAE,CAAC,iCAC3D,IAAI,KACP,OAAO,EAAE,GAAG,CAAC,EAAE,IACf,CAAC,CAAC;iBACL;YACH,CAAC,CAAC,CAAC;YAEH,wBAAwB,CAAC,wBAAwB,CAAC,CAAC;QACrD,CAAC,CAAA,CAAC;QACF,0BAA0B,EAAE,CAAC;QAC7B,uDAAuD;IACzD,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,qBAAqB,CAAC;AAC/B,CAAC,CAAC;AAEF,kBAAe,yBAAyB,CAAC"}

package/lib/cjs/hooks/usePrevious.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const usePrevious = (value) => {
+    const ref = (0, react_1.useRef)();
+    (0, react_1.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.
+};
+exports.default = usePrevious;
+//# sourceMappingURL=usePrevious.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"usePrevious.js","sourceRoot":"","sources":["../../../src/hooks/usePrevious.ts"],"names":[],"mappings":";;AAAA,iCAA0C;AAE1C,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,EAAE;IACpC,MAAM,GAAG,GAAG,IAAA,cAAM,GAAU,CAAC;IAC7B,IAAA,iBAAS,EAAC,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,kBAAe,WAAW,CAAC"}

package/lib/cjs/index.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCioAutocomplete = exports.SectionItemsList = exports.SectionItem = exports.SearchInput = exports.CioAutocomplete = exports.AutocompleteResults = void 0;
+var AutocompleteResults_1 = require("./components/Autocomplete/AutocompleteResults/AutocompleteResults");
+Object.defineProperty(exports, "AutocompleteResults", { enumerable: true, get: function () { return AutocompleteResults_1.default; } });
+var CioAutocomplete_1 = require("./components/Autocomplete/CioAutocomplete/CioAutocomplete");
+Object.defineProperty(exports, "CioAutocomplete", { enumerable: true, get: function () { return CioAutocomplete_1.default; } });
+var SearchInput_1 = require("./components/Autocomplete/SearchInput/SearchInput");
+Object.defineProperty(exports, "SearchInput", { enumerable: true, get: function () { return SearchInput_1.default; } });
+var SectionItem_1 = require("./components/Autocomplete/SectionItem/SectionItem");
+Object.defineProperty(exports, "SectionItem", { enumerable: true, get: function () { return SectionItem_1.default; } });
+var SectionItemsList_1 = require("./components/Autocomplete/SectionItemsList/SectionItemsList");
+Object.defineProperty(exports, "SectionItemsList", { enumerable: true, get: function () { return SectionItemsList_1.default; } });
+var useCioAutocomplete_1 = require("./hooks/useCioAutocomplete");
+Object.defineProperty(exports, "useCioAutocomplete", { enumerable: true, get: function () { return useCioAutocomplete_1.default; } });
+//# sourceMappingURL=index.js.map

package/lib/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;AAAA,yGAAmH;AAA1G,0HAAA,OAAO,OAAuB;AACvC,6FAAuG;AAA9F,kHAAA,OAAO,OAAmB;AACnC,iFAA2F;AAAlF,0GAAA,OAAO,OAAe;AAC/B,iFAA2F;AAAlF,0GAAA,OAAO,OAAe;AAC/B,gGAA0G;AAAjG,oHAAA,OAAO,OAAoB;AACpC,iEAA2E;AAAlE,wHAAA,OAAO,OAAsB"}

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

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.argTypes = void 0;
+// eslint-disable-next-line
+exports.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/cjs/stories/Autocomplete/argTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"argTypes.js","sourceRoot":"","sources":["../../../../src/stories/Autocomplete/argTypes.ts"],"names":[],"mappings":";;;AAAA,2BAA2B;AACd,QAAA,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/cjs/typeGuards.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isProduct = void 0;
+// Type Guard
+// eslint-disable-next-line
+function isProduct(item) {
+    return item.data.image_url !== undefined;
+}
+exports.isProduct = isProduct;
+//# sourceMappingURL=typeGuards.js.map

package/lib/cjs/typeGuards.js.map

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

package/lib/cjs/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/lib/cjs/types.js.map

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

package/lib/cjs/utils.js

@@ -0,0 +1,72 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.disableStoryActions = exports.stringify = exports.getStoryParams = exports.sleep = exports.clearConstructorRequests = exports.isTrackingRequestSent = exports.camelToStartCase = exports.getIndexOffset = void 0;
+const getIndexOffset = ({ activeSections, sectionIdentifier }) => {
+    let indexOffset = 0;
+    if (sectionIdentifier) {
+        activeSections.find((config) => {
+            var _a;
+            if ((config === null || config === void 0 ? void 0 : config.identifier) === sectionIdentifier)
+                return true; // break out of loop
+            indexOffset += ((_a = config === null || config === void 0 ? void 0 : config.data) === null || _a === void 0 ? void 0 : _a.length) || 0;
+            return false; // continue
+        });
+    }
+    return indexOffset;
+};
+exports.getIndexOffset = getIndexOffset;
+const camelToStartCase = (camelCaseString) => camelCaseString
+    // insert a space before all caps
+    .replace(/([A-Z])/g, ' $1')
+    // uppercase the first character
+    .replace(/^./, (str) => str.toUpperCase());
+exports.camelToStartCase = camelToStartCase;
+function isTrackingRequestSent(trackingRequestUrl) {
+    var _a, _b;
+    // eslint-disable-next-line
+    const trackingRequestsQueue = (_a = window.localStorage) === null || _a === void 0 ? void 0 : _a._constructorio_requests;
+    return (trackingRequestsQueue &&
+        ((_b = JSON.parse(trackingRequestsQueue)) === null || _b === void 0 ? void 0 : _b.some((request) => { var _a; return (_a = request === null || request === void 0 ? void 0 : request.url) === null || _a === void 0 ? void 0 : _a.includes(trackingRequestUrl); })));
+}
+exports.isTrackingRequestSent = isTrackingRequestSent;
+function clearConstructorRequests() {
+    var _a;
+    // eslint-disable-next-line
+    if ((_a = window.localStorage) === null || _a === void 0 ? void 0 : _a._constructorio_requests) {
+        window.localStorage.removeItem('_constructorio_requests');
+    }
+}
+exports.clearConstructorRequests = clearConstructorRequests;
+// Function to emulate pausing between interactions
+function sleep(ms) {
+    // eslint-disable-next-line
+    return new Promise((resolve) => setTimeout(resolve, ms));
+}
+exports.sleep = sleep;
+// More on Story layout: https://storybook.js.org/docs/react/configure/story-layout
+const getStoryParams = (storyCode, templateCode, importCode) => {
+    const code = `
+${importCode}
+${storyCode}
+${templateCode}
+`;
+    return {
+        docs: {
+            source: {
+                code,
+                language: 'jsx',
+                format: true,
+                type: 'code'
+            }
+        }
+    };
+};
+exports.getStoryParams = getStoryParams;
+const stringify = (obj) => JSON.stringify(obj, null, '  ');
+exports.stringify = stringify;
+const disableStoryActions = (story) => {
+    // eslint-disable-next-line
+    story.parameters.actions = { argTypesRegex: null };
+};
+exports.disableStoryActions = disableStoryActions;
+//# sourceMappingURL=utils.js.map

package/lib/cjs/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils.ts"],"names":[],"mappings":";;;AAOO,MAAM,cAAc,GAAmB,CAAC,EAAE,cAAc,EAAE,iBAAiB,EAAE,EAAE,EAAE;IACtF,IAAI,WAAW,GAAG,CAAC,CAAC;IAEpB,IAAI,iBAAiB,EAAE;QACrB,cAAc,CAAC,IAAI,CAAC,CAAC,MAA4B,EAAE,EAAE;;YACnD,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,UAAU,MAAK,iBAAiB;gBAAE,OAAO,IAAI,CAAC,CAAC,oBAAoB;YAC/E,WAAW,IAAI,CAAA,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,0CAAE,MAAM,KAAI,CAAC,CAAC;YACzC,OAAO,KAAK,CAAC,CAAC,WAAW;QAC3B,CAAC,CAAC,CAAC;KACJ;IAED,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAZW,QAAA,cAAc,kBAYzB;AAIK,MAAM,gBAAgB,GAAqB,CAAC,eAAe,EAAE,EAAE,CACpE,eAAe;IACb,iCAAiC;KAChC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC;IAC3B,gCAAgC;KAC/B,OAAO,CAAC,IAAI,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC;AALlC,QAAA,gBAAgB,oBAKkB;AAE/C,SAAgB,qBAAqB,CAAC,kBAAkB;;IACtD,2BAA2B;IAC3B,MAAM,qBAAqB,GAAG,MAAA,MAAM,CAAC,YAAY,0CAAE,uBAAuB,CAAC;IAE3E,OAAO,CACL,qBAAqB;SACrB,MAAA,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,0CAAE,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,WAAC,OAAA,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,0CAAE,QAAQ,CAAC,kBAAkB,CAAC,CAAA,EAAA,CAAC,CAAA,CACjG,CAAC;AACJ,CAAC;AARD,sDAQC;AAED,SAAgB,wBAAwB;;IACtC,2BAA2B;IAC3B,IAAI,MAAA,MAAM,CAAC,YAAY,0CAAE,uBAAuB,EAAE;QAChD,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,yBAAyB,CAAC,CAAC;KAC3D;AACH,CAAC;AALD,4DAKC;AAED,mDAAmD;AACnD,SAAgB,KAAK,CAAC,EAAE;IACtB,2BAA2B;IAC3B,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC;AAC3D,CAAC;AAHD,sBAGC;AACD,mFAAmF;AAC5E,MAAM,cAAc,GAAG,CAAC,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE;IACpE,MAAM,IAAI,GAAG;EACb,UAAU;EACV,SAAS;EACT,YAAY;CACb,CAAC;IAEA,OAAO;QACL,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI;gBACJ,QAAQ,EAAE,KAAK;gBACf,MAAM,EAAE,IAAI;gBACZ,IAAI,EAAE,MAAM;aACb;SACF;KACF,CAAC;AACJ,CAAC,CAAC;AAjBW,QAAA,cAAc,kBAiBzB;AAEK,MAAM,SAAS,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;AAArD,QAAA,SAAS,aAA4C;AAE3D,MAAM,mBAAmB,GAAG,CAAC,KAAK,EAAE,EAAE;IAC3C,2BAA2B;IAC3B,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;AACrD,CAAC,CAAC;AAHW,QAAA,mBAAmB,uBAG9B"}

package/lib/mjs/components/Autocomplete/Autocomplete.css

@@ -0,0 +1,110 @@
+/* Autosuggest Container */
+.cio-autocomplete {
+  position: relative;
+  height: 2rem;
+  padding: 20px;
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+/* Autosuggest Form */
+.cio-autocomplete .cio-form {
+  position: relative;
+  height: 100%;
+  width: 24rem;
+}
+
+.cio-autocomplete .cio-input {
+  width: 100%;
+  height: 100%;
+  border: 1px solid gray;
+  padding: 0 10px;
+  border-radius: 3px;
+  font-size: 1rem;
+}
+
+.cio-autocomplete .cio-submit-btn,
+.cio-autocomplete .cio-clear-btn {
+  position: absolute;
+  top: 1px;
+  bottom: -1px;
+  right: -21px;
+  cursor: pointer;
+}
+
+.cio-autocomplete button:disabled {
+  cursor: not-allowed;
+}
+
+.cio-autocomplete .cio-submit-btn {
+  right: -21px;
+}
+
+.cio-autocomplete .cio-clear-btn {
+  right: 10px;
+}
+
+.cio-autocomplete .cio-icon {
+  display: flex;
+  justify-content: center;
+}
+
+/* Autosuggest Results */
+.cio-autocomplete .cio-results {
+  position: absolute;
+  background-color: white;
+  gap: 20px;
+  padding-left: 0px;
+  list-style: none;
+  display: flex;
+  flex-direction: row;
+  z-index: 1000;
+  margin-top: 5px;
+}
+
+.cio-autocomplete .cio-sectionName {
+  margin: 15px 0;
+  font-size: 1rem;
+}
+
+.cio-autocomplete .cio-section-items {
+  padding: 0;
+}
+
+.cio-autocomplete .cio-item-SearchSuggestions {
+  flex-direction: column;
+  min-width: 160px;
+}
+
+.cio-autocomplete .cio-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  cursor: pointer;
+  list-style: none;
+  padding: 5px;
+  border-bottom: 3px solid transparent;
+}
+
+.cio-autocomplete .cio-item[aria-selected='true'] {
+  background-color: hsl(0, 0%, 90%);
+  border-radius: 4px;
+}
+
+.cio-autocomplete .Products .cio-item {
+  display: inline-flex;
+  align-items: center;
+  width: 25%;
+  height: 140px;
+  padding: 5px 0;
+}
+
+.cio-autocomplete .cio-item p {
+  margin: 0;
+  overflow: hidden;
+}
+
+.cio-autocomplete .cio-item img {
+  width: 100%;
+  max-width: 100px;
+  max-height: 100px;
+}

package/lib/mjs/components/Autocomplete/AutocompleteResults/AutocompleteResults.js

@@ -0,0 +1,21 @@
+import React, { useContext } from 'react';
+import { CioAutocompleteContext } from '../CioAutocompleteProvider';
+import SectionItemsList from '../SectionItemsList/SectionItemsList';
+const DefaultRenderResults = ({ sections }) => sections?.map((section) => (React.createElement(SectionItemsList, { section: section, key: section.identifier })));
+export default function AutocompleteResults(props) {
+    const { children = DefaultRenderResults } = props;
+    const { sections, isOpen, getMenuProps, getItemProps } = useContext(CioAutocompleteContext);
+    const hasResults = sections && sections.some((section) => section?.data?.length);
+    let content;
+    if (isOpen && hasResults) {
+        content = typeof children === 'function' ? children({ sections, getItemProps }) : children;
+    }
+    else {
+        content = null;
+    }
+    const menuProps = {
+        ...getMenuProps()
+    };
+    return React.createElement("ul", { ...menuProps }, content);
+}
+//# sourceMappingURL=AutocompleteResults.js.map

package/lib/mjs/components/Autocomplete/AutocompleteResults/AutocompleteResults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteResults.js","sourceRoot":"","sources":["../../../../../src/components/Autocomplete/AutocompleteResults/AutocompleteResults.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,UAAU,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAWpE,MAAM,oBAAoB,GAAkB,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC3D,QAAQ,EAAE,GAAG,CAAC,CAAC,OAA6B,EAAE,EAAE,CAAC,CAC/C,oBAAC,gBAAgB,IAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,CAAC,UAAU,GAAI,CAChE,CAAC,CAAC;AAEL,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,KAA+B;IACzE,MAAM,EAAE,QAAQ,GAAG,oBAAoB,EAAE,GAAG,KAAK,CAAC;IAClD,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IAE5F,MAAM,UAAU,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;IAEjF,IAAI,OAAO,CAAC;IACZ,IAAI,MAAM,IAAI,UAAU,EAAE;QACxB,OAAO,GAAG,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;KAC5F;SAAM;QACL,OAAO,GAAG,IAAI,CAAC;KAChB;IAED,MAAM,SAAS,GAAG;QAChB,GAAG,YAAY,EAAE;KAClB,CAAC;IAEF,OAAO,+BAAQ,SAAS,IAAG,OAAO,CAAM,CAAC;AAC3C,CAAC"}