@athoscommerce/snap-preact 1.0.0

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

@@ -0,0 +1,268 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Layout = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+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 FilterSummary_1 = require("../FilterSummary");
+var utilities_1 = require("../../../utilities");
+var Pagination_1 = require("../../Molecules/Pagination");
+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");
+var Banner_1 = require("../../Atoms/Banner");
+var snap_store_mobx_1 = require("@athoscommerce/snap-store-mobx");
+var Facets_1 = require("../Facets");
+var FacetsHorizontal_1 = require("../FacetsHorizontal");
+var Breadcrumbs_1 = require("../../Atoms/Breadcrumbs");
+var defaultStyles = function (_a) {
+    return (0, react_1.css)({
+        display: 'flex',
+        alignItems: 'center',
+        flexWrap: 'wrap',
+        gap: '10px',
+        '.ss__layout__separator': {
+            flex: '1 1 auto',
+        },
+        '.ss__layout__row:empty': {
+            display: 'none',
+        },
+        '.ss__layout__row': {
+            display: 'flex',
+            alignItems: 'center',
+            flexWrap: 'wrap',
+            flexBasis: '100%',
+            minWidth: '100%',
+            gap: '10px',
+            '& > div:only-child': {
+                width: '100%',
+            },
+        },
+    });
+};
+exports.Layout = (0, mobx_react_lite_1.observer)(function (properties) {
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultProps = {
+        treePath: globalTreePath,
+    };
+    var props = (0, utilities_1.mergeProps)('layout', globalTheme, defaultProps, properties);
+    var controller = props.controller, toggleSideBarButton = props.toggleSideBarButton, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, layout = props.layout;
+    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)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: properties.treePath }),
+        SearchHeader: __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 }),
+        FilterSummary: __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 }),
+        LayoutSelector: __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 }),
+        Breadcrumbs: __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 }),
+        Facets: __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 }),
+        FacetsHorizontal: __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 }),
+        Pagination: __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 }),
+        PaginationInfo: __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 }),
+        LoadMore: __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 }),
+        SortBy: __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 }),
+        PerPage: __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 }),
+        ToggleSideBarButton: __assign(__assign(__assign(__assign({}, toggleSideBarButton), { controller: controller, name: 'sidebar-toggle' }), (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: properties.treePath }),
+    };
+    var ToggleSideBarButton = toggleSideBarButton;
+    var hasResults = controller.store.pagination.totalResults > 0;
+    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':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(FilterSummary_1.FilterSummary, __assign({}, subProps.FilterSummary));
+                }
+                break;
+            case 'layoutSelector':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(LayoutSelector_1.LayoutSelector, __assign({}, subProps.LayoutSelector));
+                }
+                break;
+            case 'paginationInfo':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(PaginationInfo_1.PaginationInfo, __assign({}, subProps.PaginationInfo));
+                }
+                break;
+            case 'sortBy':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(SortBy_1.SortBy, __assign({}, subProps.SortBy));
+                }
+                break;
+            case 'perPage':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(PerPage_1.PerPage, __assign({}, subProps.PerPage));
+                }
+                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)) })));
+                }
+                break;
+            case 'pagination':
+                if (hasResults) {
+                    if ((_b = (_a = controller.store.config.settings) === null || _a === void 0 ? void 0 : _a.infinite) === null || _b === void 0 ? void 0 : _b.enabled) {
+                        return (0, jsx_runtime_1.jsx)(LoadMore_1.LoadMore, __assign({}, subProps.LoadMore));
+                    }
+                    else {
+                        return (0, jsx_runtime_1.jsx)(Pagination_1.Pagination, __assign({}, subProps.Pagination));
+                    }
+                }
+                break;
+            case 'breadcrumbs':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(Breadcrumbs_1.Breadcrumbs, __assign({}, subProps.Breadcrumbs));
+                }
+                break;
+            case '_':
+                return (0, jsx_runtime_1.jsx)("div", { className: "ss__layout__separator ss__layout__separator--".concat(separatorIndex++) });
+            case 'banner.banner':
+                return (0, jsx_runtime_1.jsx)(Banner_1.Banner, __assign({}, subProps.Banner, { type: snap_store_mobx_1.ContentType.BANNER, name: 'banner' }));
+            case 'banner.footer':
+                return (0, jsx_runtime_1.jsx)(Banner_1.Banner, __assign({}, subProps.Banner, { type: snap_store_mobx_1.ContentType.FOOTER, name: 'footer' }));
+            case 'banner.header':
+                return (0, jsx_runtime_1.jsx)(Banner_1.Banner, __assign({}, subProps.Banner, { type: snap_store_mobx_1.ContentType.HEADER, name: 'header' }));
+            case 'banner.left':
+                return (0, jsx_runtime_1.jsx)(Banner_1.Banner, __assign({}, subProps.Banner, { type: snap_store_mobx_1.ContentType.LEFT, name: 'left' }));
+            case 'facets':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(Facets_1.Facets, __assign({}, subProps.Facets));
+                }
+                break;
+            case 'facetsHorizontal':
+                if (hasResults) {
+                    return (0, jsx_runtime_1.jsx)(FacetsHorizontal_1.FacetsHorizontal, __assign({}, subProps.Facets));
+                }
+                break;
+            default:
+                return null;
+        }
+    }
+    var rowIndex = 0;
+    var separatorIndex = 0;
+    var rows = layout === null || layout === void 0 ? void 0 : layout.map(function (module) {
+        if (Array.isArray(module)) {
+            var children_1 = module.map(function (subModule) { return renderModule(subModule); });
+            var hasContent = module.some(function (subModule, i) { return subModule !== '_' && children_1[i]; });
+            if (!hasContent)
+                return null;
+            return (0, jsx_runtime_1.jsx)("div", { className: "ss__layout__row ss__layout__row--".concat(rowIndex++), children: children_1 });
+        }
+        else {
+            return renderModule(module);
+        }
+    });
+    return (rows === null || rows === void 0 ? void 0 : rows.some(Boolean)) ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__layout', className, internalClassName), children: rows })) })) : null;
+});

