@athoscommerce/snap-preact 1.9.1 → 1.10.0

package/dist/cjs/components/src/components/Templates/RecommendationBundleEasyAdd/RecommendationBundleEasyAdd.js

@@ -1,61 +1,52 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RecommendationBundleEasyAdd = void 0;
-var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-var react_1 = require("@emotion/react");
-var mobx_react_lite_1 = require("mobx-react-lite");
-var utilities_1 = require("../../../utilities");
-var RecommendationBundle_1 = require("../RecommendationBundle");
-var defaultStyles = function () {
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("@emotion/react");
+const mobx_react_lite_1 = require("mobx-react-lite");
+const utilities_1 = require("../../../utilities");
+const RecommendationBundle_1 = require("../RecommendationBundle");
+const defaultStyles = () => {
     return (0, react_1.css)({
         '.ss__recommendation-bundle-easy-add__wrapper__cta': {
             textAlign: 'center',
         },
     });
 };
-var alias = 'recommendationBundleEasyAdd';
-exports.RecommendationBundleEasyAdd = (0, mobx_react_lite_1.observer)(function (properties) {
-    var _a, _b, _c, _d;
-    var globalTheme = (0, react_1.useTheme)();
+const alias = 'recommendationBundleEasyAdd';
+exports.RecommendationBundleEasyAdd = (0, mobx_react_lite_1.observer)((properties) => {
+    const globalTheme = (0, react_1.useTheme)();
     //mergeprops only uses names that are passed via properties, so this cannot be put in the defaultProps
-    var _properties = __assign({ name: (_d = (_c = (_b = (_a = properties.controller) === null || _a === void 0 ? void 0 : _a.store) === null || _b === void 0 ? void 0 : _b.profile) === null || _c === void 0 ? void 0 : _c.tag) === null || _d === void 0 ? void 0 : _d.toLowerCase() }, properties);
-    var treePath = _properties.treePath, disableStyles = _properties.disableStyles, controller = _properties.controller, _ = _properties.style, __ = _properties.styleScript, ___ = _properties.themeStyleScript, additionalProps = __rest(_properties, ["treePath", "disableStyles", "controller", "style", "styleScript", "themeStyleScript"]);
-    var subProps = {
-        recommendationBundle: __assign(__assign({ 
+    const _properties = {
+        name: properties.controller?.store?.profile?.tag?.toLowerCase(),
+        ...properties,
+    };
+    const { treePath, disableStyles, controller, style: _, styleScript: __, themeStyleScript: ___, ...additionalProps } = _properties;
+    const subProps = {
+        recommendationBundle: {
             // default props
-            hideCheckboxes: true, seedText: '', ctaButtonText: 'Add Both', ctaInline: false, hideSeed: true, alias: alias, 
+            hideCheckboxes: true,
+            seedText: '',
+            ctaButtonText: 'Add Both',
+            ctaInline: false,
+            hideSeed: true,
+            alias: alias,
             // vertical: true,
-            limit: 1, carousel: {
+            limit: 1,
+            carousel: {
                 enabled: false,
-            }, separatorIcon: false }, (0, utilities_1.defined)({
-            disableStyles: disableStyles,
-        })), { 
+            },
+            separatorIcon: false,
+            // inherited props
+            ...(0, utilities_1.defined)({
+                disableStyles,
+            }),
             // component theme overrides
-            theme: _properties === null || _properties === void 0 ? void 0 : _properties.theme, treePath: treePath }),
+            theme: _properties?.theme,
+            treePath,
+        },
     };
-    var mergedProps = (0, utilities_1.mergeProps)(alias, globalTheme, {}, _properties);
-    var styling = (0, utilities_1.mergeStyles)(mergedProps, defaultStyles);
-    return (0, jsx_runtime_1.jsx)(RecommendationBundle_1.RecommendationBundle, __assign({ controller: controller }, styling, subProps.recommendationBundle, additionalProps));
+    const mergedProps = (0, utilities_1.mergeProps)(alias, globalTheme, {}, _properties);
+    const styling = (0, utilities_1.mergeStyles)(mergedProps, defaultStyles);
+    return (0, jsx_runtime_1.jsx)(RecommendationBundle_1.RecommendationBundle, { controller: controller, ...styling, ...subProps.recommendationBundle, ...additionalProps });
 });

package/dist/cjs/components/src/components/Templates/RecommendationBundleList/RecommendationBundleList.js

@@ -1,46 +1,24 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CTASlot = exports.RecommendationBundleList = void 0;
-var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-var react_1 = require("@emotion/react");
-var mobx_react_lite_1 = require("mobx-react-lite");
-var utilities_1 = require("../../../utilities");
-var RecommendationBundle_1 = require("../RecommendationBundle");
-var Price_1 = require("../../Atoms/Price");
-var Button_1 = require("../../Atoms/Button");
-var Icon_1 = require("../../Atoms/Icon");
-var Image_1 = require("../../Atoms/Image");
-var componentNameToClassName_1 = require("../../../utilities/componentNameToClassName");
-var classnames_1 = __importDefault(require("classnames"));
-var hooks_1 = require("preact/hooks");
-var deepmerge_1 = __importDefault(require("deepmerge"));
-var hooks_2 = require("../../../hooks");
-var defaultStyles = function () {
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("@emotion/react");
+const mobx_react_lite_1 = require("mobx-react-lite");
+const utilities_1 = require("../../../utilities");
+const RecommendationBundle_1 = require("../RecommendationBundle");
+const Price_1 = require("../../Atoms/Price");
+const Button_1 = require("../../Atoms/Button");
+const Icon_1 = require("../../Atoms/Icon");
+const Image_1 = require("../../Atoms/Image");
+const componentNameToClassName_1 = require("../../../utilities/componentNameToClassName");
+const classnames_1 = __importDefault(require("classnames"));
+const hooks_1 = require("preact/hooks");
+const deepmerge_1 = __importDefault(require("deepmerge"));
+const hooks_2 = require("../../../hooks");
+const defaultStyles = () => {
     return (0, react_1.css)({
         '.ss__recommendation-bundle-list__wrapper__selector__result-wrapper': {
             display: 'flex',
@@ -83,99 +61,111 @@ var defaultStyles = function () {
         },
     });
 };
-var alias = 'recommendationBundleList';
-exports.RecommendationBundleList = (0, mobx_react_lite_1.observer)(function (properties) {
-    var _a, _b, _c, _d;
-    var globalTheme = (0, react_1.useTheme)();
+const alias = 'recommendationBundleList';
+exports.RecommendationBundleList = (0, mobx_react_lite_1.observer)((properties) => {
+    const globalTheme = (0, react_1.useTheme)();
     //mergeprops only uses names that are passed via properties, so this cannot be put in the defaultProps
-    var _properties = __assign({ name: (_d = (_c = (_b = (_a = properties.controller) === null || _a === void 0 ? void 0 : _a.store) === null || _b === void 0 ? void 0 : _b.profile) === null || _c === void 0 ? void 0 : _c.tag) === null || _d === void 0 ? void 0 : _d.toLowerCase() }, properties);
-    var treePath = _properties.treePath, disableStyles = _properties.disableStyles, controller = _properties.controller, _ = _properties.style, __ = _properties.styleScript, ___ = _properties.themeStyleScript, additionalProps = __rest(_properties, ["treePath", "disableStyles", "controller", "style", "styleScript", "themeStyleScript"]);
-    var subProps = {
-        recommendationBundle: __assign(__assign({ 
+    const _properties = {
+        name: properties.controller?.store?.profile?.tag?.toLowerCase(),
+        ...properties,
+    };
+    const { treePath, disableStyles, controller, style: _, styleScript: __, themeStyleScript: ___, ...additionalProps } = _properties;
+    const subProps = {
+        recommendationBundle: {
             // default props
-            seedText: '', ctaInline: false, limit: 5, preselectedCount: 2, carousel: {
+            seedText: '',
+            ctaInline: false,
+            limit: 5,
+            preselectedCount: 2,
+            carousel: {
                 enabled: false,
                 seedInCarousel: true,
-            }, ctaSlot: function (props) { return (0, jsx_runtime_1.jsx)(exports.CTASlot, __assign({}, props)); }, vertical: true, separatorIcon: false, alias: alias }, (0, utilities_1.defined)({
-            disableStyles: disableStyles,
-        })), { 
+            },
+            ctaSlot: (props) => (0, jsx_runtime_1.jsx)(exports.CTASlot, { ...props }),
+            vertical: true,
+            separatorIcon: false,
+            alias: alias,
+            // inherited props
+            ...(0, utilities_1.defined)({
+                disableStyles,
+            }),
             // component theme overrides
-            theme: _properties === null || _properties === void 0 ? void 0 : _properties.theme, treePath: treePath }),
+            theme: _properties?.theme,
+            treePath,
+        },
     };
-    var mergedProps = (0, utilities_1.mergeProps)(alias, globalTheme, {}, _properties);
-    var styling = (0, utilities_1.mergeStyles)(mergedProps, defaultStyles);
-    return (0, jsx_runtime_1.jsx)(RecommendationBundle_1.RecommendationBundle, __assign({ controller: controller }, styling, subProps.recommendationBundle, additionalProps));
+    const mergedProps = (0, utilities_1.mergeProps)(alias, globalTheme, {}, _properties);
+    const styling = (0, utilities_1.mergeStyles)(mergedProps, defaultStyles);
+    return (0, jsx_runtime_1.jsx)(RecommendationBundle_1.RecommendationBundle, { controller: controller, ...styling, ...subProps.recommendationBundle, ...additionalProps });
 });
-exports.CTASlot = (0, mobx_react_lite_1.observer)(function (props) {
-    var _a;
-    var _b, _c;
-    var cartStore = props.cartStore;
-    var classNamePrefix = "ss__".concat((0, componentNameToClassName_1.componentNameToClassName)(alias));
-    props.onAddToCart = function (e) {
+exports.CTASlot = (0, mobx_react_lite_1.observer)((props) => {
+    const cartStore = props.cartStore;
+    const classNamePrefix = `ss__${(0, componentNameToClassName_1.componentNameToClassName)(alias)}`;
+    props.onAddToCart = (e) => {
         setAddedToCart(true);
         props.onAddToCart(e);
-        setTimeout(function () { return setAddedToCart(false); }, props.ctaButtonSuccessTimeout);
+        setTimeout(() => setAddedToCart(false), props.ctaButtonSuccessTimeout);
     };
-    var _d = (0, hooks_1.useState)(false), addedToCart = _d[0], setAddedToCart = _d[1];
+    const [addedToCart, setAddedToCart] = (0, hooks_1.useState)(false);
     props.addedToCart = addedToCart;
-    var subProps = {
+    const subProps = {
         image: {
             // default props
-            className: "".concat(classNamePrefix, "__wrapper__cta__image"),
+            className: `${classNamePrefix}__wrapper__cta__image`,
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme,
+            theme: props?.theme,
             treePath: props.treePath,
         },
         separatorIcon: {
             name: 'bundle-cart-separator',
             // default props
-            className: "".concat(classNamePrefix, "__wrapper__cta__icon--separator"),
+            className: `${classNamePrefix}__wrapper__cta__icon--separator`,
             icon: 'plus',
             size: 12,
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme,
+            theme: props?.theme,
             treePath: props.treePath,
         },
         icon: {
             name: 'bundle-cart',
             // default props
-            className: "".concat(classNamePrefix, "__wrapper__cta__icon"),
+            className: `${classNamePrefix}__wrapper__cta__icon`,
             size: 50,
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme,
+            theme: props?.theme,
             treePath: props.treePath,
         },
         subtotalStrike: {
             // default props
             name: 'bundle-msrp',
-            className: "".concat(classNamePrefix, "__wrapper__cta__price--strike"),
+            className: `${classNamePrefix}__wrapper__cta__price--strike`,
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme,
+            theme: props?.theme,
             treePath: props.treePath,
         },
         subtotalPrice: {
             // default props
-            className: "".concat(classNamePrefix, "__wrapper__cta__price"),
+            className: `${classNamePrefix}__wrapper__cta__price`,
             name: 'bundle-price',
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme,
+            theme: props?.theme,
             treePath: props.treePath,
         },
         button: {
             // default props
-            className: "".concat(classNamePrefix, "__wrapper__cta__button"),
+            className: `${classNamePrefix}__wrapper__cta__button`,
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme,
+            theme: props?.theme,
             treePath: props.treePath,
         },
     };
     //deep merge with props.lang
-    var lang = (0, deepmerge_1.default)({}, props.lang || {});
-    var mergedLang = (0, hooks_2.useLang)(lang, {});
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "".concat(classNamePrefix, "__wrapper__cta__inner"), children: [(0, jsx_runtime_1.jsx)("div", { className: "".concat(classNamePrefix, "__wrapper__cta__inner__images"), children: cartStore.items.map(function (item) {
-                            var core = item.display.mappings.core;
-                            return ((0, jsx_runtime_1.jsxs)("div", { className: "".concat(classNamePrefix, "__wrapper__cta__inner__image-wrapper"), children: [(0, jsx_runtime_1.jsx)("a", { href: core.url, children: (0, jsx_runtime_1.jsx)(Image_1.Image, { src: core.thumbnailImageUrl, alt: core.name, lazy: false }) }), (0, jsx_runtime_1.jsx)(Icon_1.Icon, __assign({}, subProps.separatorIcon))] }));
-                        }) }), (0, jsx_runtime_1.jsxs)("div", { className: "".concat(classNamePrefix, "__wrapper__cta__subtotal"), "aria-atomic": "false", "aria-live": "polite", children: [props.ctaIcon ? ((0, jsx_runtime_1.jsx)("div", { className: "".concat(classNamePrefix, "__wrapper__cta__subtotal__icon__wrapper"), children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, __assign({}, subProps.icon, (typeof props.ctaIcon == 'string' ? { icon: props.ctaIcon } : props.ctaIcon))) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("span", { className: "".concat(classNamePrefix, "__wrapper__cta__subtotal__title"), children: "Subtotal for ".concat(cartStore.count, " items") }), (0, jsx_runtime_1.jsxs)("div", { className: "".concat(classNamePrefix, "__wrapper__cta__subtotal__prices"), children: [cartStore.msrp && cartStore.msrp !== cartStore.price ? ((0, jsx_runtime_1.jsxs)("label", { className: "".concat(classNamePrefix, "__wrapper__cta__subtotal__strike"), children: ["Was ", (0, jsx_runtime_1.jsx)(Price_1.Price, __assign({}, subProps.subtotalStrike, { lineThrough: true, value: cartStore.msrp }))] })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("label", { className: "".concat(classNamePrefix, "__wrapper__cta__subtotal__price"), children: (0, jsx_runtime_1.jsx)(Price_1.Price, __assign({}, subProps.subtotalPrice, { value: cartStore.price })) })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "".concat(classNamePrefix, "__cta__button__wrapper"), children: (0, jsx_runtime_1.jsx)(Button_1.Button, __assign({}, subProps.button, { disabled: cartStore.items.length == 0, disableStyles: true, internalClassName: (0, classnames_1.default)("".concat(classNamePrefix, "__cta__button"), (_a = {},
-                        _a["".concat(classNamePrefix, "__cta__button--added")] = addedToCart,
-                        _a)), "aria-live": addedToCart, onClick: function (e) { return props.onAddToCart(e); } }, (addedToCart ? (_b = mergedLang.ctaButtonSuccessText) === null || _b === void 0 ? void 0 : _b.all : (_c = mergedLang.ctaButtonText) === null || _c === void 0 ? void 0 : _c.all), { children: props.addedToCart ? props.ctaButtonSuccessText : props.ctaButtonText })) })] }));
+    const lang = (0, deepmerge_1.default)({}, props.lang || {});
+    const mergedLang = (0, hooks_2.useLang)(lang, {}, { activeBreakpoint: props?.theme?.activeBreakpoint });
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: `${classNamePrefix}__wrapper__cta__inner`, children: [(0, jsx_runtime_1.jsx)("div", { className: `${classNamePrefix}__wrapper__cta__inner__images`, children: cartStore.items.map((item) => {
+                            const core = item.display.mappings.core;
+                            return ((0, jsx_runtime_1.jsxs)("div", { className: `${classNamePrefix}__wrapper__cta__inner__image-wrapper`, children: [(0, jsx_runtime_1.jsx)("a", { href: core.url, children: (0, jsx_runtime_1.jsx)(Image_1.Image, { src: core.thumbnailImageUrl, alt: core.name, lazy: false }) }), (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...subProps.separatorIcon })] }));
+                        }) }), (0, jsx_runtime_1.jsxs)("div", { className: `${classNamePrefix}__wrapper__cta__subtotal`, "aria-atomic": "false", "aria-live": "polite", children: [props.ctaIcon ? ((0, jsx_runtime_1.jsx)("div", { className: `${classNamePrefix}__wrapper__cta__subtotal__icon__wrapper`, children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...subProps.icon, ...(typeof props.ctaIcon == 'string' ? { icon: props.ctaIcon } : props.ctaIcon) }) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("span", { className: `${classNamePrefix}__wrapper__cta__subtotal__title`, children: `Subtotal for ${cartStore.count} items` }), (0, jsx_runtime_1.jsxs)("div", { className: `${classNamePrefix}__wrapper__cta__subtotal__prices`, children: [cartStore.msrp && cartStore.msrp !== cartStore.price ? ((0, jsx_runtime_1.jsxs)("label", { className: `${classNamePrefix}__wrapper__cta__subtotal__strike`, children: ["Was ", (0, jsx_runtime_1.jsx)(Price_1.Price, { ...subProps.subtotalStrike, lineThrough: true, value: cartStore.msrp })] })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {})), (0, jsx_runtime_1.jsx)("label", { className: `${classNamePrefix}__wrapper__cta__subtotal__price`, children: (0, jsx_runtime_1.jsx)(Price_1.Price, { ...subProps.subtotalPrice, value: cartStore.price }) })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: `${classNamePrefix}__cta__button__wrapper`, children: (0, jsx_runtime_1.jsx)(Button_1.Button, { ...subProps.button, disabled: cartStore.items.length == 0, disableStyles: true, internalClassName: (0, classnames_1.default)(`${classNamePrefix}__cta__button`, {
+                        [`${classNamePrefix}__cta__button--added`]: addedToCart,
+                    }), "aria-live": addedToCart, onClick: (e) => props.onAddToCart(e), ...(addedToCart ? mergedLang.ctaButtonSuccessText?.all : mergedLang.ctaButtonText?.all), children: props.addedToCart ? props.ctaButtonSuccessText : props.ctaButtonText }) })] }));
 });

package/dist/cjs/components/src/components/Templates/RecommendationBundleVertical/RecommendationBundleVertical.js

@@ -1,34 +1,12 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RecommendationBundleVertical = void 0;
-var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-var react_1 = require("@emotion/react");
-var mobx_react_lite_1 = require("mobx-react-lite");
-var utilities_1 = require("../../../utilities");
-var RecommendationBundle_1 = require("../RecommendationBundle");
-var defaultStyles = function () {
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("@emotion/react");
+const mobx_react_lite_1 = require("mobx-react-lite");
+const utilities_1 = require("../../../utilities");
+const RecommendationBundle_1 = require("../RecommendationBundle");
+const defaultStyles = () => {
     return (0, react_1.css)({
         '.ss__recommendation-bundle-vertical__wrapper': {
             flexDirection: 'column',
@@ -38,25 +16,34 @@ var defaultStyles = function () {
         },
     });
 };
-var alias = 'recommendationBundleVertical';
-exports.RecommendationBundleVertical = (0, mobx_react_lite_1.observer)(function (properties) {
-    var _a, _b, _c, _d;
-    var globalTheme = (0, react_1.useTheme)();
+const alias = 'recommendationBundleVertical';
+exports.RecommendationBundleVertical = (0, mobx_react_lite_1.observer)((properties) => {
+    const globalTheme = (0, react_1.useTheme)();
     //mergeprops only uses names that are passed via properties, so this cannot be put in the defaultProps
-    var _properties = __assign({ name: (_d = (_c = (_b = (_a = properties.controller) === null || _a === void 0 ? void 0 : _a.store) === null || _b === void 0 ? void 0 : _b.profile) === null || _c === void 0 ? void 0 : _c.tag) === null || _d === void 0 ? void 0 : _d.toLowerCase() }, properties);
-    var treePath = _properties.treePath, disableStyles = _properties.disableStyles, controller = _properties.controller, _ = _properties.style, __ = _properties.styleScript, ___ = _properties.themeStyleScript, additionalProps = __rest(_properties, ["treePath", "disableStyles", "controller", "style", "styleScript", "themeStyleScript"]);
-    var subProps = {
-        recommendationBundle: __assign(__assign({ 
+    const _properties = {
+        name: properties.controller?.store?.profile?.tag?.toLowerCase(),
+        ...properties,
+    };
+    const { treePath, disableStyles, controller, style: _, styleScript: __, themeStyleScript: ___, ...additionalProps } = _properties;
+    const subProps = {
+        recommendationBundle: {
             // default props
-            ctaInline: false, carousel: {
+            ctaInline: false,
+            carousel: {
                 enabled: false,
-            }, separatorIcon: false, alias: alias }, (0, utilities_1.defined)({
-            disableStyles: disableStyles,
-        })), { 
+            },
+            separatorIcon: false,
+            alias: alias,
+            // inherited props
+            ...(0, utilities_1.defined)({
+                disableStyles,
+            }),
             // component theme overrides
-            theme: _properties === null || _properties === void 0 ? void 0 : _properties.theme, treePath: treePath }),
+            theme: _properties?.theme,
+            treePath,
+        },
     };
-    var mergedProps = (0, utilities_1.mergeProps)(alias, globalTheme, {}, _properties);
-    var styling = (0, utilities_1.mergeStyles)(mergedProps, defaultStyles);
-    return (0, jsx_runtime_1.jsx)(RecommendationBundle_1.RecommendationBundle, __assign({ controller: controller }, styling, subProps.recommendationBundle, additionalProps));
+    const mergedProps = (0, utilities_1.mergeProps)(alias, globalTheme, {}, _properties);
+    const styling = (0, utilities_1.mergeStyles)(mergedProps, defaultStyles);
+    return (0, jsx_runtime_1.jsx)(RecommendationBundle_1.RecommendationBundle, { controller: controller, ...styling, ...subProps.recommendationBundle, ...additionalProps });
 });

package/dist/cjs/components/src/components/Templates/RecommendationEmail/RecommendationEmail.js

@@ -1,72 +1,64 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RecommendationEmail = exports.recommendationEmailThemeComponentProps = void 0;
-var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-var react_1 = require("@emotion/react");
-var mobx_react_lite_1 = require("mobx-react-lite");
-var deepmerge_1 = __importDefault(require("deepmerge"));
-var classnames_1 = __importDefault(require("classnames"));
-var Result_1 = require("../../Molecules/Result");
-var utilities_1 = require("../../../utilities");
-var providers_1 = require("../../../providers");
-var hooks_1 = require("../../../hooks");
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("@emotion/react");
+const mobx_react_lite_1 = require("mobx-react-lite");
+const deepmerge_1 = __importDefault(require("deepmerge"));
+const classnames_1 = __importDefault(require("classnames"));
+const Result_1 = require("../../Molecules/Result");
+const utilities_1 = require("../../../utilities");
+const providers_1 = require("../../../providers");
+const hooks_1 = require("../../../hooks");
 exports.recommendationEmailThemeComponentProps = {
     default: {},
     mobile: {},
     tablet: {},
     desktop: {},
 };
-var defaultStyles = function () {
+const defaultStyles = () => {
     return (0, react_1.css)({});
 };
-exports.RecommendationEmail = (0, mobx_react_lite_1.observer)(function (properties) {
-    var _a, _b, _c, _d, _e, _f;
-    var globalTheme = (0, providers_1.useTheme)();
-    var globalTreePath = (0, providers_1.useTreePath)();
-    var defaultProps = {
+exports.RecommendationEmail = (0, mobx_react_lite_1.observer)((properties) => {
+    const globalTheme = (0, providers_1.useTheme)();
+    const globalTreePath = (0, providers_1.useTreePath)();
+    const defaultProps = {
         resultWidth: '240px',
-        name: (_d = (_c = (_b = (_a = properties.controller) === null || _a === void 0 ? void 0 : _a.store) === null || _b === void 0 ? void 0 : _b.profile) === null || _c === void 0 ? void 0 : _c.tag) === null || _d === void 0 ? void 0 : _d.toLowerCase(),
+        name: properties.controller?.store?.profile?.tag?.toLowerCase(),
         treePath: globalTreePath,
     };
-    var props = (0, utilities_1.mergeProps)('recommendationEmail', globalTheme, defaultProps, properties);
-    var controller = props.controller, results = props.results, resultWidth = props.resultWidth, treePath = props.treePath, disableStyles = props.disableStyles, internalClassName = props.internalClassName, className = props.className;
-    var resultComponent = props.resultComponent;
-    var snap = (0, providers_1.useSnap)();
-    var isNamedResultComponent = typeof resultComponent === 'string';
-    var resultComponentName = isNamedResultComponent ? resultComponent : '';
-    var resultComponentMap = ((_e = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _e === void 0 ? void 0 : _e.library.import.component.result) || {};
-    var _g = (0, hooks_1.useComponent)(resultComponentMap, isNamedResultComponent ? resultComponentName : undefined), resultComponentOverride = _g.ComponentOverride, shouldWaitForNamedResultComponent = _g.shouldWaitForNamedOverride;
-    var resolvedResultComponent = isNamedResultComponent ? resultComponentOverride : resultComponent;
-    var subProps = {
-        result: __assign(__assign({ 
+    const props = (0, utilities_1.mergeProps)('recommendationEmail', globalTheme, defaultProps, properties);
+    const { controller, results, resultWidth, treePath, disableStyles, internalClassName, className } = props;
+    const resultComponent = props.resultComponent;
+    const snap = (0, providers_1.useSnap)();
+    const isNamedResultComponent = typeof resultComponent === 'string';
+    const resultComponentName = isNamedResultComponent ? resultComponent : '';
+    const resultComponentMap = snap?.templates?.library.import.component.result || {};
+    const { ComponentOverride: resultComponentOverride, shouldWaitForNamedOverride: shouldWaitForNamedResultComponent } = (0, hooks_1.useComponent)(resultComponentMap, isNamedResultComponent ? resultComponentName : undefined);
+    const resolvedResultComponent = isNamedResultComponent ? resultComponentOverride : resultComponent;
+    const subProps = {
+        result: {
             // default props
-            internalClassName: 'ss__recommendation-email__result' }, (0, utilities_1.defined)({
-            disableStyles: disableStyles,
-        })), { 
+            internalClassName: 'ss__recommendation-email__result',
+            // inherited props
+            ...(0, utilities_1.defined)({
+                disableStyles,
+            }),
             // component theme overrides
-            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+            theme: props?.theme,
+            treePath,
+        },
     };
-    var styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
-    var resultsToRender = results || ((_f = controller === null || controller === void 0 ? void 0 : controller.store) === null || _f === void 0 ? void 0 : _f.results) || [];
-    return resultsToRender.length > 0 ? ((0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)('ss__recommendation-email', className, internalClassName) }, styling, { children: resultsToRender.map(function (result, idx) { return ((0, jsx_runtime_1.jsx)("div", { id: "ss-emailrec".concat(idx), className: (0, classnames_1.default)('ss__recommendation-email__result-wrapper'), style: { display: 'block', width: resultWidth }, children: (function () {
+    const styling = (0, utilities_1.mergeStyles)(props, defaultStyles);
+    const resultsToRender = results || controller?.store?.results || [];
+    return resultsToRender.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__recommendation-email', className, internalClassName), ...styling, children: resultsToRender.map((result, idx) => ((0, jsx_runtime_1.jsx)("div", { id: `ss-emailrec${idx}`, className: (0, classnames_1.default)('ss__recommendation-email__result-wrapper'), style: { display: 'block', width: resultWidth }, children: (() => {
                 if (resolvedResultComponent) {
                     return (0, utilities_1.cloneWithProps)(resolvedResultComponent, {
-                        controller: controller,
-                        result: result,
+                        controller,
+                        result,
                         email: true,
                         theme: isNamedResultComponent
                             ? (0, deepmerge_1.default)(props.theme || {}, {
@@ -81,20 +73,20 @@ exports.RecommendationEmail = (0, mobx_react_lite_1.observer)(function (properti
                                 },
                             })
                             : props.theme,
-                        treePath: treePath,
+                        treePath,
                     });
                 }
                 else {
                     if (shouldWaitForNamedResultComponent) {
                         return null;
                     }
-                    return ((0, jsx_runtime_1.jsx)(Result_1.Result, __assign({ result: result, hideBadge: true, theme: {
+                    return ((0, jsx_runtime_1.jsx)(Result_1.Result, { result: result, hideBadge: true, theme: {
                             components: {
                                 image: {
                                     lazy: false,
                                 },
                             },
-                        } }, subProps.result)));
+                        }, ...subProps.result }));
                 }
-            })() }, idx)); }) }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
+            })() }, idx))) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}));
 });