@athoscommerce/snap-preact 1.7.1-beta.121 → 1.8.0

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

@@ -7,11 +7,12 @@ import deepmerge from 'deepmerge';
 import { Facet } from '../Facet';
 import { useTheme, CacheProvider, useTreePath } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
-import { MobileSidebar } from '../MobileSidebar';
 import { useClickOutside, useLang, useCustomComponentOverride } from '../../../hooks';
 import { Dropdown } from '../../Atoms/Dropdown';
 import { Icon } from '../../Atoms/Icon';
 import { Button } from '../../Atoms/Button';
+import { Slideout } from '../../Molecules/Slideout';
+import { Sidebar } from '../Sidebar';
 const defaultStyles = ({ theme }) => {
     return css({
         margin: '10px 0px',
@@ -19,9 +20,6 @@ const defaultStyles = ({ theme }) => {
             display: 'flex',
             flexWrap: 'wrap',
             gap: '10px',
-            '& .ss__mobile-sidebar': {
-                margin: '0 10px',
-            },
             '& .ss__facet__header__inner': {
                 display: 'flex',
             },
@@ -91,11 +89,12 @@ export const FacetsHorizontal = observer((properties) => {
         iconCollapse: 'angle-down',
         iconExpand: 'angle-up',
         clearAllText: 'Clear All',
+        toggleSidebarButtonText: 'Filters',
         facets: properties.controller?.store?.facets,
         treePath: globalTreePath,
     };
     let props = mergeProps('facetsHorizontal', globalTheme, defaultProps, properties);
-    const { facets, limit, alwaysShowFiltersButton, hideFiltersButton, onFacetOptionClick, showSelectedCount, hideSelectedCountParenthesis, clearAllIcon, showClearAllText, iconExpand, clearAllText, iconCollapse, disableStyles, className, internalClassName, controller, treePath, } = props;
+    const { facets, limit, alwaysShowToggleSidebarButton, hideToggleSidebarButton, onFacetOptionClick, showSelectedCount, hideSelectedCountParenthesis, clearAllIcon, showClearAllText, iconExpand, clearAllText, iconCollapse, toggleSidebarButtonText, disableStyles, className, internalClassName, controller, treePath, } = props;
     const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('facetsHorizontal', props);
     if (!shouldRenderDefault) {
         return overrideElement;
@@ -136,6 +135,7 @@ export const FacetsHorizontal = observer((properties) => {
             facetsToShow = [];
         }
     }
+    const [sidebarOpenState, setSidebarOpenState] = useState(false);
     const subProps = {
         dropdown: {
             // default props
@@ -176,7 +176,7 @@ export const FacetsHorizontal = observer((properties) => {
             internalClassName: `ss__facets-horizontal__content__facet`,
             justContent: true,
             // this should be turned on if there is ever a filters button rendering.
-            statefulOverflow: !hideFiltersButton && (isOverflowing || alwaysShowFiltersButton) ? true : undefined,
+            statefulOverflow: !hideToggleSidebarButton && (isOverflowing || alwaysShowToggleSidebarButton) ? true : undefined,
             // inherited props
             ...defined({
                 disableStyles,
@@ -185,9 +185,30 @@ export const FacetsHorizontal = observer((properties) => {
             theme: props?.theme,
             treePath: `${treePath} dropdown`,
         },
-        MobileSidebar: {
+        slideout: {
             // default props
-            internalClassName: 'ss__facets-horizontal__header__mobile-sidebar',
+            internalClassName: 'ss__facets-horizontal__slideout',
+            onChange: (active) => setSidebarOpenState(active),
+            // inherited props
+            ...defined({
+                disableStyles,
+            }),
+            // component theme overrides
+            theme: props?.theme,
+            treePath,
+        },
+        sidebar: {
+            // default props
+            internalClassName: 'ss__facets-horizontal__sidebar',
+            // inherited props
+            ...defined({
+                disableStyles,
+            }),
+            // component theme overrides
+            theme: props?.theme,
+            treePath,
+        },
+        toggleSidebarButton: {
             // inherited props
             ...defined({
                 disableStyles,
@@ -202,41 +223,54 @@ export const FacetsHorizontal = observer((properties) => {
     const innerRef = useClickOutside(() => {
         selectedFacet && setSelectedFacet(undefined);
     });
+    //initialize lang
+    const defaultLang = {
+        toggleSidebarButtonText: {
+            value: toggleSidebarButtonText,
+        },
+    };
+    //deep merge with props.lang
+    const lang = deepmerge(defaultLang, props.lang || {});
+    const mergedLang = useLang(lang, { facets: facets, sidebarOpenState: sidebarOpenState });
+    const ToggleSidebarButton = ({ sidebarOpenState, setSidebarOpenState, subProps }) => {
+        return (_jsx(Button, { ...subProps.toggleSidebarButton, internalClassName: "ss__facets-horizontal__header__toggle-sidebar", onClick: () => setSidebarOpenState(!sidebarOpenState), children: _jsx("span", { ...mergedLang.toggleSidebarButtonText.all }) }));
+    };
+    const renderSidebar = Boolean(!hideToggleSidebarButton && (isOverflowing || alwaysShowToggleSidebarButton));
     //todo investigate keyboard navigation here when overlay prop is true/false
-    return (facetsToShow && facetsToShow?.length > 0) || isOverflowing ? (_jsx(CacheProvider, { children: _jsx("div", { className: classnames('ss__facets-horizontal', className, internalClassName), ref: innerRef, ...styling, children: _jsxs("div", { className: "ss__facets-horizontal__header", children: [facetsToShow?.map((facet) => {
-                        const selectedCount = facet?.values?.filter((value) => value?.filtered).length ||
-                            facet?.active?.high !== facet?.range?.high ||
-                            facet?.active?.low !== facet?.range?.low;
-                        //initialize lang
-                        const defaultLang = {
-                            dropdownButton: {
-                                attributes: {
-                                    'aria-label': `currently ${selectedFacet?.field === facet.field ? 'open' : 'collapsed'} ${facet.label} facet dropdown ${facet.values?.length ? facet.values?.length + ' options' : ''}`,
+    return (facetsToShow && facetsToShow?.length > 0) || isOverflowing ? (_jsx(CacheProvider, { children: _jsxs("div", { className: classnames('ss__facets-horizontal', className, internalClassName), ref: innerRef, ...styling, children: [_jsxs("div", { className: "ss__facets-horizontal__header", children: [facetsToShow?.map((facet) => {
+                            const selectedCount = facet?.values?.filter((value) => value?.filtered).length ||
+                                facet?.active?.high !== facet?.range?.high ||
+                                facet?.active?.low !== facet?.range?.low;
+                            //initialize lang
+                            const defaultLang = {
+                                dropdownButton: {
+                                    attributes: {
+                                        'aria-label': `currently ${selectedFacet?.field === facet.field ? 'open' : 'collapsed'} ${facet.label} facet dropdown ${facet.values?.length ? facet.values?.length + ' options' : ''}`,
+                                    },
+                                },
+                                clearAllText: {
+                                    value: clearAllText,
                                 },
-                            },
-                            clearAllText: {
-                                value: clearAllText,
-                            },
-                        };
-                        //deep merge with props.lang
-                        const lang = deepmerge(defaultLang, props.lang || {});
-                        const mergedLang = useLang(lang, {
-                            selectedFacet,
-                            facet,
-                        });
-                        return (_jsx(Dropdown, { ...subProps.dropdown, internalClassName: classnames(subProps.dropdown.internalClassName, `ss__facets-horizontal__header__dropdown--${facet.display}`, `ss__facets-horizontal__header__dropdown--${facet.field}`), open: selectedFacet?.field === facet.field, onClick: (e) => {
-                                // @ts-ignore - this is a workaround for the fact that selectedFacet is not defined when the onclick is triggered by the escape key.
-                                if (selectedFacet !== facet && e.code !== 'Escape') {
-                                    setSelectedFacet(facet);
-                                }
-                                else {
-                                    setSelectedFacet(undefined);
-                                }
-                            }, 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();
-                                                }, 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 }) }));
-                    }), !hideFiltersButton && (isOverflowing || alwaysShowFiltersButton) && (_jsx(MobileSidebar, { controller: controller, ...subProps.MobileSidebar }))] }) }) })) : null;
+                            };
+                            //deep merge with props.lang
+                            const lang = deepmerge(defaultLang, props.lang || {});
+                            const mergedLang = useLang(lang, {
+                                selectedFacet,
+                                facet,
+                            });
+                            return (_jsx(Dropdown, { ...subProps.dropdown, internalClassName: classnames(subProps.dropdown.internalClassName, `ss__facets-horizontal__header__dropdown--${facet.display}`, `ss__facets-horizontal__header__dropdown--${facet.field}`), open: selectedFacet?.field === facet.field, onClick: (e) => {
+                                    // @ts-ignore - this is a workaround for the fact that selectedFacet is not defined when the onclick is triggered by the escape key.
+                                    if (selectedFacet !== facet && e.code !== 'Escape') {
+                                        setSelectedFacet(facet);
+                                    }
+                                    else {
+                                        setSelectedFacet(undefined);
+                                    }
+                                }, 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();
+                                                    }, 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 }) }));
+                        }), renderSidebar && _jsx(ToggleSidebarButton, { sidebarOpenState: sidebarOpenState, setSidebarOpenState: setSidebarOpenState, subProps: subProps })] }), renderSidebar && (_jsx(Slideout, { ...subProps.slideout, active: sidebarOpenState, children: _jsx(Sidebar, { ...subProps.sidebar, controller: controller }) }))] }) })) : null;
 });

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

@@ -9,5 +9,5 @@ export interface LayoutProps extends ComponentProps {
     layout: (ModuleNames | ModuleNames[])[];
     toggleSideBarButton?: Partial<ButtonProps>;
 }
-export type ModuleNames = 'searchHeader' | 'filterSummary' | 'mobileSidebar' | 'layoutSelector' | 'perPage' | 'sortBy' | 'pagination' | 'paginationInfo' | 'breadcrumbs' | '_' | 'button.sidebar-toggle' | 'banner.header' | 'banner.banner' | 'banner.footer' | 'facets' | 'facetsHorizontal' | 'banner.left';
+export type ModuleNames = 'searchHeader' | 'filterSummary' | 'layoutSelector' | 'perPage' | 'sortBy' | 'pagination' | 'paginationInfo' | 'breadcrumbs' | '_' | 'button.sidebar-toggle' | 'banner.header' | 'banner.banner' | 'banner.footer' | 'facets' | 'facetsHorizontal' | 'banner.left';
 //# sourceMappingURL=Layout.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Layout/Layout.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAKlE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAOvE,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAiCzD,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CAkSrD,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,UAAU,EAAE,gBAAgB,CAAC;IAC7B,MAAM,EAAE,CAAC,WAAW,GAAG,WAAW,EAAE,CAAC,EAAE,CAAC;IACxC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC3C;AAED,MAAM,MAAM,WAAW,GAEpB,cAAc,GACd,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,GAAG,GACH,uBAAuB,GACvB,eAAe,GACf,eAAe,GACf,eAAe,GAEf,QAAQ,GACR,kBAAkB,GAClB,aAAa,CAAC"}
+{"version":3,"file":"Layout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Layout/Layout.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAKlE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAMvE,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAiCzD,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CAiRrD,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,UAAU,EAAE,gBAAgB,CAAC;IAC7B,MAAM,EAAE,CAAC,WAAW,GAAG,WAAW,EAAE,CAAC,EAAE,CAAC;IACxC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC3C;AAED,MAAM,MAAM,WAAW,GAEpB,cAAc,GACd,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,GAAG,GACH,uBAAuB,GACvB,eAAe,GACf,eAAe,GACf,eAAe,GAEf,QAAQ,GACR,kBAAkB,GAClB,aAAa,CAAC"}

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

@@ -10,7 +10,6 @@ import { LoadMore } from '../../Molecules/LoadMore';
 import { SortBy } from '../../Molecules/SortBy';
 import { PerPage } from '../../Molecules/PerPage';
 import { LayoutSelector } from '../../Molecules/LayoutSelector';
-import { MobileSidebar } from '../MobileSidebar';
 import { PaginationInfo } from '../../Atoms/PaginationInfo/PaginationInfo';
 import { SearchHeader } from '../../Atoms/SearchHeader/SearchHeader';
 import { Button } from '../../Atoms/Button';
@@ -55,17 +54,6 @@ export const Layout = observer((properties) => {
     delete props.treePath;
     const styling = mergeStyles(props, defaultStyles);
     const subProps = {
-        MobileSidebar: {
-            // default props
-            controller,
-            // inherited props
-            ...defined({
-                disableStyles,
-            }),
-            // component theme overrides
-            theme: props?.theme,
-            treePath: properties.treePath,
-        },
         Banner: {
             // default props
             controller,
@@ -217,11 +205,6 @@ export const Layout = observer((properties) => {
     const hasResults = controller.store.pagination.totalResults > 0;
     function renderModule(module) {
         switch (module) {
-            case 'mobileSidebar':
-                if (hasResults) {
-                    return _jsx(MobileSidebar, { controller: controller, ...subProps.MobileSidebar });
-                }
-                break;
             case 'searchHeader':
                 return _jsx(SearchHeader, { ...subProps.SearchHeader });
             case 'filterSummary':
@@ -251,7 +234,7 @@ export const Layout = observer((properties) => {
                 break;
             case 'button.sidebar-toggle':
                 if (hasResults) {
-                    return (ToggleSideBarButton && (_jsx("div", { className: "ss__button--sidebar-toggle-button-wrapper", children: _jsx(Button, { ...subProps.ToggleSideBarButton }) })));
+                    return (ToggleSideBarButton && (_jsx("div", { className: "ss__layout__sidebar-toggle-button-wrapper", children: _jsx(Button, { ...subProps.ToggleSideBarButton }) })));
                 }
                 break;
             case 'pagination':

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

@@ -1 +1 @@
-{"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAO3B,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,gCAAgC,CAAC;AAIzF,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AA4C5G,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAsIvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;IAClF,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IACtD,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,OAAO,aAAa,GAAG,aAAa,CAAC;CACpD,CAAC"}
+{"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAO3B,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,gCAAgC,CAAC;AAIzF,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AA4C5G,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAiJvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;IAClF,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IACtD,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,OAAO,aAAa,GAAG,aAAa,CAAC;CACpD,CAAC"}

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',
@@ -122,6 +122,16 @@ export const Results = observer((properties) => {
         results = results?.slice(0, props.columns * props.rows);
     }
     const styling = mergeStyles({ ...props, columns: layout == ResultsLayout.list ? 1 : props.columns }, defaultStyles);
+    // Precompute merged theme for named result components to avoid repeated deepmerge in the loop
+    const mergedResultComponentTheme = isNamedResultComponent
+        ? deepmerge(theme || {}, {
+            components: {
+                result: {
+                    customComponent: resultComponent,
+                },
+            },
+        })
+        : theme;
     return results?.length ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__results', `ss__results-${props.layout}`, className, internalClassName), children: results.map((result) => (() => {
                 switch (result.type) {
                     case ContentType.BANNER:
@@ -135,7 +145,7 @@ export const Results = observer((properties) => {
                                     key: result.id,
                                     controller,
                                     result: result,
-                                    theme,
+                                    theme: mergedResultComponentTheme,
                                     treePath,
                                 }) }));
                         }

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

@@ -13,6 +13,6 @@ export type ToolbarTemplatesLegalProps = {
     layout?: (ModuleNames | ModuleNames[])[];
     toggleSideBarButton?: Partial<ButtonProps>;
 };
-export type ModuleNames = 'searchHeader' | 'filterSummary' | 'mobileSidebar' | 'layoutSelector' | 'perPage' | 'sortBy' | 'pagination' | 'paginationInfo' | 'breadcrumbs' | '_' | 'button.sidebar-toggle' | 'banner.header' | 'banner.banner' | 'banner.footer' | 'facetsHorizontal';
+export type ModuleNames = 'searchHeader' | 'filterSummary' | 'layoutSelector' | 'perPage' | 'sortBy' | 'pagination' | 'paginationInfo' | 'breadcrumbs' | '_' | 'button.sidebar-toggle' | 'banner.header' | 'banner.banner' | 'banner.footer' | 'facetsHorizontal';
 export type ToolbarNames = 'top' | 'middle' | 'bottom';
 //# sourceMappingURL=Toolbar.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAO3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAMjD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CA8CvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,CAAC,EAAE,YAAY,CAAC;CACpB,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,EAAE,CAAC,EAAE,CAAC;IACzC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,WAAW,GACpB,cAAc,GACd,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,GAAG,GACH,uBAAuB,GACvB,eAAe,GACf,eAAe,GACf,eAAe,GACf,kBAAkB,CAAC;AAEtB,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC"}
+{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAO3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAMjD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CA8CvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,CAAC,EAAE,YAAY,CAAC;CACpB,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,EAAE,CAAC,EAAE,CAAC;IACzC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,WAAW,GACpB,cAAc,GACd,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,GAAG,GACH,uBAAuB,GACvB,eAAe,GACf,eAAe,GACf,eAAe,GACf,kBAAkB,CAAC;AAEtB,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC"}

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

@@ -14,7 +14,7 @@ export const Toolbar = observer((properties) => {
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
-        layout: ['mobileSidebar', 'filterSummary', 'paginationInfo', 'sortBy', 'perPage', 'pagination'],
+        layout: ['button.sidebar-toggle', 'filterSummary', 'paginationInfo', 'sortBy', 'perPage', 'pagination'],
     };
     const props = mergeProps('toolbar', globalTheme, defaultProps, properties);
     const { controller, toggleSideBarButton, disableStyles, className, internalClassName, treePath, layout } = props;
@@ -26,10 +26,10 @@ export const Toolbar = observer((properties) => {
     const subProps = {
         Layout: {
             // default props
-            toggleSideBarButton,
             internalClassName: 'ss__toolbar__layout',
             // inherited props
             ...defined({
+                toggleSideBarButton,
                 disableStyles,
             }),
             // component theme overrides

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

@@ -1,7 +1,7 @@
 import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps, JSXComponent } from '../../../types';
 import { AutocompleteLayoutProps, AutocompleteLayoutTemplatesLegalProps } from '../../Organisms/AutocompleteLayout';
-export declare const AutocompleteFixed: ((properties: AutocompleteFixedProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+export declare const AutocompleteFixed: ((properties: AutocompleteFixedProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
     displayName: string;
 };
 interface inputBounds {

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,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AA+CxI,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CA0N3E,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,IAAI,CAAC,oCAAoC,EAAE,iBAAiB,CAAC,GAChE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,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,qCAAqC,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,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AA+CxI,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,IAAI,CAAC,oCAAoC,EAAE,iBAAiB,CAAC,GAChE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,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,qCAAqC,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({
@@ -214,5 +211,5 @@ export const AutocompleteFixed = observer((properties) => {
     delete acProps.style;
     delete acProps.styleScript;
     delete acProps.themeStyleScript;
-    return (_jsx(_Fragment, { children: layout?.length && active ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classNames('ss__autocomplete-fixed', className, internalClassName), children: _jsx(Modal, { ...subProps.modal, children: _jsxs("div", { className: "ss__autocomplete-fixed__inner", ref: (e) => useA11y(e, 0, true, reset), children: [renderInput ? (_jsx(SearchInput, { ...subProps.searchInput, value: controller.store.state.input || '', inputRef: renderedInputRef })) : (_jsx(_Fragment, {})), _jsx("div", { className: "ss__autocomplete-fixed__inner__layout-wrapper", children: _jsx(AutocompleteLayout, { ...acProps, ...subProps.autocompleteLayout, input: _input, controller: controller, treePath: `${treePath} modal` }) })] }) }) }) })) : null }));
+    return layout?.length && active ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classNames('ss__autocomplete-fixed', className, internalClassName), children: _jsx(Modal, { ...subProps.modal, children: _jsxs("div", { className: "ss__autocomplete-fixed__inner", ref: (e) => useA11y(e, 0, true, reset), children: [renderInput ? (_jsx(SearchInput, { ...subProps.searchInput, value: controller.store.state.input || '', inputRef: renderedInputRef })) : (_jsx(_Fragment, {})), _jsx("div", { className: "ss__autocomplete-fixed__inner__layout-wrapper", children: _jsx(AutocompleteLayout, { ...acProps, ...subProps.autocompleteLayout, input: _input, controller: controller, treePath: `${treePath} modal` }) })] }) }) }) })) : null;
 });

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

@@ -1,7 +1,7 @@
 import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps, JSXComponent } from '../../../types';
 import { AutocompleteLayoutProps, AutocompleteLayoutTemplatesLegalProps } from '../../Organisms/AutocompleteLayout';
-export declare const AutocompleteModal: ((properties: AutocompleteModalProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+export declare const AutocompleteModal: ((properties: AutocompleteModalProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
     displayName: string;
 };
 export type AutocompleteModalProps = {

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,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AA4DxI,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CAqK3E,CAAC;AAQH,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,IAAI,CAAC,oCAAoC,EAAE,iBAAiB,CAAC,GAChE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,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,qCAAqC,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,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AA4DxI,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,IAAI,CAAC,oCAAoC,EAAE,iBAAiB,CAAC,GAChE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,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,qCAAqC,CAAC"}

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

@@ -149,9 +149,6 @@ export const AutocompleteModal = observer((properties) => {
                 onClick: () => reset(),
                 icon: 'angle-left',
             },
-            chatButton: {
-                onClick: () => controller.openChat(),
-            },
             inputName: inputName,
             // inherited props
             ...defined({
@@ -183,5 +180,5 @@ export const AutocompleteModal = observer((properties) => {
     delete acProps.style;
     delete acProps.styleScript;
     delete acProps.themeStyleScript;
-    return (_jsx(_Fragment, { children: layout?.length && active ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classNames('ss__autocomplete-modal', className, internalClassName), children: _jsx(Modal, { ...subProps.modal, children: _jsxs("div", { className: "ss__autocomplete-modal__inner", ref: (e) => useA11y(e, 0, true, reset), children: [renderInput ? (_jsx(SearchInput, { ...subProps.searchInput, value: controller.store.state.input || '', inputRef: renderedInputRef })) : (_jsx(_Fragment, {})), _jsx(AutocompleteLayout, { ...acProps, ...subProps.autocompleteLayout, input: _input, controller: controller, treePath: `${treePath} modal` })] }) }) }) })) : null }));
+    return layout?.length && active ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classNames('ss__autocomplete-modal', className, internalClassName), children: _jsx(Modal, { ...subProps.modal, children: _jsxs("div", { className: "ss__autocomplete-modal__inner", ref: (e) => useA11y(e, 0, true, reset), children: [renderInput ? (_jsx(SearchInput, { ...subProps.searchInput, value: controller.store.state.input || '', inputRef: renderedInputRef })) : (_jsx(_Fragment, {})), _jsx(AutocompleteLayout, { ...acProps, ...subProps.autocompleteLayout, input: _input, controller: controller, treePath: `${treePath} modal` })] }) }) }) })) : null;
 });

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

@@ -2,7 +2,7 @@ import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps, JSXComponent } from '../../../types';
 import { AutocompleteLayoutProps, AutocompleteLayoutTemplatesLegalProps } from '../../Organisms/AutocompleteLayout';
 import { SlideDirectionType } from '../../Molecules/Slideout';
-export declare const AutocompleteSlideout: ((properties: AutocompleteSlideoutProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+export declare const AutocompleteSlideout: ((properties: AutocompleteSlideoutProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
     displayName: string;
 };
 export type AutocompleteSlideoutProps = {

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,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AACxI,OAAO,EAAE,kBAAkB,EAA2B,MAAM,0BAA0B,CAAC;AAsBvF,eAAO,MAAM,oBAAoB,gBAAyB,yBAAyB;;CA6JjF,CAAC;AAOH,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,IAAI,CAAC,uCAAuC,EAAE,iBAAiB,CAAC,GACnE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,uCAAuC,GAAG;IACrD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,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,qCAAqC,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,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AACxI,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,IAAI,CAAC,uCAAuC,EAAE,iBAAiB,CAAC,GACnE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,uCAAuC,GAAG;IACrD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,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,qCAAqC,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,
@@ -137,5 +134,5 @@ export const AutocompleteSlideout = observer((properties) => {
     delete acProps.styleScript;
     delete acProps.themeStyleScript;
     /***************************************/
-    return (_jsx(_Fragment, { children: layout?.length ? (_jsx(CacheProvider, { children: _jsx(Slideout, { ...styling, ...subProps.slideout, className: classNames('ss__autocomplete-slideout', 'ss__autocomplete-slideout__slideout', className, internalClassName), active: active, children: _jsxs("div", { className: "ss__autocomplete-slideout__inner", ref: (e) => useA11y(e, 0, true, reset), children: [renderInput ? (_jsx(SearchInput, { ...subProps.searchInput, value: controller.store.state.input || '', inputRef: renderedInputRef })) : (_jsx(_Fragment, {})), _jsx(AutocompleteLayout, { ...acProps, ...subProps.autocompleteLayout, input: _input, controller: controller, treePath: `${treePath} slideout` })] }) }) })) : null }));
+    return layout?.length ? (_jsx(CacheProvider, { children: _jsx(Slideout, { ...styling, ...subProps.slideout, className: classNames('ss__autocomplete-slideout', 'ss__autocomplete-slideout__slideout', className, internalClassName), active: active, children: _jsxs("div", { className: "ss__autocomplete-slideout__inner", ref: (e) => useA11y(e, 0, true, reset), children: [renderInput ? (_jsx(SearchInput, { ...subProps.searchInput, value: controller.store.state.input || '', inputRef: renderedInputRef })) : (_jsx(_Fragment, {})), _jsx(AutocompleteLayout, { ...acProps, ...subProps.autocompleteLayout, input: _input, controller: controller, treePath: `${treePath} slideout` })] }) }) })) : null;
 });

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

@@ -1 +1 @@
-{"version":3,"file":"Recommendation.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/Recommendation/Recommendation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAO9C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAO9D,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG7F,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAa/C,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CA8MrE,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG;IACjC,UAAU,EAAE,wBAAwB,CAAC;IACrC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACnC,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,IAAI,CAAC,iCAAiC,EAAE,iBAAiB,CAAC,GAC7D,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,iCAAiC,GAAG;IAC/C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,GAAG,eAAe,CAAC,GACvD,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,WAAW,kBAAkB;IAClC,SAAS,CAAC,EAAE,IAAI,CAAC;QAChB,UAAU,EAAE,wBAAwB,CAAC;KACrC,CAAC,CAAC;CACH"}
+{"version":3,"file":"Recommendation.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/Recommendation/Recommendation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAO9C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAO9D,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG7F,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAa/C,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CAwNrE,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG;IACjC,UAAU,EAAE,wBAAwB,CAAC;IACrC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACnC,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,IAAI,CAAC,iCAAiC,EAAE,iBAAiB,CAAC,GAC7D,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,iCAAiC,GAAG;IAC/C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,GAAG,eAAe,CAAC,GACvD,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,WAAW,kBAAkB;IAClC,SAAS,CAAC,EAAE,IAAI,CAAC;QAChB,UAAU,EAAE,wBAAwB,CAAC;KACrC,CAAC,CAAC;CACH"}

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

@@ -123,6 +123,16 @@ export const Recommendation = observer((properties) => {
                                             controller,
                                             result,
                                             treePath: subProps.result.treePath,
+                                            theme: isNamedResultComponent
+                                                ? deepmerge(props.theme || {}, {
+                                                    components: {
+                                                        // in order to preserve theme overrides for resultComponent vs. customComponent
+                                                        result: {
+                                                            customComponent: resultComponent,
+                                                        },
+                                                    },
+                                                })
+                                                : props.theme,
                                         });
                                     }
                                     else {

package/dist/esm/components/src/components/Templates/RecommendationBundle/BundleCTA.d.ts

@@ -16,7 +16,7 @@ export interface BundleSelectorSubProps {
 export interface BundledCTAProps extends ComponentProps {
     ctaSlot?: JSX.Element | React.FunctionComponent<BundledCTAProps>;
     cartStore: CartStore;
-    onAddToCart: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    onAddToCart: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void | Promise<void>;
     ctaIcon?: IconType | Partial<IconProps> | false;
     ctaButtonText?: string;
     ctaButtonSuccessText?: string;

package/dist/esm/components/src/components/Templates/RecommendationBundle/BundleCTA.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BundleCTA.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundle/BundleCTA.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAS,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAG/C,eAAO,MAAM,UAAU,gBAAyB,eAAe;;CAkG7D,CAAC;AAEH,MAAM,WAAW,sBAAsB;IACtC,cAAc,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IACpC,aAAa,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IACnC,IAAI,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACzB,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC7B;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACtD,OAAO,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACjE,SAAS,EAAE,SAAS,CAAC;IACrB,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACpE,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC;IAChD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,cAAc;IAC9B,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAClC,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3B,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CAC9B"}
+{"version":3,"file":"BundleCTA.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundle/BundleCTA.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAS,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAG/C,eAAO,MAAM,UAAU,gBAAyB,eAAe;;CAkG7D,CAAC;AAEH,MAAM,WAAW,sBAAsB;IACtC,cAAc,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IACpC,aAAa,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IACnC,IAAI,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACzB,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC7B;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACtD,OAAO,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC,iBAAiB,CAAC,eAAe,CAAC,CAAC;IACjE,SAAS,EAAE,SAAS,CAAC;IACrB,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACpF,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,GAAG,KAAK,CAAC;IAChD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,cAAc;IAC9B,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAClC,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3B,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CAC9B"}

package/dist/esm/components/src/components/Templates/RecommendationBundle/BundleCTA.js

@@ -14,9 +14,9 @@ export const BundledCTA = observer((properties) => {
         // global theme
         ...properties,
     };
-    props.onAddToCart = (e) => {
+    props.onAddToCart = async (e) => {
+        await properties.onAddToCart(e);
         setAddedToCart(true);
-        properties.onAddToCart(e);
         setTimeout(() => setAddedToCart(false), properties.ctaButtonSuccessTimeout);
     };
     const { ctaSlot, cartStore, onAddToCart, ctaIcon, ctaButtonText, ctaButtonSuccessText, treePath, classNamePrefix } = props;

package/dist/esm/components/src/components/Templates/RecommendationBundle/RecommendationBundle.d.ts

@@ -25,7 +25,7 @@ export type RecommendationBundleProps = {
 export type RecommendationBundleTemplatesLegalProps = {
     resultComponent?: string;
     limit?: number;
-    onAddToCart?: (e: MouseEvent, items: Product[]) => void;
+    onAddToCart?: (e: MouseEvent, items: Product[]) => void | Promise<void>;
     title?: JSX.Element | string;
     preselectedCount?: number;
     hideCheckboxes?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"RecommendationBundle.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundle/RecommendationBundle.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"RecommendationBundle.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundle/RecommendationBundle.tsx"],"names":[],"mappings":"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"}

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

@@ -141,7 +141,6 @@ export const RecommendationBundle = observer((properties) => {
         ctaButtonSuccessText: 'Bundle Added!',
         ctaButtonSuccessTimeout: 2000,
         ctaInline: true,
-        onAddToCart: (e, items) => controller?.addToCart && controller.addToCart(items),
         title: properties.controller?.store?.profile?.display?.templateParameters?.title,
         description: properties.controller?.store?.profile?.display?.templateParameters?.description,
         treePath: globalTreePath,
@@ -324,11 +323,11 @@ export const RecommendationBundle = observer((properties) => {
             }
         }
     };
-    const addToCart = (e) => {
+    const addToCart = async (e) => {
         // add to cart tracking
-        controller.addToCart(selectedItems);
+        await controller.addToCart(selectedItems);
         //call the function passed
-        onAddToCart && onAddToCart(e, selectedItems);
+        onAddToCart && (await onAddToCart(e, selectedItems));
     };
     const setSeedwidth = () => {
         if (seedRef.current) {
@@ -396,6 +395,16 @@ export const RecommendationBundle = observer((properties) => {
             }
             return !isSeed || ((seedInCarousel || carousel?.enabled == false) && isSeed && !hideSeed) ? (_jsx(ResultTracker, { controller: controller, result: result, track: { impression: Boolean(!isSeed) }, children: _jsx(BundleSelector, { ...attributes, children: resolvedResultComponent ? (cloneWithProps(resolvedResultComponent, {
                         controller: controller,
+                        theme: isNamedResultComponent
+                            ? deepmerge(props.theme || {}, {
+                                components: {
+                                    // in order to preserve theme overrides for resultComponent vs. customComponent
+                                    result: {
+                                        customComponent: resultComponent,
+                                    },
+                                },
+                            })
+                            : props.theme,
                         treePath: treePath,
                         result: result,
                         seed: isSeed,
@@ -434,6 +443,16 @@ export const RecommendationBundle = observer((properties) => {
                                                             onProductSelect,
                                                             result: seed,
                                                             treePath,
+                                                            theme: isNamedResultComponent
+                                                                ? deepmerge(props.theme || {}, {
+                                                                    components: {
+                                                                        // in order to preserve theme overrides for resultComponent vs. customComponent
+                                                                        result: {
+                                                                            customComponent: resultComponent,
+                                                                        },
+                                                                    },
+                                                                })
+                                                                : props.theme,
                                                         });
                                                     }
                                                     else if (shouldWaitForNamedResultComponent) {

package/dist/esm/components/src/components/Templates/RecommendationEmail/RecommendationEmail.d.ts

@@ -1,6 +1,5 @@
 import type { RecommendationController } from '@athoscommerce/snap-controller';
 import type { Product } from '@athoscommerce/snap-store-mobx';
-import { ResultProps } from '../../Molecules/Result';
 import { ThemeComponent } from '../../../providers';
 import { ComponentProps, JSXComponent } from '../../../types';
 export declare const recommendationEmailThemeComponentProps: ThemeComponent<'recommendationEmailThemeComponentProps', RecommendationEmailProps, RecommendationEmailTemplatesLegalProps>;
@@ -14,7 +13,6 @@ export type RecommendationEmailProps = {
 } & Omit<RecommendationEmailTemplatesLegalProps, 'resultComponent'> & Omit<ComponentProps, 'customComponent'>;
 export type RecommendationEmailTemplatesLegalProps = {
     resultComponent?: string;
-    resultProps?: Partial<ResultProps> | Record<string, any>;
     resultWidth?: string;
 };
 //# sourceMappingURL=RecommendationEmail.d.ts.map