@athoscommerce/snap-preact 1.2.3-beta.4 → 1.4.0

package/dist/esm/components/src/components/Molecules/SearchInput/SearchInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAY,UAAU,EAA0B,MAAM,cAAc,CAAC;AAC5E,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,IAAI,EAAE,cAAc,EAAW,MAAM,wBAAwB,CAAC;AAqCvE,eAAO,MAAM,WAAW,gBAAyB,gBAAgB;;CA2O/D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,UAAU,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,8BAA8B,GACjC,cAAc,CAAC,gBAAgB,CAAC,CAAC;AAElC,MAAM,MAAM,8BAA8B,GAAG;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC7D,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,OAAO,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC;AAS5C,MAAM,WAAW,eAAe;IAC/B,eAAe,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,kBAAkB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACjC,UAAU,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CACzB"}
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAY,UAAU,EAA0B,MAAM,cAAc,CAAC;AAC5E,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,IAAI,EAAE,cAAc,EAAW,MAAM,wBAAwB,CAAC;AAqCvE,eAAO,MAAM,WAAW,gBAAyB,gBAAgB;;CAwM/D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,UAAU,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,8BAA8B,GACjC,cAAc,CAAC,gBAAgB,CAAC,CAAC;AAElC,MAAM,MAAM,8BAA8B,GAAG;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC7D,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,OAAO,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC;AAQ5C,MAAM,WAAW,eAAe;IAC/B,eAAe,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,kBAAkB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CACjC"}

package/dist/esm/components/src/components/Molecules/SearchInput/SearchInput.js

@@ -51,9 +51,6 @@ export const SearchInput = observer((properties) => {
         clearSearchButton: {
             icon: 'close-thin',
         },
-        chatButton: {
-            icon: 'chat',
-        },
     };
     const props = mergeProps('searchInput', globalTheme, defaultProps, properties);
     props.submitSearchButton = {
@@ -80,15 +77,7 @@ export const SearchInput = observer((properties) => {
         //passed in properties
         ...properties?.closeSearchButton,
     };
-    props.chatButton = {
-        //defaults
-        ...defaultProps.chatButton,
-        //theme
-        ...props.chatButton,
-        //passed in properties
-        ...properties?.chatButton,
-    };
-    const { placeholderText, value, submitSearchButton, closeSearchButton, clearSearchButton, chatButton, inputRef, inputName, onChange, onClick, onKeyDown, onKeyUp, disabled, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    const { placeholderText, value, submitSearchButton, closeSearchButton, clearSearchButton, inputRef, inputName, onChange, onClick, onKeyDown, onKeyUp, disabled, disableStyles, className, internalClassName, treePath, customComponent, } = props;
     if (customComponent) {
         const ComponentOverride = useComponent(snap?.templates?.library.import.component.searchInput || {}, customComponent);
         if (ComponentOverride) {
@@ -155,23 +144,6 @@ export const SearchInput = observer((properties) => {
             theme: props?.theme,
             treePath,
         },
-        chatButton: {
-            // default props
-            ...chatButton,
-            internalClassName: 'ss__search-input__button--chat-button',
-            name: 'chat',
-            onClick: () => {
-                // @ts-ignore - this is a button, so it should have an onClick prop?
-                chatButton?.onClick && chatButton.onClick();
-            },
-            // inherited props
-            ...defined({
-                disableStyles,
-            }),
-            // component theme overrides
-            theme: props?.theme,
-            treePath,
-        },
     };
     const styling = mergeStyles(props, defaultStyles);
     //initialize lang
@@ -196,11 +168,6 @@ export const SearchInput = observer((properties) => {
                 'aria-label': 'Submit Search',
             },
         },
-        chatButton: {
-            attributes: {
-                'aria-label': 'Open Chat',
-            },
-        },
     };
     //deep merge with props.lang
     const lang = deepmerge(defaultLang, props.lang || {});
@@ -210,5 +177,5 @@ export const SearchInput = observer((properties) => {
                             setInputValue(e.target.value || '');
                         }
                         onChange && onChange(e);
-                    }, disabled: disabled }), _jsxs("div", { className: "ss__search-input__icons", children: [clearSearchButton && inputValue?.length ? _jsx(Button, { ...subProps.clearSearchButton, ...mergedLang.clearSearchButton.all }) : null, chatButton ? _jsx(Button, { ...subProps.chatButton, ...mergedLang.chatButton.all }) : null, submitSearchButton && _jsx(Button, { ...subProps.submitSearchButton, ...mergedLang.submitSearchButton.all })] })] }) }));
+                    }, disabled: disabled }), _jsxs("div", { className: "ss__search-input__icons", children: [clearSearchButton && inputValue?.length ? _jsx(Button, { ...subProps.clearSearchButton, ...mergedLang.clearSearchButton.all }) : null, submitSearchButton && _jsx(Button, { ...subProps.submitSearchButton, ...mergedLang.submitSearchButton.all })] })] }) }));
 });

package/dist/esm/components/src/components/Molecules/Slideout/Slideout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slideout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Slideout/Slideout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAS9C,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAgC7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAiJzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,2BAA2B,GAAG,cAAc,CAAC,aAAa,CAAC,CAAC;AACxF,MAAM,MAAM,2BAA2B,GAAG;IACzC,aAAa,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IACrC,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC"}
+{"version":3,"file":"Slideout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Slideout/Slideout.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAS9C,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAgC7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAiIzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,2BAA2B,GAAG,cAAc,CAAC,aAAa,CAAC,CAAC;AACxF,MAAM,MAAM,2BAA2B,GAAG;IACzC,aAAa,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IACrC,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC"}

