@athoscommerce/snap-preact 1.7.1-beta.133 → 1.9.0

package/dist/cjs/components/src/components/Molecules/Slideshow/Slideshow.d.ts

@@ -2,7 +2,9 @@ import { h } from 'preact';
 import { ComponentProps } from '../../../types';
 import { Lang } from '../../../hooks';
 import { LangAttributes } from '../../../hooks/useLang';
-export declare function Slideshow(properties: SlideshowProps): import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null;
+export declare const Slideshow: ((properties: SlideshowProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
+    displayName: string;
+};
 export interface SlideshowLang {
     pauseButton: Lang<{
         isPlaying: boolean;

package/dist/cjs/components/src/components/Molecules/Slideshow/Slideshow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slideshow.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Slideshow/Slideshow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAK3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAI7D,OAAO,EAAE,IAAI,EAAuC,MAAM,gBAAgB,CAAC;AAE3E,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AA4JxD,wBAAgB,SAAS,CAAC,UAAU,EAAE,cAAc,2EAupBnD;AAED,MAAM,WAAW,aAAa;IAC7B,WAAW,EAAE,IAAI,CAAC;QACjB,SAAS,EAAE,OAAO,CAAC;QACnB,cAAc,EAAE,OAAO,CAAC;QACxB,cAAc,EAAE,OAAO,CAAC;KACxB,CAAC,CAAC;IACH,gBAAgB,EAAE,cAAc,CAAC;QAChC,KAAK,EAAE,MAAM,CAAC;QACd,SAAS,EAAE,MAAM,CAAC;KAClB,CAAC,CAAC;IACH,UAAU,EAAE,IAAI,CAAC;QAChB,SAAS,EAAE,OAAO,CAAC;QACnB,cAAc,EAAE,OAAO,CAAC;QACxB,cAAc,EAAE,OAAO,CAAC;KACxB,CAAC,CAAC;IACH,UAAU,EAAE,IAAI,CAAC;QAChB,SAAS,EAAE,OAAO,CAAC;QACnB,cAAc,EAAE,OAAO,CAAC;QACxB,cAAc,EAAE,OAAO,CAAC;KACxB,CAAC,CAAC;IACH,KAAK,EAAE,cAAc,CAAC;QACrB,eAAe,EAAE,OAAO,CAAC;QACzB,QAAQ,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;KACrB,CAAC,CAAC;IACH,cAAc,EAAE,IAAI,CAAC;QACpB,aAAa,EAAE,OAAO,CAAC;KACvB,CAAC,CAAC;CACH;AAED,MAAM,WAAW,cAAc;IAC9B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,OAAO,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,cAAc,GAAG;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CAC9B,GAAG,4BAA4B,GAC/B,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,MAAM,4BAA4B,GAAG;IAC1C,MAAM,EAAE,CAAC,MAAM,GAAG,cAAc,CAAC,EAAE,CAAC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}
+{"version":3,"file":"Slideshow.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Slideshow/Slideshow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAM3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAI7D,OAAO,EAAE,IAAI,EAAuC,MAAM,gBAAgB,CAAC;AAE3E,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AA4JxD,eAAO,MAAM,SAAS,gBAAyB,cAAc;;CAopB3D,CAAC;AAEH,MAAM,WAAW,aAAa;IAC7B,WAAW,EAAE,IAAI,CAAC;QACjB,SAAS,EAAE,OAAO,CAAC;QACnB,cAAc,EAAE,OAAO,CAAC;QACxB,cAAc,EAAE,OAAO,CAAC;KACxB,CAAC,CAAC;IACH,gBAAgB,EAAE,cAAc,CAAC;QAChC,KAAK,EAAE,MAAM,CAAC;QACd,SAAS,EAAE,MAAM,CAAC;KAClB,CAAC,CAAC;IACH,UAAU,EAAE,IAAI,CAAC;QAChB,SAAS,EAAE,OAAO,CAAC;QACnB,cAAc,EAAE,OAAO,CAAC;QACxB,cAAc,EAAE,OAAO,CAAC;KACxB,CAAC,CAAC;IACH,UAAU,EAAE,IAAI,CAAC;QAChB,SAAS,EAAE,OAAO,CAAC;QACnB,cAAc,EAAE,OAAO,CAAC;QACxB,cAAc,EAAE,OAAO,CAAC;KACxB,CAAC,CAAC;IACH,KAAK,EAAE,cAAc,CAAC;QACrB,eAAe,EAAE,OAAO,CAAC;QACzB,QAAQ,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,YAAY,EAAE,MAAM,CAAC;KACrB,CAAC,CAAC;IACH,cAAc,EAAE,IAAI,CAAC;QACpB,aAAa,EAAE,OAAO,CAAC;KACvB,CAAC,CAAC;CACH;AAED,MAAM,WAAW,cAAc;IAC9B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,OAAO,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,cAAc,GAAG;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CAC9B,GAAG,4BAA4B,GAC/B,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,MAAM,4BAA4B,GAAG;IAC1C,MAAM,EAAE,CAAC,MAAM,GAAG,cAAc,CAAC,EAAE,CAAC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}

package/dist/cjs/components/src/components/Molecules/Slideshow/Slideshow.js

@@ -14,11 +14,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Slideshow = Slideshow;
+exports.Slideshow = void 0;
 var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 var hooks_1 = require("preact/hooks");
 var react_1 = require("@emotion/react");
 var classnames_1 = __importDefault(require("classnames"));
+var mobx_react_lite_1 = require("mobx-react-lite");
 var providers_1 = require("../../../providers");
 var utilities_1 = require("../../../utilities");
 var Image_1 = require("../../Atoms/Image");
@@ -154,7 +155,7 @@ var defaultStyles = function (_a) {
         },
     });
 };
