@athoscommerce/snap-preact 1.0.0

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

@@ -0,0 +1,117 @@
+"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.NoResults = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var mobx_react_lite_1 = require("mobx-react-lite");
+var react_1 = require("@emotion/react");
+var classnames_1 = __importDefault(require("classnames"));
+var providers_1 = require("../../../providers");
+var utilities_1 = require("../../../utilities");
+var snap_toolbox_1 = require("@athoscommerce/snap-toolbox");
+var useComponent_1 = require("../../../hooks/useComponent");
+var useCreateController_1 = require("../../../hooks/useCreateController");
+var deepmerge_1 = __importDefault(require("deepmerge"));
+var hooks_1 = require("../../../hooks");
+var defaultStyles = function (_a) {
+    return (0, react_1.css)({});
+};
+exports.NoResults = (0, mobx_react_lite_1.observer)(function (properties) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultProps = {
+        suggestionsTitleText: "Suggestions",
+        suggestionsList: [
+            "Check for misspellings.",
+            "Remove possible redundant keywords (ie. \"products\").",
+            "Use other words to describe what you are searching for.",
+        ],
+        templates: {
+            recommendation: {
+                enabled: true,
+            },
+        },
+        treePath: globalTreePath,
+    };
+    var props = (0, utilities_1.mergeProps)('noResults', globalTheme, defaultProps, properties);
+    var contentSlot = props.contentSlot, suggestionsTitleText = props.suggestionsTitleText, hideSuggestionsTitleText = props.hideSuggestionsTitleText, hideContactsTitleText = props.hideContactsTitleText, suggestionsList = props.suggestionsList, hideContact = props.hideContact, contactsTitleText = props.contactsTitleText, hideSuggestions = props.hideSuggestions, contactsList = props.contactsList, controller = props.controller, templates = props.templates, className = props.className, internalClassName = props.internalClassName, treePath = props.treePath;
+    var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
+    var suggestionsExist = suggestionsList && Array.isArray(suggestionsList) && suggestionsList.length !== 0;
+    var contactsExist = contactsList && Array.isArray(contactsList) && contactsList.length !== 0;
+    var recommendationTemplateComponent;
+    var recommendationTemplateResultComponent;
+    var recsController;
+    if ((_a = templates === null || templates === void 0 ? void 0 : templates.recommendation) === null || _a === void 0 ? void 0 : _a.enabled) {
+        var componentName = ((_b = templates === null || templates === void 0 ? void 0 : templates.recommendation) === null || _b === void 0 ? void 0 : _b.component) || 'Recommendation';
+        var snap = (0, providers_1.useSnap)();
+        if (snap === null || snap === void 0 ? void 0 : snap.templates) {
+            var themeName = (_c = properties.theme) === null || _c === void 0 ? void 0 : _c.name;
+            var defaultResultComponentFromTheme = void 0;
+            if (themeName) {
+                defaultResultComponentFromTheme = (_e = (_d = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _d === void 0 ? void 0 : _d.config.theme) === null || _e === void 0 ? void 0 : _e.resultComponent;
+            }
+            var resultComponentName = (((_f = templates === null || templates === void 0 ? void 0 : templates.recommendation) === null || _f === void 0 ? void 0 : _f.resultComponent) || defaultResultComponentFromTheme);
+            var mergedConfig = Object.assign({
+                id: '',
+                tag: 'no-results',
+                branch: 'production',
+            }, templates.recommendation.config);
+            mergedConfig.id = mergedConfig.id || "search-".concat(mergedConfig.tag);
+            recsController = (0, useCreateController_1.useCreateController)(snap, 'recommendation', mergedConfig);
+            if (!((_g = recsController === null || recsController === void 0 ? void 0 : recsController.store) === null || _g === void 0 ? void 0 : _g.loaded) && !((_h = recsController === null || recsController === void 0 ? void 0 : recsController.store) === null || _h === void 0 ? void 0 : _h.loading) && ((_j = recsController === null || recsController === void 0 ? void 0 : recsController.store.error) === null || _j === void 0 ? void 0 : _j.type) !== 'error') {
+                recsController === null || recsController === void 0 ? void 0 : recsController.search();
+            }
+            if (resultComponentName && ((_k = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _k === void 0 ? void 0 : _k.library.import.component.result)) {
+                recommendationTemplateResultComponent = (0, useComponent_1.useComponent)((_l = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _l === void 0 ? void 0 : _l.library.import.component.result, resultComponentName);
+            }
+            if (componentName && ((_m = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _m === void 0 ? void 0 : _m.library.import.component.recommendation.default)) {
+                recommendationTemplateComponent = (0, useComponent_1.useComponent)((_o = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _o === void 0 ? void 0 : _o.library.import.component.recommendation.default, componentName);
+            }
+        }
+    }
+    var RecommendationTemplateComponent = recommendationTemplateComponent;
+    var RecommendationTemplateResultComponent = recommendationTemplateResultComponent;
+    //deep merge with props.lang
+    var defaultLang = {
+        suggestionsTitleText: {
+            value: suggestionsTitleText,
+        },
+        suggestionsList: {
+            value: "".concat(suggestionsList
+                ? suggestionsList.map(function (suggestion) { return "<li class=\"ss__no-results__suggestions__list__option\">".concat(suggestion, "</li>"); }).join('')
+                : undefined, "\n\t\t\t"),
+        },
+        contactsTitleText: {
+            value: contactsTitleText,
+        },
+        contactsList: {
+            value: "".concat(contactsList
+                ? contactsList
+                    .map(function (contact) {
+                    return "<div class='ss__no-results__contact__detail ss__no-results__contact__detail--".concat(snap_toolbox_1.filters.handleize(contact.title), "'><h4 class=\"ss__no-results__contact__detail__title\">").concat(contact.title, "</h4><p class=\"ss__no-results__contact__detail__content\">").concat(contact.content, "</p></div>");
+                })
+                    .join('')
+                : undefined),
+        },
+    };
+    var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
+    var mergedLang = (0, hooks_1.useLang)(lang, {
+        controller: controller,
+    });
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)('ss__no-results', className, internalClassName) }, styling, { children: [contentSlot &&
+                (typeof contentSlot == 'string' ? ((0, jsx_runtime_1.jsx)("div", { className: "ss__no-results__slot", dangerouslySetInnerHTML: { __html: contentSlot } })) : ((0, jsx_runtime_1.jsx)("div", { className: "ss__no-results__slot", children: (0, utilities_1.cloneWithProps)(contentSlot, { controller: controller, treePath: treePath }) }))), !hideSuggestions && (suggestionsTitleText || suggestionsExist) && ((0, jsx_runtime_1.jsxs)("div", { className: "ss__no-results__suggestions", children: [suggestionsTitleText && !hideSuggestionsTitleText && ((0, jsx_runtime_1.jsx)("h3", __assign({ className: "ss__no-results__suggestions__title" }, (_p = mergedLang.suggestionsTitleText) === null || _p === void 0 ? void 0 : _p.all))), suggestionsExist && (0, jsx_runtime_1.jsx)("ul", __assign({ className: "ss__no-results__suggestions__list" }, (_q = mergedLang.suggestionsList) === null || _q === void 0 ? void 0 : _q.all))] })), !hideContact && (contactsTitleText || contactsExist) && ((0, jsx_runtime_1.jsxs)("div", { className: "ss__no-results__contact", children: [contactsTitleText && !hideContactsTitleText && (0, jsx_runtime_1.jsx)("h3", __assign({ className: "ss__no-results__contact__title" }, (_r = mergedLang.contactsTitleText) === null || _r === void 0 ? void 0 : _r.all)), contactsExist && (0, jsx_runtime_1.jsx)("div", __assign({}, (_s = mergedLang.contactsList) === null || _s === void 0 ? void 0 : _s.all))] })), RecommendationTemplateComponent && ((_t = recsController === null || recsController === void 0 ? void 0 : recsController.store) === null || _t === void 0 ? void 0 : _t.loaded) ? ((0, jsx_runtime_1.jsx)("div", { className: "ss__no-results__recommendations", children: (0, jsx_runtime_1.jsx)(RecommendationTemplateComponent, { controller: recsController, title: (_x = (_w = (_v = (_u = recsController.store) === null || _u === void 0 ? void 0 : _u.profile) === null || _v === void 0 ? void 0 : _v.display) === null || _w === void 0 ? void 0 : _w.templateParameters) === null || _x === void 0 ? void 0 : _x.title, resultComponent: RecommendationTemplateResultComponent, name: 'noResultsRecommendations' }) })) : null] })));
+});

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

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

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

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

