@blocklet/pages-kit-inner-components 0.4.82 → 0.4.83

package/lib/es/setting.js

@@ -1,102 +1,102 @@
-import { jsx as t, jsxs as S, Fragment as J } from "react/jsx-runtime";
-import { t as ve, g as ie, i as Me, b as He, h as ae, E as yt, n as Ye, j as ge } from "./_chunks/state-DqChB5ys.js";
+import { jsx as t, jsxs as S, Fragment as H } from "react/jsx-runtime";
+import { t as ye, g as ne, i as _e, b as Je, h as de, E as yt, n as $e, j as ve } from "./_chunks/state-DqChB5ys.js";
 import ee from "@arcblock/ux/lib/Empty";
 import { useLocaleContext as N } from "@arcblock/ux/lib/Locale/context";
-import { CodeEditor as xe } from "@blocklet/code-editor";
+import { CodeEditor as ge } from "@blocklet/code-editor";
 import vt from "@mui/icons-material/AddRounded";
 import gt from "@mui/icons-material/ArrowDownward";
 import xt from "@mui/icons-material/ArrowUpward";
 import kt from "@mui/icons-material/DeleteOutline";
-import { Typography as $, TextField as D, Stack as j, FormLabel as ne, Box as O, TableContainer as wt, Paper as de, Table as Le, TableHead as Ge, TableRow as oe, TableCell as le, TableBody as qe, Button as A, IconButton as ke, FormControlLabel as Qe, Switch as Xe, InputAdornment as ue, Dialog as pe, DialogTitle as we, DialogContent as Pe, DialogActions as Ie, alpha as Pt, Tooltip as Z, buttonClasses as It, Autocomplete as Ze, MenuItem as me, Divider as St, Popper as Ot } from "@mui/material";
+import { Typography as J, TextField as D, Stack as j, FormLabel as oe, Box as C, TableContainer as wt, Paper as te, Table as Me, TableHead as He, TableRow as le, TableCell as se, TableBody as Ye, Button as A, IconButton as xe, FormControlLabel as Le, Switch as Ge, InputAdornment as ue, Dialog as ke, DialogTitle as qe, DialogContent as Qe, DialogActions as Xe, alpha as Pt, Tooltip as Z, buttonClasses as It, Autocomplete as Ze, MenuItem as pe, Collapse as St, Divider as Ot, Popper as Ct } from "@mui/material";
 import V from "lodash/sortBy";
-import { useCallback as T, useMemo as se, forwardRef as et, useState as M, useEffect as H, useImperativeHandle as tt, lazy as Ct, Suspense as jt, useRef as F, useId as zt } from "react";
-import { useUpdate as rt, useDebounce as Rt } from "react-use";
-import { styled as Dt } from "@arcblock/ux/lib/Theme";
-import { cx as Nt } from "@emotion/css";
-import { useReactive as At, useBoolean as Tt, useUpdate as Vt } from "ahooks";
-import Ke from "gradient-parser";
+import { useCallback as T, useMemo as ce, forwardRef as et, useState as $, useEffect as M, useImperativeHandle as tt, lazy as jt, Suspense as zt, useRef as F, useId as Rt } from "react";
+import { useUpdate as rt, useDebounce as Dt } from "react-use";
+import { styled as Nt } from "@arcblock/ux/lib/Theme";
+import { cx as At } from "@emotion/css";
+import { useReactive as Tt, useBoolean as Vt, useUpdate as Et } from "ahooks";
+import Ue from "gradient-parser";
 import "lodash/without";
-import Wt from "tinycolor2";
-import { red as Et, pink as Ut, purple as Bt, indigo as Kt, blue as Ft, cyan as _t, teal as Jt, green as $t, lime as Mt, yellow as Ht, amber as Yt, orange as Lt, brown as Gt, grey as qt, blueGrey as Qt } from "@mui/material/colors";
-import { getImageSize as he, getVideoSize as fe, UploaderButton as Se, UploaderProvider as Oe, useUploader as Xt } from "./uploader.js";
-import { Icon as Zt } from "@iconify-icon/react";
+import Ut from "tinycolor2";
+import { red as Wt, pink as Bt, purple as Kt, indigo as Ft, blue as _t, cyan as Jt, teal as $t, green as Mt, lime as Ht, yellow as Yt, amber as Lt, orange as Gt, brown as qt, grey as Qt, blueGrey as Xt } from "@mui/material/colors";
+import { getImageSize as me, getVideoSize as he, UploaderButton as we, UploaderProvider as Pe, useUploader as Zt } from "./uploader.js";
+import { Icon as er } from "@iconify-icon/react";
 import it from "lodash/isEmpty";
 import nt from "lodash/set";
-import * as be from "yaml";
-import { cloneDeep as er } from "lodash";
-import Fe from "@arcblock/ux/lib/Toast";
-import { CustomComponentRenderer as ot, transpileAndLoadScript as tr, getPropertiesFromCode as rr } from "@blocklet/pages-kit/components";
-import { unstable_useNumberInput as ir, ClickAwayListener as nr } from "@mui/base";
-import { VisibilityOffRounded as or, VisibilityRounded as lr, DeleteOutlineRounded as sr, DragIndicatorRounded as cr, TranslateRounded as lt, AddRounded as st, InfoRounded as ct, StarRounded as ar, SettingsRounded as at } from "@mui/icons-material";
-import { alpha as _e } from "@mui/material/styles";
+import * as fe from "yaml";
+import { cloneDeep as tr } from "lodash";
+import We from "@arcblock/ux/lib/Toast";
+import { CustomComponentRenderer as ot, transpileAndLoadScript as rr, getPropertiesFromCode as ir } from "@blocklet/pages-kit/components";
+import { unstable_useNumberInput as nr, ClickAwayListener as or } from "@mui/base";
+import { VisibilityOffRounded as lr, VisibilityRounded as sr, DeleteOutlineRounded as cr, DragIndicatorRounded as ar, TranslateRounded as lt, AddRounded as st, InfoRounded as ct, StarRounded as dr, SettingsRounded as at } from "@mui/icons-material";
+import { alpha as Be } from "@mui/material/styles";
 import { getYjsValue as Y } from "@syncedstore/core";