-function Slideshow(properties) {
+exports.Slideshow = (0, mobx_react_lite_1.observer)(function (properties) {
     var _a;
     var globalTheme = (0, providers_1.useTheme)();
     var globalTreePath = (0, providers_1.useTreePath)();
@@ -560,7 +561,7 @@ function Slideshow(properties) {
                         }), style: { transform: "translateX(".concat(translateX).concat(translateUnit, ")") }, role: "group", "aria-label": "Slide group ".concat(currentIndex, " of ").concat(totalDots), 
                         // Touch events
                         // @ts-ignore - touch events
-                        onTouchStart: touchDragging ? function (event) { return handleDragStart(event.touches[0].clientX); } : undefined, 
+                        onTouchStart: touchDragging ? function (event) { return handleDragStart(event.touches[0]); } : undefined, 
                         // @ts-ignore - touch events
                         onTouchMove: touchDragging
                             ? function (event) {
@@ -575,10 +576,6 @@ function Slideshow(properties) {
                         // @ts-ignore - mouse events
                         onMouseDown: touchDragging
                             ? function (event) {
-                                // Only initiate dragging with the primary (left) mouse button.
-                                // Right/middle clicks should not start a drag (e.g. opening the context menu).
-                                if (event.button !== 0)
-                                    return;
                                 event.preventDefault();
                                 handleDragStart(event.clientX);
                             }
@@ -632,4 +629,4 @@ function Slideshow(properties) {
                                 'ss__slideshow__dot--active': selected,
                             }), onClick: function () { return goToSlide(index); }, "aria-selected": selected }, paginationLangObj.paginationButton.all, subpropsToUse, { children: (0, jsx_runtime_1.jsx)("span", { className: 'ss__slideshow__dot-inner' }) }), index));
                     }) })), autoPlay && ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ className: "ss__slideshow__sr-only" }, subProps.PauseButton, { onClick: togglePlayPause }, mergedLang.pauseButton.all)))] })) }));
-}
+});

package/dist/cjs/components/src/components/Molecules/Swatches/Swatches.d.ts

@@ -2,7 +2,9 @@ import { h } from 'preact';
 import { ComponentProps, SwatchOption, BreakpointsProps } from '../../../types';
 import { GridProps } from '../Grid';
 import { SlideshowProps } from '../Slideshow';
-export declare function Swatches(properties: SwatchesProps): import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null;
+export declare const Swatches: ((properties: SwatchesProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
+    displayName: string;
+};
 export type SwatchesProps = {
     breakpoints?: BreakpointsProps;
 } & SwatchesTemplatesLegalProps & ComponentProps<SwatchesProps>;

package/dist/cjs/components/src/components/Molecules/Swatches/Swatches.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Swatches.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Swatches/Swatches.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,gBAAgB,EAAe,MAAM,gBAAgB,CAAC;AAG7F,OAAO,EAAQ,SAAS,EAAE,MAAM,SAAS,CAAC;AAM1C,OAAO,EAA6B,cAAc,EAAE,MAAM,cAAc,CAAC;AA6DzE,wBAAgB,QAAQ,CAAC,UAAU,EAAE,aAAa,2EAkMjD;AAED,MAAM,MAAM,aAAa,GAAG;IAC3B,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC5E,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1B,IAAI,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;CAC5B,CAAC"}
+{"version":3,"file":"Swatches.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Swatches/Swatches.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAI3B,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,gBAAgB,EAAe,MAAM,gBAAgB,CAAC;AAG7F,OAAO,EAAQ,SAAS,EAAE,MAAM,SAAS,CAAC;AAO1C,OAAO,EAA6B,cAAc,EAAE,MAAM,cAAc,CAAC;AA6DzE,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAkMzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG;IAC3B,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC5E,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1B,IAAI,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;CAC5B,CAAC"}

package/dist/cjs/components/src/components/Molecules/Swatches/Swatches.js

@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Swatches = Swatches;
+exports.Swatches = void 0;
 var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 var classnames_1 = __importDefault(require("classnames"));
 var react_1 = require("@emotion/react");
@@ -23,6 +23,7 @@ var hooks_1 = require("../../../hooks");
 var utilities_1 = require("../../../utilities");
 var Grid_1 = require("../Grid");
 var Image_1 = require("../../Atoms/Image");
+var mobx_react_lite_1 = require("mobx-react-lite");
 var deepmerge_1 = __importDefault(require("deepmerge"));
 var snap_toolbox_1 = require("@athoscommerce/snap-toolbox");
 var colord_1 = require("colord");
@@ -81,7 +82,7 @@ var defaultStyles = function (_a) {
         },
     });
 };
-function Swatches(properties) {
+exports.Swatches = (0, mobx_react_lite_1.observer)(function (properties) {
     var globalTheme = (0, providers_1.useTheme)();
     var globalTreePath = (0, providers_1.useTreePath)();
     var defaultCarouselBreakpoints = {
@@ -192,4 +193,4 @@ function Swatches(properties) {
     return typeof options == 'object' && (options === null || options === void 0 ? void 0 : options.length) ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__swatches', className, internalClassName), children: type == 'slideshow' ? ((0, jsx_runtime_1.jsx)(Slideshow_1.Slideshow, __assign({ slides: slidesArray }, subProps.slideshow))) : ((0, jsx_runtime_1.jsx)(Grid_1.Grid, __assign({}, subProps.grid, { options: options, onSelect: function (e, option) {
                     !disabled && makeSelection(e, option);
                 }, selected: selected }))) })) })) : null;
