@crystaldesign/widget-image-carousel 25.10.0-beta.9 → 25.10.0-rc.2

package/build/esm/index.js

@@ -1,7 +1,7 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { useState, useCallback, useEffect } from 'react';
+import { useState, useCallback, useEffect, useMemo } from 'react';
 import { useCss, useProductData, MediaItem, useConfiguration } from '@crystaldesign/widget-library';
-import { useDivaCore } from '@crystaldesign/diva-core';
+import { useDivaCore, useTranslation } from '@crystaldesign/diva-core';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
@@ -10,7 +10,7 @@ import { Navigation } from 'swiper/modules';
 import classNames from 'classnames';
 import 'swiper/css';
 import 'swiper/css/navigation';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 (function() {
     const env = {"STAGE":"production"};
@@ -28,7 +28,7 @@ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function useImageCarousel(_ref) {
-  var productId = _ref.productId,
+  var productIds = _ref.productIds,
     settings = _ref.settings;
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
@@ -42,36 +42,54 @@ function useImageCarousel(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     error = _useState6[0],
     setError = _useState6[1];
+  var _useDivaCore = useDivaCore(),
+    openComponent = _useDivaCore.actions.openComponent;
   useCss(settings);
   var _useProductData = useProductData({
-      productIds: productId,
+      productIds: productIds,
       widgetType: 'IMAGECAROUSEL'
     }),
     getProductsByDivaNrs = _useProductData.getProductsByDivaNrs,
     getProductByDivaNrAndVariantId = _useProductData.getProductByDivaNrAndVariantId,
     setSelectedProductId = _useProductData.setSelectedProductId,
     selectedProduct = _useProductData.selectedProduct,
-    setProductCache = _useProductData.setProductCache;
+    setProductCache = _useProductData.setProductCache,
+    getSimpleProductListByIds = _useProductData.getSimpleProductListByIds;
   var onClickProduct = useCallback(function (productId) {
-    setSelectedProductId(productId);
-    if (!settings.disableScrollToTop) {
-      window.scrollTo({
-        top: 0,
-        behavior: 'smooth'
-      });
+    var _settings$openConfigu;
+    if ((_settings$openConfigu = settings.openConfiguratorCta) !== null && _settings$openConfigu !== void 0 && _settings$openConfigu.enabled) {
+      openConfigurator(productId);
+    } else {
+      setSelectedProductId(productId);
+      if (!settings.disableScrollToTop) {
+        window.scrollTo({
+          top: 0,
+          behavior: 'smooth'
+        });
+      }
     }
-  }, [setSelectedProductId]);
+  }, [setSelectedProductId, settings.openConfiguratorCta]);
+  var openConfigurator = function openConfigurator(productId) {
+    openComponent({
+      type: 'DIVA_WEBPLANNER',
+      parameters: {
+        productId: productId
+      },
+      openInFullscreen: true,
+      absoluteFullscreen: true
+    });
+  };
   useEffect(function () {
     var loadMockups = /*#__PURE__*/function () {
       var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        var _settings$mediaFuncti, mediaFunctionType, foundMedia, _foundMedia;
+        var _settings$mediaFuncti, mediaFunctionType, foundMedia, _foundMedia, _foundMedia2;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               _context.prev = 0;
               setLoading(true);
               if (!selectedProduct) {
-                _context.next = 19;
+                _context.next = 26;
                 break;
               }
               mediaFunctionType = (_settings$mediaFuncti = settings.mediaFunctionType) !== null && _settings$mediaFuncti !== void 0 ? _settings$mediaFuncti : 'SHO';
@@ -86,7 +104,7 @@ function useImageCarousel(_ref) {
               if (foundMedia) {
                 setMedia(foundMedia);
               }
-              _context.next = 19;
+              _context.next = 26;
               break;
             case 11:
               if (!(settings.type === 'SIMILAR_PRODUCTS')) {
@@ -100,41 +118,55 @@ function useImageCarousel(_ref) {
               if (_foundMedia) {
                 setMedia(_foundMedia);
               }
-              _context.next = 19;
+              _context.next = 26;
               break;
             case 18:
-              throw new Error('Invalid type');
-            case 19:
-              _context.next = 25;
-              break;
+              if (!(settings.type === 'SIMPLE_PRODUCT_LIST' && productIds)) {
+                _context.next = 25;
+                break;
+              }
+              _context.next = 21;
+              return getSimpleProductList(productIds, mediaFunctionType, settings.description);
             case 21:
-              _context.prev = 21;
+              _foundMedia2 = _context.sent;
+              if (_foundMedia2) {
+                setMedia(_foundMedia2);
+              }
+              _context.next = 26;
+              break;
+            case 25:
+              throw new Error('Invalid type or invalid data');
+            case 26:
+              _context.next = 32;
+              break;
+            case 28:
+              _context.prev = 28;
               _context.t0 = _context["catch"](0);
               console.error(_context.t0);
               setError(_context.t0);
-            case 25:
-              _context.prev = 25;
+            case 32:
+              _context.prev = 32;
               setLoading(false);
-              return _context.finish(25);
-            case 28:
+              return _context.finish(32);
+            case 35:
             case "end":
               return _context.stop();
           }
-        }, _callee, null, [[0, 21, 25, 28]]);
+        }, _callee, null, [[0, 28, 32, 35]]);
       }));
       return function loadMockups() {
         return _ref2.apply(this, arguments);
       };
     }();
