@blocklet/pages-kit-inner-components 0.6.50 → 0.6.52

package/lib/es/setting.js

@@ -1,146 +1,147 @@
-import { jsx as r, jsxs as v, Fragment as F } from "react/jsx-runtime";
-import { Box as P, Alert as Xe, Typography as T, TextField as z, Stack as k, FormLabel as ee, TableContainer as Ze, Paper as G, Table as Ne, TableHead as je, TableRow as re, TableCell as te, TableBody as ze, Button as E, IconButton as Y, FormControlLabel as ge, Switch as Ve, InputAdornment as $, alpha as ae, Tooltip as _, buttonClasses as er, Dialog as ye, DialogTitle as Re, DialogContent as Ee, DialogActions as Ae, Checkbox as rr, Autocomplete as Te, MenuItem as ce, Collapse as tr, Divider as nr, Popper as ir } from "@mui/material";
-import { t as xe, f as ne, a as oe, h as ve } from "./chunks/state-DRjnlQY_.js";
-import q from "@arcblock/ux/lib/Empty";
-import { useLocaleContext as V } from "@arcblock/ux/lib/Locale/context";
+import { jsx as r, jsxs as v, Fragment as M } from "react/jsx-runtime";
+import { Box as P, Alert as Xe, Typography as D, TextField as V, Stack as k, FormLabel as Z, TableContainer as Ze, Paper as $, Table as je, TableHead as ze, TableRow as ee, TableCell as re, TableBody as Ve, Button as A, IconButton as G, FormControlLabel as ge, Switch as Re, InputAdornment as _, alpha as ae, Tooltip as J, buttonClasses as er, Dialog as ye, DialogTitle as Ee, DialogContent as Ae, DialogActions as De, Checkbox as rr, Autocomplete as Te, MenuItem as ce, Collapse as tr, Divider as nr, Popper as ir } from "@mui/material";
+import { t as xe, f as te, a as ie, h as ve } from "./chunks/state-DdT-7UdS.js";
+import Y from "@arcblock/ux/lib/Empty";
+import { useLocaleContext as R } from "@arcblock/ux/lib/Locale/context";
 import { CodeEditor as Ce } from "@blocklet/code-editor";
 import or from "@mui/icons-material/AddRounded";
 import lr from "@mui/icons-material/ArrowDownward";
 import sr from "@mui/icons-material/ArrowUpward";
 import ar from "@mui/icons-material/DeleteOutline";
-import D from "lodash/sortBy";
-import { useCallback as A, useMemo as H, useState as B, useEffect as U, useImperativeHandle as cr, useRef as M, useId as dr } from "react";
-import { useUpdate as De, useDebounce as ur } from "react-use";
-import { ColorItem as pr, ConfigColorDialog as mr } from "@blocklet/pages-kit/builtin/color-picker";
-import { getImageSize as de, getVideoSize as ue, UploaderButton as Pe, UploaderProvider as le, useUploader as hr } from "@blocklet/pages-kit/builtin/uploader";
-import { Icon as fr } from "@iconify-icon/react";
+import T from "lodash/sortBy";
+import { useCallback as W, useMemo as H, useState as U, useEffect as B, useImperativeHandle as cr, useRef as oe } from "react";
+import { useUpdate as We, useDebounce as dr } from "react-use";
+import { ColorItem as ur, ConfigColorDialog as pr } from "@blocklet/pages-kit/builtin/color-picker";
+import { getImageSize as de, getVideoSize as ue, UploaderButton as Pe, UploaderProvider as le, useUploader as mr } from "@blocklet/pages-kit/builtin/uploader";
+import { Icon as hr } from "@iconify-icon/react";
 import K from "lodash/isEmpty";
-import We from "lodash/set";
+import Ue from "lodash/set";
 import * as pe from "yaml";
 import me from "lodash/cloneDeep";
 import he from "@arcblock/ux/lib/Toast";
-import { CustomComponentRenderer as Ue, transpileAndLoadScript as br, getPropertiesFromCode as gr } from "@blocklet/pages-kit/components";
-import { parsePropertyValue as yr } from "@blocklet/pages-kit/utils/property";
-import { unstable_useNumberInput as xr, ClickAwayListener as vr } from "@mui/base";
-import { VisibilityOffRounded as Cr, VisibilityRounded as Pr, DeleteOutlineRounded as kr, DragIndicatorRounded as wr, TranslateRounded as Ke, AddRounded as Be, InfoRounded as Me, PsychologyAlt as Ir, StarRounded as Sr, SettingsRounded as Le } from "@mui/icons-material";
-import { getYjsValue as Q } from "@syncedstore/core";
-import { useUpdate as Or, useReactive as Nr } from "ahooks";
-import jr from "lodash/assign";
-import zr from "lodash/get";
-import Vr from "lodash/has";
-import Rr from "lodash/isEqual";
-import ie from "lodash/isNil";
-import Er from "lodash/isObject";
-import Ar from "lodash/keyBy";
-import Tr from "lodash/omit";
-import Dr from "lodash/pick";
-import Wr from "lodash/reduce";
-import { usePopupState as ke, bindTrigger as we, bindDialog as Fe, bindPopper as Ur } from "material-ui-popup-state/hooks";
-import { ErrorBoundary as Kr } from "react-error-boundary";
-import { cx as Br } from "@emotion/css";
-import { useDrop as Je, useDrag as Mr } from "react-dnd";
+import { CustomComponentRenderer as Ke, transpileAndLoadScript as fr, getPropertiesFromCode as br } from "@blocklet/pages-kit/components";
+import { parsePropertyValue as gr } from "@blocklet/pages-kit/utils/property";
+import { unstable_useNumberInput as yr, ClickAwayListener as xr } from "@mui/base";
+import { VisibilityOffRounded as vr, VisibilityRounded as Cr, DeleteOutlineRounded as Pr, DragIndicatorRounded as kr, TranslateRounded as Be, AddRounded as Le, InfoRounded as Me, PsychologyAlt as wr, StarRounded as Sr, SettingsRounded as Fe } from "@mui/icons-material";
+import { getYjsValue as q } from "@syncedstore/core";
+import { useReactive as Ir } from "ahooks";
+import Or from "lodash/assign";
+import Nr from "lodash/get";
+import jr from "lodash/has";
+import zr from "lodash/isEqual";
+import ne from "lodash/isNil";
+import Vr from "lodash/isObject";
+import Rr from "lodash/keyBy";
+import Er from "lodash/omit";
+import Ar from "lodash/pick";
+import Dr from "lodash/reduce";
+import { usePopupState as ke, bindTrigger as we, bindDialog as Je, bindPopper as Tr } from "material-ui-popup-state/hooks";
+import { ErrorBoundary as Wr } from "react-error-boundary";
+import { useSensors as Ur, useSensor as Ie, PointerSensor as Kr, KeyboardSensor as Br, DndContext as Lr, closestCorners as Mr, DragOverlay as Fr } from "@dnd-kit/core";
+import { SortableContext as Jr, verticalListSortingStrategy as _r, useSortable as Hr } from "@dnd-kit/sortable";
+import { CSS as $r } from "@dnd-kit/utilities";
 import { nextId as _e } from "@blocklet/pages-kit/utils/common";
-function Lr({ error: e }) {
+function Gr({ error: e }) {
   return /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(Xe, { severity: "error", children: e.message }) });
 }