-}
+});

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

@@ -388,9 +388,8 @@ exports.Facet = (0, mobx_react_lite_1.observer)(function (properties) {
     return facet && renderFacet ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__facet', "ss__facet--".concat(facet.field), "".concat(facet.collapsed ? 'ss__facet--collapsed' : ''), className, internalClassName, "".concat(facet.display ? "ss__facet--".concat(facet.display) : ''), (statefulOverflow ? (overflowState === null || overflowState === void 0 ? void 0 : overflowState.remaining) || 0 > 0 : (((_r = facet === null || facet === void 0 ? void 0 : facet.overflow) === null || _r === void 0 ? void 0 : _r.remaining) || 0) > 0) || (facet === null || facet === void 0 ? void 0 : facet.display) == 'slider'
                 ? ''
                 : 'ss__facet--showing-all'), children: justContent ? ((0, jsx_runtime_1.jsx)(FacetContent, __assign({}, facetContentProps, { mergedLang: mergedLang }))) : ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, __assign({}, subProps.dropdown, { open: disableCollapse || !(facet === null || facet === void 0 ? void 0 : facet.collapsed), onClick: function () { return !disableCollapse && facet.toggleCollapse && (facet === null || facet === void 0 ? void 0 : facet.toggleCollapse()); }, disableA11y: true, button: (0, jsx_runtime_1.jsxs)("div", __assign({ className: "ss__facet__header", ref: function (e) { return (0, useA11y_1.useA11y)(e, disableCollapse ? -1 : 0); }, role: "heading", "aria-level": 3 }, mergedLang.dropdownButton.attributes, { children: [(0, jsx_runtime_1.jsxs)("span", { className: "ss__facet__header__inner", children: [(0, jsx_runtime_1.jsx)("span", __assign({}, mergedLang.dropdownButton.value, { children: facet === null || facet === void 0 ? void 0 : facet.label })), showSelectedCount && selectedCount && facet.type !== 'range' ? ((0, jsx_runtime_1.jsx)("span", { className: "ss__facet__header__selected-count", children: hideSelectedCountParenthesis ? selectedCount : "(".concat(selectedCount, ")") })) : null, (mergedLang.clearAllText.value || clearAllIcon) && selectedCount ? ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.button, { internalClassName: "ss__facet__header__clear-all", name: 'reset-facet', onClick: function (e) {
-                                        var _a;
                                         e.stopPropagation();
-                                        (_a = facet === null || facet === void 0 ? void 0 : facet.clear.url) === null || _a === void 0 ? void 0 : _a.link.onClick();
+                                        facet === null || facet === void 0 ? void 0 : facet.clear.url.link.onClick();
                                     }, icon: clearAllIcon ? clearAllIcon : undefined, children: mergedLang.clearAllText.value && showClearAllText ? (0, jsx_runtime_1.jsx)("label", __assign({}, mergedLang.clearAllText.all)) : null }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}))] }), !disableCollapse && ((0, jsx_runtime_1.jsx)(Icon_1.Icon, __assign({}, subProps.icon, ((facet === null || facet === void 0 ? void 0 : facet.collapsed)
                             ? __assign({}, (typeof iconExpand == 'string' ? { icon: iconExpand } : iconExpand)) : __assign({}, (typeof iconCollapse == 'string' ? { icon: iconCollapse } : iconCollapse))), { name: (facet === null || facet === void 0 ? void 0 : facet.collapsed) ? 'expand' : 'collapse' })))] })), children: (0, jsx_runtime_1.jsx)(FacetContent, __assign({}, facetContentProps, { mergedLang: mergedLang })) }))) })) })) : null;
 });

package/dist/cjs/components/src/components/Organisms/FacetsHorizontal/FacetsHorizontal.d.ts

@@ -19,10 +19,11 @@ export type FacetsHorizontalTemplatesLegalProps = {
     showClearAllText?: boolean;
     clearAllIcon?: IconType | Partial<IconProps>;
     limit?: number;
-    alwaysShowFiltersButton?: boolean;
-    hideFiltersButton?: boolean;
+    alwaysShowToggleSidebarButton?: boolean;
+    hideToggleSidebarButton?: boolean;
     iconCollapse?: IconType | Partial<IconProps>;
     iconExpand?: IconType | Partial<IconProps>;
+    toggleSidebarButtonText?: string;
     onFacetOptionClick?: (e: React.MouseEvent<Element, MouseEvent>) => void;
 };
 export interface FacetsHorizontalLang {
@@ -30,5 +31,9 @@ export interface FacetsHorizontalLang {
         selectedFacet: IndividualFacetType;
         facet: IndividualFacetType;
     }>;
+    toggleSidebarButtonText?: Lang<{
+        facets: IndividualFacetType[];
+        sidebarOpenState: boolean;
+    }>;
 }
 //# sourceMappingURL=FacetsHorizontal.d.ts.map