package/dist/cjs/components/src/components/Organisms/Layout/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Layout';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/src/components/Organisms/Layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/cjs/components/src/components/Organisms/Layout/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Layout"), exports);

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

@@ -0,0 +1,45 @@
+import type { ComponentProps } from '../../../types';
+import type { SearchController } from '@athoscommerce/snap-controller';
+import type { SideBarModuleNames } from '../Sidebar';
+import { Lang } from '../../../hooks';
+import type { IconProps, IconType } from '../../Atoms/Icon';
+export declare const MobileSidebar: ((properties: MobileSidebarProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};
+export type MobileSidebarProps = {
+    controller: SearchController;
+    lang?: Partial<MobileSidebarLang>;
+} & MobileSidebarTemplatesLegalProps & ComponentProps<MobileSidebarProps>;
+export type MobileSidebarTemplatesLegalProps = {
+    layout?: SideBarModuleNames[] | SideBarModuleNames[][];
+    titleText?: string;
+    hideOpenButtonText?: boolean;
+    hideClearButtonText?: boolean;
+    hideApplyButtonText?: boolean;
+    hideCloseButtonText?: boolean;
+    openButtonText?: string;
+    clearButtonText?: string;
+    applyButtonText?: string;
+    closeButtonText?: string;
+    applyButtonIcon?: IconType | Partial<IconProps>;
+    clearButtonIcon?: IconType | Partial<IconProps>;
+    closeButtonIcon?: IconType | Partial<IconProps>;
+    openButtonIcon?: IconType | Partial<IconProps>;
+    hideTitleText?: boolean;
+    hideHeader?: boolean;
+    hideFooter?: boolean;
+    hideApplyButton?: boolean;
+    hideClearButton?: boolean;
+    hideCloseButton?: boolean;
+    displayAt?: string;
+};
+export interface MobileSidebarLang {
+    openButtonText: Lang<never>;
+    clearButtonText: Lang<never>;
+    applyButtonText: Lang<never>;
+    titleText: Lang<{
+        controller: SearchController;
+    }>;
+    closeButtonText: Lang<never>;
+}
+//# sourceMappingURL=MobileSidebar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MobileSidebar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/MobileSidebar/MobileSidebar.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAGlE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAErD,OAAO,EAAE,IAAI,EAAoB,MAAM,gBAAgB,CAAC;AAExD,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AA0C5D,eAAO,MAAM,aAAa,gBAAyB,kBAAkB;;CA0OnE,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG;IAChC,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CAClC,GAAG,gCAAgC,GACnC,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAEpC,MAAM,MAAM,gCAAgC,GAAG;IAC9C,MAAM,CAAC,EAAE,kBAAkB,EAAE,GAAG,kBAAkB,EAAE,EAAE,CAAC;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAChD,eAAe,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAChD,eAAe,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAChD,cAAc,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,WAAW,iBAAiB;IACjC,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC5B,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7B,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7B,SAAS,EAAE,IAAI,CAAC;QACf,UAAU,EAAE,gBAAgB,CAAC;KAC7B,CAAC,CAAC;IACH,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CAC7B"}

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

@@ -0,0 +1,167 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MobileSidebar = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+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 Slideout_1 = require("../../Molecules/Slideout");
+var utilities_1 = require("../../../utilities");
+var Button_1 = require("../../Atoms/Button");
+var hooks_1 = require("../../../hooks");
+var hooks_2 = require("preact/hooks");
+var deepmerge_1 = __importDefault(require("deepmerge"));
+var Layout_1 = require("../Layout");
+var defaultStyles = function (_a) {
+    return (0, react_1.css)({
+        '& .ss__mobile-sidebar__header': {
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'baseline',
+            '& .ss__mobile-sidebar__header__close-button': {
+                cursor: 'pointer',
+            },
+        },
+        '& .ss__mobile-sidebar__title': {
+            justifyContent: 'space-between',
+            flexDirection: 'row',
+            display: 'flex',
+            '& .ss__icon': {
+                cursor: 'pointer',
+            },
+        },
+        '& .ss__mobile-sidebar__slideout__button': {
+            cursor: 'pointer',
+        },
+        '& .ss__mobile-sidebar__footer': {
+            display: 'flex',
+            gap: '10px',
+            justifyContent: 'center',
+            flexDirection: 'row',
+        },
+        '& .ss__facets': {
+            width: '100%',
+        },
+    });
+};
+exports.MobileSidebar = (0, mobx_react_lite_1.observer)(function (properties) {
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultProps = {
+        openButtonText: 'Filters',
+        clearButtonText: 'Clear All',
+        applyButtonText: 'Apply',
+        layout: ['filterSummary', 'sortBy', 'perPage', 'facets', 'banner.left'],
+        titleText: 'Filter Options',
+        displayAt: '',
+        closeButtonIcon: 'close-thin',
+        treePath: globalTreePath,
+    };
+    var props = (0, utilities_1.mergeProps)('mobileSidebar', globalTheme, defaultProps, properties);
+    var controller = props.controller, layout = props.layout, hideHeader = props.hideHeader, hideApplyButton = props.hideApplyButton, clearButtonIcon = props.clearButtonIcon, hideCloseButton = props.hideCloseButton, closeButtonText = props.closeButtonText, openButtonText = props.openButtonText, clearButtonText = props.clearButtonText, applyButtonIcon = props.applyButtonIcon, applyButtonText = props.applyButtonText, closeButtonIcon = props.closeButtonIcon, openButtonIcon = props.openButtonIcon, titleText = props.titleText, hideCloseButtonText = props.hideCloseButtonText, hideOpenButtonText = props.hideOpenButtonText, hideClearButtonText = props.hideClearButtonText, hideApplyButtonText = props.hideApplyButtonText, hideTitleText = props.hideTitleText, displayAt = props.displayAt, hideClearButton = props.hideClearButton, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, treePath = props.treePath;
+    var hideFooter = props.hideFooter;
+    if (hideApplyButton && hideClearButton) {
+        hideFooter = true;
+    }
+    var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
+    var subProps = {
+        slideout: __assign(__assign({ 
+            // default props
+            controller: controller, displayAt: (displayAt && "(max-width: ".concat(displayAt, ")")) || '' }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+        button: __assign(__assign({}, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+        layout: __assign(__assign({}, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+    };
+    var closeButtonRef = (0, hooks_2.useRef)();
+    var openButtonRef = (0, hooks_2.useRef)();
+    //initialize lang
+    var defaultLang = {
+        openButtonText: {
+            value: openButtonText,
+        },
+        clearButtonText: {
+            value: clearButtonText,
+        },
+        applyButtonText: {
+            value: applyButtonText,
+        },
+        titleText: {
+            value: titleText,
+        },
+        closeButtonText: {
+            value: closeButtonText,
+            attributes: {
+                'aria-label': closeButtonText || "close ".concat(openButtonText),
+            },
+        },
+    };
+    //deep merge with props.lang
+    var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
+    if (hideOpenButtonText) {
+        delete lang.openButtonText.value;
+    }
+    if (hideClearButtonText) {
+        delete lang.clearButtonText.value;
+    }
+    if (hideCloseButtonText) {
+        delete lang.closeButtonText.value;
+    }
+    if (hideApplyButtonText) {
+        delete lang.applyButtonText.value;
+    }
+    var mergedLang = (0, hooks_1.useLang)(lang, {
+        controller: controller,
+    });
+    var Content = function (props) {
+        var _a;
+        var toggleActive = props.toggleActive;
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "ss__mobile-sidebar__content", ref: function (e) {
+                return (0, hooks_1.useA11y)(e, 0, true, function () {
+                    var _a, _b, _c, _d;
+                    (_b = (_a = closeButtonRef.current) === null || _a === void 0 ? void 0 : _a.base) === null || _b === void 0 ? void 0 : _b.focus();
+                    (_d = (_c = closeButtonRef.current) === null || _c === void 0 ? void 0 : _c.base) === null || _d === void 0 ? void 0 : _d.click();
+                    openButtonRef.current.base.focus();
+                });
+            }, children: [!hideHeader && ((0, jsx_runtime_1.jsxs)("div", { className: "ss__mobile-sidebar__header", children: [!hideTitleText && ((0, jsx_runtime_1.jsx)("h4", __assign({ "aria-atomic": "true", "aria-live": "polite", className: "ss__mobile-sidebar__header__title" }, (_a = mergedLang.titleText) === null || _a === void 0 ? void 0 : _a.all))), !hideCloseButton && ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ internalClassName: "ss__mobile-sidebar__header__close-button", disableStyles: true, onClick: function () { return toggleActive(); }, ref: function (e) {
+                                if (e) {
+                                    closeButtonRef.current = e;
+                                }
+                            }, icon: closeButtonIcon, lang: { button: lang.closeButtonText } }, subProps.button, { name: 'close' })))] })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__mobile-sidebar__inner'), children: (0, jsx_runtime_1.jsx)(Layout_1.Layout, __assign({ controller: controller, layout: layout || [] }, subProps.layout)) }), !hideFooter && ((0, jsx_runtime_1.jsxs)("div", { className: "ss__mobile-sidebar__footer", children: [!hideApplyButton && ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ internalClassName: "ss__mobile-sidebar__footer__apply-button", icon: applyButtonIcon, onClick: function () { return toggleActive(); }, lang: { button: lang.applyButtonText } }, subProps.button, { name: 'apply' }))), !hideClearButton && ((0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ internalClassName: "ss__mobile-sidebar__footer__clear-button", icon: clearButtonIcon, onClick: function () {
+                                controller === null || controller === void 0 ? void 0 : controller.urlManager.remove('filter').remove('page').go();
+                                toggleActive();
+                            }, lang: { button: lang.clearButtonText } }, subProps.button, { name: 'clear' })))] }))] }));
+    };
+    var contentRef = (0, hooks_2.useRef)();
+    return ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__mobile-sidebar', className, internalClassName), children: (0, jsx_runtime_1.jsx)(Slideout_1.Slideout, __assign({ internalClassName: "ss__mobile-sidebar__slideout", buttonContent: (0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ internalClassName: "ss__mobile-sidebar__slideout__button", icon: openButtonIcon, ref: openButtonRef, onClick: function () {
+                        setTimeout(function () {
+                            var _a, _b;
+                            (_b = (_a = contentRef.current) === null || _a === void 0 ? void 0 : _a.base) === null || _b === void 0 ? void 0 : _b.focus();
+                        });
+                    } }, subProps.button, { name: 'slideout', lang: { button: lang.openButtonText } })) }, subProps.slideout, { children: (0, jsx_runtime_1.jsx)(Content, { ref: contentRef }) })) })) }));
+});