package/dist/cjs/components/src/components/Organisms/NoResults/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("./NoResults"), exports);

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

@@ -0,0 +1,19 @@
+import type { SearchController, AutocompleteController, RecommendationController } from '@athoscommerce/snap-controller';
+import type { SearchResultStore } from '@athoscommerce/snap-store-mobx';
+import { ComponentProps, ResultsLayout, BreakpointsProps, ResultComponent } from '../../../types';
+export declare const Results: ((properties: ResultsProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+    displayName: string;
+};
+export type ResultsProps = {
+    breakpoints?: BreakpointsProps;
+    controller?: SearchController | AutocompleteController | RecommendationController;
+    resultComponent?: ResultComponent | string;
+    results?: SearchResultStore;
+} & ResultsTemplatesLegalProps & ComponentProps<ResultsProps>;
+export type ResultsTemplatesLegalProps = {
+    columns?: number;
+    rows?: number;
+    gapSize?: string;
+    layout?: keyof typeof ResultsLayout | ResultsLayout;
+};
+//# sourceMappingURL=Results.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAOA,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,eAAe,EAAe,MAAM,gBAAgB,CAAC;AA4C/G,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CA6HvD,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,eAAe,GAAG,MAAM,CAAC;IAC3C,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,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

@@ -0,0 +1,148 @@
+"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.Results = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var react_1 = require("@emotion/react");
+var mobx_react_lite_1 = require("mobx-react-lite");
+var react_2 = require("@emotion/react");
+var classnames_1 = __importDefault(require("classnames"));
+var deepmerge_1 = __importDefault(require("deepmerge"));
+var snap_store_mobx_1 = require("@athoscommerce/snap-store-mobx");
+var InlineBanner_1 = require("../../Atoms/InlineBanner");
+var Result_1 = require("../../Molecules/Result");
+var types_1 = require("../../../types");
+var utilities_1 = require("../../../utilities");
+var providers_1 = require("../../../providers");
+var useDisplaySettings_1 = require("../../../hooks/useDisplaySettings");
+var ResultTracker_1 = require("../../Trackers/ResultTracker");
+var hooks_1 = require("../../../hooks");
+var defaultStyles = function (_a) {
+    var _b;
+    var gapSize = _a.gapSize, columns = _a.columns;
+    return (0, react_2.css)({
+        display: 'flex',
+        flexFlow: 'row wrap',
+        gap: gapSize,
+        gridTemplateRows: 'auto',
+        gridTemplateColumns: "repeat(".concat(columns, ", 1fr)"),
+        '& .ss__result, & .ss__result-layout': (_b = {
+                boxSizing: 'border-box',
+                flex: '0 1 auto',
+                width: "calc(".concat(100 / columns, "% - (").concat(columns - 1, " * ").concat(gapSize, " / ").concat(columns, " ) )"),
+                marginRight: gapSize,
+                marginBottom: gapSize
+            },
+            _b["&:nth-of-type(".concat(columns, "n)")] = {
+                marginRight: '0',
+            },
+            _b["&:nth-last-of-type(-n+".concat(columns, ")")] = {
+                marginBottom: '0',
+            },
+            _b),
+        '@supports (display: grid)': {
+            display: 'grid',
+            '& .ss__result, & .ss__result-layout': {
+                width: 'initial',
+                flex: undefined,
+                margin: 0,
+            },
+        },
+    });
+};
+var TrackedResultComponent = (0, providers_1.withTracking)(Result_1.Result);
+exports.Results = (0, mobx_react_lite_1.observer)(function (properties) {
+    var _a, _b, _c, _d, _e, _f;
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultBreakpointsProps = {
+        0: {
+            columns: properties.columns || 1,
+        },
+        540: {
+            columns: properties.columns || 2,
+        },
+        768: {
+            columns: properties.columns || 3,
+        },
+        991: {
+            columns: properties.columns || 4,
+        },
+    };
+    var defaultProps = {
+        results: (_b = (_a = properties.controller) === null || _a === void 0 ? void 0 : _a.store) === null || _b === void 0 ? void 0 : _b.results,
+        columns: 4,
+        gapSize: '20px',
+        layout: types_1.ResultsLayout.grid,
+        breakpoints: defaultBreakpointsProps,
+        treePath: globalTreePath,
+    };
+    var props = (0, utilities_1.mergeProps)('results', globalTheme, defaultProps, properties);
+    if (!((_c = properties.theme) === null || _c === void 0 ? void 0 : _c.name)) {
+        // breakpoint settings are calculated in ThemeStore for snap templates
+        var displaySettings = (0, useDisplaySettings_1.useDisplaySettings)((props === null || props === void 0 ? void 0 : props.breakpoints) || {});
+        var theme_1 = (0, deepmerge_1.default)((props === null || props === void 0 ? void 0 : props.theme) || {}, (displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.theme) || {}, { arrayMerge: function (destinationArray, sourceArray) { return sourceArray; } });
+        props = __assign(__assign(__assign({}, props), displaySettings), { theme: theme_1 });
+    }
+    var disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, layout = props.layout, theme = props.theme, controller = props.controller, treePath = props.treePath;
+    var resultComponent = props.resultComponent;
+    var subProps = {
+        result: __assign(__assign({ 
+            // default props
+            internalClassName: 'ss__results__result' }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+        inlineBanner: __assign(__assign({ controller: controller, 
+            // default props
+            internalClassName: 'ss__results__inline-banner' }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+    };
+    var results = props.results;
+    if ((props === null || props === void 0 ? void 0 : props.columns) && (props === null || props === void 0 ? void 0 : props.rows) && props.columns > 0 && props.rows > 0) {
+        results = (_d = props.results) === null || _d === void 0 ? void 0 : _d.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);
+    if (typeof resultComponent === 'string') {
+        var snap = (0, providers_1.useSnap)();
+        if ((_e = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _e === void 0 ? void 0 : _e.library.import.component.result) {
+            resultComponent = (0, hooks_1.useComponent)((_f = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _f === void 0 ? void 0 : _f.library.import.component.result, resultComponent);
+            if (!resultComponent) {
+                return null;
+            }
+        }
+    }
+    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) {
+                        case snap_store_mobx_1.ContentType.BANNER:
+                            return (0, react_1.createElement)(InlineBanner_1.InlineBanner, __assign({}, subProps.inlineBanner, { key: result.id, banner: result, layout: props.layout }));
+                        default:
+                            if (resultComponent && controller) {
+                                var ResultComponent = resultComponent;
+                                return ((0, jsx_runtime_1.jsx)(ResultTracker_1.ResultTracker, { result: result, controller: controller, children: (0, jsx_runtime_1.jsx)(ResultComponent, { controller: controller, result: result, theme: theme, treePath: treePath }, result.id) }));
+                            }
+                            else {
+                                return ((0, jsx_runtime_1.jsx)(TrackedResultComponent, __assign({}, subProps.result, { result: result, layout: props.layout, controller: controller }), result.id));
+                            }
+                    }
+                })();
+            }) })) })) : null;
+});

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

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

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

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