package/dist/cjs/components/src/components/Organisms/FacetsHorizontal/FacetsHorizontal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetsHorizontal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/FacetsHorizontal/FacetsHorizontal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAU3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAE/F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,OAAO,EAAE,IAAI,EAAwD,MAAM,gBAAgB,CAAC;AAE5F,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAmF7D,eAAO,MAAM,gBAAgB,gBAAyB,qBAAqB;;CA8PzE,CAAC;AAUH,MAAM,MAAM,qBAAqB,GAAG;IACnC,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;IACrC,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,CAAC;CACvD,GAAG,mCAAmC,GACtC,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAEvC,MAAM,MAAM,mCAAmC,GAAG;IACjD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAE7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC7C,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC3C,kBAAkB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACxE,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACpC,cAAc,EAAE,IAAI,CAAC;QACpB,aAAa,EAAE,mBAAmB,CAAC;QACnC,KAAK,EAAE,mBAAmB,CAAC;KAC3B,CAAC,CAAC;CACH"}
+{"version":3,"file":"FacetsHorizontal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/FacetsHorizontal/FacetsHorizontal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAU3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAE/F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,IAAI,EAAwD,MAAM,gBAAgB,CAAC;AAE5F,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAiF7D,eAAO,MAAM,gBAAgB,gBAAyB,qBAAqB;;CAmTzE,CAAC;AAYH,MAAM,MAAM,qBAAqB,GAAG;IACnC,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;IACrC,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,CAAC;CACvD,GAAG,mCAAmC,GACtC,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAEvC,MAAM,MAAM,mCAAmC,GAAG;IACjD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAE7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6BAA6B,CAAC,EAAE,OAAO,CAAC;IACxC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC7C,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC3C,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,kBAAkB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACxE,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACpC,cAAc,EAAE,IAAI,CAAC;QACpB,aAAa,EAAE,mBAAmB,CAAC;QACnC,KAAK,EAAE,mBAAmB,CAAC;KAC3B,CAAC,CAAC;IACH,uBAAuB,CAAC,EAAE,IAAI,CAAC;QAAE,MAAM,EAAE,mBAAmB,EAAE,CAAC;QAAC,gBAAgB,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;CAC7F"}

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

@@ -24,11 +24,12 @@ var deepmerge_1 = __importDefault(require("deepmerge"));
 var Facet_1 = require("../Facet");
 var providers_1 = require("../../../providers");
 var utilities_1 = require("../../../utilities");
-var MobileSidebar_1 = require("../MobileSidebar");
 var hooks_2 = require("../../../hooks");
 var Dropdown_1 = require("../../Atoms/Dropdown");
 var Icon_1 = require("../../Atoms/Icon");
 var Button_1 = require("../../Atoms/Button");