-import dr from "lodash/assign";
-import ur from "lodash/has";
-import ce from "lodash/isNil";
-import pr from "lodash/isObject";
-import mr from "lodash/keyBy";
-import hr from "lodash/omit";
-import fr from "lodash/pick";
-import br from "lodash/reduce";
-import { usePopupState as Ce, bindTrigger as je, bindDialog as dt, bindPopper as yr } from "material-ui-popup-state/hooks";
-import { ErrorBoundary as vr } from "react-error-boundary";
-import { useDrop as ut, useDrag as gr } from "react-dnd";
-function xr({
+import ur from "lodash/assign";
+import pr from "lodash/has";
+import ae from "lodash/isNil";
+import mr from "lodash/isObject";
+import hr from "lodash/keyBy";
+import fr from "lodash/omit";
+import br from "lodash/pick";
+import yr from "lodash/reduce";
+import { usePopupState as Ie, bindTrigger as Se, bindDialog as dt, bindPopper as vr } from "material-ui-popup-state/hooks";
+import { ErrorBoundary as gr } from "react-error-boundary";
+import { useDrop as ut, useDrag as xr } from "react-dnd";
+function kr({
   onClick: e,
   disabled: r,
   sx: n,
   ...i
 }) {
-  return /* @__PURE__ */ t(ke, { size: "small", color: "warning", variant: "outlined", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(kt, { fontSize: "small" }) });
+  return /* @__PURE__ */ t(xe, { size: "small", color: "warning", variant: "outlined", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(kt, { fontSize: "small" }) });
 }
-function kr({
+function wr({
   onClick: e,
   disabled: r,
   sx: n,
   ...i
 }) {
-  return /* @__PURE__ */ t(ke, { size: "small", color: "primary", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(xt, { fontSize: "small" }) });
+  return /* @__PURE__ */ t(xe, { size: "small", color: "primary", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(xt, { fontSize: "small" }) });
 }
-function wr({
+function Pr({
   onClick: e,
   disabled: r,
   sx: n,
   ...i
 }) {
-  return /* @__PURE__ */ t(ke, { size: "small", color: "primary", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(gt, { fontSize: "small" }) });
+  return /* @__PURE__ */ t(xe, { size: "small", color: "primary", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(gt, { fontSize: "small" }) });
 }
-function Pr({
+function Ir({
   label: e,
   value: r,
   onChange: n,
   disabled: i = !1,
   itemLabel: d = "",
-  emptyHeight: m = 40,
-  property: c,
-  renderItem: p,
+  emptyHeight: p = 40,
+  property: a,
+  renderItem: m,
   ...k
 }) {
   const { t: y, locale: g } = N(), h = rt(), o = T(
     (v) => {
-      n(ve(v, c.type));
+      n(ye(v, a.type));
     },
-    [n, c.type]
-  ), s = se(() => Array.isArray(r) ? r : [], [r]), l = T(() => {
+    [n, a.type]
+  ), s = ce(() => Array.isArray(r) ? r : [], [r]), l = T(() => {
     const v = [...s, ""];
     o(v), h();
   }, [s, o, h]), u = T(() => {
-    if (!c || !c.subProperties)
+    if (!a || !a.subProperties)
       return l();
     const v = {};
-    V(Object.values(c.subProperties), "index").forEach(({ data: R }) => {
-      var E, U;
+    V(Object.values(a.subProperties), "index").forEach(({ data: R }) => {
+      var U, W;
       if (!R.key) return;
-      const W = ((U = (E = R.locales) == null ? void 0 : E[g]) == null ? void 0 : U.defaultValue) ?? "";
-      v[R.key] = W;
+      const E = ((W = (U = R.locales) == null ? void 0 : U[g]) == null ? void 0 : W.defaultValue) ?? "";
+      v[R.key] = E;
     });
     const z = [...s, v];
     o(z), h();
-  }, [s, o, h, c, g, l]), f = T(
+  }, [s, o, h, a, g, l]), f = T(
     (v) => {
       try {
         const I = JSON.parse(v);
@@ -112,7 +112,7 @@ function Pr({
       o(I), h();
     },
     [s, o, h]
-  ), a = T(
+  ), c = T(
     (v) => {
       if (v <= 0) return;
       const I = [...s], z = I[v];
@@ -132,14 +132,14 @@ function Pr({
       z[v] = I, o(z);
     },
     [s, o]
-  ), P = c && c.subProperties && Object.keys(c.subProperties).length > 0, C = se(() => [
+  ), P = a && a.subProperties && Object.keys(a.subProperties).length > 0, O = ce(() => [
     {
       field: "index",
       headerName: "#",
       width: 40,
       align: "center",
       renderCell: ({ index: v }) => /* @__PURE__ */ t(
-        $,
+        J,
         {
           variant: "body1",
           sx: {
@@ -159,10 +159,10 @@ function Pr({
     {
       field: "content",
       headerName: "",
-      renderCell: ({ row: v, index: I }) => p && P ? p({
+      renderCell: ({ row: v, index: I }) => m && P ? m({
         item: v,
         index: I,
-        property: c,
+        property: a,
         onChange: (z) => b(I, z)
       }) : /* @__PURE__ */ t(
         D,
@@ -184,35 +184,35 @@ function Pr({
       // 增加宽度以容纳更多按钮
       align: "center",
       renderCell: ({ index: v }) => /* @__PURE__ */ S(j, { direction: "column", spacing: 0.25, children: [
-        /* @__PURE__ */ t(kr, { disabled: i || v === 0, onClick: () => a(v) }),
+        /* @__PURE__ */ t(wr, { disabled: i || v === 0, onClick: () => c(v) }),
         /* @__PURE__ */ t(
-          wr,
+          Pr,
           {
             disabled: i || v === s.length - 1,
             onClick: () => x(v)
           }
         ),
-        /* @__PURE__ */ t(xr, { disabled: i, onClick: () => w(v) })
+        /* @__PURE__ */ t(kr, { disabled: i, onClick: () => w(v) })
       ] })
     }
   ], [
-    p,
+    m,
     P,
-    c,
+    a,
     b,
     d,
     y,
     i,
     k,
     w,
-    a,
+    c,
     x,
     s.length
   ]);
   return P ? /* @__PURE__ */ S(j, { width: "100%", gap: 1, children: [
-    e && /* @__PURE__ */ t(ne, { children: e }),
-    s.length > 0 ? /* @__PURE__ */ t(wt, { component: de, variant: "outlined", sx: { borderRadius: 1, mb: 1 }, children: /* @__PURE__ */ S(
-      Le,
+    e && /* @__PURE__ */ t(oe, { children: e }),
+    s.length > 0 ? /* @__PURE__ */ t(wt, { component: te, variant: "outlined", sx: { borderRadius: 1, mb: 1 }, children: /* @__PURE__ */ S(
+      Me,
       {
         size: "small",
         sx: {
@@ -229,8 +229,8 @@ function Pr({
           borderCollapse: "collapse"
         },
         children: [
-          /* @__PURE__ */ t(Ge, { sx: { display: "none" }, children: /* @__PURE__ */ t(oe, { children: C.map((v) => /* @__PURE__ */ t(
-            le,
+          /* @__PURE__ */ t(He, { sx: { display: "none" }, children: /* @__PURE__ */ t(le, { children: O.map((v) => /* @__PURE__ */ t(
+            se,
             {
               width: v.width,
               align: v.align || "left",
@@ -239,8 +239,8 @@ function Pr({
             },
             v.field
           )) }) }),
-          /* @__PURE__ */ t(qe, { children: s.map((v, I, z) => /* @__PURE__ */ t(
-            oe,
+          /* @__PURE__ */ t(Ye, { children: s.map((v, I, z) => /* @__PURE__ */ t(
+            le,
             {
               sx: {
                 borderBottom: I < z.length - 1 ? "1px solid" : "none",
@@ -249,8 +249,8 @@ function Pr({
                   backgroundColor: "action.hover"
                 }
               },
-              children: C.map((R) => /* @__PURE__ */ t(
-                le,
+              children: O.map((R) => /* @__PURE__ */ t(
+                se,
                 {
                   width: R.width,
                   align: R.align || "left",
@@ -260,7 +260,7 @@ function Pr({
                   children: R.renderCell({
                     row: v,
                     index: I,
-                    onChange: (W) => b(I, W)
+                    onChange: (E) => b(I, E)
                   })
                 },
                 `${I}-${R.field}`
@@ -270,7 +270,7 @@ function Pr({
           )) })
         ]
       }
-    ) }) : /* @__PURE__ */ t(ee, { style: { fontSize: 12, height: m }, children: y("maker.properties.arrayEmpty") }),
+    ) }) : /* @__PURE__ */ t(ee, { style: { fontSize: 12, height: p }, children: y("maker.properties.arrayEmpty") }),
     /* @__PURE__ */ t(
       A,
       {
@@ -284,45 +284,45 @@ function Pr({
       }
     )
   ] }) : /* @__PURE__ */ S(j, { width: "100%", gap: 1, children: [
-    e && /* @__PURE__ */ t(ne, { children: e }),
-    /* @__PURE__ */ t(O, { sx: { border: 1, borderColor: "divider", borderRadius: 1, minHeight: 150 }, children: /* @__PURE__ */ t(
-      xe,
+    e && /* @__PURE__ */ t(oe, { children: e }),
+    /* @__PURE__ */ t(C, { sx: { border: 1, borderColor: "divider", borderRadius: 1, minHeight: 150 }, children: /* @__PURE__ */ t(
+      ge,
       {
-        keyId: c.id,
+        keyId: a.id,
         locale: g,
         language: "json",
         value: JSON.stringify(s, null, 2),
         onChange: (v) => f(v || "")
       },
-      c.id
+      a.id
     ) })
   ] });
 }
-Et[300], Ut[300], Bt[300], // deepPurple['300'],
-Kt[300], Ft[300], // lightBlue['300'],
-_t[300], Jt[300], $t[300], // lightGreen['300'],
-Mt[300], Ht[300], Yt[300], Lt[300], // deepOrange['300'],
-Gt[300], qt[300], Qt[300];
-const Ir = et(function({ showMarkdown: r, markdown: n, onMarkdownChange: i, showUploader: d, value: m, meta: c, onChange: p, ...k }, y) {
-  const [g, h] = M("");
-  H(() => {
-    h(m || "");
-  }, [m, h]);
+Wt[300], Bt[300], Kt[300], // deepPurple['300'],
+Ft[300], _t[300], // lightBlue['300'],
+Jt[300], $t[300], Mt[300], // lightGreen['300'],
+Ht[300], Yt[300], Lt[300], Gt[300], // deepOrange['300'],
+qt[300], Qt[300], Xt[300];
+const Sr = et(function({ showMarkdown: r, markdown: n, onMarkdownChange: i, showUploader: d, value: p, meta: a, onChange: m, ...k }, y) {
+  const [g, h] = $("");
+  M(() => {
+    h(p || "");
+  }, [p, h]);
   const o = async () => {
-    if (g !== m) {
-      const l = ie(g);
+    if (g !== p) {
+      const l = ne(g);
       if (!l) {
-        p(g, void 0);
+        m(g, void 0);
         return;
       }
-      const u = await he(l).catch(() => fe(l)).catch(() => {
+      const u = await me(l).catch(() => he(l)).catch(() => {
       });
-      p(g, { ...u, filename: g });
+      m(g, { ...u, filename: g });
     }
   };
-  Rt(
+  Dt(
     () => {
-      g !== m && p(g);
+      g !== p && m(g);
     },
     300,
     [g]
@@ -333,14 +333,14 @@ const Ir = et(function({ showMarkdown: r, markdown: n, onMarkdownChange: i, show
   return d && (s.InputProps = {
     sx: { pr: 0 },
     endAdornment: /* @__PURE__ */ t(ue, { position: "end", sx: { mx: 0.5 }, children: /* @__PURE__ */ t(
-      Se,
+      we,
       {
         onChange: async ({ response: l }) => {
-          var a;
-          const u = (a = l == null ? void 0 : l.data) == null ? void 0 : a.filename, f = ie(u) || "";
+          var c;
+          const u = (c = l == null ? void 0 : l.data) == null ? void 0 : c.filename, f = ne(u) || "";
           let w = {};
-          f && (w = await he(f).catch(() => fe(f)).catch(() => {
-          })), p(u, {
+          f && (w = await me(f).catch(() => he(f)).catch(() => {
+          })), m(u, {
             ...w,
             filename: u
           });
@@ -355,15 +355,15 @@ const Ir = et(function({ showMarkdown: r, markdown: n, onMarkdownChange: i, show
       ...k,
       label: /* @__PURE__ */ S(j, { direction: "row", spacing: 1, alignItems: "center", children: [
         k.label,
-        r && /* @__PURE__ */ S(J, { children: [
+        r && /* @__PURE__ */ S(H, { children: [
           " (",
           /* @__PURE__ */ t(
-            Qe,
+            Le,
             {
               checked: n,
-              label: /* @__PURE__ */ t(O, { component: Zt, icon: "tabler:markdown", sx: { verticalAlign: "middle" } }),
+              label: /* @__PURE__ */ t(C, { component: er, icon: "tabler:markdown", sx: { verticalAlign: "middle" } }),
               labelPlacement: "start",
-              control: /* @__PURE__ */ t(Xe, { size: "small" }),
+              control: /* @__PURE__ */ t(Ge, { size: "small" }),
               sx: { ml: 0.25, pr: 1 },
               onChange: (l, u) => i == null ? void 0 : i(u)
             }
@@ -380,36 +380,36 @@ const Ir = et(function({ showMarkdown: r, markdown: n, onMarkdownChange: i, show
       }
     }
   );
-}), Sr = Ct(() => import("react-best-gradient-color-picker"));
-function Or(e) {
+}), Or = jt(() => import("react-best-gradient-color-picker"));
+function Cr(e) {
   try {
-    const n = Ke.parse(e).map((d) => {
-      const m = d.colorStops.map((c) => {
-        if (c.type !== "rgba") {
-          const p = Wt(c.value).toRgb();
+    const n = Ue.parse(e).map((d) => {
+      const p = d.colorStops.map((a) => {
+        if (a.type !== "rgba") {
+          const m = Ut(a.value).toRgb();
           return {
-            ...c,
-            value: [p.r, p.g, p.b, p.a],
+            ...a,
+            value: [m.r, m.g, m.b, m.a],
             type: "rgba"
           };
         }
-        return c;
+        return a;
       });
       return {
         ...d,
-        colorStops: m
+        colorStops: p
       };
     });
-    return Ke.stringify(n);
+    return Ue.stringify(n);
   } catch {
-    return He(e) ? e : "";
+    return Je(e) ? e : "";
   }
 }
-function Cr({ color: e, sx: r = {}, ...n }) {
-  He(e);
+function jr({ color: e, sx: r = {}, ...n }) {
+  Je(e);
   const i = {};
-  return Me(e) ? i.backgroundImage = e : i.backgroundColor = e, /* @__PURE__ */ t(
-    O,
+  return _e(e) ? i.backgroundImage = e : i.backgroundColor = e, /* @__PURE__ */ t(
+    C,
     {
       sx: {
         ...r,
@@ -428,14 +428,14 @@ function Cr({ color: e, sx: r = {}, ...n }) {
     }
   );
 }
-const jr = et(function({ onSave: r }, n) {
-  const i = At({
+const zr = et(function({ onSave: r }, n) {
+  const i = Tt({
     value: ""
-  }), { t: d } = N(), m = {};
-  i.value ? Me(i.value) ? m.backgroundImage = i.value : m.backgroundColor = i.value : m.border = "1px solid #ccc";
-  const [c, { setFalse: p, setTrue: k }] = Tt(!1), y = T(() => {
-    p();
-  }, [p]), g = () => {
+  }), { t: d } = N(), p = {};
+  i.value ? _e(i.value) ? p.backgroundImage = i.value : p.backgroundColor = i.value : p.border = "1px solid #ccc";
+  const [a, { setFalse: m, setTrue: k }] = Vt(!1), y = T(() => {
+    m();
+  }, [m]), g = () => {
     r({ value: i.value }, y);
   };
   return tt(n, () => ({
@@ -445,16 +445,16 @@ const jr = et(function({ onSave: r }, n) {
     close() {
       y();
     }
-  })), /* @__PURE__ */ S(pe, { open: c, onClose: y, hideBackdrop: !0, children: [
-    /* @__PURE__ */ t(we, { children: d("maker.configBackground") }),
-    /* @__PURE__ */ t(Pe, { sx: { width: 600 }, children: /* @__PURE__ */ S(O, { width: "100%", display: "flex", children: [
-      /* @__PURE__ */ t(O, { flex: 1, mr: 1, sx: m, children: !i.value && /* @__PURE__ */ t(ee, { children: d("error.notConfig") }) }),
-      /* @__PURE__ */ t(jt, { children: /* @__PURE__ */ t(
-        Sr,
+  })), /* @__PURE__ */ S(ke, { open: a, onClose: y, hideBackdrop: !0, children: [
+    /* @__PURE__ */ t(qe, { children: d("maker.configBackground") }),
+    /* @__PURE__ */ t(Qe, { sx: { width: 600 }, children: /* @__PURE__ */ S(C, { width: "100%", display: "flex", children: [
+      /* @__PURE__ */ t(C, { flex: 1, mr: 1, sx: p, children: !i.value && /* @__PURE__ */ t(ee, { children: d("error.notConfig") }) }),
+      /* @__PURE__ */ t(zt, { children: /* @__PURE__ */ t(
+        Or,
         {
           width: 200,
           height: 200,
-          value: Or(i.value),
+          value: Cr(i.value),
           onChange: (h) => {
             i.value = h;
           },
@@ -465,13 +465,13 @@ const jr = et(function({ onSave: r }, n) {
         }
       ) })
     ] }) }),
-    /* @__PURE__ */ S(Ie, { children: [
+    /* @__PURE__ */ S(Xe, { children: [
       /* @__PURE__ */ t(A, { variant: "outlined", size: "small", onClick: y, children: d("common.cancel") }),
       /* @__PURE__ */ t(A, { variant: "contained", size: "small", onClick: g, children: d("maker.save") })
     ] })
   ] });
 });
-Dt(O)`
+Nt(C)`
   .color-item {
     position: relative;
   }
@@ -492,22 +492,22 @@ Dt(O)`
     right: 0;
   }
 `;
-function zr({
+function Rr({
   value: e,
   onChange: r,
   ...n
 }) {
   const i = F(null);
-  return /* @__PURE__ */ S(J, { children: [
+  return /* @__PURE__ */ S(H, { children: [
     /* @__PURE__ */ t(
-      Ir,
+      Sr,
       {
         ...n,
         value: e,
         onChange: r,
         InputProps: {
           endAdornment: /* @__PURE__ */ t(ue, { position: "end", children: /* @__PURE__ */ t(
-            Cr,
+            jr,
             {
               color: e ?? "",
               style: { width: "1.5rem", height: "1.5rem", padding: 0 },
@@ -521,25 +521,25 @@ function zr({
       }
     ),
     /* @__PURE__ */ t(
-      jr,
+      zr,
       {
         ref: i,
-        onSave: ({ value: d }, m) => {
-          r(d), m();
+        onSave: ({ value: d }, p) => {
+          r(d), p();
         }
       }
     )
   ] });
 }
-function Rr({
+function Dr({
   label: e,
   value: r,
   onChange: n,
   property: i,
   component: d,
-  defaultLocale: m,
-  allComponents: c,
-  PropertyValueField: p,
+  defaultLocale: p,
+  allComponents: a,
+  PropertyValueField: m,
   onUpload: k
 }) {
   const { locale: y } = N(), g = F(null);
@@ -548,33 +548,33 @@ function Rr({
       (s) => s.data.visible !== !1 && s.data.key
     );
     return /* @__PURE__ */ S(j, { width: "100%", children: [
-      /* @__PURE__ */ t(ne, { sx: { px: 0.25, py: 0.5 }, children: e }),
-      /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(O, { sx: { position: "relative" }, children: o.map((s, l) => {
+      /* @__PURE__ */ t(oe, { sx: { px: 0.25, py: 0.5 }, children: e }),
+      /* @__PURE__ */ t(C, { children: /* @__PURE__ */ t(C, { sx: { position: "relative" }, children: o.map((s, l) => {
         const { data: u } = s, f = u.key ?? u.id, w = l === o.length - 1;
-        let a = null;
+        let c = null;
         try {
-          r && typeof r == "object" ? a = r[f] : typeof r == "string" && (a = (i.type === "yaml" ? be.parse(r || "") : JSON.parse(r || "{}"))[f]);
+          r && typeof r == "object" ? c = r[f] : typeof r == "string" && (c = (i.type === "yaml" ? fe.parse(r || "") : JSON.parse(r || "{}"))[f]);
         } catch {
         }
-        a == null && (u.locales && y && u.locales[y] ? a = u.locales[y].defaultValue : u.locales && m && u.locales[m] && (a = u.locales[m].defaultValue));
+        c == null && (u.locales && y && u.locales[y] ? c = u.locales[y].defaultValue : u.locales && p && u.locales[p] && (c = u.locales[p].defaultValue));
         const x = (P) => {
           try {
-            let C = {};
+            let O = {};
             if (typeof r == "string")
               try {
-                C = i.type === "yaml" ? be.parse(r || "") : JSON.parse(r || "{}");
+                O = i.type === "yaml" ? fe.parse(r || "") : JSON.parse(r || "{}");
               } catch {
               }
-            else typeof r == "object" && r !== null && (C = { ...r });
-            nt(C, f, P);
-            const v = ve(C, i.type);
+            else typeof r == "object" && r !== null && (O = { ...r });
+            nt(O, f, P);
+            const v = ye(O, i.type);
             n == null || n(v);
-          } catch (C) {
-            console.error("Error updating property:", C);
+          } catch (O) {
+            console.error("Error updating property:", O);
           }
         }, b = 8;
         return /* @__PURE__ */ S(
-          O,
+          C,
           {
             sx: {
               mb: w ? 0 : 1,
@@ -584,7 +584,7 @@ function Rr({
             },
             children: [
               /* @__PURE__ */ S(
-                O,
+                C,
                 {
                   sx: {
                     position: "relative",
@@ -593,7 +593,7 @@ function Rr({
                   },
                   children: [
                     /* @__PURE__ */ t(
-                      O,
+                      C,
                       {
                         sx: {
                           position: "absolute",
@@ -608,7 +608,7 @@ function Rr({
                       }
                     ),
                     /* @__PURE__ */ t(
-                      O,
+                      C,
                       {
                         sx: {
                           position: "absolute",
@@ -623,7 +623,7 @@ function Rr({
                       }
                     ),
                     !w && /* @__PURE__ */ t(
-                      O,
+                      C,
                       {
                         sx: {
                           position: "absolute",
@@ -641,17 +641,17 @@ function Rr({
                   ]
                 }
               ),
-              /* @__PURE__ */ t(O, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ t(
-                p,
+              /* @__PURE__ */ t(C, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ t(
+                m,
                 {
                   component: d,
                   property: u,
-                  value: a,
+                  value: c,
                   onChange: x,
                   size: "small",
                   fullWidth: !0,
-                  defaultLocale: m,
-                  allComponents: c
+                  defaultLocale: p,
+                  allComponents: a
                 }
               ) })
             ]
@@ -675,7 +675,7 @@ function Rr({
       },
       children: [
         /* @__PURE__ */ t(
-          ne,
+          oe,
           {
             sx: {
               position: "absolute",
@@ -687,7 +687,7 @@ function Rr({
           }
         ),
         /* @__PURE__ */ t(
-          xe,
+          ge,
           {
             keyId: i.id,
             locale: y,
@@ -703,7 +703,7 @@ function Rr({
           i.id
         ),
         /* @__PURE__ */ t(
-          O,
+          C,
           {
             component: "fieldset",
             sx: {
@@ -719,25 +719,25 @@ function Rr({
               px: 1,
               py: 0
             },
-            children: /* @__PURE__ */ t(O, { component: "legend", sx: { fontSize: "0.75em" }, children: /* @__PURE__ */ t(O, { component: "span", sx: { opacity: 0 }, children: e }) })
+            children: /* @__PURE__ */ t(C, { component: "legend", sx: { fontSize: "0.75em" }, children: /* @__PURE__ */ t(C, { component: "span", sx: { opacity: 0 }, children: e }) })
           }
         )
       ]
     }
   ) });
 }
-const Je = ["string", "multiline", "json", "yaml", "component", "custom", "url"];
+const Ke = ["string", "multiline", "json", "yaml", "component", "custom", "url"];
 function pt({
   disabled: e,
   list: r,
   renderItem: n,
   ...i
 }) {
-  const d = F(null), m = zt(), c = Vt(), p = V(Object.entries(r), (s) => s[1].index).map((s) => s[0]), k = F(p), y = T(
+  const d = F(null), p = Rt(), a = Et(), m = V(Object.entries(r), (s) => s[1].index).map((s) => s[0]), k = F(m), y = T(
     (s) => {
-      k.current = s, c();
+      k.current = s, a();
     },
-    [c]
+    [a]
   ), g = T(
     ({ index: s }, { index: l }) => {
       const u = [...k.current];
@@ -745,11 +745,11 @@ function pt({
     },
     [y]
   );
-  H(() => {
-    y(p);
-  }, [p.join("-")]);
+  M(() => {
+    y(m);
+  }, [m.join("-")]);
   const [{ isOver: h }, o] = ut({
-    accept: m,
+    accept: p,
     collect: (s) => ({
       isOver: s.isOver()
     }),
@@ -758,8 +758,8 @@ function pt({
       var u;
       const s = () => {
         k.current.forEach((f, w) => {
-          const a = r[f];
-          a && (a.index = w);
+          const c = r[f];
+          c && (c.index = w);
         });
       }, l = (u = Y(r)) == null ? void 0 : u.doc;
       l ? l.transact(() => {
@@ -767,12 +767,12 @@ function pt({
       }) : s();
     }
   });
-  return H(() => {
-    h || y(p);
-  }, [h]), o(d), /* @__PURE__ */ t(O, { ...i, ref: d, className: Nt(h && "isDragging"), children: k.current.map((s, l) => /* @__PURE__ */ t(
-    Dr,
+  return M(() => {
+    h || y(m);
+  }, [h]), o(d), /* @__PURE__ */ t(C, { ...i, ref: d, className: At(h && "isDragging"), children: k.current.map((s, l) => /* @__PURE__ */ t(
+    Nr,
     {
-      type: m,
+      type: p,
       disabled: e,
       id: s,
       index: l,
@@ -786,16 +786,16 @@ function pt({
     s
   )) });
 }
-function Dr({
+function Nr({
   disabled: e,
   id: r,
   index: n,
   type: i,
   children: d,
-  itemIndex: m,
-  move: c
+  itemIndex: p,
+  move: a
 }) {
-  const p = F(), [{ isDragging: k }, y, g] = gr({
+  const m = F(), [{ isDragging: k }, y, g] = xr({
     type: i,
     item: () => ({ id: r }),
     canDrag: () => !e,
@@ -805,47 +805,47 @@ function Dr({
     canDrop: () => !e,
     hover(o, s) {
       var b;
-      if (!p.current)
+      if (!m.current)
         return;
-      const l = m(o.id), u = n;
+      const l = p(o.id), u = n;
       if (l === u)
         return;
-      const f = (b = p.current) == null ? void 0 : b.getBoundingClientRect(), w = (f.bottom - f.top) / 2, x = s.getClientOffset().y - f.top;
-      l < u && x < w || l > u && x > w || c({ id: o.id, index: l }, { id: r, index: n });
+      const f = (b = m.current) == null ? void 0 : b.getBoundingClientRect(), w = (f.bottom - f.top) / 2, x = s.getClientOffset().y - f.top;
+      l < u && x < w || l > u && x > w || a({ id: o.id, index: l }, { id: r, index: n });
     }
   });
   return typeof d == "function" ? d({
     isDragging: k,
     drag: y,
-    drop: (o) => (p.current = o, h(o)),
+    drop: (o) => (m.current = o, h(o)),
     preview: g
-  }) : (y(h(g(p))), /* @__PURE__ */ t(O, { ref: p, children: d }));
+  }) : (y(h(g(m))), /* @__PURE__ */ t(C, { ref: m, children: d }));
 }
-function Nr({
+function Ar({
   drop: e,
   preview: r,
   drag: n,
   disabled: i,
   isDragging: d,
-  children: m,
-  onDelete: c,
-  onVisibilityChange: p,
+  children: p,
+  onDelete: a,
+  onVisibilityChange: m,
   visible: k = !0,
   actions: y,
   alwaysShowActions: g = !1
 }) {
   const { t: h } = N();
   return /* @__PURE__ */ t(
-    O,
+    C,
     {
       ref: e,
       sx: {
         ":hover .hover-visible": { maxWidth: "100%" },
         opacity: k ? 1 : 0.5
       },
-      children: /* @__PURE__ */ S(O, { sx: { position: "relative" }, children: [
+      children: /* @__PURE__ */ S(C, { sx: { position: "relative" }, children: [
         /* @__PURE__ */ t(
-          O,
+          C,
           {
             ref: r,
             sx: {
@@ -855,11 +855,11 @@ function Nr({
               opacity: 0.9999
               // NOTE: make preview effective
             },
-            children: m
+            children: p
           }
         ),
         !i && /* @__PURE__ */ t(
-          O,
+          C,
           {
             className: g ? "" : "hover-visible",
             sx: {
@@ -887,9 +887,9 @@ function Nr({
                 },
                 children: [
                   y,
-                  p && /* @__PURE__ */ t(Z, { title: h(k ? "hideParameter" : "showParameter"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(A, { onClick: () => p(!k), children: k ? /* @__PURE__ */ t(or, { sx: { fontSize: "1.25rem", color: "grey.500" } }) : /* @__PURE__ */ t(lr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
-                  c && /* @__PURE__ */ t(Z, { title: h("delete"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(A, { onClick: c, children: /* @__PURE__ */ t(sr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
-                  /* @__PURE__ */ t(Z, { title: h("dragSort"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(A, { ref: n, children: /* @__PURE__ */ t(cr, { sx: { color: "grey.500" } }) }) })
+                  m && /* @__PURE__ */ t(Z, { title: h(k ? "hideParameter" : "showParameter"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(A, { onClick: () => m(!k), children: k ? /* @__PURE__ */ t(lr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) : /* @__PURE__ */ t(sr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
+                  a && /* @__PURE__ */ t(Z, { title: h("delete"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(A, { onClick: a, children: /* @__PURE__ */ t(cr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
+                  /* @__PURE__ */ t(Z, { title: h("dragSort"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(A, { ref: n, children: /* @__PURE__ */ t(ar, { sx: { color: "grey.500" } }) }) })
                 ]
               }
             )
@@ -899,12 +899,12 @@ function Nr({
     }
   );
 }
-function Ar({
+function Tr({
   label: e,
   value: r,
   onChange: n
 }) {
-  const [i, d] = M(!1);
+  const [i, d] = $(!1);
   return /* @__PURE__ */ S(j, { gap: 1, children: [
     /* @__PURE__ */ t(
       D,
@@ -912,15 +912,15 @@ function Ar({
         label: e,
         size: "small",
         value: r,
-        onChange: (m) => n == null ? void 0 : n(m.target.value),
+        onChange: (p) => n == null ? void 0 : n(p.target.value),
         InputProps: {
           endAdornment: /* @__PURE__ */ t(
-            Se,
+            we,
             {
-              onChange: ({ response: m }) => {
-                var p;
-                const c = (p = m == null ? void 0 : m.data) == null ? void 0 : p.filename;
-                c && (n == null || n(c));
+              onChange: ({ response: p }) => {
+                var m;
+                const a = (m = p == null ? void 0 : p.data) == null ? void 0 : m.filename;
+                a && (n == null || n(a));
               }
             }
           )
@@ -928,11 +928,11 @@ function Ar({
       }
     ),
     r && /* @__PURE__ */ t(
-      O,
+      C,
       {
         component: "img",
         sx: { objectFit: "contain", borderRadius: 1, cursor: "pointer" },
-        src: ie(r),
+        src: ne(r),
         alt: e,
         maxWidth: 100,
         maxHeight: 100,
@@ -940,20 +940,20 @@ function Ar({
         onClick: () => d(!0)
       }
     ),
-    /* @__PURE__ */ t(pe, { open: i, onClose: () => d(!1), children: /* @__PURE__ */ t(O, { component: "img", sx: { objectFit: "contain" }, src: ie(r), alt: e }) })
+    /* @__PURE__ */ t(ke, { open: i, onClose: () => d(!1), children: /* @__PURE__ */ t(C, { component: "img", sx: { objectFit: "contain" }, src: ne(r), alt: e }) })
   ] });
 }
-function ye(e, r = "") {
-  return br(
+function be(e, r = "") {
+  return yr(
     e,
     (n, i, d) => {
-      const m = r ? `${r}.${d}` : d;
-      return pr(i) ? dr(n, ye(i, m)) : n[m] = i, n;
+      const p = r ? `${r}.${d}` : d;
+      return mr(i) ? ur(n, be(i, p)) : n[p] = i, n;
     },
     {}
   );
 }
-const Tr = [
+const Vr = [
   { value: "string", label: "Text" },
   { value: "multiline", label: "Text (Multiline)" },
   { value: "number", label: "Number" },
@@ -967,46 +967,46 @@ const Tr = [
   { value: "component", label: "Component" },
   { value: "custom", label: "Custom (Render by a Component)" }
 ];
-function re(e, r, n) {
+function ie(e, r, n) {
   return !e || !n ? !1 : Object.values(e).some(({ data: i }) => i.id !== r && i.key === n);
 }
 function mt(e, r) {
   var n;
   return !e || !r ? !1 : ((n = e[r]) == null ? void 0 : n.data.visible) ?? !0;
 }
-function Vi({ componentId: e }) {
+function Ei({ componentId: e }) {
   const {
     state: { components: r }
-  } = ae(), n = r[e], i = n == null ? void 0 : n.data;
-  return i ? /* @__PURE__ */ t(j, { maxHeight: "100%", overflow: "auto", children: /* @__PURE__ */ t(O, { p: 2, children: /* @__PURE__ */ t(vr, { FallbackComponent: yt, resetKeys: [e], children: /* @__PURE__ */ t(Vr, { value: i }) }) }) }) : null;
+  } = de(), n = r[e], i = n == null ? void 0 : n.data;
+  return i ? /* @__PURE__ */ t(j, { maxHeight: "100%", overflow: "auto", children: /* @__PURE__ */ t(C, { p: 2, children: /* @__PURE__ */ t(gr, { FallbackComponent: yt, resetKeys: [e], children: /* @__PURE__ */ t(Er, { value: i }) }) }) }) : null;
 }
-function Vr({ value: e }) {
+function Er({ value: e }) {
   var k, y, g;
   const { t: r } = N(), {
     localState: { currentLocale: n, componentDebugProps: i },
     state: {
       config: { defaultLocale: d }
     },
-    localActions: { setComponentDebugProps: m }
-  } = ae(), c = Y(e).doc, p = ge();
+    localActions: { setComponentDebugProps: p }
+  } = de(), a = Y(e).doc, m = ve();
   return /* @__PURE__ */ t(j, { height: "100%", children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ t(Wr, { config: e }),
+    /* @__PURE__ */ t(Ur, { config: e }),
     /* @__PURE__ */ t(
-      Ur,
+      Br,
       {
         config: e,
         currentLocale: n,
         defaultLocale: d,
-        allComponents: p,
+        allComponents: m,
         onUpdateConfig: (h) => {
-          c.transact(() => {
+          a.transact(() => {
             h(e);
           });
         }
       }
     ),
     /* @__PURE__ */ S(j, { gap: 2, direction: "row", justifyContent: "space-between", alignItems: "center", children: [
-      /* @__PURE__ */ t($, { variant: "subtitle1", children: r("renderer") }),
+      /* @__PURE__ */ t(J, { variant: "subtitle1", children: r("renderer") }),
       /* @__PURE__ */ S(
         D,
         {
@@ -1016,28 +1016,28 @@ function Vr({ value: e }) {
           SelectProps: { autoWidth: !0 },
           value: ((k = e.renderer) == null ? void 0 : k.type) || "react-component",
           onChange: (h) => {
-            c.transact(() => {
+            a.transact(() => {
               const o = h.target.value;
               e.renderer ?? (e.renderer = { type: o }), e.renderer.type = o;
             });
           },
           children: [
-            /* @__PURE__ */ t(me, { value: "react-component", children: "React Component" }),
-            /* @__PURE__ */ t(me, { value: "component", children: "Custom Component" })
+            /* @__PURE__ */ t(pe, { value: "react-component", children: "React Component" }),
+            /* @__PURE__ */ t(pe, { value: "component", children: "Custom Component" })
           ]
         }
       )
     ] }),
-    ((y = e.renderer) == null ? void 0 : y.type) === "component" ? /* @__PURE__ */ t(Hr, { value: e }) : ((g = e.renderer) == null ? void 0 : g.type) === "react-component" ? /* @__PURE__ */ t(Mr, { value: e }) : null,
+    ((y = e.renderer) == null ? void 0 : y.type) === "component" ? /* @__PURE__ */ t(Yr, { value: e }) : ((g = e.renderer) == null ? void 0 : g.type) === "react-component" ? /* @__PURE__ */ t(Hr, { value: e }) : null,
     /* @__PURE__ */ t(
       bt,
       {
         config: e,
         currentLocale: n,
         defaultLocale: d,
-        allComponents: p,
+        allComponents: m,
         onChange: ({ key: h, value: o }) => {
-          m({
+          p({
             [h]: o.value
           });
         },
@@ -1048,10 +1048,10 @@ function Vr({ value: e }) {
     )
   ] }) });
 }
-function Wr({ config: e }) {
+function Ur({ config: e }) {
   const { t: r } = N();
-  return /* @__PURE__ */ t(Oe, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ t($, { variant: "subtitle1", children: r("basicInfo") }),
+  return /* @__PURE__ */ t(Pe, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
+    /* @__PURE__ */ t(J, { variant: "subtitle1", children: r("basicInfo") }),
     /* @__PURE__ */ t(
       D,
       {
@@ -1087,7 +1087,7 @@ function Wr({ config: e }) {
       }
     ),
     /* @__PURE__ */ t(
-      Ar,
+      Tr,
       {
         label: r("previewImage"),
         value: e.previewImage || "",
@@ -1102,24 +1102,24 @@ function ht({
   visible: n,
   config: i,
   currentLocale: d,
-  defaultLocale: m,
-  allComponents: c,
-  onUpdateConfig: p
+  defaultLocale: p,
+  allComponents: a,
+  onUpdateConfig: m
 }) {
   var g, h, o, s, l, u;
-  const { t: k } = N(), y = se(() => e.type === "json" || e.type === "yaml" || e.type === "array" ? Fr : _, [e.type]);
+  const { t: k } = N(), y = ce(() => e.type === "json" || e.type === "yaml" || e.type === "array" ? _r : _, [e.type]);
   return /* @__PURE__ */ t(
-    Nr,
+    Ar,
     {
       preview: r.preview,
       drop: r.drop,
       drag: r.drag,
       isDragging: r.isDragging,
       onDelete: () => {
-        p((f) => {
+        m((f) => {
           if (f.properties) {
-            const a = Object.entries(f.properties).sort(([, b], [, P]) => b.index - P.index);
-            delete f.properties[e.id], a.filter(([b]) => b !== e.id).forEach(([, b], P) => {
+            const c = Object.entries(f.properties).sort(([, b], [, P]) => b.index - P.index);
+            delete f.properties[e.id], c.filter(([b]) => b !== e.id).forEach(([, b], P) => {
               b.index = P;
             });
           }
@@ -1127,9 +1127,9 @@ function ht({
       },
       visible: n,
       onVisibilityChange: (f) => {
-        p((w) => {
-          const a = w.properties[e.id].data;
-          a.visible = f;
+        m((w) => {
+          const c = w.properties[e.id].data;
+          c.visible = f;
         });
       },
       alwaysShowActions: !0,
@@ -1144,24 +1144,24 @@ function ht({
               width: "calc(100% - 80px - 8px)",
               flex: 1,
               "& .MuiOutlinedInput-root": {
-                borderColor: e.key ? re(i.properties, e.id, e.key) ? "warning.main" : void 0 : "error.main"
+                borderColor: e.key ? ie(i.properties, e.id, e.key) ? "warning.main" : void 0 : "error.main"
               },
               "& .MuiFormLabel-root": {
-                color: e.key ? re(i.properties, e.id, e.key) ? "warning.main" : "text.secondary" : "error.main"
+                color: e.key ? ie(i.properties, e.id, e.key) ? "warning.main" : "text.secondary" : "error.main"
               },
               "& .MuiFormLabel-root.Mui-focused": {
-                color: e.key ? re(i.properties, e.id, e.key) ? "warning.main" : "primary.main" : "error.main"
+                color: e.key ? ie(i.properties, e.id, e.key) ? "warning.main" : "primary.main" : "error.main"
               }
             },
             value: e.key || "",
             onChange: (f) => {
-              p((w) => {
-                const a = w.properties[e.id].data;
-                a.key = f.target.value.trim();
+              m((w) => {
+                const c = w.properties[e.id].data;
+                c.key = f.target.value.trim();
               });
             },
             InputProps: {
-              endAdornment: !e.key || e.key && re(i.properties, e.id, e.key) ? /* @__PURE__ */ t(
+              endAdornment: !e.key || e.key && ie(i.properties, e.id, e.key) ? /* @__PURE__ */ t(
                 ue,
                 {
                   position: "end",
@@ -1190,12 +1190,12 @@ function ht({
               label: k("label"),
               size: "small",
               sx: { flex: 1 },
-              value: (((h = (g = e.locales) == null ? void 0 : g[d]) == null ? void 0 : h.name) ?? ((s = (o = e.locales) == null ? void 0 : o[m]) == null ? void 0 : s.name)) || "",
+              value: (((h = (g = e.locales) == null ? void 0 : g[d]) == null ? void 0 : h.name) ?? ((s = (o = e.locales) == null ? void 0 : o[p]) == null ? void 0 : s.name)) || "",
               onChange: (f) => {
-                p((w) => {
+                m((w) => {
                   var x;
-                  const a = w.properties[e.id].data;
-                  a.locales ?? (a.locales = {}), (x = a.locales)[d] ?? (x[d] = {}), a.locales[d].name = f.target.value;
+                  const c = w.properties[e.id].data;
+                  c.locales ?? (c.locales = {}), (x = c.locales)[d] ?? (x[d] = {}), c.locales[d].name = f.target.value;
                 });
               }
             }
@@ -1209,16 +1209,16 @@ function ht({
               sx: { flex: 1 },
               value: e.type === "string" && e.multiline ? "multiline" : e.type || "string",
               onChange: (f) => {
-                p((w) => {
-                  const a = w.properties[e.id].data;
-                  if (a.locales)
-                    for (const b of Object.keys(a.locales))
-                      a.locales[b].defaultValue = void 0;
+                m((w) => {
+                  const c = w.properties[e.id].data;
+                  if (c.locales)
+                    for (const b of Object.keys(c.locales))
+                      c.locales[b].defaultValue = void 0;
                   const x = f.target.value;
-                  x === "multiline" ? (a.type = "string", a.multiline = !0) : (typeof a.multiline < "u" && delete a.multiline, a.type = x);
+                  x === "multiline" ? (c.type = "string", c.multiline = !0) : (typeof c.multiline < "u" && delete c.multiline, c.type = x);
                 });
               },
-              children: Tr.map((f) => /* @__PURE__ */ t(me, { value: f.value, children: f.label }, f.value))
+              children: Vr.map((f) => /* @__PURE__ */ t(pe, { value: f.value, children: f.label }, f.value))
             }
           )
         ] }),
@@ -1226,8 +1226,8 @@ function ht({
           /* @__PURE__ */ t(
             y,
             {
-              allComponents: c,
-              defaultLocale: m,
+              allComponents: a,
+              defaultLocale: p,
               component: i,
               property: e,
               label: k("defaultValue"),
@@ -1235,13 +1235,13 @@ function ht({
               fullWidth: !0,
               value: (u = (l = e.locales) == null ? void 0 : l[d]) == null ? void 0 : u.defaultValue,
               onChange: (f, w) => {
-                p((a) => {
+                m((c) => {
                   var b;
-                  const x = a.properties[e.id].data;
+                  const x = c.properties[e.id].data;
                   if (w != null && w.forceUpdateProperty) {
-                    const P = ye(x), C = ye(f);
-                    Object.keys(C).forEach((v) => {
-                      P[v] || nt(x, v, C[v]);
+                    const P = be(x), O = be(f);
+                    Object.keys(O).forEach((v) => {
+                      P[v] || nt(x, v, O[v]);
                     });
                   } else
                     x.locales ?? (x.locales = {}), (b = x.locales)[d] ?? (b[d] = {}), x.locales[d].defaultValue = f;
@@ -1249,40 +1249,40 @@ function ht({
               }
             }
           ),
-          e.type === "custom" ? /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(Br, { property: e, allComponents: c }) }) : null
+          e.type === "custom" ? /* @__PURE__ */ t(C, { children: /* @__PURE__ */ t(Kr, { property: e, allComponents: a }) }) : null
         ] })
       ] })
     }
   );
 }
-function Er(e, r) {
-  const [n, i] = M(0);
-  return H(() => {
-    const m = setTimeout(() => {
+function Wr(e, r) {
+  const [n, i] = $(0);
+  return M(() => {
+    const p = setTimeout(() => {
       if (e.current) {
-        let c = e.current.parentElement, p = 0;
-        for (; c; )
-          c.classList.contains("property-container") && p++, c = c.parentElement;
-        i(p);
+        let a = e.current.parentElement, m = 0;
+        for (; a; )
+          a.classList.contains("property-container") && m++, a = a.parentElement;
+        i(m);
       }
     }, 100);
-    return () => clearTimeout(m);
+    return () => clearTimeout(p);
   }, [e, r]), n;
 }
-function Ur({
+function Br({
   config: e,
   currentLocale: r,
   defaultLocale: n,
   allComponents: i,
   onUpdateConfig: d,
-  useI18nEditor: m = !0
+  useI18nEditor: p = !0
 }) {
-  const { t: c } = N(), p = Ce({ variant: "dialog" }), k = e.properties && V(Object.values(e.properties), "index");
-  return /* @__PURE__ */ t(Oe, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
+  const { t: a } = N(), m = Ie({ variant: "dialog" }), k = e.properties && V(Object.values(e.properties), "index");
+  return /* @__PURE__ */ t(Pe, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
     /* @__PURE__ */ S(j, { direction: "row", gap: 1, alignItems: "center", justifyContent: "space-between", children: [
-      /* @__PURE__ */ t($, { variant: "subtitle1", children: c("properties") }),
-      /* @__PURE__ */ t(O, { flex: 1 }),
-      m && /* @__PURE__ */ t(A, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...je(p), children: /* @__PURE__ */ t(lt, { fontSize: "small" }) })
+      /* @__PURE__ */ t(J, { variant: "subtitle1", children: a("properties") }),
+      /* @__PURE__ */ t(C, { flex: 1 }),
+      p && /* @__PURE__ */ t(A, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...Se(m), children: /* @__PURE__ */ t(lt, { fontSize: "small" }) })
     ] }),
     e.properties && Object.keys(e.properties).length > 0 ? /* @__PURE__ */ t(
       pt,
@@ -1293,7 +1293,7 @@ function Ur({
         renderItem: (y, g, h) => {
           const o = mt(e.properties, y.id);
           return /* @__PURE__ */ t(
-            de,
+            te,
             {
               elevation: 0,
               className: "property-container",
@@ -1321,7 +1321,7 @@ function Ur({
           );
         }
       }
-    ) : /* @__PURE__ */ t(ee, { style: { fontSize: 12 }, children: c("maker.properties.noProperties") }),
+    ) : /* @__PURE__ */ t(ee, { style: { fontSize: 12 }, children: a("maker.properties.noProperties") }),
     /* @__PURE__ */ t(
       A,
       {
@@ -1331,26 +1331,26 @@ function Ur({
         onClick: () => {
           d((y) => {
             var h;
-            const g = Ye();
+            const g = $e();
             y.properties ?? (y.properties = {}), (h = y.properties)[g] ?? (h[g] = { index: (k == null ? void 0 : k.length) || 0, data: { id: g } });
           });
         },
         startIcon: /* @__PURE__ */ t(st, {}),
-        children: c("addObject", { object: c("property") })
+        children: a("addObject", { object: a("property") })
       }
     ),
-    m && /* @__PURE__ */ t(ft, { ...dt(p), component: e })
+    p && /* @__PURE__ */ t(ft, { ...dt(m), component: e })
   ] }) });
 }
-function Br({
+function Kr({
   property: e,
   allComponents: r
 }) {
-  const n = Ce({ variant: "popper" });
-  return /* @__PURE__ */ S(J, { children: [
-    /* @__PURE__ */ t(A, { sx: { minWidth: 0 }, ...je(n), children: /* @__PURE__ */ t(at, { fontSize: "small" }) }),
-    /* @__PURE__ */ t(Ot, { ...yr(n), children: /* @__PURE__ */ t(nr, { onClickAway: n.close, children: /* @__PURE__ */ t(de, { children: /* @__PURE__ */ t(O, { width: 500, p: 2, children: /* @__PURE__ */ t(
-      ze,
+  const n = Ie({ variant: "popper" });
+  return /* @__PURE__ */ S(H, { children: [
+    /* @__PURE__ */ t(A, { sx: { minWidth: 0 }, ...Se(n), children: /* @__PURE__ */ t(at, { fontSize: "small" }) }),
+    /* @__PURE__ */ t(Ct, { ...vr(n), children: /* @__PURE__ */ t(or, { onClickAway: n.close, children: /* @__PURE__ */ t(te, { children: /* @__PURE__ */ t(C, { width: 500, p: 2, children: /* @__PURE__ */ t(
+      Oe,
       {
         value: e.componentId,
         onChange: (i, d) => e.componentId = d,
@@ -1359,7 +1359,7 @@ function Br({
     ) }) }) }) })
   ] });
 }
-function Kr({
+function Fr({
   value: e,
   valueImmutable: r,
   onChange: n,
@@ -1367,33 +1367,55 @@ function Kr({
   allComponents: d
 }) {
   var g;
-  const [m, c] = M(!1), { t: p, locale: k } = N(), y = typeof (e == null ? void 0 : e.componentId) == "string" ? (g = d[e.componentId]) == null ? void 0 : g.data : void 0;
-  return y ? /* @__PURE__ */ S(J, { children: [
-    /* @__PURE__ */ t(A, { sx: { minWidth: 0 }, disabled: !y, onClick: () => c(!0), children: /* @__PURE__ */ t(at, { fontSize: "small" }) }),
-    /* @__PURE__ */ S(pe, { open: m, onClose: () => c(!1), maxWidth: "md", fullWidth: !0, children: [
-      /* @__PURE__ */ t(we, { children: p("maker.properties.parameters") }),
-      /* @__PURE__ */ t(Pe, { children: /* @__PURE__ */ t(O, { width: "100%", p: 2, children: /* @__PURE__ */ t(
-        bt,
-        {
-          config: y,
-          currentLocale: k,
-          defaultLocale: i,
-          allComponents: d,
-          propertiesValue: e == null ? void 0 : e.properties,
-          onChange: ({ id: h, value: o }) => {
-            const s = er(o.value);
-            if (r) {
-              const l = JSON.parse(JSON.stringify(e));
-              n == null || n({ ...l, properties: { ...l.properties, [h]: { value: s } } });
-            } else
-              Y(y).doc.transact(() => {
-                e.properties ?? (e.properties = {}), e.properties[h] = { value: s };
-              });
-          }
-        }
-      ) }) }),
-      /* @__PURE__ */ t(Ie, { children: /* @__PURE__ */ t(A, { onClick: () => c(!1), children: p("close") }) })
-    ] })
+  const [p, a] = $(!1), { t: m, locale: k } = N(), y = typeof (e == null ? void 0 : e.componentId) == "string" ? (g = d[e.componentId]) == null ? void 0 : g.data : void 0;
+  return y ? /* @__PURE__ */ S(C, { sx: { width: "100%", position: "relative" }, children: [
+    /* @__PURE__ */ t(
+      A,
+      {
+        sx: { minWidth: 0 },
+        disabled: !y,
+        onClick: () => a(!p),
+        color: p ? "primary" : "inherit",
+        children: /* @__PURE__ */ t(at, { fontSize: "small" })
+      }
+    ),
+    /* @__PURE__ */ t(St, { in: p, timeout: "auto", unmountOnExit: !0, sx: { width: "100%", zIndex: 10 }, children: /* @__PURE__ */ S(
+      te,
+      {
+        elevation: 1,
+        sx: {
+          mt: 1,
+          p: 2,
+          borderRadius: 1,
+          border: "1px solid",
+          borderColor: "divider",
+          width: "100%"
+        },
+        children: [
+          /* @__PURE__ */ t(C, { width: "100%", mb: 2, children: /* @__PURE__ */ t(
+            bt,
+            {
+              config: y,
+              currentLocale: k,
+              defaultLocale: i,
+              allComponents: d,
+              propertiesValue: e == null ? void 0 : e.properties,
+              onChange: ({ id: h, value: o }) => {
+                const s = tr(o.value);
+                if (r) {
+                  const l = JSON.parse(JSON.stringify(e));
+                  n == null || n({ ...l, properties: { ...l.properties, [h]: { value: s } } });
+                } else
+                  Y(y).doc.transact(() => {
+                    e.properties ?? (e.properties = {}), e.properties[h] = { value: s };
+                  });
+              }
+            }
+          ) }),
+          /* @__PURE__ */ t(A, { size: "small", onClick: () => a(!1), sx: { mt: 1 }, children: m("close") })
+        ]
+      }
+    ) })
   ] }) : null;
 }
 function ft({
@@ -1405,20 +1427,20 @@ function ft({
   const { t: i } = N(), {
     state: {
       components: d,
-      supportedLocales: m,
-      config: { defaultLocale: c }
+      supportedLocales: p,
+      config: { defaultLocale: a }
     }
-  } = ae(), p = ge(), k = Y(r).doc, y = e === "properties" ? r.properties : e === "parameters" && ((h = r.renderer) == null ? void 0 : h.type) === "component" ? (o = d[r.renderer.componentId]) == null ? void 0 : o.data.properties : void 0, g = ((s = r.renderer) == null ? void 0 : s.type) === "component" ? r : void 0;
-  return /* @__PURE__ */ S(pe, { ...n, fullWidth: !0, maxWidth: "lg", children: [
-    /* @__PURE__ */ t(we, { children: i("i18nEditorTitle") }),
-    /* @__PURE__ */ t(Pe, { children: y && /* @__PURE__ */ t(j, { children: /* @__PURE__ */ S(Le, { stickyHeader: !0, sx: { td: { verticalAlign: "top" } }, children: [
-      /* @__PURE__ */ t(Ge, { children: /* @__PURE__ */ t(oe, { children: m.map(({ locale: l, name: u }) => /* @__PURE__ */ S(le, { children: [
+  } = de(), m = ve(), k = Y(r).doc, y = e === "properties" ? r.properties : e === "parameters" && ((h = r.renderer) == null ? void 0 : h.type) === "component" ? (o = d[r.renderer.componentId]) == null ? void 0 : o.data.properties : void 0, g = ((s = r.renderer) == null ? void 0 : s.type) === "component" ? r : void 0;
+  return /* @__PURE__ */ S(ke, { ...n, fullWidth: !0, maxWidth: "lg", children: [
+    /* @__PURE__ */ t(qe, { children: i("i18nEditorTitle") }),
+    /* @__PURE__ */ t(Qe, { children: y && /* @__PURE__ */ t(j, { children: /* @__PURE__ */ S(Me, { stickyHeader: !0, sx: { td: { verticalAlign: "top" } }, children: [
+      /* @__PURE__ */ t(He, { children: /* @__PURE__ */ t(le, { children: p.map(({ locale: l, name: u }) => /* @__PURE__ */ S(se, { children: [
         u,
-        c === l && /* @__PURE__ */ t(ar, { sx: { fontSize: 12, color: "text.secondary" } })
+        a === l && /* @__PURE__ */ t(dr, { sx: { fontSize: 12, color: "text.secondary" } })
       ] }, l)) }) }),
-      /* @__PURE__ */ t(qe, { children: V(Object.values(y), "index").map(({ data: l }) => /* @__PURE__ */ t(oe, { children: m.map(({ locale: u }) => {
-        var f, w, a, x, b, P, C, v, I, z, R, W, E, U, te, L, G, q, Q, X, Re, De, Ne, Ae, Te, Ve;
-        return /* @__PURE__ */ t(le, { children: /* @__PURE__ */ t(j, { gap: 1, children: e === "properties" ? /* @__PURE__ */ S(J, { children: [
+      /* @__PURE__ */ t(Ye, { children: V(Object.values(y), "index").map(({ data: l }) => /* @__PURE__ */ t(le, { children: p.map(({ locale: u }) => {
+        var f, w, c, x, b, P, O, v, I, z, R, E, U, W, re, L, G, q, Q, X, Ce, je, ze, Re, De, Ne;
+        return /* @__PURE__ */ t(se, { children: /* @__PURE__ */ t(j, { gap: 1, children: e === "properties" ? /* @__PURE__ */ S(H, { children: [
           /* @__PURE__ */ t(
             D,
             {
@@ -1437,7 +1459,7 @@ function ft({
             {
               size: "small",
               label: i("label"),
-              value: (((w = (f = l.locales) == null ? void 0 : f[u]) == null ? void 0 : w.name) ?? ((x = (a = l.locales) == null ? void 0 : a[c]) == null ? void 0 : x.name)) || "",
+              value: (((w = (f = l.locales) == null ? void 0 : f[u]) == null ? void 0 : w.name) ?? ((x = (c = l.locales) == null ? void 0 : c[a]) == null ? void 0 : x.name)) || "",
               onChange: (K) => {
                 k.transact(() => {
                   var B;
@@ -1446,18 +1468,18 @@ function ft({
               }
             }
           ),
-          /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(
+          /* @__PURE__ */ t(C, { children: /* @__PURE__ */ t(
             _,
             {
-              allComponents: p,
-              defaultLocale: c,
+              allComponents: m,
+              defaultLocale: a,
               component: r,
               property: l,
               size: "small",
               fullWidth: !0,
               label: "Default Value",
-              valueImmutable: ce((P = (b = l.locales) == null ? void 0 : b[u]) == null ? void 0 : P.defaultValue),
-              value: ((v = (C = l.locales) == null ? void 0 : C[u]) == null ? void 0 : v.defaultValue) ?? ((z = (I = l.locales) == null ? void 0 : I[c]) == null ? void 0 : z.defaultValue),
+              valueImmutable: ae((P = (b = l.locales) == null ? void 0 : b[u]) == null ? void 0 : P.defaultValue),
+              value: ((v = (O = l.locales) == null ? void 0 : O[u]) == null ? void 0 : v.defaultValue) ?? ((z = (I = l.locales) == null ? void 0 : I[a]) == null ? void 0 : z.defaultValue),
               onChange: (K) => {
                 k.transact(() => {
                   var B;
@@ -1466,61 +1488,61 @@ function ft({
               }
             }
           ) })
-        ] }) : e === "parameters" && g ? /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(
+        ] }) : e === "parameters" && g ? /* @__PURE__ */ t(C, { children: /* @__PURE__ */ t(
           _,
           {
-            allComponents: p,
-            defaultLocale: c,
+            allComponents: m,
+            defaultLocale: a,
             component: r,
             property: l,
             size: "small",
             fullWidth: !0,
-            valueImmutable: ce(
-              (U = (E = (W = (R = g.renderer.properties) == null ? void 0 : R[l.id]) == null ? void 0 : W.locales) == null ? void 0 : E[u]) == null ? void 0 : U.value
+            valueImmutable: ae(
+              (W = (U = (E = (R = g.renderer.properties) == null ? void 0 : R[l.id]) == null ? void 0 : E.locales) == null ? void 0 : U[u]) == null ? void 0 : W.value
             ),
-            value: ((q = (G = (L = (te = g.renderer.properties) == null ? void 0 : te[l.id]) == null ? void 0 : L.locales) == null ? void 0 : G[u]) == null ? void 0 : q.value) ?? ((De = (Re = (X = (Q = g.renderer.properties) == null ? void 0 : Q[l.id]) == null ? void 0 : X.locales) == null ? void 0 : Re[c]) == null ? void 0 : De.value) ?? ((Ae = (Ne = l.locales) == null ? void 0 : Ne[u]) == null ? void 0 : Ae.defaultValue) ?? ((Ve = (Te = l.locales) == null ? void 0 : Te[c]) == null ? void 0 : Ve.defaultValue),
+            value: ((q = (G = (L = (re = g.renderer.properties) == null ? void 0 : re[l.id]) == null ? void 0 : L.locales) == null ? void 0 : G[u]) == null ? void 0 : q.value) ?? ((je = (Ce = (X = (Q = g.renderer.properties) == null ? void 0 : Q[l.id]) == null ? void 0 : X.locales) == null ? void 0 : Ce[a]) == null ? void 0 : je.value) ?? ((Re = (ze = l.locales) == null ? void 0 : ze[u]) == null ? void 0 : Re.defaultValue) ?? ((Ne = (De = l.locales) == null ? void 0 : De[a]) == null ? void 0 : Ne.defaultValue),
             onChange: (K) => {
               k.transact(() => {
-                var B, We, Ee, Ue, Be;
-                (B = g.renderer).properties ?? (B.properties = {}), (We = g.renderer.properties)[Ee = l.id] ?? (We[Ee] = {}), (Ue = g.renderer.properties[l.id]).locales ?? (Ue.locales = {}), (Be = g.renderer.properties[l.id].locales)[u] ?? (Be[u] = {}), g.renderer.properties[l.id].locales[u].value = K;
+                var B, Ae, Te, Ve, Ee;
+                (B = g.renderer).properties ?? (B.properties = {}), (Ae = g.renderer.properties)[Te = l.id] ?? (Ae[Te] = {}), (Ve = g.renderer.properties[l.id]).locales ?? (Ve.locales = {}), (Ee = g.renderer.properties[l.id].locales)[u] ?? (Ee[u] = {}), g.renderer.properties[l.id].locales[u].value = K;
               });
             }
           }
         ) }) : null }, l.id) }, u);
       }) }, l.id)) })
     ] }) }) }),
-    /* @__PURE__ */ t(Ie, { children: /* @__PURE__ */ t(A, { onClick: (l) => {
+    /* @__PURE__ */ t(Xe, { children: /* @__PURE__ */ t(A, { onClick: (l) => {
       var u;
       return (u = n.onClose) == null ? void 0 : u.call(n, l, "escapeKeyDown");
     }, children: i("close") }) })
   ] });
 }
-const $e = (e, r) => (n) => {
+const Fe = (e, r) => (n) => {
   const i = [
     n.palette.info.main,
     n.palette.primary.main,
     n.palette.secondary.main,
     n.palette.success.main,
     n.palette.warning.main
-  ], d = Math.min(i.length - 1, e), m = i[d], c = _e(m, 0.5), p = _e(m, 1);
+  ], d = Math.min(i.length - 1, e), p = i[d], a = Be(p, 0.5), m = Be(p, 1);
   return {
     // 保留原有的边框样式
-    borderColor: `${c} !important`,
+    borderColor: `${a} !important`,
     borderLeft: "3px solid !important",
     // 稍粗的左侧边框
-    borderLeftColor: c,
+    borderLeftColor: a,
     // 使用透明度适应深色/浅色模式
-    color: p,
+    color: m,
     ...r
   };
 };
-function Fr({
+function _r({
   property: e,
   onChange: r,
   defaultLocale: n,
   allComponents: i
 }) {
-  const { t: d, locale: m } = N(), c = F(null), p = Er(c, e), k = T(() => {
+  const { t: d, locale: p } = N(), a = F(null), m = Wr(a, e), k = T(() => {
     if (!(e.type !== "json" && e.type !== "yaml" && e.type !== "array") && e.subProperties)
       try {
         const y = {};
@@ -1529,27 +1551,27 @@ function Fr({
         ).forEach(({ data: o }) => {
           var l, u, f, w;
           if (!o.key) return;
-          let s = ((u = (l = o.locales) == null ? void 0 : l[m]) == null ? void 0 : u.defaultValue) ?? ((w = (f = o.locales) == null ? void 0 : f[n]) == null ? void 0 : w.defaultValue);
+          let s = ((u = (l = o.locales) == null ? void 0 : l[p]) == null ? void 0 : u.defaultValue) ?? ((w = (f = o.locales) == null ? void 0 : f[n]) == null ? void 0 : w.defaultValue);
           if (o.type === "number")
             s = Number(s);
           else if (o.type === "boolean")
             s = s === !0 || s === "true";
           else if ((o.type === "json" || o.type === "yaml") && typeof s == "string")
             try {
-              o.type === "json" ? s = JSON.parse(s) : s = be.parse(s);
-            } catch (a) {
-              console.error("Error parsing nested value", s, a), s = {};
+              o.type === "json" ? s = JSON.parse(s) : s = fe.parse(s);
+            } catch (c) {
+              console.error("Error parsing nested value", s, c), s = {};
             }
           y[o.key] = s;
         });
-        const h = ve(y, e.type);
+        const h = ye(y, e.type);
         r == null || r(h);
       } catch (y) {
         console.error("Error converting structure to text:", y);
       }
-  }, [e, m, n, r]);
-  return e.type !== "json" && e.type !== "yaml" && e.type !== "array" ? null : /* @__PURE__ */ S(j, { direction: "column", gap: 1.5, sx: { width: "100%" }, ref: c, children: [
-    /* @__PURE__ */ t(St, { sx: { mt: -1 }, children: /* @__PURE__ */ t($, { variant: "caption", color: "text.secondary", children: d("maker.properties.subProperties") }) }),
+  }, [e, p, n, r]);
+  return e.type !== "json" && e.type !== "yaml" && e.type !== "array" ? null : /* @__PURE__ */ S(j, { direction: "column", gap: 1.5, sx: { width: "100%" }, ref: a, children: [
+    /* @__PURE__ */ t(Ot, { sx: { mt: -1 }, children: /* @__PURE__ */ t(J, { variant: "caption", color: "text.secondary", children: d("maker.properties.subProperties") }) }),
     e.subProperties && Object.keys(e.subProperties).length > 0 ? /* @__PURE__ */ t(
       pt,
       {
@@ -1559,7 +1581,7 @@ function Fr({
         renderItem: (y, g, h) => {
           const o = y.visible !== !1;
           return /* @__PURE__ */ t(
-            de,
+            te,
             {
               elevation: 0,
               className: "property-container",
@@ -1567,7 +1589,7 @@ function Fr({
                 p: 1.25,
                 borderRadius: 1,
                 border: o ? "1px solid" : "1px dashed",
-                "&": $e(p)
+                "&": Fe(m)
               },
               children: /* @__PURE__ */ t(j, { gap: 2, children: /* @__PURE__ */ t(
                 ht,
@@ -1578,7 +1600,7 @@ function Fr({
                   config: {
                     properties: e.subProperties
                   },
-                  currentLocale: m,
+                  currentLocale: p,
                   defaultLocale: n,
                   allComponents: i,
                   onUpdateConfig: (s) => {
@@ -1612,7 +1634,7 @@ function Fr({
         startIcon: /* @__PURE__ */ t(st, {}),
         onClick: () => {
           try {
-            const y = e.subProperties || {}, g = Ye(), o = {
+            const y = e.subProperties || {}, g = $e(), o = {
               index: Object.values(y).length,
               data: {
                 id: g,
@@ -1620,7 +1642,7 @@ function Fr({
                 type: "string",
                 visible: !0,
                 locales: {
-                  [m]: {
+                  [p]: {
                     name: "",
                     defaultValue: ""
                   }
@@ -1641,7 +1663,7 @@ function Fr({
           }
         },
         sx: {
-          "&": $e(p, {
+          "&": Fe(m, {
             // borderLeft: undefined,
           })
         },
@@ -1656,29 +1678,29 @@ function _({
   value: n,
   onChange: i,
   valueImmutable: d,
-  defaultLocale: m,
-  allComponents: c,
-  ...p
+  defaultLocale: p,
+  allComponents: a,
+  ...m
 }) {
   var s, l, u, f, w;
-  const { locale: k } = N(), y = Xt(), g = F(null), h = () => {
+  const { locale: k } = N(), y = Zt(), g = F(null), h = () => {
     var x;
-    const a = (x = y == null ? void 0 : y.current) == null ? void 0 : x.getUploader();
-    a == null || a.open(), g.current && a.onceUploadSuccess(({ response: b }) => {
-      var C, v;
-      let P = ((C = b == null ? void 0 : b.data) == null ? void 0 : C.filename) || "";
+    const c = (x = y == null ? void 0 : y.current) == null ? void 0 : x.getUploader();
+    c == null || c.open(), g.current && c.onceUploadSuccess(({ response: b }) => {
+      var O, v;
+      let P = ((O = b == null ? void 0 : b.data) == null ? void 0 : O.filename) || "";
       P && (P = `mediakit://${P}`, n && !n.includes("mediakit://") && (P += " # please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address")), (v = g.current) == null || v.call(g, P);
     });
-  }, o = p.label || ((l = (s = r.locales) == null ? void 0 : s[k]) == null ? void 0 : l.name) || ((f = (u = r.locales) == null ? void 0 : u[m]) == null ? void 0 : f.name) || r.key || r.id;
+  }, o = m.label || ((l = (s = r.locales) == null ? void 0 : s[k]) == null ? void 0 : l.name) || ((f = (u = r.locales) == null ? void 0 : u[p]) == null ? void 0 : f.name) || r.key || r.id;
   if (r.type === "number")
     return /* @__PURE__ */ t(
-      _r,
+      Jr,
       {
-        ...p,
+        ...m,
         label: o,
         NumberProps: {
           value: ["number", "string"].includes(typeof n) ? n : null,
-          onChange: (a, x) => i == null ? void 0 : i(x)
+          onChange: (c, x) => i == null ? void 0 : i(x)
         }
       }
     );
@@ -1686,12 +1708,12 @@ function _({
     return /* @__PURE__ */ t(
       D,
       {
-        ...p,
+        ...m,
         label: o,
         type: "text",
         value: n ?? "",
-        onChange: (a) => {
-          const x = a.target.value;
+        onChange: (c) => {
+          const x = c.target.value;
           if (x === "" || x === "-") {
             i == null || i(x);
             return;
@@ -1705,94 +1727,94 @@ function _({
     );
   if (r.type === "boolean")
     return /* @__PURE__ */ t(
-      Qe,
+      Le,
       {
         label: o,
         labelPlacement: "start",
-        control: /* @__PURE__ */ t(Xe, { checked: n === !0, onChange: (a, x) => i == null ? void 0 : i(x) })
+        control: /* @__PURE__ */ t(Ge, { checked: n === !0, onChange: (c, x) => i == null ? void 0 : i(x) })
       }
     );
   if (r.type === "color")
     return /* @__PURE__ */ t(
-      zr,
+      Rr,
       {
         label: o,
         value: n,
-        onChange: (a) => {
-          i == null || i(a);
+        onChange: (c) => {
+          i == null || i(c);
         }
       }
     );
   if (r.type === "json" || r.type === "yaml")
     return /* @__PURE__ */ t(
-      Rr,
+      Dr,
       {
         label: o,
         value: n,
-        onChange: (a) => {
-          i == null || i(a);
+        onChange: (c) => {
+          i == null || i(c);
         },
         property: r,
         component: e,
-        defaultLocale: m,
-        allComponents: c,
+        defaultLocale: p,
+        allComponents: a,
         PropertyValueField: _,
-        onUpload: (a) => {
-          g.current = a, h();
+        onUpload: (c) => {
+          g.current = c, h();
         }
       }
     );
   if (r.type === "custom") {
-    const a = (w = c[r.componentId]) == null ? void 0 : w.data;
-    return a ? /* @__PURE__ */ t(O, { width: "100%", children: /* @__PURE__ */ t(
+    const c = (w = a[r.componentId]) == null ? void 0 : w.data;
+    return c ? /* @__PURE__ */ t(C, { width: "100%", children: /* @__PURE__ */ t(
       ot,
       {
-        componentId: a.id,
+        componentId: c.id,
         props: { label: o, value: n, onChange: i },
         locale: k,
         dev: {
           mode: "draft",
-          components: c,
-          defaultLocale: m
+          components: a,
+          defaultLocale: p
         }
       }
-    ) }) : /* @__PURE__ */ t(D, { ...p, label: o, disabled: !0, placeholder: "Click right button select a component" });
+    ) }) : /* @__PURE__ */ t(D, { ...m, label: o, disabled: !0, placeholder: "Click right button select a component" });
   }
   if (r.type === "component")
-    return /* @__PURE__ */ S(j, { width: "100%", direction: "row", gap: 1, children: [
-      /* @__PURE__ */ t(O, { flex: 1, children: /* @__PURE__ */ t(
-        ze,
+    return /* @__PURE__ */ S(j, { width: "100%", direction: "column", gap: 1, children: [
+      /* @__PURE__ */ t(
+        Oe,
         {
-          allComponents: c,
+          allComponents: a,
           label: o,
           value: n == null ? void 0 : n.componentId,
-          onChange: (a, x) => {
+          onChange: (c, x) => {
             d || !n ? i == null || i({ ...n && JSON.parse(JSON.stringify(n)), componentId: x }) : typeof n == "object" && (n.componentId = x);
           }
         }
-      ) }),
-      /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(
-        Kr,
+      ),
+      (n == null ? void 0 : n.componentId) && /* @__PURE__ */ t(
+        Fr,
         {
           value: n,
           valueImmutable: d,
           onChange: i,
-          defaultLocale: m,
-          allComponents: c
+          defaultLocale: p,
+          allComponents: a
         }
-      ) })
+      )
     ] });
   if (!r.type || ["string", "url"].includes(r.type)) {
-    const a = r.type === "string" ? r.multiline : void 0, x = r.type === "url" ? n == null ? void 0 : n.url : n;
+    const c = r.type === "string" ? r.multiline : void 0, x = r.type === "url" ? n == null ? void 0 : n.url : n;
     return /* @__PURE__ */ t(
       D,
       {
-        ...p,
+        ...m,
         label: o,
         value: typeof x == "string" ? x : "",
-        multiline: a,
-        minRows: a ? 2 : void 0,
-        maxRows: a ? 10 : void 0,
+        multiline: c,
+        minRows: c ? 2 : void 0,
+        maxRows: c ? 10 : void 0,
         onChange: (b) => i == null ? void 0 : i(
           r.type === "url" ? { ...n, url: b.target.value, mediaKitUrl: b.target.value } : b.target.value
         ),
@@ -1800,20 +1822,20 @@ function _({
           sx: { pr: 0 },
           endAdornment: /* @__PURE__ */ S(ue, { position: "end", children: [
             /* @__PURE__ */ t(
-              Se,
+              we,
               {
                 onChange: async ({ response: b }) => {
                   var I, z, R;
                   const P = ((I = b == null ? void 0 : b.data) == null ? void 0 : I.url) || ((z = b == null ? void 0 : b.data) == null ? void 0 : z.fileUrl);
-                  let C;
-                  P && (C = await he(P).catch(() => fe(P)).catch(() => {
+                  let O;
+                  P && (O = await me(P).catch(() => he(P)).catch(() => {
                   }));
                   let v = ((R = b == null ? void 0 : b.data) == null ? void 0 : R.filename) || "";
                   v && (v = `mediakit://${v}`), i == null || i({
                     url: P,
                     mediaKitUrl: v,
-                    width: C == null ? void 0 : C.naturalWidth,
-                    height: C == null ? void 0 : C.naturalHeight
+                    width: O == null ? void 0 : O.naturalWidth,
+                    height: O == null ? void 0 : O.naturalHeight
                   });
                 }
               }
@@ -1825,40 +1847,40 @@ function _({
     );
   }
   return r.type === "array" ? /* @__PURE__ */ t(
-    Pr,
+    Ir,
     {
       label: o,
       value: Array.isArray(n) ? n : [],
-      onChange: (a) => i == null ? void 0 : i(a),
+      onChange: (c) => i == null ? void 0 : i(c),
       property: r,
-      renderItem: ({ item: a, index: x, onChange: b }) => r.subProperties && Object.keys(r.subProperties).length > 0 ? /* @__PURE__ */ t(j, { gap: 1, width: "100%", children: V(Object.values(r.subProperties), "index").filter((P) => P.data.visible !== !1).map(({ data: P }) => P.key ? /* @__PURE__ */ t(
+      renderItem: ({ item: c, index: x, onChange: b }) => r.subProperties && Object.keys(r.subProperties).length > 0 ? /* @__PURE__ */ t(j, { gap: 1, width: "100%", children: V(Object.values(r.subProperties), "index").filter((P) => P.data.visible !== !1).map(({ data: P }) => P.key ? /* @__PURE__ */ t(
         _,
         {
           component: e,
           property: P,
-          value: a[P.key],
-          onChange: (C) => {
-            const v = { ...a, [P.key]: C };
+          value: c[P.key],
+          onChange: (O) => {
+            const v = { ...c, [P.key]: O };
             b(v);
           },
           size: "small",
           fullWidth: !0,
-          defaultLocale: m,
-          allComponents: c
+          defaultLocale: p,
+          allComponents: a
         },
         P.id
-      ) : null) }, x) : /* @__PURE__ */ t(D, { size: p.size, fullWidth: !0, value: a, onChange: (P) => b(P.target.value) })
+      ) : null) }, x) : /* @__PURE__ */ t(D, { size: m.size, fullWidth: !0, value: c, onChange: (P) => b(P.target.value) })
     }
   ) : (console.error("Unsupported property type", r.type), null);
 }
-function _r({
+function Jr({
   NumberProps: e,
   ...r
 }) {
-  const { getInputProps: n } = ir(e), i = n();
+  const { getInputProps: n } = nr(e), i = n();
   return /* @__PURE__ */ t(D, { ...r, inputProps: i });
 }
-const Jr = `import React from '@blocklet/pages-kit/builtin/react'
+const $r = `import React from '@blocklet/pages-kit/builtin/react'
 import { Box } from '@blocklet/pages-kit/builtin/mui/material'
 
 export default function () {
@@ -1867,19 +1889,19 @@ export default function () {
       Hello World
     </Box>
   )
-}`, $r = `console.log('hello')
+}`, Mr = `console.log('hello')
 `;
-function Mr({
+function Hr({
   value: e
 }) {
   const { locale: r } = N(), n = rt(), i = Y(e).doc;
-  return H(() => {
+  return M(() => {
     var d;
     (d = e.renderer) != null && d.script || (i.transact(() => {
-      e.renderer.script = e.renderer.type === "react-component" ? Jr : $r;
+      e.renderer.script = e.renderer.type === "react-component" ? $r : Mr;
     }), n());
-  }, [e]), /* @__PURE__ */ t(O, { sx: { border: 1, borderColor: "divider", borderRadius: 1, overflow: "hidden" }, children: /* @__PURE__ */ t(
-    xe,
+  }, [e]), /* @__PURE__ */ t(C, { sx: { border: 1, borderColor: "divider", borderRadius: 1, overflow: "hidden" }, children: /* @__PURE__ */ t(
+    ge,
     {
       keyId: e.id,
       locale: r,
@@ -1891,48 +1913,48 @@ function Mr({
     e.id
   ) });
 }
-function Hr({ value: e }) {
+function Yr({ value: e }) {
   var g, h, o;
   const { t: r } = N(), n = Y(e).doc, {
     state: {
       components: i,
       config: { defaultLocale: d },
-      resources: m
+      resources: p
     },
-    localState: { currentLocale: c }
-  } = ae(), p = ge(), k = ((g = i[e.renderer.componentId]) == null ? void 0 : g.data) ?? ((o = (h = m.components) == null ? void 0 : h[e.renderer.componentId]) == null ? void 0 : o.component), y = Ce({ variant: "dialog" });
+    localState: { currentLocale: a }
+  } = de(), m = ve(), k = ((g = i[e.renderer.componentId]) == null ? void 0 : g.data) ?? ((o = (h = p.components) == null ? void 0 : h[e.renderer.componentId]) == null ? void 0 : o.component), y = Ie({ variant: "dialog" });
   return /* @__PURE__ */ S(j, { gap: 1, children: [
     /* @__PURE__ */ t(
-      ze,
+      Oe,
       {
-        allComponents: p,
+        allComponents: m,
         excludes: [e.id],
         value: e.renderer.componentId,
         onChange: (s, l) => e.renderer.componentId = l
       }
     ),
-    k && /* @__PURE__ */ S(J, { children: [
+    k && /* @__PURE__ */ S(H, { children: [
       /* @__PURE__ */ S(j, { direction: "row", justifyContent: "space-between", alignItems: "center", children: [
-        /* @__PURE__ */ t($, { variant: "subtitle2", children: r("parameters") }),
-        /* @__PURE__ */ t(A, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...je(y), children: /* @__PURE__ */ t(lt, { fontSize: "small" }) })
+        /* @__PURE__ */ t(J, { variant: "subtitle2", children: r("parameters") }),
+        /* @__PURE__ */ t(A, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...Se(y), children: /* @__PURE__ */ t(lt, { fontSize: "small" }) })
       ] }),
       k.properties && V(Object.values(k.properties), "index").map(({ data: s }) => {
-        var l, u, f, w, a, x, b, P, C, v, I, z, R, W, E, U;
-        return /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(
+        var l, u, f, w, c, x, b, P, O, v, I, z, R, E, U, W;
+        return /* @__PURE__ */ t(C, { children: /* @__PURE__ */ t(
           _,
           {
-            allComponents: p,
+            allComponents: m,
             defaultLocale: d,
             component: k,
             property: s,
             fullWidth: !0,
             size: "small",
-            valueImmutable: ce((w = (f = (u = (l = e.renderer.properties) == null ? void 0 : l[s.id]) == null ? void 0 : u.locales) == null ? void 0 : f[c]) == null ? void 0 : w.value),
-            value: ((P = (b = (x = (a = e.renderer.properties) == null ? void 0 : a[s.id]) == null ? void 0 : x.locales) == null ? void 0 : b[c]) == null ? void 0 : P.value) ?? ((z = (I = (v = (C = e.renderer.properties) == null ? void 0 : C[s.id]) == null ? void 0 : v.locales) == null ? void 0 : I[d]) == null ? void 0 : z.value) ?? ((W = (R = s.locales) == null ? void 0 : R[c]) == null ? void 0 : W.defaultValue) ?? ((U = (E = s.locales) == null ? void 0 : E[d]) == null ? void 0 : U.defaultValue),
-            onChange: (te) => {
+            valueImmutable: ae((w = (f = (u = (l = e.renderer.properties) == null ? void 0 : l[s.id]) == null ? void 0 : u.locales) == null ? void 0 : f[a]) == null ? void 0 : w.value),
+            value: ((P = (b = (x = (c = e.renderer.properties) == null ? void 0 : c[s.id]) == null ? void 0 : x.locales) == null ? void 0 : b[a]) == null ? void 0 : P.value) ?? ((z = (I = (v = (O = e.renderer.properties) == null ? void 0 : O[s.id]) == null ? void 0 : v.locales) == null ? void 0 : I[d]) == null ? void 0 : z.value) ?? ((E = (R = s.locales) == null ? void 0 : R[a]) == null ? void 0 : E.defaultValue) ?? ((W = (U = s.locales) == null ? void 0 : U[d]) == null ? void 0 : W.defaultValue),
+            onChange: (re) => {
               n.transact(() => {
                 var L, G, q, Q, X;
-                (L = e.renderer).properties ?? (L.properties = {}), (G = e.renderer.properties)[q = s.id] ?? (G[q] = {}), (Q = e.renderer.properties[s.id]).locales ?? (Q.locales = {}), (X = e.renderer.properties[s.id].locales)[c] ?? (X[c] = {}), e.renderer.properties[s.id].locales[c].value = te;
+                (L = e.renderer).properties ?? (L.properties = {}), (G = e.renderer.properties)[q = s.id] ?? (G[q] = {}), (Q = e.renderer.properties[s.id]).locales ?? (Q.locales = {}), (X = e.renderer.properties[s.id].locales)[a] ?? (X[a] = {}), e.renderer.properties[s.id].locales[a].value = re;
               });
             }
           }
@@ -1942,36 +1964,36 @@ function Hr({ value: e }) {
     ] })
   ] });
 }
-function ze({
+function Oe({
   label: e,
   options: r,
   excludes: n,
   value: i,
   onChange: d,
-  allComponents: m,
-  ...c
+  allComponents: p,
+  ...a
 }) {
   var g;
-  const { t: p } = N(), k = r ?? V(Object.values(hr(m, ...n ?? [])), "index").map((h) => h.data), y = (typeof i == "string" ? (g = m[i]) == null ? void 0 : g.data : void 0) ?? null;
+  const { t: m } = N(), k = r ?? V(Object.values(fr(p, ...n ?? [])), "index").map((h) => h.data), y = (typeof i == "string" ? (g = p[i]) == null ? void 0 : g.data : void 0) ?? null;
   return /* @__PURE__ */ t(
     Ze,
     {
-      ...c,
+      ...a,
       size: "small",
       options: k,
       autoHighlight: !0,
       isOptionEqualToValue: (h, o) => h.id === o.id,
       getOptionKey: (h) => h.id,
       getOptionLabel: (h) => h.name || h.id,
-      renderInput: (h) => /* @__PURE__ */ t(D, { label: e || p("component"), ...h }),
+      renderInput: (h) => /* @__PURE__ */ t(D, { label: e || m("component"), ...h }),
       value: y,
       onChange: (h, o) => {
-        var l, u, f, w, a, x;
+        var l, u, f, w, c, x;
         let s = {};
         o && (s = {
-          blockletId: (l = m[o == null ? void 0 : o.id]) == null ? void 0 : l.blockletId,
-          blockletTitle: (u = m[o == null ? void 0 : o.id]) == null ? void 0 : u.blockletTitle,
-          componentName: ((w = (f = m[o == null ? void 0 : o.id]) == null ? void 0 : f.data) == null ? void 0 : w.name) || ((x = (a = m[o == null ? void 0 : o.id]) == null ? void 0 : a.data) == null ? void 0 : x.id)
+          blockletId: (l = p[o == null ? void 0 : o.id]) == null ? void 0 : l.blockletId,
+          blockletTitle: (u = p[o == null ? void 0 : o.id]) == null ? void 0 : u.blockletTitle,
+          componentName: ((w = (f = p[o == null ? void 0 : o.id]) == null ? void 0 : f.data) == null ? void 0 : w.name) || ((x = (c = p[o == null ? void 0 : o.id]) == null ? void 0 : c.data) == null ? void 0 : x.id)
         }), d == null || d(h, o == null ? void 0 : o.id, s);
       }
     }
@@ -1983,51 +2005,51 @@ function bt({
   defaultLocale: n,
   propertiesValue: i,
   currentLocale: d,
-  onChange: m,
-  props: c
+  onChange: p,
+  props: a
 }) {
-  const { t: p } = N(), [k, y] = M(e == null ? void 0 : e.properties), [g, h] = M(null);
-  H(() => {
+  const { t: m } = N(), [k, y] = $(e == null ? void 0 : e.properties), [g, h] = $(null);
+  M(() => {
     (() => {
-      var w, a;
-      ((w = e == null ? void 0 : e.renderer) == null ? void 0 : w.type) === "react-component" && it(e == null ? void 0 : e.properties) ? tr((a = e == null ? void 0 : e.renderer) == null ? void 0 : a.script).then((x) => {
-        const b = rr(x);
+      var w, c;
+      ((w = e == null ? void 0 : e.renderer) == null ? void 0 : w.type) === "react-component" && it(e == null ? void 0 : e.properties) ? rr((c = e == null ? void 0 : e.renderer) == null ? void 0 : c.script).then((x) => {
+        const b = ir(x);
         y(b);
       }) : y(e == null ? void 0 : e.properties);
     })();
   }, [JSON.stringify(e)]);
   const o = T(() => !e || !k ? {} : Object.values(k).reduce(
     (f, { data: w }) => {
-      var x, b, P, C, v;
-      const a = w.key || w.id;
+      var x, b, P, O, v;
+      const c = w.key || w.id;
       return f[w.id] = {
-        key: a,
-        value: (c == null ? void 0 : c[a]) ?? ((x = i == null ? void 0 : i[w.id]) == null ? void 0 : x.value) ?? ((P = (b = w.locales) == null ? void 0 : b[d]) == null ? void 0 : P.defaultValue) ?? ((v = (C = w.locales) == null ? void 0 : C[n]) == null ? void 0 : v.defaultValue),
+        key: c,
+        value: (a == null ? void 0 : a[c]) ?? ((x = i == null ? void 0 : i[w.id]) == null ? void 0 : x.value) ?? ((P = (b = w.locales) == null ? void 0 : b[d]) == null ? void 0 : P.defaultValue) ?? ((v = (O = w.locales) == null ? void 0 : O[n]) == null ? void 0 : v.defaultValue),
         id: w.id,
         type: w.type
       }, f;
     },
     {}
-  ), [JSON.stringify(k), e, i, d, n]), s = se(() => {
+  ), [JSON.stringify(k), e, i, d, n]), s = ce(() => {
     if (!k)
       return {
         canUseProperties: [],
         visibleProperties: [],
         canUsePropertiesKeys: []
       };
-    const f = V(Object.values(k), "index"), w = f.filter(({ data: b }) => b.key && mt(k, b.id)), a = f.filter(({ data: b }) => b.key && b.type !== "component"), x = a.map(({ data: b }) => b.key);
+    const f = V(Object.values(k), "index"), w = f.filter(({ data: b }) => b.key && mt(k, b.id)), c = f.filter(({ data: b }) => b.key && b.type !== "component"), x = c.map(({ data: b }) => b.key);
     return {
-      canUseProperties: a,
+      canUseProperties: c,
       visibleProperties: w,
       canUsePropertiesKeys: x
     };
-  }, [JSON.stringify(k)]), l = o(), u = mr(l, "key");
-  return /* @__PURE__ */ t(Oe, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ t($, { variant: "subtitle1", children: p("maker.properties.parameters") }),
-    !e || s.canUsePropertiesKeys.length === 0 ? /* @__PURE__ */ t(ee, { style: { fontSize: 12 }, children: p("maker.properties.noParameters") }) : /* @__PURE__ */ S(J, { children: [
+  }, [JSON.stringify(k)]), l = o(), u = hr(l, "key");
+  return /* @__PURE__ */ t(Pe, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
+    /* @__PURE__ */ t(J, { variant: "subtitle1", children: m("maker.properties.parameters") }),
+    !e || s.canUsePropertiesKeys.length === 0 ? /* @__PURE__ */ t(ee, { style: { fontSize: 12 }, children: m("maker.properties.noParameters") }) : /* @__PURE__ */ S(H, { children: [
       /* @__PURE__ */ t(j, { gap: 2, children: s.visibleProperties.map(({ data: f }) => {
-        var w, a;
-        return /* @__PURE__ */ t(O, { children: /* @__PURE__ */ t(
+        var w, c;
+        return /* @__PURE__ */ t(C, { children: /* @__PURE__ */ t(
           _,
           {
             allComponents: r,
@@ -2036,14 +2058,14 @@ function bt({
             fullWidth: !0,
             component: e,
             property: f,
-            valueImmutable: ce((w = i == null ? void 0 : i[f.id]) == null ? void 0 : w.value),
-            value: (c == null ? void 0 : c[f.key || f.id]) ?? ((a = l[f.id]) == null ? void 0 : a.value),
+            valueImmutable: ae((w = i == null ? void 0 : i[f.id]) == null ? void 0 : w.value),
+            value: (a == null ? void 0 : a[f.key || f.id]) ?? ((c = l[f.id]) == null ? void 0 : c.value),
             onChange: (x) => {
-              m({
+              p({
                 path: ["properties", f.id],
                 id: f.id,
                 value: { value: x },
-                shouldSync: !(!f.type || Je.includes(f.type)),
+                shouldSync: !(!f.type || Ke.includes(f.type)),
                 excludeKeys: [],
                 key: f.key || f.id
               });
@@ -2060,7 +2082,7 @@ function bt({
           properties: l,
           dev: { mode: "draft", components: r, defaultLocale: n },
           props: {
-            ...fr(c ?? {}, s.canUsePropertiesKeys),
+            ...br(a ?? {}, s.canUsePropertiesKeys),
             onChange: (f) => {
               const { canUsePropertiesKeys: w } = s;
               Object.keys(f).filter((x) => {
@@ -2068,24 +2090,24 @@ function bt({
                 return f[x] !== ((b = u == null ? void 0 : u[x]) == null ? void 0 : b.value);
               }).filter((x) => {
                 var b;
-                return !(x === "locale" && !ur(u[x], "locale") || ((b = u[x]) == null ? void 0 : b.type) === "component");
+                return !(x === "locale" && !pr(u[x], "locale") || ((b = u[x]) == null ? void 0 : b.type) === "component");
               }).reduce((x, b) => x.then(() => {
-                const P = u[b], C = w.includes(b);
-                if (P != null && P.id && C)
-                  return m({
+                const P = u[b], O = w.includes(b);
+                if (P != null && P.id && O)
+                  return p({
                     path: ["properties", P.id],
                     id: P.id,
                     value: { value: f[b] },
-                    shouldSync: !(!P.type || Je.includes(P.type)),
+                    shouldSync: !(!P.type || Ke.includes(P.type)),
                     excludeKeys: [],
                     key: P.key || P.id
                   }), Promise.resolve();
                 const v = `propertyNotFound${b}`;
                 if (g === v)
                   return Promise.resolve();
-                Fe.close(g);
-                const I = Fe.warning(
-                  p("maker.properties.propertyNotFound", {
+                We.close(g);
+                const I = We.warning(
+                  m("maker.properties.propertyNotFound", {
                     key: b
                   }),
                   {
@@ -2102,12 +2124,12 @@ function bt({
   ] }) });
 }
 export {
-  Wr as BasicInfo,
-  ze as CustomComponentAutocomplete,
-  Vi as CustomComponentSettings,
-  Jr as DefaultReactComponentScriptTemplate,
-  $r as DefaultWebComponentScriptTemplate,
+  Ur as BasicInfo,
+  Oe as CustomComponentAutocomplete,
+  Ei as CustomComponentSettings,
+  $r as DefaultReactComponentScriptTemplate,
+  Mr as DefaultWebComponentScriptTemplate,
   bt as ParametersConfig,
-  Ur as PropertiesConfig,
+  Br as PropertiesConfig,
   _ as PropertyValueField
 };