@athoscommerce/snap-preact 1.0.0

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

@@ -0,0 +1,65 @@
+import { CarouselProps as CarouselProps } from '../../Molecules/Carousel';
+import { ComponentProps, BreakpointsProps, ResultComponent } from '../../../types';
+import { IconProps, IconType } from '../../Atoms/Icon';
+import type { RecommendationController } from '@athoscommerce/snap-controller';
+import type { CartStore, Product } from '@athoscommerce/snap-store-mobx';
+import { BundledCTAProps } from './BundleCTA';
+import { Lang } from '../../../hooks';
+export declare const RecommendationBundle: ((properties: RecommendationBundleProps) => import("@emotion/react/jsx-runtime").JSX.Element | null) & {
+    displayName: string;
+};
+type BundleCarouselProps = {
+    controller?: RecommendationController;
+    enabled?: boolean;
+    seedInCarousel?: boolean;
+    slidesPerView?: number;
+} & Partial<Omit<CarouselProps, 'slidesPerView'>>;
+export type RecommendationBundleProps = {
+    controller: RecommendationController;
+    breakpoints?: BreakpointsProps;
+    resultComponent?: ResultComponent<{
+        controller: RecommendationController;
+        seed?: boolean;
+        selected?: boolean;
+        onProductSelect?: (product: Product) => void;
+    }>;
+    alias?: string;
+    lang?: Partial<RecommendationBundleLang>;
+    results?: Product[];
+} & RecommendationBundleTemplatesLegalProps & ComponentProps<RecommendationBundleProps>;
+export type RecommendationBundleTemplatesLegalProps = {
+    limit?: number;
+    onAddToCart?: (e: MouseEvent, items: Product[]) => void;
+    title?: JSX.Element | string;
+    preselectedCount?: number;
+    hideCheckboxes?: boolean;
+    hideSeed?: boolean;
+    seedText?: string;
+    hideSeedText?: boolean;
+    separatorIconSeedOnly?: boolean;
+    separatorIcon?: IconType | Partial<IconProps> | false;
+    ctaInline?: boolean;
+    description?: JSX.Element | string;
+    ctaIcon?: IconType | Partial<IconProps> | false;
+    ctaButtonText?: string;
+    ctaButtonSuccessText?: string;
+    ctaButtonSuccessTimeout?: number;
+    ctaSlot?: JSX.Element | React.FunctionComponent<BundledCTAProps>;
+    vertical?: boolean;
+    carousel?: BundleCarouselProps;
+    slidesPerView?: number;
+    lazyRender?: {
+        enabled: boolean;
+        offset?: string;
+    };
+};
+export interface RecommendationBundleLang {
+    seedText: Lang<never>;
+    ctaButtonText: Lang<never>;
+    ctaButtonSuccessText: Lang<never>;
+    ctaSubtotalTitle: Lang<{
+        cartStore: CartStore;
+    }>;
+}
+export {};
+//# sourceMappingURL=RecommendationBundle.d.ts.map

package/dist/cjs/components/src/components/Templates/RecommendationBundle/RecommendationBundle.d.ts.map

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

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

