@athoscommerce/snap-preact 1.6.0 → 1.7.0

package/dist/esm/components/src/components/Organisms/MobileSidebar/MobileSidebar.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, useSnap } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath } from '../../../providers';
 import { Slideout } from '../../Molecules/Slideout';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Button } from '../../Atoms/Button';
-import { useA11y, useComponent, useLang } from '../../../hooks';
+import { useA11y, useLang, useCustomComponentOverride } from '../../../hooks';
 import { useRef } from 'preact/hooks';
 import deepmerge from 'deepmerge';
 import { Layout } from '../Layout';
@@ -44,7 +44,6 @@ const defaultStyles = ({}) => {
 };
 export const MobileSidebar = observer((properties) => {
     const globalTheme = useTheme();
-    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         openButtonText: 'Filters',
@@ -57,12 +56,10 @@ export const MobileSidebar = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('mobileSidebar', globalTheme, defaultProps, properties);
-    const { controller, layout, hideHeader, hideApplyButton, clearButtonIcon, hideCloseButton, closeButtonText, openButtonText, clearButtonText, applyButtonIcon, applyButtonText, closeButtonIcon, openButtonIcon, titleText, hideCloseButtonText, hideOpenButtonText, openButtonContent, hideClearButtonText, hideApplyButtonText, hideTitleText, displayAt, hideClearButton, disableStyles, className, internalClassName, treePath, customComponent, } = props;
-    if (customComponent) {
-        const ComponentOverride = useComponent(snap?.templates?.library.import.component.mobileSidebar || {}, customComponent);
-        if (ComponentOverride) {
-            return _jsx(ComponentOverride, { ...props });
-        }
+    const { controller, layout, hideHeader, hideApplyButton, clearButtonIcon, hideCloseButton, closeButtonText, openButtonText, clearButtonText, applyButtonIcon, applyButtonText, closeButtonIcon, openButtonIcon, titleText, hideCloseButtonText, hideOpenButtonText, openButtonContent, hideClearButtonText, hideApplyButtonText, hideTitleText, displayAt, hideClearButton, disableStyles, className, internalClassName, treePath, } = props;
+    const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('mobileSidebar', props);
+    if (!shouldRenderDefault) {
+        return overrideElement;
     }
     let hideFooter = props.hideFooter;
     if (hideApplyButton && hideClearButton) {

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

@@ -1,9 +1,10 @@
+import { h } from 'preact';
 import { ComponentProps } from '../../../types';
 import type { RecommendationControllerConfig } from '@athoscommerce/snap-controller';
 import type { SearchController } from '@athoscommerce/snap-controller';
 import type { Lang } from '../../../hooks';
 import type { LibraryImports } from '../../../../../src/Templates/Stores/LibraryStore';
-export declare const NoResults: ((properties: NoResultsProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+export declare const NoResults: ((properties: NoResultsProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
     displayName: string;
 };
 type NoResultsContact = {

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

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

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

@@ -5,10 +5,9 @@ import classnames from 'classnames';
 import { useTheme, useSnap, useTreePath } from '../../../providers';
 import { cloneWithProps, mergeProps, mergeStyles } from '../../../utilities';
 import { filters } from '@athoscommerce/snap-toolbox';
-import { useComponent } from '../../../hooks/useComponent';
 import { useCreateController } from '../../../hooks/useCreateController';
 import deepmerge from 'deepmerge';
-import { useLang } from '../../../hooks';
+import { useLang, useComponent, useCustomComponentOverride } from '../../../hooks';
 const defaultStyles = ({}) => {
     return css({});
 };
@@ -31,41 +30,38 @@ export const NoResults = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('noResults', globalTheme, defaultProps, properties);
-    const { contentSlot, suggestionsTitleText, hideSuggestionsTitleText, hideContactsTitleText, suggestionsList, hideContact, contactsTitleText, hideSuggestions, contactsList, controller, templates, className, internalClassName, treePath, customComponent, } = props;
-    if (customComponent) {
-        const ComponentOverride = useComponent(snap?.templates?.library.import.component.noResults || {}, customComponent);
-        if (ComponentOverride) {
-            return _jsx(ComponentOverride, { ...props });
-        }
+    const { contentSlot, suggestionsTitleText, hideSuggestionsTitleText, hideContactsTitleText, suggestionsList, hideContact, contactsTitleText, hideSuggestions, contactsList, controller, templates, className, internalClassName, treePath, } = props;
+    const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('noResults', props);
+    if (!shouldRenderDefault) {
+        return overrideElement;
     }
     const styling = mergeStyles(props, defaultStyles);
     const suggestionsExist = suggestionsList && Array.isArray(suggestionsList) && suggestionsList.length !== 0;
     const contactsExist = contactsList && Array.isArray(contactsList) && contactsList.length !== 0;
-    let recommendationTemplateComponent;
-    let recommendationTemplateResultComponent;
+    const recommendationTemplatesEnabled = Boolean(templates?.recommendation?.enabled);
+    const recommendationComponentName = recommendationTemplatesEnabled ? templates?.recommendation?.component || 'Recommendation' : undefined;
+    const recommendationResultComponentName = recommendationTemplatesEnabled
+        ? String(templates?.recommendation?.resultComponent || 'Result')
+        : undefined;
+    const recommendationTemplateComponentMap = snap?.templates?.library.import.component.recommendation.default || {};
+    const recommendationTemplateResultComponentMap = snap?.templates?.library.import.component.result || {};
+    const { ComponentOverride: namedRecommendationTemplateComponent, shouldWaitForNamedOverride: shouldWaitForNamedRecommendationTemplateComponent } = useComponent(recommendationTemplateComponentMap, recommendationComponentName);
+    const { ComponentOverride: namedRecommendationTemplateResultComponent, shouldWaitForNamedOverride: shouldWaitForNamedRecommendationTemplateResultComponent, } = useComponent(recommendationTemplateResultComponentMap, recommendationResultComponentName);
+    const recommendationTemplateComponent = namedRecommendationTemplateComponent;
+    const recommendationTemplateResultComponent = namedRecommendationTemplateResultComponent;
     let recsController;
-    if (templates?.recommendation?.enabled) {
-        const componentName = templates?.recommendation?.component || 'Recommendation';
-        const snap = useSnap();
+    if (recommendationTemplatesEnabled) {
         if (snap?.templates) {
-            const defaultResultComponentFromTheme = 'Result';
-            const resultComponentName = (templates?.recommendation?.resultComponent || defaultResultComponentFromTheme);
             const mergedConfig = Object.assign({
                 id: '',
                 tag: 'no-results',
                 branch: 'production',
-            }, templates.recommendation.config);
+            }, templates?.recommendation?.config);
             mergedConfig.id = mergedConfig.id || `search-${mergedConfig.tag}`;
             recsController = useCreateController(snap, 'recommendation', mergedConfig);
             if (!recsController?.store?.loaded && !recsController?.store?.loading && recsController?.store.error?.type !== 'error') {
                 recsController?.search();
             }
-            if (resultComponentName && snap?.templates?.library.import.component.result) {
-                recommendationTemplateResultComponent = useComponent(snap?.templates?.library.import.component.result, resultComponentName);
-            }
-            if (componentName && snap?.templates?.library.import.component.recommendation.default) {
-                recommendationTemplateComponent = useComponent(snap?.templates?.library.import.component.recommendation.default, componentName);
-            }
         }
     }
     const RecommendationTemplateComponent = recommendationTemplateComponent;
@@ -97,5 +93,8 @@ export const NoResults = observer((properties) => {
         controller: controller,
     });
     return (_jsxs("div", { className: classnames('ss__no-results', className, internalClassName), ...styling, children: [contentSlot &&
-                (typeof contentSlot == 'string' ? (_jsx("div", { className: "ss__no-results__slot", dangerouslySetInnerHTML: { __html: contentSlot } })) : (_jsx("div", { className: "ss__no-results__slot", children: cloneWithProps(contentSlot, { controller, treePath }) }))), !hideSuggestions && (suggestionsTitleText || suggestionsExist) && (_jsxs("div", { className: "ss__no-results__suggestions", children: [suggestionsTitleText && !hideSuggestionsTitleText && (_jsx("h3", { className: "ss__no-results__suggestions__title", ...mergedLang.suggestionsTitleText?.all })), suggestionsExist && _jsx("ul", { className: "ss__no-results__suggestions__list", ...mergedLang.suggestionsList?.all })] })), !hideContact && (contactsTitleText || contactsExist) && (_jsxs("div", { className: "ss__no-results__contact", children: [contactsTitleText && !hideContactsTitleText && _jsx("h3", { className: "ss__no-results__contact__title", ...mergedLang.contactsTitleText?.all }), contactsExist && _jsx("div", { ...mergedLang.contactsList?.all })] })), RecommendationTemplateComponent && recsController?.store?.loaded ? (_jsx("div", { className: "ss__no-results__recommendations", children: _jsx(RecommendationTemplateComponent, { controller: recsController, title: recsController.store?.profile?.display?.templateParameters?.title, resultComponent: RecommendationTemplateResultComponent, name: 'noResultsRecommendations' }) })) : null] }));
+                (typeof contentSlot == 'string' ? (_jsx("div", { className: "ss__no-results__slot", dangerouslySetInnerHTML: { __html: contentSlot } })) : (_jsx("div", { className: "ss__no-results__slot", children: cloneWithProps(contentSlot, { controller, treePath }) }))), !hideSuggestions && (suggestionsTitleText || suggestionsExist) && (_jsxs("div", { className: "ss__no-results__suggestions", children: [suggestionsTitleText && !hideSuggestionsTitleText && (_jsx("h3", { className: "ss__no-results__suggestions__title", ...mergedLang.suggestionsTitleText?.all })), suggestionsExist && _jsx("ul", { className: "ss__no-results__suggestions__list", ...mergedLang.suggestionsList?.all })] })), !hideContact && (contactsTitleText || contactsExist) && (_jsxs("div", { className: "ss__no-results__contact", children: [contactsTitleText && !hideContactsTitleText && _jsx("h3", { className: "ss__no-results__contact__title", ...mergedLang.contactsTitleText?.all }), contactsExist && _jsx("div", { ...mergedLang.contactsList?.all })] })), RecommendationTemplateComponent &&
+                recsController?.store?.loaded &&
+                !shouldWaitForNamedRecommendationTemplateComponent &&
+                !shouldWaitForNamedRecommendationTemplateResultComponent ? (_jsx("div", { className: "ss__no-results__recommendations", children: _jsx(RecommendationTemplateComponent, { controller: recsController, title: recsController.store?.profile?.display?.templateParameters?.title, resultComponent: RecommendationTemplateResultComponent, name: 'noResultsRecommendations' }) })) : null] }));
 });

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

@@ -1,16 +1,18 @@
+import { h } from 'preact';
 import type { SearchController, AutocompleteController, RecommendationController } from '@athoscommerce/snap-controller';
 import type { SearchResultStore } from '@athoscommerce/snap-store-mobx';
 import { ComponentProps, ResultsLayout, BreakpointsProps, JSXComponent } from '../../../types';
-export declare const Results: ((properties: ResultsProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+export declare const Results: ((properties: ResultsProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
     displayName: string;
 };
 export type ResultsProps = {
     breakpoints?: BreakpointsProps;
     controller?: SearchController | AutocompleteController | RecommendationController;
-    resultComponent?: JSXComponent | JSX.Element;
+    resultComponent?: JSXComponent | JSX.Element | string;
     results?: SearchResultStore;
 } & ResultsTemplatesLegalProps & ComponentProps<ResultsProps>;
 export type ResultsTemplatesLegalProps = {
+    excludeBanners?: boolean;
     columns?: number;
     rows?: number;
     gapSize?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,gCAAgC,CAAC;AAIzF,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AA4C5G,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAyHvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;IAClF,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,OAAO,aAAa,GAAG,aAAa,CAAC;CACpD,CAAC"}
+{"version":3,"file":"Results.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Results/Results.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAO3B,OAAO,KAAK,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AACzH,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,gCAAgC,CAAC;AAIzF,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AA4C5G,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAsIvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,UAAU,CAAC,EAAE,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;IAClF,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IACtD,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC5B,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,OAAO,aAAa,GAAG,aAAa,CAAC;CACpD,CAAC"}

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

@@ -1,5 +1,5 @@
-import { createElement as _createElement } from "@emotion/react";
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { createElement as _createElement } from "@emotion/react";
 import { observer } from 'mobx-react-lite';
 import { css } from '@emotion/react';
 import classnames from 'classnames';
@@ -12,7 +12,7 @@ import { cloneWithProps, defined, mergeProps, mergeStyles } from '../../../utili
 import { useTheme, CacheProvider, withTracking, useSnap, useTreePath } from '../../../providers';
 import { useDisplaySettings } from '../../../hooks/useDisplaySettings';
 import { ResultTracker } from '../../Trackers/ResultTracker';
-import { useComponent } from '../../../hooks';
+import { useComponent, useCustomComponentOverride } from '../../../hooks';
 const defaultStyles = ({ gapSize, columns }) => {
     return css({
         display: 'flex',
@@ -81,13 +81,17 @@ export const Results = observer((properties) => {
             theme,
         };
     }
-    const { disableStyles, className, internalClassName, layout, theme, controller, treePath, customComponent, resultComponent } = props;
-    if (customComponent) {
-        const ComponentOverride = useComponent(snap?.templates?.library.import.component.results || {}, customComponent);
-        if (ComponentOverride) {
-            return _jsx(ComponentOverride, { ...props });
-        }
+    const { disableStyles, className, internalClassName, layout, theme, excludeBanners, controller, treePath } = props;
+    const resultComponent = props.resultComponent;
+    const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('results', props);
+    if (!shouldRenderDefault) {
+        return overrideElement;
     }
+    const isNamedResultComponent = typeof resultComponent === 'string';
+    const resultComponentName = isNamedResultComponent ? resultComponent : '';
+    const resultComponentMap = snap?.templates?.library.import.component.result || {};
+    const { ComponentOverride: resultComponentOverride, shouldWaitForNamedOverride: shouldWaitForNamedResultComponent } = useComponent(resultComponentMap, isNamedResultComponent ? resultComponentName : undefined);
+    const resolvedResultComponent = isNamedResultComponent ? resultComponentOverride : resultComponent;
     const subProps = {
         result: {
             // default props
@@ -113,9 +117,9 @@ export const Results = observer((properties) => {
             treePath,
         },
     };
-    let results = props.results;
+    let results = excludeBanners ? props.results?.filter((r) => r.type !== ContentType.BANNER) : props.results;
     if (props?.columns && props?.rows && props.columns > 0 && props.rows > 0) {
-        results = props.results?.slice(0, props.columns * props.rows);
+        results = results?.slice(0, props.columns * props.rows);
     }
     const styling = mergeStyles({ ...props, columns: layout == ResultsLayout.list ? 1 : props.columns }, defaultStyles);
     return results?.length ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__results', `ss__results-${props.layout}`, className, internalClassName), children: results.map((result) => (() => {
@@ -123,8 +127,11 @@ export const Results = observer((properties) => {
                     case ContentType.BANNER:
                         return _createElement(InlineBanner, { ...subProps.inlineBanner, key: result.id, banner: result, layout: props.layout });
                     default:
-                        if (resultComponent && controller) {
-                            return (_jsx(ResultTracker, { result: result, controller: controller, children: cloneWithProps(resultComponent, {
+                        if (shouldWaitForNamedResultComponent) {
+                            return null;
+                        }
+                        if (resolvedResultComponent && controller) {
+                            return (_jsx(ResultTracker, { result: result, controller: controller, children: cloneWithProps(resolvedResultComponent, {
                                     key: result.id,
                                     controller,
                                     result: result,

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

@@ -1,7 +1,8 @@
+import { h } from 'preact';
 import { ComponentProps } from '../../../types';
 import { SearchController } from '@athoscommerce/snap-controller';
 import { Lang } from '../../../hooks';
-export declare const Sidebar: ((properties: SidebarProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+export declare const Sidebar: ((properties: SidebarProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
     displayName: string;
 };
 export type SideBarModuleNames = 'filterSummary' | 'sortBy' | 'perPage' | 'facets' | 'banner.left' | 'paginationInfo' | 'layoutSelector' | '_';

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

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

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

@@ -2,11 +2,11 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/reac
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
-import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
+import { useTheme, CacheProvider, useTreePath } from '../../../providers';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Layout } from '../Layout';
 import deepmerge from 'deepmerge';
-import { useLang, useComponent } from '../../../hooks';
+import { useLang, useCustomComponentOverride } from '../../../hooks';
 const defaultStyles = ({ stickyOffset }) => {
     return css({
         // need sticky styles using new sticky prop
@@ -21,7 +21,6 @@ const defaultStyles = ({ stickyOffset }) => {
 };
 export const Sidebar = observer((properties) => {
     const globalTheme = useTheme();
-    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         titleText: 'Filters',
@@ -29,12 +28,10 @@ export const Sidebar = observer((properties) => {
         layout: [['filterSummary'], ['sortBy', 'perPage'], ['facets'], ['banner.left']],
     };
     const props = mergeProps('sidebar', globalTheme, defaultProps, properties);
-    const { controller, layout, hideTitleText, titleText, sticky, disableStyles, className, internalClassName, treePath, customComponent } = props;
-    if (customComponent) {
-        const ComponentOverride = useComponent(snap?.templates?.library.import.component.sidebar || {}, customComponent);
-        if (ComponentOverride) {
-            return _jsx(ComponentOverride, { ...props });
-        }
+    const { controller, layout, hideTitleText, titleText, sticky, disableStyles, className, internalClassName, treePath } = props;
+    const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('sidebar', props);
+    if (!shouldRenderDefault) {
+        return overrideElement;
     }
     const styling = mergeStyles(props, defaultStyles);
     //initialize lang

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

@@ -1,6 +1,7 @@
+import { h } from 'preact';
 import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps } from '../../../types';
-export declare const TermsList: ((properties: TermsListProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+export declare const TermsList: ((properties: TermsListProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
     displayName: string;
 };
 export type TermsListModuleNames = 'Trending' | 'Suggestions' | 'History' | '_';

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

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

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

@@ -2,8 +2,8 @@ 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, useSnap } from '../../../providers';
-import { useComponent } from '../../../hooks';
+import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useCustomComponentOverride } from '../../../hooks';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Terms } from '../../Molecules/Terms/Terms';
 const defaultStyles = ({}) => {
@@ -29,7 +29,6 @@ const defaultStyles = ({}) => {
 };
 export const TermsList = observer((properties) => {
     const globalTheme = useTheme();
-    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         layout: [['Suggestions'], ['Trending'], ['History']],
@@ -39,12 +38,10 @@ export const TermsList = observer((properties) => {
         treePath: globalTreePath,
     };
     const props = mergeProps('termsList', globalTheme, defaultProps, properties);
-    const { layout, historyTitle, verticalOptions, trendingTitle, suggestionTitle, retainHistory, retainTrending, treePath, disableStyles, className, internalClassName, controller, customComponent, } = props;
-    if (customComponent) {
-        const ComponentOverride = useComponent(snap?.templates?.library.import.component.termsList || {}, customComponent);
-        if (ComponentOverride) {
-            return _jsx(ComponentOverride, { ...props });
-        }
+    const { layout, historyTitle, verticalOptions, trendingTitle, suggestionTitle, retainHistory, retainTrending, treePath, disableStyles, className, internalClassName, controller, } = props;
+    const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('termsList', props);
+    if (!shouldRenderDefault) {
+        return overrideElement;
     }
     const subProps = {
         terms: {

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

@@ -1,7 +1,8 @@
+import { h } from 'preact';
 import { ComponentProps } from '../../../types';
 import { SearchController } from '@athoscommerce/snap-controller';
 import { ButtonProps } from '../../Atoms/Button';
-export declare const Toolbar: ((properties: ToolbarProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+export declare const Toolbar: ((properties: ToolbarProps) => import("@emotion/react/jsx-runtime").JSX.Element | h.JSX.Element | null) & {
     displayName: string;
 };
 export type ToolbarProps = {

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

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAMjD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CAgDvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,CAAC,EAAE,YAAY,CAAC;CACpB,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,EAAE,CAAC,EAAE,CAAC;IACzC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,WAAW,GACpB,cAAc,GACd,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,GAAG,GACH,uBAAuB,GACvB,eAAe,GACf,eAAe,GACf,eAAe,GACf,kBAAkB,CAAC;AAEtB,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC"}
+{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,QAAQ,CAAC;AAO3B,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gCAAgC,CAAC;AAElE,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAMjD,eAAO,MAAM,OAAO,gBAAyB,YAAY;;CA8CvD,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG;IAC1B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,CAAC,EAAE,YAAY,CAAC;CACpB,GAAG,0BAA0B,GAC7B,cAAc,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,MAAM,0BAA0B,GAAG;IACxC,MAAM,CAAC,EAAE,CAAC,WAAW,GAAG,WAAW,EAAE,CAAC,EAAE,CAAC;IACzC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,WAAW,GACpB,cAAc,GACd,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,GAAG,GACH,uBAAuB,GACvB,eAAe,GACf,eAAe,GACf,eAAe,GACf,kBAAkB,CAAC;AAEtB,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC"}

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

@@ -2,8 +2,8 @@ import { jsx as _jsx, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
 import { css } from '@emotion/react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
-import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
-import { useComponent } from '../../../hooks';
+import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useCustomComponentOverride } from '../../../hooks';
 import { defined, mergeProps, mergeStyles } from '../../../utilities';
 import { Layout } from '../Layout';
 const defaultStyles = ({}) => {
@@ -11,19 +11,16 @@ const defaultStyles = ({}) => {
 };
 export const Toolbar = observer((properties) => {
     const globalTheme = useTheme();
-    const snap = useSnap();
     const globalTreePath = useTreePath();
     const defaultProps = {
         treePath: globalTreePath,
         layout: ['mobileSidebar', 'filterSummary', 'paginationInfo', 'sortBy', 'perPage', 'pagination'],
     };
     const props = mergeProps('toolbar', globalTheme, defaultProps, properties);
-    const { controller, toggleSideBarButton, disableStyles, className, internalClassName, treePath, layout, customComponent } = props;
-    if (customComponent) {
-        const ComponentOverride = useComponent(snap?.templates?.library.import.component.toolbar || {}, customComponent);
-        if (ComponentOverride) {
-            return _jsx(ComponentOverride, { ...props });
-        }
+    const { controller, toggleSideBarButton, disableStyles, className, internalClassName, treePath, layout } = props;
+    const { overrideElement, shouldRenderDefault } = useCustomComponentOverride('toolbar', props);
+    if (!shouldRenderDefault) {
+        return overrideElement;
     }
     const styling = mergeStyles(props, defaultStyles);
     const subProps = {

package/dist/esm/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.d.ts

@@ -1,6 +1,6 @@
 import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps, JSXComponent } from '../../../types';
-import { AutocompleteLayoutProps } from '../../Organisms/AutocompleteLayout';
+import { AutocompleteLayoutProps, AutocompleteLayoutTemplatesLegalProps } from '../../Organisms/AutocompleteLayout';
 export declare const AutocompleteFixed: ((properties: AutocompleteFixedProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
     displayName: string;
 };
@@ -13,12 +13,13 @@ interface inputBounds {
 export type AutocompleteFixedProps = {
     controller: AutocompleteController;
     resultComponent?: JSXComponent | JSX.Element;
-} & AutocompleteFixedTemplatesLegalProps & Omit<ComponentProps, 'customComponent'>;
+} & Omit<AutocompleteFixedTemplatesLegalProps, 'resultComponent'> & AutocompleteLayoutProps & Omit<ComponentProps, 'customComponent'>;
 export type AutocompleteFixedTemplatesLegalProps = {
+    resultComponent?: string;
     buttonSelector?: string | Element;
     overlayColor?: string;
     renderInput?: boolean;
     offset?: Partial<Omit<inputBounds, 'height'>>;
-} & AutocompleteLayoutProps;
+} & AutocompleteLayoutTemplatesLegalProps;
 export {};
 //# sourceMappingURL=AutocompleteFixed.d.ts.map

package/dist/esm/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteFixed.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AA+CjG,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CAmN3E,CAAC;AAEH,UAAU,WAAW;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CACf;AAQD,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,oCAAoC,GACvC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;CAC9C,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"AutocompleteFixed.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AA+CxI,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CAmN3E,CAAC;AAEH,UAAU,WAAW;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CACf;AAQD,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,IAAI,CAAC,oCAAoC,EAAE,iBAAiB,CAAC,GAChE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;CAC9C,GAAG,qCAAqC,CAAC"}

package/dist/esm/components/src/components/Templates/AutocompleteModal/AutocompleteModal.d.ts

@@ -1,17 +1,18 @@
 import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps, JSXComponent } from '../../../types';
-import { AutocompleteLayoutProps } from '../../Organisms/AutocompleteLayout';
+import { AutocompleteLayoutProps, AutocompleteLayoutTemplatesLegalProps } from '../../Organisms/AutocompleteLayout';
 export declare const AutocompleteModal: ((properties: AutocompleteModalProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
     displayName: string;
 };
 export type AutocompleteModalProps = {
     controller: AutocompleteController;
     resultComponent?: JSXComponent | JSX.Element;
-} & AutocompleteModalTemplatesLegalProps & Omit<ComponentProps, 'customComponent'>;
+} & Omit<AutocompleteModalTemplatesLegalProps, 'resultComponent'> & AutocompleteLayoutProps & Omit<ComponentProps, 'customComponent'>;
 export type AutocompleteModalTemplatesLegalProps = {
+    resultComponent?: string;
     buttonSelector?: string | Element;
     overlayColor?: string;
     renderInput?: boolean;
     height?: string;
-} & AutocompleteLayoutProps;
+} & AutocompleteLayoutTemplatesLegalProps;
 //# sourceMappingURL=AutocompleteModal.d.ts.map

package/dist/esm/components/src/components/Templates/AutocompleteModal/AutocompleteModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteModal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteModal/AutocompleteModal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AA4DjG,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CA8J3E,CAAC;AAQH,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,oCAAoC,GACvC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"AutocompleteModal.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteModal/AutocompleteModal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AA4DxI,eAAO,MAAM,iBAAiB,gBAAyB,sBAAsB;;CA8J3E,CAAC;AAQH,MAAM,MAAM,sBAAsB,GAAG;IACpC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,IAAI,CAAC,oCAAoC,EAAE,iBAAiB,CAAC,GAChE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,oCAAoC,GAAG;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,qCAAqC,CAAC"}

package/dist/esm/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.d.ts

@@ -1,6 +1,6 @@
 import type { AutocompleteController } from '@athoscommerce/snap-controller';
 import { ComponentProps, JSXComponent } from '../../../types';
-import { AutocompleteLayoutProps } from '../../Organisms/AutocompleteLayout';
+import { AutocompleteLayoutProps, AutocompleteLayoutTemplatesLegalProps } from '../../Organisms/AutocompleteLayout';
 import { SlideDirectionType } from '../../Molecules/Slideout';
 export declare const AutocompleteSlideout: ((properties: AutocompleteSlideoutProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
     displayName: string;
@@ -8,11 +8,12 @@ export declare const AutocompleteSlideout: ((properties: AutocompleteSlideoutPro
 export type AutocompleteSlideoutProps = {
     controller: AutocompleteController;
     resultComponent?: JSXComponent | JSX.Element;
-} & AutocompleteSlideoutTemplatesLegalProps & Omit<ComponentProps, 'customComponent'>;
+} & Omit<AutocompleteSlideoutTemplatesLegalProps, 'resultComponent'> & AutocompleteLayoutProps & Omit<ComponentProps, 'customComponent'>;
 export type AutocompleteSlideoutTemplatesLegalProps = {
+    resultComponent?: string;
     overlayColor?: string;
     slideDirection?: SlideDirectionType;
     buttonSelector?: string | Element;
     renderInput?: boolean;
-} & AutocompleteLayoutProps;
+} & AutocompleteLayoutTemplatesLegalProps;
 //# sourceMappingURL=AutocompleteSlideout.d.ts.map

package/dist/esm/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteSlideout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AACjG,OAAO,EAAE,kBAAkB,EAA2B,MAAM,0BAA0B,CAAC;AAsBvF,eAAO,MAAM,oBAAoB,gBAAyB,yBAAyB;;CAsJjF,CAAC;AAOH,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,uCAAuC,GAC1C,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,uCAAuC,GAAG;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,uBAAuB,CAAC"}
+{"version":3,"file":"AutocompleteSlideout.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AAG7E,OAAO,EAAE,cAAc,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAsB,uBAAuB,EAAE,qCAAqC,EAAE,MAAM,oCAAoC,CAAC;AACxI,OAAO,EAAE,kBAAkB,EAA2B,MAAM,0BAA0B,CAAC;AAsBvF,eAAO,MAAM,oBAAoB,gBAAyB,yBAAyB;;CAsJjF,CAAC;AAOH,MAAM,MAAM,yBAAyB,GAAG;IACvC,UAAU,EAAE,sBAAsB,CAAC;IACnC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;CAC7C,GAAG,IAAI,CAAC,uCAAuC,EAAE,iBAAiB,CAAC,GACnE,uBAAuB,GACvB,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,uCAAuC,GAAG;IACrD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,qCAAqC,CAAC"}

package/dist/esm/components/src/components/Templates/Recommendation/Recommendation.d.ts

@@ -12,8 +12,9 @@ export type RecommendationProps = {
     resultComponent?: JSXComponent | JSX.Element;
     lang?: Partial<RecommendationLang>;
     breakpoints?: BreakpointsProps;
-} & RecommendationTemplatesLegalProps & Omit<ComponentProps, 'customComponent'>;
+} & Omit<RecommendationTemplatesLegalProps, 'resultComponent'> & Omit<ComponentProps, 'customComponent'>;
 export type RecommendationTemplatesLegalProps = {
+    resultComponent?: string;
     title?: JSX.Element | string;
     description?: string;
     hideTitle?: boolean;

package/dist/esm/components/src/components/Templates/Recommendation/Recommendation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Recommendation.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/Recommendation/Recommendation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAO9C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAO9D,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG7F,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAY/C,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CAiMrE,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG;IACjC,UAAU,EAAE,wBAAwB,CAAC;IACrC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACnC,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,iCAAiC,GACpC,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,iCAAiC,GAAG;IAC/C,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,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,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,GAAG,eAAe,CAAC,GACvD,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,WAAW,kBAAkB;IAClC,SAAS,CAAC,EAAE,IAAI,CAAC;QAChB,UAAU,EAAE,wBAAwB,CAAC;KACrC,CAAC,CAAC;CACH"}
+{"version":3,"file":"Recommendation.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/Recommendation/Recommendation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAK,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAO9C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAO9D,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG7F,OAAO,EAAE,IAAI,EAAW,MAAM,gBAAgB,CAAC;AAa/C,eAAO,MAAM,cAAc,gBAAyB,mBAAmB;;CA8MrE,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG;IACjC,UAAU,EAAE,wBAAwB,CAAC;IACrC,eAAe,CAAC,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACnC,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAC/B,GAAG,IAAI,CAAC,iCAAiC,EAAE,iBAAiB,CAAC,GAC7D,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,MAAM,iCAAiC,GAAG;IAC/C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,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,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,GAAG,IAAI,CAAC,aAAa,EAAE,aAAa,GAAG,eAAe,CAAC,GACvD,IAAI,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AAEzC,MAAM,WAAW,kBAAkB;IAClC,SAAS,CAAC,EAAE,IAAI,CAAC;QAChB,UAAU,EAAE,wBAAwB,CAAC;KACrC,CAAC,CAAC;CACH"}

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

@@ -7,8 +7,8 @@ import deepmerge from 'deepmerge';
 import { Carousel, defaultCarouselBreakpoints, defaultVerticalCarouselBreakpoints } from '../../Molecules/Carousel';
 import { Result } from '../../Molecules/Result';
 import { cloneWithProps, defined, mergeProps, mergeStyles } from '../../../utilities';
-import { useIntersection } from '../../../hooks';
-import { useTheme, CacheProvider, useTreePath } from '../../../providers';
+import { useIntersection, useComponent } from '../../../hooks';
+import { useTheme, CacheProvider, useTreePath, useSnap } from '../../../providers';
 import { useDisplaySettings } from '../../../hooks/useDisplaySettings';
 import { RecommendationProfileTracker } from '../../Trackers/Recommendation/ProfileTracker';
 import { useLang } from '../../../hooks';
@@ -53,7 +53,14 @@ export const Recommendation = observer((properties) => {
             };
         }
     }
-    const { title, description, controller, children, loop, results, pagination, nextButton, prevButton, hideButtons, resultComponent, disableStyles, className, internalClassName, style: _, styleScript: __, themeStyleScript: ___, lazyRender, vertical, hideTitle, treePath, ...additionalProps } = props;
+    const { title, description, controller, children, loop, results, pagination, nextButton, prevButton, hideButtons, disableStyles, className, internalClassName, style: _, styleScript: __, themeStyleScript: ___, lazyRender, vertical, hideTitle, treePath, ...additionalProps } = props;
+    const resultComponent = props.resultComponent;
+    const snap = useSnap();
+    const isNamedResultComponent = typeof resultComponent === 'string';
+    const resultComponentName = isNamedResultComponent ? resultComponent : '';
+    const resultComponentMap = snap?.templates?.library.import.component.result || {};
+    const { ComponentOverride: resultComponentOverride, shouldWaitForNamedOverride: shouldWaitForNamedResultComponent } = useComponent(resultComponentMap, isNamedResultComponent ? resultComponentName : undefined);
+    const resolvedResultComponent = isNamedResultComponent ? resultComponentOverride : resultComponent;
     const mergedlazyRender = {
         enabled: true,
         offset: '10%',
@@ -111,14 +118,17 @@ export const Recommendation = observer((properties) => {
     return (Array.isArray(children) && children.length) || resultsToRender?.length ? (_jsx(CacheProvider, { children: _jsx("div", { ...styling, className: classnames('ss__recommendation', className, internalClassName), ref: recsRef, children: isVisible ? (_jsxs(RecommendationProfileTracker, { controller: controller, children: [title && !hideTitle && (_jsx("h3", { className: "ss__recommendation__title", ...mergedLang.titleText?.all, children: title })), description && _jsx("p", { className: "ss__recommendation__description", children: description }), _jsx(Carousel, { prevButton: prevButton, nextButton: nextButton, hideButtons: hideButtons, loop: loop, pagination: pagination, ...subProps.carousel, ...additionalProps, children: Array.isArray(children) && children.length
                             ? children.map((child, idx) => (_jsx(ResultTracker, { controller: controller, result: resultsToRender[idx], children: child })))
                             : resultsToRender.map((result) => (_jsx(ResultTracker, { controller: controller, result: result, children: (() => {
-                                    if (resultComponent && controller) {
-                                        return cloneWithProps(resultComponent, {
+                                    if (resolvedResultComponent && controller) {
+                                        return cloneWithProps(resolvedResultComponent, {
                                             controller,
                                             result,
                                             treePath: subProps.result.treePath,
                                         });
                                     }
                                     else {
+                                        if (shouldWaitForNamedResultComponent) {
+                                            return null;
+                                        }
                                         return _jsx(Result, { ...subProps.result, controller: controller, result: result }, result.id);
                                     }
                                 })() }))) })] })) : (_jsx(RecommendationProfileTracker, { controller: controller, children: Array.isArray(children) && children.length

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

@@ -21,8 +21,9 @@ export type RecommendationBundleProps = {
     alias?: string;
     lang?: Partial<RecommendationBundleLang>;
     results?: Product[];
-} & RecommendationBundleTemplatesLegalProps & Omit<ComponentProps, 'customComponent'>;
+} & Omit<RecommendationBundleTemplatesLegalProps, 'resultComponent'> & Omit<ComponentProps, 'customComponent'>;
 export type RecommendationBundleTemplatesLegalProps = {
+    resultComponent?: string;
     limit?: number;
     onAddToCart?: (e: MouseEvent, items: Product[]) => void;
     title?: JSX.Element | string;