@athoscommerce/snap-preact 1.1.5 → 1.2.0

package/dist/esm/components/src/components/Atoms/PaginationInfo/PaginationInfo.js

@@ -2,15 +2,16 @@ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { mergeProps, mergeStyles } from '../../../utilities';
 import deepmerge from 'deepmerge';
-import { useLang } from '../../../hooks';
+import { useLang, useComponent } from '../../../hooks';
 const defaultStyles = ({}) => {
     return css({});
 };
 export const PaginationInfo = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const pagination = properties.controller?.store.pagination || properties.pagination;
     const defaultProps = {
@@ -18,7 +19,13 @@ export const PaginationInfo = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('paginationInfo', globalTheme, defaultProps, properties);
-    const { controller, infoText, className, internalClassName } = props;
+    const { controller, infoText, className, internalClassName, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.paginationInfo || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const store = pagination || controller?.store?.pagination;
     const styling = mergeStyles(props, defaultStyles);
     //initialize lang

package/dist/esm/components/src/components/Atoms/Price/Price.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Price.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/Price/Price.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAa7D,wBAAgB,KAAK,CAAC,UAAU,EAAE,UAAU,2DA2D3C;AAED,MAAM,MAAM,UAAU,GAAG,wBAAwB,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC;AAC/E,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,OAAO,GAAG,kBAAkB,CAAC;IACzG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,cAAc,GAAG,aAAa,CAAC"}
+{"version":3,"file":"Price.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/Price/Price.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAe7D,wBAAgB,KAAK,CAAC,UAAU,EAAE,UAAU,2DAoE3C;AAED,MAAM,MAAM,UAAU,GAAG,wBAAwB,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC;AAC/E,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CAAC,oBAAoB,EAAE,OAAO,GAAG,kBAAkB,CAAC;IACzG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,cAAc,GAAG,aAAa,CAAC"}

package/dist/esm/components/src/components/Atoms/Price/Price.js

@@ -1,9 +1,10 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { filters } from '@athoscommerce/snap-toolbox';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { mergeProps, mergeStyles } from '../../../utilities';
+import { useComponent } from '../../../hooks';
 const defaultStyles = ({ theme }) => {
     return css({
         color: theme?.variables?.colors?.primary,
@@ -15,6 +16,7 @@ const defaultStyles = ({ theme }) => {
 };
 export function Price(properties) {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         symbol: '$',
@@ -27,7 +29,13 @@ export function Price(properties) {
         treePath: globalTreePath,
     };
     const props = mergeProps('price', globalTheme, defaultProps, properties);
-    const { lineThrough, value, symbol, decimalPlaces, padDecimalPlaces, thousandsSeparator, decimalSeparator, symbolAfter, raw, className, internalClassName, } = props;
+    const { lineThrough, value, symbol, decimalPlaces, padDecimalPlaces, thousandsSeparator, decimalSeparator, symbolAfter, raw, className, internalClassName, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.price || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     let formattedPrice;
     if (value) {
         formattedPrice = filters.currency(value, {

package/dist/esm/components/src/components/Atoms/SearchHeader/SearchHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchHeader.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/SearchHeader/SearchHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGnH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAO3C,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CAqJjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,aAAa,CAAC,EAAE,wBAAwB,CAAC;IACzC,IAAI,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;CACjC,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IAC9D,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACjE,kBAAkB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACvE,aAAa,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACnE,kBAAkB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACvE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAChC,SAAS,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IACtC,kBAAkB,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC/C,aAAa,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC1C,cAAc,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC3C,kBAAkB,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC/C,YAAY,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;CAC1C;AAED,UAAU,oBAAoB;IAC7B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC1B"}
+{"version":3,"file":"SearchHeader.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/SearchHeader/SearchHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGnH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAQ3C,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CA8JjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,aAAa,CAAC,EAAE,wBAAwB,CAAC;IACzC,IAAI,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;CACjC,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IAC9D,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACjE,kBAAkB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACvE,aAAa,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACnE,kBAAkB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,oBAAoB,KAAK,MAAM,CAAC,CAAC;IACvE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAChC,SAAS,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IACtC,kBAAkB,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC/C,aAAa,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC1C,cAAc,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC3C,kBAAkB,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;IAC/C,YAAY,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;CAC1C;AAED,UAAU,oBAAoB;IAC7B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,MAAM,CAAC,EAAE,gBAAgB,CAAC;CAC1B"}

package/dist/esm/components/src/components/Atoms/SearchHeader/SearchHeader.js

@@ -1,16 +1,17 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import { observer } from 'mobx-react-lite';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { mergeProps, mergeStyles } from '../../../utilities';
 import classnames from 'classnames';
-import { useLang } from '../../../hooks';
+import { useLang, useComponent } from '../../../hooks';
 import deepmerge from 'deepmerge';
 const defaultStyles = () => {
     return css({});
 };
 export const SearchHeader = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const landingPage = properties.controller?.store.merchandising.landingPage || properties.merchandising?.landingPage;
     const pagination = properties.controller?.store.pagination || properties.pagination;
@@ -28,7 +29,13 @@ export const SearchHeader = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('searchHeader', globalTheme, defaultProps, properties);
-    const { className, internalClassName, titleText, subtitleText, correctedQueryText, noResultsText, didYouMeanText, expandedSearchText, hideTitleText, hideSubtitleText, hideCorrectedQueryText, hideNoResultsText, hideExpandedSearchText, hideDidYouMeanText, } = props;
+    const { className, internalClassName, titleText, subtitleText, correctedQueryText, noResultsText, didYouMeanText, expandedSearchText, hideTitleText, hideSubtitleText, hideCorrectedQueryText, hideNoResultsText, hideExpandedSearchText, hideDidYouMeanText, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.searchHeader || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const styling = mergeStyles(props, defaultStyles);
     //initialize lang
     const defaultLang = {

package/dist/esm/components/src/components/Atoms/Skeleton/Skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AA0C7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAqBzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,2BAA2B,GAAG,cAAc,CAAC,aAAa,CAAC,CAAC;AACxF,MAAM,MAAM,2BAA2B,GAAG;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AA4C7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CA6BzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,2BAA2B,GAAG,cAAc,CAAC,aAAa,CAAC,CAAC;AACxF,MAAM,MAAM,2BAA2B,GAAG;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}

package/dist/esm/components/src/components/Atoms/Skeleton/Skeleton.js

@@ -2,8 +2,9 @@ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { css, keyframes } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { mergeProps, mergeStyles } from '../../../utilities';
+import { useComponent } from '../../../hooks';
 const defaultStyles = ({ width, height, round, backgroundColor, animatedColor }) => {
     const animation = keyframes({
         from: {
@@ -40,6 +41,7 @@ const defaultStyles = ({ width, height, round, backgroundColor, animatedColor })
 };
 export const Skeleton = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         backgroundColor: '#ebebeb',
@@ -47,7 +49,13 @@ export const Skeleton = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('skeleton', globalTheme, defaultProps, properties);
-    const { className, internalClassName } = props;
+    const { className, internalClassName, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.skeleton || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const styling = mergeStyles(props, defaultStyles);
     return (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__skeleton', className, internalClassName) }) }));
 });

package/dist/esm/components/src/components/Atoms/TemplateSelect/TemplateSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateSelect.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/TemplateSelect/TemplateSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAmD,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC5F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAsB,aAAa,EAAE,MAAM,mDAAmD,CAAC;AAG3H,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CA8CrE,CAAC;AACH,MAAM,WAAW,mBAAmB;IACnC,cAAc,EAAE,cAAc,CAAC;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,aAAa,CAAC;IACpB,UAAU,EAAE,WAAW,CAAC;IACxB,IAAI,EAAE,aAAa,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;CACd"}
+{"version":3,"file":"TemplateSelect.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Atoms/TemplateSelect/TemplateSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAmD,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC5F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAsB,aAAa,EAAE,MAAM,mDAAmD,CAAC;AAE3H,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CA8BrE,CAAC;AACH,MAAM,WAAW,mBAAmB;IACnC,cAAc,EAAE,cAAc,CAAC;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,aAAa,CAAC;IACpB,UAAU,EAAE,WAAW,CAAC;IACxB,IAAI,EAAE,aAAa,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;CACd"}

package/dist/esm/components/src/components/Atoms/TemplateSelect/TemplateSelect.js

@@ -10,14 +10,6 @@ export const TemplateSelect = observer((properties) => {
         return null;
     }
     const Component = templatesStore.library.getComponent(type, targeter.component);
-    let ResultComponent = undefined;
-    if (targeter.resultComponent) {
-        ResultComponent = templatesStore.library.components.result[targeter.resultComponent];
-        if (!loading && !ResultComponent && !templatesStore.settings?.editMode) {
-            const error = `Result component "${targeter.resultComponent}" not found in library for target "${targetId}"`;
-            controller.log.error(error);
-        }
-    }
     const themeLocation = templatesStore?.themes?.[targeter.theme.location];
     const themeStore = themeLocation && themeLocation[targeter.theme.name];
     const theme = themeStore?.theme;
@@ -25,12 +17,6 @@ export const TemplateSelect = observer((properties) => {
         const error = `Theme "${targeter.theme.name}" not found in library for target "${targetId}"`;
         controller.log.error(error);
     }
-    let componentProp = {};
-    if (targeter.resultComponent && ResultComponent) {
-        componentProp = {
-            resultComponent: ResultComponent,
-        };
-    }
     // ensuring that theme and component are ready to render
-    return !loading && theme && Component ? (_jsx(SnapProvider, { snap: snap, children: _jsx(ThemeProvider, { theme: theme, children: _jsx(ControllerProvider, { controller: controller, children: _jsx("div", { className: `ss__template-select ss__theme__${theme.name}`, children: _jsx(Component, { controller: controller, ...componentProp, ...otherProps }) }) }) }) })) : null;
+    return !loading && theme && Component ? (_jsx(SnapProvider, { snap: snap, children: _jsx(ThemeProvider, { theme: theme, children: _jsx(ControllerProvider, { controller: controller, children: _jsx("div", { className: `ss__template-select ss__theme__${theme.name}`, children: _jsx(Component, { controller: controller, ...otherProps }) }) }) }) })) : null;
 });

package/dist/esm/components/src/components/Molecules/CalloutBadge/CalloutBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CalloutBadge.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/CalloutBadge/CalloutBadge.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAe,MAAM,gBAAgB,CAAC;AAG3E,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAY9D,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CA0CjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,MAAM,EAAE,OAAO,CAAC;CAChB,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AACnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC"}
+{"version":3,"file":"CalloutBadge.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/CalloutBadge/CalloutBadge.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAE,YAAY,EAAe,MAAM,gBAAgB,CAAC;AAG3E,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAY9D,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CAiDjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,MAAM,EAAE,OAAO,CAAC;CAChB,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AACnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,CAAC"}

package/dist/esm/components/src/components/Molecules/CalloutBadge/CalloutBadge.js

@@ -24,7 +24,13 @@ export const CalloutBadge = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('calloutBadge', globalTheme, defaultProps, properties);
-    const { result, tag, renderEmpty, limit, className, internalClassName, treePath } = props;
+    const { result, tag, renderEmpty, limit, className, internalClassName, treePath, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.calloutBadge || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const badgeComponentMap = {
         ...defaultBadgeComponentMap,
         ...(snap?.templates?.library.import.component.badge || {}),

package/dist/esm/components/src/components/Molecules/Carousel/Carousel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Carousel/Carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,cAAc,EAAE,MAAM,QAAQ,CAAC;AAW3C,OAAO,KAAK,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,QAAQ,CAAC;AACpD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGvE,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,MAAM,gBAAgB,CAAC;AAiJ/E,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtC,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CA8QzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG;IAC3B,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IACzC,UAAU,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IACzC,SAAS,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,KAAK,IAAI,CAAC;IACnF,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC3E,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC3E,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC7C,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC5C,OAAO,CAAC,EAAE,GAAG,EAAE,CAAC;IAChB,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,GAAG,eAAe,CAAC,CAAC"}
+{"version":3,"file":"Carousel.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Carousel/Carousel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,cAAc,EAAE,MAAM,QAAQ,CAAC;AAW3C,OAAO,KAAK,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,QAAQ,CAAC;AACpD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAGvE,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,MAAM,gBAAgB,CAAC;AAmJ/E,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BtC,CAAC;AAEF,eAAO,MAAM,kCAAkC;;;;;;CAM9C,CAAC;AAEF,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAuRzD,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG;IAC3B,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IACzC,UAAU,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IACzC,SAAS,CAAC,EAAE,OAAO,GAAG,gBAAgB,CAAC;IACvC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,KAAK,IAAI,CAAC;IACnF,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC3E,iBAAiB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC3E,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC7C,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC5C,OAAO,CAAC,EAAE,GAAG,EAAE,CAAC;IAChB,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,GAAG,eAAe,CAAC,CAAC"}

package/dist/esm/components/src/components/Molecules/Carousel/Carousel.js

@@ -8,8 +8,9 @@ import { Swiper, SwiperSlide } from 'swiper/react';
 import { cloneWithProps, defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Navigation, Pagination, Scrollbar, A11y } from 'swiper/modules';
 import { Icon } from '../../Atoms/Icon/Icon';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { useDisplaySettings } from '../../../hooks/useDisplaySettings';
+import { useComponent } from '../../../hooks';
 const defaultStyles = ({ vertical, theme }) => {
     return css({
         display: 'flex',
@@ -181,6 +182,7 @@ export const defaultVerticalCarouselBreakpoints = {
 };
 export const Carousel = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         breakpoints: properties.vertical
@@ -220,7 +222,13 @@ export const Carousel = observer((properties) => {
             };
         }
     }
-    const { children, loop, nextButton, prevButton, hideButtons, vertical, onInit, onBeforeInit, onAfterInit, onNextButtonClick, onPrevButtonClick, onClick, disableStyles, style: _, styleScript: __, themeStyleScript: ___, modules, className, internalClassName, treePath, ...additionalProps } = props;
+    const { children, loop, nextButton, prevButton, hideButtons, vertical, onInit, onBeforeInit, onAfterInit, onNextButtonClick, onPrevButtonClick, onClick, disableStyles, customComponent, style: _, styleScript: __, themeStyleScript: ___, modules, className, internalClassName, treePath, ...additionalProps } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.carousel || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     let pagination = props.pagination;
     let navigation = props.navigation;
     let scrollbar = props.scrollbar;

package/dist/esm/components/src/components/Molecules/Checkbox/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAG7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AA4B/C,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAyIzD,CAAC;AAMH,MAAM,MAAM,aAAa,GAAG;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;CAC7B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,eAAe,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxF,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,YAAY;IAC5B,QAAQ,EAAE,IAAI,CAAC;QACd,YAAY,EAAE,OAAO,CAAC;QACtB,QAAQ,EAAE,OAAO,CAAC;KAClB,CAAC,CAAC;CACH"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAG7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AA6B7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAkJzD,CAAC;AAMH,MAAM,MAAM,aAAa,GAAG;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;CAC7B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,eAAe,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxF,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,YAAY;IAC5B,QAAQ,EAAE,IAAI,CAAC;QACd,YAAY,EAAE,OAAO,CAAC;QACtB,QAAQ,EAAE,OAAO,CAAC;KAClB,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/Checkbox/Checkbox.js

@@ -4,10 +4,10 @@ import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { Icon } from '../../Atoms/Icon';
 import { useA11y } from '../../../hooks/useA11y';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 const defaultStyles = ({ size, color, theme, native }) => {
     const pixelSize = isNaN(Number(size)) ? size : `${size}px`;
@@ -35,6 +35,7 @@ const defaultStyles = ({ size, color, theme, native }) => {
 };
 export const Checkbox = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         size: '12px',
@@ -43,7 +44,13 @@ export const Checkbox = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('checkbox', globalTheme, defaultProps, properties);
-    const { checked, color, disabled, icon, iconColor, onClick, size, startChecked, native, disableA11y, disableStyles, className, internalClassName, theme, treePath, lang, style: _, styleScript: __, themeStyleScript: ___, name: ____, ...additionalProps } = props;
+    const { checked, color, disabled, icon, iconColor, onClick, size, startChecked, native, disableA11y, disableStyles, className, internalClassName, theme, treePath, lang, customComponent, style: _, styleScript: __, themeStyleScript: ___, name: ____, ...additionalProps } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.checkbox || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const pixelSize = isNaN(Number(size)) ? size : `${size}px`;
     const subProps = {
         icon: {

package/dist/esm/components/src/components/Molecules/ErrorHandler/ErrorHandler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorHandler.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/ErrorHandler/ErrorHandler.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACzE,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAyG/C,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CAgHjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,KAAK,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,SAAS,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,IAAI,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;CACjC,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACtE,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAChC,WAAW,EAAE,IAAI,CAAC;QACjB,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;IACH,QAAQ,EAAE,IAAI,CAAC;QACd,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;IACH,SAAS,EAAE,IAAI,CAAC;QACf,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;IACH,UAAU,EAAE,IAAI,CAAC;QAChB,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;CACH"}
+{"version":3,"file":"ErrorHandler.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/ErrorHandler/ErrorHandler.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACzE,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AA0G7D,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CAwHjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAChC,KAAK,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,SAAS,CAAC;QAChB,OAAO,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,IAAI,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;CACjC,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACtE,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAChC,WAAW,EAAE,IAAI,CAAC;QACjB,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;IACH,QAAQ,EAAE,IAAI,CAAC;QACd,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;IACH,SAAS,EAAE,IAAI,CAAC;QACf,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;IACH,UAAU,EAAE,IAAI,CAAC;QAChB,UAAU,EAAE,kBAAkB,CAAC;KAC/B,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/ErrorHandler/ErrorHandler.js

@@ -5,9 +5,9 @@ import { observer } from 'mobx-react-lite';
 import { Icon } from '../../Atoms/Icon/Icon';
 import { Button } from '../../Atoms/Button/Button';
 import { defined, Colour, mergeProps, mergeStyles } from '../../../utilities';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { ErrorType } from '@athoscommerce/snap-store-mobx';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 const warnColour = new Colour('#ecaa15');
 const errorColour = new Colour('#cc1212');
@@ -107,12 +107,19 @@ const defaultStyles = ({ theme }) => {
 };
 export const ErrorHandler = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
     };
     const props = mergeProps('errorHandler', globalTheme, defaultProps, properties);
-    const { controller, error, disableStyles, onRetryClick, className, internalClassName, treePath } = props;
+    const { controller, error, disableStyles, onRetryClick, className, internalClassName, treePath, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.errorHandler || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         icon: {
             // default props

package/dist/esm/components/src/components/Molecules/FacetGridOptions/FacetGridOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetGridOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetGridOptions/FacetGridOptions.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAuE/C,eAAO,MAAM,gBAAgB,gBAAyB,qBAAqB;;CA0EzE,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG;IACnC,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;IACrC,KAAK,CAAC,EAAE,UAAU,CAAC;CACnB,GAAG,mCAAmC,GACtC,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAEvC,MAAM,MAAM,mCAAmC,GAAG;IACjD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;CACjB,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACpC,UAAU,EAAE,IAAI,CAAC;QAChB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;KAClB,CAAC,CAAC;CACH"}
+{"version":3,"file":"FacetGridOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetGridOptions/FacetGridOptions.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAwE7D,eAAO,MAAM,gBAAgB,gBAAyB,qBAAqB;;CAkFzE,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG;IACnC,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;IACrC,KAAK,CAAC,EAAE,UAAU,CAAC;CACnB,GAAG,mCAAmC,GACtC,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAEvC,MAAM,MAAM,mCAAmC,GAAG;IACjD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;CACjB,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACpC,UAAU,EAAE,IAAI,CAAC;QAChB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;KAClB,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/FacetGridOptions/FacetGridOptions.js

@@ -2,10 +2,10 @@ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { mergeProps, mergeStyles } from '../../../utilities';
 import { createHoverProps } from '../../../toolbox';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 import Color from 'color';
 const defaultStyles = ({ columns, gapSize, gridSize, theme }) => {
@@ -71,6 +71,7 @@ const defaultStyles = ({ columns, gapSize, gridSize, theme }) => {
 };
 export const FacetGridOptions = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         columns: 4,
@@ -79,7 +80,13 @@ export const FacetGridOptions = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('facetGridOptions', globalTheme, defaultProps, properties);
-    const { values, onClick, previewOnFocus, valueProps, facet, horizontal, className, internalClassName } = props;
+    const { values, onClick, previewOnFocus, valueProps, facet, horizontal, className, internalClassName, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.facetGridOptions || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     if (horizontal) {
         props.columns = 0;
     }

package/dist/esm/components/src/components/Molecules/FacetHierarchyOptions/FacetHierarchyOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetHierarchyOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetHierarchyOptions/FacetHierarchyOptions.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACtF,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAE/C,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAwF7D,eAAO,MAAM,qBAAqB,gBAAyB,0BAA0B;;CAuGnF,CAAC;AAEH,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC,yBAAyB,CAAC,CAAC;IAC1C,KAAK,CAAC,EAAE,UAAU,CAAC;CACnB,GAAG,wCAAwC,GAC3C,cAAc,CAAC,0BAA0B,CAAC,CAAC;AAE5C,MAAM,MAAM,wCAAwC,GAAG;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,yBAAyB;IACzC,eAAe,EAAE,IAAI,CAAC;QACrB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,mBAAmB,CAAC;KAC3B,CAAC,CAAC;CACH"}
+{"version":3,"file":"FacetHierarchyOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetHierarchyOptions/FacetHierarchyOptions.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACtF,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAyF7D,eAAO,MAAM,qBAAqB,gBAAyB,0BAA0B;;CAgHnF,CAAC;AAEH,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC,yBAAyB,CAAC,CAAC;IAC1C,KAAK,CAAC,EAAE,UAAU,CAAC;CACnB,GAAG,wCAAwC,GAC3C,cAAc,CAAC,0BAA0B,CAAC,CAAC;AAE5C,MAAM,MAAM,wCAAwC,GAAG;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,WAAW,yBAAyB;IACzC,eAAe,EAAE,IAAI,CAAC;QACrB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,mBAAmB,CAAC;KAC3B,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/FacetHierarchyOptions/FacetHierarchyOptions.js

@@ -2,10 +2,10 @@ 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';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { createHoverProps } from '../../../toolbox';
-import { useLang } from '../../../hooks';
+import { useLang, useComponent } from '../../../hooks';
 import deepmerge from 'deepmerge';
 import { Icon } from '../../Atoms/Icon';
 const defaultStyles = ({ theme, horizontal, returnIcon }) => {
@@ -93,12 +93,19 @@ const defaultStyles = ({ theme, horizontal, returnIcon }) => {
 };
 export const FacetHierarchyOptions = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
     };
     const props = mergeProps('facetHierarchyOptions', globalTheme, defaultProps, properties);
-    const { values, hideCount, returnIcon, onClick, previewOnFocus, horizontal, valueProps, facet, disableStyles, treePath, className, internalClassName, } = props;
+    const { values, hideCount, returnIcon, onClick, previewOnFocus, horizontal, valueProps, facet, disableStyles, treePath, className, internalClassName, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.facetHierarchyOptions || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         icon: {
             internalClassName: 'ss__facet-hierarchy-options__icon',

package/dist/esm/components/src/components/Molecules/FacetListOptions/FacetListOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetListOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetListOptions/FacetListOptions.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAI7D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAiC/C,eAAO,MAAM,gBAAgB,gBAAyB,qBAAqB;;CAsHzE,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG;IACnC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACrC,GAAG,mCAAmC,GACtC,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAEvC,MAAM,MAAM,mCAAmC,GAAG;IACjD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACpC,UAAU,EAAE,IAAI,CAAC;QAChB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;KAClB,CAAC,CAAC;CACH"}
+{"version":3,"file":"FacetListOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetListOptions/FacetListOptions.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAI7D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAkC7D,eAAO,MAAM,gBAAgB,gBAAyB,qBAAqB;;CA+HzE,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG;IACnC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;CACrC,GAAG,mCAAmC,GACtC,cAAc,CAAC,qBAAqB,CAAC,CAAC;AAEvC,MAAM,MAAM,mCAAmC,GAAG;IACjD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACpC,UAAU,EAAE,IAAI,CAAC;QAChB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;KAClB,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/FacetListOptions/FacetListOptions.js

@@ -2,11 +2,11 @@ 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';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Checkbox } from '../Checkbox/Checkbox';
 import { createHoverProps } from '../../../toolbox';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 import { Radio } from '../Radio';
 const defaultStyles = ({ horizontal, theme, hideCheckbox }) => {
@@ -38,13 +38,20 @@ const defaultStyles = ({ horizontal, theme, hideCheckbox }) => {
 };
 export const FacetListOptions = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         hideCheckbox: properties.horizontal ? true : false,
         treePath: globalTreePath,
     };
     const props = mergeProps('facetListOptions', globalTheme, defaultProps, properties);
-    const { values, hideCheckbox, hideCount, onClick, previewOnFocus, hideCountParenthesis, respectSingleSelect, valueProps, facet, disableStyles, className, internalClassName, treePath, } = props;
+    const { values, hideCheckbox, hideCount, onClick, previewOnFocus, hideCountParenthesis, respectSingleSelect, valueProps, facet, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.facetListOptions || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     let renderRadios = false;
     if (respectSingleSelect && facet?.multiple == 'single') {
         renderRadios = true;

package/dist/esm/components/src/components/Molecules/FacetPaletteOptions/FacetPaletteOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetPaletteOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetPaletteOptions/FacetPaletteOptions.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAI7D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE7E,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAkJ/C,eAAO,MAAM,mBAAmB,gBAAyB,wBAAwB;;CAyL/E,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG;IACtC,IAAI,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;CACtB,GAAG,sCAAsC,GACzC,cAAc,CAAC,wBAAwB,CAAC,CAAC;AAE1C,MAAM,MAAM,sCAAsC,GAAG;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE;QACd,CAAC,IAAI,EAAE,MAAM,GAAG;YACf,KAAK,CAAC,EAAE,MAAM,CAAC;YACf,UAAU,CAAC,EAAE,MAAM,CAAC;YACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;SAC5B,CAAC;KACF,CAAC;CACF,CAAC;AAEF,MAAM,WAAW,uBAAuB;IACvC,aAAa,EAAE,IAAI,CAAC;QACnB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;KAClB,CAAC,CAAC;CACH"}
+{"version":3,"file":"FacetPaletteOptions.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetPaletteOptions/FacetPaletteOptions.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAI7D,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE7E,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAmJ7D,eAAO,MAAM,mBAAmB,gBAAyB,wBAAwB;;CAkM/E,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG;IACtC,IAAI,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,MAAM,CAAC,EAAE,UAAU,EAAE,CAAC;CACtB,GAAG,sCAAsC,GACzC,cAAc,CAAC,wBAAwB,CAAC,CAAC;AAE1C,MAAM,MAAM,sCAAsC,GAAG;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE;QACd,CAAC,IAAI,EAAE,MAAM,GAAG;YACf,KAAK,CAAC,EAAE,MAAM,CAAC;YACf,UAAU,CAAC,EAAE,MAAM,CAAC;YACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;SAC5B,CAAC;KACF,CAAC;CACF,CAAC;AAEF,MAAM,WAAW,uBAAuB;IACvC,aAAa,EAAE,IAAI,CAAC;QACnB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;KAClB,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/FacetPaletteOptions/FacetPaletteOptions.js

@@ -5,10 +5,10 @@ import { observer } from 'mobx-react-lite';
 import { filters } from '@athoscommerce/snap-toolbox';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Icon } from '../../Atoms/Icon';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { createHoverProps } from '../../../toolbox';
 import { Checkbox } from '../Checkbox';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 import Color from 'color';
 import { Image } from '../../Atoms/Image';
@@ -138,6 +138,7 @@ const defaultStyles = ({ columns, gridSize, gapSize, horizontal, theme }) => {
 };
 export const FacetPaletteOptions = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         columns: 4,
@@ -149,7 +150,13 @@ export const FacetPaletteOptions = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('facetPaletteOptions', globalTheme, defaultProps, properties);
-    const { values, hideLabel, layout, hideCount, hideCheckbox, colorMapping, hideIcon, onClick, previewOnFocus, valueProps, facet, horizontal, disableStyles, className, internalClassName, treePath, } = props;
+    const { values, hideLabel, layout, hideCount, hideCheckbox, colorMapping, hideIcon, onClick, previewOnFocus, valueProps, facet, horizontal, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.facetPaletteOptions || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     if (horizontal) {
         props.columns = 0;
     }

package/dist/esm/components/src/components/Molecules/FacetSlider/FacetSlider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetSlider.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetSlider/FacetSlider.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAE,IAAI,EAAoB,MAAM,gBAAgB,CAAC;AAwIxD,eAAO,MAAM,WAAW,gBAAyB,gBAAgB;;CAwK/D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG;IAC9B,KAAK,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAChC,GAAG,8BAA8B,GACjC,cAAc,CAAC,gBAAgB,CAAC,CAAC;AAElC,MAAM,MAAM,8BAA8B,GAAG;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,MAAM,WAAW,eAAe;IAC/B,YAAY,EAAE,IAAI,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACd,CAAC,CAAC;CACH"}
+{"version":3,"file":"FacetSlider.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/FacetSlider/FacetSlider.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAE,IAAI,EAAkC,MAAM,gBAAgB,CAAC;AAyItE,eAAO,MAAM,WAAW,gBAAyB,gBAAgB;;CAgL/D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG;IAC9B,KAAK,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAChC,GAAG,8BAA8B,GACjC,cAAc,CAAC,gBAAgB,CAAC,CAAC;AAElC,MAAM,MAAM,8BAA8B,GAAG;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,MAAM,WAAW,eAAe;IAC/B,YAAY,EAAE,IAAI,CAAC;QAClB,KAAK,EAAE,UAAU,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACd,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/FacetSlider/FacetSlider.js

@@ -4,10 +4,10 @@ import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { useRanger } from 'react-ranger';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { mergeProps, mergeStyles } from '../../../utilities';
 import { sprintf } from '../../../utilities';
-import { useA11y, useLang } from '../../../hooks';
+import { useA11y, useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 const defaultStyles = ({ railColor, trackColor, handleColor, valueTextColor, handleDraggingColor, showTicks, stickyHandleLabel, tickTextColor, theme, }) => {
     return css({
@@ -125,13 +125,20 @@ const defaultStyles = ({ railColor, trackColor, handleColor, valueTextColor, han
 };
 export const FacetSlider = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         tickSize: properties.facet?.step ? properties.facet?.step * 10 : 20,
         treePath: globalTreePath,
     };
     const props = mergeProps('facetSlider', globalTheme, defaultProps, properties);
-    const { showTicks, facet, stickyHandleLabel, separateHandles, onChange, onDrag, className, internalClassName } = props;
+    const { showTicks, facet, stickyHandleLabel, separateHandles, onChange, onDrag, className, internalClassName, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.facetSlider || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     let { tickSize } = props;
     if (isNaN(Number(tickSize)) || Number(tickSize) <= 0) {
         // fallback to default (causes chrome to crash)

package/dist/esm/components/src/components/Molecules/Filter/Filter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Filter/Filter.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAsB/C,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CAyFrD,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAC3B,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,GAAG,CAAC,EAAE,UAAU,CAAC;CACjB,GAAG,yBAAyB,GAC5B,cAAc,CAAC,WAAW,CAAC,CAAC;AAE7B,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACvE,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,WAAW,UAAU;IAC1B,MAAM,EAAE,IAAI,CAAC;QACZ,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;KACf,CAAC,CAAC;CACH;AAOD,MAAM,MAAM,WAAW,GAAG,WAAW,CAAC"}
+{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Filter/Filter.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAuB7D,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CA8GrD,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAC3B,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,GAAG,CAAC,EAAE,UAAU,CAAC;CACjB,GAAG,yBAAyB,GAC5B,cAAc,CAAC,WAAW,CAAC,CAAC;AAE7B,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACvE,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,WAAW,UAAU;IAC1B,MAAM,EAAE,IAAI,CAAC;QACZ,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;KACf,CAAC,CAAC;CACH;AAOD,MAAM,MAAM,WAAW,GAAG,WAAW,CAAC"}