@athoscommerce/snap-preact 1.1.5 → 1.2.0

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

@@ -3,10 +3,10 @@ import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { Button } from '../../Atoms/Button';
 import { Icon } from '../../Atoms/Icon';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 import deepmerge from 'deepmerge';
 const defaultStyles = ({}) => {
     return css({
@@ -28,12 +28,19 @@ const defaultStyles = ({}) => {
 // TODO: look into urlManager and how it connects in this case, left the href out for the time being
 export const Filter = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
     };
     const props = mergeProps('filter', globalTheme, defaultProps, properties);
-    const { filter, facetLabel, valueLabel, url, hideFacetLabel, onClick, icon, separator, disableStyles, className, internalClassName, treePath } = props;
+    const { filter, facetLabel, valueLabel, url, hideFacetLabel, onClick, icon, separator, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.filter || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const link = filter?.url?.link || url?.link;
     const value = filter?.value.label || valueLabel;
     const label = filter?.facet.label || facetLabel;

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

@@ -1 +1 @@
-{"version":3,"file":"Grid.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Grid/Grid.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,YAAY,EAAe,MAAM,gBAAgB,CAAC;AACvF,OAAO,EAAE,IAAI,EAAoB,MAAM,gBAAgB,CAAC;AAyHxD,wBAAgB,IAAI,CAAC,UAAU,EAAE,SAAS,2DAyMzC;AAED,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;CACzB,GAAG,uBAAuB,GAC1B,cAAc,CAAC,SAAS,CAAC,CAAC;AAE3B,MAAM,MAAM,uBAAuB,GAAG;IACrC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAClG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,EAAE,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,cAAc,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,qBAAqB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACnH,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,QAAQ;IACxB,YAAY,EAAE,IAAI,CAAC;QAClB,OAAO,EAAE,OAAO,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;QAClB,oBAAoB,EAAE,OAAO,CAAC;KAC9B,CAAC,CAAC;IACH,YAAY,EAAE,IAAI,CAAC;QAClB,OAAO,EAAE,OAAO,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;QAClB,oBAAoB,EAAE,OAAO,CAAC;KAC9B,CAAC,CAAC;CACH"}
+{"version":3,"file":"Grid.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Grid/Grid.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,YAAY,EAAe,MAAM,gBAAgB,CAAC;AACvF,OAAO,EAAE,IAAI,EAAkC,MAAM,gBAAgB,CAAC;AA0HtE,wBAAgB,IAAI,CAAC,UAAU,EAAE,SAAS,2DAkNzC;AAED,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;CACzB,GAAG,uBAAuB,GAC1B,cAAc,CAAC,SAAS,CAAC,CAAC;AAE3B,MAAM,MAAM,uBAAuB,GAAG;IACrC,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAClG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,EAAE,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,cAAc,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,qBAAqB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACnH,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,QAAQ;IACxB,YAAY,EAAE,IAAI,CAAC;QAClB,OAAO,EAAE,OAAO,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;QAClB,oBAAoB,EAAE,OAAO,CAAC;KAC9B,CAAC,CAAC;IACH,YAAY,EAAE,IAAI,CAAC;QAClB,OAAO,EAAE,OAAO,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;QAClB,oBAAoB,EAAE,OAAO,CAAC;KAC9B,CAAC,CAAC;CACH"}

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

@@ -4,8 +4,8 @@ import { useState } from 'preact/hooks';
 import classnames from 'classnames';
 import deepmerge from 'deepmerge';
 import { filters } from '@athoscommerce/snap-toolbox';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
-import { useA11y, useLang } from '../../../hooks';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
+import { useA11y, useLang, useComponent } from '../../../hooks';
 import { Image } from '../../Atoms/Image';
 import { cloneWithProps, defined, mergeProps, mergeStyles } from '../../../utilities';
 import Color from 'color';
@@ -113,6 +113,7 @@ const defaultStyles = ({ gapSize, columns, theme, disableOverflowAction }) => {
 };
 export function Grid(properties) {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         // default props
@@ -122,7 +123,13 @@ export function Grid(properties) {
         treePath: globalTreePath,
     };
     const props = mergeProps('grid', globalTheme, defaultProps, properties);
-    const { titleText, onSelect, hideLabels, disableOverflowAction, multiSelect, overflowButton, columns, rows, hideShowLess, overflowButtonInGrid, disabled, options, disableStyles, onOverflowButtonClick, className, internalClassName, treePath, disableA11y, } = props;
+    const { titleText, onSelect, hideLabels, disableOverflowAction, multiSelect, overflowButton, columns, rows, hideShowLess, overflowButtonInGrid, disabled, options, disableStyles, onOverflowButtonClick, className, internalClassName, treePath, disableA11y, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.grid || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         image: {
             // default props

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

@@ -1 +1 @@
-{"version":3,"file":"LayoutSelector.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/LayoutSelector/LayoutSelector.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAIzE,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAYtC,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CAqIrE,CAAC;AAOH,MAAM,MAAM,mBAAmB,GAAG;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACnC,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,QAAQ,CAAC,EAAE,UAAU,CAAC;CACtB,GAAG,iCAAiC,GACpC,cAAc,CAAC,mBAAmB,CAAC,CAAC;AAErC,MAAM,MAAM,iCAAiC,GAAG;IAC/C,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC5G,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;IACrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,kBAAkB;IAClC,KAAK,EAAE,IAAI,CAAC;QACX,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}
+{"version":3,"file":"LayoutSelector.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/LayoutSelector/LayoutSelector.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAIzE,OAAO,EAAE,IAAI,EAAgB,MAAM,gBAAgB,CAAC;AAapD,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CAyJrE,CAAC;AAOH,MAAM,MAAM,mBAAmB,GAAG;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACnC,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IACvB,QAAQ,CAAC,EAAE,UAAU,CAAC;CACtB,GAAG,iCAAiC,GACpC,cAAc,CAAC,mBAAmB,CAAC,CAAC;AAErC,MAAM,MAAM,iCAAiC,GAAG;IAC/C,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC5G,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;IACrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,kBAAkB;IAClC,KAAK,EAAE,IAAI,CAAC;QACX,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}

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

@@ -2,11 +2,12 @@ import { jsx as _jsx, jsxs as _jsxs } 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 { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Select } from '../Select';
 import { List } from '../List';
 import { RadioList } from '../RadioList';
+import { useComponent } from '../../../hooks';
 import deepmerge from 'deepmerge';
 const defaultStyles = ({}) => {
     return css({
@@ -18,6 +19,7 @@ const defaultStyles = ({}) => {
 };
 export const LayoutSelector = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         label: 'Layout',
@@ -27,8 +29,14 @@ export const LayoutSelector = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('layoutSelector', globalTheme, defaultProps, properties);
-    const { options, selected, type, onSelect, showSingleOption, hideLabel, hideOptionLabels, disableStyles, className, internalClassName, treePath } = props;
+    const { options, selected, type, onSelect, showSingleOption, hideLabel, hideOptionLabels, disableStyles, className, internalClassName, treePath, customComponent, } = props;
     let label = props.label;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.layoutSelector || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         Select: {
             hideOptionLabels,

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

@@ -1 +1 @@
-{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/List/List.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAGzE,OAAO,EAAE,IAAI,EAAoB,MAAM,gBAAgB,CAAC;AAmDxD,wBAAgB,IAAI,CAAC,UAAU,EAAE,SAAS,2DAyKzC;AAED,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;CACzB,GAAG,uBAAuB,GAC1B,cAAc,CAAC,SAAS,CAAC,CAAC;AAE3B,MAAM,MAAM,uBAAuB,GAAG;IACrC,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAClG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,EAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,QAAQ;IACxB,KAAK,CAAC,EAAE,IAAI,CAAC;QACZ,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/List/List.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAGzE,OAAO,EAAE,IAAI,EAAkC,MAAM,gBAAgB,CAAC;AAoDtE,wBAAgB,IAAI,CAAC,UAAU,EAAE,SAAS,2DAkLzC;AAED,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;CACzB,GAAG,uBAAuB,GAC1B,cAAc,CAAC,SAAS,CAAC,CAAC;AAE3B,MAAM,MAAM,uBAAuB,GAAG;IACrC,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAClG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,EAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,QAAQ;IACxB,KAAK,CAAC,EAAE,IAAI,CAAC;QACZ,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}

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

@@ -4,10 +4,10 @@ import { css } from '@emotion/react';
 import classnames from 'classnames';
 import deepmerge from 'deepmerge';
 import { filters } from '@athoscommerce/snap-toolbox';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Checkbox } from '../Checkbox';
-import { useA11y, useLang } from '../../../hooks';
+import { useA11y, useComponent, useLang } from '../../../hooks';
 import { Icon } from '../../Atoms/Icon';
 const defaultStyles = ({ horizontal }) => {
     return css({
@@ -52,12 +52,19 @@ const defaultStyles = ({ horizontal }) => {
 };
 export function List(properties) {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
     };
     const props = mergeProps('list', globalTheme, defaultProps, properties);
-    const { titleText, onSelect, native, multiSelect, hideOptionLabels, hideOptionIcons, hideOptionCheckboxes, disabled, hideTitleText, options, requireSelection, disableStyles, className, internalClassName, treePath, } = props;
+    const { titleText, onSelect, native, multiSelect, hideOptionLabels, hideOptionIcons, hideOptionCheckboxes, disabled, hideTitleText, options, requireSelection, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.list || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     let selected = props.selected;
     const subProps = {
         checkbox: {

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

@@ -1 +1 @@
-{"version":3,"file":"LoadMore.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/LoadMore/LoadMore.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,IAAI,EAA4B,MAAM,gBAAgB,CAAC;AAChE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAqD7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CAkKzD,CAAC;AAOH,MAAM,MAAM,aAAa,GAAG;IAC3B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;CAC7B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC5C,eAAe,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACrE,CAAC;AAEF,MAAM,WAAW,YAAY;IAC5B,cAAc,EAAE,IAAI,CAAC;QACpB,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,YAAY,EAAE,IAAI,CAAC;QAClB,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;CACH"}
+{"version":3,"file":"LoadMore.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/LoadMore/LoadMore.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,IAAI,EAA0C,MAAM,gBAAgB,CAAC;AAC9E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAsD7D,eAAO,MAAM,QAAQ,gBAAyB,aAAa;;CA2KzD,CAAC;AAOH,MAAM,MAAM,aAAa,GAAG;IAC3B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;CAC7B,GAAG,2BAA2B,GAC9B,cAAc,CAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,MAAM,2BAA2B,GAAG;IACzC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC5C,eAAe,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;CACrE,CAAC;AAEF,MAAM,WAAW,YAAY;IAC5B,cAAc,EAAE,IAAI,CAAC;QACpB,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,YAAY,EAAE,IAAI,CAAC;QAClB,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;CACH"}

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

@@ -4,9 +4,9 @@ import { css, keyframes } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import deepmerge from 'deepmerge';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
-import { useIntersection, useLang } from '../../../hooks';
+import { useComponent, useIntersection, useLang } from '../../../hooks';
 import { Button } from '../../Atoms/Button';
 import { Icon } from '../../Atoms/Icon';
 import { useFuncDebounce } from '../../../hooks';
@@ -61,6 +61,7 @@ const defaultStyles = ({ pagination, progressIndicatorWidth, progressIndicatorSi
 };
 export const LoadMore = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         loadMoreText: 'Load More',
@@ -71,7 +72,13 @@ export const LoadMore = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('loadMore', globalTheme, defaultProps, properties);
-    const { pagination, controller, onClick, autoFetch, intersectionOffset, loading, loadMoreText, hideProgressIndicator, hideProgressText, loadingLocation, loadingIcon, disableStyles, className, internalClassName, treePath, } = props;
+    const { pagination, controller, onClick, autoFetch, intersectionOffset, loading, loadMoreText, hideProgressIndicator, hideProgressText, loadingLocation, loadingIcon, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.loadMore || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const store = pagination || controller?.store?.pagination;
     const isLoading = typeof loading == 'boolean' ? loading : controller?.store?.loading;
     const isButtonDisabled = (isLoading && loadingLocation === 'button') || !Boolean(store?.next);

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAK,MAAM,QAAQ,CAAC;AAO9C,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAuC7D,eAAO,MAAM,KAAK,gBAAyB,UAAU;;CAqKnD,CAAC;AAEH,MAAM,MAAM,UAAU,GAAG,wBAAwB,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC;AAE/E,MAAM,MAAM,wBAAwB,GAAG;IACtC,MAAM,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC;CAC1E,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAK,MAAM,QAAQ,CAAC;AAO9C,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAwC7D,eAAO,MAAM,KAAK,gBAAyB,UAAU;;CA8KnD,CAAC;AAEH,MAAM,MAAM,UAAU,GAAG,wBAAwB,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC;AAE/E,MAAM,MAAM,wBAAwB,GAAG;IACtC,MAAM,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC;CAC1E,CAAC"}

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

@@ -3,8 +3,8 @@ import { useState, useEffect } from 'preact/hooks';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
-import { useClickOutside } from '../../../hooks';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
+import { useClickOutside, useComponent } from '../../../hooks';
 import { cloneWithProps, defined, mergeProps, mergeStyles } from '../../../utilities';
 import { useA11y } from '../../../hooks/useA11y';
 import { Overlay } from '../../Atoms/Overlay';
@@ -40,6 +40,7 @@ const defaultStyles = () => {
 };
 export const Modal = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         startOpen: false,
@@ -49,7 +50,13 @@ export const Modal = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('modal', globalTheme, defaultProps, properties);
-    const { button, content, buttonSelector, children, disabled, open, onClick, lockScroll, startOpen, disableClickOutside, disableA11y, className, internalClassName, disableStyles, overlayColor, onOverlayClick, treePath, } = props;
+    const { button, content, buttonSelector, children, disabled, open, onClick, lockScroll, startOpen, disableClickOutside, disableA11y, className, internalClassName, disableStyles, overlayColor, onOverlayClick, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.modal || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         overlay: {
             // default props

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

@@ -1 +1 @@
-{"version":3,"file":"OverlayBadge.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/OverlayBadge/OverlayBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAK,MAAM,QAAQ,CAAC;AAO9C,OAAO,EAAE,cAAc,EAAE,YAAY,EAAe,MAAM,gBAAgB,CAAC;AAG3E,OAAO,KAAK,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAuD9D,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CAiGjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CACjF,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,YAAY,CAAC,EAAE,YAAY,CAAC;CAC5B,CAAC"}
+{"version":3,"file":"OverlayBadge.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/OverlayBadge/OverlayBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAK,MAAM,QAAQ,CAAC;AAO9C,OAAO,EAAE,cAAc,EAAE,YAAY,EAAe,MAAM,gBAAgB,CAAC;AAG3E,OAAO,KAAK,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAuD9D,eAAO,MAAM,YAAY,gBAAyB,iBAAiB;;CAwGjE,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CACjF,GAAG,+BAA+B,GAClC,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,+BAA+B,GAAG;IAC7C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,YAAY,CAAC,EAAE,YAAY,CAAC;CAC5B,CAAC"}

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

@@ -1,4 +1,4 @@
-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 { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
@@ -56,7 +56,13 @@ export const OverlayBadge = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('overlayBadge', globalTheme, defaultProps, properties);
-    const { result, children, controller, renderEmpty, limit, className, internalClassName, treePath } = props;
+    const { result, children, controller, renderEmpty, limit, className, internalClassName, treePath, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.overlayBadge || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     if (!children) {
         controller?.log?.warn('OverlayBadge component must have children');
         return null;

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

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Pagination/Pagination.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAkB/C,eAAO,MAAM,UAAU,gBAAyB,eAAe;;CAuK7D,CAAC;AAMH,MAAM,MAAM,eAAe,GAAG;IAC7B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC/B,GAAG,6BAA6B,GAChC,cAAc,CAAC,eAAe,CAAC,CAAC;AAEjC,MAAM,MAAM,6BAA6B,GAAG;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IACnC,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,cAAc;IAC9B,QAAQ,EAAE,IAAI,CAAC;QACd,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,IAAI,EAAE,IAAI,CAAC;QACV,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,KAAK,EAAE,IAAI,CAAC;QACX,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,IAAI,EAAE,IAAI,CAAC;QACV,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,IAAI,EAAE,IAAI,CAAC;QACV,UAAU,EAAE,qBAAqB,CAAC;QAClC,IAAI,EAAE,IAAI,CAAC;KACX,CAAC,CAAC;CACH"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Pagination/Pagination.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAmB7D,eAAO,MAAM,UAAU,gBAAyB,eAAe;;CAgL7D,CAAC;AAMH,MAAM,MAAM,eAAe,GAAG;IAC7B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC/B,GAAG,6BAA6B,GAChC,cAAc,CAAC,eAAe,CAAC,CAAC;AAEjC,MAAM,MAAM,6BAA6B,GAAG;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IACnC,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,cAAc;IAC9B,QAAQ,EAAE,IAAI,CAAC;QACd,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,IAAI,EAAE,IAAI,CAAC;QACV,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,KAAK,EAAE,IAAI,CAAC;QACX,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,IAAI,EAAE,IAAI,CAAC;QACV,UAAU,EAAE,qBAAqB,CAAC;KAClC,CAAC,CAAC;IACH,IAAI,EAAE,IAAI,CAAC;QACV,UAAU,EAAE,qBAAqB,CAAC;QAClC,IAAI,EAAE,IAAI,CAAC;KACX,CAAC,CAAC;CACH"}

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

@@ -2,11 +2,11 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/reac
 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 { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Icon } from '../../Atoms/Icon';
 import deepmerge from 'deepmerge';
-import { useLang } from '../../../hooks';
+import { useComponent, useLang } from '../../../hooks';
 const defaultStyles = () => {
     return css({
         '& .ss__pagination__page': {
@@ -24,13 +24,20 @@ const defaultStyles = () => {
 };
 export const Pagination = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         pages: 5,
         treePath: globalTreePath,
     };
     const props = mergeProps('pagination', globalTheme, defaultProps, properties);
-    const { pagination, controller, pages, pagesLeft, pagesRight, hideFirst, hideLast, persistFirst, persistLast, hideEllipsis, hideNext, hidePrev, nextButton, prevButton, firstButton, lastButton, disableStyles, className, internalClassName, treePath, } = props;
+    const { pagination, controller, pages, pagesLeft, pagesRight, hideFirst, hideLast, persistFirst, persistLast, hideEllipsis, hideNext, hidePrev, nextButton, prevButton, firstButton, lastButton, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.pagination || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         icon: {
             // default props

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

@@ -1 +1 @@
-{"version":3,"file":"PerPage.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/PerPage/PerPage.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAEzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAIvE,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAWtC,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAuHvD,CAAC;AAQH,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;CACrC,CAAC;AAEF,MAAM,WAAW,WAAW;IAC3B,KAAK,EAAE,IAAI,CAAC;QACX,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}
+{"version":3,"file":"PerPage.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/PerPage/PerPage.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAEzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAIvE,OAAO,EAAE,IAAI,EAAgB,MAAM,gBAAgB,CAAC;AAYpD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CA+HvD,CAAC;AAQH,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC;CACrC,CAAC;AAEF,MAAM,WAAW,WAAW;IAC3B,KAAK,EAAE,IAAI,CAAC;QACX,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}

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

@@ -2,12 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs } 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 { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Select } from '../Select';
 import { RadioList } from '../RadioList';
 import { List } from '../List';
 import deepmerge from 'deepmerge';
+import { useComponent } from '../../../hooks';
 const defaultStyles = () => {
     return css({
         '.ss__button__content': {
@@ -18,6 +19,7 @@ const defaultStyles = () => {
 };
 export const PerPage = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         label: 'Per Page',
@@ -25,7 +27,13 @@ export const PerPage = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('perPage', globalTheme, defaultProps, properties);
-    const { pagination, type, controller, label, disableStyles, className, internalClassName, treePath } = props;
+    const { pagination, type, controller, label, disableStyles, className, internalClassName, treePath, customComponent } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.perPage || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const store = pagination || controller?.store?.pagination;
     const subProps = {
         select: {

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

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Radio/Radio.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;AAuB/C,eAAO,MAAM,KAAK,gBAAyB,UAAU;;CAgJnD,CAAC;AAOH,MAAM,MAAM,UAAU,GAAG;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;CAC1B,GAAG,wBAAwB,GAC3B,cAAc,CAAC,UAAU,CAAC,CAAC;AAE5B,MAAM,MAAM,wBAAwB,GAAG;IACtC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC5C,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,eAAe,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,SAAS;IACzB,KAAK,EAAE,IAAI,CAAC;QACX,QAAQ,EAAE,OAAO,CAAC;QAClB,YAAY,EAAE,OAAO,CAAC;KACtB,CAAC,CAAC;CACH"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Radio/Radio.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;AAwB7D,eAAO,MAAM,KAAK,gBAAyB,UAAU;;CAyJnD,CAAC;AAOH,MAAM,MAAM,UAAU,GAAG;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;CAC1B,GAAG,wBAAwB,GAC3B,cAAc,CAAC,UAAU,CAAC,CAAC;AAE5B,MAAM,MAAM,wBAAwB,GAAG;IACtC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC5C,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,eAAe,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,SAAS;IACzB,KAAK,EAAE,IAAI,CAAC;QACX,QAAQ,EAAE,OAAO,CAAC;QAClB,YAAY,EAAE,OAAO,CAAC;KACtB,CAAC,CAAC;CACH"}

package/dist/esm/components/src/components/Molecules/Radio/Radio.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, native }) => {
     if (!native) {
@@ -30,6 +30,7 @@ const defaultStyles = ({ size, native }) => {
 };
 export const Radio = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         size: '20px',
@@ -41,7 +42,13 @@ export const Radio = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('radio', globalTheme, defaultProps, properties);
-    const { checked, color, disabled, checkedIcon, unCheckedIcon, onClick, startChecked, native, disableA11y, disableStyles, className, internalClassName, size, treePath, lang, style: _, styleScript: __, themeStyleScript: ___, name: ____, ...additionalProps } = props;
+    const { checked, color, disabled, checkedIcon, unCheckedIcon, onClick, startChecked, native, disableA11y, disableStyles, className, internalClassName, size, treePath, lang, customComponent, style: _, styleScript: __, themeStyleScript: ___, name: ____, ...additionalProps } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.radio || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         activeIcon: {
             name: 'active',

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

@@ -1 +1 @@
-{"version":3,"file":"RadioList.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/RadioList/RadioList.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAIzE,OAAO,EAAE,IAAI,EAAoB,MAAM,gBAAgB,CAAC;AA+CxD,wBAAgB,SAAS,CAAC,UAAU,EAAE,cAAc,2DA0InD;AAED,MAAM,MAAM,cAAc,GAAG;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CAC9B,GAAG,4BAA4B,GAC/B,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,MAAM,4BAA4B,GAAG;IAC1C,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,UAAU,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,aAAa;IAC7B,KAAK,CAAC,EAAE,IAAI,CAAC;QACZ,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}
+{"version":3,"file":"RadioList.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/RadioList/RadioList.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAe,MAAM,gBAAgB,CAAC;AAIzE,OAAO,EAAE,IAAI,EAAkC,MAAM,gBAAgB,CAAC;AAgDtE,wBAAgB,SAAS,CAAC,UAAU,EAAE,cAAc,2DAmJnD;AAED,MAAM,MAAM,cAAc,GAAG;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CAC9B,GAAG,4BAA4B,GAC/B,cAAc,CAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,MAAM,4BAA4B,GAAG;IAC1C,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,UAAU,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,aAAa;IAC7B,KAAK,CAAC,EAAE,IAAI,CAAC;QACZ,OAAO,EAAE,UAAU,EAAE,CAAC;QACtB,eAAe,EAAE,UAAU,EAAE,CAAC;KAC9B,CAAC,CAAC;CACH"}

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import classnames from 'classnames';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { useState } from 'react';
 import { Radio } from '../Radio/Radio';
-import { useA11y, useLang } from '../../../hooks';
+import { useA11y, useLang, useComponent } from '../../../hooks';
 import { Icon } from '../../Atoms/Icon';
 import deepmerge from 'deepmerge';
 const defaultStyles = ({ horizontal }) => {
@@ -46,12 +46,19 @@ const defaultStyles = ({ horizontal }) => {
 };
 export function RadioList(properties) {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
     };
     const props = mergeProps('radioList', globalTheme, defaultProps, properties);
-    const { titleText, onSelect, hideOptionRadios, hideOptionIcons, hideOptionLabels, hideTitleText, native, disabled, selected, options, disableStyles, className, internalClassName, treePath, } = props;
+    const { titleText, onSelect, hideOptionRadios, hideOptionIcons, hideOptionLabels, hideTitleText, native, disabled, selected, options, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.radioList || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         Radio: {
             internalClassName: 'ss__radio-list__option__radio',

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

@@ -1 +1 @@
-{"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Rating/Rating.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAsC7D,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CAyFrD,CAAC;AAOH,MAAM,MAAM,WAAW,GAAG,yBAAyB,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;AAElF,MAAM,MAAM,yBAAyB,GAAG;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACzC,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;CAC1C,CAAC"}
+{"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Rating/Rating.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAQ,SAAS,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAwC7D,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CA6GrD,CAAC;AAOH,MAAM,MAAM,WAAW,GAAG,yBAAyB,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;AAElF,MAAM,MAAM,yBAAyB,GAAG;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;IACzC,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC;CAC1C,CAAC"}

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

@@ -2,9 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/reac
 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 { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Icon } from '../../Atoms/Icon';
+import { useComponent } from '../../../hooks';
 const defaultStyles = () => {
     return css({
         display: 'flex',
@@ -36,6 +37,7 @@ const defaultStyles = () => {
 };
 export const Rating = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         fullIcon: 'star',
@@ -43,7 +45,13 @@ export const Rating = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('rating', globalTheme, defaultProps, properties);
-    const { alwaysRender, count, text, disablePartialFill, emptyIcon, fullIcon, disableStyles, className, internalClassName, treePath } = props;
+    const { alwaysRender, count, text, disablePartialFill, emptyIcon, fullIcon, disableStyles, className, internalClassName, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.rating || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const subProps = {
         fullIcon: {
             name: 'star--full',

package/dist/esm/components/src/components/Molecules/Result/Result.d.ts

@@ -33,6 +33,7 @@ export type ResultTemplatesLegalProps = {
     layout?: keyof typeof ResultsLayout | ResultsLayout;
     truncateTitle?: TruncateTitleProps;
     onClick?: (e: React.MouseEvent<HTMLAnchorElement, Event>) => void;
+    customComponent?: string;
 };
 export interface ResultLang {
     addToCartButtonText: Lang<ResultPropData>;

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

@@ -1 +1 @@
-{"version":3,"file":"Result.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Result/Result.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAY,MAAM,cAAc,CAAC;AAUpD,OAAO,EAAE,cAAc,EAAE,aAAa,EAAe,MAAM,gBAAgB,CAAC;AAG5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAI9D,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAyD/C,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CAwPrD,CAAC;AAWH,MAAM,WAAW,kBAAkB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;IAClF,IAAI,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAC3B,WAAW,CAAC,EAAE,UAAU,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC7C,GAAG,yBAAyB,GAC5B,cAAc,CAAC,WAAW,CAAC,CAAC;AAE7B,MAAM,MAAM,yBAAyB,GAAG;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3F,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,OAAO,aAAa,GAAG,aAAa,CAAC;IACpD,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC;CAClE,CAAC;AAEF,MAAM,WAAW,UAAU;IAC1B,mBAAmB,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;IAC1C,0BAA0B,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cAAc;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CAClF;AAED,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC"}
+{"version":3,"file":"Result.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/Result/Result.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAY,MAAM,cAAc,CAAC;AAUpD,OAAO,EAAE,cAAc,EAAE,aAAa,EAAe,MAAM,gBAAgB,CAAC;AAG5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAI9D,OAAO,EAAE,IAAI,EAAyB,MAAM,gBAAgB,CAAC;AAyD7D,eAAO,MAAM,MAAM,gBAAyB,WAAW;;CAiQrD,CAAC;AAWH,MAAM,WAAW,kBAAkB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,WAAW,GAAG;IACzB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;IAClF,IAAI,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IAC3B,WAAW,CAAC,EAAE,UAAU,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC7C,GAAG,yBAAyB,GAC5B,cAAc,CAAC,WAAW,CAAC,CAAC;AAE7B,MAAM,MAAM,yBAAyB,GAAG;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3F,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,6BAA6B,CAAC,EAAE,MAAM,CAAC;IACvC,UAAU,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,OAAO,aAAa,GAAG,aAAa,CAAC;IACpD,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,KAAK,CAAC,KAAK,IAAI,CAAC;IAClE,eAAe,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,UAAU;IAC1B,mBAAmB,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;IAC1C,0BAA0B,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cAAc;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;CAClF;AAED,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC"}

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

@@ -5,7 +5,7 @@ import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { Image } from '../../Atoms/Image';
 import { Price } from '../../Atoms/Price';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { defined, cloneWithProps, mergeProps, mergeStyles } from '../../../utilities';
 import { filters } from '@athoscommerce/snap-toolbox';
 import { ResultsLayout } from '../../../types';
@@ -14,14 +14,13 @@ import { OverlayBadge } from '../../Molecules/OverlayBadge';
 import { Rating } from '../Rating';
 import { Button } from '../../Atoms/Button';
 import deepmerge from 'deepmerge';
-import { useLang } from '../../../hooks';
+import { useLang, useComponent } from '../../../hooks';
 import { VariantSelection } from '../VariantSelection';
 const defaultStyles = () => {
     return css({
         '&.ss__result--grid': {
             display: 'flex',
             flexDirection: 'column',
-            height: '100%',
             '& .ss__result__image-wrapper': {
                 flex: '1 0 auto',
                 minHeight: '0%',
@@ -67,6 +66,7 @@ const defaultStyles = () => {
 };
 export const Result = observer((properties) => {
     const globalTheme = useTheme();
+    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         layout: ResultsLayout.grid,
@@ -78,7 +78,13 @@ export const Result = observer((properties) => {
         hideRating: true,
     };
     const props = mergeProps('result', globalTheme, defaultProps, properties);
-    const { result, hideBadge, hideTitle, hidePricing, hideImage, detailSlot, fallback, disableStyles, className, internalClassName, layout, onClick, controller, hideVariantSelections, hideAddToCartButton, onAddToCartClick, addToCartButtonText, addToCartButtonSuccessText, addToCartButtonSuccessTimeout, hideRating, trackingRef, treePath, } = props;
+    const { result, hideBadge, hideTitle, hidePricing, hideImage, detailSlot, fallback, disableStyles, className, internalClassName, layout, onClick, controller, hideVariantSelections, hideAddToCartButton, onAddToCartClick, addToCartButtonText, addToCartButtonSuccessText, addToCartButtonSuccessTimeout, hideRating, trackingRef, treePath, customComponent, } = props;
+    if (customComponent) {
+        const ComponentOverride = useComponent(snap?.templates?.library.import.component.result || {}, customComponent);
+        if (ComponentOverride) {
+            return _jsx(ComponentOverride, { ...props });
+        }
+    }
     const core = result?.display?.mappings.core || result?.mappings?.core;
     const [addedToCart, setAddedToCart] = useState(false);
     const subProps = {

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

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAY,UAAU,EAA0B,MAAM,cAAc,CAAC;AAC5E,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,IAAI,EAAE,cAAc,EAAW,MAAM,wBAAwB,CAAC;AAmCvE,eAAO,MAAM,WAAW,gBAAyB,gBAAgB;;CA+L/D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,UAAU,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,8BAA8B,GACjC,cAAc,CAAC,gBAAgB,CAAC,CAAC;AAElC,MAAM,MAAM,8BAA8B,GAAG;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC7D,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,OAAO,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC;AAQ5C,MAAM,WAAW,eAAe;IAC/B,eAAe,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,kBAAkB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CACjC"}
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAY,UAAU,EAA0B,MAAM,cAAc,CAAC;AAC5E,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEzD,OAAO,EAAE,IAAI,EAAE,cAAc,EAAW,MAAM,wBAAwB,CAAC;AAqCvE,eAAO,MAAM,WAAW,gBAAyB,gBAAgB;;CAwM/D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG;IAC9B,IAAI,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,UAAU,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,8BAA8B,GACjC,cAAc,CAAC,gBAAgB,CAAC,CAAC;AAElC,MAAM,MAAM,8BAA8B,GAAG;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC7D,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC/D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,OAAO,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,KAAK,CAAC;AAQ5C,MAAM,WAAW,eAAe;IAC/B,eAAe,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IACxC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,iBAAiB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,kBAAkB,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;CACjC"}