package/dist/cjs/components/src/components/Organisms/MobileSidebar/index.d.ts

@@ -0,0 +1,2 @@
+export * from './MobileSidebar';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/src/components/Organisms/MobileSidebar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/MobileSidebar/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/cjs/components/src/components/Organisms/MobileSidebar/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./MobileSidebar"), exports);

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

@@ -0,0 +1,50 @@
+import { ComponentProps } from '../../../types';
+import type { RecommendationControllerConfig } from '@athoscommerce/snap-controller';
+import type { SearchController } from '@athoscommerce/snap-controller';
+import type { Lang } from '../../../hooks';
+import type { LibraryImports } from '../../../../../src/Templates/Stores/LibraryStore';
+export declare const NoResults: ((properties: NoResultsProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};
+type NoResultsContact = {
+    title: string;
+    content: string;
+};
+export type NoResultsProps = {
+    lang?: NoResultsLang;
+} & NoResultsTemplatesLegalProps & ComponentProps<NoResultsProps>;
+export type NoResultsTemplatesLegalProps = {
+    contentSlot?: string | JSX.Element;
+    suggestionsTitleText?: string;
+    hideSuggestionsTitleText?: boolean;
+    suggestionsList?: string[];
+    hideContact?: boolean;
+    hideSuggestions?: boolean;
+    contactsTitleText?: string;
+    hideContactsTitleText?: boolean;
+    contactsList?: NoResultsContact[];
+    templates?: {
+        recommendation?: {
+            enabled: boolean;
+            component?: keyof LibraryImports['component']['recommendation']['default'];
+            resultComponent?: keyof LibraryImports['component']['result'] | (string & NonNullable<unknown>);
+            config?: Partial<RecommendationControllerConfig>;
+        };
+    };
+};
+export interface NoResultsLang {
+    suggestionsTitleText: Lang<{
+        controller: SearchController;
+    }>;
+    suggestionsList: Lang<{
+        controller: SearchController;
+    }>;
+    contactsTitleText?: Lang<{
+        controller: SearchController;
+    }>;
+    contactsList?: Lang<{
+        controller: SearchController;
+    }>;
+}
+export {};
+//# sourceMappingURL=NoResults.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NoResults.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/NoResults/NoResults.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAIhD,OAAO,KAAK,EAA4B,8BAA8B,EAAE,MAAM,gCAAgC,CAAC;AAG/G,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGvE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kDAAkD,CAAC;AAMvF,eAAO,MAAM,SAAS,gBAAyB,cAAc;;CAqK3D,CAAC;AAEH,KAAK,gBAAgB,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC5B,IAAI,CAAC,EAAE,aAAa,CAAC;CACrB,GAAG,4BAA4B,GAC/B,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,MAAM,4BAA4B,GAAG;IAC1C,WAAW,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IACnC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAClC,SAAS,CAAC,EAAE;QACX,cAAc,CAAC,EAAE;YAChB,OAAO,EAAE,OAAO,CAAC;YACjB,SAAS,CAAC,EAAE,MAAM,cAAc,CAAC,WAAW,CAAC,CAAC,gBAAgB,CAAC,CAAC,SAAS,CAAC,CAAC;YAC3E,eAAe,CAAC,EAAE,MAAM,cAAc,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;YAChG,MAAM,CAAC,EAAE,OAAO,CAAC,8BAA8B,CAAC,CAAC;SACjD,CAAC;KACF,CAAC;CACF,CAAC;AAEF,MAAM,WAAW,aAAa;IAC7B,oBAAoB,EAAE,IAAI,CAAC;QAAE,UAAU,EAAE,gBAAgB,CAAA;KAAE,CAAC,CAAC;IAC7D,eAAe,EAAE,IAAI,CAAC;QAAE,UAAU,EAAE,gBAAgB,CAAA;KAAE,CAAC,CAAC;IACxD,iBAAiB,CAAC,EAAE,IAAI,CAAC;QAAE,UAAU,EAAE,gBAAgB,CAAA;KAAE,CAAC,CAAC;IAC3D,YAAY,CAAC,EAAE,IAAI,CAAC;QAAE,UAAU,EAAE,gBAAgB,CAAA;KAAE,CAAC,CAAC;CACtD"}