-function Fr({
+function Yr({
   onClick: e,
   disabled: t,
-  sx: o,
+  sx: n,
   ...l
 }) {
-  return /* @__PURE__ */ r(Y, { size: "small", color: "warning", variant: "outlined", disabled: t, onClick: e, ...l, children: /* @__PURE__ */ r(ar, { fontSize: "small" }) });
+  return /* @__PURE__ */ r(G, { size: "small", color: "warning", variant: "outlined", disabled: t, onClick: e, ...l, children: /* @__PURE__ */ r(ar, { fontSize: "small" }) });
 }
-function Jr({
+function qr({
   onClick: e,
   disabled: t,
-  sx: o,
+  sx: n,
   ...l
 }) {
-  return /* @__PURE__ */ r(Y, { size: "small", color: "primary", disabled: t, onClick: e, ...l, children: /* @__PURE__ */ r(sr, { fontSize: "small" }) });
+  return /* @__PURE__ */ r(G, { size: "small", color: "primary", disabled: t, onClick: e, ...l, children: /* @__PURE__ */ r(sr, { fontSize: "small" }) });
 }
-function _r({
+function Qr({
   onClick: e,
   disabled: t,
-  sx: o,
+  sx: n,
   ...l
 }) {
-  return /* @__PURE__ */ r(Y, { size: "small", color: "primary", disabled: t, onClick: e, ...l, children: /* @__PURE__ */ r(lr, { fontSize: "small" }) });
+  return /* @__PURE__ */ r(G, { size: "small", color: "primary", disabled: t, onClick: e, ...l, children: /* @__PURE__ */ r(lr, { fontSize: "small" }) });
 }
-function $r({
+function Xr({
   label: e,
   value: t,
-  onChange: o,
+  onChange: n,
   disabled: l = !1,
   itemLabel: h = "",
   emptyHeight: p = 40,
-  property: d,
-  renderItem: b,
+  property: c,
+  renderItem: g,
   ...m
 }) {
-  const { t: c, locale: s } = V(), a = De(), i = A(
-    (y) => {
-      o(xe(y, d.type));
+  const { t: d, locale: s } = R(), a = We(), i = W(
+    (b) => {
+      n(xe(b, c.type));
     },
-    [o, d.type]
-  ), n = H(() => Array.isArray(t) ? t : [], [t]), f = A(() => {
-    const y = [...n, ""];
-    i(y), a();
-  }, [n, i, a]), g = A(() => {
-    if (!d || !d.subProperties)
+    [n, c.type]
+  ), o = H(() => Array.isArray(t) ? t : [], [t]), f = W(() => {
+    const b = [...o, ""];
+    i(b), a();
+  }, [o, i, a]), y = W(() => {
+    if (!c || !c.subProperties)
       return f();
-    const y = {};
-    D(Object.values(d.subProperties), "index").forEach(({ data: R }) => {
-      if (!R.key) return;
-      const W = R.locales?.[s]?.defaultValue ?? "";
-      y[R.key] = W;
+    const b = {};
+    T(Object.values(c.subProperties), "index").forEach(({ data: z }) => {
+      if (!z.key) return;
+      const E = z.locales?.[s]?.defaultValue ?? "";
+      b[z.key] = E;
     });
-    const O = [...n, y];
+    const O = [...o, b];
     i(O), a();
-  }, [n, i, a, d, s, f]), u = A(
-    (y) => {
+  }, [o, i, a, c, s, f]), u = W(
+    (b) => {
       try {
-        const C = JSON.parse(y);
-        Array.isArray(C) ? i(C) : console.error("JSON解析结果不是数组");
-      } catch (C) {
-        console.error("JSON解析错误:", C);
+        const x = JSON.parse(b);
+        Array.isArray(x) ? i(x) : console.error("JSON解析结果不是数组");
+      } catch (x) {
+        console.error("JSON解析错误:", x);
       }
     },
     [i]
-  ), x = A(
-    (y) => {
-      const C = n.filter((O, R) => R !== y);
-      i(C), a();
+  ), C = W(
+    (b) => {
+      const x = o.filter((O, z) => z !== b);
+      i(x), a();
     },
-    [n, i, a]
-  ), I = A(
-    (y) => {
-      if (y <= 0) return;
-      const C = [...n], O = C[y];
-      C[y] = C[y - 1], C[y - 1] = O, i(C), a();
+    [o, i, a]
+  ), w = W(
+    (b) => {
+      if (b <= 0) return;
+      const x = [...o], O = x[b];
+      x[b] = x[b - 1], x[b - 1] = O, i(x), a();
     },
-    [n, i, a]
-  ), N = A(
-    (y) => {
-      if (y >= n.length - 1) return;
-      const C = [...n], O = C[y];
-      C[y] = C[y + 1], C[y + 1] = O, i(C), a();
+    [o, i, a]
+  ), N = W(
+    (b) => {
+      if (b >= o.length - 1) return;
+      const x = [...o], O = x[b];
+      x[b] = x[b + 1], x[b + 1] = O, i(x), a();
     },
-    [n, i, a]
-  ), S = A(
-    (y, C) => {
-      const O = [...n];
-      O[y] = C, i(O);
+    [o, i, a]
+  ), S = W(
+    (b, x) => {
+      const O = [...o];
+      O[b] = x, i(O);
     },
-    [n, i]
-  ), w = d && d.subProperties && Object.keys(d.subProperties).length > 0, j = H(() => [
+    [o, i]
+  ), I = c && c.subProperties && Object.keys(c.subProperties).length > 0, j = H(() => [
     {
       field: "index",
       headerName: "#",
       width: 40,
       align: "center",
-      renderCell: ({ index: y }) => /* @__PURE__ */ r(
-        T,
+      renderCell: ({ index: b }) => /* @__PURE__ */ r(
+        D,
         {
           variant: "body1",
           sx: {
@@ -153,27 +154,27 @@ function $r({
             justifyContent: "center",
             color: "text.secondary"
           },
-          children: y + 1
+          children: b + 1
         }
       )
     },
     {
       field: "content",
       headerName: "",
-      renderCell: ({ row: y, index: C }) => b && w ? b({
-        item: y,
-        index: C,
-        property: d,
-        onChange: (O) => S(C, O)
+      renderCell: ({ row: b, index: x }) => g && I ? g({
+        item: b,
+        index: x,
+        property: c,
+        onChange: (O) => S(x, O)
       }) : /* @__PURE__ */ r(
-        z,
+        V,
         {
           fullWidth: !0,
           size: "small",
           disabled: l,
-          value: y,
-          placeholder: h || `${c("item")} ${C + 1}`,
-          onChange: (O) => S(C, O.target.value),
+          value: b,
+          placeholder: h || `${d("item")} ${x + 1}`,
+          onChange: (O) => S(x, O.target.value),
           ...m
         }
       )
@@ -184,33 +185,33 @@ function $r({
       width: 30,
       // 增加宽度以容纳更多按钮
       align: "center",
-      renderCell: ({ index: y }) => /* @__PURE__ */ v(k, { direction: "column", spacing: 0.25, children: [
-        /* @__PURE__ */ r(Jr, { disabled: l || y === 0, onClick: () => I(y) }),
+      renderCell: ({ index: b }) => /* @__PURE__ */ v(k, { direction: "column", spacing: 0.25, children: [
+        /* @__PURE__ */ r(qr, { disabled: l || b === 0, onClick: () => w(b) }),
         /* @__PURE__ */ r(
-          _r,
+          Qr,
           {
-            disabled: l || y === n.length - 1,
-            onClick: () => N(y)
+            disabled: l || b === o.length - 1,
+            onClick: () => N(b)
           }
         ),
-        /* @__PURE__ */ r(Fr, { disabled: l, onClick: () => x(y) })
+        /* @__PURE__ */ r(Yr, { disabled: l, onClick: () => C(b) })
       ] })
     }
   ], [
-    b,
-    w,
-    d,
+    g,
+    I,
+    c,
     S,
     h,
-    c,
+    d,
     l,
     m,
-    x,
-    I,
+    C,
+    w,
     N,
-    n.length
+    o.length
   ]);
-  return w ? /* @__PURE__ */ v(
+  return I ? /* @__PURE__ */ v(
     k,
     {
       sx: {
@@ -218,9 +219,9 @@ function $r({
         gap: 1
       },
       children: [
-        e && /* @__PURE__ */ r(ee, { children: e }),
-        n.length > 0 ? /* @__PURE__ */ r(Ze, { component: G, variant: "outlined", sx: { borderRadius: 1, mb: 1 }, children: /* @__PURE__ */ v(
-          Ne,
+        e && /* @__PURE__ */ r(Z, { children: e }),
+        o.length > 0 ? /* @__PURE__ */ r(Ze, { component: $, variant: "outlined", sx: { borderRadius: 1, mb: 1 }, children: /* @__PURE__ */ v(
+          je,
           {
             size: "small",
             sx: {
@@ -237,58 +238,58 @@ function $r({
               borderCollapse: "collapse"
             },
             children: [
-              /* @__PURE__ */ r(je, { sx: { display: "none" }, children: /* @__PURE__ */ r(re, { children: j.map((y) => /* @__PURE__ */ r(
-                te,
+              /* @__PURE__ */ r(ze, { sx: { display: "none" }, children: /* @__PURE__ */ r(ee, { children: j.map((b) => /* @__PURE__ */ r(
+                re,
                 {
-                  width: y.width,
-                  align: y.align || "left",
+                  width: b.width,
+                  align: b.align || "left",
                   sx: { fontWeight: "bold" },
-                  children: y.renderHeader ? y.renderHeader() : y.headerName
+                  children: b.renderHeader ? b.renderHeader() : b.headerName
                 },
-                y.field
+                b.field
               )) }) }),
-              /* @__PURE__ */ r(ze, { children: n.map((y, C, O) => /* @__PURE__ */ r(
-                re,
+              /* @__PURE__ */ r(Ve, { children: o.map((b, x, O) => /* @__PURE__ */ r(
+                ee,
                 {
                   sx: {
-                    borderBottom: C < O.length - 1 ? "1px solid" : "none",
+                    borderBottom: x < O.length - 1 ? "1px solid" : "none",
                     borderColor: "divider",
                     "&:hover": {
                       backgroundColor: "action.hover"
                     }
                   },
-                  children: j.map((R) => /* @__PURE__ */ r(
-                    te,
+                  children: j.map((z) => /* @__PURE__ */ r(
+                    re,
                     {
-                      width: R.width,
-                      align: R.align || "left",
+                      width: z.width,
+                      align: z.align || "left",
                       sx: {
                         borderBottom: "none"
                       },
-                      children: R.renderCell({
-                        row: y,
-                        index: C,
-                        onChange: (W) => S(C, W)
+                      children: z.renderCell({
+                        row: b,
+                        index: x,
+                        onChange: (E) => S(x, E)
                       })
                     },
-                    `${C}-${R.field}`
+                    `${x}-${z.field}`
                   ))
                 },
-                C
+                x
               )) })
             ]
           }
-        ) }) : /* @__PURE__ */ r(q, { style: { fontSize: 12, height: p }, children: c("maker.properties.arrayEmpty") }),
+        ) }) : /* @__PURE__ */ r(Y, { style: { fontSize: 12, height: p }, children: d("maker.properties.arrayEmpty") }),
         /* @__PURE__ */ r(
-          E,
+          A,
           {
             fullWidth: !0,
             size: "small",
             variant: "outlined",
             disabled: l,
             startIcon: /* @__PURE__ */ r(or, {}),
-            onClick: g,
-            children: c("maker.properties.addArrayItem")
+            onClick: y,
+            children: d("maker.properties.addArrayItem")
           }
         )
       ]
@@ -301,73 +302,73 @@ function $r({
         gap: 1
       },
       children: [
-        e && /* @__PURE__ */ r(ee, { children: e }),
+        e && /* @__PURE__ */ r(Z, { children: e }),
         /* @__PURE__ */ r(P, { sx: { border: 1, borderColor: "divider", borderRadius: 1, minHeight: 150 }, children: /* @__PURE__ */ r(
           Ce,
           {
-            keyId: d.id,
+            keyId: c.id,
             locale: s,
             language: "json",
-            value: JSON.stringify(n, null, 2),
-            onChange: (y) => u(y || ""),
+            value: JSON.stringify(o, null, 2),
+            onChange: (b) => u(b || ""),
             fullScreenOptions: {
               enableEscExit: !0,
               targetContainer: () => document.getElementById("parameters-config-dialog") || null
             }
           },
-          d.id
+          c.id
         ) })
       ]
     }
   );
 }
-function Hr({
+function Zr({
   ref: e,
   showMarkdown: t,
-  markdown: o,
+  markdown: n,
   onMarkdownChange: l,
   showUploader: h,
   value: p,
-  meta: d,
-  onChange: b,
+  meta: c,
+  onChange: g,
   ...m
 }) {
-  const [c, s] = B("");
-  U(() => {
+  const [d, s] = U("");
+  B(() => {
     s(p || "");
   }, [p, s]);
   const a = async () => {
-    if (c !== p) {
-      const n = ne(c);
-      if (!n) {
-        b(c, void 0);
+    if (d !== p) {
+      const o = te(d);
+      if (!o) {
+        g(d, void 0);
         return;
       }
-      const f = await de(n).catch(() => ue(n)).catch(() => {
+      const f = await de(o).catch(() => ue(o)).catch(() => {
       });
-      b(c, { ...f, filename: c });
+      g(d, { ...f, filename: d });
     }
   };
-  ur(
+  dr(
     () => {
-      c !== p && b(c);
+      d !== p && g(d);
     },
     300,
-    [c]
+    [d]
   ), cr(e, () => ({
     submit: a
   }));
   const i = {};
   return h && (i.InputProps = {
     sx: { pr: 0 },
-    endAdornment: /* @__PURE__ */ r($, { position: "end", sx: { mx: 0.5 }, children: /* @__PURE__ */ r(
+    endAdornment: /* @__PURE__ */ r(_, { position: "end", sx: { mx: 0.5 }, children: /* @__PURE__ */ r(
       Pe,
       {
-        onChange: async ({ response: n }) => {
-          const f = n?.data?.filename, g = ne(f) || "";
+        onChange: async ({ response: o }) => {
+          const f = o?.data?.filename, y = te(f) || "";
           let u = {};
-          g && (u = await de(g).catch(() => ue(g)).catch(() => {
-          })), b(f, {
+          y && (u = await de(y).catch(() => ue(y)).catch(() => {
+          })), g(f, {
             ...u,
             filename: f
           });
@@ -375,7 +376,7 @@ function Hr({
       }
     ) })
   }), /* @__PURE__ */ r(
-    z,
+    V,
     {
       size: "small",
       fullWidth: !0,
@@ -390,17 +391,17 @@ function Hr({
           },
           children: [
             m.label,
-            t && /* @__PURE__ */ v(F, { children: [
+            t && /* @__PURE__ */ v(M, { children: [
               " (",
               /* @__PURE__ */ r(
                 ge,
                 {
-                  checked: o,
-                  label: /* @__PURE__ */ r(P, { component: fr, icon: "tabler:markdown", sx: { verticalAlign: "middle" } }),
+                  checked: n,
+                  label: /* @__PURE__ */ r(P, { component: hr, icon: "tabler:markdown", sx: { verticalAlign: "middle" } }),
                   labelPlacement: "start",
-                  control: /* @__PURE__ */ r(Ve, { size: "small" }),
+                  control: /* @__PURE__ */ r(Re, { size: "small" }),
                   sx: { ml: 0.25, pr: 1 },
-                  onChange: (n, f) => l?.(f)
+                  onChange: (o, f) => l?.(f)
                 }
               ),
               ")"
@@ -408,11 +409,11 @@ function Hr({
           ]
         }
       ),
-      value: c,
-      onChange: (n) => s(n.target.value),
+      value: d,
+      onChange: (o) => s(o.target.value),
       ...i,
-      onKeyDown: (n) => {
-        n.keyCode !== 229 && n.key === "Enter" && a();
+      onKeyDown: (o) => {
+        o.keyCode !== 229 && o.key === "Enter" && a();
       },
       slotProps: {
         inputLabel: { shrink: !0, ...m.InputLabelProps }
@@ -420,23 +421,23 @@ function Hr({
     }
   );
 }
-function Gr({
+function et({
   value: e,
   onChange: t,
-  disableGradient: o = !1,
+  disableGradient: n = !1,
   ...l
 }) {
-  const h = M(null);
-  return /* @__PURE__ */ v(F, { children: [
+  const h = oe(null);
+  return /* @__PURE__ */ v(M, { children: [
     /* @__PURE__ */ r(
-      Hr,
+      Zr,
       {
         ...l,
         value: e,
         onChange: t,
         InputProps: {
-          endAdornment: /* @__PURE__ */ r($, { position: "end", children: /* @__PURE__ */ r(
-            pr,
+          endAdornment: /* @__PURE__ */ r(_, { position: "end", children: /* @__PURE__ */ r(
+            ur,
             {
               color: e ?? "",
               style: { width: "1.5rem", height: "1.5rem", padding: 0 },
@@ -449,32 +450,32 @@ function Gr({
       }
     ),
     /* @__PURE__ */ r(
-      mr,
+      pr,
       {
         ref: h,
-        onSave: ({ value: p }, d) => {
-          t(p), d();
+        onSave: ({ value: p }, c) => {
+          t(p), c();
         },
-        disableGradient: o
+        disableGradient: n
       }
     )
   ] });
 }
-function Yr({
+function rt({
   label: e,
   value: t,
-  onChange: o,
+  onChange: n,
   property: l,
   component: h,
   defaultLocale: p,
-  allComponents: d,
-  PropertyValueField: b,
+  allComponents: c,
+  PropertyValueField: g,
   onUpload: m
 }) {
-  const { locale: c } = V(), s = M(null);
+  const { locale: d } = R(), s = oe(null);
   if (!K(l.subProperties)) {
-    const i = D(Object.values(l.subProperties || {}), "index").filter(
-      (n) => n.data.visible !== !1 && n.data.key
+    const i = T(Object.values(l.subProperties || {}), "index").filter(
+      (o) => o.data.visible !== !1 && o.data.key
     );
     return /* @__PURE__ */ v(
       k,
@@ -483,16 +484,16 @@ function Yr({
           width: "100%"
         },
         children: [
-          /* @__PURE__ */ r(ee, { sx: { px: 0.25, py: 0.5 }, children: e }),
-          /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(P, { sx: { position: "relative" }, children: i.map((n, f) => {
-            const { data: g } = n, u = g.key ?? g.id, x = f === i.length - 1;
-            let I = null;
+          /* @__PURE__ */ r(Z, { sx: { px: 0.25, py: 0.5 }, children: e }),
+          /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(P, { sx: { position: "relative" }, children: i.map((o, f) => {
+            const { data: y } = o, u = y.key ?? y.id, C = f === i.length - 1;
+            let w = null;
             try {
-              t && typeof t == "object" ? I = t[u] : typeof t == "string" && (I = (l.type === "yaml" ? pe.parse(t || "") : JSON.parse(t || "{}"))[u]);
+              t && typeof t == "object" ? w = t[u] : typeof t == "string" && (w = (l.type === "yaml" ? pe.parse(t || "") : JSON.parse(t || "{}"))[u]);
             } catch {
             }
-            I == null && (g.locales && c && g.locales[c] ? I = g.locales[c].defaultValue : g.locales && p && g.locales[p] && (I = g.locales[p].defaultValue));
-            const N = (w) => {
+            w == null && (y.locales && d && y.locales[d] ? w = y.locales[d].defaultValue : y.locales && p && y.locales[p] && (w = y.locales[p].defaultValue));
+            const N = (I) => {
               try {
                 let j = {};
                 if (typeof t == "string")
@@ -501,9 +502,9 @@ function Yr({
                   } catch {
                   }
                 else typeof t == "object" && t !== null && (j = { ...t });
-                We(j, u, w);
-                const y = xe(j, l.type);
-                o?.(y);
+                Ue(j, u, I);
+                const b = xe(j, l.type);
+                n?.(b);
               } catch (j) {
                 console.error("Error updating property:", j);
               }
@@ -512,7 +513,7 @@ function Yr({
               P,
               {
                 sx: {
-                  mb: x ? 0 : 1,
+                  mb: C ? 0 : 1,
                   // 底部边距，最后一项不需要
                   display: "flex",
                   flexDirection: "row"
@@ -557,7 +558,7 @@ function Yr({
                             }
                           }
                         ),
-                        !x && /* @__PURE__ */ r(
+                        !C && /* @__PURE__ */ r(
                           P,
                           {
                             sx: {
@@ -577,21 +578,21 @@ function Yr({
                     }
                   ),
                   /* @__PURE__ */ r(P, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ r(
-                    b,
+                    g,
                     {
                       component: h,
-                      property: g,
-                      value: I,
+                      property: y,
+                      value: w,
                       onChange: N,
                       size: "small",
                       fullWidth: !0,
                       defaultLocale: p,
-                      allComponents: d
+                      allComponents: c
                     }
                   ) })
                 ]
               },
-              g.id
+              y.id
             );
           }) }) })
         ]
@@ -619,7 +620,7 @@ function Yr({
           },
           children: [
             /* @__PURE__ */ r(
-              ee,
+              Z,
               {
                 sx: {
                   position: "absolute",
@@ -634,11 +635,11 @@ function Yr({
               Ce,
               {
                 keyId: l.id,
-                locale: c,
+                locale: d,
                 language: l.type === "yaml" ? "yaml" : "json",
                 value: typeof t == "string" ? t : "",
                 onChange: (i) => {
-                  o?.(i);
+                  n?.(i);
                 },
                 onUpload: (i) => {
                   s.current = i, m && m(i);
@@ -676,145 +677,141 @@ function Yr({
     }
   );
 }
-const qr = ["string", "multiline", "json", "yaml", "url", "component", "custom", "array"];
-function Se(e) {
-  return e.type ? !qr.includes(e.type) : !1;
+const tt = ["string", "multiline", "json", "yaml", "url", "component", "custom", "array"];
+function Oe(e) {
+  return e.type ? !tt.includes(e.type) : !1;
 }
-function $e({
+function He({
   disabled: e,
   list: t,
-  renderItem: o,
+  renderItem: n,
   ...l
 }) {
-  const h = M(null), p = dr(), d = Or(), b = D(Object.entries(t), (n) => n[1].index).map((n) => n[0]), m = M(b), c = A(
-    (n) => {
-      m.current = n, d();
-    },
-    [d]
-  ), s = A(
-    ({ index: n }, { index: f }) => {
-      const g = [...m.current];
-      g.splice(f, 0, ...g.splice(n, 1)), c(g);
-    },
-    [c]
-  );
-  U(() => {
-    c(b);
-  }, [b.join("-")]);
-  const [{ isOver: a }, i] = Je({
-    accept: p,
-    collect: (n) => ({
-      isOver: n.isOver()
+  const h = T(Object.entries(t), ([, f]) => f.index), p = h.map(([f]) => f), [c, g] = U(null), [m, d] = U(null), s = Ur(
+    Ie(Kr, {
+      activationConstraint: {
+        distance: 8
+        // 8px movement required to start drag
+      }
     }),
-    canDrop: () => !e,
-    drop: () => {
-      const n = () => {
-        m.current.forEach((g, u) => {
-          const x = t[g];
-          x && (x.index = u);
-        });
-      }, f = Q(t)?.doc;
-      f ? f.transact(() => {
-        n();
-      }) : n();
-    }
-  });
-  return U(() => {
-    a || c(b);
-  }, [a]), i(h), /* @__PURE__ */ r(P, { ...l, ref: h, className: Br(a && "isDragging"), children: m.current.map((n, f) => /* @__PURE__ */ r(
-    Qr,
+    Ie(Br)
+  );
+  return /* @__PURE__ */ v(
+    Lr,
     {
-      type: p,
-      disabled: e,
-      id: n,
-      index: f,
-      itemIndex: (g) => m.current.indexOf(g),
-      move: s,
-      children: (g) => {
-        const u = t[n];
-        return u ? o(u.data, f, g) : null;
-      }
-    },
-    n
-  )) });
+      sensors: s,
+      collisionDetection: Mr,
+      onDragStart: (f) => {
+        const { active: y } = f, u = t[y.id];
+        u && (d(y.id), g(u.data));
+      },
+      onDragOver: () => {
+      },
+      onDragEnd: (f) => {
+        const { active: y, over: u } = f;
+        if (d(null), g(null), !u || y.id === u.id)
+          return;
+        const C = y.id, w = u.id;
+        if (t[C] && t[w]) {
+          const N = () => {
+            const j = Object.entries(t).sort(([, z], [, E]) => z.index - E.index), b = j.findIndex(([z]) => z === C), x = j.findIndex(([z]) => z === w), [O] = j.splice(b, 1);
+            O && j.splice(x, 0, O), j.forEach(([, z], E) => {
+              z.index = E;
+            });
+          }, S = q(t)?.doc;
+          S ? S.transact(() => {
+            N();
+          }) : N();
+        }
+      },
+      children: [
+        /* @__PURE__ */ r(Jr, { items: p, strategy: _r, children: /* @__PURE__ */ r(k, { ...l, children: h.map(([f, y], u) => /* @__PURE__ */ r(nt, { id: f, disabled: e, isDragging: m === f, children: n(y.data, u, {
+          isDragging: m === f,
+          drag: null,
+          // Legacy compatibility
+          drop: null,
+          // Legacy compatibility
+          preview: null
+          // Legacy compatibility
+        }) }, f)) }) }),
+        /* @__PURE__ */ r(Fr, { children: c && m ? /* @__PURE__ */ r(
+          P,
+          {
+            sx: {
+              opacity: 0.8,
+              backgroundColor: "background.paper",
+              border: "1px solid",
+              borderColor: "primary.main",
+              borderRadius: 1,
+              boxShadow: 2,
+              maxWidth: 400
+            },
+            children: n(c, 0, {
+              isDragging: !0,
+              drag: null,
+              drop: null,
+              preview: null
+            })
+          }
+        ) : null })
+      ]
+    }
+  );
 }
-function Qr({
-  disabled: e,
-  id: t,
-  index: o,
-  type: l,
-  children: h,
-  itemIndex: p,
-  move: d
+function nt({
+  id: e,
+  disabled: t,
+  isDragging: n,
+  children: l
 }) {
-  const b = M(void 0), [{ isDragging: m }, c, s] = Mr({
-    type: l,
-    item: () => ({ id: t }),
-    canDrag: () => !e,
-    collect: (i) => ({ isDragging: i.isDragging() })
-  }), [, a] = Je({
-    accept: l,
-    canDrop: () => !e,
-    hover(i, n) {
-      if (!b.current)
-        return;
-      const f = p(i.id), g = o;
-      if (f === g)
-        return;
-      const u = b.current?.getBoundingClientRect(), x = (u.bottom - u.top) / 2, N = n.getClientOffset().y - u.top;
-      f < g && N < x || f > g && N > x || d({ id: i.id, index: f }, { id: t, index: o });
-    }
-  });
-  return typeof h == "function" ? h({
-    isDragging: m,
-    drag: c,
-    drop: (i) => (b.current = i, a(i)),
-    preview: s
-  }) : (c(a(s(b))), /* @__PURE__ */ r(P, { ref: b, children: h }));
+  const { attributes: h, listeners: p, setNodeRef: c, transform: g, transition: m } = Hr({
+    id: e,
+    disabled: t
+  }), d = {
+    transform: $r.Transform.toString(g),
+    transition: m,
+    opacity: n ? 0.5 : 1
+  };
+  return /* @__PURE__ */ r(P, { ref: c, style: d, ...h, ...p, children: l });
 }
-function Xr({
-  drop: e,
-  preview: t,
-  drag: o,
-  disabled: l,
-  isDragging: h,
-  children: p,
-  onDelete: d,
-  onVisibilityChange: b,
-  visible: m = !0,
+function it({
+  disabled: e,
+  isDragging: t,
+  children: n,
+  onDelete: l,
+  onVisibilityChange: h,
+  visible: p = !0,
   actions: c,
-  alwaysShowActions: s = !1
+  alwaysShowActions: g = !1
 }) {
-  const { t: a } = V();
+  const { t: m } = R();
   return /* @__PURE__ */ r(
     P,
     {
-      ref: e,
       sx: {
         ":hover .hover-visible": { maxWidth: "100%" },
-        opacity: m ? 1 : 0.5
+        opacity: p ? 1 : 0.5
       },
       children: /* @__PURE__ */ v(P, { sx: { position: "relative" }, children: [
         /* @__PURE__ */ r(
           P,
           {
-            ref: t,
             sx: {
               flex: 1,
               borderRadius: 0.5,
-              bgcolor: h ? "action.hover" : "background.paper",
+              bgcolor: t ? "action.hover" : "background.paper",
               opacity: 0.9999
               // NOTE: make preview effective
             },
-            children: p
+            children: n
           }
         ),
-        !l && /* @__PURE__ */ r(
+        !e && /* @__PURE__ */ r(
           P,
           {
-            className: s ? "" : "hover-visible",
+            className: g ? "" : "hover-visible",
             sx: {
-              maxWidth: s ? "100%" : 0,
+              maxWidth: g ? "100%" : 0,
               overflow: "hidden",
               position: "absolute",
               right: 2,
@@ -826,7 +823,7 @@ function Xr({
               {
                 direction: "row",
                 sx: {
-                  bgcolor: (i) => ae(i.palette.grey[200], 0.9),
+                  bgcolor: (d) => ae(d.palette.grey[200], 0.9),
                   borderRadius: 1,
                   p: 0.5,
                   [`.${er.root}`]: {
@@ -838,9 +835,9 @@ function Xr({
                 },
                 children: [
                   c,
-                  b && /* @__PURE__ */ r(_, { title: a(m ? "hideParameter" : "showParameter"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ r(E, { onClick: () => b(!m), children: m ? /* @__PURE__ */ r(Cr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) : /* @__PURE__ */ r(Pr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
-                  d && /* @__PURE__ */ r(_, { title: a("delete"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ r(E, { onClick: d, children: /* @__PURE__ */ r(kr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
-                  /* @__PURE__ */ r(_, { title: a("dragSort"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ r(E, { ref: o, children: /* @__PURE__ */ r(wr, { sx: { color: "grey.500" } }) }) })
+                  h && /* @__PURE__ */ r(J, { title: m(p ? "hideParameter" : "showParameter"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ r(A, { onClick: () => h(!p), children: p ? /* @__PURE__ */ r(vr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) : /* @__PURE__ */ r(Cr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
+                  l && /* @__PURE__ */ r(J, { title: m("delete"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ r(A, { onClick: l, children: /* @__PURE__ */ r(Pr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
+                  /* @__PURE__ */ r(J, { title: m("dragSort"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ r(A, { children: /* @__PURE__ */ r(kr, { sx: { color: "grey.500" } }) }) })
                 ]
               }
             )
@@ -850,122 +847,122 @@ function Xr({
     }
   );
 }
-function Zr(e) {
-  const t = ["string", "json", "array", "url", "multiline"], o = ["style", "fontSize", "color", "content", "type"];
-  return !!(t.includes(e.type || "") && !o.includes(e.key || ""));
+function ot(e) {
+  const t = ["string", "json", "array", "url", "multiline"], n = ["style", "fontSize", "color", "content", "type"];
+  return !!(t.includes(e.type || "") && !n.includes(e.key || ""));
 }
-function et(e, t, o) {
-  return e.locales && e.locales[t] && e.locales[t].name ? e.locales[t].name : o && e.locales && e.locales[o] && e.locales[o].name ? e.locales[o].name : e.key ? e.key : e.id;
+function lt(e, t, n) {
+  return e.locales && e.locales[t] && e.locales[t].name ? e.locales[t].name : n && e.locales && e.locales[n] && e.locales[n].name ? e.locales[n].name : e.key ? e.key : e.id;
 }
-const He = (e, t, o, l) => {
+const $e = (e, t, n, l) => {
   const h = {};
-  return D(Object.entries(e), ([, d]) => d.index).forEach(([d, b]) => {
-    const m = b.data;
+  return T(Object.entries(e), ([, c]) => c.index).forEach(([c, g]) => {
+    const m = g.data;
     if (!m) return;
-    const c = m.key || m.id, s = o ? et(m, o, l || "") : c, a = t?.[m.id], i = {
-      key: c,
-      isNeedGenerate: a?.isNeedGenerate ?? Zr(m),
+    const d = m.key || m.id, s = n ? lt(m, n, l || "") : d, a = t?.[m.id], i = {
+      key: d,
+      isNeedGenerate: a?.isNeedGenerate ?? ot(m),
       // 如果存在使用现有值，否则默认勾选
       describe: a?.describe ?? "",
       displayName: s
     };
-    m.subProperties && !K(m.subProperties) && (i.subProperties = He(
+    m.subProperties && !K(m.subProperties) && (i.subProperties = $e(
       m.subProperties,
       a?.subProperties,
-      o,
+      n,
       l
     )), h[m.id] = i;
   }), h;
 };
-function rt({
+function st({
   open: e,
   onClose: t,
-  onConfirm: o,
+  onConfirm: n,
   component: l,
   initialConfig: h,
   locale: p,
-  defaultLocale: d,
-  title: b,
+  defaultLocale: c,
+  title: g,
   loading: m = !1
 }) {
-  const { t: c } = V(), [s, a] = B(null);
-  U(() => {
+  const { t: d } = R(), [s, a] = U(null);
+  B(() => {
     if (e && l) {
       const u = { properties: {} };
       if (l.properties) {
-        const x = h?.properties;
-        u.properties = He(l.properties, x, p, d);
+        const C = h?.properties;
+        u.properties = $e(l.properties, C, p, c);
       }
       a(u);
     }
-  }, [e, l, h, p, d]);
+  }, [e, l, h, p, c]);
   const i = () => {
     t();
-  }, n = () => {
-    s && (o(s), t());
-  }, f = (u, x, I) => {
+  }, o = () => {
+    s && (n(s), t());
+  }, f = (u, C, w) => {
     if (!s || !u.length) return;
     const N = JSON.parse(JSON.stringify(s));
-    let S = N.properties, w = null;
-    for (let y = 0; y < u.length - 1; y++) {
-      const C = u[y];
-      if (!C || !S[C])
+    let S = N.properties, I = null;
+    for (let b = 0; b < u.length - 1; b++) {
+      const x = u[b];
+      if (!x || !S[x])
         return;
-      w = S;
-      const O = S[C];
+      I = S;
+      const O = S[x];
       O.subProperties || (O.subProperties = {}), S = O.subProperties;
     }
     const j = u[u.length - 1];
     if (j) {
-      if ("isNeedGenerate" in I) {
-        const y = I.isNeedGenerate, C = {
-          ...x,
-          ...I
+      if ("isNeedGenerate" in w) {
+        const b = w.isNeedGenerate, x = {
+          ...C,
+          ...w
         };
-        if (x.subProperties && !K(x.subProperties)) {
-          const O = (R, W) => {
-            const J = {};
-            return Object.entries(R).forEach(([Qe, X]) => {
-              const se = { ...X };
-              W !== null && (se.isNeedGenerate = W), X.subProperties && !K(X.subProperties) && (se.subProperties = O(
-                X.subProperties,
-                W !== null ? W : null
-              )), J[Qe] = se;
-            }), J;
+        if (C.subProperties && !K(C.subProperties)) {
+          const O = (z, E) => {
+            const F = {};
+            return Object.entries(z).forEach(([Qe, Q]) => {
+              const se = { ...Q };
+              E !== null && (se.isNeedGenerate = E), Q.subProperties && !K(Q.subProperties) && (se.subProperties = O(
+                Q.subProperties,
+                E !== null ? E : null
+              )), F[Qe] = se;
+            }), F;
           };
-          C.subProperties = O(
-            x.subProperties,
-            y === !1 ? !1 : null
+          x.subProperties = O(
+            C.subProperties,
+            b === !1 ? !1 : null
           );
         }
         if (u.length === 1)
-          N.properties[j] = C;
-        else if (w && u.length >= 2) {
+          N.properties[j] = x;
+        else if (I && u.length >= 2) {
           const O = u[u.length - 2];
-          O && w[O] && (w[O].subProperties || (w[O].subProperties = {}), w[O].subProperties[j] = C);
+          O && I[O] && (I[O].subProperties || (I[O].subProperties = {}), I[O].subProperties[j] = x);
         }
       } else if (u.length === 1)
         N.properties[j] = {
-          ...x,
-          ...I
+          ...C,
+          ...w
         };
-      else if (w && u.length >= 2) {
-        const y = u[u.length - 2];
-        y && w[y] && w[y].subProperties && (w[y].subProperties[j] = {
-          ...x,
-          ...I
+      else if (I && u.length >= 2) {
+        const b = u[u.length - 2];
+        b && I[b] && I[b].subProperties && (I[b].subProperties[j] = {
+          ...C,
+          ...w
         });
       }
       a(N);
     }
-  }, g = (u, x = [], I = !0) => {
+  }, y = (u, C = [], w = !0) => {
     if (!u || K(u))
-      return /* @__PURE__ */ r(q, { children: c("maker.properties.noProperties") });
-    const N = D(Object.entries(u), ([, S]) => S.displayName);
-    return /* @__PURE__ */ r(k, { spacing: 1.5, children: N.map(([S, w], j) => {
-      const y = [...x, S], C = j === N.length - 1, O = w.subProperties && !K(w.subProperties), R = w.displayName || S, W = !I;
+      return /* @__PURE__ */ r(Y, { children: d("maker.properties.noProperties") });
+    const N = T(Object.entries(u), ([, S]) => S.displayName);
+    return /* @__PURE__ */ r(k, { spacing: 1.5, children: N.map(([S, I], j) => {
+      const b = [...C, S], x = j === N.length - 1, O = I.subProperties && !K(I.subProperties), z = I.displayName || S, E = !w;
       return /* @__PURE__ */ r(P, { sx: { position: "relative" }, children: /* @__PURE__ */ v(k, { direction: "row", children: [
-        x.length > 0 && /* @__PURE__ */ v(
+        C.length > 0 && /* @__PURE__ */ v(
           P,
           {
             sx: {
@@ -1002,7 +999,7 @@ function rt({
                   }
                 }
               ),
-              !C && /* @__PURE__ */ r(
+              !x && /* @__PURE__ */ r(
                 P,
                 {
                   sx: {
@@ -1036,16 +1033,16 @@ function rt({
                     control: /* @__PURE__ */ r(
                       rr,
                       {
-                        checked: w.isNeedGenerate,
-                        disabled: W,
-                        onChange: (J) => {
-                          f(y, w, {
-                            isNeedGenerate: J.target.checked
+                        checked: I.isNeedGenerate,
+                        disabled: E,
+                        onChange: (F) => {
+                          f(b, I, {
+                            isNeedGenerate: F.target.checked
                           });
                         }
                       }
                     ),
-                    label: R,
+                    label: z,
                     sx: {
                       minWidth: "180px",
                       maxWidth: "280px",
@@ -1057,58 +1054,58 @@ function rt({
                   }
                 ),
                 /* @__PURE__ */ r(
-                  z,
+                  V,
                   {
                     size: "small",
                     fullWidth: !0,
-                    label: c("maker.properties.llmPropertyDescribe"),
-                    value: w.describe,
-                    onChange: (J) => {
-                      f(y, w, {
-                        describe: J.target.value
+                    label: d("maker.properties.llmPropertyDescribe"),
+                    value: I.describe,
+                    onChange: (F) => {
+                      f(b, I, {
+                        describe: F.target.value
                       });
                     },
-                    disabled: !w.isNeedGenerate
+                    disabled: !I.isNeedGenerate
                   }
                 )
               ]
             }
           ),
-          O && /* @__PURE__ */ r(P, { sx: { ml: 3 }, children: g(
-            w.subProperties,
-            y,
-            w.isNeedGenerate && I
+          O && /* @__PURE__ */ r(P, { sx: { ml: 3 }, children: y(
+            I.subProperties,
+            b,
+            I.isNeedGenerate && w
           ) })
         ] })
       ] }) }, S);
     }) });
   };
   return /* @__PURE__ */ v(ye, { open: e, onClose: i, maxWidth: "lg", fullWidth: !0, children: [
-    /* @__PURE__ */ r(Re, { children: b || c("maker.properties.llmConfigTitle") }),
-    /* @__PURE__ */ r(Ee, { children: /* @__PURE__ */ r(
+    /* @__PURE__ */ r(Ee, { children: g || d("maker.properties.llmConfigTitle") }),
+    /* @__PURE__ */ r(Ae, { children: /* @__PURE__ */ r(
       P,
       {
         sx: {
           my: 3
         },
-        children: m ? /* @__PURE__ */ r(T, { children: c("maker.properties.loading") }) : l ? s ? /* @__PURE__ */ v(k, { spacing: 3, children: [
-          /* @__PURE__ */ r(T, { variant: "subtitle2", children: c("maker.properties.llmConfigInstructions") }),
-          g(s.properties)
-        ] }) : /* @__PURE__ */ r(T, { children: c("maker.properties.loading") }) : /* @__PURE__ */ r(T, { color: "error", children: c("maker.properties.componentNotFound") })
+        children: m ? /* @__PURE__ */ r(D, { children: d("maker.properties.loading") }) : l ? s ? /* @__PURE__ */ v(k, { spacing: 3, children: [
+          /* @__PURE__ */ r(D, { variant: "subtitle2", children: d("maker.properties.llmConfigInstructions") }),
+          y(s.properties)
+        ] }) : /* @__PURE__ */ r(D, { children: d("maker.properties.loading") }) : /* @__PURE__ */ r(D, { color: "error", children: d("maker.properties.componentNotFound") })
       }
     ) }),
-    /* @__PURE__ */ v(Ae, { children: [
-      /* @__PURE__ */ r(E, { onClick: i, children: c("common.cancel") }),
-      /* @__PURE__ */ r(E, { variant: "contained", onClick: n, disabled: !s || m, children: c("common.confirm") })
+    /* @__PURE__ */ v(De, { children: [
+      /* @__PURE__ */ r(A, { onClick: i, children: d("common.cancel") }),
+      /* @__PURE__ */ r(A, { variant: "contained", onClick: o, disabled: !s || m, children: d("common.confirm") })
     ] })
   ] });
 }
-function tt({
+function at({
   label: e,
   value: t,
-  onChange: o
+  onChange: n
 }) {
-  const [l, h] = B(!1);
+  const [l, h] = U(!1);
   return /* @__PURE__ */ v(
     k,
     {
@@ -1117,23 +1114,23 @@ function tt({
       },
       children: [
         /* @__PURE__ */ r(
-          z,
+          V,
           {
             label: e,
             size: "small",
             value: t,
-            onChange: (p) => o?.(p.target.value),
+            onChange: (p) => n?.(p.target.value),
             slotProps: {
               input: {
                 sx: {
                   pr: 0
                 },
-                endAdornment: /* @__PURE__ */ r($, { position: "end", children: /* @__PURE__ */ r(
+                endAdornment: /* @__PURE__ */ r(_, { position: "end", children: /* @__PURE__ */ r(
                   Pe,
                   {
                     onChange: ({ response: p }) => {
-                      const d = p?.data?.filename;
-                      d && o?.(d);
+                      const c = p?.data?.filename;
+                      c && n?.(c);
                     }
                   }
                 ) })
@@ -1145,7 +1142,7 @@ function tt({
           P,
           {
             component: "img",
-            src: ne(t),
+            src: te(t),
             alt: e,
             onClick: () => h(!0),
             sx: {
@@ -1158,18 +1155,18 @@ function tt({
             }
           }
         ),
-        /* @__PURE__ */ r(ye, { open: l, onClose: () => h(!1), children: /* @__PURE__ */ r(P, { component: "img", sx: { objectFit: "contain" }, src: ne(t), alt: e }) })
+        /* @__PURE__ */ r(ye, { open: l, onClose: () => h(!1), children: /* @__PURE__ */ r(P, { component: "img", sx: { objectFit: "contain" }, src: te(t), alt: e }) })
       ]
     }
   );
 }
 function fe(e, t = "") {
-  return Wr(e, (o, l, h) => {
+  return Dr(e, (n, l, h) => {
     const p = t ? `${t}.${h}` : h;
-    return Er(l) ? jr(o, fe(l, p)) : o[p] = l, o;
+    return Vr(l) ? Or(n, fe(l, p)) : n[p] = l, n;
   }, {});
 }
-const nt = [
+const ct = [
   { value: "string", label: "Text" },
   { value: "multiline", label: "Text (Multiline)" },
   { value: "number", label: "Number" },
@@ -1183,14 +1180,14 @@ const nt = [
   { value: "component", label: "Component" },
   { value: "custom", label: "Custom (Render by a Component)" }
 ];
-function Z(e, t, o) {
-  return !e || !o ? !1 : Object.values(e).some(({ data: l }) => l.id !== t && l.key === o);
+function X(e, t, n) {
+  return !e || !n ? !1 : Object.values(e).some(({ data: l }) => l.id !== t && l.key === n);
 }
 function be(e, t) {
   return !e || !t ? !1 : e[t]?.data.visible ?? !0;
 }
-function on({ componentId: e }) {
-  const { state: { components: t } } = oe(), l = t[e]?.data;
+function pn({ componentId: e }) {
+  const { state: { components: t } } = ie(), l = t[e]?.data;
   return l ? /* @__PURE__ */ r(k, {
     sx: {
       maxHeight: "100%",
@@ -1200,34 +1197,34 @@ function on({ componentId: e }) {
       sx: {
         p: 2
       },
-      children: /* @__PURE__ */ r(Kr, { FallbackComponent: Lr, resetKeys: [e], children: /* @__PURE__ */ r(it, { value: l, componentId: e }) })
+      children: /* @__PURE__ */ r(Wr, { FallbackComponent: Gr, resetKeys: [e], children: /* @__PURE__ */ r(dt, { value: l, componentId: e }) })
     })
   }) : null;
 }
-function it({ value: e, componentId: t }) {
-  const { t: o } = V(), { localState: { currentLocale: l, customComponentPreviewerProperties: h }, state: { config: { defaultLocale: p } }, localActions: { setCustomComponentPreviewerProperties: d } } = oe(), b = Q(e).doc, m = ve(), c = H(() => h?.[t] ?? {}, [t, h]), s = Nr({
+function dt({ value: e, componentId: t }) {
+  const { t: n } = R(), { localState: { currentLocale: l, customComponentPreviewerProperties: h }, state: { config: { defaultLocale: p } }, localActions: { setCustomComponentPreviewerProperties: c } } = ie(), g = q(e).doc, m = ve(), d = H(() => h?.[t] ?? {}, [t, h]), s = Ir({
     componentId: t,
     propertiesValue: {
-      ...c
+      ...d
     }
   });
-  return U(() => {
+  return B(() => {
     s.componentId !== t && (s.componentId = t, s.propertiesValue = {
-      ...c
+      ...d
     });
-  }, [t, c, s]), U(() => {
+  }, [t, d, s]), B(() => {
     if (s.componentId !== t)
       return;
     const a = Object.fromEntries(Object.values(e.properties ?? {}).map(({ data: i }) => [
       i.id,
       {
-        value: s.propertiesValue[i.id]?.value ?? yr(i, i.locales?.[l]?.defaultValue ?? i.locales?.[p]?.defaultValue, {
+        value: s.propertiesValue[i.id]?.value ?? gr(i, i.locales?.[l]?.defaultValue ?? i.locales?.[p]?.defaultValue, {
           locale: l,
           defaultLocale: p
         })
       }
     ]));
-    d(t, a);
+    c(t, a);
   }, [JSON.stringify(s.propertiesValue), t, s.componentId]), /* @__PURE__ */ r(k, {
     sx: {
       height: "100%"
@@ -1237,14 +1234,14 @@ function it({ value: e, componentId: t }) {
         gap: 2
       },
       children: [
-        /* @__PURE__ */ r(ot, { config: e }),
-        /* @__PURE__ */ r(st, {
+        /* @__PURE__ */ r(ut, { config: e }),
+        /* @__PURE__ */ r(mt, {
           config: e,
           currentLocale: l,
           defaultLocale: p,
           allComponents: m,
           onUpdateConfig: (a) => {
-            b.transact(() => {
+            g.transact(() => {
               a(e);
             });
           }
@@ -1257,14 +1254,14 @@ function it({ value: e, componentId: t }) {
             alignItems: "center"
           },
           children: [
-            /* @__PURE__ */ r(T, { variant: "subtitle1", children: o("renderer") }),
-            /* @__PURE__ */ v(z, {
+            /* @__PURE__ */ r(D, { variant: "subtitle1", children: n("renderer") }),
+            /* @__PURE__ */ v(V, {
               hiddenLabel: !0,
               size: "small",
               select: !0,
               value: e.renderer?.type || "react-component",
               onChange: (a) => {
-                b.transact(() => {
+                g.transact(() => {
                   const i = a.target.value;
                   e.renderer ??= { type: i }, e.renderer.type = i;
                 });
@@ -1279,18 +1276,18 @@ function it({ value: e, componentId: t }) {
             })
           ]
         }),
-        e.renderer?.type === "component" && /* @__PURE__ */ r(ft, { value: e }),
-        e.renderer?.type === "react-component" && /* @__PURE__ */ r(ht, { value: e }),
+        e.renderer?.type === "component" && /* @__PURE__ */ r(Ct, { value: e }),
+        e.renderer?.type === "react-component" && /* @__PURE__ */ r(vt, { value: e }),
         /* @__PURE__ */ r(qe, {
           config: e,
           currentLocale: l,
           defaultLocale: p,
           allComponents: m,
           propertiesValue: s.propertiesValue,
-          onChange: ({ value: a, id: i, path: n }) => {
-            const f = [...n, "data"];
-            if (!zr(e, f)) {
-              he.warning(o("cannotFindPropertyKey", {
+          onChange: ({ value: a, id: i, path: o }) => {
+            const f = [...o, "data"];
+            if (!Nr(e, f)) {
+              he.warning(n("cannotFindPropertyKey", {
                 key: f.join(".")
               }));
               return;
@@ -1304,31 +1301,31 @@ function it({ value: e, componentId: t }) {
     })
   });
 }
-function ot({ config: e }) {
-  const { t } = V();
+function ut({ config: e }) {
+  const { t } = R();
   return /* @__PURE__ */ r(le, { children: /* @__PURE__ */ v(k, {
     sx: {
       gap: 2
     },
     children: [
-      /* @__PURE__ */ r(T, { variant: "subtitle1", children: t("basicInfo") }),
-      /* @__PURE__ */ r(z, {
+      /* @__PURE__ */ r(D, { variant: "subtitle1", children: t("basicInfo") }),
+      /* @__PURE__ */ r(V, {
         label: t("name"),
         size: "small",
         value: e.name || "",
-        onChange: (o) => e.name = o.target.value
+        onChange: (n) => e.name = n.target.value
       }),
-      /* @__PURE__ */ r(z, {
+      /* @__PURE__ */ r(V, {
         label: t("description"),
         size: "small",
         multiline: !0,
         minRows: 2,
         maxRows: 10,
         value: e.description || "",
-        onChange: (o) => e.description = o.target.value,
+        onChange: (n) => e.description = n.target.value,
         slotProps: {
           input: {
-            endAdornment: /* @__PURE__ */ r($, { position: "end", sx: { mt: -1.5 }, children: /* @__PURE__ */ r(bt, { config: e }) })
+            endAdornment: /* @__PURE__ */ r(_, { position: "end", sx: { mt: -1.5 }, children: /* @__PURE__ */ r(Pt, { config: e }) })
           },
           htmlInput: { maxLength: 200 }
         }
@@ -1339,37 +1336,37 @@ function ot({ config: e }) {
         multiple: !0,
         freeSolo: !0,
         value: e.tags ?? [],
-        onChange: (o, l) => e.tags = l,
-        renderInput: (o) => /* @__PURE__ */ r(z, { label: t("tags"), ...o })
+        onChange: (n, l) => e.tags = l,
+        renderInput: (n) => /* @__PURE__ */ r(V, { label: t("tags"), ...n })
       }),
-      /* @__PURE__ */ r(tt, {
+      /* @__PURE__ */ r(at, {
         label: t("previewImage"),
         value: e.previewImage || "",
-        onChange: (o) => e.previewImage = o
+        onChange: (n) => e.previewImage = n
       })
     ]
   }) });
 }
-function Ge({ data: e, params: t, visible: o, config: l, currentLocale: h, defaultLocale: p, allComponents: d, onUpdateConfig: b }) {
-  const { t: m } = V(), c = H(() => e.type === "json" || e.type === "yaml" || e.type === "array" ? dt : L, [e.type]);
-  return /* @__PURE__ */ r(Xr, {
+function Ge({ data: e, params: t, visible: n, config: l, currentLocale: h, defaultLocale: p, allComponents: c, onUpdateConfig: g }) {
+  const { t: m } = R(), d = H(() => e.type === "json" || e.type === "yaml" || e.type === "array" ? bt : L, [e.type]);
+  return /* @__PURE__ */ r(it, {
     preview: t.preview,
     drop: t.drop,
     drag: t.drag,
     isDragging: t.isDragging,
     onDelete: () => {
-      b((s) => {
+      g((s) => {
         if (s.properties) {
-          const i = Object.entries(s.properties).sort(([, f], [, g]) => f.index - g.index);
-          delete s.properties[e.id], i.filter(([f]) => f !== e.id).forEach(([, f], g) => {
-            f.index = g;
+          const i = Object.entries(s.properties).sort(([, f], [, y]) => f.index - y.index);
+          delete s.properties[e.id], i.filter(([f]) => f !== e.id).forEach(([, f], y) => {
+            f.index = y;
           });
         }
       });
     },
-    visible: o,
+    visible: n,
     onVisibilityChange: (s) => {
-      b((a) => {
+      g((a) => {
         const i = a.properties[e.id].data;
         i.visible = s;
       });
@@ -1381,7 +1378,7 @@ function Ge({ data: e, params: t, visible: o, config: l, currentLocale: h, defau
         gap: 2
       },
       children: [
-        /* @__PURE__ */ r(z, {
+        /* @__PURE__ */ r(V, {
           label: m("key"),
           size: "small",
           required: !0,
@@ -1389,31 +1386,31 @@ function Ge({ data: e, params: t, visible: o, config: l, currentLocale: h, defau
             width: "calc(100% - 80px - 8px)",
             flex: 1,
             "& .MuiOutlinedInput-root": {
-              borderColor: e.key ? Z(l.properties, e.id, e.key) ? "warning.main" : void 0 : "error.main"
+              borderColor: e.key ? X(l.properties, e.id, e.key) ? "warning.main" : void 0 : "error.main"
             },
             "& .MuiFormLabel-root": {
-              color: e.key ? Z(l.properties, e.id, e.key) ? "warning.main" : "text.secondary" : "error.main"
+              color: e.key ? X(l.properties, e.id, e.key) ? "warning.main" : "text.secondary" : "error.main"
             },
             "& .MuiFormLabel-root.Mui-focused": {
-              color: e.key ? Z(l.properties, e.id, e.key) ? "warning.main" : "primary.main" : "error.main"
+              color: e.key ? X(l.properties, e.id, e.key) ? "warning.main" : "primary.main" : "error.main"
             }
           },
           value: e.key || "",
           onChange: (s) => {
-            b((a) => {
+            g((a) => {
               const i = a.properties[e.id].data;
               i.key = s.target.value.trim();
             });
           },
           slotProps: {
             input: {
-              endAdornment: !e.key || e.key && Z(l.properties, e.id, e.key) ? /* @__PURE__ */ r($, {
+              endAdornment: !e.key || e.key && X(l.properties, e.id, e.key) ? /* @__PURE__ */ r(_, {
                 position: "end",
                 sx: {
                   width: 16,
                   ml: 0
                 },
-                children: /* @__PURE__ */ r(_, { title: e.key ? m("duplicateKey") : m("requiredKey"), children: /* @__PURE__ */ r(Me, {
+                children: /* @__PURE__ */ r(J, { title: e.key ? m("duplicateKey") : m("requiredKey"), children: /* @__PURE__ */ r(Me, {
                   sx: {
                     color: e.key ? "warning.main" : "error.main",
                     fontSize: 16
@@ -1429,35 +1426,35 @@ function Ge({ data: e, params: t, visible: o, config: l, currentLocale: h, defau
             gap: 1
           },
           children: [
-            /* @__PURE__ */ r(z, {
+            /* @__PURE__ */ r(V, {
               label: m("label"),
               size: "small",
               sx: { flex: 1 },
               value: (e.locales?.[h]?.name ?? e.locales?.[p]?.name) || "",
               onChange: (s) => {
-                b((a) => {
+                g((a) => {
                   const i = a.properties[e.id].data;
                   i.locales ??= {}, i.locales[h] ??= {}, i.locales[h].name = s.target.value;
                 });
               }
             }),
-            /* @__PURE__ */ r(z, {
+            /* @__PURE__ */ r(V, {
               label: m("type"),
               size: "small",
               select: !0,
               sx: { flex: 1 },
               value: e.type === "string" && e.multiline ? "multiline" : e.type || "string",
               onChange: (s) => {
-                b((a) => {
+                g((a) => {
                   const i = a.properties[e.id].data;
                   if (i.locales)
                     for (const f of Object.keys(i.locales))
                       i.locales[f].defaultValue = void 0;
-                  const n = s.target.value;
-                  n === "multiline" ? (i.type = "string", i.multiline = !0) : (typeof i.multiline < "u" && delete i.multiline, i.type = n);
+                  const o = s.target.value;
+                  o === "multiline" ? (i.type = "string", i.multiline = !0) : (typeof i.multiline < "u" && delete i.multiline, i.type = o);
                 });
               },
-              children: nt.map((s) => /* @__PURE__ */ r(ce, { value: s.value, children: s.label }, s.value))
+              children: ct.map((s) => /* @__PURE__ */ r(ce, { value: s.value, children: s.label }, s.value))
             })
           ]
         }),
@@ -1467,8 +1464,8 @@ function Ge({ data: e, params: t, visible: o, config: l, currentLocale: h, defau
             gap: 1
           },
           children: [
-            /* @__PURE__ */ r(c, {
-              allComponents: d,
+            /* @__PURE__ */ r(d, {
+              allComponents: c,
               defaultLocale: p,
               component: l,
               property: e,
@@ -1477,41 +1474,41 @@ function Ge({ data: e, params: t, visible: o, config: l, currentLocale: h, defau
               fullWidth: !0,
               value: e.locales?.[h]?.defaultValue,
               onChange: (s, a) => {
-                b((i) => {
-                  const n = i.properties[e.id].data;
+                g((i) => {
+                  const o = i.properties[e.id].data;
                   if (a?.forceUpdateProperty) {
-                    const f = fe(n), g = fe(s);
-                    Object.keys(g).forEach((u) => {
-                      f[u] || We(n, u, g[u]);
+                    const f = fe(o), y = fe(s);
+                    Object.keys(y).forEach((u) => {
+                      f[u] || Ue(o, u, y[u]);
                     });
                   } else
-                    n.locales ??= {}, n.locales[h] ??= {}, n.locales[h].defaultValue = s;
+                    o.locales ??= {}, o.locales[h] ??= {}, o.locales[h].defaultValue = s;
                 });
               }
             }),
-            e.type === "custom" ? /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(at, { property: e, allComponents: d }) }) : null
+            e.type === "custom" ? /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(ht, { property: e, allComponents: c }) }) : null
           ]
         })
       ]
     })
   });
 }
-function lt(e, t) {
-  const [o, l] = B(0);
-  return U(() => {
+function pt(e, t) {
+  const [n, l] = U(0);
+  return B(() => {
     const p = setTimeout(() => {
       if (e.current) {
-        let d = e.current.parentElement, b = 0;
-        for (; d; )
-          d.classList.contains("property-container") && b++, d = d.parentElement;
-        l(b);
+        let c = e.current.parentElement, g = 0;
+        for (; c; )
+          c.classList.contains("property-container") && g++, c = c.parentElement;
+        l(g);
       }
     }, 100);
     return () => clearTimeout(p);
-  }, [e, t]), o;
+  }, [e, t]), n;
 }
-function st({ config: e, currentLocale: t, defaultLocale: o, allComponents: l, onUpdateConfig: h, useI18nEditor: p = !0 }) {
-  const { t: d } = V(), b = ke({ variant: "dialog" }), m = e.properties && D(Object.values(e.properties), "index");
+function mt({ config: e, currentLocale: t, defaultLocale: n, allComponents: l, onUpdateConfig: h, useI18nEditor: p = !0 }) {
+  const { t: c } = R(), g = ke({ variant: "dialog" }), m = e.properties && T(Object.values(e.properties), "index");
   return /* @__PURE__ */ r(le, { children: /* @__PURE__ */ v(k, {
     sx: {
       gap: 2
@@ -1525,22 +1522,22 @@ function st({ config: e, currentLocale: t, defaultLocale: o, allComponents: l, o
           justifyContent: "space-between"
         },
         children: [
-          /* @__PURE__ */ r(T, { variant: "subtitle1", children: d("properties") }),
+          /* @__PURE__ */ r(D, { variant: "subtitle1", children: c("properties") }),
           /* @__PURE__ */ r(P, {
             sx: {
               flex: 1
             }
           }),
-          p && /* @__PURE__ */ r(E, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...we(b), children: /* @__PURE__ */ r(Ke, { fontSize: "small" }) })
+          p && /* @__PURE__ */ r(A, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...we(g), children: /* @__PURE__ */ r(Be, { fontSize: "small" }) })
         ]
       }),
-      e.properties && Object.keys(e.properties).length > 0 ? /* @__PURE__ */ r($e, {
+      e.properties && Object.keys(e.properties).length > 0 ? /* @__PURE__ */ r(He, {
         component: k,
         gap: 2,
         list: e.properties,
-        renderItem: (c, s, a) => {
-          const i = be(e.properties, c.id);
-          return /* @__PURE__ */ r(G, {
+        renderItem: (d, s, a) => {
+          const i = be(e.properties, d.id);
+          return /* @__PURE__ */ r($, {
             elevation: 0,
             className: "property-container",
             sx: {
@@ -1554,46 +1551,46 @@ function st({ config: e, currentLocale: t, defaultLocale: o, allComponents: l, o
                 gap: 2
               },
               children: /* @__PURE__ */ r(Ge, {
-                data: c,
+                data: d,
                 params: a,
                 visible: i,
                 config: e,
                 currentLocale: t,
-                defaultLocale: o,
+                defaultLocale: n,
                 allComponents: l,
                 onUpdateConfig: h
               })
             })
-          }, c.id);
+          }, d.id);
         }
-      }) : /* @__PURE__ */ r(q, { style: { fontSize: 12 }, children: d("maker.properties.noProperties") }),
-      /* @__PURE__ */ r(E, {
+      }) : /* @__PURE__ */ r(Y, { style: { fontSize: 12 }, children: c("maker.properties.noProperties") }),
+      /* @__PURE__ */ r(A, {
         fullWidth: !0,
         variant: "outlined",
         className: "ignore-style-override",
         onClick: () => {
-          h((c) => {
+          h((d) => {
             const s = _e();
-            c.properties ??= {}, c.properties[s] ??= { index: m?.length || 0, data: { id: s } };
+            d.properties ??= {}, d.properties[s] ??= { index: m?.length || 0, data: { id: s } };
           });
         },
-        startIcon: /* @__PURE__ */ r(Be, {}),
-        children: d("addObject", { object: d("property") })
+        startIcon: /* @__PURE__ */ r(Le, {}),
+        children: c("addObject", { object: c("property") })
       }),
-      p && /* @__PURE__ */ r(Ye, { ...Fe(b), component: e })
+      p && /* @__PURE__ */ r(Ye, { ...Je(g), component: e })
     ]
   }) });
 }
-function at({ property: e, allComponents: t }) {
-  const o = ke({ variant: "popper" });
-  return /* @__PURE__ */ v(F, { children: [
-    /* @__PURE__ */ r(E, { sx: { minWidth: 0 }, ...we(o), children: /* @__PURE__ */ r(Le, { fontSize: "small" }) }),
-    /* @__PURE__ */ r(ir, { ...Ur(o), children: /* @__PURE__ */ r(vr, { onClickAway: o.close, children: /* @__PURE__ */ r(G, { children: /* @__PURE__ */ r(P, {
+function ht({ property: e, allComponents: t }) {
+  const n = ke({ variant: "popper" });
+  return /* @__PURE__ */ v(M, { children: [
+    /* @__PURE__ */ r(A, { sx: { minWidth: 0 }, ...we(n), children: /* @__PURE__ */ r(Fe, { fontSize: "small" }) }),
+    /* @__PURE__ */ r(ir, { ...Tr(n), children: /* @__PURE__ */ r(xr, { onClickAway: n.close, children: /* @__PURE__ */ r($, { children: /* @__PURE__ */ r(P, {
       sx: {
         width: 500,
         p: 2
       },
-      children: /* @__PURE__ */ r(Ie, {
+      children: /* @__PURE__ */ r(Se, {
         value: e.componentId,
         onChange: (l, h) => e.componentId = h,
         allComponents: t
@@ -1601,18 +1598,18 @@ function at({ property: e, allComponents: t }) {
     }) }) }) })
   ] });
 }
-function ct({ value: e, valueImmutable: t, onChange: o, defaultLocale: l, allComponents: h }) {
-  const [p, d] = B(!1), { t: b, locale: m } = V(), c = typeof e?.componentId == "string" ? h[e.componentId]?.data : void 0;
-  return c ? /* @__PURE__ */ v(P, { sx: { width: "100%", position: "relative" }, children: [
-    /* @__PURE__ */ r(Y, {
+function ft({ value: e, valueImmutable: t, onChange: n, defaultLocale: l, allComponents: h }) {
+  const [p, c] = U(!1), { t: g, locale: m } = R(), d = typeof e?.componentId == "string" ? h[e.componentId]?.data : void 0;
+  return d ? /* @__PURE__ */ v(P, { sx: { width: "100%", position: "relative" }, children: [
+    /* @__PURE__ */ r(G, {
       sx: { minWidth: 0 },
-      disabled: !c,
+      disabled: !d,
       size: "small",
-      onClick: () => d(!p),
+      onClick: () => c(!p),
       color: p ? "primary" : "default",
-      children: /* @__PURE__ */ r(Le, { fontSize: "small" })
+      children: /* @__PURE__ */ r(Fe, { fontSize: "small" })
     }),
-    p && /* @__PURE__ */ r(tr, { in: p, timeout: "auto", unmountOnExit: !0, sx: { width: "100%", zIndex: 10 }, children: /* @__PURE__ */ v(G, {
+    p && /* @__PURE__ */ r(tr, { in: p, timeout: "auto", unmountOnExit: !0, sx: { width: "100%", zIndex: 10 }, children: /* @__PURE__ */ v($, {
       elevation: 1,
       sx: {
         mt: 1,
@@ -1629,215 +1626,215 @@ function ct({ value: e, valueImmutable: t, onChange: o, defaultLocale: l, allCom
             mb: 2
           },
           children: /* @__PURE__ */ r(qe, {
-            config: c,
+            config: d,
             currentLocale: m,
             defaultLocale: l,
             allComponents: h,
             propertiesValue: e?.properties,
             onChange: ({ id: s, value: a }) => {
-              const i = me(a.value), n = JSON.parse(JSON.stringify(e));
-              n?.componentId && (t ? o?.({ ...n, properties: { ...n.properties, [s]: { value: i } } }) : (n.properties = n.properties ?? {}, n.properties[s] = { value: i }, o?.(n)));
+              const i = me(a.value), o = JSON.parse(JSON.stringify(e));
+              o?.componentId && (t ? n?.({ ...o, properties: { ...o.properties, [s]: { value: i } } }) : (o.properties = o.properties ?? {}, o.properties[s] = { value: i }, n?.(o)));
             }
           })
         }),
-        /* @__PURE__ */ r(E, { size: "small", onClick: () => d(!1), sx: { mt: 1 }, children: b("close") })
+        /* @__PURE__ */ r(A, { size: "small", onClick: () => c(!1), sx: { mt: 1 }, children: g("close") })
       ]
     }) })
   ] }) : null;
 }
-function Ye({ type: e = "properties", component: t, ...o }) {
-  const { t: l } = V(), { state: { components: h, supportedLocales: p, config: { defaultLocale: d } } } = oe(), b = ve(), m = Q(t).doc, c = e === "properties" ? t.properties : e === "parameters" && t.renderer?.type === "component" ? h[t.renderer.componentId]?.data.properties : void 0, s = t.renderer?.type === "component" ? t : void 0;
-  return /* @__PURE__ */ v(ye, { ...o, fullWidth: !0, maxWidth: "lg", children: [
-    /* @__PURE__ */ r(Re, { children: l("i18nEditorTitle") }),
-    /* @__PURE__ */ r(Ee, { children: c && /* @__PURE__ */ r(k, { children: /* @__PURE__ */ v(Ne, { stickyHeader: !0, sx: { td: { verticalAlign: "top" } }, children: [
-      /* @__PURE__ */ r(je, { children: /* @__PURE__ */ r(re, { children: p.map(({ locale: a, name: i }) => /* @__PURE__ */ r(te, { children: /* @__PURE__ */ v(T, {
+function Ye({ type: e = "properties", component: t, ...n }) {
+  const { t: l } = R(), { state: { components: h, supportedLocales: p, config: { defaultLocale: c } } } = ie(), g = ve(), m = q(t).doc, d = e === "properties" ? t.properties : e === "parameters" && t.renderer?.type === "component" ? h[t.renderer.componentId]?.data.properties : void 0, s = t.renderer?.type === "component" ? t : void 0;
+  return /* @__PURE__ */ v(ye, { ...n, fullWidth: !0, maxWidth: "lg", children: [
+    /* @__PURE__ */ r(Ee, { children: l("i18nEditorTitle") }),
+    /* @__PURE__ */ r(Ae, { children: d && /* @__PURE__ */ r(k, { children: /* @__PURE__ */ v(je, { stickyHeader: !0, sx: { td: { verticalAlign: "top" } }, children: [
+      /* @__PURE__ */ r(ze, { children: /* @__PURE__ */ r(ee, { children: p.map(({ locale: a, name: i }) => /* @__PURE__ */ r(re, { children: /* @__PURE__ */ v(D, {
         sx: {
           color: "text.primary"
         },
         children: [
           i,
-          d === a && /* @__PURE__ */ r(Sr, { sx: { fontSize: 12 } })
+          c === a && /* @__PURE__ */ r(Sr, { sx: { fontSize: 12 } })
         ]
       }) }, a)) }) }),
-      /* @__PURE__ */ r(ze, { children: D(Object.values(c), "index").map(({ data: a }) => /* @__PURE__ */ r(re, { children: p.map(({ locale: i }) => /* @__PURE__ */ r(te, { children: /* @__PURE__ */ r(k, {
+      /* @__PURE__ */ r(Ve, { children: T(Object.values(d), "index").map(({ data: a }) => /* @__PURE__ */ r(ee, { children: p.map(({ locale: i }) => /* @__PURE__ */ r(re, { children: /* @__PURE__ */ r(k, {
         sx: {
           gap: 1
         },
-        children: e === "properties" ? /* @__PURE__ */ v(F, { children: [
-          /* @__PURE__ */ r(z, {
+        children: e === "properties" ? /* @__PURE__ */ v(M, { children: [
+          /* @__PURE__ */ r(V, {
             size: "small",
             label: "Key",
             value: a.key || "",
-            onChange: (n) => {
+            onChange: (o) => {
               m.transact(() => {
-                a.key = n.target.value.trim();
+                a.key = o.target.value.trim();
               });
             }
           }),
-          /* @__PURE__ */ r(z, {
+          /* @__PURE__ */ r(V, {
             size: "small",
             label: l("label"),
-            value: (a.locales?.[i]?.name ?? a.locales?.[d]?.name) || "",
-            onChange: (n) => {
+            value: (a.locales?.[i]?.name ?? a.locales?.[c]?.name) || "",
+            onChange: (o) => {
               m.transact(() => {
-                a.locales ??= {}, a.locales[i] ??= {}, a.locales[i].name = n.target.value;
+                a.locales ??= {}, a.locales[i] ??= {}, a.locales[i].name = o.target.value;
               });
             }
           }),
           /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(L, {
-            allComponents: b,
-            defaultLocale: d,
+            allComponents: g,
+            defaultLocale: c,
             component: t,
             property: a,
             size: "small",
             fullWidth: !0,
             label: "Default Value",
-            valueImmutable: ie(a.locales?.[i]?.defaultValue),
-            value: a.locales?.[i]?.defaultValue ?? a.locales?.[d]?.defaultValue,
-            onChange: (n) => {
+            valueImmutable: ne(a.locales?.[i]?.defaultValue),
+            value: a.locales?.[i]?.defaultValue ?? a.locales?.[c]?.defaultValue,
+            onChange: (o) => {
               m.transact(() => {
-                a.locales ??= {}, a.locales[i] ??= {}, a.locales[i].defaultValue = n;
+                a.locales ??= {}, a.locales[i] ??= {}, a.locales[i].defaultValue = o;
               });
             }
           }) })
         ] }) : e === "parameters" && s ? /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(L, {
-          allComponents: b,
-          defaultLocale: d,
+          allComponents: g,
+          defaultLocale: c,
           component: t,
           property: a,
           size: "small",
           fullWidth: !0,
-          valueImmutable: ie(s.renderer.properties?.[a.id]?.locales?.[i]?.value),
-          value: s.renderer.properties?.[a.id]?.locales?.[i]?.value ?? s.renderer.properties?.[a.id]?.locales?.[d]?.value ?? a.locales?.[i]?.defaultValue ?? a.locales?.[d]?.defaultValue,
-          onChange: (n) => {
+          valueImmutable: ne(s.renderer.properties?.[a.id]?.locales?.[i]?.value),
+          value: s.renderer.properties?.[a.id]?.locales?.[i]?.value ?? s.renderer.properties?.[a.id]?.locales?.[c]?.value ?? a.locales?.[i]?.defaultValue ?? a.locales?.[c]?.defaultValue,
+          onChange: (o) => {
             m.transact(() => {
-              s.renderer.properties ??= {}, s.renderer.properties[a.id] ??= {}, s.renderer.properties[a.id].locales ??= {}, s.renderer.properties[a.id].locales[i] ??= {}, s.renderer.properties[a.id].locales[i].value = n;
+              s.renderer.properties ??= {}, s.renderer.properties[a.id] ??= {}, s.renderer.properties[a.id].locales ??= {}, s.renderer.properties[a.id].locales[i] ??= {}, s.renderer.properties[a.id].locales[i].value = o;
             });
           }
         }) }) : null
       }, a.id) }, i)) }, a.id)) })
     ] }) }) }),
-    /* @__PURE__ */ r(Ae, { children: /* @__PURE__ */ r(E, { onClick: (a) => o.onClose?.(a, "escapeKeyDown"), children: l("close") }) })
+    /* @__PURE__ */ r(De, { children: /* @__PURE__ */ r(A, { onClick: (a) => n.onClose?.(a, "escapeKeyDown"), children: l("close") }) })
   ] });
 }
-const Oe = (e, t) => (o) => {
+const Ne = (e, t) => (n) => {
   const l = [
-    o.palette.info.main,
-    o.palette.primary.main,
-    o.palette.secondary.main,
-    o.palette.success.main,
-    o.palette.warning.main
-  ], h = Math.min(l.length - 1, e), p = l[h], d = ae(p, 0.5), b = ae(p, 1);
+    n.palette.info.main,
+    n.palette.primary.main,
+    n.palette.secondary.main,
+    n.palette.success.main,
+    n.palette.warning.main
+  ], h = Math.min(l.length - 1, e), p = l[h], c = ae(p, 0.5), g = ae(p, 1);
   return {
     // 保留原有的边框样式
-    borderColor: `${d} !important`,
+    borderColor: `${c} !important`,
     borderLeft: "3px solid !important",
     // 稍粗的左侧边框
-    borderLeftColor: d,
+    borderLeftColor: c,
     // 使用透明度适应深色/浅色模式
-    color: b,
+    color: g,
     ...t
   };
 };
-function dt({ property: e, onChange: t, defaultLocale: o, allComponents: l }) {
-  const { t: h, locale: p } = V(), d = M(null), b = lt(d, e), m = A(() => {
+function bt({ property: e, onChange: t, defaultLocale: n, allComponents: l }) {
+  const { t: h, locale: p } = R(), c = oe(null), g = pt(c, e), m = W(() => {
     if (!(e.type !== "json" && e.type !== "yaml" && e.type !== "array") && e.subProperties)
       try {
-        let c = {};
-        D(Object.values(e.subProperties), "index").filter((i) => i.data.visible !== !1 && i.data.key).forEach(({ data: i }) => {
+        let d = {};
+        T(Object.values(e.subProperties), "index").filter((i) => i.data.visible !== !1 && i.data.key).forEach(({ data: i }) => {
           if (!i.key)
             return;
-          let n = i.locales?.[p]?.defaultValue ?? i.locales?.[o]?.defaultValue;
+          let o = i.locales?.[p]?.defaultValue ?? i.locales?.[n]?.defaultValue;
           if (i.type === "number")
-            n = Number(n);
+            o = Number(o);
           else if (i.type === "boolean")
-            n = n === !0 || n === "true";
-          else if ((i.type === "json" || i.type === "yaml") && typeof n == "string")
+            o = o === !0 || o === "true";
+          else if ((i.type === "json" || i.type === "yaml") && typeof o == "string")
             try {
-              i.type === "json" ? n = JSON.parse(n) : n = pe.parse(n);
+              i.type === "json" ? o = JSON.parse(o) : o = pe.parse(o);
             } catch (f) {
-              console.error("Error parsing nested value", n, f), n = {};
+              console.error("Error parsing nested value", o, f), o = {};
             }
-          c[i.key] = n;
-        }), e.type === "array" && !Array.isArray(c) && (c = K(c) ? [] : [c]);
-        const a = xe(c, e.type);
+          d[i.key] = o;
+        }), e.type === "array" && !Array.isArray(d) && (d = K(d) ? [] : [d]);
+        const a = xe(d, e.type);
         t?.(a);
-      } catch (c) {
-        console.error("Error converting structure to text:", c);
+      } catch (d) {
+        console.error("Error converting structure to text:", d);
       }
-  }, [e, p, o, t]);
+  }, [e, p, n, t]);
   return e.type !== "json" && e.type !== "yaml" && e.type !== "array" ? null : /* @__PURE__ */ v(k, {
     direction: "column",
-    ref: d,
+    ref: c,
     sx: {
       gap: 1.5,
       width: "100%"
     },
     children: [
-      /* @__PURE__ */ r(nr, { sx: { mt: -1 }, children: /* @__PURE__ */ r(T, {
+      /* @__PURE__ */ r(nr, { sx: { mt: -1 }, children: /* @__PURE__ */ r(D, {
         variant: "caption",
         sx: {
           color: "text.secondary"
         },
         children: h("maker.properties.subProperties")
       }) }),
-      e.subProperties && Object.keys(e.subProperties).length > 0 ? /* @__PURE__ */ r($e, {
+      e.subProperties && Object.keys(e.subProperties).length > 0 ? /* @__PURE__ */ r(He, {
         component: k,
         gap: 2,
         list: e.subProperties,
-        renderItem: (c, s, a) => {
-          const i = c.visible !== !1;
-          return /* @__PURE__ */ r(G, {
+        renderItem: (d, s, a) => {
+          const i = d.visible !== !1;
+          return /* @__PURE__ */ r($, {
             elevation: 0,
             className: "property-container",
             sx: {
               p: 1.25,
               borderRadius: 1,
               border: i ? "1px solid" : "1px dashed",
-              "&": Oe(b)
+              "&": Ne(g)
             },
             children: /* @__PURE__ */ r(k, {
               sx: {
                 gap: 2
               },
               children: /* @__PURE__ */ r(Ge, {
-                data: c,
+                data: d,
                 params: a,
                 visible: i,
                 config: {
                   properties: e.subProperties
                 },
                 currentLocale: p,
-                defaultLocale: o,
+                defaultLocale: n,
                 allComponents: l,
-                onUpdateConfig: (n) => {
+                onUpdateConfig: (o) => {
                   try {
                     const f = { properties: e.subProperties || {} };
-                    n(f);
-                    const g = {
+                    o(f);
+                    const y = {
                       ...e,
                       subProperties: f.properties
                     };
-                    t?.(g, { forceUpdateProperty: !0 }), m();
+                    t?.(y, { forceUpdateProperty: !0 }), m();
                   } catch (f) {
                     console.error("Error updating property:", f);
                   }
                 }
               })
             })
-          }, c.id);
+          }, d.id);
         }
-      }) : /* @__PURE__ */ r(q, { style: { fontSize: 12, height: 100 }, children: h("maker.properties.noSubProperties") }),
-      /* @__PURE__ */ r(E, {
+      }) : /* @__PURE__ */ r(Y, { style: { fontSize: 12, height: 100 }, children: h("maker.properties.noSubProperties") }),
+      /* @__PURE__ */ r(A, {
         fullWidth: !0,
         variant: "outlined",
         className: "ignore-style-override",
         size: "small",
-        startIcon: /* @__PURE__ */ r(Be, {}),
+        startIcon: /* @__PURE__ */ r(Le, {}),
         onClick: () => {
           try {
-            const c = e.subProperties || {}, s = _e(), i = {
-              index: Object.values(c).length,
+            const d = e.subProperties || {}, s = _e(), i = {
+              index: Object.values(d).length,
               data: {
                 id: s,
                 key: "",
@@ -1852,20 +1849,20 @@ function dt({ property: e, onChange: t, defaultLocale: o, allComponents: l }) {
                 // 为嵌套属性预初始化
                 subProperties: {}
               }
-            }, n = {
+            }, o = {
               ...e,
               subProperties: {
-                ...c,
+                ...d,
                 [s]: i
               }
             };
-            t?.(n, { forceUpdateProperty: !0 }), m();
-          } catch (c) {
-            console.error("Error adding property:", c);
+            t?.(o, { forceUpdateProperty: !0 }), m();
+          } catch (d) {
+            console.error("Error adding property:", d);
           }
         },
         sx: {
-          "&": Oe(b, {
+          "&": Ne(g, {
             // borderLeft: undefined,
           })
         },
@@ -1874,31 +1871,31 @@ function dt({ property: e, onChange: t, defaultLocale: o, allComponents: l }) {
     ]
   });
 }
-function L({ component: e, property: t, value: o, onChange: l, valueImmutable: h, defaultLocale: p, allComponents: d, ...b }) {
-  const { locale: m } = V(), c = hr(), s = M(null), a = () => {
-    const n = c?.current?.getUploader();
-    n?.open(), s.current && n.onceUploadSuccess(({ response: f }) => {
-      let g = f?.data?.filename || "";
-      g && (g = `mediakit://${g}`, o && !o.includes("mediakit://") && (g += " # please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address")), s.current?.(g);
+function L({ component: e, property: t, value: n, onChange: l, valueImmutable: h, defaultLocale: p, allComponents: c, ...g }) {
+  const { locale: m } = R(), d = mr(), s = oe(null), a = () => {
+    const o = d?.current?.getUploader();
+    o?.open(), s.current && o.onceUploadSuccess(({ response: f }) => {
+      let y = f?.data?.filename || "";
+      y && (y = `mediakit://${y}`, n && !n.includes("mediakit://") && (y += " # please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address")), s.current?.(y);
     });
-  }, i = b.label ?? (t.locales?.[m]?.name || t.locales?.[p]?.name || t.key || t.id);
+  }, i = g.label ?? (t.locales?.[m]?.name || t.locales?.[p]?.name || t.key || t.id);
   if (t.type === "number")
-    return /* @__PURE__ */ r(ut, {
-      ...b,
+    return /* @__PURE__ */ r(gt, {
+      ...g,
       label: i,
       NumberProps: {
-        value: ["number", "string"].includes(typeof o) ? o : null,
-        onChange: (n, f) => l?.(f)
+        value: ["number", "string"].includes(typeof n) ? n : null,
+        onChange: (o, f) => l?.(f)
       }
     });
   if (t.type === "decimal")
-    return /* @__PURE__ */ r(z, {
-      ...b,
+    return /* @__PURE__ */ r(V, {
+      ...g,
       label: i,
       type: "text",
-      value: o ?? "",
-      onChange: (n) => {
-        const f = n.target.value;
+      value: n ?? "",
+      onChange: (o) => {
+        const f = o.target.value;
         if (f === "" || f === "-") {
           l?.(f);
           return;
@@ -1913,49 +1910,49 @@ function L({ component: e, property: t, value: o, onChange: l, valueImmutable: h
     return /* @__PURE__ */ r(ge, {
       label: i,
       labelPlacement: "start",
-      control: /* @__PURE__ */ r(Ve, { checked: o === !0, onChange: (n, f) => l?.(f) })
+      control: /* @__PURE__ */ r(Re, { checked: n === !0, onChange: (o, f) => l?.(f) })
     });
   if (t.type === "color")
-    return /* @__PURE__ */ r(Gr, {
+    return /* @__PURE__ */ r(et, {
       label: i,
-      value: o,
-      onChange: (n) => {
-        l?.(n);
+      value: n,
+      onChange: (o) => {
+        l?.(o);
       }
     });
   if (t.type === "json" || t.type === "yaml")
-    return /* @__PURE__ */ r(Yr, {
+    return /* @__PURE__ */ r(rt, {
       label: i,
-      value: o,
-      onChange: (n) => {
-        l?.(n);
+      value: n,
+      onChange: (o) => {
+        l?.(o);
       },
       property: t,
       component: e,
       defaultLocale: p,
-      allComponents: d,
+      allComponents: c,
       PropertyValueField: L,
-      onUpload: (n) => {
-        s.current = n, a();
+      onUpload: (o) => {
+        s.current = o, a();
       }
     });
   if (t.type === "custom") {
-    const n = d[t.componentId]?.data;
-    return n ? /* @__PURE__ */ r(P, {
+    const o = c[t.componentId]?.data;
+    return o ? /* @__PURE__ */ r(P, {
       sx: {
         width: "100%"
       },
-      children: /* @__PURE__ */ r(Ue, {
-        componentId: n.id,
-        props: { label: i, value: o, onChange: l },
+      children: /* @__PURE__ */ r(Ke, {
+        componentId: o.id,
+        props: { label: i, value: n, onChange: l },
         locale: m,
         dev: {
           mode: "draft",
-          components: d,
+          components: c,
           defaultLocale: p
         }
       })
-    }) : /* @__PURE__ */ r(z, { ...b, label: i, disabled: !0, placeholder: "Click right button select a component" });
+    }) : /* @__PURE__ */ r(V, { ...g, label: i, disabled: !0, placeholder: "Click right button select a component" });
   }
   if (t.type === "component")
     return /* @__PURE__ */ v(k, {
@@ -1965,41 +1962,41 @@ function L({ component: e, property: t, value: o, onChange: l, valueImmutable: h
         gap: 1
       },
       children: [
-        /* @__PURE__ */ r(Ie, {
-          allComponents: d,
+        /* @__PURE__ */ r(Se, {
+          allComponents: c,
           label: i,
-          value: o?.componentId,
-          onChange: (n, f) => {
-            h || !o ? l?.({ ...o && JSON.parse(JSON.stringify(o)), componentId: f }) : typeof o == "object" && (o.componentId = f, l?.({ ...o && JSON.parse(JSON.stringify(o)), componentId: f }));
+          value: n?.componentId,
+          onChange: (o, f) => {
+            h || !n ? l?.({ ...n && JSON.parse(JSON.stringify(n)), componentId: f }) : typeof n == "object" && (n.componentId = f, l?.({ ...n && JSON.parse(JSON.stringify(n)), componentId: f }));
           }
         }),
-        o?.componentId && /* @__PURE__ */ r(ct, {
-          value: o,
+        n?.componentId && /* @__PURE__ */ r(ft, {
+          value: n,
           valueImmutable: h,
           onChange: l,
           defaultLocale: p,
-          allComponents: d
+          allComponents: c
         })
       ]
     });
   if (!t.type || ["string", "url", "multiline"].includes(t.type)) {
-    let n = t.type === "string" ? t.multiline : void 0;
-    t.type === "multiline" && (n = !0);
-    const f = t.type === "url" ? o?.url : o;
-    return /* @__PURE__ */ r(z, {
-      ...b,
+    let o = t.type === "string" ? t.multiline : void 0;
+    t.type === "multiline" && (o = !0);
+    const f = t.type === "url" ? n?.url : n;
+    return /* @__PURE__ */ r(V, {
+      ...g,
       label: i,
       value: typeof f == "string" ? f : "",
-      multiline: n,
-      minRows: n ? 2 : void 0,
-      maxRows: n ? 10 : void 0,
-      onChange: (g) => l?.(t.type === "url" ? { ...o, url: g.target.value, mediaKitUrl: g.target.value } : g.target.value),
+      multiline: o,
+      minRows: o ? 2 : void 0,
+      maxRows: o ? 10 : void 0,
+      onChange: (y) => l?.(t.type === "url" ? { ...n, url: y.target.value, mediaKitUrl: y.target.value } : y.target.value),
       slotProps: {
         input: t.type === "url" ? {
           sx: {
             pr: 0
           },
-          endAdornment: /* @__PURE__ */ v($, {
+          endAdornment: /* @__PURE__ */ v(_, {
             position: "end",
             sx: {
               display: "flex",
@@ -2008,63 +2005,63 @@ function L({ component: e, property: t, value: o, onChange: l, valueImmutable: h
             },
             children: [
               /* @__PURE__ */ r(Pe, {
-                onChange: async ({ response: g }) => {
-                  const u = g?.data?.url || g?.data?.fileUrl;
-                  let x;
-                  u && (x = await de(u).catch(() => ue(u)).catch(() => {
+                onChange: async ({ response: y }) => {
+                  const u = y?.data?.url || y?.data?.fileUrl;
+                  let C;
+                  u && (C = await de(u).catch(() => ue(u)).catch(() => {
                   }));
-                  let I = g?.data?.filename || "";
-                  I && (I = `mediakit://${I}`), l?.({
+                  let w = y?.data?.filename || "";
+                  w && (w = `mediakit://${w}`), l?.({
                     url: u,
-                    mediaKitUrl: I,
-                    width: x?.naturalWidth,
-                    height: x?.naturalHeight
+                    mediaKitUrl: w,
+                    width: C?.naturalWidth,
+                    height: C?.naturalHeight
                   });
                 }
               }),
-              /* @__PURE__ */ r(_, { title: "If you are using the 'mediaKitUrl' property, please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address.", children: /* @__PURE__ */ r(Me, { sx: { cursor: "default", mr: 1 }, fontSize: "small" }) })
+              /* @__PURE__ */ r(J, { title: "If you are using the 'mediaKitUrl' property, please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address.", children: /* @__PURE__ */ r(Me, { sx: { cursor: "default", mr: 1 }, fontSize: "small" }) })
             ]
           })
         } : void 0
       }
     });
   }
-  return t.type === "array" ? /* @__PURE__ */ r($r, {
+  return t.type === "array" ? /* @__PURE__ */ r(Xr, {
     label: i,
-    value: Array.isArray(o) ? o : [],
-    onChange: (n) => l?.(n),
+    value: Array.isArray(n) ? n : [],
+    onChange: (o) => l?.(o),
     property: t,
-    renderItem: ({ item: n, index: f, onChange: g }) => t.subProperties && Object.keys(t.subProperties).length > 0 ? /* @__PURE__ */ r(k, {
+    renderItem: ({ item: o, index: f, onChange: y }) => t.subProperties && Object.keys(t.subProperties).length > 0 ? /* @__PURE__ */ r(k, {
       sx: {
         gap: 1,
         width: "100%"
       },
-      children: D(Object.values(t.subProperties), "index").filter((u) => u.data.visible !== !1).map(({ data: u }) => u.key ? /* @__PURE__ */ r(L, {
+      children: T(Object.values(t.subProperties), "index").filter((u) => u.data.visible !== !1).map(({ data: u }) => u.key ? /* @__PURE__ */ r(L, {
         component: e,
         property: u,
-        value: n[u.key],
-        onChange: (x) => {
-          const I = { ...n, [u.key]: x };
-          g(I);
+        value: o[u.key],
+        onChange: (C) => {
+          const w = { ...o, [u.key]: C };
+          y(w);
         },
         size: "small",
         fullWidth: !0,
         defaultLocale: p,
-        allComponents: d
+        allComponents: c
       }, u.id) : null)
-    }, f) : /* @__PURE__ */ r(z, { size: b.size, fullWidth: !0, value: n, onChange: (u) => g(u.target.value) })
+    }, f) : /* @__PURE__ */ r(V, { size: g.size, fullWidth: !0, value: o, onChange: (u) => y(u.target.value) })
   }) : (console.error("Unsupported property type", t.type), null);
 }
-function ut({ NumberProps: e, ...t }) {
-  const { getInputProps: o } = xr(e), l = o();
-  return /* @__PURE__ */ r(z, {
+function gt({ NumberProps: e, ...t }) {
+  const { getInputProps: n } = yr(e), l = n();
+  return /* @__PURE__ */ r(V, {
     ...t,
     slotProps: {
       htmlInput: l
     }
   });
 }
-const pt = `import React from '@blocklet/pages-kit/builtin/react'
+const yt = `import React from '@blocklet/pages-kit/builtin/react'
 import { Box } from '@blocklet/pages-kit/builtin/mui/material'
 
 export default function () {
@@ -2073,14 +2070,14 @@ export default function () {
       Hello World
     </Box>
   )
-}`, mt = `console.log('hello')
+}`, xt = `console.log('hello')
 `;
-function ht({ value: e }) {
-  const { locale: t } = V(), o = De(), l = Q(e).doc;
-  return U(() => {
+function vt({ value: e }) {
+  const { locale: t } = R(), n = We(), l = q(e).doc;
+  return B(() => {
     e.renderer?.script || (l.transact(() => {
-      e.renderer.script = e.renderer.type === "react-component" ? pt : mt;
-    }), o());
+      e.renderer.script = e.renderer.type === "react-component" ? yt : xt;
+    }), n());
   }, [e]), /* @__PURE__ */ r(P, { sx: { border: 1, borderColor: "divider", borderRadius: 1, overflow: "hidden" }, children: /* @__PURE__ */ r(Ce, {
     keyId: e.id,
     locale: t,
@@ -2093,20 +2090,20 @@ function ht({ value: e }) {
     }
   }, e.id) });
 }
-function ft({ value: e }) {
-  const { t } = V(), o = Q(e).doc, { state: { components: l, config: { defaultLocale: h }, resources: p }, localState: { currentLocale: d } } = oe(), b = ve(), m = l[e.renderer.componentId]?.data ?? p.components?.[e.renderer.componentId]?.component, c = ke({ variant: "dialog" });
+function Ct({ value: e }) {
+  const { t } = R(), n = q(e).doc, { state: { components: l, config: { defaultLocale: h }, resources: p }, localState: { currentLocale: c } } = ie(), g = ve(), m = l[e.renderer.componentId]?.data ?? p.components?.[e.renderer.componentId]?.component, d = ke({ variant: "dialog" });
   return /* @__PURE__ */ r(le, { children: /* @__PURE__ */ v(k, {
     sx: {
       gap: 1
     },
     children: [
-      /* @__PURE__ */ r(Ie, {
-        allComponents: b,
+      /* @__PURE__ */ r(Se, {
+        allComponents: g,
         excludes: [e.id],
         value: e.renderer.componentId,
         onChange: (s, a) => e.renderer.componentId = a
       }),
-      m && /* @__PURE__ */ v(F, { children: [
+      m && /* @__PURE__ */ v(M, { children: [
         /* @__PURE__ */ v(k, {
           direction: "row",
           sx: {
@@ -2114,42 +2111,42 @@ function ft({ value: e }) {
             alignItems: "center"
           },
           children: [
-            /* @__PURE__ */ r(T, { variant: "subtitle2", children: t("parameters") }),
-            /* @__PURE__ */ r(E, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...we(c), children: /* @__PURE__ */ r(Ke, { fontSize: "small" }) })
+            /* @__PURE__ */ r(D, { variant: "subtitle2", children: t("parameters") }),
+            /* @__PURE__ */ r(A, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...we(d), children: /* @__PURE__ */ r(Be, { fontSize: "small" }) })
           ]
         }),
-        m.properties && D(Object.values(m.properties), "index").map(({ data: s }) => /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(L, {
-          allComponents: b,
+        m.properties && T(Object.values(m.properties), "index").map(({ data: s }) => /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(L, {
+          allComponents: g,
           defaultLocale: h,
           component: m,
           property: s,
           fullWidth: !0,
           size: "small",
-          valueImmutable: ie(e.renderer.properties?.[s.id]?.locales?.[d]?.value),
-          value: e.renderer.properties?.[s.id]?.locales?.[d]?.value ?? e.renderer.properties?.[s.id]?.locales?.[h]?.value ?? s.locales?.[d]?.defaultValue ?? s.locales?.[h]?.defaultValue,
+          valueImmutable: ne(e.renderer.properties?.[s.id]?.locales?.[c]?.value),
+          value: e.renderer.properties?.[s.id]?.locales?.[c]?.value ?? e.renderer.properties?.[s.id]?.locales?.[h]?.value ?? s.locales?.[c]?.defaultValue ?? s.locales?.[h]?.defaultValue,
           onChange: (a) => {
-            o.transact(() => {
-              e.renderer.properties ??= {}, e.renderer.properties[s.id] ??= {}, e.renderer.properties[s.id].locales ??= {}, e.renderer.properties[s.id].locales[d] ??= {}, e.renderer.properties[s.id].locales[d].value = a;
+            n.transact(() => {
+              e.renderer.properties ??= {}, e.renderer.properties[s.id] ??= {}, e.renderer.properties[s.id].locales ??= {}, e.renderer.properties[s.id].locales[c] ??= {}, e.renderer.properties[s.id].locales[c].value = a;
             });
           }
         }) }, s.id)),
-        /* @__PURE__ */ r(Ye, { ...Fe(c), component: e, type: "parameters" })
+        /* @__PURE__ */ r(Ye, { ...Je(d), component: e, type: "parameters" })
       ] })
     ]
   }) });
 }
-function Ie({ label: e, options: t, excludes: o, value: l, onChange: h, allComponents: p, ...d }) {
-  const { t: b } = V(), m = t ?? D(Object.values(Tr(p, ...o ?? [])), "index").map((s) => s.data), c = (typeof l == "string" ? p[l]?.data : void 0) ?? null;
+function Se({ label: e, options: t, excludes: n, value: l, onChange: h, allComponents: p, ...c }) {
+  const { t: g } = R(), m = t ?? T(Object.values(Er(p, ...n ?? [])), "index").map((s) => s.data), d = (typeof l == "string" ? p[l]?.data : void 0) ?? null;
   return /* @__PURE__ */ r(Te, {
-    ...d,
+    ...c,
     size: "small",
     options: m,
     autoHighlight: !0,
     isOptionEqualToValue: (s, a) => s.id === a.id,
     getOptionKey: (s) => s.id,
     getOptionLabel: (s) => s.name || s.id,
-    renderInput: (s) => /* @__PURE__ */ r(z, { label: e || b("component"), ...s }),
-    value: c,
+    renderInput: (s) => /* @__PURE__ */ r(V, { label: e || g("component"), ...s }),
+    value: d,
     onChange: (s, a) => {
       let i = {};
       a && (i = {
@@ -2160,64 +2157,64 @@ function Ie({ label: e, options: t, excludes: o, value: l, onChange: h, allCompo
     }
   });
 }
-function qe({ config: e, allComponents: t, defaultLocale: o, propertiesValue: l, currentLocale: h, onChange: p, props: d }) {
-  const { t: b } = V(), [m, c] = B(me(e?.properties)), [s, a] = B(null);
-  U(() => {
+function qe({ config: e, allComponents: t, defaultLocale: n, propertiesValue: l, currentLocale: h, onChange: p, props: c }) {
+  const { t: g } = R(), [m, d] = U(me(e?.properties)), [s, a] = U(null);
+  B(() => {
     (() => {
-      e?.renderer?.type === "react-component" && K(e?.properties) ? br(e?.renderer?.script).then((x) => {
-        const I = gr(x);
-        c(I);
-      }) : c(me(e?.properties));
+      e?.renderer?.type === "react-component" && K(e?.properties) ? fr(e?.renderer?.script).then((C) => {
+        const w = br(C);
+        d(w);
+      }) : d(me(e?.properties));
     })();
   }, [JSON.stringify(e)]);
-  const i = A(() => !e || !m ? {} : Object.values(m).reduce((u, { data: x }) => {
-    const I = x.key || x.id;
-    return u[x.id] = {
-      key: I,
-      value: d?.[I] ?? l?.[x.id]?.value ?? x.locales?.[h]?.defaultValue ?? x.locales?.[o]?.defaultValue,
-      id: x.id,
-      type: x.type
+  const i = W(() => !e || !m ? {} : Object.values(m).reduce((u, { data: C }) => {
+    const w = C.key || C.id;
+    return u[C.id] = {
+      key: w,
+      value: c?.[w] ?? l?.[C.id]?.value ?? C.locales?.[h]?.defaultValue ?? C.locales?.[n]?.defaultValue,
+      id: C.id,
+      type: C.type
     }, u;
-  }, {}), [JSON.stringify(m), e, l, h, o]), n = H(() => {
+  }, {}), [JSON.stringify(m), e, l, h, n]), o = H(() => {
     if (!m)
       return {
         canUseProperties: [],
         visibleProperties: [],
         canUsePropertiesKeys: []
       };
-    const u = D(Object.values(m), "index"), x = u.filter(({ data: S }) => S.key && be(m, S.id)), I = u.filter(({ data: S }) => S.key && S.type !== "component"), N = I.map(({ data: S }) => S.key);
+    const u = T(Object.values(m), "index"), C = u.filter(({ data: S }) => S.key && be(m, S.id)), w = u.filter(({ data: S }) => S.key && S.type !== "component"), N = w.map(({ data: S }) => S.key);
     return {
-      canUseProperties: I,
-      visibleProperties: x,
+      canUseProperties: w,
+      visibleProperties: C,
       canUsePropertiesKeys: N
     };
-  }, [JSON.stringify(m)]), f = i(), g = Ar(f, "key");
+  }, [JSON.stringify(m)]), f = i(), y = Rr(f, "key");
   return /* @__PURE__ */ r(le, { children: /* @__PURE__ */ v(k, {
     sx: {
       gap: 2
     },
     children: [
-      /* @__PURE__ */ r(T, { variant: "subtitle1", children: b("maker.properties.parameters") }),
-      !e || n.canUsePropertiesKeys.length === 0 ? /* @__PURE__ */ r(q, { style: { fontSize: 12 }, children: b("maker.properties.noParameters") }) : /* @__PURE__ */ v(F, { children: [
+      /* @__PURE__ */ r(D, { variant: "subtitle1", children: g("maker.properties.parameters") }),
+      !e || o.canUsePropertiesKeys.length === 0 ? /* @__PURE__ */ r(Y, { style: { fontSize: 12 }, children: g("maker.properties.noParameters") }) : /* @__PURE__ */ v(M, { children: [
         /* @__PURE__ */ r(k, {
           sx: {
             gap: 2
           },
-          children: n.visibleProperties.map(({ data: u }) => /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(L, {
+          children: o.visibleProperties.map(({ data: u }) => /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(L, {
             allComponents: t,
-            defaultLocale: o,
+            defaultLocale: n,
             size: "small",
             fullWidth: !0,
             component: e,
             property: u,
-            valueImmutable: ie(l?.[u.id]?.value),
-            value: d?.[u.key || u.id] ?? f[u.id]?.value,
-            onChange: (x) => {
+            valueImmutable: ne(l?.[u.id]?.value),
+            value: c?.[u.key || u.id] ?? f[u.id]?.value,
+            onChange: (C) => {
               p({
                 path: ["properties", u.id],
                 id: u.id,
-                value: { value: x },
-                shouldSync: Se(u),
+                value: { value: C },
+                shouldSync: Oe(u),
                 excludeKeys: [],
                 key: u.key || u.id
               });
@@ -2229,37 +2226,37 @@ function qe({ config: e, allComponents: t, defaultLocale: o, propertiesValue: l,
             gap: 2,
             width: "100%"
           },
-          children: /* @__PURE__ */ r(Ue, {
+          children: /* @__PURE__ */ r(Ke, {
             componentId: e?.id || "",
             renderType: "setting",
             locale: h,
             properties: f,
-            dev: { mode: "draft", components: t, defaultLocale: o },
+            dev: { mode: "draft", components: t, defaultLocale: n },
             props: {
-              ...Dr(d ?? {}, n.canUsePropertiesKeys),
+              ...Ar(c ?? {}, o.canUsePropertiesKeys),
               onChange: (u) => {
-                const { canUsePropertiesKeys: x } = n;
-                Object.keys(u).filter((N) => !Rr(u[N], g?.[N]?.value)).filter((N) => !(N === "locale" && !Vr(g[N], "locale") || g[N]?.type === "component" || (g[N]?.type === "yaml" || g[N]?.type === "json") && be(m, g[N]?.id))).reduce((N, S) => N.then(() => {
-                  const w = g[S], j = x.includes(S);
-                  if (w?.id && j)
+                const { canUsePropertiesKeys: C } = o;
+                Object.keys(u).filter((N) => !zr(u[N], y?.[N]?.value)).filter((N) => !(N === "locale" && !jr(y[N], "locale") || y[N]?.type === "component" || (y[N]?.type === "yaml" || y[N]?.type === "json") && be(m, y[N]?.id))).reduce((N, S) => N.then(() => {
+                  const I = y[S], j = C.includes(S);
+                  if (I?.id && j)
                     return p({
-                      path: ["properties", w.id],
-                      id: w.id,
+                      path: ["properties", I.id],
+                      id: I.id,
                       value: { value: u[S] },
-                      shouldSync: Se(w),
+                      shouldSync: Oe(I),
                       excludeKeys: [],
-                      key: w.key || w.id
+                      key: I.key || I.id
                     }), Promise.resolve();
-                  const y = `propertyNotFound${S}`;
-                  if (s === y)
+                  const b = `propertyNotFound${S}`;
+                  if (s === b)
                     return Promise.resolve();
                   he.close(s);
-                  const C = he.warning(b("maker.properties.propertyNotFound", {
+                  const x = he.warning(g("maker.properties.propertyNotFound", {
                     key: S
                   }), {
-                    key: y
+                    key: b
                   });
-                  return a(C), Promise.resolve();
+                  return a(x), Promise.resolve();
                 }), Promise.resolve());
               }
             }
@@ -2269,31 +2266,31 @@ function qe({ config: e, allComponents: t, defaultLocale: o, propertiesValue: l,
     ]
   }) });
 }
-function bt({ config: e }) {
-  const { t, locale: o } = V(), [l, h] = B(!1), p = (d) => {
-    e.llmConfig = d;
+function Pt({ config: e }) {
+  const { t, locale: n } = R(), [l, h] = U(!1), p = (c) => {
+    e.llmConfig = c;
   };
-  return /* @__PURE__ */ v(F, { children: [
-    /* @__PURE__ */ r(_, { title: t("maker.properties.configLLMDescription"), children: /* @__PURE__ */ r(Y, { color: "primary", onClick: () => h(!0), size: "small", children: /* @__PURE__ */ r(Ir, {}) }) }),
-    l && /* @__PURE__ */ r(rt, {
+  return /* @__PURE__ */ v(M, { children: [
+    /* @__PURE__ */ r(J, { title: t("maker.properties.configLLMDescription"), children: /* @__PURE__ */ r(G, { color: "primary", onClick: () => h(!0), size: "small", children: /* @__PURE__ */ r(wr, {}) }) }),
+    l && /* @__PURE__ */ r(st, {
       open: l,
       onClose: () => h(!1),
       onConfirm: p,
       component: e,
       initialConfig: e.llmConfig,
-      locale: o,
+      locale: n,
       defaultLocale: "en",
       title: t("maker.properties.llmConfigTitle")
     })
   ] });
 }
 export {
-  ot as BasicInfo,
-  Ie as CustomComponentAutocomplete,
-  on as CustomComponentSettings,
-  pt as DefaultReactComponentScriptTemplate,
-  mt as DefaultWebComponentScriptTemplate,
+  ut as BasicInfo,
+  Se as CustomComponentAutocomplete,
+  pn as CustomComponentSettings,
+  yt as DefaultReactComponentScriptTemplate,
+  xt as DefaultWebComponentScriptTemplate,
   qe as ParametersConfig,
-  st as PropertiesConfig,
+  mt as PropertiesConfig,
   L as PropertyValueField
 };