@athoscommerce/snap-preact 1.9.0 → 1.10.0

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useEffect, useState } from 'preact/hooks';
 import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';
@@ -139,6 +139,12 @@ const defaultStyles = ({ controller, input, viewportMaxHeight, width, theme, col
                 minHeight: '0%',
             },
         },
+        '.ss__banner': {
+            'iframe, img': {
+                maxWidth: '100%',
+                height: 'auto',
+            },
+        },
         '.ss__banner.ss__banner--header, .ss__banner.ss__banner--banner': {
             marginBottom: '10px',
         },
@@ -428,7 +434,7 @@ export const AutocompleteLayout = observer((properties) => {
     const lang = deepmerge(defaultLang, props.lang || {});
     const mergedLang = useLang(lang, {
         controller,
-    });
+    }, { activeBreakpoint: globalTheme?.activeBreakpoint });
     let recsController;
     let RecommendationTemplateComponent;
     let RecommendationTemplateResultComponent;

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { useState } from 'preact/hooks';

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

@@ -1,6 +1,6 @@
 import { h } from 'preact';
 import { IconProps, IconType } from '../../Atoms/Icon';
-import { ComponentProps } from '../../../types';
+import { ComponentProps, FacetDisplay } from '../../../types';
 import type { ValueFacet, RangeFacet } from '@athoscommerce/snap-store-mobx';
 import { Lang } from '../../../hooks';
 export declare const Facet: ((properties: FacetProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
@@ -35,15 +35,20 @@ export type FacetTemplatesLegalProps = {
     iconOverflowLess?: IconType | Partial<IconProps>;
     fields?: FieldProps;
     display?: FieldProps;
+    displayType?: InterchangeableFacetDisplay;
     searchable?: boolean;
     rangeInputs?: boolean;
     rangeInputsSubmitButtonText?: string;
     rangeInputsPrefix?: string;
     rangeInputsInheritDefaultValues?: boolean;
     rangeInputsSeparatorText?: string;
+    rangeInputsSubmitOnBlur?: boolean;
+    hideRangeInputsSubmitButton?: boolean;
     justContent?: boolean;
     horizontal?: boolean;
 };
+export type InterchangeableFacetDisplay = `${FacetDisplay.GRID}` | `${FacetDisplay.PALETTE}` | `${FacetDisplay.LIST}`;
+export type ResolvedFacetDisplay = `${FacetDisplay}`;
 export interface FacetLang {
     showMoreText: Lang<{
         facet: ValueFacet | RangeFacet;

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

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

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

@@ -1,5 +1,5 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { useRef, useState, useEffect } from 'preact/hooks';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { useState, useEffect } from 'preact/hooks';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
@@ -130,11 +130,25 @@ export const Facet = observer((properties) => {
         name: fieldNameToComponentName(properties.facet.field),
     };
     let props = mergeProps('facet', globalTheme, defaultProps, properties);
+    // resolves the rendered display type - the displayType prop overrides the API display, but only
+    // list, grid and palette are interchangeable; other displays (slider, hierarchy, toggle) have data
+    // requirements that must match the API display, so misaligned overrides fall back to the API display
+    const interchangeableDisplays = [FacetDisplay.LIST, FacetDisplay.GRID, FacetDisplay.PALETTE];
+    const resolveDisplayType = () => {
+        // the store types display as a plain string, so it is narrowed here - the options switch renders
+        // its default case for any value outside of FacetDisplay
+        const apiDisplay = props.facet?.display;
+        if (props.displayType && interchangeableDisplays.includes(apiDisplay) && interchangeableDisplays.includes(props.displayType)) {
+            return props.displayType;
+        }
+        return apiDisplay;
+    };
+    let displayType = resolveDisplayType();
     //manual props override on a per facet display type level using the display prop
-    if (props.display && props.display[props.facet?.display]) {
+    if (props.display && props.display[displayType]) {
         props = {
             ...props,
-            ...props.display[props.facet?.display],
+            ...props.display[displayType],
         };
     }
     //manual props override on a per facet field type level using the fields prop
@@ -144,6 +158,8 @@ export const Facet = observer((properties) => {
             ...props.fields[props.facet?.field],
         };
     }
+    // re-resolve in case the display or fields overrides set a displayType
+    displayType = resolveDisplayType();
     const { disableCollapse, facet, iconCollapse, iconExpand, limit, statefulOverflow, disableOverflow, iconColor, color, previewOnFocus, valueProps, showSelectedCount, hideSelectedCountParenthesis, clearAllIcon, showClearAllText, justContent, horizontal, disableStyles, className, internalClassName, treePath, } = props;
     const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('facet', props);
     if (!shouldRenderDefault) {
@@ -397,6 +413,7 @@ export const Facet = observer((properties) => {
         className,
         internalClassName,
         ...props,
+        displayType,
     };
     //initialize lang
     const defaultLang = {
@@ -422,11 +439,11 @@ export const Facet = observer((properties) => {
     const lang = deepmerge(defaultLang, props.lang || {});
     const mergedLang = useLang(lang, {
         facet,
-    });
+    }, { activeBreakpoint: globalTheme?.activeBreakpoint });
     const selectedCount = facet?.values?.filter((value) => value?.filtered).length ||
         facet?.active?.high !== facet?.range?.high ||
         facet?.active?.low !== facet?.range?.low;
-    return facet && renderFacet ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__facet', `ss__facet--${facet.field}`, `${facet.collapsed ? 'ss__facet--collapsed' : ''}`, className, internalClassName, `${facet.display ? `ss__facet--${facet.display}` : ''}`, (statefulOverflow ? overflowState?.remaining || 0 > 0 : (facet?.overflow?.remaining || 0) > 0) || facet?.display == 'slider'
+    return facet && renderFacet ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__facet', `ss__facet--${facet.field}`, `${facet.collapsed ? 'ss__facet--collapsed' : ''}`, className, internalClassName, `${displayType ? `ss__facet--${displayType}` : ''}`, (statefulOverflow ? overflowState?.remaining || 0 > 0 : (facet?.overflow?.remaining || 0) > 0) || facet?.display == 'slider'
                 ? ''
                 : 'ss__facet--showing-all'), children: justContent ? (_jsx(FacetContent, { ...facetContentProps, mergedLang: mergedLang })) : (_jsx(Dropdown, { ...subProps.dropdown, open: disableCollapse || !facet?.collapsed, onClick: () => !disableCollapse && facet.toggleCollapse && facet?.toggleCollapse(), disableA11y: true, button: _jsxs("div", { className: "ss__facet__header", ref: (e) => useA11y(e, disableCollapse ? -1 : 0), role: "heading", "aria-level": 3, ...mergedLang.dropdownButton.attributes, children: [_jsxs("span", { className: "ss__facet__header__inner", children: [_jsx("span", { ...mergedLang.dropdownButton.value, children: facet?.label }), showSelectedCount && selectedCount && facet.type !== 'range' ? (_jsx("span", { className: "ss__facet__header__selected-count", children: hideSelectedCountParenthesis ? selectedCount : `(${selectedCount})` })) : null, (mergedLang.clearAllText.value || clearAllIcon) && selectedCount ? (_jsx(Button, { ...subProps.button, internalClassName: "ss__facet__header__clear-all", name: 'reset-facet', onClick: (e) => {
                                         e.stopPropagation();
@@ -436,7 +453,7 @@ export const Facet = observer((properties) => {
                                 : { ...(typeof iconCollapse == 'string' ? { icon: iconCollapse } : iconCollapse) }), name: facet?.collapsed ? 'expand' : 'collapse' }))] }), children: _jsx(FacetContent, { ...facetContentProps, mergedLang: mergedLang }) })) }) })) : null;
 });
 const FacetContent = (props) => {
-    const { searchableFacet, subProps, className, internalClassName, limitedValues, facet, statefulOverflow, limit, overflowSlot, optionsSlot, searchable, iconOverflowMore, iconOverflowLess, disableOverflow, previewOnFocus, rangeInputs, rangeInputsPrefix, rangeInputsInheritDefaultValues, rangeInputsSeparatorText, justContent, valueProps, hideShowMoreLessText, treePath, mergedLang, } = props;
+    const { searchableFacet, subProps, className, internalClassName, limitedValues, facet, statefulOverflow, limit, overflowSlot, optionsSlot, searchable, iconOverflowMore, iconOverflowLess, disableOverflow, previewOnFocus, rangeInputs, rangeInputsPrefix, rangeInputsInheritDefaultValues, rangeInputsSeparatorText, rangeInputsSubmitOnBlur, hideRangeInputsSubmitButton, justContent, valueProps, hideShowMoreLessText, treePath, mergedLang, displayType, } = props;
     const [low, setLow] = useState(rangeInputsInheritDefaultValues && facet.type === 'range' ? facet?.range?.low : undefined);
     const [high, setHigh] = useState(rangeInputsInheritDefaultValues && facet.type === 'range' ? facet?.range?.high : undefined);
     useEffect(() => {
@@ -451,14 +468,54 @@ const FacetContent = (props) => {
         setLow(vals[0]);
         setHigh(vals[1]);
     };
+    // submits the current low/high range input values to the url manager, clamping/swapping as needed.
+    // used by the submit button, the Enter key, and (optionally) blur, so it works even when the
+    // submit button isn't rendered (e.g. when rangeInputsSubmitButtonText is an empty string).
+    const submitRange = () => {
+        if (facet?.services?.urlManager &&
+            typeof low === 'number' &&
+            Number.isFinite(low) &&
+            typeof high === 'number' &&
+            Number.isFinite(high)) {
+            let currentLow = low;
+            let currentHigh = high;
+            //adjust ranges if high and low have swapped.
+            if (currentHigh < currentLow) {
+                currentLow = high;
+                currentHigh = low;
+                setLow(currentLow);
+                setHigh(currentHigh);
+            }
+            //adjust limits if state is too high or too low
+            if (facet?.range?.low !== undefined && currentLow < facet?.range?.low) {
+                currentLow = facet?.range?.low;
+                setLow(currentLow);
+            }
+            if (facet?.range?.high !== undefined && currentLow > facet?.range?.high) {
+                currentLow = facet?.range?.high;
+                setLow(currentLow);
+            }
+            if (facet?.range?.low !== undefined && currentHigh < facet?.range?.low) {
+                currentHigh = facet?.range?.low;
+                setHigh(currentHigh);
+            }
+            if (facet?.range?.high !== undefined && currentHigh > facet?.range?.high) {
+                currentHigh = facet?.range?.high;
+                setHigh(currentHigh);
+            }
+            facet.services.urlManager.remove('page').set(`filter.${facet.field}`, { low: currentLow, high: currentHigh }).go();
+        }
+    };
     const onKeyUp = (e) => {
         if (e.key === 'Enter') {
-            if (typeof low == 'number' && typeof high == 'number') {
-                submitButtonRef.current?.base?.click();
-            }
+            submitRange();
+        }
+    };
+    const onBlur = () => {
+        if (rangeInputsSubmitOnBlur) {
+            submitRange();
         }
     };
-    const submitButtonRef = useRef();
     let overflowState;
     if (!statefulOverflow) {
         overflowState = facet.overflow;
@@ -466,13 +523,13 @@ const FacetContent = (props) => {
     else {
         overflowState = props.overflowState;
     }
-    return (_jsxs(_Fragment, { children: [searchable && searchableFacet.allowableTypes.includes(facet.display) && (_jsx(SearchInput, { ...subProps.searchInput, onChange: searchableFacet.searchFilter, placeholderText: `Search ${facet.label}`, treePath: treePath })), _jsx("div", { className: classnames('ss__facet__options', justContent ? className : '', justContent ? internalClassName : ''), children: (() => {
+    return (_jsxs(_Fragment, { children: [searchable && searchableFacet.allowableTypes.includes(displayType) && (_jsx(SearchInput, { ...subProps.searchInput, onChange: searchableFacet.searchFilter, placeholderText: `Search ${facet.label}`, treePath: treePath })), _jsx("div", { className: classnames('ss__facet__options', justContent ? className : '', justContent ? internalClassName : ''), children: (() => {
                     //manual options component
                     if (optionsSlot) {
                         return cloneWithProps(optionsSlot, { facet, valueProps, limit, previewOnFocus, treePath });
                     }
                     else {
-                        switch (facet?.display) {
+                        switch (displayType) {
                             // case FacetDisplay.TOGGLE:
                             // 	return <FacetToggle {...subProps.facetToggle} facet={facet as ValueFacet} />;
                             case FacetDisplay.SLIDER:
@@ -487,37 +544,7 @@ const FacetContent = (props) => {
                                 return (_jsx(FacetListOptions, { ...subProps.facetListOptions, values: limitedValues, facet: facet, treePath: treePath }));
                         }
                     }
-                })() }), rangeInputs && (facet.type === 'range' || facet.type === 'range-buckets') && (_jsxs("div", { className: "ss__facet__range-inputs", children: [_jsxs("div", { className: "ss__facet__range-inputs__row", children: [_jsxs("div", { className: "ss__facet__range-input ss__facet__range-input--low", children: [rangeInputsPrefix && _jsx("span", { className: "ss__facet__range-input__prefix", children: rangeInputsPrefix }), _jsx("input", { type: "number", className: "ss__facet__range-input__input", value: low, onInput: (e) => (e.currentTarget.value ? setLow(Number(e.currentTarget.value)) : setLow(undefined)), onKeyUp: onKeyUp })] }), _jsx("span", { className: "ss__facet__range-inputs__separator", children: rangeInputsSeparatorText }), _jsxs("div", { className: "ss__facet__range-input ss__facet__range-input--high", children: [rangeInputsPrefix && _jsx("span", { className: "ss__facet__range-input__prefix", children: rangeInputsPrefix }), _jsx("input", { type: "number", className: "ss__facet__range-input__input", value: high, onInput: (e) => (e.currentTarget.value ? setHigh(Number(e.currentTarget.value)) : setHigh(undefined)), onKeyUp: onKeyUp })] })] }), _jsx("div", { className: "ss__facet__range-inputs__row ss__facet__range-inputs__row--button-wrapper", children: _jsx(Button, { internalClassName: "ss__facet__range-input__button--submit", ref: submitButtonRef, onClick: () => {
-                                if (facet?.services?.urlManager && typeof low === 'number' && typeof high === 'number') {
-                                    let currentLow = low;
-                                    let currentHigh = high;
-                                    //adjust ranges if high and low have swapped.
-                                    if (currentHigh < currentLow) {
-                                        currentLow = high;
-                                        currentHigh = low;
-                                        setLow(currentLow);
-                                        setHigh(currentHigh);
-                                    }
-                                    //adjust limits if state is too high or too low
-                                    if (facet?.range?.low !== undefined && currentLow < facet?.range?.low) {
-                                        currentLow = facet?.range?.low;
-                                        setLow(currentLow);
-                                    }
-                                    if (facet?.range?.high !== undefined && currentLow > facet?.range?.high) {
-                                        currentLow = facet?.range?.high;
-                                        setLow(currentLow);
-                                    }
-                                    if (facet?.range?.low !== undefined && currentHigh < facet?.range?.low) {
-                                        currentHigh = facet?.range?.low;
-                                        setHigh(currentHigh);
-                                    }
-                                    if (facet?.range?.high !== undefined && currentHigh > facet?.range?.high) {
-                                        currentHigh = facet?.range?.high;
-                                        setHigh(currentHigh);
-                                    }
-                                    facet.services.urlManager.remove('page').set(`filter.${facet.field}`, { low: currentLow, high: currentHigh }).go();
-                                }
-                            }, children: mergedLang.submitRangeButton.value ? _jsx("label", { ...mergedLang.submitRangeButton.all }) : null }) })] })), !disableOverflow && overflowState?.enabled && (_jsx("div", { className: "ss__facet__show-more-less", "aria-live": "polite", onClick: () => overflowState?.toggle(), ref: (e) => useA11y(e), children: overflowSlot ? (cloneWithProps(overflowSlot, { facet, treePath })) : (_jsxs(_Fragment, { children: [_jsx(Icon, { ...subProps.showMoreLessIcon, treePath: treePath, name: (overflowState?.remaining || 0) > 0 ? 'overflow-more' : 'overflow-less', ...((overflowState?.remaining || 0) > 0
+                })() }), rangeInputs && (facet.type === 'range' || facet.type === 'range-buckets') && (_jsxs("div", { className: "ss__facet__range-inputs", children: [_jsxs("div", { className: "ss__facet__range-inputs__row", children: [_jsxs("div", { className: "ss__facet__range-input ss__facet__range-input--low", children: [rangeInputsPrefix && _jsx("span", { className: "ss__facet__range-input__prefix", children: rangeInputsPrefix }), _jsx("input", { type: "number", className: "ss__facet__range-input__input", value: low, onInput: (e) => (e.currentTarget.value ? setLow(Number(e.currentTarget.value)) : setLow(undefined)), onKeyUp: onKeyUp, onBlur: onBlur })] }), _jsx("span", { className: "ss__facet__range-inputs__separator", children: rangeInputsSeparatorText }), _jsxs("div", { className: "ss__facet__range-input ss__facet__range-input--high", children: [rangeInputsPrefix && _jsx("span", { className: "ss__facet__range-input__prefix", children: rangeInputsPrefix }), _jsx("input", { type: "number", className: "ss__facet__range-input__input", value: high, onInput: (e) => (e.currentTarget.value ? setHigh(Number(e.currentTarget.value)) : setHigh(undefined)), onKeyUp: onKeyUp, onBlur: onBlur })] })] }), !hideRangeInputsSubmitButton && (_jsx("div", { className: "ss__facet__range-inputs__row ss__facet__range-inputs__row--button-wrapper", children: _jsx(Button, { internalClassName: "ss__facet__range-input__button--submit", onClick: submitRange, children: mergedLang.submitRangeButton.value ? _jsx("label", { ...mergedLang.submitRangeButton.all }) : null }) }))] })), !disableOverflow && overflowState?.enabled && (_jsx("div", { className: "ss__facet__show-more-less", "aria-live": "polite", onClick: () => overflowState?.toggle(), ref: (e) => useA11y(e), children: overflowSlot ? (cloneWithProps(overflowSlot, { facet, treePath })) : (_jsxs(_Fragment, { children: [_jsx(Icon, { ...subProps.showMoreLessIcon, treePath: treePath, name: (overflowState?.remaining || 0) > 0 ? 'overflow-more' : 'overflow-less', ...((overflowState?.remaining || 0) > 0
                                 ? { ...(typeof iconOverflowMore == 'string' ? { icon: iconOverflowMore } : iconOverflowMore) }
                                 : { ...(typeof iconOverflowLess == 'string' ? { icon: iconOverflowLess } : iconOverflowLess) }) }), !hideShowMoreLessText && (_jsx("span", { ...((overflowState?.remaining || 0) > 0 ? mergedLang.showMoreText?.all : mergedLang.showLessText?.all) }))] })) }))] }));
 };

package/dist/esm/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;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"}
+{"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;;CA2TzE,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/esm/components/src/components/Organisms/FacetsHorizontal/FacetsHorizontal.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useState } from 'preact/hooks';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
@@ -231,7 +231,7 @@ export const FacetsHorizontal = observer((properties) => {
     };
     //deep merge with props.lang
     const lang = deepmerge(defaultLang, props.lang || {});
-    const mergedLang = useLang(lang, { facets: facets, sidebarOpenState: sidebarOpenState });
+    const mergedLang = useLang(lang, { facets: facets, sidebarOpenState: sidebarOpenState }, { activeBreakpoint: globalTheme?.activeBreakpoint });
     const ToggleSidebarButton = ({ sidebarOpenState, setSidebarOpenState, subProps }) => {
         return (_jsx(Button, { ...subProps.toggleSidebarButton, internalClassName: "ss__facets-horizontal__header__toggle-sidebar", onClick: () => setSidebarOpenState(!sidebarOpenState), children: _jsx("span", { ...mergedLang.toggleSidebarButtonText.all }) }));
     };
@@ -257,7 +257,7 @@ export const FacetsHorizontal = observer((properties) => {
                             const mergedLang = useLang(lang, {
                                 selectedFacet,
                                 facet,
-                            });
+                            }, { activeBreakpoint: globalTheme?.activeBreakpoint });
                             return (_jsx(Dropdown, { ...subProps.dropdown, internalClassName: classnames(subProps.dropdown.internalClassName, `ss__facets-horizontal__header__dropdown--${facet.display}`, `ss__facets-horizontal__header__dropdown--${facet.field}`), open: selectedFacet?.field === facet.field, onClick: (e) => {
                                     // @ts-ignore - this is a workaround for the fact that selectedFacet is not defined when the onclick is triggered by the escape key.
                                     if (selectedFacet !== facet && e.code !== 'Escape') {

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

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

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

@@ -107,7 +107,7 @@ export const FilterSummary = observer((properties) => {
     const lang = deepmerge(defaultLang, props.lang || {});
     const mergedLang = useLang(lang, {
         filters,
-    });
+    }, { activeBreakpoint: globalTheme?.activeBreakpoint });
     return filters?.length ? (_jsx(CacheProvider, { children: _jsxs("div", { ...styling, className: classnames('ss__filter-summary', { 'ss__filter-summary--list': type === 'list' }, { 'ss__filter-summary--inline': type === 'inline' }, className, internalClassName), children: [!hideTitle && _jsx("div", { className: "ss__filter-summary__title", ...mergedLang.title?.all }), _jsxs("div", { className: "ss__filter-summary__filters", children: [filters.map((filter) => (_jsx(Filter, { ...subProps.filter, filter: filter, onClick: (e) => onClick && onClick(e, filter) }))), !hideClearAll && (_jsx(Filter, { ...subProps.filter, name: 'clear-all', icon: clearAllIcon, internalClassName: `${subProps?.filter?.internalClassName} ss__filter-summary__clear-all`, hideFacetLabel: true, valueLabel: clearAllLabel, onClick: (e) => {
                                 onClearAllClick && onClearAllClick(e);
                                 properties.controller?.urlManager.remove('filter').remove('page').go();

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

@@ -1 +1 @@
-{"version":3,"file":"NoResults.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/NoResults/NoResults.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAQ3B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD,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;;CA+K3D,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"}
+{"version":3,"file":"NoResults.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/NoResults/NoResults.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAQ3B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD,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;;CAmL3D,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"}

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

@@ -91,7 +91,7 @@ export const NoResults = observer((properties) => {
     const lang = deepmerge(defaultLang, props.lang || {});
     const mergedLang = useLang(lang, {
         controller: controller,
-    });
+    }, { activeBreakpoint: globalTheme?.activeBreakpoint });
     return (_jsxs("div", { className: classnames('ss__no-results', className, internalClassName), ...styling, children: [contentSlot &&
                 (typeof contentSlot == 'string' ? (_jsx("div", { className: "ss__no-results__slot", dangerouslySetInnerHTML: { __html: contentSlot } })) : (_jsx("div", { className: "ss__no-results__slot", children: cloneWithProps(contentSlot, { controller, treePath }) }))), !hideSuggestions && (suggestionsTitleText || suggestionsExist) && (_jsxs("div", { className: "ss__no-results__suggestions", children: [suggestionsTitleText && !hideSuggestionsTitleText && (_jsx("h3", { className: "ss__no-results__suggestions__title", ...mergedLang.suggestionsTitleText?.all })), suggestionsExist && _jsx("ul", { className: "ss__no-results__suggestions__list", ...mergedLang.suggestionsList?.all })] })), !hideContact && (contactsTitleText || contactsExist) && (_jsxs("div", { className: "ss__no-results__contact", children: [contactsTitleText && !hideContactsTitleText && _jsx("h3", { className: "ss__no-results__contact__title", ...mergedLang.contactsTitleText?.all }), contactsExist && _jsx("div", { ...mergedLang.contactsList?.all })] })), RecommendationTemplateComponent &&
                 recsController?.store?.loaded &&

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

@@ -2,6 +2,7 @@ import { h } from 'preact';
 import { ComponentProps } from '../../../types';
 import { SearchController } from '@athoscommerce/snap-controller';
 import { Lang } from '../../../hooks';
+import { IconProps, IconType } from '../../Atoms/Icon';
 export declare const Sidebar: ((properties: SidebarProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
     displayName: string;
 };
@@ -9,6 +10,7 @@ export type SideBarModuleNames = 'filterSummary' | 'sortBy' | 'perPage' | 'facet
 export type SidebarProps = {
     controller: SearchController;
     lang?: Partial<SidebarLang>;
+    onToggleSidebar?: () => void;
 } & SidebarTemplatesLegalProps & ComponentProps<SidebarProps>;
 export type SidebarTemplatesLegalProps = {
     layout?: SideBarModuleNames[] | SideBarModuleNames[][];
@@ -16,10 +18,33 @@ export type SidebarTemplatesLegalProps = {
     hideTitleText?: boolean;
     sticky?: boolean;
     stickyOffset?: number;
+    hideHeader?: boolean;
+    hideFooter?: boolean;
+    hideApplyButton?: boolean;
+    hideClearButton?: boolean;
+    hideCloseButton?: boolean;
+    hideClearButtonText?: boolean;
+    hideApplyButtonText?: boolean;
+    hideCloseButtonText?: boolean;
+    clearButtonText?: string;
+    applyButtonText?: string;
+    closeButtonText?: string;
+    applyButtonIcon?: IconType | Partial<IconProps>;
+    clearButtonIcon?: IconType | Partial<IconProps>;
+    closeButtonIcon?: IconType | Partial<IconProps>;
 };
 export interface SidebarLang {
     titleText: Lang<{
         controller: SearchController;
     }>;
+    closeButtonText: Lang<{
+        controller: SearchController;
+    }>;
+    applyButtonText: Lang<{
+        controller: SearchController;
+    }>;
+    clearButtonText: Lang<{
+        controller: SearchController;
+    }>;
 }
 //# sourceMappingURL=Sidebar.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Sidebar/Sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAM3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGlE,OAAO,EAAE,IAAI,EAAuC,MAAM,gBAAgB,CAAC;AAgB3E,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAkEvD,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"}
+{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Sidebar/Sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAM3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGlE,OAAO,EAAE,IAAI,EAAuC,MAAM,gBAAgB,CAAC;AAE3E,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAoCvD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAuKvD,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;IAC5B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B,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;IACtB,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,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,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;CAChD,CAAC;AAEF,MAAM,WAAW,WAAW;IAC3B,SAAS,EAAE,IAAI,CAAC;QACf,UAAU,EAAE,gBAAgB,CAAC;KAC7B,CAAC,CAAC;IACH,eAAe,EAAE,IAAI,CAAC;QACrB,UAAU,EAAE,gBAAgB,CAAC;KAC7B,CAAC,CAAC;IACH,eAAe,EAAE,IAAI,CAAC;QACrB,UAAU,EAAE,gBAAgB,CAAC;KAC7B,CAAC,CAAC;IACH,eAAe,EAAE,IAAI,CAAC;QACrB,UAAU,EAAE,gBAAgB,CAAC;KAC7B,CAAC,CAAC;CACH"}

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
@@ -7,6 +7,7 @@ import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Layout } from '../Layout';
 import deepmerge from 'deepmerge';
 import { useLang, useCustomComponentOverride } from '../../../hooks';
+import { Button } from '../../Atoms/Button';
 const defaultStyles = ({ stickyOffset }) => {
     return css({
         // need sticky styles using new sticky prop
@@ -17,6 +18,23 @@ const defaultStyles = ({ stickyOffset }) => {
         '& .ss__facets': {
             width: '100%',
         },
+        '& .ss__sidebar__header': {
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'baseline',
+            '& .ss__sidebar__title, & .ss__sidebar__header__close-button': {
+                margin: '15px 0',
+            },
+            '& .ss__sidebar__header__close-button': {
+                cursor: 'pointer',
+            },
+        },
+        '& .ss__sidebar__footer': {
+            display: 'flex',
+            gap: '10px',
+            justifyContent: 'center',
+            flexDirection: 'row',
+        },
     });
 };
 export const Sidebar = observer((properties) => {
@@ -24,11 +42,17 @@ export const Sidebar = observer((properties) => {
     const globalTreePath = useTreePath();
     const defaultProps = {
         titleText: 'Filters',
+        clearButtonText: 'Clear All',
+        applyButtonText: 'Apply',
+        closeButtonIcon: 'close-thin',
+        hideApplyButton: true,
+        hideClearButton: true,
+        hideCloseButton: true,
         treePath: globalTreePath,
         layout: [['filterSummary'], ['sortBy', 'perPage'], ['facets'], ['banner.left']],
     };
     const props = mergeProps('sidebar', globalTheme, defaultProps, properties);
-    const { controller, layout, hideTitleText, titleText, sticky, disableStyles, className, internalClassName, treePath } = props;
+    const { controller, layout, hideTitleText, titleText, sticky, hideApplyButton, hideFooter, onToggleSidebar, hideHeader, hideClearButton, hideCloseButton, hideClearButtonText, hideApplyButtonText, hideCloseButtonText, clearButtonText, applyButtonText, closeButtonText, applyButtonIcon, clearButtonIcon, closeButtonIcon, disableStyles, className, internalClassName, treePath, } = props;
     const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('sidebar', props);
     if (!shouldRenderDefault) {
         return overrideElement;
@@ -39,12 +63,21 @@ export const Sidebar = observer((properties) => {
         titleText: {
             value: titleText,
         },
+        closeButtonText: {
+            value: closeButtonText,
+        },
+        applyButtonText: {
+            value: applyButtonText,
+        },
+        clearButtonText: {
+            value: clearButtonText,
+        },
     };
     //deep merge with props.lang
     const lang = deepmerge(defaultLang, props.lang || {});
     const mergedLang = useLang(lang, {
         controller: controller,
-    });
+    }, { activeBreakpoint: globalTheme?.activeBreakpoint });
     const subProps = {
         Layout: {
             // default props
@@ -56,7 +89,20 @@ export const Sidebar = observer((properties) => {
             theme: props.theme,
             treePath,
         },
+        button: {
+            // default props
+            // inherited props
+            ...defined({
+                disableStyles,
+            }),
+            // component theme overrides
+            theme: props?.theme,
+            treePath,
+        },
     };
     const hasChildrenToRender = layout?.length;
-    return controller?.store?.loaded && controller?.store?.pagination?.totalResults > 0 && hasChildrenToRender ? (_jsx(CacheProvider, { children: _jsxs("div", { ...styling, className: classnames('ss__sidebar', className, internalClassName, { 'ss__sidebar--sticky': sticky }), children: [!hideTitleText ? (_jsx("h4", { className: classnames('ss__sidebar__title'), "aria-atomic": "true", "aria-live": "polite", ...mergedLang.titleText.all, children: titleText })) : (_jsx(_Fragment, {})), _jsx("div", { className: classnames('ss__sidebar__inner'), children: _jsx(Layout, { controller: controller, layout: layout, ...subProps.Layout }) })] }) })) : null;
+    return controller?.store?.loaded && controller?.store?.pagination?.totalResults > 0 && hasChildrenToRender ? (_jsx(CacheProvider, { children: _jsxs("div", { ...styling, className: classnames('ss__sidebar', className, internalClassName, { 'ss__sidebar--sticky': sticky }), children: [!hideHeader && (_jsxs("div", { className: "ss__sidebar__header", children: [!hideTitleText ? (_jsx("h4", { className: classnames('ss__sidebar__title'), "aria-atomic": "true", "aria-live": "polite", ...mergedLang.titleText.all, children: titleText })) : (_jsx("div", {})), !hideCloseButton && (_jsx(Button, { internalClassName: "ss__sidebar__header__close-button", disableStyles: true, onClick: () => onToggleSidebar && onToggleSidebar(), icon: closeButtonIcon, ...subProps.button, name: 'close', children: !hideCloseButtonText && closeButtonText ? _jsx("span", { ...mergedLang.closeButtonText?.all }) : undefined }))] })), _jsx("div", { className: classnames('ss__sidebar__inner'), children: _jsx(Layout, { controller: controller, layout: layout, ...subProps.Layout }) }), !hideFooter && (_jsxs("div", { className: "ss__sidebar__footer", children: [!hideApplyButton && (_jsx(Button, { internalClassName: "ss__sidebar__footer__apply-button", icon: applyButtonIcon, onClick: onToggleSidebar ? () => onToggleSidebar() : undefined, ...subProps.button, name: 'apply', children: !hideApplyButtonText && applyButtonText ? _jsx("span", { ...mergedLang.applyButtonText?.all }) : undefined })), !hideClearButton && (_jsx(Button, { internalClassName: "ss__sidebar__footer__clear-button", icon: clearButtonIcon, onClick: () => {
+                                controller?.urlManager.remove('filter').remove('page').go();
+                                onToggleSidebar && (() => onToggleSidebar())();
+                            }, ...subProps.button, name: 'clear', children: !hideClearButtonText && clearButtonText ? _jsx("span", { ...mergedLang.clearButtonText?.all }) : undefined }))] }))] }) })) : null;
 });

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useEffect, useRef, useState } from 'preact/hooks';
 import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useEffect, useRef, useState } from 'preact/hooks';
 import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useEffect, useRef, useState } from 'preact/hooks';
 import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useState, useRef } from 'preact/hooks';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
@@ -114,7 +114,7 @@ export const Recommendation = observer((properties) => {
     };
     //deep merge with props.lang
     const lang = deepmerge(defaultLang, props.lang || {});
-    const mergedLang = useLang(lang, {});
+    const mergedLang = useLang(lang, {}, { activeBreakpoint: globalTheme?.activeBreakpoint });
     return (Array.isArray(children) && children.length) || resultsToRender?.length ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__recommendation', className, internalClassName), ref: recsRef, children: isVisible ? (_jsxs(RecommendationProfileTracker, { controller: controller, children: [title && !hideTitle && (_jsx("h3", { className: "ss__recommendation__title", ...mergedLang.titleText?.all, children: title })), description && _jsx("p", { className: "ss__recommendation__description", children: description }), _jsx(Carousel, { prevButton: prevButton, nextButton: nextButton, hideButtons: hideButtons, loop: loop, pagination: pagination, ...subProps.carousel, ...additionalProps, children: Array.isArray(children) && children.length
                             ? children.map((child, idx) => (_jsx(ResultTracker, { controller: controller, result: resultsToRender[idx], children: child })))
                             : resultsToRender.map((result) => (_jsx(ResultTracker, { controller: controller, result: result, children: (() => {

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

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

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

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useState } from 'preact/hooks';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
@@ -57,7 +57,7 @@ export const BundledCTA = observer((properties) => {
     const lang = deepmerge({}, props.lang || {});
     const mergedLang = useLang(lang, {
         cartStore,
-    });
+    }, { activeBreakpoint: props?.theme?.activeBreakpoint });
     return (_jsx("div", { className: `${classNamePrefix}__wrapper__cta`, children: ctaSlot ? (cloneWithProps(ctaSlot, props)) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${classNamePrefix}__wrapper__cta__subtotal`, "aria-atomic": "false", "aria-live": "polite", children: [ctaIcon ? (_jsx("div", { className: `${classNamePrefix}__wrapper__cta__subtotal__icon__wrapper`, children: _jsx(Icon, { ...subProps.icon, ...(typeof ctaIcon == 'string' ? { icon: ctaIcon } : ctaIcon) }) })) : null, _jsx("span", { className: `${classNamePrefix}__wrapper__cta__subtotal__title`, ...mergedLang.ctaSubtotalTitle?.all }), _jsxs("div", { className: `${classNamePrefix}__wrapper__cta__subtotal__prices`, children: [cartStore.msrp && cartStore.msrp !== cartStore.price ? (_jsxs("label", { className: `${classNamePrefix}__wrapper__cta__subtotal__strike`, children: ["Was ", _jsx(Price, { ...subProps.subtotalStrike, lineThrough: true, value: cartStore.msrp })] })) : null, _jsx("label", { className: `${classNamePrefix}__wrapper__cta__subtotal__price`, children: _jsx(Price, { ...subProps.subtotalPrice, value: cartStore.price }) })] })] }), _jsx(Button, { ...subProps.button, internalClassName: classnames(`${classNamePrefix}__wrapper__cta__button`, {
                         [`${classNamePrefix}__wrapper__cta__button--added`]: addedToCart,
                     }), "aria-live": addedToCart, onClick: (e) => onAddToCart(e), ...(addedToCart ? mergedLang.ctaButtonSuccessText?.all : mergedLang.ctaButtonText?.all), children: addedToCart ? ctaButtonSuccessText : ctaButtonText })] })) }));

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

@@ -46,6 +46,6 @@ export const BundleSelector = observer((properties) => {
     };
     //deep merge with props.lang
     const lang = deepmerge({}, props.lang || {});
-    const mergedLang = useLang(lang, {});
+    const mergedLang = useLang(lang, {}, { activeBreakpoint: globalTheme?.activeBreakpoint });
     return (_jsxs("div", { className: classnames(`${classNamePrefix}__wrapper__selector`, checked ? `${classNamePrefix}__wrapper__selector--selected` : '', seedText || seed ? `${classNamePrefix}__wrapper__selector--seed` : '', className, internalClassName), children: [_jsxs("div", { className: `${classNamePrefix}__wrapper__selector__result-wrapper`, children: [!hideCheckboxes && _jsx(Checkbox, { ...subProps.checkbox }), seedText && _jsx("div", { className: `${classNamePrefix}__wrapper__selector__result-wrapper__seed-badge`, ...mergedLang.seedText?.all }), children] }), icon ? _jsx(Icon, { ...subProps.icon, ...(typeof icon == 'string' ? { icon: icon } : icon) }) : undefined] }));
 });