package/dist/esm/components/src/components/Molecules/Slideout/Slideout.js

@@ -72,33 +72,18 @@ export const Slideout = observer((properties) => {
     // state
     const [isActive, setActive] = useState(Boolean(active));
     const [renderContent, setRenderContent] = useState(Boolean(active));
-    const toggleActive = (force) => {
-        if (typeof force !== 'undefined') {
-            setActive(force);
-            if (force == false) {
-                if (rerender) {
-                    setTimeout(() => {
-                        setRenderContent(false);
-                    }, 250);
-                }
-            }
-            else {
-                setRenderContent(true);
+    const toggleActive = () => {
+        if (isActive) {
+            setActive(false);
+            if (rerender) {
+                setTimeout(() => {
+                    setRenderContent(false);
+                }, 250);
             }
         }
         else {
-            if (isActive) {
-                setActive(false);
-                if (rerender) {
-                    setTimeout(() => {
-                        setRenderContent(false);
-                    }, 250);
-                }
-            }
-            else {
-                setActive(true);
-                setRenderContent(true);
-            }
+            setActive(true);
+            setRenderContent(true);
         }
         document.body.style.overflow = isActive ? 'hidden' : '';
     };
@@ -117,11 +102,8 @@ export const Slideout = observer((properties) => {
     useEffect(() => {
         if (buttonSelector) {
             let button;
-            let buttons;
             if (typeof buttonSelector == 'string') {
-                buttons = document.querySelectorAll(buttonSelector);
-                // for quickview should this be "setActive" instead of toggle?
-                buttons.forEach((button) => button.addEventListener('click', () => toggleActive(true)));
+                button = document.querySelector(buttonSelector);
             }
             else {
                 button = buttonSelector;
@@ -130,7 +112,7 @@ export const Slideout = observer((properties) => {
                 button.addEventListener('click', () => toggleActive());
             }
         }
-    });
+    }, []);
     return isVisible || !rerender ? (_jsxs(CacheProvider, { children: [buttonContent &&
-                (noButtonWrapper ? (cloneWithProps(buttonContent, { toggleActive, active: isActive, treePath })) : (_jsx("div", { className: "ss__slideout__button", onClick: () => toggleActive(), children: cloneWithProps(buttonContent, { active: isActive, treePath }) }))), _jsx("div", { className: classnames('ss__slideout', className, internalClassName, { 'ss__slideout--active': isActive }), style: { visibility: !rerender ? (isVisible ? 'visible' : 'hidden') : 'visible' }, ...styling, children: renderContent && cloneWithProps(children, { toggleActive, active: isActive, treePath }) }), _jsx(Overlay, { ...subProps.overlay, active: isActive, onClick: () => toggleActive(false) })] })) : null;
+                (noButtonWrapper ? (cloneWithProps(buttonContent, { toggleActive, active: isActive, treePath })) : (_jsx("div", { className: "ss__slideout__button", onClick: () => toggleActive(), children: cloneWithProps(buttonContent, { active: isActive, treePath }) }))), _jsx("div", { className: classnames('ss__slideout', className, internalClassName, { 'ss__slideout--active': isActive }), style: { visibility: !rerender ? (isVisible ? 'visible' : 'hidden') : 'visible' }, ...styling, children: renderContent && cloneWithProps(children, { toggleActive, active: isActive, treePath }) }), _jsx(Overlay, { ...subProps.overlay, active: isActive, onClick: toggleActive })] })) : null;
 });

package/dist/esm/components/src/components/Molecules/TemplatesEditor/Components/AbstractedControls.js

@@ -18,11 +18,11 @@ export const AbstractedControls = observer((properties) => {
         console.warn(`No controls found for feature: ${feature}`, controlSection, controlGroups);
         return null;
     }
-    const showGroupReset = enableGroupReset && controlGroups.some((group) => group.controls.some((control) => control.shouldShowReset()));
+    const showGroupReset = enableGroupReset && controlGroups.some((group) => group.controls.some((control) => control.shouldShowReset(data)));
     const resetAll = () => {
         controlGroups.forEach((group) => {
             group.controls.forEach((control) => {
-                if (control.shouldShowReset()) {
+                if (control.shouldShowReset(data)) {
                     control.onReset(data);
                 }
             });
@@ -31,10 +31,10 @@ export const AbstractedControls = observer((properties) => {
     return (_jsxs("div", { className: "ss__template-editor__abstracted-controls", ...styling, children: [title && (_jsxs("div", { className: "control-title", children: [_jsx("h3", { children: title }), showGroupReset && (_jsx("span", { className: "reset", children: _jsx("button", { title: "Reset", onClick: () => {
                                 resetAll();
                             }, children: _jsx(Reset, {}) }) }))] })), controlGroups.map((group) => {
-                const showGroupReset = group.showReset && group.controls.some((control) => control.shouldShowReset());
+                const showGroupReset = group.showReset && group.controls.some((control) => control.shouldShowReset(data));
                 const resetGroup = () => {
                     group.controls.forEach((control) => {
-                        if (control.shouldShowReset()) {
+                        if (control.shouldShowReset(data)) {
                             control.onReset(data);
                         }
                         else {
@@ -44,7 +44,7 @@ export const AbstractedControls = observer((properties) => {
                 return (_jsxs("div", { className: "group", children: [group.title && (_jsxs("div", { className: "group-title", children: [_jsx("h4", { title: group.description, children: group.title }), showGroupReset && (_jsx("span", { className: "reset", children: showGroupReset ? (_jsx("button", { title: "Reset", onClick: () => {
                                             resetGroup();
                                         }, children: _jsx(Reset, {}) })) : null }))] })), group.controls.map((control, index) => {
-                            return (_jsx(Control, { type: control.type, label: control.label, description: control.description, showReset: control.shouldShowReset(), onChange: (value) => control.onValueChange(value, data), onReset: () => control.onReset(data), display: control.getDisplayState ? control.getDisplayState(data) : 'visible', value: control.getValue(data), options: control.getOptions ? control.getOptions(data) : [] }, index));
+                            return (_jsx(Control, { type: control.type, label: control.label, description: control.description, showReset: control.shouldShowReset(data), onChange: (value) => control.onValueChange(value, data), onReset: () => control.onReset(data), display: control.getDisplayState ? control.getDisplayState(data) : 'visible', value: control.getValue(data), options: control.getOptions ? control.getOptions(data) : [] }, index));
                         })] }, group.title));
             })] }));
 });

package/dist/esm/components/src/components/Molecules/TemplatesEditor/Components/Control.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../../../../../../../components/src/components/Molecules/TemplatesEditor/Components/Control.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAGpH,eAAO,MAAM,OAAO,WAAoB,YAAY;;CAkGlD,CAAC;AAEH,KAAK,YAAY,GAAG;IACnB,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CACzC,CAAC"}
+{"version":3,"file":"Control.d.ts","sourceRoot":"","sources":["../../../../../../../../components/src/components/Molecules/TemplatesEditor/Components/Control.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAGpH,eAAO,MAAM,OAAO,WAAoB,YAAY;;CAoGlD,CAAC;AAEH,KAAK,YAAY,GAAG;IACnB,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,aAAa,CAAC;IACrB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CACzC,CAAC"}

package/dist/esm/components/src/components/Molecules/TemplatesEditor/Components/Control.js

@@ -8,36 +8,36 @@ export const Control = observer((props) => {
     useEffect(() => {
         setInputValue(value);
     }, [value]);
-    return display === 'hidden' ? null : (_jsxs("div", { className: "option checkbox", children: [_jsx("label", { children: label }), _jsx("div", { className: "reset", children: showReset ? (_jsx("button", { title: "Reset", onClick: () => {
-                        onReset();
-                    }, children: _jsx(Reset, {}) })) : null }), _jsx("div", { className: "value", title: description, children: (() => {
-                    switch (type) {
-                        case 'text': {
-                            return _jsx("input", { type: "text", value: value, onChange: (e) => onChange(e.target.value), disabled: display === 'disabled' });
+    return display === 'hidden' ? null : (_jsx("div", { className: `control ${type} ${display}`, children: _jsxs("div", { className: "option checkbox", children: [_jsx("label", { children: label }), _jsx("div", { className: "reset", children: showReset ? (_jsx("button", { title: "Reset", onClick: () => {
+                            onReset();
+                        }, children: _jsx(Reset, {}) })) : null }), _jsx("div", { className: "value", title: description, children: (() => {
+                        switch (type) {
+                            case 'text': {
+                                return _jsx("input", { type: "text", value: value, onChange: (e) => onChange(e.target.value), disabled: display === 'disabled' });
+                            }
+                            case 'number': {
+                                return (_jsx("input", { type: "number", value: value, onChange: (e) => onChange(Number(e.target.value)), disabled: display === 'disabled' }));
+                            }
+                            case 'checkbox': {
+                                return (_jsx("input", { type: "checkbox", checked: value, onChange: (e) => onChange(e.target.checked), disabled: display === 'disabled' }));
+                            }
+                            case 'dropdown': {
+                                return (_jsx("select", { onChange: (e) => onChange(e.target.value), disabled: display === 'disabled', value: value, children: options?.map((group, groupIndex) => group.group ? (_jsx("optgroup", { label: group.group, children: group.options.map((option, optionIndex) => (_jsx("option", { value: option.value, children: option.label || option.value }, `${groupIndex}-${optionIndex}`))) }, groupIndex)) : (group.options.map((option, optionIndex) => (_jsx("option", { value: option.value, children: option.label || option.value }, `${groupIndex}-${optionIndex}`))))) }));
+                            }
+                            case 'color': {
+                                return (_jsxs(_Fragment, { children: [_jsx("input", { type: "color", value: value, onChange: (e) => {
+                                                setInputValue(e.target.value);
+                                                onChange(e.target.value);
+                                            }, disabled: display === 'disabled' }), _jsx("input", { type: "text", className: isValidHexColor(inputValue) ? '' : 'invalid', value: inputValue, onChange: (e) => {
+                                                setInputValue(e.target.value);
+                                                isValidHexColor(e.target.value) && onChange(e.target.value);
+                                            }, disabled: display === 'disabled' })] }));
+                            }
+                            default: {
+                                return null;
+                            }
                         }
-                        case 'number': {
-                            return (_jsx("input", { type: "number", value: value, onChange: (e) => onChange(Number(e.target.value)), disabled: display === 'disabled' }));
-                        }
-                        case 'checkbox': {
-                            return (_jsx("input", { type: "checkbox", checked: value, onChange: (e) => onChange(e.target.checked), disabled: display === 'disabled' }));
-                        }
-                        case 'dropdown': {
-                            return (_jsx("select", { onChange: (e) => onChange(e.target.value), disabled: display === 'disabled', value: value, children: options?.map((group, groupIndex) => group.group ? (_jsx("optgroup", { label: group.group, children: group.options.map((option, optionIndex) => (_jsx("option", { value: option.value, children: option.label || option.value }, `${groupIndex}-${optionIndex}`))) }, groupIndex)) : (group.options.map((option, optionIndex) => (_jsx("option", { value: option.value, children: option.label || option.value }, `${groupIndex}-${optionIndex}`))))) }));
-                        }
-                        case 'color': {
-                            return (_jsxs(_Fragment, { children: [_jsx("input", { type: "color", value: value, onChange: (e) => {
-                                            setInputValue(e.target.value);
-                                            onChange(e.target.value);
-                                        }, disabled: display === 'disabled' }), _jsx("input", { type: "text", className: isValidHexColor(inputValue) ? '' : 'invalid', value: inputValue, onChange: (e) => {
-                                            setInputValue(e.target.value);
-                                            isValidHexColor(e.target.value) && onChange(e.target.value);
-                                        }, disabled: display === 'disabled' })] }));
-                        }
-                        default: {
-                            return null;
-                        }
-                    }
-                })() })] }));
+                    })() })] }) }));
 });
 // function to validate hex color values of the type: #333333
 const isValidHexColor = (color) => {

package/dist/esm/components/src/components/Molecules/TemplatesEditor/TemplatesEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TemplatesEditor.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/TemplatesEditor/TemplatesEditor.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wEAAwE,CAAC;AAC7G,OAAO,EAAE,cAAc,EAAiB,MAAM,mDAAmD,CAAC;AAClG,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAsTnD,eAAO,MAAM,eAAe,gBAAyB,oBAAoB;;CAuGvE,CAAC;AAYH,MAAM,WAAW,oBAAoB;IACpC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,EAAE,cAAc,CAAC;IAC/B,WAAW,EAAE,mBAAmB,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC;CACpB"}
+{"version":3,"file":"TemplatesEditor.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/TemplatesEditor/TemplatesEditor.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wEAAwE,CAAC;AAC7G,OAAO,EAAE,cAAc,EAAE,MAAM,mDAAmD,CAAC;AACnF,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAqTnD,eAAO,MAAM,eAAe,gBAAyB,oBAAoB;;CAoIvE,CAAC;AAYH,MAAM,WAAW,oBAAoB;IACpC,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,cAAc,EAAE,cAAc,CAAC;IAC/B,WAAW,EAAE,mBAAmB,CAAC;IACjC,IAAI,EAAE,aAAa,CAAC;CACpB"}

package/dist/esm/components/src/components/Molecules/TemplatesEditor/TemplatesEditor.js

@@ -5,7 +5,6 @@ import { observer } from 'mobx-react-lite';
 import { CacheProvider } from '../../../providers';
 import { AthosCommerceLogo } from './Assets';
 import { AbstractedControls } from './Components/AbstractedControls';
-import { DropdownControl } from './Controls/Dropdown';
 const CSS = {
     TemplatesEditor: ({}) => css({
         display: 'flex',
@@ -290,47 +289,35 @@ const CSS = {
     }),
 };
 export const TemplatesEditor = observer((properties) => {
-    const { onRemoveClick, templatesStore, editorStore, snap } = properties;
+    const { onRemoveClick, editorStore, snap } = properties;
     const styling = {
-        css: [CSS.TemplatesEditor({ ...properties })],
+        css: [CSS.TemplatesEditor(properties)],
     };
-    return (_jsx(CacheProvider, { children: _jsxs("div", { className: classnames('ss__template-editor', { 'ss__template-editor--collapsed': editorStore.state.hidden }), ...styling, onClick: (e) => {
+    return (_jsx(CacheProvider, { children: _jsxs("div", { className: classnames('ss__template-editor', { 'ss__template-editor--collapsed': editorStore.storedState.hidden }), ...styling, onClick: (e) => {
                 e.stopPropagation();
                 editorStore.toggleHide(false);
-            }, children: [_jsxs("div", { className: "ss__template-editor__header", children: [_jsx("div", { className: 'logo', children: _jsx(AthosCommerceLogo, {}) }), _jsxs("div", { className: 'header-actions', onClick: (e) => {
+            }, children: [_jsxs("div", { className: "ss__template-editor__header", children: [_jsx("div", { className: 'logo', onClick: (e) => {
+                                e.stopPropagation();
+                                editorStore.toggleHide(false);
+                            }, children: _jsx(AthosCommerceLogo, {}) }), _jsxs("div", { className: 'header-actions', onClick: (e) => {
                                 e.preventDefault();
                                 e.stopPropagation();
                                 editorStore.toggleHide(true);
-                            }, children: [_jsx("button", { onClick: (e) => {
-                                        e.stopPropagation();
-                                        if (confirm('Closing the editor will disable modification.')) {
-                                            onRemoveClick();
-                                        }
-                                    }, children: "Close" }), _jsx("button", { onClick: () => {
-                                        editorStore.toggleHide(true);
-                                    }, children: "Hide" })] })] }), _jsxs("aside", { children: [_jsx("div", { className: "tab-selection", children: editorStore.tabs.map((tab, i) => {
-                                return (_jsx("div", { className: classnames('tab', { active: editorStore.state.activeTab === tab }), onClick: () => {
+                            }, children: [_jsx("div", { className: "", children: _jsx("button", { onClick: (e) => {
+                                            e.stopPropagation();
+                                            if (confirm('Closing the editor will disable modification.')) {
+                                                onRemoveClick();
+                                            }
+                                        }, children: "Close" }) }), _jsx("div", { className: "", children: _jsx("button", { onClick: (e) => {
+                                            e.stopPropagation();
+                                            const config = editorStore.generateTemplatesConfig();
+                                            navigator.clipboard.writeText(JSON.stringify(config, null, 4));
+                                            alert('Configuration copied to clipboard');
+                                        }, children: "Copy" }) }), _jsx("div", { className: "", children: _jsx("button", { onClick: () => {
+                                            editorStore.toggleHide(true);
+                                        }, children: "Hide" }) })] })] }), _jsxs("aside", { children: [_jsx("div", { className: "tab-selection", children: editorStore.tabs.map((tab, i) => {
+                                return (_jsx("div", { className: classnames('tab', { active: editorStore.storedState.activeTab === tab }), onClick: () => {
                                         editorStore.switchTabs(tab);
                                     }, children: tab }, i));
-                            }) }), _jsxs("div", { className: "tab-view", children: [_jsx("div", { className: "tab-view-shadow" }), _jsxs("div", { className: "tab-view-content", children: [editorStore.state.activeTab === 'templates' ? (_jsxs(_Fragment, { children: [_jsx(TemplateTargetSettings, { feature: "search", templatesStore: templatesStore }), _jsx(AbstractedControls, { editorStore: editorStore, data: snap.controllers.search, feature: "controllers/search" }), _jsx(TemplateTargetSettings, { feature: "autocomplete", templatesStore: templatesStore }), _jsx(AbstractedControls, { editorStore: editorStore, data: snap.controllers.autocomplete, feature: "controllers/autocomplete" }), _jsx(TemplateTargetSettings, { feature: "recommendation/default", templatesStore: templatesStore }), _jsx(TemplateTargetSettings, { feature: "recommendation/bundle", templatesStore: templatesStore })] })) : (''), editorStore.state.activeTab === 'configuration' ? (_jsxs(_Fragment, { children: [_jsx(AbstractedControls, { title: "Project Configuration", editorStore: editorStore, feature: "templates/config" }), _jsx(AbstractedControls, { title: "Theme Configuration", editorStore: editorStore, feature: "templates/theme" })] })) : ('')] }), _jsx("div", { className: "tab-view-shadow bottom" })] })] }), _jsx("footer", {})] }) }));
-});
-const TemplateTargetSettings = observer((props) => {
-    const { feature, templatesStore } = props;
-    const [type, recsType = ''] = feature.split('/');
-    const idPrefix = `${type}${recsType ? `-${recsType}` : ''}`;
-    const config = templatesStore.config;
-    const configTarget = config[type]?.[recsType]?.[`${recsType.charAt(0).toUpperCase() + recsType.slice(1)}`] || config[type]?.targets?.[0];
-    const libraryComponents = templatesStore.library.components;
-    const libraryTemplates = recsType ? libraryComponents[type]?.[recsType] : libraryComponents[type];
-    // const libraryResultComponents = libraryComponents?.result;
-    // const DEFAULT_RESULT_COMPONENT = 'Result';
-    const activeTarget = templatesStore.getTarget(feature, configTarget.selector);
-    const showTemplateReset = Boolean(activeTarget?.component) && activeTarget?.component !== configTarget?.component;
-    // const firstLetterOfComponent = configTarget.component.charAt(0).toLowerCase();
-    // const restOfComponent = configTarget.component.slice(1);
-    // const camelCaseComponent = firstLetterOfComponent + restOfComponent;
-    // const currentTargetActiveResultComponent = config?.theme?.overrides[`${camelCaseComponent} result`]?.customComponent || config?.theme?.overrides[`result`]?.customComponent || DEFAULT_RESULT_COMPONENT;
-    // const showResultTemplateReset =
-    // 	(currentTargetActiveResultComponent || DEFAULT_RESULT_COMPONENT) != (currentTargetActiveResultComponent ||DEFAULT_RESULT_COMPONENT);
-    return (_jsxs("div", { className: "template-target-settings", children: [_jsx("h3", { children: type.charAt(0).toUpperCase() + type.slice(1) + (recsType ? ` (${recsType})` : '') }), !recsType && (_jsxs("div", { className: "option", children: [_jsx("label", { htmlFor: `${idPrefix}-target`, children: "Target" }), _jsx("div", { className: "reset" }), _jsx("div", { className: "value", children: _jsx("input", { id: `${idPrefix}-target`, type: "text", placeholder: '', disabled: true, value: configTarget.selector }) })] })), _jsx(DropdownControl, { label: 'Template', description: '', showReset: showTemplateReset, options: Object.keys(libraryTemplates), onReset: () => activeTarget?.setComponent(configTarget?.component), disabled: false, value: activeTarget?.component, onChange: (value) => activeTarget?.setComponent(`${value}`) }, `${idPrefix}-template`)] }));
+                            }) }), _jsxs("div", { className: "tab-view", children: [_jsx("div", { className: "tab-view-shadow" }), _jsxs("div", { className: "tab-view-content", children: [editorStore.storedState.activeTab === 'templates' ? (_jsxs(_Fragment, { children: [_jsx("h1", { children: "Search" }), _jsx(AbstractedControls, { editorStore: editorStore, data: 0, feature: "targets/search" }), _jsx(AbstractedControls, { editorStore: editorStore, data: snap.controllers.search, feature: "controllers/search" }), _jsx("h1", { children: "Autocomplete" }), _jsx(AbstractedControls, { editorStore: editorStore, data: 0, feature: "targets/autocomplete" }), _jsx(AbstractedControls, { editorStore: editorStore, data: snap.controllers.autocomplete, feature: "controllers/autocomplete" })] })) : (''), editorStore.storedState.activeTab === 'configuration' ? (_jsxs(_Fragment, { children: [_jsx(AbstractedControls, { title: "Project Configuration", editorStore: editorStore, feature: "templates/config" }), _jsx(AbstractedControls, { title: "Theme Configuration", editorStore: editorStore, feature: "templates/theme" })] })) : ('')] }), _jsx("div", { className: "tab-view-shadow bottom" })] })] }), _jsx("footer", {})] }) }));
 });

package/dist/esm/components/src/components/Organisms/Facet/Facet.js

@@ -419,7 +419,7 @@ export const Facet = observer((properties) => {
                 ? ''
                 : 'ss__facet--showing-all'), children: justContent ? (_jsx(FacetContent, { ...facetContentProps, mergedLang: mergedLang })) : (_jsx(Dropdown, { ...subProps.dropdown, open: disableCollapse || !facet?.collapsed, onClick: () => !disableCollapse && facet.toggleCollapse && facet?.toggleCollapse(), disableA11y: true, button: _jsxs("div", { className: "ss__facet__header", ref: (e) => useA11y(e, disableCollapse ? -1 : 0), role: "heading", "aria-level": 3, ...mergedLang.dropdownButton.attributes, children: [_jsxs("span", { className: "ss__facet__header__inner", children: [_jsx("span", { ...mergedLang.dropdownButton.value, children: facet?.label }), showSelectedCount && selectedCount && facet.type !== 'range' ? (_jsx("span", { className: "ss__facet__header__selected-count", children: hideSelectedCountParenthesis ? selectedCount : `(${selectedCount})` })) : null, (mergedLang.clearAllText.value || clearAllIcon) && selectedCount ? (_jsx(Button, { ...subProps.button, internalClassName: "ss__facet__header__clear-all", name: 'reset-facet', onClick: (e) => {
                                         e.stopPropagation();
-                                        facet?.clear.url?.link.onClick();
+                                        facet?.clear.url.link.onClick();
                                     }, icon: clearAllIcon ? clearAllIcon : undefined, children: mergedLang.clearAllText.value && showClearAllText ? _jsx("label", { ...mergedLang.clearAllText.all }) : null })) : (_jsx(_Fragment, {}))] }), !disableCollapse && (_jsx(Icon, { ...subProps.icon, ...(facet?.collapsed
                                 ? { ...(typeof iconExpand == 'string' ? { icon: iconExpand } : iconExpand) }
                                 : { ...(typeof iconCollapse == 'string' ? { icon: iconCollapse } : iconCollapse) }), name: facet?.collapsed ? 'expand' : 'collapse' }))] }), children: _jsx(FacetContent, { ...facetContentProps, mergedLang: mergedLang }) })) }) })) : null;

package/dist/esm/components/src/components/Organisms/FacetsHorizontal/FacetsHorizontal.js

@@ -237,7 +237,7 @@ export const FacetsHorizontal = observer((properties) => {
                                 }
                             }, button: _jsxs("div", { className: "ss__dropdown__button__heading", ...mergedLang.dropdownButton.attributes, children: [_jsxs("div", { className: "ss__facet__header__inner", children: [_jsx("span", { ...mergedLang.dropdownButton.value, children: facet?.label }), showSelectedCount && selectedCount && facet.type !== 'range' ? (_jsx("span", { className: "ss__facet__header__selected-count", children: hideSelectedCountParenthesis ? selectedCount : `(${selectedCount})` })) : null, (mergedLang.clearAllText.value || clearAllIcon) && selectedCount ? (_jsx(Button, { ...subProps.button, internalClassName: "ss__facet__header__clear-all", name: 'reset-facet', onClick: (e) => {
                                                     e.stopPropagation();
-                                                    facet?.clear.url?.link.onClick();
+                                                    facet?.clear.url.link.onClick();
                                                 }, icon: clearAllIcon ? clearAllIcon : undefined, children: mergedLang.clearAllText.value && showClearAllText ? _jsx("label", { ...mergedLang.clearAllText.all }) : null })) : (_jsx(_Fragment, {}))] }), _jsx(Icon, { ...subProps.icon, ...(selectedFacet?.field === facet.field
                                             ? { ...(typeof iconExpand == 'string' ? { icon: iconExpand } : iconExpand) }
                                             : { ...(typeof iconCollapse == 'string' ? { icon: iconCollapse } : iconCollapse) }) })] }), disableOverlay: false, children: _jsx(Facet, { ...subProps.facet, facet: facet }) }));

package/dist/esm/components/src/components/Organisms/FilterSummary/FilterSummary.d.ts

@@ -15,8 +15,8 @@ export type FilterSummaryTemplatesLegalProps = {
     type?: 'inline' | 'list';
     title?: string;
     hideTitle?: boolean;
-    filterIcon?: IconType | Partial<IconProps>;
-    clearAllIcon?: IconType | Partial<IconProps>;
+    filterIcon?: IconType | Partial<IconProps> | false;
+    clearAllIcon?: IconType | Partial<IconProps> | false;
     separator?: string;
     hideFacetLabel?: boolean;
     clearAllLabel?: string;

package/dist/esm/components/src/components/Organisms/FilterSummary/FilterSummary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterSummary.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/FilterSummary/FilterSummary.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC/F,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AA2D7D,eAAO,MAAM,aAAa,gBAAyB,kBAAkB;;CAyHnE,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG;IAChC,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,CAAC;IACvD,IAAI,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CAClC,GAAG,gCAAgC,GACnC,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAEpC,MAAM,MAAM,gCAAgC,GAAG;IAC9C,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC3C,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,EAAE,YAAY,EAAE,UAAU,KAAK,IAAI,CAAC;IACjG,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CAC/E,CAAC;AAEF,MAAM,WAAW,iBAAiB;IACjC,KAAK,EAAE,IAAI,CAAC;QACX,OAAO,EAAE,UAAU,EAAE,CAAC;KACtB,CAAC,CAAC;IACH,aAAa,EAAE,IAAI,CAAC;QACnB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;KACf,CAAC,CAAC;CACH"}
+{"version":3,"file":"FilterSummary.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/FilterSummary/FilterSummary.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC/F,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AA2D7D,eAAO,MAAM,aAAa,gBAAyB,kBAAkB;;CAyHnE,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG;IAChC,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,CAAC;IACvD,IAAI,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CAClC,GAAG,gCAAgC,GACnC,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAEpC,MAAM,MAAM,gCAAgC,GAAG;IAC9C,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC;IACnD,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,EAAE,YAAY,EAAE,UAAU,KAAK,IAAI,CAAC;IACjG,eAAe,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CAC/E,CAAC;AAEF,MAAM,WAAW,iBAAiB;IACjC,KAAK,EAAE,IAAI,CAAC;QACX,OAAO,EAAE,UAAU,EAAE,CAAC;KACtB,CAAC,CAAC;IACH,aAAa,EAAE,IAAI,CAAC;QACnB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;KACf,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Organisms/Results/Results.js

@@ -19,7 +19,7 @@ const defaultStyles = ({ gapSize, columns }) => {
         flexFlow: 'row wrap',
         gap: gapSize,
         gridTemplateRows: 'auto',
-        gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,
+        gridTemplateColumns: `repeat(${columns}, 1fr)`,
         '& .ss__result, & .ss__result-layout': {
             boxSizing: 'border-box',
             flex: '0 1 auto',

package/dist/esm/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteFixed.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AA+CjG,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CAsN3E,CAAC;AAEH,UAAU,WAAW;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CACf;AAQD,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,oCAAoC,GACvC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;CAC9C,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"AutocompleteFixed.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AA+CjG,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CAmN3E,CAAC;AAEH,UAAU,WAAW;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CACf;AAQD,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,oCAAoC,GACvC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;CAC9C,GAAG,uBAAuB,CAAC"}

package/dist/esm/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.js

@@ -138,9 +138,6 @@ export const AutocompleteFixed = observer((properties) => {
             closeSearchButton: {
                 onClick: () => reset(),
             },
-            chatButton: {
-                onClick: () => controller.openChat(),
-            },
             inputName: inputName,
             // inherited props
             ...defined({

package/dist/esm/components/src/components/Templates/AutocompleteModal/AutocompleteModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteModal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteModal/AutocompleteModal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AA8DjG,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CAiK3E,CAAC;AAQH,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,oCAAoC,GACvC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"AutocompleteModal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteModal/AutocompleteModal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AA4DjG,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CA8J3E,CAAC;AAQH,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,oCAAoC,GACvC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,uBAAuB,CAAC"}

package/dist/esm/components/src/components/Templates/AutocompleteModal/AutocompleteModal.js

@@ -21,7 +21,6 @@ const defaultStyles = ({ width, height, theme }) => {
         right: '0',
         top: '0',
         zIndex: 1001,
-        pointerEvents: 'none',
         '& .ss__autocomplete-modal__inner': {
             position: 'absolute',
             left: 0,
@@ -36,7 +35,6 @@ const defaultStyles = ({ width, height, theme }) => {
             width: width,
             height: height,
             maxWidth: '100vw',
-            pointerEvents: 'auto',
         },
         '& .ss__overlay': {
             zIndex: 1000,
@@ -151,9 +149,6 @@ export const AutocompleteModal = observer((properties) => {
                 onClick: () => reset(),
                 icon: 'angle-left',
             },
-            chatButton: {
-                onClick: () => controller.openChat(),
-            },
             inputName: inputName,
             // inherited props
             ...defined({

package/dist/esm/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteSlideout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AACjG,OAAO,EAAE,kBAAkB,EAA2B,MAAM,0BAA0B,CAAC;AAsBvF,eAAO,MAAM,oBAAoB,gBAAyB,yBAAyB;;CAyJjF,CAAC;AAOH,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,uCAAuC,GAC1C,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,uCAAuC,GAAG;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"AutocompleteSlideout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AACjG,OAAO,EAAE,kBAAkB,EAA2B,MAAM,0BAA0B,CAAC;AAsBvF,eAAO,MAAM,oBAAoB,gBAAyB,yBAAyB;;CAsJjF,CAAC;AAOH,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,uCAAuC,GAC1C,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,uCAAuC,GAAG;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,uBAAuB,CAAC"}

package/dist/esm/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.js

@@ -100,9 +100,6 @@ export const AutocompleteSlideout = observer((properties) => {
                 onClick: () => reset(),
                 icon: 'angle-left',
             },
-            chatButton: {
-                onClick: () => controller.openChat(),
-            },
             // inherited props
             ...defined({
                 disableStyles,

package/dist/esm/components/src/hooks/useAcRenderedInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAcRenderedInput.d.ts","sourceRoot":"","sources":["../../../../../components/src/hooks/useAcRenderedInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAY,UAAU,EAAa,MAAM,cAAc,CAAC;AAE/D,wBAAgB,kBAAkB,CAAC,EAClC,KAAK,EACL,UAAU,EACV,WAAW,EACX,cAAc,EACd,gBAAgB,EAChB,SAAS,GACT,EAAE;IACF,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,sBAAsB,CAAC;IACnC,gBAAgB,EAAE,UAAU,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC,kBA2DA"}
+{"version":3,"file":"useAcRenderedInput.d.ts","sourceRoot":"","sources":["../../../../../components/src/hooks/useAcRenderedInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAY,UAAU,EAAa,MAAM,cAAc,CAAC;AAE/D,wBAAgB,kBAAkB,CAAC,EAClC,KAAK,EACL,UAAU,EACV,WAAW,EACX,cAAc,EACd,gBAAgB,EAChB,SAAS,GACT,EAAE;IACF,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,sBAAsB,CAAC;IACnC,gBAAgB,EAAE,UAAU,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CACtC,kBAkHA"}

package/dist/esm/components/src/hooks/useAcRenderedInput.js

@@ -18,6 +18,12 @@ export function useAcRenderedInput({ input, controller, renderInput, buttonSelec
         });
     };
     useEffect(() => {
+        // track pointer-initiated focus to avoid rendering the overlay between mousedown and mouseup,
+        // which splits the click target to the nearest common ancestor instead of the input element
+        let pointerFocus = false;
+        const clearPointerFocus = () => {
+            pointerFocus = false;
+        };
         if (renderInput && buttonSelector) {
             let button;
             if (typeof buttonSelector == 'string') {
@@ -27,31 +33,75 @@ export function useAcRenderedInput({ input, controller, renderInput, buttonSelec
                 button = buttonSelector;
             }
             if (button) {
-                button.addEventListener('click', (e) => {
+                const onMousedown = () => {
+                    pointerFocus = true;
+                };
+                const onClickBtn = (e) => {
+                    pointerFocus = false;
                     e.stopPropagation();
                     onClick();
-                });
-                button.addEventListener('focus', () => onClick());
-                button.addEventListener('select', () => onClick());
+                };
+                const onFocusBtn = () => {
+                    if (!pointerFocus) {
+                        onClick();
+                    }
+                };
+                const onSelectBtn = () => onClick();
+                button.addEventListener('mousedown', onMousedown);
+                document.addEventListener('mouseup', clearPointerFocus, true);
+                button.addEventListener('click', onClickBtn);
+                button.addEventListener('focus', onFocusBtn);
+                button.addEventListener('select', onSelectBtn);
+                return () => {
+                    button.removeEventListener('mousedown', onMousedown);
+                    document.removeEventListener('mouseup', clearPointerFocus, true);
+                    button.removeEventListener('click', onClickBtn);
+                    button.removeEventListener('focus', onFocusBtn);
+                    button.removeEventListener('select', onSelectBtn);
+                };
             }
         }
         else {
             if (setActive) {
-                input.addEventListener('click', (e) => {
+                const onMousedown = () => {
+                    pointerFocus = true;
+                };
+                const onClickInput = (e) => {
+                    pointerFocus = false;
                     e.stopPropagation();
                     setActive(true);
-                });
-                input.addEventListener('focus', () => setActive(true));
-                input.addEventListener('select', () => setActive(true));
+                };
+                const onFocusInput = () => {
+                    if (!pointerFocus) {
+                        setActive(true);
+                    }
+                };
+                const onSelectInput = () => setActive(true);
+                input.addEventListener('mousedown', onMousedown);
+                document.addEventListener('mouseup', clearPointerFocus, true);
+                input.addEventListener('click', onClickInput);
+                input.addEventListener('focus', onFocusInput);
+                input.addEventListener('select', onSelectInput);
+                return () => {
+                    input.removeEventListener('mousedown', onMousedown);
+                    document.removeEventListener('mouseup', clearPointerFocus, true);
+                    input.removeEventListener('click', onClickInput);
+                    input.removeEventListener('focus', onFocusInput);
+                    input.removeEventListener('select', onSelectInput);
+                };
             }
         }
     }, []);
     // this is used to keep the values consistent between the native input and the rendered input
     useEffect(() => {
-        if (input !== _input) {
-            _input?.addEventListener('input', () => {
+        if (input !== _input && _input) {
+            const onInput = () => {
                 input.value = _input.value;
-            });
+            };
+            _input.addEventListener('input', onInput);
+            return () => {
+                _input.removeEventListener('input', onInput);
+            };
         }
     }, [_input]);
     return _input;

package/dist/esm/components/src/hooks/useMediaQuery.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../../../../components/src/hooks/useMediaQuery.tsx"],"names":[],"mappings":"AAGA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAgB/E"}
+{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../../../../components/src/hooks/useMediaQuery.tsx"],"names":[],"mappings":"AAGA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAmB/E"}