-    if (selectedProduct && productId) {
+    if (selectedProduct && productIds !== null && productIds !== void 0 && productIds.length) {
       loadMockups();
     }
-  }, [selectedProduct, productId]);
+  }, [selectedProduct, productIds]);
   return {
     media: media,
     error: error,
     loading: loading,
-    setSelectedProductId: onClickProduct
+    onClickProduct: onClickProduct
   };
   function getWallMockups(_x, _x2) {
     return _getWallMockups.apply(this, arguments);
@@ -367,7 +399,7 @@ function useImageCarousel(_ref) {
                   }
                 }, _callee3);
               }));
-              return function (_x6) {
+              return function (_x9) {
                 return _ref3.apply(this, arguments);
               };
             }()));
@@ -401,14 +433,75 @@ function useImageCarousel(_ref) {
     }));
     return _getSimilarProductMedia.apply(this, arguments);
   }
+  function getSimpleProductList(_x6, _x7, _x8) {
+    return _getSimpleProductList.apply(this, arguments);
+  }
+  function _getSimpleProductList() {
+    _getSimpleProductList = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(productIds, mediaFunctionType, description) {
+      var productIdsArray, products;
+      return _regeneratorRuntime.wrap(function _callee5$(_context8) {
+        while (1) switch (_context8.prev = _context8.next) {
+          case 0:
+            productIdsArray = Array.isArray(productIds) ? productIds : productIds.split(';');
+            _context8.next = 3;
+            return getSimpleProductListByIds(productIdsArray);
+          case 3:
+            products = _context8.sent;
+            return _context8.abrupt("return", products.data.map(function (p) {
+              var _p$media$find$url, _p$media, _p$description;
+              return {
+                url: (_p$media$find$url = p === null || p === void 0 || (_p$media = p.media) === null || _p$media === void 0 || (_p$media = _p$media.find(function (m) {
+                  return m.functionType === mediaFunctionType;
+                })) === null || _p$media === void 0 ? void 0 : _p$media.url) !== null && _p$media$find$url !== void 0 ? _p$media$find$url : p.image,
+                productId: p._id,
+                description: description ? (_p$description = p[description]) !== null && _p$description !== void 0 ? _p$description : description : undefined
+              };
+            }));
+          case 5:
+          case "end":
+            return _context8.stop();
+        }
+      }, _callee5);
+    }));
+    return _getSimpleProductList.apply(this, arguments);
+  }
 }
 