+var Slideout_1 = require("../../Molecules/Slideout");
+var Sidebar_1 = require("../Sidebar");
 var defaultStyles = function (_a) {
     var _b, _c;
     var theme = _a.theme;
@@ -38,9 +39,6 @@ var defaultStyles = function (_a) {
             display: 'flex',
             flexWrap: 'wrap',
             gap: '10px',
-            '& .ss__mobile-sidebar': {
-                margin: '0 10px',
-            },
             '& .ss__facet__header__inner': {
                 display: 'flex',
             },
@@ -111,11 +109,12 @@ exports.FacetsHorizontal = (0, mobx_react_lite_1.observer)(function (properties)
         iconCollapse: 'angle-down',
         iconExpand: 'angle-up',
         clearAllText: 'Clear All',
+        toggleSidebarButtonText: 'Filters',
         facets: (_b = (_a = properties.controller) === null || _a === void 0 ? void 0 : _a.store) === null || _b === void 0 ? void 0 : _b.facets,
         treePath: globalTreePath,
     };
     var props = (0, utilities_1.mergeProps)('facetsHorizontal', globalTheme, defaultProps, properties);
-    var facets = props.facets, limit = props.limit, alwaysShowFiltersButton = props.alwaysShowFiltersButton, hideFiltersButton = props.hideFiltersButton, onFacetOptionClick = props.onFacetOptionClick, showSelectedCount = props.showSelectedCount, hideSelectedCountParenthesis = props.hideSelectedCountParenthesis, clearAllIcon = props.clearAllIcon, showClearAllText = props.showClearAllText, iconExpand = props.iconExpand, clearAllText = props.clearAllText, iconCollapse = props.iconCollapse, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, controller = props.controller, treePath = props.treePath;
+    var facets = props.facets, limit = props.limit, alwaysShowToggleSidebarButton = props.alwaysShowToggleSidebarButton, hideToggleSidebarButton = props.hideToggleSidebarButton, onFacetOptionClick = props.onFacetOptionClick, showSelectedCount = props.showSelectedCount, hideSelectedCountParenthesis = props.hideSelectedCountParenthesis, clearAllIcon = props.clearAllIcon, showClearAllText = props.showClearAllText, iconExpand = props.iconExpand, clearAllText = props.clearAllText, iconCollapse = props.iconCollapse, toggleSidebarButtonText = props.toggleSidebarButtonText, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, controller = props.controller, treePath = props.treePath;
     var _c = (0, hooks_2.useCustomComponentOverride)('facetsHorizontal', props), overrideElement = _c.overrideElement, shouldRenderDefault = _c.shouldRenderDefault;
     if (!shouldRenderDefault) {
         return overrideElement;
@@ -153,6 +152,7 @@ exports.FacetsHorizontal = (0, mobx_react_lite_1.observer)(function (properties)
             facetsToShow = [];
         }
     }
+    var _d = (0, hooks_1.useState)(false), sidebarOpenState = _d[0], setSidebarOpenState = _d[1];
     var subProps = {
         dropdown: __assign(__assign({ 
             // default props
@@ -177,60 +177,85 @@ exports.FacetsHorizontal = (0, mobx_react_lite_1.observer)(function (properties)
             // default props
             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 }, (0, utilities_1.defined)({
+            statefulOverflow: !hideToggleSidebarButton && (isOverflowing || alwaysShowToggleSidebarButton) ? true : undefined }, (0, utilities_1.defined)({
             disableStyles: disableStyles,
         })), { 
             // component theme overrides
             theme: props === null || props === void 0 ? void 0 : props.theme, treePath: "".concat(treePath, " dropdown") }),
-        MobileSidebar: __assign(__assign({ 
+        slideout: __assign(__assign({ 
             // default props
-            internalClassName: 'ss__facets-horizontal__header__mobile-sidebar' }, (0, utilities_1.defined)({
+            internalClassName: 'ss__facets-horizontal__slideout', onChange: function (active) { return setSidebarOpenState(active); } }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+        sidebar: __assign(__assign({ 
+            // default props
+            internalClassName: 'ss__facets-horizontal__sidebar' }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+        toggleSidebarButton: __assign(__assign({}, (0, utilities_1.defined)({
             disableStyles: disableStyles,
         })), { 
             // component theme overrides
             theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
     };
     var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
-    var _d = (0, hooks_1.useState)(undefined), selectedFacet = _d[0], setSelectedFacet = _d[1];
+    var _e = (0, hooks_1.useState)(undefined), selectedFacet = _e[0], setSelectedFacet = _e[1];
     var innerRef = (0, hooks_2.useClickOutside)(function () {
         selectedFacet && setSelectedFacet(undefined);
     });
+    //initialize lang
+    var defaultLang = {
+        toggleSidebarButtonText: {
+            value: toggleSidebarButtonText,
+        },
+    };
+    //deep merge with props.lang
+    var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
+    var mergedLang = (0, hooks_2.useLang)(lang, { facets: facets, sidebarOpenState: sidebarOpenState });
+    var ToggleSidebarButton = function (_a) {
+        var sidebarOpenState = _a.sidebarOpenState, setSidebarOpenState = _a.setSidebarOpenState, subProps = _a.subProps;
+        return ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.toggleSidebarButton, { internalClassName: "ss__facets-horizontal__header__toggle-sidebar", onClick: function () { return setSidebarOpenState(!sidebarOpenState); }, children: (0, jsx_runtime_1.jsx)("span", __assign({}, mergedLang.toggleSidebarButtonText.all)) })));
+    };
+    var renderSidebar = Boolean(!hideToggleSidebarButton && (isOverflowing || alwaysShowToggleSidebarButton));
     //todo investigate keyboard navigation here when overlay prop is true/false
-    return (facetsToShow && (facetsToShow === null || facetsToShow === void 0 ? void 0 : facetsToShow.length) > 0) || isOverflowing ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)('ss__facets-horizontal', className, internalClassName), ref: innerRef }, styling, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ss__facets-horizontal__header", children: [facetsToShow === null || facetsToShow === void 0 ? void 0 : facetsToShow.map(function (facet) {
-                        var _a, _b, _c, _d, _e, _f, _g;
-                        var selectedCount = ((_a = facet === null || facet === void 0 ? void 0 : facet.values) === null || _a === void 0 ? void 0 : _a.filter(function (value) { return value === null || value === void 0 ? void 0 : value.filtered; }).length) ||
-                            ((_b = facet === null || facet === void 0 ? void 0 : facet.active) === null || _b === void 0 ? void 0 : _b.high) !== ((_c = facet === null || facet === void 0 ? void 0 : facet.range) === null || _c === void 0 ? void 0 : _c.high) ||
-                            ((_d = facet === null || facet === void 0 ? void 0 : facet.active) === null || _d === void 0 ? void 0 : _d.low) !== ((_e = facet === null || facet === void 0 ? void 0 : facet.range) === null || _e === void 0 ? void 0 : _e.low);
-                        //initialize lang
-                        var defaultLang = {
-                            dropdownButton: {
-                                attributes: {
-                                    'aria-label': "currently ".concat((selectedFacet === null || selectedFacet === void 0 ? void 0 : selectedFacet.field) === facet.field ? 'open' : 'collapsed', " ").concat(facet.label, " facet dropdown ").concat(((_f = facet.values) === null || _f === void 0 ? void 0 : _f.length) ? ((_g = facet.values) === null || _g === void 0 ? void 0 : _g.length) + ' options' : ''),
+    return (facetsToShow && (facetsToShow === null || facetsToShow === void 0 ? void 0 : facetsToShow.length) > 0) || isOverflowing ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)('ss__facets-horizontal', className, internalClassName), ref: innerRef }, styling, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__facets-horizontal__header", children: [facetsToShow === null || facetsToShow === void 0 ? void 0 : facetsToShow.map(function (facet) {
+                            var _a, _b, _c, _d, _e, _f, _g;
+                            var selectedCount = ((_a = facet === null || facet === void 0 ? void 0 : facet.values) === null || _a === void 0 ? void 0 : _a.filter(function (value) { return value === null || value === void 0 ? void 0 : value.filtered; }).length) ||
+                                ((_b = facet === null || facet === void 0 ? void 0 : facet.active) === null || _b === void 0 ? void 0 : _b.high) !== ((_c = facet === null || facet === void 0 ? void 0 : facet.range) === null || _c === void 0 ? void 0 : _c.high) ||
+                                ((_d = facet === null || facet === void 0 ? void 0 : facet.active) === null || _d === void 0 ? void 0 : _d.low) !== ((_e = facet === null || facet === void 0 ? void 0 : facet.range) === null || _e === void 0 ? void 0 : _e.low);
+                            //initialize lang
+                            var defaultLang = {
+                                dropdownButton: {
+                                    attributes: {
+                                        'aria-label': "currently ".concat((selectedFacet === null || selectedFacet === void 0 ? void 0 : selectedFacet.field) === facet.field ? 'open' : 'collapsed', " ").concat(facet.label, " facet dropdown ").concat(((_f = facet.values) === null || _f === void 0 ? void 0 : _f.length) ? ((_g = facet.values) === null || _g === void 0 ? void 0 : _g.length) + ' options' : ''),
+                                    },
+                                },
+                                clearAllText: {
+                                    value: clearAllText,
                                 },
-                            },
-                            clearAllText: {
-                                value: clearAllText,
-                            },
-                        };
-                        //deep merge with props.lang
-                        var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
-                        var mergedLang = (0, hooks_2.useLang)(lang, {
-                            selectedFacet: selectedFacet,
-                            facet: facet,
-                        });
-                        return ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, __assign({}, subProps.dropdown, { internalClassName: (0, classnames_1.default)(subProps.dropdown.internalClassName, "ss__facets-horizontal__header__dropdown--".concat(facet.display), "ss__facets-horizontal__header__dropdown--".concat(facet.field)), open: (selectedFacet === null || selectedFacet === void 0 ? void 0 : selectedFacet.field) === facet.field, onClick: function (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: (0, jsx_runtime_1.jsxs)("div", __assign({ className: "ss__dropdown__button__heading" }, mergedLang.dropdownButton.attributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__facet__header__inner", children: [(0, jsx_runtime_1.jsx)("span", __assign({}, mergedLang.dropdownButton.value, { children: facet === null || facet === void 0 ? void 0 : facet.label })), showSelectedCount && selectedCount && facet.type !== 'range' ? ((0, jsx_runtime_1.jsx)("span", { className: "ss__facet__header__selected-count", children: hideSelectedCountParenthesis ? selectedCount : "(".concat(selectedCount, ")") })) : null, (mergedLang.clearAllText.value || clearAllIcon) && selectedCount ? ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.button, { internalClassName: "ss__facet__header__clear-all", name: 'reset-facet', onClick: function (e) {
-                                                    var _a;
-                                                    e.stopPropagation();
-                                                    (_a = facet === null || facet === void 0 ? void 0 : facet.clear.url) === null || _a === void 0 ? void 0 : _a.link.onClick();
-                                                }, icon: clearAllIcon ? clearAllIcon : undefined, children: mergedLang.clearAllText.value && showClearAllText ? (0, jsx_runtime_1.jsx)("label", __assign({}, mergedLang.clearAllText.all)) : null }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}))] }), (0, jsx_runtime_1.jsx)(Icon_1.Icon, __assign({}, subProps.icon, ((selectedFacet === null || selectedFacet === void 0 ? void 0 : selectedFacet.field) === facet.field
-                                        ? __assign({}, (typeof iconExpand == 'string' ? { icon: iconExpand } : iconExpand)) : __assign({}, (typeof iconCollapse == 'string' ? { icon: iconCollapse } : iconCollapse)))))] })), disableOverlay: false, children: (0, jsx_runtime_1.jsx)(Facet_1.Facet, __assign({}, subProps.facet, { facet: facet })) })));
-                    }), !hideFiltersButton && (isOverflowing || alwaysShowFiltersButton) && ((0, jsx_runtime_1.jsx)(MobileSidebar_1.MobileSidebar, __assign({ controller: controller }, subProps.MobileSidebar)))] }) })) })) : null;
+                            };
+                            //deep merge with props.lang
+                            var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
+                            var mergedLang = (0, hooks_2.useLang)(lang, {
+                                selectedFacet: selectedFacet,
+                                facet: facet,
+                            });
+                            return ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, __assign({}, subProps.dropdown, { internalClassName: (0, classnames_1.default)(subProps.dropdown.internalClassName, "ss__facets-horizontal__header__dropdown--".concat(facet.display), "ss__facets-horizontal__header__dropdown--".concat(facet.field)), open: (selectedFacet === null || selectedFacet === void 0 ? void 0 : selectedFacet.field) === facet.field, onClick: function (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: (0, jsx_runtime_1.jsxs)("div", __assign({ className: "ss__dropdown__button__heading" }, mergedLang.dropdownButton.attributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__facet__header__inner", children: [(0, jsx_runtime_1.jsx)("span", __assign({}, mergedLang.dropdownButton.value, { children: facet === null || facet === void 0 ? void 0 : facet.label })), showSelectedCount && selectedCount && facet.type !== 'range' ? ((0, jsx_runtime_1.jsx)("span", { className: "ss__facet__header__selected-count", children: hideSelectedCountParenthesis ? selectedCount : "(".concat(selectedCount, ")") })) : null, (mergedLang.clearAllText.value || clearAllIcon) && selectedCount ? ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.button, { internalClassName: "ss__facet__header__clear-all", name: 'reset-facet', onClick: function (e) {
+                                                        e.stopPropagation();
+                                                        facet === null || facet === void 0 ? void 0 : facet.clear.url.link.onClick();
+                                                    }, icon: clearAllIcon ? clearAllIcon : undefined, children: mergedLang.clearAllText.value && showClearAllText ? (0, jsx_runtime_1.jsx)("label", __assign({}, mergedLang.clearAllText.all)) : null }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}))] }), (0, jsx_runtime_1.jsx)(Icon_1.Icon, __assign({}, subProps.icon, ((selectedFacet === null || selectedFacet === void 0 ? void 0 : selectedFacet.field) === facet.field
+                                            ? __assign({}, (typeof iconExpand == 'string' ? { icon: iconExpand } : iconExpand)) : __assign({}, (typeof iconCollapse == 'string' ? { icon: iconCollapse } : iconCollapse)))))] })), disableOverlay: false, children: (0, jsx_runtime_1.jsx)(Facet_1.Facet, __assign({}, subProps.facet, { facet: facet })) })));
+                        }), renderSidebar && (0, jsx_runtime_1.jsx)(ToggleSidebarButton, { sidebarOpenState: sidebarOpenState, setSidebarOpenState: setSidebarOpenState, subProps: subProps })] }), renderSidebar && ((0, jsx_runtime_1.jsx)(Slideout_1.Slideout, __assign({}, subProps.slideout, { active: sidebarOpenState, children: (0, jsx_runtime_1.jsx)(Sidebar_1.Sidebar, __assign({}, subProps.sidebar, { controller: controller })) })))] })) })) : null;
 });