package/dist/cjs/components/src/components/Organisms/Results/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("./Results"), exports);

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

@@ -0,0 +1,24 @@
+import { ComponentProps } from '../../../types';
+import { SearchController } from '@athoscommerce/snap-controller';
+import { Lang } from '../../../hooks/useLang';
+export declare const Sidebar: ((properties: SidebarProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+    displayName: string;
+};
+export type SideBarModuleNames = 'filterSummary' | 'sortBy' | 'perPage' | 'facets' | 'banner.left' | 'paginationInfo' | 'layoutSelector' | '_';
+export type SidebarProps = {
+    controller: SearchController;
+    lang?: Partial<SidebarLang>;
+} & SidebarTemplatesLegalProps & ComponentProps<SidebarProps>;
+export type SidebarTemplatesLegalProps = {
+    layout?: SideBarModuleNames[] | SideBarModuleNames[][];
+    titleText?: string;
+    hideTitleText?: boolean;
+    sticky?: boolean;
+    stickyOffset?: number;
+};
+export interface SidebarLang {
+    titleText: Lang<{
+        controller: SearchController;
+    }>;
+}
+//# sourceMappingURL=Sidebar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Sidebar/Sidebar.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGlE,OAAO,EAAE,IAAI,EAAW,MAAM,wBAAwB,CAAC;AAgBvD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CA4DvD,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG,eAAe,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,aAAa,GAAG,gBAAgB,GAAG,gBAAgB,GAAG,GAAG,CAAC;AAE/I,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,kBAAkB,EAAE,GAAG,kBAAkB,EAAE,EAAE,CAAC;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,WAAW;IAC3B,SAAS,EAAE,IAAI,CAAC;QACf,UAAU,EAAE,gBAAgB,CAAC;KAC7B,CAAC,CAAC;CACH"}

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

@@ -0,0 +1,72 @@
+"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.Sidebar = 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 utilities_1 = require("../../../utilities");
+var Layout_1 = require("../Layout");
+var deepmerge_1 = __importDefault(require("deepmerge"));
+var useLang_1 = require("../../../hooks/useLang");
+var defaultStyles = function (_a) {
+    var stickyOffset = _a.stickyOffset;
+    return (0, react_1.css)({
+        // need sticky styles using new sticky prop
+        '&.ss__sidebar--sticky': {
+            position: 'sticky',
+            top: stickyOffset || 0,
+        },
+        '& .ss__facets': {
+            width: '100%',
+        },
+    });
+};
+exports.Sidebar = (0, mobx_react_lite_1.observer)(function (properties) {
+    var _a, _b, _c;
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultProps = {
+        titleText: 'Filters',
+        treePath: globalTreePath,
+        layout: [['filterSummary'], ['sortBy', 'perPage'], ['facets'], ['banner.left']],
+    };
+    var props = (0, utilities_1.mergeProps)('sidebar', globalTheme, defaultProps, properties);
+    var controller = props.controller, layout = props.layout, hideTitleText = props.hideTitleText, titleText = props.titleText, sticky = props.sticky, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, treePath = props.treePath;
+    var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
+    //initialize lang
+    var defaultLang = {
+        titleText: {
+            value: titleText,
+        },
+    };
+    //deep merge with props.lang
+    var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
+    var mergedLang = (0, useLang_1.useLang)(lang, {
+        controller: controller,
+    });
+    var subProps = {
+        Layout: __assign(__assign({}, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props.theme, treePath: treePath }),
+    };
+    var hasChildrenToRender = layout === null || layout === void 0 ? void 0 : layout.length;
+    return ((_a = controller === null || controller === void 0 ? void 0 : controller.store) === null || _a === void 0 ? void 0 : _a.loaded) && ((_c = (_b = controller === null || controller === void 0 ? void 0 : controller.store) === null || _b === void 0 ? void 0 : _b.pagination) === null || _c === void 0 ? void 0 : _c.totalResults) > 0 && hasChildrenToRender ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsxs)("div", __assign({}, styling, { className: (0, classnames_1.default)('ss__sidebar', className, internalClassName, { 'ss__sidebar--sticky': sticky }), children: [!hideTitleText ? ((0, jsx_runtime_1.jsx)("h4", __assign({ className: (0, classnames_1.default)('ss__sidebar__title'), "aria-atomic": "true", "aria-live": "polite" }, mergedLang.titleText.all, { children: titleText }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__sidebar__inner'), children: (0, jsx_runtime_1.jsx)(Layout_1.Layout, __assign({ controller: controller, layout: layout }, subProps.Layout)) })] })) })) : null;
+});

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

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

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

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

package/dist/cjs/components/src/components/Organisms/Sidebar/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("./Sidebar"), exports);

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

@@ -0,0 +1,19 @@
+import type { AutocompleteController } from '@athoscommerce/snap-controller';
+import { ComponentProps } from '../../../types';
+export declare const TermsList: ((properties: TermsListProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+    displayName: string;
+};
+export type TermsListModuleNames = 'Trending' | 'Suggestions' | 'History' | '_';
+export type TermsListProps = {
+    controller: AutocompleteController;
+} & TermsListTemplatesLegalProps & ComponentProps<TermsListProps>;
+export type TermsListTemplatesLegalProps = {
+    layout?: TermsListModuleNames[] | TermsListModuleNames[][];
+    historyTitle?: string;
+    suggestionTitle?: string;
+    trendingTitle?: string;
+    retainHistory?: boolean;
+    retainTrending?: boolean;
+    verticalOptions?: boolean;
+};
+//# sourceMappingURL=TermsList.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TermsList.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/TermsList/TermsList.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AA8B7D,eAAO,MAAM,SAAS,gBAAyB,cAAc;;CAmI3D,CAAC;AAMH,MAAM,MAAM,oBAAoB,GAAG,UAAU,GAAG,aAAa,GAAG,SAAS,GAAG,GAAG,CAAC;AAEhF,MAAM,MAAM,cAAc,GAAG;IAC5B,UAAU,EAAE,sBAAsB,CAAC;CACnC,GAAG,4BAA4B,GAC/B,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,MAAM,4BAA4B,GAAG;IAC1C,MAAM,CAAC,EAAE,oBAAoB,EAAE,GAAG,oBAAoB,EAAE,EAAE,CAAC;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC"}

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

@@ -0,0 +1,110 @@
+"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.TermsList = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var mobx_react_lite_1 = require("mobx-react-lite");
+var react_1 = require("@emotion/react");
+var classnames_1 = __importDefault(require("classnames"));
+var providers_1 = require("../../../providers");
+var utilities_1 = require("../../../utilities");
+var Terms_1 = require("../../Molecules/Terms/Terms");
+var defaultStyles = function (_a) {
+    return (0, react_1.css)({
+        display: 'flex',
+        flexDirection: 'row',
+        background: '#f8f8f8',
+        width: 'auto',
+        flexWrap: 'wrap',
+        '.ss__terms-list__row': {
+            display: 'flex',
+            flexDirection: 'row',
+            flexBasis: '100%',
+        },
+        '.ss__terms-list__row:empty': {
+            display: 'none',
+        },
+        '.ss__terms-list__separator': {
+            flexGrow: 1,
+            flexShrink: 1,
+        },
+    });
+};
+exports.TermsList = (0, mobx_react_lite_1.observer)(function (properties) {
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultProps = {
+        layout: [['Suggestions'], ['Trending'], ['History']],
+        historyTitle: 'Recent Searches',
+        trendingTitle: 'Popular Searches',
+        suggestionTitle: 'Search Suggestions',
+        treePath: globalTreePath,
+    };
+    var props = (0, utilities_1.mergeProps)('termsList', globalTheme, defaultProps, properties);
+    var layout = props.layout, historyTitle = props.historyTitle, verticalOptions = props.verticalOptions, trendingTitle = props.trendingTitle, suggestionTitle = props.suggestionTitle, retainHistory = props.retainHistory, retainTrending = props.retainTrending, treePath = props.treePath, disableStyles = props.disableStyles, className = props.className, internalClassName = props.internalClassName, controller = props.controller;
+    var subProps = {
+        terms: __assign(__assign({ vertical: verticalOptions ? true : false }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { theme: props.theme, treePath: treePath }),
+    };
+    var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
+    var history = (controller === null || controller === void 0 ? void 0 : controller.store.history) || [];
+    var suggestions = (controller === null || controller === void 0 ? void 0 : controller.store.terms) || [];
+    var trending = (controller === null || controller === void 0 ? void 0 : controller.store.trending) || [];
+    var trendingActive = trending === null || trending === void 0 ? void 0 : trending.filter(function (term) { return term.active; }).pop();
+    var historyActive = history === null || history === void 0 ? void 0 : history.filter(function (term) { return term.active; }).pop();
+    var _a = controller === null || controller === void 0 ? void 0 : controller.store, loaded = _a.loaded, results = _a.results, state = _a.state;
+    var showTrending = false;
+    if ((trending === null || trending === void 0 ? void 0 : trending.length) && ((retainTrending && loaded) || (!results.length && !state.input))) {
+        showTrending = true;
+    }
+    var showHistory = false;
+    if ((history === null || history === void 0 ? void 0 : history.length) && ((retainHistory && loaded) || (!results.length && !state.input))) {
+        showHistory = true;
+    }
+    if (!controller.store.state.input && (historyActive || trendingActive)) {
+        if (history === null || history === void 0 ? void 0 : history.length)
+            showHistory = true;
+        if (trending === null || trending === void 0 ? void 0 : trending.length)
+            showTrending = true;
+    }
+    var findModule = function (module) {
+        var _a, _b, _c, _d;
+        if (typeof module !== 'string') {
+            var children_1 = module === null || module === void 0 ? void 0 : module.map(function (subModule) { return findModule(subModule); });
+            var hasContent = module === null || module === void 0 ? void 0 : module.some(function (subModule, i) { return subModule !== '_' && children_1[i]; });
+            if (!hasContent)
+                return null;
+            return (0, jsx_runtime_1.jsx)("div", { className: "ss__terms-list__row", children: children_1 });
+        }
+        if (module == '_') {
+            return (0, jsx_runtime_1.jsx)("div", { className: "ss__terms-list__separator" });
+        }
+        if (module == 'History' && showHistory) {
+            return ((0, jsx_runtime_1.jsx)(Terms_1.Terms, __assign({ internalClassName: 'ss__terms-list__terms--history', title: historyTitle, terms: history, controller: controller, name: 'history', limit: (_b = (_a = controller.config.settings) === null || _a === void 0 ? void 0 : _a.history) === null || _b === void 0 ? void 0 : _b.limit }, subProps.terms)));
+        }
+        if (module == 'Trending' && showTrending) {
+            return ((0, jsx_runtime_1.jsx)(Terms_1.Terms, __assign({ internalClassName: 'ss__terms-list__terms--trending', title: trendingTitle, terms: trending, controller: controller, name: 'trending', limit: (_d = (_c = controller.config.settings) === null || _c === void 0 ? void 0 : _c.trending) === null || _d === void 0 ? void 0 : _d.limit }, subProps.terms)));
+        }
+        if (module == 'Suggestions') {
+            if (!suggestions.length)
+                return null;
+            return ((0, jsx_runtime_1.jsx)(Terms_1.Terms, __assign({ internalClassName: 'ss__terms-list__terms--suggestions', title: suggestionTitle, terms: suggestions, controller: controller, name: 'suggestions' }, subProps.terms)));
+        }
+    };
+    var modules = layout === null || layout === void 0 ? void 0 : layout.map(function (module) { return findModule(module); });
+    return (modules === null || modules === void 0 ? void 0 : modules.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__terms-list', className, internalClassName), children: modules })) })) : null;
+});

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

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

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

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

package/dist/cjs/components/src/components/Organisms/TermsList/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("./TermsList"), exports);