@yklyklpackages/message-card 0.1.1 → 0.3.0

package/dist/index.cjs

@@ -21,21 +21,21 @@ function _interopNamespaceDefault(e) {
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const ReactDOM__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactDOM);
-var __defProp$w = Object.defineProperty;
+var __defProp$x = Object.defineProperty;
 var __defProps$r = Object.defineProperties;
 var __getOwnPropDescs$r = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$t = Object.getOwnPropertySymbols;
-var __hasOwnProp$t = Object.prototype.hasOwnProperty;
-var __propIsEnum$t = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$w = (obj, key, value) => key in obj ? __defProp$w(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$t = (a, b) => {
+var __getOwnPropSymbols$u = Object.getOwnPropertySymbols;
+var __hasOwnProp$u = Object.prototype.hasOwnProperty;
+var __propIsEnum$u = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$x = (obj, key, value) => key in obj ? __defProp$x(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$u = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$t.call(b, prop))
-      __defNormalProp$w(a, prop, b[prop]);
-  if (__getOwnPropSymbols$t)
-    for (var prop of __getOwnPropSymbols$t(b)) {
-      if (__propIsEnum$t.call(b, prop))
-        __defNormalProp$w(a, prop, b[prop]);
+    if (__hasOwnProp$u.call(b, prop))
+      __defNormalProp$x(a, prop, b[prop]);
+  if (__getOwnPropSymbols$u)
+    for (var prop of __getOwnPropSymbols$u(b)) {
+      if (__propIsEnum$u.call(b, prop))
+        __defNormalProp$x(a, prop, b[prop]);
     }
   return a;
 };
@@ -84,8 +84,8 @@ const WrapComponent = (props) => {
       className: "container-wrap-hoc",
       ref: containerRef,
       onClick,
-      children: renderFunction(__spreadProps$r(__spreadValues$t({}, runtimeProps), {
-        component: __spreadValues$t(__spreadValues$t({}, runtimeProps.component), componentFromEditor || {})
+      children: renderFunction(__spreadProps$r(__spreadValues$u({}, runtimeProps), {
+        component: __spreadValues$u(__spreadValues$u({}, runtimeProps.component), componentFromEditor || {})
       }))
     },
     updateUniqueId
@@ -109,19 +109,19 @@ const containerComponentEditorModeHOC = (renderFunction) => {
     );
   } : renderFunction;
 };
-var __defProp$v = Object.defineProperty;
-var __getOwnPropSymbols$s = Object.getOwnPropertySymbols;
-var __hasOwnProp$s = Object.prototype.hasOwnProperty;
-var __propIsEnum$s = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$v = (obj, key, value) => key in obj ? __defProp$v(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$s = (a, b) => {
+var __defProp$w = Object.defineProperty;
+var __getOwnPropSymbols$t = Object.getOwnPropertySymbols;
+var __hasOwnProp$t = Object.prototype.hasOwnProperty;
+var __propIsEnum$t = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$w = (obj, key, value) => key in obj ? __defProp$w(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$t = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$s.call(b, prop))
-      __defNormalProp$v(a, prop, b[prop]);
-  if (__getOwnPropSymbols$s)
-    for (var prop of __getOwnPropSymbols$s(b)) {
-      if (__propIsEnum$s.call(b, prop))
-        __defNormalProp$v(a, prop, b[prop]);
+    if (__hasOwnProp$t.call(b, prop))
+      __defNormalProp$w(a, prop, b[prop]);
+  if (__getOwnPropSymbols$t)
+    for (var prop of __getOwnPropSymbols$t(b)) {
+      if (__propIsEnum$t.call(b, prop))
+        __defNormalProp$w(a, prop, b[prop]);
     }
   return a;
 };
@@ -147,7 +147,7 @@ const getImageUrl = ({
   if (isWebp) {
     reWebp = ".webp";
   }
-  const { width, height } = __spreadValues$s({}, size);
+  const { width, height } = __spreadValues$t({}, size);
   let reSize = "";
   if (width && height) {
     reSize = `s${width}x${height}_`;
@@ -166,14 +166,14 @@ function JSONSafeParse(str, defaultValue) {
   }
   return defaultValue;
 }
-const defaultTheme$2 = {
+const defaultTheme$1 = {
   fontSize: {
-    FontSizes_JDH_Headline1: 23,
-    FontSizes_JDH_Headline2: 17,
-    FontSizes_JDH_Title: 15,
-    FontSizes_JDH_Text: 14,
-    FontSizes_JDH_AccentText: 12,
-    FontSizes_JDH_TagText: 10
+    FontSizes_JDH_Headline1: 46,
+    FontSizes_JDH_Headline2: 34,
+    FontSizes_JDH_Title: 30,
+    FontSizes_JDH_Text: 28,
+    FontSizes_JDH_AccentText: 24,
+    FontSizes_JDH_TagText: 20
   },
   color: {
     Color_JDH_Primary: "#17CB8E",
@@ -198,55 +198,57 @@ const defaultTheme$2 = {
     FontWeight_JDH_Medium: 500
   },
   space: {
-    "spacing-xs": 2,
-    "spacing-sm": 4,
-    "spacing-md": 8,
-    "spacing-lg": 10,
-    "spacing-xl": 12,
-    "spacing-xxl": 16
+    Spacing_JDH_xxxl: 32,
+    Spacing_JDH_xxl: 28,
+    Spacing_JDH_xl: 24,
+    Spacing_JDH_lg: 20,
+    Spacing_JDH_md: 16,
+    Spacing_JDH_sm: 12,
+    Spacing_JDH_xs: 8,
+    Spacing_JDH_xxs: 4
   },
   borderRadius: {
-    Radius_JDH_LargeExtra: 16,
-    Radius_JDH_Large: 12,
-    Radius_JDH_Medium: 8,
-    Radius_JDH_Small: 4,
-    Radius_JDH_Mini: 3
+    Radius_JDH_LargeExtra: 32,
+    Radius_JDH_Large: 24,
+    Radius_JDH_Medium: 16,
+    Radius_JDH_Small: 8,
+    Radius_JDH_Mini: 6
   },
   components: {}
 };
-var __defProp$u = Object.defineProperty;
+var __defProp$v = Object.defineProperty;
 var __defProps$q = Object.defineProperties;
 var __getOwnPropDescs$q = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$r = Object.getOwnPropertySymbols;
-var __hasOwnProp$r = Object.prototype.hasOwnProperty;
-var __propIsEnum$r = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$u = (obj, key, value) => key in obj ? __defProp$u(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$r = (a, b) => {
+var __getOwnPropSymbols$s = Object.getOwnPropertySymbols;
+var __hasOwnProp$s = Object.prototype.hasOwnProperty;
+var __propIsEnum$s = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$v = (obj, key, value) => key in obj ? __defProp$v(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$s = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$r.call(b, prop))
-      __defNormalProp$u(a, prop, b[prop]);
-  if (__getOwnPropSymbols$r)
-    for (var prop of __getOwnPropSymbols$r(b)) {
-      if (__propIsEnum$r.call(b, prop))
-        __defNormalProp$u(a, prop, b[prop]);
+    if (__hasOwnProp$s.call(b, prop))
+      __defNormalProp$v(a, prop, b[prop]);
+  if (__getOwnPropSymbols$s)
+    for (var prop of __getOwnPropSymbols$s(b)) {
+      if (__propIsEnum$s.call(b, prop))
+        __defNormalProp$v(a, prop, b[prop]);
     }
   return a;
 };
 var __spreadProps$q = (a, b) => __defProps$q(a, __getOwnPropDescs$q(b));
-const ThemeContext = React.createContext(defaultTheme$2);
+const ThemeContext = React.createContext(defaultTheme$1);
 const ThemeProvider = ({
   theme,
   children
 }) => {
   const merged = React.useMemo(() => {
-    const base = defaultTheme$2;
-    return __spreadProps$q(__spreadValues$r({}, base), {
-      fontSize: __spreadValues$r(__spreadValues$r({}, base.fontSize), (theme == null ? void 0 : theme.fontSize) || {}),
-      color: __spreadValues$r(__spreadValues$r({}, base.color), (theme == null ? void 0 : theme.color) || {}),
-      backgroundColor: __spreadValues$r(__spreadValues$r({}, base.color), (theme == null ? void 0 : theme.color) || {}),
-      fontWeight: __spreadValues$r(__spreadValues$r({}, base.fontWeight), (theme == null ? void 0 : theme.fontWeight) || {}),
-      space: __spreadValues$r(__spreadValues$r({}, base.space), (theme == null ? void 0 : theme.space) || {}),
-      borderRadius: __spreadValues$r(__spreadValues$r({}, base.borderRadius), (theme == null ? void 0 : theme.borderRadius) || {})
+    const base = defaultTheme$1;
+    return __spreadProps$q(__spreadValues$s({}, base), {
+      fontSize: __spreadValues$s(__spreadValues$s({}, base.fontSize), (theme == null ? void 0 : theme.fontSize) || {}),
+      color: __spreadValues$s(__spreadValues$s({}, base.color), (theme == null ? void 0 : theme.color) || {}),
+      backgroundColor: __spreadValues$s(__spreadValues$s({}, base.color), (theme == null ? void 0 : theme.color) || {}),
+      fontWeight: __spreadValues$s(__spreadValues$s({}, base.fontWeight), (theme == null ? void 0 : theme.fontWeight) || {}),
+      space: __spreadValues$s(__spreadValues$s({}, base.space), (theme == null ? void 0 : theme.space) || {}),
+      borderRadius: __spreadValues$s(__spreadValues$s({}, base.borderRadius), (theme == null ? void 0 : theme.borderRadius) || {})
     });
   }, [theme]);
   return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: merged, children });
@@ -3989,21 +3991,21 @@ var lib = {
   stringify: stringify$2
 };
 const qs = /* @__PURE__ */ getDefaultExportFromCjs(lib);
-var __defProp$t = Object.defineProperty;
+var __defProp$u = Object.defineProperty;
 var __defProps$p = Object.defineProperties;
 var __getOwnPropDescs$p = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$q = Object.getOwnPropertySymbols;
-var __hasOwnProp$q = Object.prototype.hasOwnProperty;
-var __propIsEnum$q = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$t = (obj, key, value) => key in obj ? __defProp$t(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$q = (a, b) => {
+var __getOwnPropSymbols$r = Object.getOwnPropertySymbols;
+var __hasOwnProp$r = Object.prototype.hasOwnProperty;
+var __propIsEnum$r = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$u = (obj, key, value) => key in obj ? __defProp$u(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$r = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$q.call(b, prop))
-      __defNormalProp$t(a, prop, b[prop]);
-  if (__getOwnPropSymbols$q)
-    for (var prop of __getOwnPropSymbols$q(b)) {
-      if (__propIsEnum$q.call(b, prop))
-        __defNormalProp$t(a, prop, b[prop]);
+    if (__hasOwnProp$r.call(b, prop))
+      __defNormalProp$u(a, prop, b[prop]);
+  if (__getOwnPropSymbols$r)
+    for (var prop of __getOwnPropSymbols$r(b)) {
+      if (__propIsEnum$r.call(b, prop))
+        __defNormalProp$u(a, prop, b[prop]);
     }
   return a;
 };
@@ -4011,11 +4013,11 @@ var __spreadProps$p = (a, b) => __defProps$p(a, __getOwnPropDescs$p(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$q.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$r.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$q)
-    for (var prop of __getOwnPropSymbols$q(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$q.call(source, prop))
+  if (source != null && __getOwnPropSymbols$r)
+    for (var prop of __getOwnPropSymbols$r(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$r.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -4089,7 +4091,7 @@ const handleSendMessage = (config, { ctx, metadata }) => {
       type: "text",
       data: {
         text,
-        customJsonData: __spreadValues$q({
+        customJsonData: __spreadValues$r({
           customBiz: metadata == null ? void 0 : metadata.customBiz
         }, rest || {})
       }
@@ -4110,16 +4112,16 @@ const handleUpdateLocalData = async (config, { setValues }) => {
     const oldValue = prev2 == null ? void 0 : prev2[key];
     const isOldEmpty = oldValue === void 0 || oldValue === null || oldValue === "" || typeof oldValue === "object" && Object.keys(oldValue).length === 0;
     if (isOldEmpty) {
-      return __spreadProps$p(__spreadValues$q({}, prev2 || {}), {
+      return __spreadProps$p(__spreadValues$r({}, prev2 || {}), {
         [key]: value
       });
     }
     if (typeof oldValue === "object" && typeof value === "object" && !Array.isArray(oldValue) && !Array.isArray(value) && oldValue !== null && value !== null) {
-      return __spreadProps$p(__spreadValues$q({}, prev2 || {}), {
-        [key]: __spreadValues$q(__spreadValues$q({}, oldValue), value)
+      return __spreadProps$p(__spreadValues$r({}, prev2 || {}), {
+        [key]: __spreadValues$r(__spreadValues$r({}, oldValue), value)
       });
     }
-    return __spreadProps$p(__spreadValues$q({}, prev2 || {}), {
+    return __spreadProps$p(__spreadValues$r({}, prev2 || {}), {
       [key]: value
     });
   });
@@ -4128,7 +4130,7 @@ const handleAddLocalDataToSet = (config, { setValues }) => {
   if (!setValues) return;
   const { updateKey, value } = config.params;
   setValues((prev2) => {
-    return __spreadProps$p(__spreadValues$q({}, prev2 || {}), { [updateKey]: value });
+    return __spreadProps$p(__spreadValues$r({}, prev2 || {}), { [updateKey]: value });
   });
 };
 const handleRemoveLocalDataToSet = (config, { setValues }) => {
@@ -4136,7 +4138,7 @@ const handleRemoveLocalDataToSet = (config, { setValues }) => {
   const { updateKey } = config.params;
   setValues((prev2) => {
     if (!prev2) return {};
-    const next2 = __spreadValues$q({}, prev2);
+    const next2 = __spreadValues$r({}, prev2);
     delete next2[updateKey];
     return next2;
   });
@@ -4165,7 +4167,7 @@ const handleShowPopup = (config, { originProps }) => {
     ctx.getComponent({
       code: (_b = config == null ? void 0 : config.params) == null ? void 0 : _b.componentCode
     }),
-    __spreadValues$q(__spreadValues$q({}, originProps), ((_c = config == null ? void 0 : config.params) == null ? void 0 : _c.params) || {}),
+    __spreadValues$r(__spreadValues$r({}, originProps), ((_c = config == null ? void 0 : config.params) == null ? void 0 : _c.params) || {}),
     {
       background: "none",
       position: "bottom",
@@ -4319,21 +4321,21 @@ const RenderActionWrapper = ({
   }
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
 };
-var __defProp$s = Object.defineProperty;
+var __defProp$t = Object.defineProperty;
 var __defProps$o = Object.defineProperties;
 var __getOwnPropDescs$o = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$p = Object.getOwnPropertySymbols;
-var __hasOwnProp$p = Object.prototype.hasOwnProperty;
-var __propIsEnum$p = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$s = (obj, key, value) => key in obj ? __defProp$s(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$p = (a, b) => {
+var __getOwnPropSymbols$q = Object.getOwnPropertySymbols;
+var __hasOwnProp$q = Object.prototype.hasOwnProperty;
+var __propIsEnum$q = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$t = (obj, key, value) => key in obj ? __defProp$t(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$q = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$p.call(b, prop))
-      __defNormalProp$s(a, prop, b[prop]);
-  if (__getOwnPropSymbols$p)
-    for (var prop of __getOwnPropSymbols$p(b)) {
-      if (__propIsEnum$p.call(b, prop))
-        __defNormalProp$s(a, prop, b[prop]);
+    if (__hasOwnProp$q.call(b, prop))
+      __defNormalProp$t(a, prop, b[prop]);
+  if (__getOwnPropSymbols$q)
+    for (var prop of __getOwnPropSymbols$q(b)) {
+      if (__propIsEnum$q.call(b, prop))
+        __defNormalProp$t(a, prop, b[prop]);
     }
   return a;
 };
@@ -4346,7 +4348,7 @@ const applySize = (props, scale = 1) => {
   return style2;
 };
 const baseContainerStyle = (props, scale = 1) => {
-  const style2 = __spreadValues$p(__spreadValues$p({}, applySize(props, scale)), (props == null ? void 0 : props.style) || {});
+  const style2 = __spreadValues$q(__spreadValues$q({}, applySize(props, scale)), (props == null ? void 0 : props.style) || {});
   return style2;
 };
 const childGapStyle = (index2, count, gap, horizontal, scale = 1) => {
@@ -4361,7 +4363,7 @@ const resolveSpace = (val, theme, scale = 1) => {
   if (val == null) return void 0;
   if (typeof val === "number") return runStyle(val, scale);
   if (typeof val === "string") {
-    if (["xs", "sm", "md", "lg", "xl", "xxl"].includes(val)) {
+    if (typeof theme.space[val] !== "undefined") {
       const themeVal = theme.space[val];
       return runStyle(themeVal, scale);
     }
@@ -4468,16 +4470,9 @@ const textStyleFromTheme = (theme, opts, scale = 1) => {
     style2.textAlign = opts.textAlign;
   }
   if (opts.lineHeight) {
-    style2.lineHeight = runStyle(opts.lineHeight, scale);
-  } else if (fontSizeValue) {
-    const fs = parseInt(fontSizeValue);
-    if (!Number.isNaN(fs)) {
-      let lh = Math.floor(fs * 1.5);
-      if (lh % 2 !== 0) {
-        lh += 1;
-      }
-      style2.lineHeight = runStyle(lh, scale);
-    }
+    style2.lineHeight = typeof opts.lineHeight === "number" ? runStyle(opts.lineHeight, scale) : opts.lineHeight;
+  } else {
+    style2.lineHeight = 1.5;
   }
   if (opts.marginLeft) {
     style2.marginLeft = resolveSpace(opts.marginLeft, theme, scale);
@@ -4522,7 +4517,7 @@ const borderRadiusToStyle = (borderRadius, theme, scale = 1) => {
   const borderRadiusMap = theme.borderRadius;
   const style2 = {};
   if (borderRadius) {
-    style2.borderRadius = borderRadiusMap[borderRadius] || runStyle(borderRadius, scale) || borderRadius;
+    style2.borderRadius = borderRadiusMap[borderRadius] ? runStyle(borderRadiusMap[borderRadius], scale) : runStyle(borderRadius);
   }
   return style2;
 };
@@ -4578,7 +4573,7 @@ const borderToStyle = (border, theme, scale = 1) => {
   return style2;
 };
 const imageStyleFromProps = (props, theme, scale = 1) => {
-  const style2 = __spreadValues$p({}, borderRadiusToStyle(props == null ? void 0 : props.borderRadius, theme, scale));
+  const style2 = __spreadValues$q({}, borderRadiusToStyle(props == null ? void 0 : props.borderRadius, theme, scale));
   if (props.width != null) style2.width = runStyle(props.width, scale) || "100%";
   if (props.height != null)
     style2.height = runStyle(props.height, scale) || "auto";
@@ -4589,7 +4584,7 @@ const imageStyleFromProps = (props, theme, scale = 1) => {
   return style2;
 };
 const imageViewStyleFromProps = (props, theme, scale = 1) => {
-  const style2 = __spreadValues$p({
+  const style2 = __spreadValues$q({
     overflow: "hidden"
   }, borderRadiusToStyle(props == null ? void 0 : props.borderRadius, theme, scale));
   return style2;
@@ -4598,7 +4593,7 @@ const fractionWidth = (percent) => ({
   width: percent
 });
 const buildItemContainerStyle = (index2, count, props, horizontal = false, scale = 1) => {
-  const style2 = __spreadValues$p({
+  const style2 = __spreadValues$q({
     width: (props == null ? void 0 : props.flexDirection) === "row" ? "auto" : "100%",
     height: "auto",
     boxSizing: "border-box",
@@ -4615,7 +4610,7 @@ const buildItemContainerStyle = (index2, count, props, horizontal = false, scale
   return style2;
 };
 const buildLayoutContainerStyle = (props, direction, theme, scale = 1) => {
-  const style2 = __spreadValues$p(__spreadValues$p(__spreadValues$p(__spreadValues$p(__spreadValues$p({
+  const style2 = __spreadValues$q(__spreadValues$q(__spreadValues$q(__spreadValues$q(__spreadValues$q({
     display: "flex",
     boxSizing: "border-box",
     width: runStyle(props == null ? void 0 : props.width, scale) || "100%",
@@ -4628,7 +4623,7 @@ const buildLayoutContainerStyle = (props, direction, theme, scale = 1) => {
   return style2;
 };
 const buildAbsoluteLayoutStyle = (props, direction, theme, scale = 1) => {
-  const style2 = __spreadProps$o(__spreadValues$p(__spreadValues$p({}, buildLayoutContainerStyle(props, direction, theme, scale)), borderRadiusToStyle(props == null ? void 0 : props.borderRadius, theme, scale)), {
+  const style2 = __spreadProps$o(__spreadValues$q(__spreadValues$q({}, buildLayoutContainerStyle(props, direction, theme, scale)), borderRadiusToStyle(props == null ? void 0 : props.borderRadius, theme, scale)), {
     position: "absolute",
     zIndex: 1
   });
@@ -4645,7 +4640,7 @@ const buildAbsoluteLayoutStyle = (props, direction, theme, scale = 1) => {
   }
   return style2;
 };
-const runStyle = (val, scale = 1) => {
+const runStyle = (val, scale = 0.5) => {
   if (val === void 0 || val === null) return "";
   const parts = Array.isArray(val) ? val : String(val).trim().split(/\s+/);
   const final = parts.map((item) => {
@@ -4729,25 +4724,24 @@ const useForEditor = (props, ref2) => {
   return { editorMode, ref: wrapRef, onMouseEnter, onMouseLeave, onClick };
 };
 const ResponsiveContext = React.createContext({
-  scale: 1,
-  width: 375
+  scale: 0.5
 });
 const useResponsive = () => React.useContext(ResponsiveContext);
-var __defProp$r = Object.defineProperty;
+var __defProp$s = Object.defineProperty;
 var __defProps$n = Object.defineProperties;
 var __getOwnPropDescs$n = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$o = Object.getOwnPropertySymbols;
-var __hasOwnProp$o = Object.prototype.hasOwnProperty;
-var __propIsEnum$o = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$r = (obj, key, value) => key in obj ? __defProp$r(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$o = (a, b) => {
+var __getOwnPropSymbols$p = Object.getOwnPropertySymbols;
+var __hasOwnProp$p = Object.prototype.hasOwnProperty;
+var __propIsEnum$p = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$s = (obj, key, value) => key in obj ? __defProp$s(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$p = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$o.call(b, prop))
-      __defNormalProp$r(a, prop, b[prop]);
-  if (__getOwnPropSymbols$o)
-    for (var prop of __getOwnPropSymbols$o(b)) {
-      if (__propIsEnum$o.call(b, prop))
-        __defNormalProp$r(a, prop, b[prop]);
+    if (__hasOwnProp$p.call(b, prop))
+      __defNormalProp$s(a, prop, b[prop]);
+  if (__getOwnPropSymbols$p)
+    for (var prop of __getOwnPropSymbols$p(b)) {
+      if (__propIsEnum$p.call(b, prop))
+        __defNormalProp$s(a, prop, b[prop]);
     }
   return a;
 };
@@ -4777,7 +4771,7 @@ const FullRowLayout = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$n(__spreadValues$o({
+    __spreadProps$n(__spreadValues$p({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -4790,7 +4784,7 @@ const FullRowLayout = ({
         return /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            style: __spreadProps$n(__spreadValues$o({}, buildItemContainerStyle(idx, count, props, false, scale)), {
+            style: __spreadProps$n(__spreadValues$p({}, buildItemContainerStyle(idx, count, props, false, scale)), {
               width: "100%"
             }),
             children: child
@@ -4801,21 +4795,21 @@ const FullRowLayout = ({
     })
   );
 };
-var __defProp$q = Object.defineProperty;
+var __defProp$r = Object.defineProperty;
 var __defProps$m = Object.defineProperties;
 var __getOwnPropDescs$m = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$n = Object.getOwnPropertySymbols;
-var __hasOwnProp$n = Object.prototype.hasOwnProperty;
-var __propIsEnum$n = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$q = (obj, key, value) => key in obj ? __defProp$q(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$n = (a, b) => {
+var __getOwnPropSymbols$o = Object.getOwnPropertySymbols;
+var __hasOwnProp$o = Object.prototype.hasOwnProperty;
+var __propIsEnum$o = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$r = (obj, key, value) => key in obj ? __defProp$r(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$o = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$n.call(b, prop))
-      __defNormalProp$q(a, prop, b[prop]);
-  if (__getOwnPropSymbols$n)
-    for (var prop of __getOwnPropSymbols$n(b)) {
-      if (__propIsEnum$n.call(b, prop))
-        __defNormalProp$q(a, prop, b[prop]);
+    if (__hasOwnProp$o.call(b, prop))
+      __defNormalProp$r(a, prop, b[prop]);
+  if (__getOwnPropSymbols$o)
+    for (var prop of __getOwnPropSymbols$o(b)) {
+      if (__propIsEnum$o.call(b, prop))
+        __defNormalProp$r(a, prop, b[prop]);
     }
   return a;
 };
@@ -4830,11 +4824,11 @@ const MultipleColumnLayout = ({
   const { executeActions } = useAction$1();
   const theme = useTheme$1();
   const { ref: ref2, onClick, onMouseEnter, onMouseLeave } = useForEditor(props);
-  const containerStyle = __spreadProps$m(__spreadValues$n({}, buildLayoutContainerStyle(props, "row", theme, scale)), {
+  const containerStyle = __spreadProps$m(__spreadValues$o({}, buildLayoutContainerStyle(props, "row", theme, scale)), {
     flexWrap: (props == null ? void 0 : props.flexWrap) || "nowrap"
   });
   const itemContainerStyle = (child, idx) => {
-    return __spreadProps$m(__spreadValues$n({}, buildItemContainerStyle(idx, count, props, true, scale)), {
+    return __spreadProps$m(__spreadValues$o({}, buildItemContainerStyle(idx, count, props, true, scale)), {
       flexShrink: itemFlexShrink(child),
       width: void 0
     });
@@ -4854,7 +4848,7 @@ const MultipleColumnLayout = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$m(__spreadValues$n({
+    __spreadProps$m(__spreadValues$o({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -4863,21 +4857,21 @@ const MultipleColumnLayout = ({
     })
   );
 };
-var __defProp$p = Object.defineProperty;
+var __defProp$q = Object.defineProperty;
 var __defProps$l = Object.defineProperties;
 var __getOwnPropDescs$l = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$m = Object.getOwnPropertySymbols;
-var __hasOwnProp$m = Object.prototype.hasOwnProperty;
-var __propIsEnum$m = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$p = (obj, key, value) => key in obj ? __defProp$p(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$m = (a, b) => {
+var __getOwnPropSymbols$n = Object.getOwnPropertySymbols;
+var __hasOwnProp$n = Object.prototype.hasOwnProperty;
+var __propIsEnum$n = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$q = (obj, key, value) => key in obj ? __defProp$q(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$n = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$m.call(b, prop))
-      __defNormalProp$p(a, prop, b[prop]);
-  if (__getOwnPropSymbols$m)
-    for (var prop of __getOwnPropSymbols$m(b)) {
-      if (__propIsEnum$m.call(b, prop))
-        __defNormalProp$p(a, prop, b[prop]);
+    if (__hasOwnProp$n.call(b, prop))
+      __defNormalProp$q(a, prop, b[prop]);
+  if (__getOwnPropSymbols$n)
+    for (var prop of __getOwnPropSymbols$n(b)) {
+      if (__propIsEnum$n.call(b, prop))
+        __defNormalProp$q(a, prop, b[prop]);
     }
   return a;
 };
@@ -4906,7 +4900,7 @@ const TwoColumnLayout$2 = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$l(__spreadValues$m({
+    __spreadProps$l(__spreadValues$n({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -4914,7 +4908,7 @@ const TwoColumnLayout$2 = ({
       children: items.map((child, idx) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          style: __spreadProps$l(__spreadValues$m({}, buildItemContainerStyle(idx, count, props, true, scale)), {
+          style: __spreadProps$l(__spreadValues$n({}, buildItemContainerStyle(idx, count, props, true, scale)), {
             flex: 1
             // ...fractionWidth('50%'),
           }),
@@ -4925,21 +4919,21 @@ const TwoColumnLayout$2 = ({
     })
   );
 };
-var __defProp$o = Object.defineProperty;
+var __defProp$p = Object.defineProperty;
 var __defProps$k = Object.defineProperties;
 var __getOwnPropDescs$k = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$l = Object.getOwnPropertySymbols;
-var __hasOwnProp$l = Object.prototype.hasOwnProperty;
-var __propIsEnum$l = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$o = (obj, key, value) => key in obj ? __defProp$o(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$l = (a, b) => {
+var __getOwnPropSymbols$m = Object.getOwnPropertySymbols;
+var __hasOwnProp$m = Object.prototype.hasOwnProperty;
+var __propIsEnum$m = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$p = (obj, key, value) => key in obj ? __defProp$p(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$m = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$l.call(b, prop))
-      __defNormalProp$o(a, prop, b[prop]);
-  if (__getOwnPropSymbols$l)
-    for (var prop of __getOwnPropSymbols$l(b)) {
-      if (__propIsEnum$l.call(b, prop))
-        __defNormalProp$o(a, prop, b[prop]);
+    if (__hasOwnProp$m.call(b, prop))
+      __defNormalProp$p(a, prop, b[prop]);
+  if (__getOwnPropSymbols$m)
+    for (var prop of __getOwnPropSymbols$m(b)) {
+      if (__propIsEnum$m.call(b, prop))
+        __defNormalProp$p(a, prop, b[prop]);
     }
   return a;
 };
@@ -4968,7 +4962,7 @@ const ThreeColumnLayout$1 = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$k(__spreadValues$l({
+    __spreadProps$k(__spreadValues$m({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -4976,7 +4970,7 @@ const ThreeColumnLayout$1 = ({
       children: items.map((child, idx) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          style: __spreadProps$k(__spreadValues$l({}, buildItemContainerStyle(idx, count, props, true, scale)), {
+          style: __spreadProps$k(__spreadValues$m({}, buildItemContainerStyle(idx, count, props, true, scale)), {
             flex: 1
           }),
           children: child
@@ -4986,21 +4980,21 @@ const ThreeColumnLayout$1 = ({
     })
   );
 };
-var __defProp$n = Object.defineProperty;
+var __defProp$o = Object.defineProperty;
 var __defProps$j = Object.defineProperties;
 var __getOwnPropDescs$j = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$k = Object.getOwnPropertySymbols;
-var __hasOwnProp$k = Object.prototype.hasOwnProperty;
-var __propIsEnum$k = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$n = (obj, key, value) => key in obj ? __defProp$n(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$k = (a, b) => {
+var __getOwnPropSymbols$l = Object.getOwnPropertySymbols;
+var __hasOwnProp$l = Object.prototype.hasOwnProperty;
+var __propIsEnum$l = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$o = (obj, key, value) => key in obj ? __defProp$o(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$l = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$k.call(b, prop))
-      __defNormalProp$n(a, prop, b[prop]);
-  if (__getOwnPropSymbols$k)
-    for (var prop of __getOwnPropSymbols$k(b)) {
-      if (__propIsEnum$k.call(b, prop))
-        __defNormalProp$n(a, prop, b[prop]);
+    if (__hasOwnProp$l.call(b, prop))
+      __defNormalProp$o(a, prop, b[prop]);
+  if (__getOwnPropSymbols$l)
+    for (var prop of __getOwnPropSymbols$l(b)) {
+      if (__propIsEnum$l.call(b, prop))
+        __defNormalProp$o(a, prop, b[prop]);
     }
   return a;
 };
@@ -5029,7 +5023,7 @@ const FourColumnLayout = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$j(__spreadValues$k({
+    __spreadProps$j(__spreadValues$l({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -5037,7 +5031,7 @@ const FourColumnLayout = ({
       children: items.map((child, idx) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          style: __spreadValues$k(__spreadValues$k({}, fractionWidth("25%")), buildItemContainerStyle(idx, count, props, true, scale)),
+          style: __spreadValues$l(__spreadValues$l({}, fractionWidth("25%")), buildItemContainerStyle(idx, count, props, true, scale)),
           children: child
         },
         idx
@@ -5045,21 +5039,21 @@ const FourColumnLayout = ({
     })
   );
 };
-var __defProp$m = Object.defineProperty;
+var __defProp$n = Object.defineProperty;
 var __defProps$i = Object.defineProperties;
 var __getOwnPropDescs$i = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$j = Object.getOwnPropertySymbols;
-var __hasOwnProp$j = Object.prototype.hasOwnProperty;
-var __propIsEnum$j = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$m = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$j = (a, b) => {
+var __getOwnPropSymbols$k = Object.getOwnPropertySymbols;
+var __hasOwnProp$k = Object.prototype.hasOwnProperty;
+var __propIsEnum$k = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$n = (obj, key, value) => key in obj ? __defProp$n(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$k = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$j.call(b, prop))
-      __defNormalProp$m(a, prop, b[prop]);
-  if (__getOwnPropSymbols$j)
-    for (var prop of __getOwnPropSymbols$j(b)) {
-      if (__propIsEnum$j.call(b, prop))
-        __defNormalProp$m(a, prop, b[prop]);
+    if (__hasOwnProp$k.call(b, prop))
+      __defNormalProp$n(a, prop, b[prop]);
+  if (__getOwnPropSymbols$k)
+    for (var prop of __getOwnPropSymbols$k(b)) {
+      if (__propIsEnum$k.call(b, prop))
+        __defNormalProp$n(a, prop, b[prop]);
     }
   return a;
 };
@@ -5088,8 +5082,8 @@ const TwoColumnLayout$1 = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$i(__spreadValues$j({
-      style: __spreadProps$i(__spreadValues$j({}, containerStyle), {
+    __spreadProps$i(__spreadValues$k({
+      style: __spreadProps$i(__spreadValues$k({}, containerStyle), {
         width: "100%"
       }),
       onClick: handleClick,
@@ -5098,7 +5092,7 @@ const TwoColumnLayout$1 = ({
       children: items.map((child, idx) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          style: __spreadProps$i(__spreadValues$j({}, buildItemContainerStyle(idx, count, props, true, scale)), {
+          style: __spreadProps$i(__spreadValues$k({}, buildItemContainerStyle(idx, count, props, true, scale)), {
             flex: idx === 0 ? 1 : "none",
             width: idx === 1 ? runStyle(props.rightWidth, scale) : "auto",
             flexDirection: "row"
@@ -5110,21 +5104,21 @@ const TwoColumnLayout$1 = ({
     })
   );
 };
-var __defProp$l = Object.defineProperty;
+var __defProp$m = Object.defineProperty;
 var __defProps$h = Object.defineProperties;
 var __getOwnPropDescs$h = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$i = Object.getOwnPropertySymbols;
-var __hasOwnProp$i = Object.prototype.hasOwnProperty;
-var __propIsEnum$i = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$l = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$i = (a, b) => {
+var __getOwnPropSymbols$j = Object.getOwnPropertySymbols;
+var __hasOwnProp$j = Object.prototype.hasOwnProperty;
+var __propIsEnum$j = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$m = (obj, key, value) => key in obj ? __defProp$m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$j = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$i.call(b, prop))
-      __defNormalProp$l(a, prop, b[prop]);
-  if (__getOwnPropSymbols$i)
-    for (var prop of __getOwnPropSymbols$i(b)) {
-      if (__propIsEnum$i.call(b, prop))
-        __defNormalProp$l(a, prop, b[prop]);
+    if (__hasOwnProp$j.call(b, prop))
+      __defNormalProp$m(a, prop, b[prop]);
+  if (__getOwnPropSymbols$j)
+    for (var prop of __getOwnPropSymbols$j(b)) {
+      if (__propIsEnum$j.call(b, prop))
+        __defNormalProp$m(a, prop, b[prop]);
     }
   return a;
 };
@@ -5153,7 +5147,7 @@ const TwoColumnLayout = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$h(__spreadValues$i({
+    __spreadProps$h(__spreadValues$j({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -5161,7 +5155,7 @@ const TwoColumnLayout = ({
       children: items.map((child, idx) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          style: __spreadProps$h(__spreadValues$i({}, buildItemContainerStyle(idx, count, props, true, scale)), {
+          style: __spreadProps$h(__spreadValues$j({}, buildItemContainerStyle(idx, count, props, true, scale)), {
             flex: idx === 1 ? 1 : 0,
             width: idx === 1 ? runStyle(props.leftWidth, scale) : "auto",
             flexDirection: "row"
@@ -5173,21 +5167,21 @@ const TwoColumnLayout = ({
     })
   );
 };
-var __defProp$k = Object.defineProperty;
+var __defProp$l = Object.defineProperty;
 var __defProps$g = Object.defineProperties;
 var __getOwnPropDescs$g = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$h = Object.getOwnPropertySymbols;
-var __hasOwnProp$h = Object.prototype.hasOwnProperty;
-var __propIsEnum$h = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$k = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$h = (a, b) => {
+var __getOwnPropSymbols$i = Object.getOwnPropertySymbols;
+var __hasOwnProp$i = Object.prototype.hasOwnProperty;
+var __propIsEnum$i = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$l = (obj, key, value) => key in obj ? __defProp$l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$i = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$h.call(b, prop))
-      __defNormalProp$k(a, prop, b[prop]);
-  if (__getOwnPropSymbols$h)
-    for (var prop of __getOwnPropSymbols$h(b)) {
-      if (__propIsEnum$h.call(b, prop))
-        __defNormalProp$k(a, prop, b[prop]);
+    if (__hasOwnProp$i.call(b, prop))
+      __defNormalProp$l(a, prop, b[prop]);
+  if (__getOwnPropSymbols$i)
+    for (var prop of __getOwnPropSymbols$i(b)) {
+      if (__propIsEnum$i.call(b, prop))
+        __defNormalProp$l(a, prop, b[prop]);
     }
   return a;
 };
@@ -5216,7 +5210,7 @@ const ThreeColumnLayout = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$g(__spreadValues$h({
+    __spreadProps$g(__spreadValues$i({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -5224,7 +5218,7 @@ const ThreeColumnLayout = ({
       children: items.map((child, idx) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          style: __spreadProps$g(__spreadValues$h({}, buildItemContainerStyle(idx, count, props, true, scale)), {
+          style: __spreadProps$g(__spreadValues$i({}, buildItemContainerStyle(idx, count, props, true, scale)), {
             flex: idx === 1 ? 1 : 0,
             flexDirection: "row"
           }),
@@ -5235,21 +5229,21 @@ const ThreeColumnLayout = ({
     })
   );
 };
-var __defProp$j = Object.defineProperty;
+var __defProp$k = Object.defineProperty;
 var __defProps$f = Object.defineProperties;
 var __getOwnPropDescs$f = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$g = Object.getOwnPropertySymbols;
-var __hasOwnProp$g = Object.prototype.hasOwnProperty;
-var __propIsEnum$g = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$j = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$g = (a, b) => {
+var __getOwnPropSymbols$h = Object.getOwnPropertySymbols;
+var __hasOwnProp$h = Object.prototype.hasOwnProperty;
+var __propIsEnum$h = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$k = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$h = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$g.call(b, prop))
-      __defNormalProp$j(a, prop, b[prop]);
-  if (__getOwnPropSymbols$g)
-    for (var prop of __getOwnPropSymbols$g(b)) {
-      if (__propIsEnum$g.call(b, prop))
-        __defNormalProp$j(a, prop, b[prop]);
+    if (__hasOwnProp$h.call(b, prop))
+      __defNormalProp$k(a, prop, b[prop]);
+  if (__getOwnPropSymbols$h)
+    for (var prop of __getOwnPropSymbols$h(b)) {
+      if (__propIsEnum$h.call(b, prop))
+        __defNormalProp$k(a, prop, b[prop]);
     }
   return a;
 };
@@ -5278,7 +5272,7 @@ const AbsoluteViewLayout = ({
   const count = items.length;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$f(__spreadValues$g({
+    __spreadProps$f(__spreadValues$h({
       style: absoluteContainerStyle,
       onClick: handleClick,
       ref: ref2
@@ -5294,21 +5288,21 @@ const AbsoluteViewLayout = ({
     })
   );
 };
-var __defProp$i = Object.defineProperty;
+var __defProp$j = Object.defineProperty;
 var __defProps$e = Object.defineProperties;
 var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
-var __hasOwnProp$f = Object.prototype.hasOwnProperty;
-var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$f = (a, b) => {
+var __getOwnPropSymbols$g = Object.getOwnPropertySymbols;
+var __hasOwnProp$g = Object.prototype.hasOwnProperty;
+var __propIsEnum$g = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$j = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$g = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$f.call(b, prop))
-      __defNormalProp$i(a, prop, b[prop]);
-  if (__getOwnPropSymbols$f)
-    for (var prop of __getOwnPropSymbols$f(b)) {
-      if (__propIsEnum$f.call(b, prop))
-        __defNormalProp$i(a, prop, b[prop]);
+    if (__hasOwnProp$g.call(b, prop))
+      __defNormalProp$j(a, prop, b[prop]);
+  if (__getOwnPropSymbols$g)
+    for (var prop of __getOwnPropSymbols$g(b)) {
+      if (__propIsEnum$g.call(b, prop))
+        __defNormalProp$j(a, prop, b[prop]);
     }
   return a;
 };
@@ -5337,7 +5331,7 @@ const AnimationLayout = ({
   const count = items.length;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$e(__spreadValues$f({
+    __spreadProps$e(__spreadValues$g({
       style: containerStyle,
       onClick: handleClick,
       ref: ref2
@@ -5353,21 +5347,21 @@ const AnimationLayout = ({
     })
   );
 };
-var __defProp$h = Object.defineProperty;
+var __defProp$i = Object.defineProperty;
 var __defProps$d = Object.defineProperties;
 var __getOwnPropDescs$d = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
-var __hasOwnProp$e = Object.prototype.hasOwnProperty;
-var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$e = (a, b) => {
+var __getOwnPropSymbols$f = Object.getOwnPropertySymbols;
+var __hasOwnProp$f = Object.prototype.hasOwnProperty;
+var __propIsEnum$f = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$f = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$e.call(b, prop))
-      __defNormalProp$h(a, prop, b[prop]);
-  if (__getOwnPropSymbols$e)
-    for (var prop of __getOwnPropSymbols$e(b)) {
-      if (__propIsEnum$e.call(b, prop))
-        __defNormalProp$h(a, prop, b[prop]);
+    if (__hasOwnProp$f.call(b, prop))
+      __defNormalProp$i(a, prop, b[prop]);
+  if (__getOwnPropSymbols$f)
+    for (var prop of __getOwnPropSymbols$f(b)) {
+      if (__propIsEnum$f.call(b, prop))
+        __defNormalProp$i(a, prop, b[prop]);
     }
   return a;
 };
@@ -5396,7 +5390,7 @@ const ScrollViewLayout = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      style: __spreadProps$d(__spreadValues$e({}, containerStyle), {
+      style: __spreadProps$d(__spreadValues$f({}, containerStyle), {
         width: (customProps == null ? void 0 : customProps.width) || "100%",
         height: (customProps == null ? void 0 : customProps.height) || "auto",
         whiteSpace: scrollX ? "nowrap" : "normal",
@@ -5407,7 +5401,7 @@ const ScrollViewLayout = ({
       onClick: handleClick,
       children: /* @__PURE__ */ jsxRuntime.jsx(
         "div",
-        __spreadProps$d(__spreadValues$e({
+        __spreadProps$d(__spreadValues$f({
           style: {
             display: "flex",
             flexDirection: scrollX ? "row" : "column",
@@ -5441,21 +5435,56 @@ const UnknownRenderer = ({
   }
   return null;
 };
-var __defProp$g = Object.defineProperty;
+const CustomLayout = ({
+  props,
+  children,
+  customComponent
+}) => {
+  const { scale } = useResponsive();
+  const { executeActions } = useAction$1();
+  const theme = useTheme$1();
+  const containerStyle = buildLayoutContainerStyle(
+    props,
+    "column",
+    theme,
+    scale
+  );
+  const getCompiledItemStyle = React.useCallback(
+    (idx, count) => buildItemContainerStyle(idx, count, props, false, scale),
+    [props, scale]
+  );
+  const handleClick = (e) => {
+    if (props.actions) {
+      void executeActions(props.actions);
+    }
+  };
+  const Component = customComponent;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      compiledContainerStyle: containerStyle,
+      getCompiledItemStyle,
+      compiledOnClick: handleClick,
+      compiledProps: props,
+      children
+    }
+  );
+};
+var __defProp$h = Object.defineProperty;
 var __defProps$c = Object.defineProperties;
 var __getOwnPropDescs$c = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
-var __hasOwnProp$d = Object.prototype.hasOwnProperty;
-var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$d = (a, b) => {
+var __getOwnPropSymbols$e = Object.getOwnPropertySymbols;
+var __hasOwnProp$e = Object.prototype.hasOwnProperty;
+var __propIsEnum$e = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$e = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$d.call(b, prop))
-      __defNormalProp$g(a, prop, b[prop]);
-  if (__getOwnPropSymbols$d)
-    for (var prop of __getOwnPropSymbols$d(b)) {
-      if (__propIsEnum$d.call(b, prop))
-        __defNormalProp$g(a, prop, b[prop]);
+    if (__hasOwnProp$e.call(b, prop))
+      __defNormalProp$h(a, prop, b[prop]);
+  if (__getOwnPropSymbols$e)
+    for (var prop of __getOwnPropSymbols$e(b)) {
+      if (__propIsEnum$e.call(b, prop))
+        __defNormalProp$h(a, prop, b[prop]);
     }
   return a;
 };
@@ -5463,16 +5492,17 @@ var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
 const LayoutWrapper = ({
   node: node2,
   originProps,
-  children
+  children,
+  customLayoutComponent
 }) => {
   if (!node2) return null;
   const { layoutType, props, subType } = node2;
   const layoutProps = props;
   switch (subType) {
     case "full-row":
-      return /* @__PURE__ */ jsxRuntime.jsx(FullRowLayout, __spreadProps$c(__spreadValues$d({ props: layoutProps }, { originProps }), { children }));
+      return /* @__PURE__ */ jsxRuntime.jsx(FullRowLayout, __spreadProps$c(__spreadValues$e({ props: layoutProps }, { originProps }), { children }));
     case "multiple-column":
-      return /* @__PURE__ */ jsxRuntime.jsx(MultipleColumnLayout, __spreadProps$c(__spreadValues$d({ props: layoutProps }, { originProps }), { children }));
+      return /* @__PURE__ */ jsxRuntime.jsx(MultipleColumnLayout, __spreadProps$c(__spreadValues$e({ props: layoutProps }, { originProps }), { children }));
     case "two-column":
       return /* @__PURE__ */ jsxRuntime.jsx(TwoColumnLayout$2, { props: layoutProps, children });
     case "three-column":
@@ -5490,9 +5520,16 @@ const LayoutWrapper = ({
     case "animation-layout":
       return /* @__PURE__ */ jsxRuntime.jsx(AnimationLayout, { props: layoutProps, children });
     case "scroll-view":
-      return /* @__PURE__ */ jsxRuntime.jsx(ScrollViewLayout, __spreadProps$c(__spreadValues$d({}, node2), { children }));
+      return /* @__PURE__ */ jsxRuntime.jsx(ScrollViewLayout, __spreadProps$c(__spreadValues$e({}, node2), { children }));
     default:
-      return /* @__PURE__ */ jsxRuntime.jsx(UnknownRenderer, { type: String(layoutType), prefix: "未知布局类型" });
+      return typeof (customLayoutComponent == null ? void 0 : customLayoutComponent[subType]) !== "undefined" ? /* @__PURE__ */ jsxRuntime.jsx(
+        CustomLayout,
+        {
+          customComponent: customLayoutComponent[subType],
+          props: layoutProps,
+          children
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx(UnknownRenderer, { type: String(layoutType), prefix: "未知布局类型" });
   }
 };
 const isPlainObject$1 = (obj) => Object.prototype.toString.call(obj) === "[object Object]";
@@ -5512,21 +5549,21 @@ const makeOnChange = (name, onChange) => (eOrValue) => {
   const value = normalizeEventValue(eOrValue);
   onChange({ name, value });
 };
-var __defProp$f = Object.defineProperty;
+var __defProp$g = Object.defineProperty;
 var __defProps$b = Object.defineProperties;
 var __getOwnPropDescs$b = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
-var __hasOwnProp$c = Object.prototype.hasOwnProperty;
-var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$c = (a, b) => {
+var __getOwnPropSymbols$d = Object.getOwnPropertySymbols;
+var __hasOwnProp$d = Object.prototype.hasOwnProperty;
+var __propIsEnum$d = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$d = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$c.call(b, prop))
-      __defNormalProp$f(a, prop, b[prop]);
-  if (__getOwnPropSymbols$c)
-    for (var prop of __getOwnPropSymbols$c(b)) {
-      if (__propIsEnum$c.call(b, prop))
-        __defNormalProp$f(a, prop, b[prop]);
+    if (__hasOwnProp$d.call(b, prop))
+      __defNormalProp$g(a, prop, b[prop]);
+  if (__getOwnPropSymbols$d)
+    for (var prop of __getOwnPropSymbols$d(b)) {
+      if (__propIsEnum$d.call(b, prop))
+        __defNormalProp$g(a, prop, b[prop]);
     }
   return a;
 };
@@ -5545,7 +5582,7 @@ const TextRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
-    __spreadProps$b(__spreadValues$c({
+    __spreadProps$b(__spreadValues$d({
       style: style2,
       onClick: handleClick,
       ref: ref2
@@ -5563,21 +5600,21 @@ const MarkdownRender = (props) => {
   const originProps = props.originProps || {};
   return (originProps == null ? void 0 : originProps.renderMarkdown) ? (_a = originProps == null ? void 0 : originProps.renderMarkdown) == null ? void 0 : _a.call(originProps, { text: content }) : /* @__PURE__ */ jsxRuntime.jsx(MarkdownRender, { content });
 };
-var __defProp$e = Object.defineProperty;
+var __defProp$f = Object.defineProperty;
 var __defProps$a = Object.defineProperties;
 var __getOwnPropDescs$a = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
-var __hasOwnProp$b = Object.prototype.hasOwnProperty;
-var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$b = (a, b) => {
+var __getOwnPropSymbols$c = Object.getOwnPropertySymbols;
+var __hasOwnProp$c = Object.prototype.hasOwnProperty;
+var __propIsEnum$c = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$c = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$b.call(b, prop))
-      __defNormalProp$e(a, prop, b[prop]);
-  if (__getOwnPropSymbols$b)
-    for (var prop of __getOwnPropSymbols$b(b)) {
-      if (__propIsEnum$b.call(b, prop))
-        __defNormalProp$e(a, prop, b[prop]);
+    if (__hasOwnProp$c.call(b, prop))
+      __defNormalProp$f(a, prop, b[prop]);
+  if (__getOwnPropSymbols$c)
+    for (var prop of __getOwnPropSymbols$c(b)) {
+      if (__propIsEnum$c.call(b, prop))
+        __defNormalProp$f(a, prop, b[prop]);
     }
   return a;
 };
@@ -5589,11 +5626,11 @@ const ImageRender = (props) => {
   const { ref: ref2, onClick, onMouseEnter, onMouseLeave } = useForEditor(props);
   const viewStyle = imageViewStyleFromProps(props, theme, scale);
   const style2 = imageStyleFromProps(
-    __spreadValues$b({ width: props.width, height: props.height, fit: props.fit }, props),
+    __spreadValues$c({ width: props.width, height: props.height, fit: props.fit }, props),
     theme,
     scale
   );
-  const imgUrl = getImageUrl(__spreadValues$b({ url: props.src }, props));
+  const imgUrl = getImageUrl(__spreadValues$c({ url: props.src }, props));
   const handleClick = (e) => {
     if (props == null ? void 0 : props.actions) {
       void executeActions(props.actions);
@@ -5602,7 +5639,7 @@ const ImageRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$a(__spreadValues$b({
+    __spreadProps$a(__spreadValues$c({
       onClick: props.actions ? handleClick : void 0,
       style: viewStyle,
       ref: ref2
@@ -10038,7 +10075,7 @@ function derivative(token2) {
     generateNeutralColorPalettes
   })), genFontMapToken(token2.fontSize)), genSizeMapToken(token2)), genControlHeight(token2)), genCommonMapToken(token2));
 }
-const defaultTheme$1 = createTheme(derivative);
+const defaultTheme = createTheme(derivative);
 const defaultConfig = {
   token: seedToken,
   override: {
@@ -11081,7 +11118,7 @@ function useToken() {
     cssVar
   } = React.useContext(DesignTokenContext);
   const salt = `${version$1}-${hashed || ""}`;
-  const mergedTheme = theme || defaultTheme$1;
+  const mergedTheme = theme || defaultTheme;
   const [token2, hashId, realToken] = useCacheToken(mergedTheme, [seedToken, rootDesignToken], {
     salt,
     override,
@@ -12269,7 +12306,7 @@ const ProviderChildren = (props) => {
       components,
       cssVar
     } = _a, rest = __rest$e(_a, ["algorithm", "token", "components", "cssVar"]);
-    const themeObj = algorithm && (!Array.isArray(algorithm) || algorithm.length > 0) ? createTheme(algorithm) : defaultTheme$1;
+    const themeObj = algorithm && (!Array.isArray(algorithm) || algorithm.length > 0) ? createTheme(algorithm) : defaultTheme;
     const parsedComponents = {};
     Object.entries(components || {}).forEach(([componentName, componentToken]) => {
       const parsedToken = Object.assign({}, componentToken);
@@ -29485,21 +29522,21 @@ Input2.Search = Search;
 Input2.TextArea = TextArea;
 Input2.Password = Password;
 Input2.OTP = OTP;
-var __defProp$d = Object.defineProperty;
+var __defProp$e = Object.defineProperty;
 var __defProps$9 = Object.defineProperties;
 var __getOwnPropDescs$9 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
-var __hasOwnProp$a = Object.prototype.hasOwnProperty;
-var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$a = (a, b) => {
+var __getOwnPropSymbols$b = Object.getOwnPropertySymbols;
+var __hasOwnProp$b = Object.prototype.hasOwnProperty;
+var __propIsEnum$b = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$b = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$a.call(b, prop))
-      __defNormalProp$d(a, prop, b[prop]);
-  if (__getOwnPropSymbols$a)
-    for (var prop of __getOwnPropSymbols$a(b)) {
-      if (__propIsEnum$a.call(b, prop))
-        __defNormalProp$d(a, prop, b[prop]);
+    if (__hasOwnProp$b.call(b, prop))
+      __defNormalProp$e(a, prop, b[prop]);
+  if (__getOwnPropSymbols$b)
+    for (var prop of __getOwnPropSymbols$b(b)) {
+      if (__propIsEnum$b.call(b, prop))
+        __defNormalProp$e(a, prop, b[prop]);
     }
   return a;
 };
@@ -29518,7 +29555,7 @@ const InputRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$9(__spreadValues$a({
+    __spreadProps$9(__spreadValues$b({
       style: style2,
       onClick: handleContainerClick,
       ref: ref2
@@ -29538,21 +29575,21 @@ const InputRender = (props) => {
     })
   );
 };
-var __defProp$c = Object.defineProperty;
+var __defProp$d = Object.defineProperty;
 var __defProps$8 = Object.defineProperties;
 var __getOwnPropDescs$8 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
-var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
-var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$9 = (a, b) => {
+var __getOwnPropSymbols$a = Object.getOwnPropertySymbols;
+var __hasOwnProp$a = Object.prototype.hasOwnProperty;
+var __propIsEnum$a = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$a = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$9.call(b, prop))
-      __defNormalProp$c(a, prop, b[prop]);
-  if (__getOwnPropSymbols$9)
-    for (var prop of __getOwnPropSymbols$9(b)) {
-      if (__propIsEnum$9.call(b, prop))
-        __defNormalProp$c(a, prop, b[prop]);
+    if (__hasOwnProp$a.call(b, prop))
+      __defNormalProp$d(a, prop, b[prop]);
+  if (__getOwnPropSymbols$a)
+    for (var prop of __getOwnPropSymbols$a(b)) {
+      if (__propIsEnum$a.call(b, prop))
+        __defNormalProp$d(a, prop, b[prop]);
     }
   return a;
 };
@@ -29579,7 +29616,7 @@ const SelectRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$8(__spreadValues$9({
+    __spreadProps$8(__spreadValues$a({
       onClick: handleContainerClick,
       ref: ref2
     }, { onMouseEnter, onMouseLeave }), {
@@ -29596,21 +29633,21 @@ const SelectRender = (props) => {
     })
   );
 };
-var __defProp$b = Object.defineProperty;
+var __defProp$c = Object.defineProperty;
 var __defProps$7 = Object.defineProperties;
 var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
-var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
-var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$8 = (a, b) => {
+var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
+var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
+var __propIsEnum$9 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$9 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$8.call(b, prop))
-      __defNormalProp$b(a, prop, b[prop]);
-  if (__getOwnPropSymbols$8)
-    for (var prop of __getOwnPropSymbols$8(b)) {
-      if (__propIsEnum$8.call(b, prop))
-        __defNormalProp$b(a, prop, b[prop]);
+    if (__hasOwnProp$9.call(b, prop))
+      __defNormalProp$c(a, prop, b[prop]);
+  if (__getOwnPropSymbols$9)
+    for (var prop of __getOwnPropSymbols$9(b)) {
+      if (__propIsEnum$9.call(b, prop))
+        __defNormalProp$c(a, prop, b[prop]);
     }
   return a;
 };
@@ -29630,7 +29667,7 @@ const RadioRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$7(__spreadValues$8({
+    __spreadProps$7(__spreadValues$9({
       style: style2,
       onClick: handleContainerClick,
       ref: ref2
@@ -29642,21 +29679,21 @@ const RadioRender = (props) => {
     })
   );
 };
-var __defProp$a = Object.defineProperty;
+var __defProp$b = Object.defineProperty;
 var __defProps$6 = Object.defineProperties;
 var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
-var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
-var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$7 = (a, b) => {
+var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
+var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
+var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$8 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$7.call(b, prop))
-      __defNormalProp$a(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b)) {
-      if (__propIsEnum$7.call(b, prop))
-        __defNormalProp$a(a, prop, b[prop]);
+    if (__hasOwnProp$8.call(b, prop))
+      __defNormalProp$b(a, prop, b[prop]);
+  if (__getOwnPropSymbols$8)
+    for (var prop of __getOwnPropSymbols$8(b)) {
+      if (__propIsEnum$8.call(b, prop))
+        __defNormalProp$b(a, prop, b[prop]);
     }
   return a;
 };
@@ -29684,7 +29721,7 @@ const CheckboxRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
-    __spreadProps$6(__spreadValues$7({
+    __spreadProps$6(__spreadValues$8({
       style: style2,
       onClick: handleContainerClick,
       ref: ref2
@@ -29696,21 +29733,21 @@ const CheckboxRender = (props) => {
     })
   );
 };
-var __defProp$9 = Object.defineProperty;
+var __defProp$a = Object.defineProperty;
 var __defProps$5 = Object.defineProperties;
 var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$6 = (a, b) => {
+var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
+var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
+var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$7 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$6.call(b, prop))
-      __defNormalProp$9(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b)) {
-      if (__propIsEnum$6.call(b, prop))
-        __defNormalProp$9(a, prop, b[prop]);
+    if (__hasOwnProp$7.call(b, prop))
+      __defNormalProp$a(a, prop, b[prop]);
+  if (__getOwnPropSymbols$7)
+    for (var prop of __getOwnPropSymbols$7(b)) {
+      if (__propIsEnum$7.call(b, prop))
+        __defNormalProp$a(a, prop, b[prop]);
     }
   return a;
 };
@@ -29736,7 +29773,7 @@ const TextListRender = (props) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
-    __spreadProps$5(__spreadValues$6({
+    __spreadProps$5(__spreadValues$7({
       style: style2,
       onClick: handleContainerClick,
       ref: ref2
@@ -29790,26 +29827,26 @@ const TextListRender = (props) => {
     })
   );
 };
-var __defProp$8 = Object.defineProperty;
+var __defProp$9 = Object.defineProperty;
 var __defProps$4 = Object.defineProperties;
 var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
-var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
-var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$5 = (a, b) => {
+var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
+var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
+var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$6 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$5.call(b, prop))
-      __defNormalProp$8(a, prop, b[prop]);
-  if (__getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(b)) {
-      if (__propIsEnum$5.call(b, prop))
-        __defNormalProp$8(a, prop, b[prop]);
+    if (__hasOwnProp$6.call(b, prop))
+      __defNormalProp$9(a, prop, b[prop]);
+  if (__getOwnPropSymbols$6)
+    for (var prop of __getOwnPropSymbols$6(b)) {
+      if (__propIsEnum$6.call(b, prop))
+        __defNormalProp$9(a, prop, b[prop]);
     }
   return a;
 };
 var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
-const CustomRender = (props) => {
+const CustomRenderFromIM = (props) => {
   const { executeActions, getLocalData } = useAction$1();
   const { originProps } = props;
   const { ctx } = originProps || {};
@@ -29841,32 +29878,32 @@ const CustomRender = (props) => {
       },
       {}
     );
-    return __spreadProps$4(__spreadValues$5({}, actions), {
+    return __spreadProps$4(__spreadValues$6({}, actions), {
       getLocalData
     });
   }, [executeActions, getLocalData]);
   if (!CustomComp)
     return /* @__PURE__ */ jsxRuntime.jsx(UnknownRenderer, { type: props == null ? void 0 : props.customCode, prefix: "渲染类型错误" });
   if (React.isValidElement(CustomComp)) {
-    return React.cloneElement(CustomComp, __spreadProps$4(__spreadValues$5(__spreadValues$5(__spreadValues$5({}, (CustomComp == null ? void 0 : CustomComp.props) || {}), originProps), props), {
+    return React.cloneElement(CustomComp, __spreadProps$4(__spreadValues$6(__spreadValues$6(__spreadValues$6({}, (CustomComp == null ? void 0 : CustomComp.props) || {}), originProps), props), {
       AUIActions
     }));
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(CustomComp, __spreadProps$4(__spreadValues$5(__spreadValues$5({}, originProps), props), { AUIActions }));
+  return /* @__PURE__ */ jsxRuntime.jsx(CustomComp, __spreadProps$4(__spreadValues$6(__spreadValues$6({}, originProps), props), { AUIActions }));
 };
-var __defProp$7 = Object.defineProperty;
-var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
-var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
-var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$4 = (a, b) => {
+var __defProp$8 = Object.defineProperty;
+var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
+var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
+var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$5 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$4.call(b, prop))
-      __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$4)
-    for (var prop of __getOwnPropSymbols$4(b)) {
-      if (__propIsEnum$4.call(b, prop))
-        __defNormalProp$7(a, prop, b[prop]);
+    if (__hasOwnProp$5.call(b, prop))
+      __defNormalProp$8(a, prop, b[prop]);
+  if (__getOwnPropSymbols$5)
+    for (var prop of __getOwnPropSymbols$5(b)) {
+      if (__propIsEnum$5.call(b, prop))
+        __defNormalProp$8(a, prop, b[prop]);
     }
   return a;
 };
@@ -29880,7 +29917,7 @@ const DividerRender = (props) => {
       void executeActions(props.actions);
     }
   };
-  const style2 = __spreadValues$4({
+  const style2 = __spreadValues$5({
     width: "100%",
     height: props.height ? runStyle(props.height, scale) : "1px",
     backgroundColor: props.color ? ((_a = theme.color) == null ? void 0 : _a[props.color]) || props.color : "#eeeeee",
@@ -29892,21 +29929,41 @@ const DashLine = (props) => {
   const { style: style2 } = props;
   return /* @__PURE__ */ jsxRuntime.jsx("div", { style: style2, className: "dash-line" });
 };
-var __defProp$6 = Object.defineProperty;
+const CustomRenderFromProps = ({ props, component }) => {
+  const theme = useTheme$1();
+  const { scale } = useResponsive();
+  const { executeActions } = useAction$1();
+  const style2 = textStyleFromTheme(theme, props, scale);
+  const handleClick = (e) => {
+    if (props.actions) {
+      void executeActions(props.actions);
+    }
+  };
+  const Component = component;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      compiledStyle: style2,
+      compiledOnClick: handleClick,
+      compiledProps: props
+    }
+  );
+};
+var __defProp$7 = Object.defineProperty;
 var __defProps$3 = Object.defineProperties;
 var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
-var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
-var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$3 = (a, b) => {
+var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$4 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$3.call(b, prop))
-      __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$3)
-    for (var prop of __getOwnPropSymbols$3(b)) {
-      if (__propIsEnum$3.call(b, prop))
-        __defNormalProp$6(a, prop, b[prop]);
+    if (__hasOwnProp$4.call(b, prop))
+      __defNormalProp$7(a, prop, b[prop]);
+  if (__getOwnPropSymbols$4)
+    for (var prop of __getOwnPropSymbols$4(b)) {
+      if (__propIsEnum$4.call(b, prop))
+        __defNormalProp$7(a, prop, b[prop]);
     }
   return a;
 };
@@ -29916,7 +29973,8 @@ const LeafWrapper = ({
   values,
   onChange,
   originProps,
-  children
+  children,
+  customRenderComponent
 }) => {
   var _a, _b, _c, _d, _e, _f;
   const createOnChange = React.useCallback(
@@ -29929,19 +29987,19 @@ const LeafWrapper = ({
   const { renderType, props, subType } = node2;
   switch (subType) {
     case "text":
-      return /* @__PURE__ */ jsxRuntime.jsx(TextRender, __spreadValues$3({}, props));
+      return /* @__PURE__ */ jsxRuntime.jsx(TextRender, __spreadValues$4({}, props));
     case "markdown":
-      return /* @__PURE__ */ jsxRuntime.jsx(MarkdownRender, __spreadProps$3(__spreadValues$3({}, props), { originProps }));
+      return /* @__PURE__ */ jsxRuntime.jsx(MarkdownRender, __spreadProps$3(__spreadValues$4({}, props), { originProps }));
     case "image":
-      return /* @__PURE__ */ jsxRuntime.jsx(ImageRender, __spreadValues$3({}, props));
+      return /* @__PURE__ */ jsxRuntime.jsx(ImageRender, __spreadValues$4({}, props));
     case "text-list":
-      return /* @__PURE__ */ jsxRuntime.jsx(TextListRender, __spreadProps$3(__spreadValues$3({}, props), { children }));
+      return /* @__PURE__ */ jsxRuntime.jsx(TextListRender, __spreadProps$3(__spreadValues$4({}, props), { children }));
     case "input": {
       const p = props;
       const value = (_b = (_a = p.value) != null ? _a : p.name ? values == null ? void 0 : values[p.name] : void 0) != null ? _b : "";
       return /* @__PURE__ */ jsxRuntime.jsx(
         InputRender,
-        __spreadProps$3(__spreadValues$3({}, props), {
+        __spreadProps$3(__spreadValues$4({}, props), {
           value,
           onChange: createOnChange(p.name)
         })
@@ -29952,7 +30010,7 @@ const LeafWrapper = ({
       const value = (_c = p.value) != null ? _c : p.name ? values == null ? void 0 : values[p.name] : void 0;
       return /* @__PURE__ */ jsxRuntime.jsx(
         SelectRender,
-        __spreadProps$3(__spreadValues$3({}, props), {
+        __spreadProps$3(__spreadValues$4({}, props), {
           value,
           onChange: createOnChange(p.name)
         })
@@ -29963,7 +30021,7 @@ const LeafWrapper = ({
       const value = (_d = p.value) != null ? _d : p.name ? values == null ? void 0 : values[p.name] : void 0;
       return /* @__PURE__ */ jsxRuntime.jsx(
         RadioRender,
-        __spreadProps$3(__spreadValues$3({}, props), {
+        __spreadProps$3(__spreadValues$4({}, props), {
           value,
           onChange: createOnChange(p.name)
         })
@@ -29974,30 +30032,38 @@ const LeafWrapper = ({
       const valuesArr = (_f = (_e = p.values) != null ? _e : p.name ? values == null ? void 0 : values[p.name] : void 0) != null ? _f : [];
       return /* @__PURE__ */ jsxRuntime.jsx(
         CheckboxRender,
-        __spreadProps$3(__spreadValues$3({}, props), {
+        __spreadProps$3(__spreadValues$4({}, props), {
           values: valuesArr,
           onChange: createOnChange(p.name)
         })
       );
     }
     case "divider": {
-      return /* @__PURE__ */ jsxRuntime.jsx(DividerRender, __spreadValues$3({}, props));
+      return /* @__PURE__ */ jsxRuntime.jsx(DividerRender, __spreadValues$4({}, props));
     }
     case "dashline": {
-      return /* @__PURE__ */ jsxRuntime.jsx(DashLine, __spreadValues$3({}, props));
+      return /* @__PURE__ */ jsxRuntime.jsx(DashLine, __spreadValues$4({}, props));
     }
     case "custom-render": {
-      return /* @__PURE__ */ jsxRuntime.jsx(CustomRender, __spreadProps$3(__spreadValues$3({}, props), { originProps }));
+      return /* @__PURE__ */ jsxRuntime.jsx(CustomRenderFromIM, __spreadProps$3(__spreadValues$4({}, props), { originProps }));
     }
     default:
-      return /* @__PURE__ */ jsxRuntime.jsx(UnknownRenderer, { type: String(renderType), prefix: "未知渲染类型" });
+      return typeof (customRenderComponent == null ? void 0 : customRenderComponent[subType]) !== "undefined" ? /* @__PURE__ */ jsxRuntime.jsx(
+        CustomRenderFromProps,
+        {
+          props,
+          component: customRenderComponent[subType]
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx(UnknownRenderer, { type: String(renderType), prefix: "未知渲染类型" });
   }
 };
 const ComponentRenderer = ({
   nodes,
   values,
   onChange,
-  originProps
+  originProps,
+  customRenderComponent,
+  customLayoutComponent
 }) => {
   var _a;
   try {
@@ -30013,7 +30079,16 @@ const ComponentRenderer = ({
     return (_b = (_a2 = children == null ? void 0 : children.map) == null ? void 0 : _a2.call(children, (child, idx) => renderNode(child, idx))) != null ? _b : null;
   };
   const layoutComponentFn = (node2, key) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(LayoutWrapper, { node: node2, originProps, children: renderChildren(node2.children) }, key);
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      LayoutWrapper,
+      {
+        node: node2,
+        originProps,
+        customLayoutComponent,
+        children: renderChildren(node2.children)
+      },
+      key
+    );
   };
   const renderComponentFn = (node2, key) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -30023,6 +30098,7 @@ const ComponentRenderer = ({
         values,
         onChange,
         originProps,
+        customRenderComponent,
         children: renderChildren(node2.children)
       },
       key
@@ -30038,27 +30114,35 @@ const ComponentRenderer = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: (_a = nodes == null ? void 0 : nodes.map) == null ? void 0 : _a.call(nodes, (n, idx) => renderNode(n, idx)) });
 };
-var __defProp$5 = Object.defineProperty;
+var __defProp$6 = Object.defineProperty;
 var __defProps$2 = Object.defineProperties;
 var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
-var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
-var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$2 = (a, b) => {
+var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$3 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$2.call(b, prop))
-      __defNormalProp$5(a, prop, b[prop]);
-  if (__getOwnPropSymbols$2)
-    for (var prop of __getOwnPropSymbols$2(b)) {
-      if (__propIsEnum$2.call(b, prop))
-        __defNormalProp$5(a, prop, b[prop]);
+    if (__hasOwnProp$3.call(b, prop))
+      __defNormalProp$6(a, prop, b[prop]);
+  if (__getOwnPropSymbols$3)
+    for (var prop of __getOwnPropSymbols$3(b)) {
+      if (__propIsEnum$3.call(b, prop))
+        __defNormalProp$6(a, prop, b[prop]);
     }
   return a;
 };
 var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 const MessageContainer = (props) => {
-  const { component, dataSources, theme, onAction, externalActions } = props;
+  const {
+    component,
+    dataSources,
+    theme,
+    onAction,
+    externalActions,
+    customRenderComponent,
+    customLayoutComponent
+  } = props;
   const { template, referenceComponentList, data } = component;
   const { editorMode: editorMode2 } = useForEditor({});
   const [values, setValues] = React.useState({});
@@ -30102,7 +30186,7 @@ const MessageContainer = (props) => {
     };
   }, [dataSources]);
   const mergedData = React.useMemo(() => {
-    return __spreadValues$2(__spreadValues$2(__spreadValues$2({}, dsValues || {}), data || {}), values || {});
+    return __spreadValues$3(__spreadValues$3(__spreadValues$3({}, dsValues || {}), data || {}), values || {});
   }, [dsValues, data, values]);
   React.useMemo(() => {
     try {
@@ -30123,7 +30207,7 @@ const MessageContainer = (props) => {
   const handleChange = React.useCallback(
     (payload) => {
       setValues((prev2) => {
-        const next2 = __spreadProps$2(__spreadValues$2({}, prev2), { [payload.name]: payload.value });
+        const next2 = __spreadProps$2(__spreadValues$3({}, prev2), { [payload.name]: payload.value });
         return next2;
       });
       onAction == null ? void 0 : onAction({ type: "change", payload });
@@ -30152,7 +30236,9 @@ const MessageContainer = (props) => {
             nodes,
             values,
             onChange: handleChange,
-            originProps: props
+            originProps: props,
+            customLayoutComponent,
+            customRenderComponent
           }
         )
       ] })
@@ -30163,9 +30249,9 @@ const MessageContainer = (props) => {
   }
   return content;
 };
-var __defProp$4 = Object.defineProperty;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$2 = (obj, key, value) => __defNormalProp$4(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$5 = Object.defineProperty;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$2 = (obj, key, value) => __defNormalProp$5(obj, typeof key !== "symbol" ? key + "" : key, value);
 class CacheStorage {
   // 估算每个缓存条目大小（字节）
   constructor(namespace) {
@@ -33440,9 +33526,9 @@ var color = /* @__PURE__ */ function() {
     return _ref3.apply(this, arguments);
   };
 }();
-var __defProp$3 = Object.defineProperty;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$1 = (obj, key, value) => __defNormalProp$3(obj, key + "", value);
+var __defProp$4 = Object.defineProperty;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$1 = (obj, key, value) => __defNormalProp$4(obj, key + "", value);
 class TemplateRequestPool {
   constructor() {
     __publicField$1(this, "pendingRequests", /* @__PURE__ */ new Map());
@@ -33560,9 +33646,9 @@ const parseApiResponse = (response) => {
   }
   return resultMap;
 };
-var __defProp$2 = Object.defineProperty;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$3 = Object.defineProperty;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp$3(obj, typeof key !== "symbol" ? key + "" : key, value);
 class TemplateCache {
   constructor() {
     __publicField(this, "memoryCache", /* @__PURE__ */ new Map());
@@ -33685,21 +33771,21 @@ class TemplateCache {
   }
 }
 const templateCache = new TemplateCache();
-var __defProp$1 = Object.defineProperty;
+var __defProp$2 = Object.defineProperty;
 var __defProps$1 = Object.defineProperties;
 var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$2 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$1(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$1(a, prop, b[prop]);
+    if (__hasOwnProp$2.call(b, prop))
+      __defNormalProp$2(a, prop, b[prop]);
+  if (__getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(b)) {
+      if (__propIsEnum$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
     }
   return a;
 };
@@ -33732,7 +33818,7 @@ const useTemplate = (options) => {
         return;
       }
       try {
-        const cacheContext = apiConfig.osName ? __spreadProps$1(__spreadValues$1({}, context), { osName: apiConfig.osName }) : context;
+        const cacheContext = apiConfig.osName ? __spreadProps$1(__spreadValues$2({}, context), { osName: apiConfig.osName }) : context;
         if (cardId) {
           const cacheResult = await templateCache.get(cardId, cacheContext);
           if (!mountedRef.current) return;
@@ -33844,33 +33930,31 @@ const useMessageCardLogic = (props) => {
     theme
   };
 };
-var __defProp = Object.defineProperty;
+var __defProp$1 = Object.defineProperty;
 var __defProps = Object.defineProperties;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
     }
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const MessageCard = (props) => {
-  const { width = 375 } = props;
   const responsiveValue = React.useMemo(() => {
     return {
-      width,
-      scale: width / 375
+      scale: 0.5
     };
-  }, [width]);
+  }, []);
   const {
     templateJson,
     templateData,
@@ -33880,18 +33964,19 @@ const MessageCard = (props) => {
     configData,
     theme
   } = useMessageCardLogic(props);
+  const { data = {} } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(ResponsiveContext.Provider, { value: responsiveValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "message-card-wrapper", children: /* @__PURE__ */ jsxRuntime.jsx(
     Render,
-    __spreadValues({
-      component: __spreadProps(__spreadValues({}, templateJson), {
-        data: __spreadProps(__spreadValues(__spreadValues({
+    __spreadValues$1({
+      component: __spreadProps(__spreadValues$1({}, templateJson), {
+        data: __spreadProps(__spreadValues$1(__spreadValues$1({
           metadata: props.metadata,
           message: props.message,
           latest: props == null ? void 0 : props.latest,
           routerParams,
           storageData,
           configData
-        }, templateData), props.data), {
+        }, templateData), data), {
           initProps: props
         })
       }),
@@ -33904,58 +33989,33 @@ const MessageCard = (props) => {
   ) }) });
 };
 const MessageCard_default = React.forwardRef(MessageCard);
-const defaultTheme = {
-  fontSize: {
-    FontSizes_JDH_Headline1: 46,
-    FontSizes_JDH_Headline2: 34,
-    FontSizes_JDH_Title: 30,
-    FontSizes_JDH_Text: 28,
-    FontSizes_JDH_AccentText: 24,
-    FontSizes_JDH_TagText: 20
-  },
-  color: {
-    Color_JDH_Primary: "#17CB8E",
-    Color_JDH_Accent1: "#FF8000",
-    Color_JDH_Accent2: "#73B0FF",
-    Color_JDH_Red_Danger: "#FF0F23",
-    Color_JDH_Red_Price: "#FF0F23",
-    Color_JDH_Red_Discount: "#FF0F23",
-    Color_JDH_Green_Success: "#67CC52",
-    Color_JDH_Gray_Headline: "#222222",
-    Color_JDH_Gray_Text: "#222222",
-    Color_JDH_Gray_SecondText: "#575859",
-    Color_JDH_Gray_AccentText: "#858687",
-    Color_JDH_Gray_DividingLine: "#D3D3D3",
-    Color_JDH_Gray_Background: "#F5F5F6",
-    Color_JDH_Gray_CardBackground: "#E5E9EB",
-    Color_JDH_Gray_Card: "#FFFFFF",
-    Color_JDH_Gray_Mask: "#00000080"
-  },
-  fontWeight: {
-    FontWeight_JDH_Normal: 400,
-    FontWeight_JDH_Medium: 500
-  },
-  space: {
-    "spacing-xs": 4,
-    "spacing-sm": 8,
-    "spacing-md": 16,
-    "spacing-lg": 20,
-    "spacing-xl": 24,
-    "spacing-xxl": 32
-  },
-  borderRadius: {
-    Radius_JDH_LargeExtra: 32,
-    Radius_JDH_Large: 24,
-    Radius_JDH_Medium: 16,
-    Radius_JDH_Small: 8,
-    Radius_JDH_Mini: 6
-  },
-  components: {}
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+const createRenderComponent = (Comp) => {
+  return ({ compiledStyle, compiledOnClick, compiledProps }) => {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { style: compiledStyle, onClick: compiledOnClick, children: /* @__PURE__ */ jsxRuntime.jsx(Comp, __spreadValues({}, compiledProps)) });
+  };
 };
 exports.MessageCard = MessageCard_default;
+exports.MessageContainer = MessageContainer;
 exports.ThemeProvider = ThemeProvider;
+exports.createRenderComponent = createRenderComponent;
 exports.default = MessageCard_default;
-exports.defaultTheme = defaultTheme;
+exports.defaultTheme = defaultTheme$1;
 exports.isLayoutNode = isLayoutNode;
 exports.isRenderNode = isRenderNode;
 exports.useTheme = useTheme$1;