@cntrl-site/sdk 1.24.0 → 1.24.1

package/dist/index.mjs

@@ -3,8 +3,8 @@ import { URL } from "url";
 import { z } from "zod";
 import UAParser from "ua-parser-js";
 import * as MP4Box from "mp4box";
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from "react";
+import { jsxDEV, Fragment } from "react/jsx-dev-runtime";
+import { useState, useEffect, useRef, useMemo } from "react";
 import { Splide, SplideSlide } from "@splidejs/react-splide";
 import cn from "classnames";
 var SectionHeightMode = /* @__PURE__ */ ((SectionHeightMode2) => {
@@ -1303,7 +1303,7 @@ const bottomRightAlignment = "ControlSlider-module__bottomRightAlignment___kEwrz
 const clickOverlay = "ControlSlider-module__clickOverlay___DZA28";
 const contain = "ControlSlider-module__contain___pLyq7";
 const cover = "ControlSlider-module__cover___KdDat";
-const styles$2 = {
+const styles$3 = {
   wrapper,
   sliderItem,
   sliderImage,
@@ -1347,23 +1347,39 @@ const styles$2 = {
   contain,
   cover
 };
-const link = "RichTextRenderer-module__link___BWeZ2";
-const styles$1 = {
-  link
+const link$1 = "RichTextRenderer-module__link___BWeZ2";
+const styles$2 = {
+  link: link$1
 };
 const RichTextRenderer = ({ content }) => {
   const getChildren = (children) => {
     return children.map((child, i) => {
       if (child.type === "link") {
-        return /* @__PURE__ */ jsx("a", { className: styles$1.link, href: child.value, target: child.target, children: getChildren(child.children) }, i);
+        return /* @__PURE__ */ jsxDEV("a", { className: styles$2.link, href: child.value, target: child.target, children: getChildren(child.children) }, i, false, {
+          fileName: "H:/mom/sdk/src/Components/helpers/RichTextRenderer/RichTextRenderer.tsx",
+          lineNumber: 13,
+          columnNumber: 16
+        }, void 0);
       }
-      return /* @__PURE__ */ jsx("span", { style: getLeafCss(child), children: child.text }, i);
+      return /* @__PURE__ */ jsxDEV("span", { style: getLeafCss(child), children: child.text }, i, false, {
+        fileName: "H:/mom/sdk/src/Components/helpers/RichTextRenderer/RichTextRenderer.tsx",
+        lineNumber: 15,
+        columnNumber: 14
+      }, void 0);
     });
   };
-  return /* @__PURE__ */ jsx(Fragment, { children: content.map((block, i) => {
+  return /* @__PURE__ */ jsxDEV(Fragment, { children: content.map((block, i) => {
     const children = block.children;
-    return /* @__PURE__ */ jsx("div", { children: getChildren(children) }, i);
-  }) });
+    return /* @__PURE__ */ jsxDEV("div", { children: getChildren(children) }, i, false, {
+      fileName: "H:/mom/sdk/src/Components/helpers/RichTextRenderer/RichTextRenderer.tsx",
+      lineNumber: 23,
+      columnNumber: 11
+    }, void 0);
+  }) }, void 0, false, {
+    fileName: "H:/mom/sdk/src/Components/helpers/RichTextRenderer/RichTextRenderer.tsx",
+    lineNumber: 19,
+    columnNumber: 5
+  }, void 0);
 };
 function getLeafCss(leaf) {
   return {
@@ -1383,7 +1399,7 @@ function scalingValue(value, isEditor = false) {
 }
 const svg = "SvgImage-module__svg___q3xE-";
 const img = "SvgImage-module__img___VsTm-";
-const styles = {
+const styles$1 = {
   svg,
   img
 };
@@ -1396,31 +1412,43 @@ const SvgImage = ({ url, fill = "#000000", hoverFill = "#CCCCCC", className = ""
     }
   }, []);
   if (!url.endsWith(".svg") || !supportsMask) {
-    return /* @__PURE__ */ jsx("img", { src: url, alt: "", className: cn(styles.img, className) });
+    return /* @__PURE__ */ jsxDEV("img", { src: url, alt: "", className: cn(styles$1.img, className) }, void 0, false, {
+      fileName: "H:/mom/sdk/src/Components/helpers/SvgImage/SvgImage.tsx",
+      lineNumber: 23,
+      columnNumber: 12
+    }, void 0);
   }
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxDEV(
     "span",
     {
       "data-supports-mask": supportsMask,
-      className: cn(styles.svg, className),
+      className: cn(styles$1.svg, className),
       style: {
         "--svg": `url(${url})`,
         "--fill": fill,
         "--hover-fill": hoverFill
       }
-    }
+    },
+    void 0,
+    false,
+    {
+      fileName: "H:/mom/sdk/src/Components/helpers/SvgImage/SvgImage.tsx",
+      lineNumber: 27,
+      columnNumber: 5
+    },
+    void 0
   );
 };
 const alignmentClassName = {
-  "top-left": styles$2.topLeftAlignment,
-  "top-center": styles$2.topCenterAlignment,
-  "top-right": styles$2.topRightAlignment,
-  "middle-left": styles$2.middleLeftAlignment,
-  "middle-center": styles$2.middleCenterAlignment,
-  "middle-right": styles$2.middleRightAlignment,
-  "bottom-left": styles$2.bottomLeftAlignment,
-  "bottom-center": styles$2.bottomCenterAlignment,
-  "bottom-right": styles$2.bottomRightAlignment
+  "top-left": styles$3.topLeftAlignment,
+  "top-center": styles$3.topCenterAlignment,
+  "top-right": styles$3.topRightAlignment,
+  "middle-left": styles$3.middleLeftAlignment,
+  "middle-center": styles$3.middleCenterAlignment,
+  "middle-right": styles$3.middleRightAlignment,
+  "bottom-left": styles$3.bottomLeftAlignment,
+  "bottom-center": styles$3.bottomCenterAlignment,
+  "bottom-right": styles$3.bottomRightAlignment
 };
 function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
   const [sliderRef, setSliderRef] = useState(null);
@@ -1455,30 +1483,30 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
     setKey((prev) => prev + 1);
     prevSliderTypeRef.current = transition.type;
   }, [transition.type]);
-  return /* @__PURE__ */ jsx("div", { className: cn(styles$2.wrapper, { [styles$2.editor]: isEditor }), ref: setWrapperRef, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxDEV("div", { className: cn(styles$3.wrapper, { [styles$3.editor]: isEditor }), ref: setWrapperRef, children: /* @__PURE__ */ jsxDEV(
     "div",
     {
-      className: styles$2.sliderInner,
+      className: styles$3.sliderInner,
       style: {
         width: sliderDimensions ? sliderDimensions.width : "100%",
         height: sliderDimensions ? sliderDimensions.height : "100%",
         backgroundColor: transition.backgroundColor && transition.type === "fade in" ? transition.backgroundColor : "transparent"
       },
       children: [
-        settings.caption.isActive && /* @__PURE__ */ jsx(
+        settings.caption.isActive && /* @__PURE__ */ jsxDEV(
           "div",
           {
-            className: cn(styles$2.captionBlock),
-            children: /* @__PURE__ */ jsx(
+            className: cn(styles$3.captionBlock),
+            children: /* @__PURE__ */ jsxDEV(
               "div",
               {
-                className: styles$2.captionTextWrapper,
-                children: content.map((item, index) => /* @__PURE__ */ jsx(
+                className: styles$3.captionTextWrapper,
+                children: content.map((item, index) => /* @__PURE__ */ jsxDEV(
                   "div",
                   {
-                    className: cn(styles$2.captionText, alignmentClassName[caption.alignment], {
-                      [styles$2.withPointerEvents]: index === currentSlideIndex && isEditor,
-                      [styles$2.active]: index === currentSlideIndex
+                    className: cn(styles$3.captionText, alignmentClassName[caption.alignment], {
+                      [styles$3.withPointerEvents]: index === currentSlideIndex && isEditor,
+                      [styles$3.active]: index === currentSlideIndex
                     }),
                     style: {
                       fontFamily: fontSettings.fontFamily,
@@ -1496,28 +1524,63 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
                       color,
                       transitionDuration: transition.duration ? `${Math.round(parseInt(transition.duration) / 2)}ms` : "500ms"
                     },
-                    children: /* @__PURE__ */ jsx(
+                    children: /* @__PURE__ */ jsxDEV(
                       "div",
                       {
                         "data-styles": "caption",
-                        className: styles$2.captionTextInner,
+                        className: styles$3.captionTextInner,
                         style: {
                           "--link-hover-color": caption.hover,
                           position: "relative",
                           top: scalingValue(caption.offset.y, isEditor),
                           left: scalingValue(caption.offset.x, isEditor)
                         },
-                        children: /* @__PURE__ */ jsx(RichTextRenderer, { content: item.imageCaption })
-                      }
+                        children: /* @__PURE__ */ jsxDEV(RichTextRenderer, { content: item.imageCaption }, void 0, false, {
+                          fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                          lineNumber: 115,
+                          columnNumber: 19
+                        }, this)
+                      },
+                      void 0,
+                      false,
+                      {
+                        fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                        lineNumber: 105,
+                        columnNumber: 17
+                      },
+                      this
                     )
                   },
-                  index
+                  index,
+                  false,
+                  {
+                    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                    lineNumber: 82,
+                    columnNumber: 15
+                  },
+                  this
                 ))
-              }
+              },
+              void 0,
+              false,
+              {
+                fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                lineNumber: 78,
+                columnNumber: 11
+              },
+              this
             )
-          }
+          },
+          void 0,
+          false,
+          {
+            fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+            lineNumber: 75,
+            columnNumber: 9
+          },
+          this
         ),
-        /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsxDEV(
           Splide,
           {
             onMove: (e) => {
@@ -1540,138 +1603,241 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
               type: transition.type === "fade in" ? "fade" : "loop",
               rewind: true
             },
-            children: content.map((item, index) => /* @__PURE__ */ jsx(SplideSlide, { children: /* @__PURE__ */ jsx(
+            children: content.map((item, index) => /* @__PURE__ */ jsxDEV(SplideSlide, { children: /* @__PURE__ */ jsxDEV(
               "div",
               {
-                className: styles$2.sliderItem,
-                children: /* @__PURE__ */ jsx(
+                className: styles$3.sliderItem,
+                children: /* @__PURE__ */ jsxDEV(
                   "div",
                   {
-                    className: styles$2.imgWrapper,
-                    children: /* @__PURE__ */ jsx(
+                    className: styles$3.imgWrapper,
+                    children: /* @__PURE__ */ jsxDEV(
                       "img",
                       {
-                        className: cn(styles$2.sliderImage, {
-                          [styles$2.contain]: item.image.objectFit === "contain",
-                          [styles$2.cover]: item.image.objectFit === "cover"
+                        className: cn(styles$3.sliderImage, {
+                          [styles$3.contain]: item.image.objectFit === "contain",
+                          [styles$3.cover]: item.image.objectFit === "cover"
                         }),
                         src: item.image.url,
                         alt: item.image.name ?? ""
-                      }
+                      },
+                      void 0,
+                      false,
+                      {
+                        fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                        lineNumber: 153,
+                        columnNumber: 17
+                      },
+                      this
                     )
-                  }
+                  },
+                  void 0,
+                  false,
+                  {
+                    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                    lineNumber: 150,
+                    columnNumber: 15
+                  },
+                  this
                 )
-              }
-            ) }, index))
+              },
+              void 0,
+              false,
+              {
+                fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                lineNumber: 147,
+                columnNumber: 13
+              },
+              this
+            ) }, index, false, {
+              fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+              lineNumber: 146,
+              columnNumber: 11
+            }, this))
+          },
+          key,
+          false,
+          {
+            fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+            lineNumber: 122,
+            columnNumber: 7
           },
-          key
+          this
         ),
-        controls.isActive && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
+        controls.isActive && /* @__PURE__ */ jsxDEV(Fragment, { children: [
+          /* @__PURE__ */ jsxDEV(
             "div",
             {
-              className: cn(styles$2.arrow, {
-                [styles$2.arrowVertical]: direction === "vert"
+              className: cn(styles$3.arrow, {
+                [styles$3.arrowVertical]: direction === "vert"
               }),
               style: {
                 color: controls.color,
                 ["--arrow-hover-color"]: controls.hover
               },
-              children: /* @__PURE__ */ jsxs(
+              children: /* @__PURE__ */ jsxDEV(
                 "button",
                 {
                   onClick: () => {
                     handleArrowClick("-1");
                   },
-                  className: styles$2.arrowInner,
+                  className: styles$3.arrowInner,
                   style: {
                     transform: `translate(${scalingValue(controlsOffsetX, isEditor)}, ${scalingValue(controlsOffsetY * (direction === "horiz" ? 1 : -1), isEditor)}) scale(${settings.controls.scale / 100}) rotate(${direction === "horiz" ? "0deg" : "90deg"})`
                   },
                   children: [
-                    controls.arrowsImgUrl && /* @__PURE__ */ jsx(
+                    controls.arrowsImgUrl && /* @__PURE__ */ jsxDEV(
                       SvgImage,
                       {
                         url: controls.arrowsImgUrl,
                         fill: controls.color,
                         hoverFill: controls.hover,
-                        className: cn(styles$2.arrowImg, styles$2.mirror)
-                      }
+                        className: cn(styles$3.arrowImg, styles$3.mirror)
+                      },
+                      void 0,
+                      false,
+                      {
+                        fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                        lineNumber: 186,
+                        columnNumber: 17
+                      },
+                      this
                     ),
-                    !controls.arrowsImgUrl && /* @__PURE__ */ jsx(ArrowIcon, { color: controls.color, className: cn(styles$2.arrowIcon, styles$2.arrowImg, styles$2.mirror) })
+                    !controls.arrowsImgUrl && /* @__PURE__ */ jsxDEV(ArrowIcon, { color: controls.color, className: cn(styles$3.arrowIcon, styles$3.arrowImg, styles$3.mirror) }, void 0, false, {
+                      fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                      lineNumber: 194,
+                      columnNumber: 17
+                    }, this)
                   ]
-                }
+                },
+                void 0,
+                true,
+                {
+                  fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                  lineNumber: 176,
+                  columnNumber: 13
+                },
+                this
               )
-            }
+            },
+            void 0,
+            false,
+            {
+              fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+              lineNumber: 167,
+              columnNumber: 11
+            },
+            this
           ),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsxDEV(
             "div",
             {
-              className: cn(styles$2.arrow, styles$2.nextArrow, {
-                [styles$2.arrowVertical]: direction === "vert"
+              className: cn(styles$3.arrow, styles$3.nextArrow, {
+                [styles$3.arrowVertical]: direction === "vert"
               }),
               style: {
                 color: controls.color,
                 ["--arrow-hover-color"]: controls.hover
               },
-              children: /* @__PURE__ */ jsxs(
+              children: /* @__PURE__ */ jsxDEV(
                 "button",
                 {
-                  className: styles$2.arrowInner,
+                  className: styles$3.arrowInner,
                   onClick: () => handleArrowClick("+1"),
                   style: {
                     transform: `translate(${scalingValue(controlsOffsetX * (direction === "horiz" ? -1 : 1), isEditor)}, ${scalingValue(controlsOffsetY, isEditor)}) scale(${settings.controls.scale / 100}) rotate(${direction === "horiz" ? "0deg" : "90deg"})`
                   },
                   children: [
-                    controls.arrowsImgUrl && /* @__PURE__ */ jsx(
+                    controls.arrowsImgUrl && /* @__PURE__ */ jsxDEV(
                       SvgImage,
                       {
                         url: controls.arrowsImgUrl,
                         fill: controls.color,
                         hoverFill: controls.hover,
-                        className: styles$2.arrowImg
-                      }
+                        className: styles$3.arrowImg
+                      },
+                      void 0,
+                      false,
+                      {
+                        fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                        lineNumber: 215,
+                        columnNumber: 17
+                      },
+                      this
                     ),
-                    !controls.arrowsImgUrl && /* @__PURE__ */ jsx(ArrowIcon, { color: controls.color, className: cn(styles$2.arrowIcon, styles$2.arrowImg) })
+                    !controls.arrowsImgUrl && /* @__PURE__ */ jsxDEV(ArrowIcon, { color: controls.color, className: cn(styles$3.arrowIcon, styles$3.arrowImg) }, void 0, false, {
+                      fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                      lineNumber: 223,
+                      columnNumber: 17
+                    }, this)
                   ]
-                }
+                },
+                void 0,
+                true,
+                {
+                  fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                  lineNumber: 207,
+                  columnNumber: 13
+                },
+                this
               )
-            }
+            },
+            void 0,
+            false,
+            {
+              fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+              lineNumber: 198,
+              columnNumber: 11
+            },
+            this
           )
-        ] }),
-        triggers.triggersList.click && /* @__PURE__ */ jsx(
+        ] }, void 0, true, {
+          fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+          lineNumber: 166,
+          columnNumber: 9
+        }, this),
+        triggers.triggersList.click && /* @__PURE__ */ jsxDEV(
           "div",
           {
-            className: styles$2.clickOverlay,
+            className: styles$3.clickOverlay,
             onClick: () => {
               if (sliderRef) {
                 sliderRef.go("+1");
               }
             }
-          }
+          },
+          void 0,
+          false,
+          {
+            fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+            lineNumber: 230,
+            columnNumber: 9
+          },
+          this
         ),
-        pagination2.isActive && /* @__PURE__ */ jsx(
+        pagination2.isActive && /* @__PURE__ */ jsxDEV(
           "div",
           {
-            className: cn(styles$2.pagination, {
-              [styles$2.paginationInsideBottom]: pagination2.position === "inside-1" && direction === "horiz",
-              [styles$2.paginationInsideTop]: pagination2.position === "inside-2" && direction === "horiz",
-              [styles$2.paginationOutsideBottom]: pagination2.position === "outside-1" && direction === "horiz",
-              [styles$2.paginationOutsideTop]: pagination2.position === "outside-2" && direction === "horiz",
-              [styles$2.paginationInsideLeft]: pagination2.position === "inside-1" && direction === "vert",
-              [styles$2.paginationInsideRight]: pagination2.position === "inside-2" && direction === "vert",
-              [styles$2.paginationOutsideLeft]: pagination2.position === "outside-1" && direction === "vert",
-              [styles$2.paginationOutsideRight]: pagination2.position === "outside-2" && direction === "vert",
-              [styles$2.paginationVertical]: direction === "vert"
+            className: cn(styles$3.pagination, {
+              [styles$3.paginationInsideBottom]: pagination2.position === "inside-1" && direction === "horiz",
+              [styles$3.paginationInsideTop]: pagination2.position === "inside-2" && direction === "horiz",
+              [styles$3.paginationOutsideBottom]: pagination2.position === "outside-1" && direction === "horiz",
+              [styles$3.paginationOutsideTop]: pagination2.position === "outside-2" && direction === "horiz",
+              [styles$3.paginationInsideLeft]: pagination2.position === "inside-1" && direction === "vert",
+              [styles$3.paginationInsideRight]: pagination2.position === "inside-2" && direction === "vert",
+              [styles$3.paginationOutsideLeft]: pagination2.position === "outside-1" && direction === "vert",
+              [styles$3.paginationOutsideRight]: pagination2.position === "outside-2" && direction === "vert",
+              [styles$3.paginationVertical]: direction === "vert"
             }),
-            children: /* @__PURE__ */ jsx(
+            children: /* @__PURE__ */ jsxDEV(
               "div",
               {
-                className: styles$2.paginationInner,
+                className: styles$3.paginationInner,
                 style: {
                   backgroundColor: pagination2.colors[2],
                   transform: `scale(${pagination2.scale / 100}) translate(${scalingValue(pagination2.offset.x, isEditor)}, ${scalingValue(pagination2.offset.y, isEditor)}) rotate(${direction === "horiz" ? "0deg" : "90deg"})`
                 },
-                children: content.map((_, index) => /* @__PURE__ */ jsx(
+                children: content.map((_, index) => /* @__PURE__ */ jsxDEV(
                   "button",
                   {
                     onClick: () => {
@@ -1679,32 +1845,87 @@ function ControlSlider({ settings, content, styles: sliderStyles, isEditor }) {
                         sliderRef.go(index);
                       }
                     },
-                    className: cn(styles$2.paginationItem),
-                    children: /* @__PURE__ */ jsx(
+                    className: cn(styles$3.paginationItem),
+                    children: /* @__PURE__ */ jsxDEV(
                       "div",
                       {
-                        className: cn(styles$2.dot, {
-                          [styles$2.activeDot]: index === currentSlideIndex
+                        className: cn(styles$3.dot, {
+                          [styles$3.activeDot]: index === currentSlideIndex
                         }),
                         style: {
                           backgroundColor: index === currentSlideIndex ? pagination2.colors[0] : pagination2.colors[1],
                           ["--pagination-hover-color"]: pagination2.hover
                         }
-                      }
+                      },
+                      void 0,
+                      false,
+                      {
+                        fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                        lineNumber: 270,
+                        columnNumber: 17
+                      },
+                      this
                     )
                   },
-                  index
+                  index,
+                  false,
+                  {
+                    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                    lineNumber: 261,
+                    columnNumber: 15
+                  },
+                  this
                 ))
-              }
+              },
+              void 0,
+              false,
+              {
+                fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+                lineNumber: 253,
+                columnNumber: 11
+              },
+              this
             )
-          }
+          },
+          void 0,
+          false,
+          {
+            fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+            lineNumber: 240,
+            columnNumber: 9
+          },
+          this
         )
       ]
-    }
-  ) });
+    },
+    void 0,
+    true,
+    {
+      fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+      lineNumber: 66,
+      columnNumber: 7
+    },
+    this
+  ) }, void 0, false, {
+    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+    lineNumber: 65,
+    columnNumber: 5
+  }, this);
 }
 function ArrowIcon({ color, className }) {
-  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 10 18", className, children: /* @__PURE__ */ jsx("g", { id: "Symbols", stroke: "none", strokeWidth: "1", fillRule: "evenodd", children: /* @__PURE__ */ jsx("path", { d: "M-3.70710678,4.29289322 C-3.34662282,3.93240926 -2.77939176,3.90467972 -2.38710056,4.20970461 L-2.29289322,4.29289322 L5,11.585 L12.2928932,4.29289322 C12.6533772,3.93240926 13.2206082,3.90467972 13.6128994,4.20970461 L13.7071068,4.29289322 C14.0675907,4.65337718 14.0953203,5.22060824 13.7902954,5.61289944 L13.7071068,5.70710678 L5.70710678,13.7071068 C5.34662282,14.0675907 4.77939176,14.0953203 4.38710056,13.7902954 L4.29289322,13.7071068 L-3.70710678,5.70710678 C-4.09763107,5.31658249 -4.09763107,4.68341751 -3.70710678,4.29289322 Z", id: "Shape-Copy", fill: color, transform: "translate(5, 9) rotate(-90) translate(-5, -9)" }) }) });
+  return /* @__PURE__ */ jsxDEV("svg", { viewBox: "0 0 10 18", className, children: /* @__PURE__ */ jsxDEV("g", { id: "Symbols", stroke: "none", strokeWidth: "1", fillRule: "evenodd", children: /* @__PURE__ */ jsxDEV("path", { d: "M-3.70710678,4.29289322 C-3.34662282,3.93240926 -2.77939176,3.90467972 -2.38710056,4.20970461 L-2.29289322,4.29289322 L5,11.585 L12.2928932,4.29289322 C12.6533772,3.93240926 13.2206082,3.90467972 13.6128994,4.20970461 L13.7071068,4.29289322 C14.0675907,4.65337718 14.0953203,5.22060824 13.7902954,5.61289944 L13.7071068,5.70710678 L5.70710678,13.7071068 C5.34662282,14.0675907 4.77939176,14.0953203 4.38710056,13.7902954 L4.29289322,13.7071068 L-3.70710678,5.70710678 C-4.09763107,5.31658249 -4.09763107,4.68341751 -3.70710678,4.29289322 Z", id: "Shape-Copy", fill: color, transform: "translate(5, 9) rotate(-90) translate(-5, -9)" }, void 0, false, {
+    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+    lineNumber: 293,
+    columnNumber: 11
+  }, this) }, void 0, false, {
+    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+    lineNumber: 292,
+    columnNumber: 7
+  }, this) }, void 0, false, {
+    fileName: "H:/mom/sdk/src/Components/ControlSlider/ControlSlider.tsx",
+    lineNumber: 291,
+    columnNumber: 5
+  }, this);
 }
 const ControlSliderComponent = {
   element: ControlSlider,
@@ -2255,8 +2476,504 @@ const ControlSliderComponent = {
     required: ["settings", "content", "styles"]
   }
 };
+const imageRevealSlider = "ImageRevealSlider-module__imageRevealSlider___UE5Ob";
+const image = "ImageRevealSlider-module__image___Qjt-e";
+const link = "ImageRevealSlider-module__link___N-iLG";
+const styles = {
+  imageRevealSlider,
+  image,
+  link
+};
+function isMouseOverImage(mouseX, mouseY, placedImages) {
+  for (const img2 of placedImages) {
+    const imgEl = new Image();
+    imgEl.src = img2.url;
+    const imgWidth = img2.width ? Number.parseFloat(img2.width) : imgEl.naturalWidth;
+    const imgHeight = imgEl.naturalHeight / imgEl.naturalWidth * imgWidth;
+    const halfW = imgWidth / 2;
+    const halfH = imgHeight / 2;
+    if (mouseX >= img2.x - halfW && mouseX <= img2.x + halfW && mouseY >= img2.y - halfH && mouseY <= img2.y + halfH) {
+      return true;
+    }
+  }
+  return false;
+}
+function getImageSize(url) {
+  return new Promise((resolve) => {
+    const img2 = new Image();
+    img2.src = url;
+    img2.onload = () => {
+      resolve({ width: img2.naturalWidth, height: img2.naturalHeight });
+    };
+  });
+}
+async function calculateImageWidthHeight(imgUrl, sizeType, customWidth, randomRange) {
+  let width;
+  let height;
+  if (sizeType === "custom") {
+    width = customWidth;
+    const size = await getImageSize(imgUrl);
+    height = size.height / size.width * width;
+  } else if (sizeType === "random") {
+    width = Math.random() * (randomRange.max - randomRange.min) + randomRange.min;
+    const size = await getImageSize(imgUrl);
+    height = size.height / size.width * width;
+  } else {
+    const size = await getImageSize(imgUrl);
+    width = size.width;
+    height = size.height;
+  }
+  return { width, height, finalWidth: `${width}px` };
+}
+function ImageRevealSlider({ settings, content, isEditor }) {
+  const divRef = useRef(null);
+  const [placedImages, setPlacedImages] = useState([]);
+  const [counter, setCounter] = useState(0);
+  const imageIdCounter = useRef(0);
+  const defaultImageCount = 1;
+  const { sizeType, imageWidth: customWidth, randomRangeImageWidth: randomRange } = settings.imageSize;
+  const { revealPosition, visible, target } = settings.position;
+  const { cursorType, defaultCursor, hoverCursor } = settings.cursor;
+  const createNewImage = async (imgData, containerWidth, containerHeight, position = {}) => {
+    const { width, height, finalWidth } = await calculateImageWidthHeight(
+      imgData.image.url,
+      sizeType,
+      customWidth,
+      randomRange
+    );
+    let x = position.x ?? Math.random() * containerWidth;
+    let y = position.y ?? Math.random() * containerHeight;
+    const adjustedX = Math.min(Math.max(x, width / 2), containerWidth - width / 2);
+    const adjustedY = Math.min(Math.max(y, height / 2), containerHeight - height / 2);
+    return {
+      id: imageIdCounter.current++,
+      url: imgData.image.url,
+      link: imgData.link,
+      name: imgData.image.name,
+      x: adjustedX,
+      y: adjustedY,
+      width: finalWidth
+    };
+  };
+  const defaultContentUrls = useMemo(() => {
+    const defaultContentLength = Math.min(content.length, defaultImageCount);
+    return content.filter((_, i) => i < defaultContentLength).map((c) => c.image.url).join("-");
+  }, [content]);
+  useEffect(() => {
+    if (!divRef.current || content.length === 0) return;
+    const rect = divRef.current.getBoundingClientRect();
+    const containerWidth = rect.width;
+    const containerHeight = rect.height;
+    const defaultPlaced = [];
+    const placeImages = async () => {
+      for (let i = 0; i < defaultImageCount && i < content.length; i++) {
+        const imgData = content[i];
+        const newImg = await createNewImage(imgData, containerWidth, containerHeight);
+        defaultPlaced.push(newImg);
+      }
+      setPlacedImages(defaultPlaced);
+      setCounter(defaultImageCount % content.length);
+    };
+    placeImages();
+  }, [defaultContentUrls, sizeType, customWidth, randomRange]);
+  useEffect(() => {
+    if (visible === "lastOne") {
+      setPlacedImages((prev) => prev.length > 0 ? [prev[prev.length - 1]] : []);
+    }
+  }, [visible]);
+  const handleClick = async (e) => {
+    if (!divRef.current) return;
+    const rect = divRef.current.getBoundingClientRect();
+    const clickX = e.clientX - rect.left;
+    const clickY = e.clientY - rect.top;
+    if (target === "image" && !isMouseOverImage(clickX, clickY, placedImages)) return;
+    let x = 0, y = 0;
+    if (revealPosition === "onClick") {
+      x = clickX;
+      y = clickY;
+    } else if (revealPosition === "same") {
+      x = rect.width / 2;
+      y = rect.height / 2;
+    } else {
+      x = Math.random() * rect.width;
+      y = Math.random() * rect.height;
+    }
+    const imgData = content[counter];
+    const newImage = await createNewImage(imgData, rect.width, rect.height, { x, y });
+    setPlacedImages((prev) => visible === "all" ? [...prev, newImage] : [newImage]);
+    setCounter((prev) => prev >= content.length - 1 ? 0 : prev + 1);
+  };
+  const handleMouseMove = (e) => {
+    if (!divRef.current) return;
+    if (cursorType === "system") {
+      divRef.current.style.cursor = "";
+      return;
+    }
+    const rect = divRef.current.getBoundingClientRect();
+    const mouseX = e.clientX - rect.left;
+    const mouseY = e.clientY - rect.top;
+    const isHover = target === "area" || isMouseOverImage(mouseX, mouseY, placedImages);
+    divRef.current.style.cursor = isHover ? `url(${hoverCursor}), auto` : `url(${defaultCursor}), auto`;
+  };
+  return /* @__PURE__ */ jsxDEV(
+    "div",
+    {
+      ref: divRef,
+      onClick: handleClick,
+      onMouseEnter: handleMouseMove,
+      onMouseMove: handleMouseMove,
+      className: styles.imageRevealSlider,
+      children: placedImages.map((img2) => /* @__PURE__ */ jsxDEV(
+        "div",
+        {
+          className: styles.wrapper,
+          style: {
+            top: `${img2.y}px`,
+            left: `${img2.x}px`,
+            position: "absolute",
+            transform: "translate(-50%, -50%)",
+            width: img2.width ?? "auto",
+            height: "auto"
+          },
+          children: target === "area" && img2.link ? /* @__PURE__ */ jsxDEV("a", { href: img2.link, target: "_blank", className: styles.link, children: /* @__PURE__ */ jsxDEV(
+            "img",
+            {
+              src: img2.url,
+              alt: img2.name,
+              className: styles.image
+            },
+            img2.id,
+            false,
+            {
+              fileName: "H:/mom/sdk/src/Components/ImageRevealSlider/ImageRevealSlider.tsx",
+              lineNumber: 257,
+              columnNumber: 15
+            },
+            this
+          ) }, void 0, false, {
+            fileName: "H:/mom/sdk/src/Components/ImageRevealSlider/ImageRevealSlider.tsx",
+            lineNumber: 256,
+            columnNumber: 13
+          }, this) : /* @__PURE__ */ jsxDEV(
+            "img",
+            {
+              src: img2.url,
+              alt: img2.name,
+              className: styles.image
+            },
+            img2.id,
+            false,
+            {
+              fileName: "H:/mom/sdk/src/Components/ImageRevealSlider/ImageRevealSlider.tsx",
+              lineNumber: 265,
+              columnNumber: 13
+            },
+            this
+          )
+        },
+        void 0,
+        false,
+        {
+          fileName: "H:/mom/sdk/src/Components/ImageRevealSlider/ImageRevealSlider.tsx",
+          lineNumber: 245,
+          columnNumber: 9
+        },
+        this
+      ))
+    },
+    void 0,
+    false,
+    {
+      fileName: "H:/mom/sdk/src/Components/ImageRevealSlider/ImageRevealSlider.tsx",
+      lineNumber: 237,
+      columnNumber: 5
+    },
+    this
+  );
+}
+const ControlImageRevealSliderComponent = {
+  element: ImageRevealSlider,
+  id: "control-image-reveal",
+  name: "Image reveal",
+  preview: {
+    type: "video",
+    url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K723EY5AH8SKQFK4R31D8FPV.mp4"
+  },
+  defaultSize: {
+    width: 700,
+    height: 400
+  },
+  schema: {
+    type: "object",
+    properties: {
+      settings: {
+        layoutBased: true,
+        type: "object",
+        properties: {
+          imageSize: {
+            name: "IMG SIZE",
+            icon: "size",
+            tooltip: "IMG SIZE",
+            type: "object",
+            properties: {
+              sizeType: {
+                name: "sizeType",
+                type: "string",
+                display: {
+                  type: "ratio-group"
+                },
+                enum: ["as Is", "custom", "random"]
+              },
+              imageWidth: {
+                type: "number",
+                label: "W",
+                display: {
+                  type: "numeric-input",
+                  visible: false
+                }
+              },
+              randomRangeImageWidth: {
+                type: "object",
+                display: {
+                  type: "random-range-controls",
+                  visible: false
+                },
+                properties: {
+                  min: {
+                    type: "number"
+                  },
+                  max: {
+                    type: "number"
+                  }
+                }
+              }
+            }
+          },
+          cursor: {
+            name: "cursor",
+            icon: "cursor",
+            tooltip: "cursor",
+            type: "object",
+            properties: {
+              cursorType: {
+                name: "cursorType",
+                type: "string",
+                display: {
+                  type: "ratio-group"
+                },
+                enum: ["system", "custom"]
+              },
+              defaultCursor: {
+                type: ["string", "null"],
+                display: {
+                  type: "settings-image-input",
+                  title: "Default",
+                  visible: false
+                }
+              },
+              hoverCursor: {
+                type: ["string", "null"],
+                display: {
+                  type: "settings-image-input",
+                  title: "Hover",
+                  visible: false
+                }
+              }
+            }
+          },
+          position: {
+            name: "position",
+            icon: "transition",
+            tooltip: "Position",
+            type: "object",
+            properties: {
+              revealPosition: {
+                type: "string",
+                display: {
+                  type: "ratio-group"
+                },
+                enum: ["random", "same", "onClick"]
+              },
+              visible: {
+                type: "string",
+                display: {
+                  type: "ratio-group"
+                },
+                enum: ["all", "lastOne"]
+              },
+              target: {
+                type: "string",
+                display: {
+                  type: "ratio-group"
+                },
+                enum: ["area", "image"]
+              }
+            }
+          }
+        },
+        default: {
+          imageSize: {
+            sizeType: "custom",
+            imageWidth: 500,
+            randomRangeImageWidth: {
+              min: 100,
+              max: 1e3
+            }
+          },
+          cursor: {
+            cursorType: "system",
+            defaultCursor: null,
+            hoverCursor: null
+          },
+          position: {
+            revealPosition: "random",
+            visible: "all",
+            target: "area"
+          }
+        },
+        displayRules: [
+          {
+            if: {
+              name: "imageSize.sizeType",
+              value: "custom"
+            },
+            then: {
+              name: "properties.imageSize.properties.imageWidth.display.visible",
+              value: true
+            }
+          },
+          {
+            if: {
+              name: "imageSize.sizeType",
+              value: "random"
+            },
+            then: {
+              name: "properties.imageSize.properties.randomRangeImageWidth.display.visible",
+              value: true
+            }
+          },
+          {
+            if: [
+              { name: "position.target", value: "image" },
+              { name: "cursor.cursorType", value: "custom" }
+            ],
+            then: {
+              name: "properties.cursor.properties.defaultCursor.display.visible",
+              value: true
+            }
+          },
+          {
+            if: {
+              name: "cursor.cursorType",
+              value: "custom"
+            },
+            then: {
+              name: "properties.cursor.properties.hoverCursor.display.visible",
+              value: true
+            }
+          }
+        ]
+      },
+      content: {
+        layoutBased: false,
+        type: "array",
+        items: {
+          type: "object",
+          properties: {
+            image: {
+              type: "object",
+              display: {
+                type: "media-input"
+              },
+              properties: {
+                url: {
+                  type: "string"
+                },
+                name: {
+                  type: "string"
+                },
+                objectFit: {
+                  type: "string",
+                  enum: ["cover", "contain"]
+                }
+              },
+              required: ["url", "name"]
+            },
+            link: {
+              type: "string",
+              display: {
+                type: "text-input",
+                placeholder: "Enter link..."
+              }
+            }
+          },
+          required: ["image"]
+        },
+        default: [
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740QZCY7R9HD9KTMB6XGPJ4.jpeg",
+              name: "Slider-1.jpeg"
+            },
+            link: ""
+          },
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740S36970GH347RCZ8GW6QF.jpeg",
+              name: "Slider-2.jpeg"
+            },
+            link: ""
+          },
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740RZ7VG1PWA7CRMR6TW0QS.jpeg",
+              name: "Slider-3.jpeg"
+            },
+            link: ""
+          },
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740RV2XQMBWM2RZABY6AP9N.jpeg",
+              name: "Slider-4.jpeg"
+            },
+            link: ""
+          },
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740RQ4E62FG7Y92J4AP8T0A.jpeg",
+              name: "Slider-5.jpeg"
+            },
+            link: ""
+          },
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740RE073FS2HZX8AVP3MCR7.jpeg",
+              name: "Slider-6.jpeg"
+            },
+            link: ""
+          },
+          {
+            image: {
+              objectFit: "cover",
+              url: "https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K740R841W216BPQR07XZN8G4.jpeg",
+              name: "Slider-7.jpeg"
+            },
+            link: ""
+          }
+        ]
+      }
+    }
+  }
+};
 const components = [
-  ControlSliderComponent
+  ControlSliderComponent,
+  ControlImageRevealSliderComponent
 ];
 export {
   AnchorSide,