@@ -0,0 +1,421 @@
+"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.RecommendationBundle = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var react_1 = require("@emotion/react");
+var classnames_1 = __importDefault(require("classnames"));
+var hooks_1 = require("preact/hooks");
+var mobx_react_lite_1 = require("mobx-react-lite");
+var deepmerge_1 = __importDefault(require("deepmerge"));
+var Carousel_1 = require("../../Molecules/Carousel");
+var Result_1 = require("../../Molecules/Result");
+var utilities_1 = require("../../../utilities");
+var providers_1 = require("../../../providers");
+var useDisplaySettings_1 = require("../../../hooks/useDisplaySettings");
+var ProfileTracker_1 = require("../../Trackers/Recommendation/ProfileTracker");
+var ResultTracker_1 = require("../../Trackers/ResultTracker");
+var BundleSelector_1 = require("./BundleSelector");
+var BundleCTA_1 = require("./BundleCTA");
+var hooks_2 = require("../../../hooks");
+var componentNameToClassName_1 = require("../../../utilities/componentNameToClassName");
+var defaultStyles = function (_a) {
+    var _b, _c, _d, _e, _f, _g, _h;
+    var vertical = _a.vertical, separatorIcon = _a.separatorIcon, carousel = _a.carousel, ctaInline = _a.ctaInline, hasSeed = _a.hasSeed, hideSeed = _a.hideSeed, carouselEnabled = _a.carouselEnabled, limit = _a.limit, inherits = _a.alias;
+    var classNamePrefix = 'ss__recommendation-bundle';
+    if (inherits) {
+        classNamePrefix = "ss__".concat((0, componentNameToClassName_1.componentNameToClassName)(inherits));
+    }
+    var slidesPerView = carousel === null || carousel === void 0 ? void 0 : carousel.slidesPerView;
+    return (0, react_1.css)((_b = {},
+        _b[".".concat(classNamePrefix, "__wrapper")] = {
+            display: 'flex',
+            maxWidth: '100%',
+            margin: '0',
+            padding: '0',
+        },
+        _b[".".concat(classNamePrefix, "__wrapper__selector--seed")] = {
+            width: "".concat(vertical ? '100%' : 'auto'),
+            margin: "".concat(!separatorIcon ? 'auto !important' : 'initial'),
+        },
+        _b[".".concat(classNamePrefix, "__wrapper__seed-container")] = {
+            width: vertical ? '100%' : "calc(100% / ".concat(slidesPerView + (!ctaInline ? 0 : 1), ")"),
+        },
+        _b[".".concat(classNamePrefix, "__wrapper__cta")] = (_c = {
+                width: vertical ? '100%' : "".concat(!ctaInline ? '100%' : "calc(100% / ".concat((carouselEnabled ? slidesPerView : limit || 0) + 1, ")")),
+                textAlign: 'center'
+            },
+            _c[".".concat(classNamePrefix, "__wrapper__cta__subtotal__prices")] = {
+                display: 'block',
+            },
+            _c[".".concat(classNamePrefix, "__wrapper__cta__button--added")] = {
+                cursor: 'none',
+                pointerEvents: 'none',
+                opacity: '.7',
+            },
+            _c),
+        _b[".".concat(classNamePrefix, "__wrapper__carousel")] = {
+            boxSizing: 'border-box',
+            width: vertical ? '100%' : "calc(calc(100% / ".concat(slidesPerView + (!ctaInline ? 0 : 1), ") * ").concat(slidesPerView - (hasSeed && !hideSeed ? 1 : 0), ")"),
+        },
+        _b[".".concat(classNamePrefix, "__wrapper--seed-in-carousel")] = (_d = {},
+            _d[".".concat(classNamePrefix, "__wrapper__cta")] = {
+                width: vertical ? '100%' : "calc(100% / ".concat((carousel === null || carousel === void 0 ? void 0 : carousel.slidesPerView) + (!ctaInline ? 0 : 1), ")"),
+            },
+            _d[".".concat(classNamePrefix, "__wrapper__carousel")] = {
+                width: vertical ? '100%' : "calc(calc(100% / ".concat((carousel === null || carousel === void 0 ? void 0 : carousel.slidesPerView) + (!ctaInline ? 0 : 1), ") * ").concat(carousel === null || carousel === void 0 ? void 0 : carousel.slidesPerView, ")"),
+                padding: '0',
+            },
+            _d),
+        _b['.swiper-slide, .swiper-slide-visible.swiper-last-visible-slide'] = (_e = {},
+            _e[".".concat(classNamePrefix, "__wrapper__selector__icon")] = {
+                display: 'none',
+            },
+            _e),
+        _b['.swiper-slide-visible'] = (_f = {},
+            _f[".".concat(classNamePrefix, "__wrapper__selector__icon")] = {
+                display: 'block',
+            },
+            _f),
+        _b[".".concat(classNamePrefix, "__wrapper--vertical")] = {
+            flexDirection: 'column',
+        },
+        _b[".".concat(classNamePrefix, "__wrapper__selector")] = (_g = {
+                alignItems: 'baseline',
+                position: 'relative'
+            },
+            _g["&.".concat(classNamePrefix, "__wrapper__selector--last")] = (_h = {},
+                _h[".".concat(classNamePrefix, "__wrapper__selector__icon")] = {
+                    display: 'none',
+                },
+                _h),
+            _g[".".concat(classNamePrefix, "__wrapper__selector__result-wrapper__seed-badge")] = {
+                position: 'absolute',
+                top: '0',
+                left: '0',
+                zIndex: '1',
+            },
+            _g[".".concat(classNamePrefix, "__wrapper__selector__icon")] = {
+                position: 'absolute',
+                right: '-1em',
+                top: '140px',
+            },
+            _g[".".concat(classNamePrefix, "__wrapper__selector__result-wrapper")] = {
+                alignItems: 'center',
+                position: 'relative',
+                margin: "0px ".concat(5 + (Number(carousel === null || carousel === void 0 ? void 0 : carousel.spaceBetween) || 0), "px"),
+            },
+            _g[".".concat(classNamePrefix, "__wrapper__selector__result-wrapper__checkbox")] = {
+                position: 'absolute',
+                top: '0',
+                right: '0',
+                //needs to be above 100 to get above badges
+                zIndex: '101',
+                cursor: 'pointer',
+            },
+            _g),
+        _b));
+};
+exports.RecommendationBundle = (0, mobx_react_lite_1.observer)(function (properties) {
+    var _a, _b;
+    var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
+    var globalTheme = (0, providers_1.useTheme)();
+    var globalTreePath = (0, providers_1.useTreePath)();
+    var defaultCarouselBreakpoints = {
+        0: {
+            slidesPerView: 2,
+            slidesPerGroup: 2,
+            spaceBetween: 10,
+            ctaInline: false,
+        },
+        768: {
+            slidesPerView: 3,
+            slidesPerGroup: 3,
+            spaceBetween: 10,
+        },
+        1200: {
+            slidesPerView: 4,
+            slidesPerGroup: 4,
+            spaceBetween: 10,
+        },
+    };
+    var defaultProps = {
+        // default props
+        breakpoints: JSON.parse(JSON.stringify(defaultCarouselBreakpoints)),
+        hideCheckboxes: false,
+        separatorIcon: 'plus-thin',
+        seedText: 'This Product',
+        separatorIconSeedOnly: true,
+        ctaIcon: 'bag',
+        ctaButtonText: 'Add All To Cart',
+        ctaButtonSuccessText: 'Bundle Added!',
+        ctaButtonSuccessTimeout: 2000,
+        ctaInline: true,
+        onAddToCart: function (e, items) { return (controller === null || controller === void 0 ? void 0 : controller.addToCart) && controller.addToCart(items); },
+        title: (_g = (_f = (_e = (_d = (_c = properties.controller) === null || _c === void 0 ? void 0 : _c.store) === null || _d === void 0 ? void 0 : _d.profile) === null || _e === void 0 ? void 0 : _e.display) === null || _f === void 0 ? void 0 : _f.templateParameters) === null || _g === void 0 ? void 0 : _g.title,
+        description: (_m = (_l = (_k = (_j = (_h = properties.controller) === null || _h === void 0 ? void 0 : _h.store) === null || _j === void 0 ? void 0 : _j.profile) === null || _k === void 0 ? void 0 : _k.display) === null || _l === void 0 ? void 0 : _l.templateParameters) === null || _m === void 0 ? void 0 : _m.description,
+        treePath: globalTreePath,
+    };
+    //mergeprops only uses names that are passed via properties, so this cannot be put in the defaultProps
+    var _properties = __assign({ name: (_r = (_q = (_p = (_o = properties.controller) === null || _o === void 0 ? void 0 : _o.store) === null || _p === void 0 ? void 0 : _p.profile) === null || _q === void 0 ? void 0 : _q.tag) === null || _r === void 0 ? void 0 : _r.toLowerCase() }, properties);
+    var props = (0, utilities_1.mergeProps)(_properties.alias || 'recommendationBundle', globalTheme, defaultProps, _properties);
+    var classNamePrefix = 'ss__recommendation-bundle';
+    if (props.alias) {
+        classNamePrefix = "ss__".concat((0, componentNameToClassName_1.componentNameToClassName)(props.alias));
+    }
+    var displaySettings;
+    if (!(((_s = properties.theme) === null || _s === void 0 ? void 0 : _s.name) || globalTheme.name)) {
+        displaySettings = (0, useDisplaySettings_1.useDisplaySettings)(props.breakpoints);
+        if (displaySettings && Object.keys(displaySettings).length) {
+            var theme = (0, deepmerge_1.default)((props === null || props === void 0 ? void 0 : props.theme) || {}, (displaySettings === null || displaySettings === void 0 ? void 0 : displaySettings.theme) || {}, { arrayMerge: function (destinationArray, sourceArray) { return sourceArray; } });
+            props = __assign(__assign(__assign({}, props), displaySettings), { theme: theme });
+        }
+    }
+    var title = props.title, description = props.description, controller = props.controller, breakpoints = props.breakpoints, results = props.results, carousel = props.carousel, preselectedCount = props.preselectedCount, separatorIcon = props.separatorIcon, hideCheckboxes = props.hideCheckboxes, limit = props.limit, seedText = props.seedText, vertical = props.vertical, onAddToCart = props.onAddToCart, separatorIconSeedOnly = props.separatorIconSeedOnly, resultComponent = props.resultComponent, ctaSlot = props.ctaSlot, hideSeed = props.hideSeed, ctaButtonText = props.ctaButtonText, ctaButtonSuccessText = props.ctaButtonSuccessText, ctaButtonSuccessTimeout = props.ctaButtonSuccessTimeout, disableStyles = props.disableStyles, ctaIcon = props.ctaIcon, ctaInline = props.ctaInline, hideSeedText = props.hideSeedText, lazyRender = props.lazyRender, className = props.className, internalClassName = props.internalClassName, _ = props.style, __ = props.styleScript, ___ = props.themeStyleScript, treePath = props.treePath, additionalProps = __rest(props, ["title", "description", "controller", "breakpoints", "results", "carousel", "preselectedCount", "separatorIcon", "hideCheckboxes", "limit", "seedText", "vertical", "onAddToCart", "separatorIconSeedOnly", "resultComponent", "ctaSlot", "hideSeed", "ctaButtonText", "ctaButtonSuccessText", "ctaButtonSuccessTimeout", "disableStyles", "ctaIcon", "ctaInline", "hideSeedText", "lazyRender", "className", "internalClassName", "style", "styleScript", "themeStyleScript", "treePath"]);
+    var mergedlazyRender = __assign({ enabled: true, offset: '10%' }, lazyRender);
+    var mergedCarouselProps = __assign({ enabled: true, loop: false, spaceBetween: 10 }, carousel);
+    var seedInCarousel = mergedCarouselProps.seedInCarousel, prevButton = mergedCarouselProps.prevButton, nextButton = mergedCarouselProps.nextButton, hideButtons = mergedCarouselProps.hideButtons, loop = mergedCarouselProps.loop, spaceBetween = mergedCarouselProps.spaceBetween, pagination = mergedCarouselProps.pagination;
+    var carouselEnabled = mergedCarouselProps.enabled;
+    if (!controller || controller.type !== 'recommendation') {
+        throw new Error("<RecommendationBundle> Component requires 'controller' prop with an instance of RecommendationController");
+    }
+    var resultsToRender = results || ((_t = controller.store) === null || _t === void 0 ? void 0 : _t.results);
+    if (limit) {
+        resultsToRender = resultsToRender.slice(0, hideSeed && resultsToRender.filter(function (result) { return result.bundleSeed == true; }).length ? limit + 1 : limit);
+    }
+    var cartStore = controller.store.cart;
+    if (!cartStore) {
+        throw new Error("<RecommendationBundle> Component requires 'cartStore' to exist in the recommendation store");
+    }
+    if (!(results && results.length) && !((_v = (_u = controller.store) === null || _u === void 0 ? void 0 : _u.results) === null || _v === void 0 ? void 0 : _v.length)) {
+        controller.log.error("<RecommendationBundle> Component has no results to render!");
+        return null;
+    }
+    var seed = results
+        ? results.filter(function (result) { return result.bundleSeed == true; }).pop()
+        : (_x = (_w = controller.store) === null || _w === void 0 ? void 0 : _w.results) === null || _x === void 0 ? void 0 : _x.filter(function (result) { return result.bundleSeed == true; }).pop();
+    var subProps = {
+        carousel: __assign(__assign({ loop: loop, 
+            // default props
+            internalClassName: 'ss__recommendation__carousel' }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+        result: __assign(__assign({ 
+            // default props
+            internalClassName: 'ss__recommendation__result' }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: props === null || props === void 0 ? void 0 : props.theme, treePath: treePath }),
+    };
+    var hasSeed = Boolean(resultsToRender.filter(function (result) { return result.bundleSeed == true; }).length);
+    var slidesPerView = ((_y = props.carousel) === null || _y === void 0 ? void 0 : _y.slidesPerView) || props.slidesPerView;
+    if (!slidesPerView) {
+        slidesPerView = 2;
+    }
+    else if (resultsToRender.length < Number(slidesPerView)) {
+        slidesPerView = resultsToRender.length;
+    }
+    var styling = (0, utilities_1.mergeStyles)(__assign(__assign({}, props), { carousel: __assign(__assign({}, mergedCarouselProps), { slidesPerView: slidesPerView }), hasSeed: hasSeed, carouselEnabled: carouselEnabled }), defaultStyles);
+    var _preSelectedCount = typeof preselectedCount == 'number' ? preselectedCount : carouselEnabled ? slidesPerView : resultsToRender.length;
+    //this resets the selected items if the results to render changes
+    // so you dont end up with something selected that is no longer rendered
+    (0, hooks_1.useEffect)(function () {
+        cartStore.reset();
+        if (_preSelectedCount) {
+            resultsToRender === null || resultsToRender === void 0 ? void 0 : resultsToRender.forEach(function (result, idx) {
+                if (idx < Number(_preSelectedCount)) {
+                    cartStore.addItems([result]);
+                }
+            });
+        }
+    }, [resultsToRender.length]);
+    var selectedItems = cartStore.items;
+    var modifiedBreakpoints = __assign({}, breakpoints);
+    if (carouselEnabled) {
+        var adjustSlides_1 = function (obj) {
+            // fallback in case slides per view/group were not provided in breakpoint...
+            var currentBreakpointSlidesPerView = (obj === null || obj === void 0 ? void 0 : obj.slidesPerView) || obj.slidesPerView || 2;
+            var currentBreakpointSlidesPerGroup = (obj === null || obj === void 0 ? void 0 : obj.slidesPerGroup) || obj.slidesPerGroup || 2;
+            var newSlidesPerView = currentBreakpointSlidesPerView;
+            var newSlidesPerGroup = currentBreakpointSlidesPerGroup;
+            var resultCount = !hasSeed || seedInCarousel ? resultsToRender.length : resultsToRender.length - 1;
+            if (resultCount) {
+                if (resultCount >= currentBreakpointSlidesPerView) {
+                    newSlidesPerView = currentBreakpointSlidesPerView - (!seedInCarousel && hasSeed ? 1 : 0);
+                    if (!seedInCarousel) {
+                        newSlidesPerGroup = currentBreakpointSlidesPerGroup - 1 || 1;
+                    }
+                }
+                else {
+                    (newSlidesPerView = resultCount), (newSlidesPerGroup = resultCount);
+                }
+            }
+            return {
+                slidesPerView: newSlidesPerView,
+                slidesPerGroup: newSlidesPerGroup,
+            };
+        };
+        //no breakpoint props allowed in templates
+        if (!(((_z = properties.theme) === null || _z === void 0 ? void 0 : _z.name) || globalTheme.name)) {
+            Object.keys(props.breakpoints).forEach(function (breakpoint) {
+                var obj = props.breakpoints[breakpoint];
+                var _a = adjustSlides_1(obj), adjustedSlidesPerView = _a.slidesPerView, adjustedSlidesPerGroup = _a.slidesPerGroup;
+                modifiedBreakpoints[breakpoint] = __assign(__assign({}, modifiedBreakpoints[breakpoint]), { slidesPerView: adjustedSlidesPerView, slidesPerGroup: adjustedSlidesPerGroup });
+            });
+        }
+        else {
+            var _1 = adjustSlides_1(__assign(__assign({}, mergedCarouselProps), { slidesPerView: slidesPerView })), adjustedSlidesPerView = _1.slidesPerView, adjustedSlidesPerGroup = _1.slidesPerGroup;
+            displaySettings = __assign(__assign({}, mergedCarouselProps), { slidesPerView: adjustedSlidesPerView, slidesPerGroup: adjustedSlidesPerGroup });
+        }
+    }
+    var onProductSelect = function (product) {
+        if (product) {
+            var idx = selectedItems.findIndex(function (result) { return result.id == product.id; });
+            //is it in the selected items?
+            if (idx > -1) {
+                //already selected, deselect it now
+                cartStore.removeItems([product]);
+                if (cartStore.items.length == 0 && seed) {
+                    //we dont call addItems here to prevent tracking
+                    cartStore.items.push(seed);
+                }
+            }
+            else {
+                //add it to the list;
+                cartStore.addItems([product]);
+            }
+        }
+    };
+    var addToCart = function (e) {
+        // add to cart tracking
+        controller.addToCart(selectedItems);
+        //call the function passed
+        onAddToCart && onAddToCart(e, selectedItems);
+    };
+    var setSeedwidth = function () {
+        var _a, _b;
+        if (seedRef.current) {
+            // @ts-ignore - todo can this be typed appropriatly?
+            var seedElem = (_a = seedRef.current) === null || _a === void 0 ? void 0 : _a.base;
+            // @ts-ignore - todo can this be typed appropriatly?
+            var carouselElem = (_b = carouselRef.current) === null || _b === void 0 ? void 0 : _b.base;
+            var visibleSlide = carouselElem === null || carouselElem === void 0 ? void 0 : carouselElem.querySelector(".swiper-slide-visible .".concat(classNamePrefix, "__wrapper__selector"));
+            var width = visibleSlide === null || visibleSlide === void 0 ? void 0 : visibleSlide.offsetWidth;
+            if (seedElem) {
+                seedElem.style.width = "".concat(width, "px");
+            }
+        }
+    };
+    var seedRef = (0, hooks_1.useRef)();
+    var carouselRef = (0, hooks_1.useRef)();
+    var _2 = (0, hooks_1.useState)(false), isVisible = _2[0], setIsVisible = _2[1];
+    var recsRef = (0, hooks_1.useRef)(null);
+    var inView = (mergedlazyRender === null || mergedlazyRender === void 0 ? void 0 : mergedlazyRender.enabled) ? (0, hooks_2.useIntersection)(recsRef, "".concat(mergedlazyRender.offset, " 0px ").concat(mergedlazyRender.offset, " 0px"), true) : true;
+    if (inView) {
+        setIsVisible(true);
+    }
+    //initialize lang
+    var defaultLang = {
+        seedText: {
+            value: seedText,
+        },
+        ctaButtonText: {
+            value: ctaButtonText,
+        },
+        ctaButtonSuccessText: {
+            value: ctaButtonSuccessText,
+        },
+        ctaSubtotalTitle: {
+            value: "Subtotal for ".concat(cartStore.count, " items"),
+        },
+    };
+    //deep merge with props.lang
+    var lang = (0, deepmerge_1.default)(defaultLang, props.lang || {});
+    var renderedResults = (0, hooks_1.useMemo)(function () {
+        return resultsToRender.map(function (result, idx) {
+            var isSeed = Boolean(result.bundleSeed);
+            var selected = selectedItems.findIndex(function (item) { return item.id == result.id; }) > -1;
+            var attributes = {
+                onCheck: function (e) {
+                    e.stopPropagation();
+                    onProductSelect(result);
+                },
+                checked: selected,
+                hideCheckboxes: hideCheckboxes,
+                theme: props.theme,
+                icon: separatorIconSeedOnly ? false : separatorIcon,
+                className: idx + 1 == resultsToRender.length ? 'ss__recommendation-bundle__wrapper__selector--last' : '',
+                classNamePrefix: classNamePrefix,
+                treePath: treePath,
+            };
+            if (isSeed) {
+                attributes = __assign(__assign({}, attributes), { seedText: seedText, seed: true, icon: separatorIcon, lang: { seedText: lang.seedText } });
+            }
+            return !isSeed || ((seedInCarousel || (carousel === null || carousel === void 0 ? void 0 : carousel.enabled) == false) && isSeed && !hideSeed) ? ((0, jsx_runtime_1.jsx)(ResultTracker_1.ResultTracker, { controller: controller, result: result, track: { impression: Boolean(!isSeed) }, children: (0, jsx_runtime_1.jsx)(BundleSelector_1.BundleSelector, __assign({}, attributes, { children: resultComponent ? ((0, utilities_1.cloneWithProps)(resultComponent, { controller: controller, treePath: treePath, result: result, seed: isSeed, selected: selected, onProductSelect: onProductSelect })) : ((0, jsx_runtime_1.jsx)(Result_1.Result, __assign({}, subProps.result, { controller: controller, result: result }))) })) }, result.id)) : null;
+        });
+    }, [
+        resultsToRender,
+        selectedItems,
+        hideCheckboxes,
+        separatorIconSeedOnly,
+        separatorIcon,
+        seedInCarousel,
+        hideSeed,
+        resultComponent,
+        props.theme,
+        seedText,
+    ]);
+    if (hideSeedText) {
+        delete lang.seedText.value;
+    }
+    return (resultsToRender === null || resultsToRender === void 0 ? void 0 : resultsToRender.length) ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({}, styling, { ref: recsRef, className: (0, classnames_1.default)(classNamePrefix, (_a = {}, _a["".concat(classNamePrefix, "--stacked")] = !ctaInline, _a), className, internalClassName), children: isVisible ? ((0, jsx_runtime_1.jsxs)(ProfileTracker_1.RecommendationProfileTracker, { controller: controller, children: [title && ((0, jsx_runtime_1.jsx)("h3", { className: "".concat(classNamePrefix, "__title"), children: (0, jsx_runtime_1.jsx)("span", { children: title }) })), description && ((0, jsx_runtime_1.jsx)("p", { className: "ss__recommendation-bundle__description", children: (0, jsx_runtime_1.jsx)("span", { children: description }) })), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)("".concat(classNamePrefix, "__wrapper"), (_b = {},
+                            _b["".concat(classNamePrefix, "__wrapper--seed-in-carousel")] = seedInCarousel,
+                            _b["".concat(classNamePrefix, "__wrapper--vertical")] = vertical,
+                            _b)), children: [carouselEnabled ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!seedInCarousel && !hideSeed && seed && ((0, jsx_runtime_1.jsx)("div", { className: "".concat(classNamePrefix, "__wrapper__seed-container"), children: (0, jsx_runtime_1.jsx)(ResultTracker_1.ResultTracker, { controller: controller, result: seed, track: { impression: false }, children: (0, jsx_runtime_1.jsx)(BundleSelector_1.BundleSelector, { seedText: seedText, seed: true, title: (_0 = seed.display.mappings.core) === null || _0 === void 0 ? void 0 : _0.name, onCheck: function (e) {
+                                                    e.stopPropagation();
+                                                    onProductSelect(seed);
+                                                }, checked: selectedItems.findIndex(function (item) { return item.id == seed.id; }) > -1, icon: separatorIcon, hideCheckboxes: hideCheckboxes, theme: props.theme, ref: seedRef, treePath: treePath, classNamePrefix: classNamePrefix, lang: { seedText: lang.seedText }, children: (function () {
+                                                    if (resultComponent && controller) {
+                                                        var ResultComponent = resultComponent;
+                                                        return ((0, jsx_runtime_1.jsx)(ResultComponent, { controller: controller, seed: true, selected: selectedItems.findIndex(function (item) { return item.id == seed.id; }) > -1, onProductSelect: onProductSelect, result: seed, treePath: treePath }));
+                                                    }
+                                                    else {
+                                                        return (0, jsx_runtime_1.jsx)(Result_1.Result, __assign({}, subProps.result, { controller: controller, result: seed }));
+                                                    }
+                                                })() }) }) })), (0, jsx_runtime_1.jsx)("div", { className: "".concat(classNamePrefix, "__wrapper__carousel"), children: (0, jsx_runtime_1.jsx)(Carousel_1.Carousel, __assign({ prevButton: prevButton, nextButton: nextButton, hideButtons: hideButtons, loop: loop, spaceBetween: spaceBetween, pagination: pagination, breakpoints: modifiedBreakpoints, watchSlidesProgress: true, observer: true, vertical: vertical, onResize: function () { return setSeedwidth(); } }, subProps.carousel, additionalProps, displaySettings, { ref: carouselRef, children: renderedResults })) })] })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: renderedResults })), ctaInline && ((0, jsx_runtime_1.jsx)(BundleCTA_1.BundledCTA, { ctaSlot: ctaSlot, cartStore: cartStore, onAddToCart: function (e) { return addToCart(e); }, ctaButtonText: ctaButtonText, ctaButtonSuccessText: ctaButtonSuccessText, ctaButtonSuccessTimeout: ctaButtonSuccessTimeout, ctaIcon: ctaIcon, treePath: treePath, classNamePrefix: classNamePrefix, lang: {
+                                    ctaButtonSuccessText: lang.ctaButtonSuccessText,
+                                    ctaButtonText: lang.ctaButtonText,
+                                    ctaSubtotalTitle: lang.ctaSubtotalTitle,
+                                } }))] }), !ctaInline && ((0, jsx_runtime_1.jsx)(BundleCTA_1.BundledCTA, { ctaSlot: ctaSlot, cartStore: cartStore, onAddToCart: function (e) { return addToCart(e); }, ctaButtonText: ctaButtonText, ctaButtonSuccessText: ctaButtonSuccessText, ctaButtonSuccessTimeout: ctaButtonSuccessTimeout, ctaIcon: ctaIcon, treePath: treePath, classNamePrefix: classNamePrefix, lang: {
+                            ctaButtonSuccessText: lang.ctaButtonSuccessText,
+                            ctaButtonText: lang.ctaButtonText,
+                            ctaSubtotalTitle: lang.ctaSubtotalTitle,
+                        } }))] })) : ((0, jsx_runtime_1.jsx)(ProfileTracker_1.RecommendationProfileTracker, { controller: controller, children: resultsToRender.map(function (result) { return ((0, jsx_runtime_1.jsx)(ResultTracker_1.ResultTracker, { controller: controller, result: result, children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) })); }) })) })) })) : null;
+});