+var OpenConfiguratorButton = function OpenConfiguratorButton(_ref) {
+  var _settings$ctaText;
+  var settings = _ref.settings,
+    onClick = _ref.onClick;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  if (!settings.enabled) return /*#__PURE__*/jsx(Fragment, {});
+  return /*#__PURE__*/jsx("button", {
+    className: classNames('widget-image-carousel-open-configurator-button', settings.className),
+    onClick: onClick,
+    children: /*#__PURE__*/jsxs("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center'
+      },
+      children: [/*#__PURE__*/jsx("span", {
+        className: "widget-image-carousel-open-configurator-text",
+        children: (_settings$ctaText = settings.ctaText) !== null && _settings$ctaText !== void 0 ? _settings$ctaText : t('configurator.CONFIGURE_NOW')
+      }), settings.ctaIcon && /*#__PURE__*/jsx("img", {
+        src: settings.ctaIcon,
+        alt: "Configurator Icon",
+        className: "widget-image-carousel-open-configurator-icon"
+      })]
+    })
+  });
+};
+
 function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SwiperComponent = function SwiperComponent(_ref) {
   var media = _ref.media,
     settings = _ref.settings,
-    setSelectedProductId = _ref.setSelectedProductId;
+    onClickProduct = _ref.onClickProduct,
+    isMobile = _ref.isMobile;
   return /*#__PURE__*/jsx("div", {
     className: classNames(['diva-widget-image-carousel-container']),
     children: /*#__PURE__*/jsx(Swiper, _objectSpread$1(_objectSpread$1({
@@ -417,12 +510,13 @@ var SwiperComponent = function SwiperComponent(_ref) {
       className: classNames(['diva-widget-image-carousel-swiper'])
     }, settings.sliderProp), {}, {
       children: media.map(function (m, i) {
+        var _settings$openConfigu, _settings$openConfigu2, _settings$openConfigu3, _settings$openConfigu4;
         return /*#__PURE__*/jsx(SwiperSlide, {
           className: classNames(['diva-widget-image-carousel-slide']),
           children: settings.description ? /*#__PURE__*/jsxs("div", {
             className: classNames(['diva-widget-image-carousel-slide-description-image']),
             onClick: function onClick() {
-              return setSelectedProductId(m.productId);
+              return onClickProduct(m.productId);
             },
             children: [/*#__PURE__*/jsx(MediaItem, {
               mediaUrl: m.url,
@@ -430,6 +524,17 @@ var SwiperComponent = function SwiperComponent(_ref) {
               config: {
                 disableSirv: false,
                 sirvProps: settings.sirvProps
+              },
+              overlay: !isMobile && (_settings$openConfigu = settings.openConfiguratorCta) !== null && _settings$openConfigu !== void 0 && _settings$openConfigu.enabled ? /*#__PURE__*/jsx(OpenConfiguratorButton, {
+                settings: settings.openConfiguratorCta,
+                onClick: function onClick() {
+                  return onClickProduct(m.productId);
+                }
+              }) : undefined
+            }), ((_settings$openConfigu2 = settings.openConfiguratorCta) === null || _settings$openConfigu2 === void 0 ? void 0 : _settings$openConfigu2.enabled) && isMobile && /*#__PURE__*/jsx(OpenConfiguratorButton, {
+              settings: settings.openConfiguratorCta,
+              onClick: function onClick() {
+                return onClickProduct(m.productId);
               }
             }), /*#__PURE__*/jsx("div", {
               className: classNames(['diva-widget-image-carousel-slide-description']),
@@ -437,17 +542,30 @@ var SwiperComponent = function SwiperComponent(_ref) {
                 children: m.description
               })
             })]
-          }) : /*#__PURE__*/jsx(MediaItem, {
-            mediaUrl: m.url,
-            isCurrentlyVisible: true,
-            config: {
-              disableSirv: false,
-              sirvProps: settings.sirvProps
-            },
-            className: classNames(['diva-widget-image-carousel-slide-image']),
-            onClick: function onClick() {
-              return setSelectedProductId(m.productId);
-            }
+          }) : /*#__PURE__*/jsxs(Fragment, {
+            children: [/*#__PURE__*/jsx(MediaItem, {
+              mediaUrl: m.url,
+              isCurrentlyVisible: true,
+              config: {
+                disableSirv: false,
+                sirvProps: settings.sirvProps
+              },
+              className: classNames(['diva-widget-image-carousel-slide-image']),
+              onClick: function onClick() {
+                return onClickProduct(m.productId);
+              },
+              overlay: !isMobile && (_settings$openConfigu3 = settings.openConfiguratorCta) !== null && _settings$openConfigu3 !== void 0 && _settings$openConfigu3.enabled ? /*#__PURE__*/jsx(OpenConfiguratorButton, {
+                settings: settings.openConfiguratorCta,
+                onClick: function onClick() {
+                  return onClickProduct(m.productId);
+                }
+              }) : undefined
+            }), ((_settings$openConfigu4 = settings.openConfiguratorCta) === null || _settings$openConfigu4 === void 0 ? void 0 : _settings$openConfigu4.enabled) && isMobile && /*#__PURE__*/jsx(OpenConfiguratorButton, {
+              settings: settings.openConfiguratorCta,
+              onClick: function onClick() {
+                return onClickProduct(m.productId);
+              }
+            })]
           })
         }, i);
       })
@@ -458,16 +576,17 @@ var SwiperComponent = function SwiperComponent(_ref) {
 var ImageList = function ImageList(_ref) {
   var media = _ref.media,
     settings = _ref.settings,
-    setSelectedProductId = _ref.setSelectedProductId;
+    onClickProduct = _ref.onClickProduct;
   return /*#__PURE__*/jsx("div", {
     className: classNames(['diva-widget-image-list']),
     children: media.map(function (m, i) {
+      var _settings$openConfigu, _settings$openConfigu2;
       return /*#__PURE__*/jsx("div", {
         className: classNames(['diva-widget-image-list-item']),
         children: settings.description ? /*#__PURE__*/jsxs("div", {
           className: classNames(['diva-widget-image-list-item-description-image']),
           onClick: function onClick() {
-            return setSelectedProductId(m.productId);
+            return onClickProduct(m.productId);
           },
           children: [/*#__PURE__*/jsx(MediaItem, {
             mediaUrl: m.url,
@@ -476,23 +595,35 @@ var ImageList = function ImageList(_ref) {
               disableSirv: false,
               sirvProps: settings.sirvProps
             }
+          }), ((_settings$openConfigu = settings.openConfiguratorCta) === null || _settings$openConfigu === void 0 ? void 0 : _settings$openConfigu.enabled) && /*#__PURE__*/jsx(OpenConfiguratorButton, {
+            settings: settings.openConfiguratorCta,
+            onClick: function onClick() {
+              return onClickProduct(m.productId);
+            }
           }), /*#__PURE__*/jsx("div", {
             className: classNames(['diva-widget-image-list-item-description']),
             children: /*#__PURE__*/jsx("span", {
               children: m.description
             })
           })]
-        }) : /*#__PURE__*/jsx(MediaItem, {
-          mediaUrl: m.url,
-          isCurrentlyVisible: true,
-          config: {
-            disableSirv: false,
-            sirvProps: settings.sirvProps
-          },
-          className: classNames(['diva-widget-image-list-item-image']),
-          onClick: function onClick() {
-            return setSelectedProductId(m.productId);
-          }
+        }) : /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx(MediaItem, {
+            mediaUrl: m.url,
+            isCurrentlyVisible: true,
+            config: {
+              disableSirv: false,
+              sirvProps: settings.sirvProps
+            },
+            className: classNames(['diva-widget-image-list-item-image']),
+            onClick: function onClick() {
+              return onClickProduct(m.productId);
+            }
+          }), ((_settings$openConfigu2 = settings.openConfiguratorCta) === null || _settings$openConfigu2 === void 0 ? void 0 : _settings$openConfigu2.enabled) && /*#__PURE__*/jsx(OpenConfiguratorButton, {
+            settings: settings.openConfiguratorCta,
+            onClick: function onClick() {
+              return onClickProduct(m.productId);
+            }
+          })]
         })
       }, i);
     })
@@ -504,35 +635,39 @@ function MainComponent(props) {
     media = _useImageCarousel.media,
     error = _useImageCarousel.error;
     _useImageCarousel.loading;
-    var setSelectedProductId = _useImageCarousel.setSelectedProductId;
+    var onClickProduct = _useImageCarousel.onClickProduct;
   var _useDivaCore = useDivaCore(),
     isMobile = _useDivaCore.state.isMobile;
   if (error) return /*#__PURE__*/jsx("div", {
     children: "Error"
   });
-  if (isMobile && !props.settings.avoidUsingSwiperOnMobile) {
+  if (isMobile && props.settings.avoidUsingSwiperOnMobile) {
     return /*#__PURE__*/jsx(ImageList, {
       media: media,
       settings: props.settings,
-      setSelectedProductId: setSelectedProductId
+      onClickProduct: onClickProduct
     });
   }
   return /*#__PURE__*/jsx(SwiperComponent, {
     media: media,
     settings: props.settings,
-    setSelectedProductId: setSelectedProductId
+    onClickProduct: onClickProduct,
+    isMobile: isMobile
   });
 }
 
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Main = function Main(_ref) {
-  var _parameters$productId;
   var settings = _ref.settings,
     parameters = _ref.parameters;
+  var productIds = useMemo(function () {
+    var _parameters$productId, _parameters$productId2;
+    return (_parameters$productId = parameters === null || parameters === void 0 || (_parameters$productId2 = parameters.productIds) === null || _parameters$productId2 === void 0 ? void 0 : _parameters$productId2.split(';')) !== null && _parameters$productId !== void 0 ? _parameters$productId : [];
+  }, [parameters === null || parameters === void 0 ? void 0 : parameters.productIds]);
   return /*#__PURE__*/jsx(ImageCarouselComponent, {
     settings: settings,
-    productId: (_parameters$productId = parameters === null || parameters === void 0 ? void 0 : parameters.productId) !== null && _parameters$productId !== void 0 ? _parameters$productId : ''
+    productIds: productIds
   });
 };
 var ImageCarouselComponent = function ImageCarouselComponent(props) {

package/build/types/widget-image-carousel/src/components/ImageList/index.d.ts

@@ -1,10 +1,9 @@
 import React from 'react';
-import { Media } from '@crystaldesign/widget-image-carousel/useImageCarousel';
-import { Configuration } from '@crystaldesign/widget-image-carousel/types';
+import { Configuration, Media } from '@crystaldesign/widget-image-carousel/types';
 interface ImageListProps {
     media: Media[];
     settings: Configuration;
-    setSelectedProductId: (id: string) => void;
+    onClickProduct: (id: string) => void;
 }
 export declare const ImageList: React.FC<ImageListProps>;
 export {};

package/build/types/widget-image-carousel/src/components/ImageList/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ImageList/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,KAAK,EAAE,MAAM,uDAAuD,CAAC;AAC9E,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,UAAU,cAAc;IACtB,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,QAAQ,EAAE,aAAa,CAAC;IACxB,oBAAoB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAyB9C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ImageList/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,4CAA4C,CAAC;AAGlF,UAAU,cAAc;IACtB,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,QAAQ,EAAE,aAAa,CAAC;IACxB,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAiC9C,CAAC"}

package/build/types/widget-image-carousel/src/components/OpenConfiguratorButton/index.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface OpenConfiguratorButtonProps {
+    settings: {
+        enabled: boolean;
+        className: string;
+        ctaText?: string;
+        ctaIcon?: string;
+    };
+    onClick: () => void;
+}
+export declare const OpenConfiguratorButton: React.FC<OpenConfiguratorButtonProps>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/build/types/widget-image-carousel/src/components/OpenConfiguratorButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/OpenConfiguratorButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,2BAA2B;IACnC,QAAQ,EAAE;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,SAAS,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtF,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAWxE,CAAC"}

package/build/types/widget-image-carousel/src/components/Swiper/index.d.ts

@@ -1,12 +1,12 @@
 import React from 'react';
 import 'swiper/css';
 import 'swiper/css/navigation';
-import { Media } from '@crystaldesign/widget-image-carousel/useImageCarousel';
-import { Configuration } from '@crystaldesign/widget-image-carousel/types';
+import { Configuration, Media } from '@crystaldesign/widget-image-carousel/types';
 interface SwiperComponentProps {
     media: Media[];
     settings: Configuration;
-    setSelectedProductId: (id: string) => void;
+    onClickProduct: (id: string) => void;
+    isMobile: boolean;
 }
 export declare const SwiperComponent: React.FC<SwiperComponentProps>;
 export {};

package/build/types/widget-image-carousel/src/components/Swiper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Swiper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,YAAY,CAAC;AACpB,OAAO,uBAAuB,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,uDAAuD,CAAC;AAC9E,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,UAAU,oBAAoB;IAC5B,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,QAAQ,EAAE,aAAa,CAAC;IACxB,oBAAoB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2B1D,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/Swiper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,YAAY,CAAC;AACpB,OAAO,uBAAuB,CAAC;AAC/B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,4CAA4C,CAAC;AAGlF,UAAU,oBAAoB;IAC5B,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,QAAQ,EAAE,aAAa,CAAC;IACxB,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAiD1D,CAAC"}

package/build/types/widget-image-carousel/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAkB,MAAM,0BAA0B,CAAC;AAG/E,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAM5D,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAG/D,CAAC;AAEF,QAAA,MAAM,aAAa,EAAE,mBAAmB,CAAC,aAAa,CAGrD,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,mBAAmB,EAAkB,MAAM,0BAA0B,CAAC;AAG/E,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAO5D,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAG/D,CAAC;AAEF,QAAA,MAAM,aAAa,EAAE,mBAAmB,CAAC,aAAa,CAGrD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/build/types/widget-image-carousel/src/stories/SimpleProductList/kirchner-prod.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { WithDivaMock } from '@crystaldesign/diva-core';
+import { ImageCarouselProps } from '../../types';
+declare const meta: Meta<WithDivaMock<ImageCarouselProps>>;
+export default meta;
+type Story = StoryObj<WithDivaMock<ImageCarouselProps>>;
+export declare const ImageCarousel: Story;
+//# sourceMappingURL=kirchner-prod.stories.d.ts.map

package/build/types/widget-image-carousel/src/stories/SimpleProductList/kirchner-prod.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kirchner-prod.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/stories/SimpleProductList/kirchner-prod.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAqB,MAAM,0BAA0B,CAAC;AAG3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAIjD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAmBhD,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC,CAAC;AA8CxD,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAC"}

package/build/types/widget-image-carousel/src/types/index.d.ts

@@ -2,10 +2,10 @@ import { BaseConfiguration } from '@crystaldesign/widget-library';
 import { SwiperProps } from 'swiper/react';
 export interface ImageCarouselProps {
     settings: Configuration;
-    productId: string;
+    productIds: string | string[];
 }
 export interface Configuration extends BaseConfiguration {
-    type: 'WALL_MOCKUPS' | 'SIMILAR_PRODUCTS';
+    type: 'WALL_MOCKUPS' | 'SIMILAR_PRODUCTS' | 'SIMPLE_PRODUCT_LIST';
     mediaFunctionType?: string;
     description?: string;
     sliderProp?: SwiperProps;
@@ -14,5 +14,16 @@ export interface Configuration extends BaseConfiguration {
         [data: string]: string;
     };
     avoidUsingSwiperOnMobile?: boolean;
+    openConfiguratorCta?: {
+        enabled: boolean;
+        className: string;
+        ctaText?: string;
+        ctaIcon?: string;
+    };
+}
+export interface Media {
+    url: string;
+    description?: string;
+    productId: string;
 }
 //# sourceMappingURL=index.d.ts.map

package/build/types/widget-image-carousel/src/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,aAAa,CAAC;IACxB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,aAAc,SAAQ,iBAAiB;IACtD,IAAI,EAAE,cAAc,GAAG,kBAAkB,CAAC;IAC1C,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,CAAC,EAAE;QAAE,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IACvC,wBAAwB,CAAC,EAAE,OAAO,CAAC;CACpC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmC,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AACnG,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,aAAa,CAAC;IACxB,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAC/B;AAED,MAAM,WAAW,aAAc,SAAQ,iBAAiB;IACtD,IAAI,EAAE,cAAc,GAAG,kBAAkB,GAAG,qBAAqB,CAAC;IAClE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,CAAC,EAAE;QAAE,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IACvC,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,mBAAmB,CAAC,EAAE;QACpB,OAAO,EAAE,OAAO,CAAC;QACjB,SAAS,EAAE,MAAM,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,KAAK;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;CACnB"}

package/build/types/widget-image-carousel/src/useImageCarousel.d.ts

@@ -1,13 +1,8 @@
-import { ImageCarouselProps } from './types';
-export interface Media {
-    url: string;
-    description?: string;
-    productId: string;
-}
-export declare function useImageCarousel({ productId, settings }: ImageCarouselProps): {
+import { ImageCarouselProps, Media } from './types';
+export declare function useImageCarousel({ productIds, settings }: ImageCarouselProps): {
     media: Media[];
     error: Error | undefined;
     loading: boolean;
-    setSelectedProductId: (productId: string) => void;
+    onClickProduct: (productId: string) => void;
 };
 //# sourceMappingURL=useImageCarousel.d.ts.map

package/build/types/widget-image-carousel/src/useImageCarousel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useImageCarousel.d.ts","sourceRoot":"","sources":["../../../../src/useImageCarousel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAM7C,MAAM,WAAW,KAAK;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,kBAAkB;;;;sCAa5D,MAAM;EA6JrB"}
+{"version":3,"file":"useImageCarousel.d.ts","sourceRoot":"","sources":["../../../../src/useImageCarousel.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAKpD,wBAAgB,gBAAgB,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,kBAAkB;;;;gCAiB7D,MAAM;EA2LrB"}