package/dist/cjs/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/cjs/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/cjs/components/src/components/Organisms/Layout/Layout.js

@@ -27,7 +27,6 @@ var LoadMore_1 = require("../../Molecules/LoadMore");
 var SortBy_1 = require("../../Molecules/SortBy");
 var PerPage_1 = require("../../Molecules/PerPage");
 var LayoutSelector_1 = require("../../Molecules/LayoutSelector");
-var MobileSidebar_1 = require("../MobileSidebar");
 var PaginationInfo_1 = require("../../Atoms/PaginationInfo/PaginationInfo");
 var SearchHeader_1 = require("../../Atoms/SearchHeader/SearchHeader");
 var Button_1 = require("../../Atoms/Button");
@@ -72,13 +71,6 @@ exports.Layout = (0, mobx_react_lite_1.observer)(function (properties) {
     delete props.treePath;
     var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
     var subProps = {
-        MobileSidebar: __assign(__assign({ 
-            // default props
-            controller: controller }, (0, utilities_1.defined)({
-            disableStyles: disableStyles,
-        })), { 
-            // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: properties.treePath }),
         Banner: __assign(__assign({ 
             // default props
             controller: controller, content: controller.store.merchandising.content }, (0, utilities_1.defined)({
@@ -174,11 +166,6 @@ exports.Layout = (0, mobx_react_lite_1.observer)(function (properties) {
     function renderModule(module) {
         var _a, _b;
         switch (module) {
-            case 'mobileSidebar':
-                if (hasResults) {
-                    return (0, jsx_runtime_1.jsx)(MobileSidebar_1.MobileSidebar, __assign({ controller: controller }, subProps.MobileSidebar));
-                }
-                break;
             case 'searchHeader':
                 return (0, jsx_runtime_1.jsx)(SearchHeader_1.SearchHeader, __assign({}, subProps.SearchHeader));
             case 'filterSummary':
@@ -208,7 +195,7 @@ exports.Layout = (0, mobx_react_lite_1.observer)(function (properties) {
                 break;
             case 'button.sidebar-toggle':
                 if (hasResults) {
-                    return (ToggleSideBarButton && ((0, jsx_runtime_1.jsx)("div", { className: "ss__button--sidebar-toggle-button-wrapper", children: (0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.ToggleSideBarButton)) })));
+                    return (ToggleSideBarButton && ((0, jsx_runtime_1.jsx)("div", { className: "ss__layout__sidebar-toggle-button-wrapper", children: (0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.ToggleSideBarButton)) })));
                 }
                 break;
             case 'pagination':

package/dist/cjs/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/cjs/components/src/components/Organisms/Results/Results.js

@@ -38,7 +38,7 @@ var defaultStyles = function (_a) {
         flexFlow: 'row wrap',
         gap: gapSize,
         gridTemplateRows: 'auto',
-        gridTemplateColumns: "repeat(".concat(columns, ", minmax(0, 1fr))"),
+        gridTemplateColumns: "repeat(".concat(columns, ", 1fr)"),
         '& .ss__result, & .ss__result-layout': (_b = {
                 boxSizing: 'border-box',
                 flex: '0 1 auto',
@@ -130,6 +130,16 @@ exports.Results = (0, mobx_react_lite_1.observer)(function (properties) {
         results = results === null || results === void 0 ? void 0 : results.slice(0, props.columns * props.rows);
     }
     var styling = (0, utilities_1.mergeStyles)(__assign(__assign({}, props), { columns: layout == types_1.ResultsLayout.list ? 1 : props.columns }), defaultStyles);
+    // Precompute merged theme for named result components to avoid repeated deepmerge in the loop
+    var mergedResultComponentTheme = isNamedResultComponent
+        ? (0, deepmerge_1.default)(theme || {}, {
+            components: {
+                result: {
+                    customComponent: resultComponent,
+                },
+            },
+        })
+        : theme;
     return (results === null || results === void 0 ? void 0 : results.length) ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__results', "ss__results-".concat(props.layout), className, internalClassName), children: results.map(function (result) {
                 return (function () {
                     switch (result.type) {
@@ -144,7 +154,7 @@ exports.Results = (0, mobx_react_lite_1.observer)(function (properties) {
                                         key: result.id,
                                         controller: controller,
                                         result: result,
-                                        theme: theme,
+                                        theme: mergedResultComponentTheme,
                                         treePath: treePath,
                                     }) }));
                             }

package/dist/cjs/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/cjs/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/cjs/components/src/components/Organisms/Toolbar/Toolbar.js

@@ -31,7 +31,7 @@ exports.Toolbar = (0, mobx_react_lite_1.observer)(function (properties) {
     var globalTreePath = (0, providers_1.useTreePath)();
     var defaultProps = {
         treePath: globalTreePath,
-        layout: ['mobileSidebar', 'filterSummary', 'paginationInfo', 'sortBy', 'perPage', 'pagination'],
+        layout: ['button.sidebar-toggle', 'filterSummary', 'paginationInfo', 'sortBy', 'perPage', 'pagination'],
     };
     var props = (0, utilities_1.mergeProps)('toolbar', globalTheme, defaultProps, properties);
     var controller = props.controller, toggleSideBarButton = props.toggleSideBarButton, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, treePath = props.treePath, layout = props.layout;
@@ -43,7 +43,8 @@ exports.Toolbar = (0, mobx_react_lite_1.observer)(function (properties) {
     var subProps = {
         Layout: __assign(__assign({ 
             // default props
-            toggleSideBarButton: toggleSideBarButton, internalClassName: 'ss__toolbar__layout' }, (0, utilities_1.defined)({
+            internalClassName: 'ss__toolbar__layout' }, (0, utilities_1.defined)({
+            toggleSideBarButton: toggleSideBarButton,
             disableStyles: disableStyles,
         })), { 
             // component theme overrides

package/dist/cjs/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/cjs/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/cjs/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.js

@@ -139,8 +139,6 @@ exports.AutocompleteFixed = (0, mobx_react_lite_1.observer)(function (properties
                 icon: 'close-thin',
             }, closeSearchButton: {
                 onClick: function () { return reset(); },
-            }, chatButton: {
-                onClick: function () { return controller.openChat(); },
             }, inputName: inputName }, (0, utilities_1.defined)({
             disableStyles: disableStyles,
         })), { 
@@ -208,5 +206,5 @@ exports.AutocompleteFixed = (0, mobx_react_lite_1.observer)(function (properties
     delete acProps.style;
     delete acProps.styleScript;
     delete acProps.themeStyleScript;
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (layout === null || layout === void 0 ? void 0 : layout.length) && active ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__autocomplete-fixed', className, internalClassName), children: (0, jsx_runtime_1.jsx)(Modal_1.Modal, __assign({}, subProps.modal, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ss__autocomplete-fixed__inner", ref: function (e) { return (0, hooks_2.useA11y)(e, 0, true, reset); }, children: [renderInput ? ((0, jsx_runtime_1.jsx)(SearchInput_1.SearchInput, __assign({}, subProps.searchInput, { value: controller.store.state.input || '', inputRef: renderedInputRef }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("div", { className: "ss__autocomplete-fixed__inner__layout-wrapper", children: (0, jsx_runtime_1.jsx)(AutocompleteLayout_1.AutocompleteLayout, __assign({}, acProps, subProps.autocompleteLayout, { input: _input, controller: controller, treePath: "".concat(treePath, " modal") })) })] }) })) })) })) : null }));
+    return (layout === null || layout === void 0 ? void 0 : layout.length) && active ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__autocomplete-fixed', className, internalClassName), children: (0, jsx_runtime_1.jsx)(Modal_1.Modal, __assign({}, subProps.modal, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ss__autocomplete-fixed__inner", ref: function (e) { return (0, hooks_2.useA11y)(e, 0, true, reset); }, children: [renderInput ? ((0, jsx_runtime_1.jsx)(SearchInput_1.SearchInput, __assign({}, subProps.searchInput, { value: controller.store.state.input || '', inputRef: renderedInputRef }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("div", { className: "ss__autocomplete-fixed__inner__layout-wrapper", children: (0, jsx_runtime_1.jsx)(AutocompleteLayout_1.AutocompleteLayout, __assign({}, acProps, subProps.autocompleteLayout, { input: _input, controller: controller, treePath: "".concat(treePath, " modal") })) })] }) })) })) })) : null;
 });

package/dist/cjs/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/cjs/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/cjs/components/src/components/Templates/AutocompleteModal/AutocompleteModal.js

@@ -153,8 +153,6 @@ exports.AutocompleteModal = (0, mobx_react_lite_1.observer)(function (properties
             }, closeSearchButton: {
                 onClick: function () { return reset(); },
                 icon: 'angle-left',
-            }, chatButton: {
-                onClick: function () { return controller.openChat(); },
             }, inputName: inputName }, (0, utilities_1.defined)({
             disableStyles: disableStyles,
         })), { 
@@ -180,5 +178,5 @@ exports.AutocompleteModal = (0, mobx_react_lite_1.observer)(function (properties
     delete acProps.style;
     delete acProps.styleScript;
     delete acProps.themeStyleScript;
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (layout === null || layout === void 0 ? void 0 : layout.length) && active ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__autocomplete-modal', className, internalClassName), children: (0, jsx_runtime_1.jsx)(Modal_1.Modal, __assign({}, subProps.modal, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ss__autocomplete-modal__inner", ref: function (e) { return (0, hooks_2.useA11y)(e, 0, true, reset); }, children: [renderInput ? ((0, jsx_runtime_1.jsx)(SearchInput_1.SearchInput, __assign({}, subProps.searchInput, { value: controller.store.state.input || '', inputRef: renderedInputRef }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)(AutocompleteLayout_1.AutocompleteLayout, __assign({}, acProps, subProps.autocompleteLayout, { input: _input, controller: controller, treePath: "".concat(treePath, " modal") }))] }) })) })) })) : null }));
+    return (layout === null || layout === void 0 ? void 0 : layout.length) && active ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__autocomplete-modal', className, internalClassName), children: (0, jsx_runtime_1.jsx)(Modal_1.Modal, __assign({}, subProps.modal, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ss__autocomplete-modal__inner", ref: function (e) { return (0, hooks_2.useA11y)(e, 0, true, reset); }, children: [renderInput ? ((0, jsx_runtime_1.jsx)(SearchInput_1.SearchInput, __assign({}, subProps.searchInput, { value: controller.store.state.input || '', inputRef: renderedInputRef }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)(AutocompleteLayout_1.AutocompleteLayout, __assign({}, acProps, subProps.autocompleteLayout, { input: _input, controller: controller, treePath: "".concat(treePath, " modal") }))] }) })) })) })) : null;
 });

package/dist/cjs/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 = {