package/dist/cjs/components/src/components/Templates/RecommendationBundle/index.d.ts

@@ -0,0 +1,2 @@
+export * from './RecommendationBundle';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/src/components/Templates/RecommendationBundle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundle/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}

package/dist/cjs/components/src/components/Templates/RecommendationBundle/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./RecommendationBundle"), exports);

package/dist/cjs/components/src/components/Templates/RecommendationBundleEasyAdd/RecommendationBundleEasyAdd.d.ts

@@ -0,0 +1,21 @@
+import { ComponentProps, ResultComponent } from '../../../types';
+import { RecommendationBundleLang, RecommendationBundleProps } from '../RecommendationBundle';
+import { Product } from '@athoscommerce/snap-store-mobx';
+import { AbstractController, RecommendationController } from '@athoscommerce/snap-controller';
+export declare const RecommendationBundleEasyAdd: ((properties: RecommendationBundleEasyAddProps) => import("@emotion/react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};
+export type RecommendationBundleEasyAddProps = {
+    controller: RecommendationController & AbstractController;
+    resultComponent?: ResultComponent<{
+        controller: RecommendationController;
+        seed?: boolean;
+        selected?: boolean;
+        onProductSelect?: (product: Product) => void;
+    }> | undefined;
+    alias?: string | undefined;
+    lang?: Partial<RecommendationBundleLang> | undefined;
+    results?: Product[] | undefined;
+} & RecommendationBundleEasyAddTemplatesLegalProps & ComponentProps<RecommendationBundleEasyAddProps>;
+export type RecommendationBundleEasyAddTemplatesLegalProps = Omit<RecommendationBundleProps, 'controller' | 'resultComponent' | 'alias' | 'lang' | 'results' | 'hideSeed' | 'limit' | 'hideCheckboxes' | 'carousel' | 'separatorIcon' | 'separatorIconSeedOnly' | 'preselectedCount' | 'breakpoints'>;
+//# sourceMappingURL=RecommendationBundleEasyAdd.d.ts.map

package/dist/cjs/components/src/components/Templates/RecommendationBundleEasyAdd/RecommendationBundleEasyAdd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecommendationBundleEasyAdd.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundleEasyAdd/RecommendationBundleEasyAdd.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,eAAe,EAAe,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAwB,wBAAwB,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AACpH,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAY9F,eAAO,MAAM,2BAA2B,gBAAyB,gCAAgC;;CAwC/F,CAAC;AAEH,MAAM,MAAM,gCAAgC,GAAG;IAC9C,UAAU,EAAE,wBAAwB,GAAG,kBAAkB,CAAC;IAC1D,eAAe,CAAC,EACb,eAAe,CAAC;QAChB,UAAU,EAAE,wBAAwB,CAAC;QACrC,IAAI,CAAC,EAAE,OAAO,CAAC;QACf,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;KAC5C,CAAC,GACF,SAAS,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,SAAS,CAAC;IACrD,OAAO,CAAC,EAAE,OAAO,EAAE,GAAG,SAAS,CAAC;CAChC,GAAG,8CAA8C,GACjD,cAAc,CAAC,gCAAgC,CAAC,CAAC;AAElD,MAAM,MAAM,8CAA8C,GAAG,IAAI,CAChE,yBAAyB,EACvB,YAAY,GACZ,iBAAiB,GACjB,OAAO,GACP,MAAM,GACN,SAAS,GACT,UAAU,GACV,OAAO,GACP,gBAAgB,GAChB,UAAU,GACV,eAAe,GACf,uBAAuB,GACvB,kBAAkB,GAClB,aAAa,CACf,CAAC"}

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

@@ -0,0 +1,61 @@
+"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 () {
+    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)();
+    //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({ 
+            // default props
+            hideCheckboxes: true, seedText: '', ctaButtonText: 'Add Both', ctaInline: false, hideSeed: true, alias: alias, 
+            // vertical: true,
+            limit: 1, carousel: {
+                enabled: false,
+            }, separatorIcon: false }, (0, utilities_1.defined)({
+            disableStyles: disableStyles,
+        })), { 
+            // component theme overrides
+            theme: _properties === null || _properties === void 0 ? void 0 : _properties.theme, treePath: 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));
+});

package/dist/cjs/components/src/components/Templates/RecommendationBundleEasyAdd/index.d.ts

@@ -0,0 +1,2 @@
+export * from './RecommendationBundleEasyAdd';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/src/components/Templates/RecommendationBundleEasyAdd/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Templates/RecommendationBundleEasyAdd/index.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC"}

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./RecommendationBundleEasyAdd"), exports);