@constructor-io/constructorio-ui-autocomplete 1.23.20 → 1.23.22

package/lib/cjs/beaconUtils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.storeRecentAction = exports.getLastAction = exports.getRecentActions = exports.storeRecentSearch = exports.getRecentSearches = exports.storageGetArray = exports.storageGetItem = exports.cleanTerm = exports.storageSetItem = exports.getStorageEngine = exports.CONSTANTS = void 0;
+exports.storeRecentAction = exports.getLastAction = exports.getRecentActions = exports.storeRecentSearch = exports.getRecentSearches = exports.storageGetArray = exports.storageGetItem = exports.cleanTerm = exports.storageRemoveItem = exports.storageSetItem = exports.getStorageEngine = exports.CONSTANTS = void 0;
 // eslint-disable-next-line import/no-cycle
 const utils_1 = require("./utils");
 exports.CONSTANTS = {
@@ -40,6 +40,18 @@ const storageSetItem = (key, value) => {
     }
 };
 exports.storageSetItem = storageSetItem;
+// Remove item in storage
+const storageRemoveItem = (key) => {
+    try {
+        const storageEngine = (0, exports.getStorageEngine)(key.scope);
+        return storageEngine.removeItem(key.key);
+    }
+    catch (e) {
+        (0, utils_1.logger)(`storageRemoveItem error: ${e}`);
+        return null;
+    }
+};
+exports.storageRemoveItem = storageRemoveItem;
 /*
  * Use the text content of the resulting HTML node(s) created from the
  * term

package/lib/cjs/components/Autocomplete/SearchInput/SearchInput.js

@@ -7,7 +7,7 @@ function DefaultRenderInput({ getFormProps, getInputProps, getLabelProps, setQue
     const inputProps = getInputProps();
     return (react_1.default.createElement("form", Object.assign({}, getFormProps()),
         react_1.default.createElement("label", Object.assign({}, getLabelProps(), { htmlFor: 'cio-input' }),
-            react_1.default.createElement("input", Object.assign({ id: 'cio-input' }, inputProps))),
+            react_1.default.createElement("input", Object.assign({ id: 'cio-input' }, inputProps, { enterKeyHint: 'search' }))),
         react_1.default.createElement("button", { className: 'cio-clear-btn', "data-testid": 'cio-clear-btn', hidden: !inputProps.value, onClick: () => {
                 setQuery('');
                 if (inputProps.id) {

package/lib/cjs/hooks/useDownShift.js

@@ -37,7 +37,7 @@ const useDownShift = (_a) => {
                             // This does not apply to custom user defined sections that aren't part of Constructor index
                         }
                         else if (selectedItem.result_id) {
-                            cioClient === null || cioClient === void 0 ? void 0 : cioClient.tracker.trackAutocompleteSelect(selectedItem.value, {
+                            (0, utils_1.trackAutocompleteSelect)(cioClient, selectedItem.value, {
                                 originalQuery: previousQuery,
                                 section: selectedItem.section,
                             });

package/lib/cjs/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.logger = exports.trackSearchSubmit = exports.translate = exports.getItemsForActiveSections = exports.trackRecommendationView = exports.escapeRegExp = exports.getActiveSectionsWithData = exports.getCioClient = exports.disableStoryActions = exports.stringifyWithDefaults = exports.functionStrings = exports.getStoryParams = exports.sleep = exports.clearConstructorRequests = exports.isTrackingRequestSent = exports.toKebabCase = exports.camelToStartCase = exports.getItemPosition = exports.getFeatures = void 0;
+exports.logger = exports.trackAutocompleteSelect = exports.trackSearchSubmit = exports.translate = exports.getItemsForActiveSections = exports.trackRecommendationView = exports.escapeRegExp = exports.getActiveSectionsWithData = exports.getCioClient = exports.disableStoryActions = exports.stringifyWithDefaults = exports.functionStrings = exports.getStoryParams = exports.sleep = exports.clearConstructorRequests = exports.isTrackingRequestSent = exports.toKebabCase = exports.camelToStartCase = exports.getItemPosition = exports.getFeatures = void 0;
 const tslib_1 = require("tslib");
 const constructorio_client_javascript_1 = tslib_1.__importDefault(require("@constructor-io/constructorio-client-javascript"));
 // eslint-disable-next-line import/no-cycle
@@ -233,6 +233,13 @@ const trackSearchSubmit = (cioClient, term, autocompleteData = {}) => {
     (0, beaconUtils_1.storeRecentAction)(beaconUtils_1.CONSTANTS.SEARCH_SUBMIT);
 };
 exports.trackSearchSubmit = trackSearchSubmit;
+const trackAutocompleteSelect = (cioClient, itemName, autocompleteData = {}) => {
+    cioClient === null || cioClient === void 0 ? void 0 : cioClient.tracker.trackAutocompleteSelect(itemName, autocompleteData);
+    if ((autocompleteData === null || autocompleteData === void 0 ? void 0 : autocompleteData.section) === 'Products') {
+        (0, beaconUtils_1.storageRemoveItem)(beaconUtils_1.CONSTANTS.SEARCH_TERM_STORAGE_KEY);
+    }
+};
+exports.trackAutocompleteSelect = trackAutocompleteSelect;
 const logger = (error) => {
     var _a;
     try {

package/lib/cjs/version.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = '1.23.20';
+exports.default = '1.23.22';

package/lib/mjs/beaconUtils.js

@@ -35,6 +35,17 @@ export const storageSetItem = (key, value) => {
         return null;
     }
 };
+// Remove item in storage
+export const storageRemoveItem = (key) => {
+    try {
+        const storageEngine = getStorageEngine(key.scope);
+        return storageEngine.removeItem(key.key);
+    }
+    catch (e) {
+        logger(`storageRemoveItem error: ${e}`);
+        return null;
+    }
+};
 /*
  * Use the text content of the resulting HTML node(s) created from the
  * term

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

@@ -4,7 +4,7 @@ function DefaultRenderInput({ getFormProps, getInputProps, getLabelProps, setQue
     const inputProps = getInputProps();
     return (React.createElement("form", { ...getFormProps() },
         React.createElement("label", { ...getLabelProps(), htmlFor: 'cio-input' },
-            React.createElement("input", { id: 'cio-input', ...inputProps })),
+            React.createElement("input", { id: 'cio-input', ...inputProps, enterKeyHint: 'search' })),
         React.createElement("button", { className: 'cio-clear-btn', "data-testid": 'cio-clear-btn', hidden: !inputProps.value, onClick: () => {
                 setQuery('');
                 if (inputProps.id) {

package/lib/mjs/hooks/useDownShift.js

@@ -1,5 +1,5 @@
 import { useCombobox } from 'downshift';
-import { trackSearchSubmit } from '../utils';
+import { trackSearchSubmit, trackAutocompleteSelect } from '../utils';
 let idCounter = 0;
 const useDownShift = ({ setQuery, items, onSubmit, cioClient, previousQuery = '', ...rest }) => useCombobox({
     id: `cio-autocomplete-${idCounter++}`,
@@ -34,7 +34,7 @@ const useDownShift = ({ setQuery, items, onSubmit, cioClient, previousQuery = ''
                         // This does not apply to custom user defined sections that aren't part of Constructor index
                     }
                     else if (selectedItem.result_id) {
-                        cioClient?.tracker.trackAutocompleteSelect(selectedItem.value, {
+                        trackAutocompleteSelect(cioClient, selectedItem.value, {
                             originalQuery: previousQuery,
                             section: selectedItem.section,
                         });

package/lib/mjs/utils.js

@@ -1,6 +1,6 @@
 import ConstructorIOClient from '@constructor-io/constructorio-client-javascript';
 // eslint-disable-next-line import/no-cycle
-import { storageSetItem, storeRecentSearch, storeRecentAction, CONSTANTS } from './beaconUtils';
+import { storageSetItem, storageRemoveItem, storeRecentSearch, storeRecentAction, CONSTANTS, } from './beaconUtils';
 import { isRecommendationsSection } from './typeGuards';
 import version from './version';
 export function getFeatures(request) {
@@ -213,6 +213,12 @@ export const trackSearchSubmit = (cioClient, term, autocompleteData = {}) => {
     storeRecentSearch(term, {});
     storeRecentAction(CONSTANTS.SEARCH_SUBMIT);
 };
+export const trackAutocompleteSelect = (cioClient, itemName, autocompleteData = {}) => {
+    cioClient?.tracker.trackAutocompleteSelect(itemName, autocompleteData);
+    if (autocompleteData?.section === 'Products') {
+        storageRemoveItem(CONSTANTS.SEARCH_TERM_STORAGE_KEY);
+    }
+};
 export const logger = (error) => {
     try {
         if (typeof process !== 'undefined' && process?.env?.LOGGER) {

package/lib/mjs/version.js

@@ -1 +1 @@
-export default '1.23.20';
+export default '1.23.22';

package/lib/types/beaconUtils.d.ts

@@ -17,6 +17,7 @@ export declare const CONSTANTS: {
 };
 export declare const getStorageEngine: (scope: any) => Storage;
 export declare const storageSetItem: (key: any, value: any) => void | null;
+export declare const storageRemoveItem: (key: any) => void | null;
 export declare const cleanTerm: (term: any) => string;
 export declare const storageGetItem: (key: any) => string | null;
 export declare const storageGetArray: (key: any) => any;

package/lib/types/utils.d.ts

@@ -43,5 +43,6 @@ export declare const trackRecommendationView: (target: HTMLElement, activeSectio
 export declare const getItemsForActiveSections: (activeSectionsWithData: Section[]) => Item[];
 export declare const translate: (word: string, translations?: Translations) => any;
 export declare const trackSearchSubmit: (cioClient: any, term: any, autocompleteData?: {}) => void;
+export declare const trackAutocompleteSelect: (cioClient: any, itemName: any, autocompleteData?: any) => void;
 export declare const logger: (error: any) => void;
 export {};

package/lib/types/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "1.23.20";
+declare const _default: "1.23.22";
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@constructor-io/constructorio-ui-autocomplete",
-  "version": "1.23.20",
+  "version": "1.23.22",
   "description": "Constructor.io Autocomplete UI library for web applications",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",