@blocklet/pages-kit-inner-components 0.4.98 → 0.4.100

package/lib/es/setting.js

@@ -1,145 +1,142 @@
-import { jsx as t, jsxs as S, Fragment as H } from "react/jsx-runtime";
-import { t as ge, g as oe, i as Fe, b as Je, h as de, E as yt, n as Me, j as xe } from "./chunks/state-JDvNqLu1.js";
-import Z from "@arcblock/ux/lib/Empty";
-import { useLocaleContext as D } from "@arcblock/ux/lib/Locale/context";
-import { CodeEditor as we } from "@blocklet/code-editor";
-import vt from "@mui/icons-material/AddRounded";
-import gt from "@mui/icons-material/ArrowDownward";
-import xt from "@mui/icons-material/ArrowUpward";
-import wt from "@mui/icons-material/DeleteOutline";
-import { Typography as F, TextField as C, Stack as j, FormLabel as le, Box as R, TableContainer as kt, Paper as ee, Table as He, TableHead as Ye, TableRow as ne, TableCell as se, TableBody as Ge, Button as T, IconButton as ue, FormControlLabel as Le, Switch as qe, InputAdornment as pe, Dialog as ke, DialogTitle as Qe, DialogContent as Xe, DialogActions as Ze, alpha as Pt, Tooltip as X, buttonClasses as It, Autocomplete as et, MenuItem as me, Collapse as St, Divider as Ot, Popper as Rt } from "@mui/material";
-import V from "lodash/sortBy";
-import { useCallback as A, useMemo as ce, forwardRef as tt, useState as J, useEffect as M, useImperativeHandle as rt, lazy as jt, Suspense as zt, useRef as $, useId as Nt } from "react";
-import { useUpdate as it, useDebounce as Ct } from "react-use";
-import { styled as Dt } from "@arcblock/ux/lib/Theme";
-import { cx as At } from "@emotion/css";
-import { useReactive as Tt, useBoolean as Vt, useUpdate as Et } from "ahooks";
-import We from "gradient-parser";
-import "lodash/without";
-import Ut from "tinycolor2";
-import { red as Wt, pink as Bt, purple as Kt, indigo as $t, blue as _t, cyan as Ft, teal as Jt, green as Mt, lime as Ht, yellow as Yt, amber as Gt, orange as Lt, brown as qt, grey as Qt, blueGrey as Xt } from "@mui/material/colors";
-import { getImageSize as fe, getVideoSize as he, UploaderButton as Pe, UploaderProvider as Ie, useUploader as Zt } from "./uploader.js";
-import { Icon as er } from "@iconify-icon/react";
-import ot from "lodash/isEmpty";
-import lt from "lodash/set";
-import * as be from "yaml";
-import tr from "lodash/cloneDeep";
-import Be from "@arcblock/ux/lib/Toast";
-import { CustomComponentRenderer as nt, transpileAndLoadScript as rr, getPropertiesFromCode as ir } from "@blocklet/pages-kit/components";
-import { unstable_useNumberInput as or, ClickAwayListener as lr } from "@mui/base";
-import { VisibilityOffRounded as nr, VisibilityRounded as sr, DeleteOutlineRounded as cr, DragIndicatorRounded as ar, TranslateRounded as st, AddRounded as ct, InfoRounded as at, StarRounded as dr, SettingsRounded as dt } from "@mui/icons-material";
-import { alpha as Ke } from "@mui/material/styles";
-import { getYjsValue as te } from "@syncedstore/core";
-import ur from "lodash/assign";
-import pr from "lodash/has";
-import ae from "lodash/isNil";
-import mr from "lodash/isObject";
-import fr from "lodash/keyBy";
-import hr from "lodash/omit";
-import br from "lodash/pick";
-import yr from "lodash/reduce";
-import { usePopupState as Se, bindTrigger as Oe, bindDialog as ut, bindPopper as vr } from "material-ui-popup-state/hooks";
-import { ErrorBoundary as gr } from "react-error-boundary";
-import { useDrop as pt, useDrag as xr } from "react-dnd";
-function wr({
+import { jsx as t, jsxs as O, Fragment as X } from "react/jsx-runtime";
+import { t as be, b as Ee, d as ce, E as ot, n as We, e as ye } from "./chunks/state-DsXKwImw.js";
+import de from "@arcblock/ux/lib/Empty";
+import { useLocaleContext as C } from "@arcblock/ux/lib/Locale/context";
+import { CodeEditor as ve } from "@blocklet/code-editor";
+import nt from "@mui/icons-material/AddRounded";
+import st from "@mui/icons-material/ArrowDownward";
+import ct from "@mui/icons-material/ArrowUpward";
+import dt from "@mui/icons-material/DeleteOutline";
+import { Typography as M, TextField as V, Stack as R, FormLabel as ie, Box as j, TableContainer as at, Paper as Z, Table as Ke, TableHead as Be, TableRow as le, TableCell as oe, TableBody as Fe, Button as E, IconButton as ae, InputAdornment as xe, alpha as ut, Tooltip as G, buttonClasses as pt, Dialog as Je, Autocomplete as Me, FormControlLabel as mt, Switch as ft, MenuItem as ue, DialogTitle as ht, DialogContent as bt, DialogActions as yt, Collapse as vt, Divider as xt, Popper as gt } from "@mui/material";
+import A from "lodash/sortBy";
+import { useCallback as D, useMemo as ne, useRef as F, useId as Pt, useEffect as $, useState as Q } from "react";
+import { useUpdate as $e } from "react-use";
+import { C as wt, a as kt, b as It } from "./chunks/config-color-B-ax03qd.js";
+import _e from "lodash/isEmpty";
+import He from "lodash/set";
+import * as pe from "yaml";
+import { UploaderButton as Ye, UploaderProvider as ge, useUploader as St, getImageSize as Ot, getVideoSize as jt } from "./uploader.js";
+import Rt from "lodash/cloneDeep";
+import me from "@arcblock/ux/lib/Toast";
+import { CustomComponentRenderer as Le, transpileAndLoadScript as zt, getPropertiesFromCode as Nt } from "@blocklet/pages-kit/components";
+import { parsePropertyValue as Vt } from "@blocklet/pages-kit/utils/property";
+import { unstable_useNumberInput as Ct, ClickAwayListener as Dt } from "@mui/base";
+import { VisibilityOffRounded as Et, VisibilityRounded as At, DeleteOutlineRounded as Tt, DragIndicatorRounded as Ut, TranslateRounded as qe, AddRounded as Ge, InfoRounded as Qe, StarRounded as Wt, SettingsRounded as Xe } from "@mui/icons-material";
+import { alpha as Ae } from "@mui/material/styles";
+import { getYjsValue as ee } from "@syncedstore/core";
+import { useUpdate as Kt, useReactive as Bt } from "ahooks";
+import Ft from "lodash/assign";
+import Jt from "lodash/get";
+import Mt from "lodash/has";
+import se from "lodash/isNil";
+import $t from "lodash/isObject";
+import _t from "lodash/keyBy";
+import Ht from "lodash/omit";
+import Yt from "lodash/pick";
+import Lt from "lodash/reduce";
+import { usePopupState as Pe, bindTrigger as we, bindDialog as Ze, bindPopper as qt } from "material-ui-popup-state/hooks";
+import { ErrorBoundary as Gt } from "react-error-boundary";
+import { cx as Qt } from "@emotion/css";
+import { useDrop as et, useDrag as Xt } from "react-dnd";
+function Zt({
   onClick: e,
   disabled: r,
-  sx: o,
-  ...i
+  sx: i,
+  ...l
 }) {
-  return /* @__PURE__ */ t(ue, { size: "small", color: "warning", variant: "outlined", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(wt, { fontSize: "small" }) });
+  return /* @__PURE__ */ t(ae, { size: "small", color: "warning", variant: "outlined", disabled: r, onClick: e, ...l, children: /* @__PURE__ */ t(dt, { fontSize: "small" }) });
 }
-function kr({
+function er({
   onClick: e,
   disabled: r,
-  sx: o,
-  ...i
+  sx: i,
+  ...l
 }) {
-  return /* @__PURE__ */ t(ue, { size: "small", color: "primary", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(xt, { fontSize: "small" }) });
+  return /* @__PURE__ */ t(ae, { size: "small", color: "primary", disabled: r, onClick: e, ...l, children: /* @__PURE__ */ t(ct, { fontSize: "small" }) });
 }
-function Pr({
+function tr({
   onClick: e,
   disabled: r,
-  sx: o,
-  ...i
+  sx: i,
+  ...l
 }) {
-  return /* @__PURE__ */ t(ue, { size: "small", color: "primary", disabled: r, onClick: e, ...i, children: /* @__PURE__ */ t(gt, { fontSize: "small" }) });
+  return /* @__PURE__ */ t(ae, { size: "small", color: "primary", disabled: r, onClick: e, ...l, children: /* @__PURE__ */ t(st, { fontSize: "small" }) });
 }
-function Ir({
+function rr({
   label: e,
   value: r,
-  onChange: o,
-  disabled: i = !1,
+  onChange: i,
+  disabled: l = !1,
   itemLabel: u = "",
-  emptyHeight: m = 40,
+  emptyHeight: b = 40,
   property: a,
-  renderItem: b,
+  renderItem: x,
   ...g
 }) {
-  const { t: f, locale: w } = D(), p = it(), l = A(
-    (h) => {
-      o(ge(h, a.type));
+  const { t: y, locale: k } = C(), v = $e(), o = D(
+    (p) => {
+      i(be(p, a.type));
     },
-    [o, a.type]
-  ), s = ce(() => Array.isArray(r) ? r : [], [r]), n = A(() => {
-    const h = [...s, ""];
-    l(h), p();
-  }, [s, l, p]), d = A(() => {
+    [i, a.type]
+  ), n = ne(() => Array.isArray(r) ? r : [], [r]), c = D(() => {
+    const p = [...n, ""];
+    o(p), v();
+  }, [n, o, v]), d = D(() => {
     if (!a || !a.subProperties)
-      return n();
-    const h = {};
-    V(Object.values(a.subProperties), "index").forEach(({ data: N }) => {
+      return c();
+    const p = {};
+    A(Object.values(a.subProperties), "index").forEach(({ data: N }) => {
       var U, W;
       if (!N.key) return;
-      const E = ((W = (U = N.locales) == null ? void 0 : U[w]) == null ? void 0 : W.defaultValue) ?? "";
-      h[N.key] = E;
+      const T = ((W = (U = N.locales) == null ? void 0 : U[k]) == null ? void 0 : W.defaultValue) ?? "";
+      p[N.key] = T;
     });
-    const z = [...s, h];
-    l(z), p();
-  }, [s, l, p, a, w, n]), y = A(
-    (h) => {
+    const z = [...n, p];
+    o(z), v();
+  }, [n, o, v, a, k, c]), m = D(
+    (p) => {
       try {
-        const I = JSON.parse(h);
-        Array.isArray(I) ? l(I) : console.error("JSON解析结果不是数组");
+        const I = JSON.parse(p);
+        Array.isArray(I) ? o(I) : console.error("JSON解析结果不是数组");
       } catch (I) {
         console.error("JSON解析错误:", I);
       }
     },
-    [l]
-  ), P = A(
-    (h) => {
-      const I = s.filter((z, N) => N !== h);
-      l(I), p();
+    [o]
+  ), w = D(
+    (p) => {
+      const I = n.filter((z, N) => N !== p);
+      o(I), v();
     },
-    [s, l, p]
-  ), c = A(
-    (h) => {
-      if (h <= 0) return;
-      const I = [...s], z = I[h];
-      I[h] = I[h - 1], I[h - 1] = z, l(I), p();
+    [n, o, v]
+  ), s = D(
+    (p) => {
+      if (p <= 0) return;
+      const I = [...n], z = I[p];
+      I[p] = I[p - 1], I[p - 1] = z, o(I), v();
     },
-    [s, l, p]
-  ), x = A(
-    (h) => {
-      if (h >= s.length - 1) return;
-      const I = [...s], z = I[h];
-      I[h] = I[h + 1], I[h + 1] = z, l(I), p();
+    [n, o, v]
+  ), h = D(
+    (p) => {
+      if (p >= n.length - 1) return;
+      const I = [...n], z = I[p];
+      I[p] = I[p + 1], I[p + 1] = z, o(I), v();
     },
-    [s, l, p]
-  ), v = A(
-    (h, I) => {
-      const z = [...s];
-      z[h] = I, l(z);
+    [n, o, v]
+  ), f = D(
+    (p, I) => {
+      const z = [...n];
+      z[p] = I, o(z);
     },
-    [s, l]
-  ), k = a && a.subProperties && Object.keys(a.subProperties).length > 0, O = ce(() => [
+    [n, o]
+  ), P = a && a.subProperties && Object.keys(a.subProperties).length > 0, S = ne(() => [
     {
       field: "index",
       headerName: "#",
       width: 40,
       align: "center",
-      renderCell: ({ index: h }) => /* @__PURE__ */ t(
-        F,
+      renderCell: ({ index: p }) => /* @__PURE__ */ t(
+        M,
         {
           variant: "body1",
           sx: {
@@ -152,27 +149,27 @@ function Ir({
             justifyContent: "center",
             color: "text.secondary"
           },
-          children: h + 1
+          children: p + 1
         }
       )
     },
     {
       field: "content",
       headerName: "",
-      renderCell: ({ row: h, index: I }) => b && k ? b({
-        item: h,
+      renderCell: ({ row: p, index: I }) => x && P ? x({
+        item: p,
         index: I,
         property: a,
-        onChange: (z) => v(I, z)
+        onChange: (z) => f(I, z)
       }) : /* @__PURE__ */ t(
-        C,
+        V,
         {
           fullWidth: !0,
           size: "small",
-          disabled: i,
-          value: h,
-          placeholder: u || `${f("item")} ${I + 1}`,
-          onChange: (z) => v(I, z.target.value),
+          disabled: l,
+          value: p,
+          placeholder: u || `${y("item")} ${I + 1}`,
+          onChange: (z) => f(I, z.target.value),
           ...g
         }
       )
@@ -183,36 +180,36 @@ function Ir({
       width: 30,
       // 增加宽度以容纳更多按钮
       align: "center",
-      renderCell: ({ index: h }) => /* @__PURE__ */ S(j, { direction: "column", spacing: 0.25, children: [
-        /* @__PURE__ */ t(kr, { disabled: i || h === 0, onClick: () => c(h) }),
+      renderCell: ({ index: p }) => /* @__PURE__ */ O(R, { direction: "column", spacing: 0.25, children: [
+        /* @__PURE__ */ t(er, { disabled: l || p === 0, onClick: () => s(p) }),
         /* @__PURE__ */ t(
-          Pr,
+          tr,
           {
-            disabled: i || h === s.length - 1,
-            onClick: () => x(h)
+            disabled: l || p === n.length - 1,
+            onClick: () => h(p)
           }
         ),
-        /* @__PURE__ */ t(wr, { disabled: i, onClick: () => P(h) })
+        /* @__PURE__ */ t(Zt, { disabled: l, onClick: () => w(p) })
       ] })
     }
   ], [
-    b,
-    k,
+    x,
+    P,
     a,
-    v,
-    u,
     f,
-    i,
+    u,
+    y,
+    l,
     g,
-    P,
-    c,
-    x,
-    s.length
+    w,
+    s,
+    h,
+    n.length
   ]);
-  return k ? /* @__PURE__ */ S(j, { width: "100%", gap: 1, children: [
-    e && /* @__PURE__ */ t(le, { children: e }),
-    s.length > 0 ? /* @__PURE__ */ t(kt, { component: ee, variant: "outlined", sx: { borderRadius: 1, mb: 1 }, children: /* @__PURE__ */ S(
-      He,
+  return P ? /* @__PURE__ */ O(R, { width: "100%", gap: 1, children: [
+    e && /* @__PURE__ */ t(ie, { children: e }),
+    n.length > 0 ? /* @__PURE__ */ t(at, { component: Z, variant: "outlined", sx: { borderRadius: 1, mb: 1 }, children: /* @__PURE__ */ O(
+      Ke,
       {
         size: "small",
         sx: {
@@ -229,18 +226,18 @@ function Ir({
           borderCollapse: "collapse"
         },
         children: [
-          /* @__PURE__ */ t(Ye, { sx: { display: "none" }, children: /* @__PURE__ */ t(ne, { children: O.map((h) => /* @__PURE__ */ t(
-            se,
+          /* @__PURE__ */ t(Be, { sx: { display: "none" }, children: /* @__PURE__ */ t(le, { children: S.map((p) => /* @__PURE__ */ t(
+            oe,
             {
-              width: h.width,
-              align: h.align || "left",
+              width: p.width,
+              align: p.align || "left",
               sx: { fontWeight: "bold" },
-              children: h.renderHeader ? h.renderHeader() : h.headerName
+              children: p.renderHeader ? p.renderHeader() : p.headerName
             },
-            h.field
+            p.field
           )) }) }),
-          /* @__PURE__ */ t(Ge, { children: s.map((h, I, z) => /* @__PURE__ */ t(
-            ne,
+          /* @__PURE__ */ t(Fe, { children: n.map((p, I, z) => /* @__PURE__ */ t(
+            le,
             {
               sx: {
                 borderBottom: I < z.length - 1 ? "1px solid" : "none",
@@ -249,8 +246,8 @@ function Ir({
                   backgroundColor: "action.hover"
                 }
               },
-              children: O.map((N) => /* @__PURE__ */ t(
-                se,
+              children: S.map((N) => /* @__PURE__ */ t(
+                oe,
                 {
                   width: N.width,
                   align: N.align || "left",
@@ -258,9 +255,9 @@ function Ir({
                     borderBottom: "none"
                   },
                   children: N.renderCell({
-                    row: h,
+                    row: p,
                     index: I,
-                    onChange: (E) => v(I, E)
+                    onChange: (T) => f(I, T)
                   })
                 },
                 `${I}-${N.field}`
@@ -270,278 +267,60 @@ function Ir({
           )) })
         ]
       }
-    ) }) : /* @__PURE__ */ t(Z, { style: { fontSize: 12, height: m }, children: f("maker.properties.arrayEmpty") }),
+    ) }) : /* @__PURE__ */ t(de, { style: { fontSize: 12, height: b }, children: y("maker.properties.arrayEmpty") }),
     /* @__PURE__ */ t(
-      T,
+      E,
       {
         fullWidth: !0,
         size: "small",
         variant: "outlined",
-        disabled: i,
-        startIcon: /* @__PURE__ */ t(vt, {}),
+        disabled: l,
+        startIcon: /* @__PURE__ */ t(nt, {}),
         onClick: d,
-        children: f("maker.properties.addArrayItem")
+        children: y("maker.properties.addArrayItem")
       }
     )
-  ] }) : /* @__PURE__ */ S(j, { width: "100%", gap: 1, children: [
-    e && /* @__PURE__ */ t(le, { children: e }),
-    /* @__PURE__ */ t(R, { sx: { border: 1, borderColor: "divider", borderRadius: 1, minHeight: 150 }, children: /* @__PURE__ */ t(
-      we,
+  ] }) : /* @__PURE__ */ O(R, { width: "100%", gap: 1, children: [
+    e && /* @__PURE__ */ t(ie, { children: e }),
+    /* @__PURE__ */ t(j, { sx: { border: 1, borderColor: "divider", borderRadius: 1, minHeight: 150 }, children: /* @__PURE__ */ t(
+      ve,
       {
         keyId: a.id,
-        locale: w,
+        locale: k,
         language: "json",
-        value: JSON.stringify(s, null, 2),
-        onChange: (h) => y(h || "")
+        value: JSON.stringify(n, null, 2),
+        onChange: (p) => m(p || ""),
+        fullScreenOptions: {
+          enableEscExit: !0,
+          targetContainer: document.getElementById("parameters-config-dialog") || null
+        }
       },
       a.id
     ) })
   ] });
 }
-Wt[300], Bt[300], Kt[300], // deepPurple['300'],
-$t[300], _t[300], // lightBlue['300'],
-Ft[300], Jt[300], Mt[300], // lightGreen['300'],
-Ht[300], Yt[300], Gt[300], Lt[300], // deepOrange['300'],
-qt[300], Qt[300], Xt[300];
-const Sr = tt(function({ showMarkdown: r, markdown: o, onMarkdownChange: i, showUploader: u, value: m, meta: a, onChange: b, ...g }, f) {
-  const [w, p] = J("");
-  M(() => {
-    p(m || "");
-  }, [m, p]);
-  const l = async () => {
-    if (w !== m) {
-      const n = oe(w);
-      if (!n) {
-        b(w, void 0);
-        return;
-      }
-      const d = await fe(n).catch(() => he(n)).catch(() => {
-      });
-      b(w, { ...d, filename: w });
-    }
-  };
-  Ct(
-    () => {
-      w !== m && b(w);
-    },
-    300,
-    [w]
-  ), rt(f, () => ({
-    submit: l
-  }));
-  const s = {};
-  return u && (s.InputProps = {
-    sx: { pr: 0 },
-    endAdornment: /* @__PURE__ */ t(pe, { position: "end", sx: { mx: 0.5 }, children: /* @__PURE__ */ t(
-      Pe,
-      {
-        onChange: async ({ response: n }) => {
-          var c;
-          const d = (c = n == null ? void 0 : n.data) == null ? void 0 : c.filename, y = oe(d) || "";
-          let P = {};
-          y && (P = await fe(y).catch(() => he(y)).catch(() => {
-          })), b(d, {
-            ...P,
-            filename: d
-          });
-        }
-      }
-    ) })
-  }), /* @__PURE__ */ t(
-    C,
-    {
-      size: "small",
-      fullWidth: !0,
-      ...g,
-      label: /* @__PURE__ */ S(j, { direction: "row", spacing: 1, alignItems: "center", children: [
-        g.label,
-        r && /* @__PURE__ */ S(H, { children: [
-          " (",
-          /* @__PURE__ */ t(
-            Le,
-            {
-              checked: o,
-              label: /* @__PURE__ */ t(R, { component: er, icon: "tabler:markdown", sx: { verticalAlign: "middle" } }),
-              labelPlacement: "start",
-              control: /* @__PURE__ */ t(qe, { size: "small" }),
-              sx: { ml: 0.25, pr: 1 },
-              onChange: (n, d) => i == null ? void 0 : i(d)
-            }
-          ),
-          ")"
-        ] })
-      ] }),
-      InputLabelProps: { shrink: !0, ...g.InputLabelProps },
-      value: w,
-      onChange: (n) => p(n.target.value),
-      ...s,
-      onKeyDown: (n) => {
-        n.keyCode !== 229 && n.key === "Enter" && l();
-      }
-    }
-  );
-}), Or = jt(() => import("react-best-gradient-color-picker")), Rr = 0, jr = 100;
-function zr(e) {
-  try {
-    const o = We.parse(e).map((u) => {
-      const m = u.colorStops.map((a, b) => {
-        let { value: g } = a;
-        if (typeof g != "string" && !Array.isArray(g))
-          throw new Error("Invalid color stop value type");
-        let { type: f } = a;
-        if (f !== "rgba") {
-          const l = Ut(g).toRgb();
-          g = [`${l.r}`, `${l.g}`, `${l.b}`, `${l.a}`], f = "rgba";
-        }
-        if (a.length)
-          return {
-            ...a,
-            value: g,
-            type: f
-          };
-        const w = u.colorStops.length;
-        let p;
-        return b === 0 ? p = Rr : b === w - 1 ? p = jr : p = b / (w - 1) * 100, {
-          ...a,
-          value: g,
-          type: f,
-          length: {
-            value: `${p}`,
-            type: "%"
-          }
-        };
-      });
-      return {
-        ...u,
-        colorStops: m
-      };
-    });
-    return We.stringify(o).replace(/NaN/g, "100");
-  } catch {
-    return Je(e) ? `${e}`.replace(/NaN/g, "100") : "";
-  }
-}
-function Nr({ color: e, sx: r = {}, ...o }) {
-  Je(e);
-  const i = {};
-  return Fe(e) ? i.backgroundImage = e : i.backgroundColor = e, /* @__PURE__ */ t(
-    R,
-    {
-      sx: {
-        ...r,
-        width: "100%",
-        paddingBottom: "100%",
-        cursor: "pointer",
-        transition: "opacity 0.2s",
-        border: "1px solid #ccc",
-        borderRadius: 0.5,
-        "&:hover": {
-          opacity: 0.75
-        },
-        ...i
-      },
-      ...o
-    }
-  );
-}
-const Cr = tt(function({ onSave: r }, o) {
-  const i = Tt({
-    value: ""
-  }), { t: u } = D(), m = {};
-  i.value ? Fe(i.value) ? m.backgroundImage = i.value : m.backgroundColor = i.value : m.border = "1px solid #ccc";
-  const [a, { setFalse: b, setTrue: g }] = Vt(!1), f = A(() => {
-    b();
-  }, [b]), w = () => {
-    r({ value: i.value }, f);
-  };
-  return rt(o, () => ({
-    open({ value: p } = { value: "" }) {
-      i.value = zr(p), g();
-    },
-    close() {
-      f();
-    }
-  })), /* @__PURE__ */ S(ke, { disableEnforceFocus: !0, open: a, onClose: f, hideBackdrop: !0, children: [
-    /* @__PURE__ */ t(Qe, { children: u("maker.configBackground") }),
-    /* @__PURE__ */ t(Xe, { sx: { width: 600 }, children: /* @__PURE__ */ S(R, { width: "100%", display: "flex", children: [
-      /* @__PURE__ */ t(
-        R,
-        {
-          flex: 1,
-          mr: 1,
-          sx: {
-            ...m,
-            borderRadius: 0.5
-          },
-          children: !i.value && /* @__PURE__ */ t(Z, { children: u("error.notConfig") })
-        }
-      ),
-      /* @__PURE__ */ t(zt, { children: /* @__PURE__ */ t(
-        Or,
-        {
-          disableDarkMode: !0,
-          width: 240,
-          height: 240,
-          value: i.value,
-          onChange: (p) => {
-            i.value = p;
-          },
-          hidePresets: !0,
-          hideAdvancedSliders: !0,
-          hideColorGuide: !0,
-          hideInputType: !0
-        }
-      ) })
-    ] }) }),
-    /* @__PURE__ */ S(Ze, { children: [
-      /* @__PURE__ */ t(T, { variant: "outlined", size: "small", onClick: f, children: u("common.cancel") }),
-      /* @__PURE__ */ t(T, { variant: "contained", size: "small", onClick: w, children: u("maker.save") })
-    ] })
-  ] });
-});
-Dt(R)`
-  .color-item {
-    position: relative;
-  }
-  .color-item__checked {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: rgba(255, 255, 255, 0.85);
-  }
-  .color-item__delete {
-    position: absolute;
-    top: 0;
-    right: 0;
-  }
-`;
-function Dr({
+function ir({
   value: e,
   onChange: r,
-  ...o
+  ...i
 }) {
-  const i = $(null);
-  return /* @__PURE__ */ S(H, { children: [
+  const l = F(null);
+  return /* @__PURE__ */ O(X, { children: [
     /* @__PURE__ */ t(
-      Sr,
+      wt,
       {
-        ...o,
+        ...i,
         value: e,
         onChange: r,
         InputProps: {
-          endAdornment: /* @__PURE__ */ t(pe, { position: "end", children: /* @__PURE__ */ t(
-            Nr,
+          endAdornment: /* @__PURE__ */ t(xe, { position: "end", children: /* @__PURE__ */ t(
+            kt,
             {
               color: e ?? "",
               style: { width: "1.5rem", height: "1.5rem", padding: 0 },
               onClick: () => {
                 var u;
-                (u = i.current) == null || u.open({ value: e ?? "" });
+                (u = l.current) == null || u.open({ value: e ?? "" });
               }
             }
           ) })
@@ -549,70 +328,70 @@ function Dr({
       }
     ),
     /* @__PURE__ */ t(
-      Cr,
+      It,
       {
-        ref: i,
-        onSave: ({ value: u }, m) => {
-          r(u), m();
+        ref: l,
+        onSave: ({ value: u }, b) => {
+          r(u), b();
         }
       }
     )
   ] });
 }
-function Ar({
+function lr({
   label: e,
   value: r,
-  onChange: o,
-  property: i,
+  onChange: i,
+  property: l,
   component: u,
-  defaultLocale: m,
+  defaultLocale: b,
   allComponents: a,
-  PropertyValueField: b,
+  PropertyValueField: x,
   onUpload: g
 }) {
-  const { locale: f } = D(), w = $(null);
-  if (!ot(i.subProperties)) {
-    const l = V(Object.values(i.subProperties || {}), "index").filter(
-      (s) => s.data.visible !== !1 && s.data.key
+  const { locale: y } = C(), k = F(null);
+  if (!_e(l.subProperties)) {
+    const o = A(Object.values(l.subProperties || {}), "index").filter(
+      (n) => n.data.visible !== !1 && n.data.key
     );
-    return /* @__PURE__ */ S(j, { width: "100%", children: [
-      /* @__PURE__ */ t(le, { sx: { px: 0.25, py: 0.5 }, children: e }),
-      /* @__PURE__ */ t(R, { children: /* @__PURE__ */ t(R, { sx: { position: "relative" }, children: l.map((s, n) => {
-        const { data: d } = s, y = d.key ?? d.id, P = n === l.length - 1;
-        let c = null;
+    return /* @__PURE__ */ O(R, { width: "100%", children: [
+      /* @__PURE__ */ t(ie, { sx: { px: 0.25, py: 0.5 }, children: e }),
+      /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(j, { sx: { position: "relative" }, children: o.map((n, c) => {
+        const { data: d } = n, m = d.key ?? d.id, w = c === o.length - 1;
+        let s = null;
         try {
-          r && typeof r == "object" ? c = r[y] : typeof r == "string" && (c = (i.type === "yaml" ? be.parse(r || "") : JSON.parse(r || "{}"))[y]);
+          r && typeof r == "object" ? s = r[m] : typeof r == "string" && (s = (l.type === "yaml" ? pe.parse(r || "") : JSON.parse(r || "{}"))[m]);
         } catch {
         }
-        c == null && (d.locales && f && d.locales[f] ? c = d.locales[f].defaultValue : d.locales && m && d.locales[m] && (c = d.locales[m].defaultValue));
-        const x = (k) => {
+        s == null && (d.locales && y && d.locales[y] ? s = d.locales[y].defaultValue : d.locales && b && d.locales[b] && (s = d.locales[b].defaultValue));
+        const h = (P) => {
           try {
-            let O = {};
+            let S = {};
             if (typeof r == "string")
               try {
-                O = i.type === "yaml" ? be.parse(r || "") : JSON.parse(r || "{}");
+                S = l.type === "yaml" ? pe.parse(r || "") : JSON.parse(r || "{}");
               } catch {
               }
-            else typeof r == "object" && r !== null && (O = { ...r });
-            lt(O, y, k);
-            const h = ge(O, i.type);
-            o == null || o(h);
-          } catch (O) {
-            console.error("Error updating property:", O);
+            else typeof r == "object" && r !== null && (S = { ...r });
+            He(S, m, P);
+            const p = be(S, l.type);
+            i == null || i(p);
+          } catch (S) {
+            console.error("Error updating property:", S);
           }
-        }, v = 8;
-        return /* @__PURE__ */ S(
-          R,
+        }, f = 8;
+        return /* @__PURE__ */ O(
+          j,
           {
             sx: {
-              mb: P ? 0 : 1,
+              mb: w ? 0 : 1,
               // 底部边距，最后一项不需要
               display: "flex",
               flexDirection: "row"
             },
             children: [
-              /* @__PURE__ */ S(
-                R,
+              /* @__PURE__ */ O(
+                j,
                 {
                   sx: {
                     position: "relative",
@@ -621,11 +400,11 @@ function Ar({
                   },
                   children: [
                     /* @__PURE__ */ t(
-                      R,
+                      j,
                       {
                         sx: {
                           position: "absolute",
-                          left: v,
+                          left: f,
                           top: 0,
                           height: 16,
                           // 连接到字段中点的高度
@@ -636,11 +415,11 @@ function Ar({
                       }
                     ),
                     /* @__PURE__ */ t(
-                      R,
+                      j,
                       {
                         sx: {
                           position: "absolute",
-                          left: v,
+                          left: f,
                           top: 16,
                           // 连接到字段中点
                           width: 12,
@@ -650,12 +429,12 @@ function Ar({
                         }
                       }
                     ),
-                    !P && /* @__PURE__ */ t(
-                      R,
+                    !w && /* @__PURE__ */ t(
+                      j,
                       {
                         sx: {
                           position: "absolute",
-                          left: v,
+                          left: f,
                           top: 16,
                           // 从当前项中点
                           bottom: -8,
@@ -669,16 +448,16 @@ function Ar({
                   ]
                 }
               ),
-              /* @__PURE__ */ t(R, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ t(
-                b,
+              /* @__PURE__ */ t(j, { sx: { flexGrow: 1 }, children: /* @__PURE__ */ t(
+                x,
                 {
                   component: u,
                   property: d,
-                  value: c,
-                  onChange: x,
+                  value: s,
+                  onChange: h,
                   size: "small",
                   fullWidth: !0,
-                  defaultLocale: m,
+                  defaultLocale: b,
                   allComponents: a
                 }
               ) })
@@ -689,8 +468,8 @@ function Ar({
       }) }) })
     ] });
   }
-  return /* @__PURE__ */ t(j, { width: "100%", gap: 2, children: /* @__PURE__ */ S(
-    j,
+  return /* @__PURE__ */ t(R, { width: "100%", gap: 2, children: /* @__PURE__ */ O(
+    R,
     {
       sx: {
         width: "100%",
@@ -703,7 +482,7 @@ function Ar({
       },
       children: [
         /* @__PURE__ */ t(
-          le,
+          ie,
           {
             sx: {
               position: "absolute",
@@ -715,23 +494,27 @@ function Ar({
           }
         ),
         /* @__PURE__ */ t(
-          we,
+          ve,
           {
-            keyId: i.id,
-            locale: f,
-            language: i.type === "yaml" ? "yaml" : "json",
+            keyId: l.id,
+            locale: y,
+            language: l.type === "yaml" ? "yaml" : "json",
             value: typeof r == "string" ? r : "",
-            onChange: (l) => {
-              o == null || o(l);
+            onChange: (o) => {
+              i == null || i(o);
+            },
+            onUpload: (o) => {
+              k.current = o, g && g(o);
             },
-            onUpload: (l) => {
-              w.current = l, g && g(l);
+            fullScreenOptions: {
+              enableEscExit: !0,
+              targetContainer: document.getElementById("parameters-config-dialog") || null
             }
           },
-          i.id
+          l.id
         ),
         /* @__PURE__ */ t(
-          R,
+          j,
           {
             component: "fieldset",
             sx: {
@@ -747,136 +530,136 @@ function Ar({
               px: 1,
               py: 0
             },
-            children: /* @__PURE__ */ t(R, { component: "legend", sx: { fontSize: "0.75em" }, children: /* @__PURE__ */ t(R, { component: "span", sx: { opacity: 0 }, children: e }) })
+            children: /* @__PURE__ */ t(j, { component: "legend", sx: { fontSize: "0.75em" }, children: /* @__PURE__ */ t(j, { component: "span", sx: { opacity: 0 }, children: e }) })
           }
         )
       ]
     }
   ) });
 }
-const Tr = ["string", "multiline", "json", "yaml", "url", "component", "custom"];
-function $e(e) {
-  return e.type ? !Tr.includes(e.type) : !1;
+const or = ["string", "multiline", "json", "yaml", "url", "component", "custom"];
+function Te(e) {
+  return e.type ? !or.includes(e.type) : !1;
 }
-function mt({
+function tt({
   disabled: e,
   list: r,
-  renderItem: o,
-  ...i
+  renderItem: i,
+  ...l
 }) {
-  const u = $(null), m = Nt(), a = Et(), b = V(Object.entries(r), (s) => s[1].index).map((s) => s[0]), g = $(b), f = A(
-    (s) => {
-      g.current = s, a();
+  const u = F(null), b = Pt(), a = Kt(), x = A(Object.entries(r), (n) => n[1].index).map((n) => n[0]), g = F(x), y = D(
+    (n) => {
+      g.current = n, a();
     },
     [a]
-  ), w = A(
-    ({ index: s }, { index: n }) => {
+  ), k = D(
+    ({ index: n }, { index: c }) => {
       const d = [...g.current];
-      d.splice(n, 0, ...d.splice(s, 1)), f(d);
+      d.splice(c, 0, ...d.splice(n, 1)), y(d);
     },
-    [f]
+    [y]
   );
-  M(() => {
-    f(b);
-  }, [b.join("-")]);
-  const [{ isOver: p }, l] = pt({
-    accept: m,
-    collect: (s) => ({
-      isOver: s.isOver()
+  $(() => {
+    y(x);
+  }, [x.join("-")]);
+  const [{ isOver: v }, o] = et({
+    accept: b,
+    collect: (n) => ({
+      isOver: n.isOver()
     }),
     canDrop: () => !e,
     drop: () => {
       var d;
-      const s = () => {
-        g.current.forEach((y, P) => {
-          const c = r[y];
-          c && (c.index = P);
+      const n = () => {
+        g.current.forEach((m, w) => {
+          const s = r[m];
+          s && (s.index = w);
         });
-      }, n = (d = te(r)) == null ? void 0 : d.doc;
-      n ? n.transact(() => {
-        s();
-      }) : s();
+      }, c = (d = ee(r)) == null ? void 0 : d.doc;
+      c ? c.transact(() => {
+        n();
+      }) : n();
     }
   });
-  return M(() => {
-    p || f(b);
-  }, [p]), l(u), /* @__PURE__ */ t(R, { ...i, ref: u, className: At(p && "isDragging"), children: g.current.map((s, n) => /* @__PURE__ */ t(
-    Vr,
+  return $(() => {
+    v || y(x);
+  }, [v]), o(u), /* @__PURE__ */ t(j, { ...l, ref: u, className: Qt(v && "isDragging"), children: g.current.map((n, c) => /* @__PURE__ */ t(
+    nr,
     {
-      type: m,
+      type: b,
       disabled: e,
-      id: s,
-      index: n,
+      id: n,
+      index: c,
       itemIndex: (d) => g.current.indexOf(d),
-      move: w,
+      move: k,
       children: (d) => {
-        const y = r[s];
-        return y ? o(y.data, n, d) : null;
+        const m = r[n];
+        return m ? i(m.data, c, d) : null;
       }
     },
-    s
+    n
   )) });
 }
-function Vr({
+function nr({
   disabled: e,
   id: r,
-  index: o,
-  type: i,
+  index: i,
+  type: l,
   children: u,
-  itemIndex: m,
+  itemIndex: b,
   move: a
 }) {
-  const b = $(), [{ isDragging: g }, f, w] = xr({
-    type: i,
+  const x = F(), [{ isDragging: g }, y, k] = Xt({
+    type: l,
     item: () => ({ id: r }),
     canDrag: () => !e,
-    collect: (l) => ({ isDragging: l.isDragging() })
-  }), [, p] = pt({
-    accept: i,
+    collect: (o) => ({ isDragging: o.isDragging() })
+  }), [, v] = et({
+    accept: l,
     canDrop: () => !e,
-    hover(l, s) {
-      var v;
-      if (!b.current)
+    hover(o, n) {
+      var f;
+      if (!x.current)
         return;
-      const n = m(l.id), d = o;
-      if (n === d)
+      const c = b(o.id), d = i;
+      if (c === d)
         return;
-      const y = (v = b.current) == null ? void 0 : v.getBoundingClientRect(), P = (y.bottom - y.top) / 2, x = s.getClientOffset().y - y.top;
-      n < d && x < P || n > d && x > P || a({ id: l.id, index: n }, { id: r, index: o });
+      const m = (f = x.current) == null ? void 0 : f.getBoundingClientRect(), w = (m.bottom - m.top) / 2, h = n.getClientOffset().y - m.top;
+      c < d && h < w || c > d && h > w || a({ id: o.id, index: c }, { id: r, index: i });
     }
   });
   return typeof u == "function" ? u({
     isDragging: g,
-    drag: f,
-    drop: (l) => (b.current = l, p(l)),
-    preview: w
-  }) : (f(p(w(b))), /* @__PURE__ */ t(R, { ref: b, children: u }));
+    drag: y,
+    drop: (o) => (x.current = o, v(o)),
+    preview: k
+  }) : (y(v(k(x))), /* @__PURE__ */ t(j, { ref: x, children: u }));
 }
-function Er({
+function sr({
   drop: e,
   preview: r,
-  drag: o,
-  disabled: i,
+  drag: i,
+  disabled: l,
   isDragging: u,
-  children: m,
+  children: b,
   onDelete: a,
-  onVisibilityChange: b,
+  onVisibilityChange: x,
   visible: g = !0,
-  actions: f,
-  alwaysShowActions: w = !1
+  actions: y,
+  alwaysShowActions: k = !1
 }) {
-  const { t: p } = D();
+  const { t: v } = C();
   return /* @__PURE__ */ t(
-    R,
+    j,
     {
       ref: e,
       sx: {
         ":hover .hover-visible": { maxWidth: "100%" },
         opacity: g ? 1 : 0.5
       },
-      children: /* @__PURE__ */ S(R, { sx: { position: "relative" }, children: [
+      children: /* @__PURE__ */ O(j, { sx: { position: "relative" }, children: [
         /* @__PURE__ */ t(
-          R,
+          j,
           {
             ref: r,
             sx: {
@@ -886,30 +669,30 @@ function Er({
               opacity: 0.9999
               // NOTE: make preview effective
             },
-            children: m
+            children: b
           }
         ),
-        !i && /* @__PURE__ */ t(
-          R,
+        !l && /* @__PURE__ */ t(
+          j,
           {
-            className: w ? "" : "hover-visible",
+            className: k ? "" : "hover-visible",
             sx: {
-              maxWidth: w ? "100%" : 0,
+              maxWidth: k ? "100%" : 0,
               overflow: "hidden",
               position: "absolute",
               right: 2,
               top: 2,
               transition: "max-width 0.3s ease-in-out"
             },
-            children: /* @__PURE__ */ S(
-              j,
+            children: /* @__PURE__ */ O(
+              R,
               {
                 direction: "row",
                 sx: {
-                  bgcolor: (l) => Pt(l.palette.grey[200], 0.9),
+                  bgcolor: (o) => ut(o.palette.grey[200], 0.9),
                   borderRadius: 1,
                   p: 0.5,
-                  [`.${It.root}`]: {
+                  [`.${pt.root}`]: {
                     minWidth: 24,
                     width: 24,
                     height: 24,
@@ -917,10 +700,10 @@ function Er({
                   }
                 },
                 children: [
-                  f,
-                  b && /* @__PURE__ */ t(X, { title: p(g ? "hideParameter" : "showParameter"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(T, { onClick: () => b(!g), children: g ? /* @__PURE__ */ t(nr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) : /* @__PURE__ */ t(sr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
-                  a && /* @__PURE__ */ t(X, { title: p("delete"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(T, { onClick: a, children: /* @__PURE__ */ t(cr, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
-                  /* @__PURE__ */ t(X, { title: p("dragSort"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(T, { ref: o, children: /* @__PURE__ */ t(ar, { sx: { color: "grey.500" } }) }) })
+                  y,
+                  x && /* @__PURE__ */ t(G, { title: v(g ? "hideParameter" : "showParameter"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(E, { onClick: () => x(!g), children: g ? /* @__PURE__ */ t(Et, { sx: { fontSize: "1.25rem", color: "grey.500" } }) : /* @__PURE__ */ t(At, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
+                  a && /* @__PURE__ */ t(G, { title: v("delete"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(E, { onClick: a, children: /* @__PURE__ */ t(Tt, { sx: { fontSize: "1.25rem", color: "grey.500" } }) }) }),
+                  /* @__PURE__ */ t(G, { title: v("dragSort"), disableInteractive: !0, placement: "top", children: /* @__PURE__ */ t(E, { ref: i, children: /* @__PURE__ */ t(Ut, { sx: { color: "grey.500" } }) }) })
                 ]
               }
             )
@@ -930,28 +713,28 @@ function Er({
     }
   );
 }
-function Ur({
+function cr({
   label: e,
   value: r,
-  onChange: o
+  onChange: i
 }) {
-  const [i, u] = J(!1);
-  return /* @__PURE__ */ S(j, { gap: 1, children: [
+  const [l, u] = Q(!1);
+  return /* @__PURE__ */ O(R, { gap: 1, children: [
     /* @__PURE__ */ t(
-      C,
+      V,
       {
         label: e,
         size: "small",
         value: r,
-        onChange: (m) => o == null ? void 0 : o(m.target.value),
+        onChange: (b) => i == null ? void 0 : i(b.target.value),
         InputProps: {
           endAdornment: /* @__PURE__ */ t(
-            Pe,
+            Ye,
             {
-              onChange: ({ response: m }) => {
-                var b;
-                const a = (b = m == null ? void 0 : m.data) == null ? void 0 : b.filename;
-                a && (o == null || o(a));
+              onChange: ({ response: b }) => {
+                var x;
+                const a = (x = b == null ? void 0 : b.data) == null ? void 0 : x.filename;
+                a && (i == null || i(a));
               }
             }
           )
@@ -959,11 +742,11 @@ function Ur({
       }
     ),
     r && /* @__PURE__ */ t(
-      R,
+      j,
       {
         component: "img",
         sx: { objectFit: "contain", borderRadius: 1, cursor: "pointer" },
-        src: oe(r),
+        src: Ee(r),
         alt: e,
         maxWidth: 100,
         maxHeight: 100,
@@ -971,20 +754,20 @@ function Ur({
         onClick: () => u(!0)
       }
     ),
-    /* @__PURE__ */ t(ke, { open: i, onClose: () => u(!1), children: /* @__PURE__ */ t(R, { component: "img", sx: { objectFit: "contain" }, src: oe(r), alt: e }) })
+    /* @__PURE__ */ t(Je, { open: l, onClose: () => u(!1), children: /* @__PURE__ */ t(j, { component: "img", sx: { objectFit: "contain" }, src: Ee(r), alt: e }) })
   ] });
 }
-function ye(e, r = "") {
-  return yr(
+function fe(e, r = "") {
+  return Lt(
     e,
-    (o, i, u) => {
-      const m = r ? `${r}.${u}` : u;
-      return mr(i) ? ur(o, ye(i, m)) : o[m] = i, o;
+    (i, l, u) => {
+      const b = r ? `${r}.${u}` : u;
+      return $t(l) ? Ft(i, fe(l, b)) : i[b] = l, i;
     },
     {}
   );
 }
-const Wr = [
+const dr = [
   { value: "string", label: "Text" },
   { value: "multiline", label: "Text (Multiline)" },
   { value: "number", label: "Number" },
@@ -998,103 +781,134 @@ const Wr = [
   { value: "component", label: "Component" },
   { value: "custom", label: "Custom (Render by a Component)" }
 ];
-function ie(e, r, o) {
-  return !e || !o ? !1 : Object.values(e).some(({ data: i }) => i.id !== r && i.key === o);
+function re(e, r, i) {
+  return !e || !i ? !1 : Object.values(e).some(({ data: l }) => l.id !== r && l.key === i);
 }
-function ve(e, r) {
-  var o;
-  return !e || !r ? !1 : ((o = e[r]) == null ? void 0 : o.data.visible) ?? !0;
+function he(e, r) {
+  var i;
+  return !e || !r ? !1 : ((i = e[r]) == null ? void 0 : i.data.visible) ?? !0;
 }
-function Bi({ componentId: e }) {
+function si({ componentId: e }) {
   const {
     state: { components: r }
-  } = de(), o = r[e], i = o == null ? void 0 : o.data;
-  return i ? /* @__PURE__ */ t(j, { maxHeight: "100%", overflow: "auto", children: /* @__PURE__ */ t(R, { p: 2, children: /* @__PURE__ */ t(gr, { FallbackComponent: yt, resetKeys: [e], children: /* @__PURE__ */ t(Br, { value: i }) }) }) }) : null;
+  } = ce(), i = r[e], l = i == null ? void 0 : i.data;
+  return l ? /* @__PURE__ */ t(R, { maxHeight: "100%", overflow: "auto", children: /* @__PURE__ */ t(j, { p: 2, children: /* @__PURE__ */ t(Gt, { FallbackComponent: ot, resetKeys: [e], children: /* @__PURE__ */ t(ar, { value: l }) }) }) }) : null;
 }
-function Br({ value: e }) {
-  var g, f, w;
-  const { t: r } = D(), {
-    localState: { currentLocale: o, componentDebugProps: i },
+function ar({ value: e }) {
+  var y, k, v;
+  const { t: r } = C(), {
+    localState: { currentLocale: i, customComponentPreviewerProperties: l },
     state: {
       config: { defaultLocale: u }
     },
-    localActions: { setComponentDebugProps: m }
-  } = de(), a = te(e).doc, b = xe();
-  return /* @__PURE__ */ t(j, { height: "100%", children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ t(Kr, { config: e }),
+    localActions: { setCustomComponentPreviewerProperties: b }
+  } = ce(), a = ee(e).doc, x = ye(), g = Bt({
+    propertiesValue: {
+      ...b
+    }
+  });
+  return $(() => {
+    const o = Object.fromEntries(
+      Object.values(e.properties ?? {}).map(({ data: n }) => {
+        var c, d, m, w, s;
+        return [
+          n.id,
+          {
+            value: ((c = g.propertiesValue[n.id]) == null ? void 0 : c.value) ?? Vt(
+              n,
+              ((m = (d = n.locales) == null ? void 0 : d[i]) == null ? void 0 : m.defaultValue) ?? ((s = (w = n.locales) == null ? void 0 : w[u]) == null ? void 0 : s.defaultValue),
+              {
+                locale: i,
+                defaultLocale: u
+              }
+            )
+          }
+        ];
+      })
+    );
+    b(o);
+  }, [JSON.stringify(g.propertiesValue)]), /* @__PURE__ */ t(R, { height: "100%", children: /* @__PURE__ */ O(R, { gap: 2, children: [
+    /* @__PURE__ */ t(ur, { config: e }),
     /* @__PURE__ */ t(
-      _r,
+      mr,
       {
         config: e,
-        currentLocale: o,
+        currentLocale: i,
         defaultLocale: u,
-        allComponents: b,
-        onUpdateConfig: (p) => {
+        allComponents: x,
+        onUpdateConfig: (o) => {
           a.transact(() => {
-            p(e);
+            o(e);
           });
         }
       }
     ),
-    /* @__PURE__ */ S(j, { gap: 2, direction: "row", justifyContent: "space-between", alignItems: "center", children: [
-      /* @__PURE__ */ t(F, { variant: "subtitle1", children: r("renderer") }),
-      /* @__PURE__ */ S(
-        C,
+    /* @__PURE__ */ O(R, { gap: 2, direction: "row", justifyContent: "space-between", alignItems: "center", children: [
+      /* @__PURE__ */ t(M, { variant: "subtitle1", children: r("renderer") }),
+      /* @__PURE__ */ O(
+        V,
         {
           hiddenLabel: !0,
           size: "small",
           select: !0,
           SelectProps: { autoWidth: !0 },
-          value: ((g = e.renderer) == null ? void 0 : g.type) || "react-component",
-          onChange: (p) => {
+          value: ((y = e.renderer) == null ? void 0 : y.type) || "react-component",
+          onChange: (o) => {
             a.transact(() => {
-              const l = p.target.value;
-              e.renderer ?? (e.renderer = { type: l }), e.renderer.type = l;
+              const n = o.target.value;
+              e.renderer ?? (e.renderer = { type: n }), e.renderer.type = n;
             });
           },
           children: [
-            /* @__PURE__ */ t(me, { value: "react-component", children: "React Component" }),
-            /* @__PURE__ */ t(me, { value: "component", children: "Custom Component" })
+            /* @__PURE__ */ t(ue, { value: "react-component", children: "React Component" }),
+            /* @__PURE__ */ t(ue, { value: "component", children: "Custom Component" })
           ]
         }
       )
     ] }),
-    ((f = e.renderer) == null ? void 0 : f.type) === "component" && /* @__PURE__ */ t(qr, { value: e }),
-    ((w = e.renderer) == null ? void 0 : w.type) === "react-component" && /* @__PURE__ */ t(Lr, { value: e }),
+    ((k = e.renderer) == null ? void 0 : k.type) === "component" && /* @__PURE__ */ t(Pr, { value: e }),
+    ((v = e.renderer) == null ? void 0 : v.type) === "react-component" && /* @__PURE__ */ t(gr, { value: e }),
     /* @__PURE__ */ t(
-      bt,
+      lt,
       {
         config: e,
-        currentLocale: o,
+        currentLocale: i,
         defaultLocale: u,
-        allComponents: b,
-        onChange: ({ key: p, value: l }) => {
-          m({
-            [p]: l.value
-          });
-        },
-        props: {
-          ...i
+        allComponents: x,
+        propertiesValue: l,
+        onChange: ({ value: o, id: n, path: c }) => {
+          const d = [...c, "data"];
+          if (!Jt(e, d)) {
+            me.warning(
+              r("cannotFindPropertyKey", {
+                key: d.join(".")
+              })
+            );
+            return;
+          }
+          g.propertiesValue[n] = {
+            value: o.value
+          };
         }
       }
     )
   ] }) });
 }
-function Kr({ config: e }) {
-  const { t: r } = D();
-  return /* @__PURE__ */ t(Ie, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ t(F, { variant: "subtitle1", children: r("basicInfo") }),
+function ur({ config: e }) {
+  const { t: r } = C();
+  return /* @__PURE__ */ t(ge, { children: /* @__PURE__ */ O(R, { gap: 2, children: [
+    /* @__PURE__ */ t(M, { variant: "subtitle1", children: r("basicInfo") }),
     /* @__PURE__ */ t(
-      C,
+      V,
       {
         label: r("name"),
         size: "small",
         value: e.name || "",
-        onChange: (o) => e.name = o.target.value
+        onChange: (i) => e.name = i.target.value
       }
     ),
     /* @__PURE__ */ t(
-      C,
+      V,
       {
         label: r("description"),
         size: "small",
@@ -1103,71 +917,71 @@ function Kr({ config: e }) {
         maxRows: 10,
         inputProps: { maxLength: 200 },
         value: e.description || "",
-        onChange: (o) => e.description = o.target.value
+        onChange: (i) => e.description = i.target.value
       }
     ),
     /* @__PURE__ */ t(
-      et,
+      Me,
       {
         size: "small",
         options: [],
         multiple: !0,
         freeSolo: !0,
         value: e.tags ?? [],
-        onChange: (o, i) => e.tags = i,
-        renderInput: (o) => /* @__PURE__ */ t(C, { label: r("tags"), ...o })
+        onChange: (i, l) => e.tags = l,
+        renderInput: (i) => /* @__PURE__ */ t(V, { label: r("tags"), ...i })
       }
     ),
     /* @__PURE__ */ t(
-      Ur,
+      cr,
       {
         label: r("previewImage"),
         value: e.previewImage || "",
-        onChange: (o) => e.previewImage = o
+        onChange: (i) => e.previewImage = i
       }
     )
   ] }) });
 }
-function ft({
+function rt({
   data: e,
   params: r,
-  visible: o,
-  config: i,
+  visible: i,
+  config: l,
   currentLocale: u,
-  defaultLocale: m,
+  defaultLocale: b,
   allComponents: a,
-  onUpdateConfig: b
+  onUpdateConfig: x
 }) {
-  var w, p, l, s, n, d;
-  const { t: g } = D(), f = ce(() => e.type === "json" || e.type === "yaml" || e.type === "array" ? Mr : _, [e.type]);
+  var k, v, o, n, c, d;
+  const { t: g } = C(), y = ne(() => e.type === "json" || e.type === "yaml" || e.type === "array" ? br : J, [e.type]);
   return /* @__PURE__ */ t(
-    Er,
+    sr,
     {
       preview: r.preview,
       drop: r.drop,
       drag: r.drag,
       isDragging: r.isDragging,
       onDelete: () => {
-        b((y) => {
-          if (y.properties) {
-            const c = Object.entries(y.properties).sort(([, v], [, k]) => v.index - k.index);
-            delete y.properties[e.id], c.filter(([v]) => v !== e.id).forEach(([, v], k) => {
-              v.index = k;
+        x((m) => {
+          if (m.properties) {
+            const s = Object.entries(m.properties).sort(([, f], [, P]) => f.index - P.index);
+            delete m.properties[e.id], s.filter(([f]) => f !== e.id).forEach(([, f], P) => {
+              f.index = P;
             });
           }
         });
       },
-      visible: o,
-      onVisibilityChange: (y) => {
-        b((P) => {
-          const c = P.properties[e.id].data;
-          c.visible = y;
+      visible: i,
+      onVisibilityChange: (m) => {
+        x((w) => {
+          const s = w.properties[e.id].data;
+          s.visible = m;
         });
       },
       alwaysShowActions: !0,
-      children: /* @__PURE__ */ S(j, { direction: "column", gap: 2, children: [
+      children: /* @__PURE__ */ O(R, { direction: "column", gap: 2, children: [
         /* @__PURE__ */ t(
-          C,
+          V,
           {
             label: g("key"),
             size: "small",
@@ -1176,33 +990,33 @@ function ft({
               width: "calc(100% - 80px - 8px)",
               flex: 1,
               "& .MuiOutlinedInput-root": {
-                borderColor: e.key ? ie(i.properties, e.id, e.key) ? "warning.main" : void 0 : "error.main"
+                borderColor: e.key ? re(l.properties, e.id, e.key) ? "warning.main" : void 0 : "error.main"
               },
               "& .MuiFormLabel-root": {
-                color: e.key ? ie(i.properties, e.id, e.key) ? "warning.main" : "text.secondary" : "error.main"
+                color: e.key ? re(l.properties, e.id, e.key) ? "warning.main" : "text.secondary" : "error.main"
               },
               "& .MuiFormLabel-root.Mui-focused": {
-                color: e.key ? ie(i.properties, e.id, e.key) ? "warning.main" : "primary.main" : "error.main"
+                color: e.key ? re(l.properties, e.id, e.key) ? "warning.main" : "primary.main" : "error.main"
               }
             },
             value: e.key || "",
-            onChange: (y) => {
-              b((P) => {
-                const c = P.properties[e.id].data;
-                c.key = y.target.value.trim();
+            onChange: (m) => {
+              x((w) => {
+                const s = w.properties[e.id].data;
+                s.key = m.target.value.trim();
               });
             },
             InputProps: {
-              endAdornment: !e.key || e.key && ie(i.properties, e.id, e.key) ? /* @__PURE__ */ t(
-                pe,
+              endAdornment: !e.key || e.key && re(l.properties, e.id, e.key) ? /* @__PURE__ */ t(
+                xe,
                 {
                   position: "end",
                   sx: {
                     width: 16,
                     ml: 0
                   },
-                  children: /* @__PURE__ */ t(X, { title: e.key ? g("duplicateKey") : g("requiredKey"), children: /* @__PURE__ */ t(
-                    at,
+                  children: /* @__PURE__ */ t(G, { title: e.key ? g("duplicateKey") : g("requiredKey"), children: /* @__PURE__ */ t(
+                    Qe,
                     {
                       sx: {
                         color: e.key ? "warning.main" : "error.main",
@@ -1215,205 +1029,205 @@ function ft({
             }
           }
         ),
-        /* @__PURE__ */ S(j, { direction: "row", gap: 1, children: [
+        /* @__PURE__ */ O(R, { direction: "row", gap: 1, children: [
           /* @__PURE__ */ t(
-            C,
+            V,
             {
               label: g("label"),
               size: "small",
               sx: { flex: 1 },
-              value: (((p = (w = e.locales) == null ? void 0 : w[u]) == null ? void 0 : p.name) ?? ((s = (l = e.locales) == null ? void 0 : l[m]) == null ? void 0 : s.name)) || "",
-              onChange: (y) => {
-                b((P) => {
-                  var x;
-                  const c = P.properties[e.id].data;
-                  c.locales ?? (c.locales = {}), (x = c.locales)[u] ?? (x[u] = {}), c.locales[u].name = y.target.value;
+              value: (((v = (k = e.locales) == null ? void 0 : k[u]) == null ? void 0 : v.name) ?? ((n = (o = e.locales) == null ? void 0 : o[b]) == null ? void 0 : n.name)) || "",
+              onChange: (m) => {
+                x((w) => {
+                  var h;
+                  const s = w.properties[e.id].data;
+                  s.locales ?? (s.locales = {}), (h = s.locales)[u] ?? (h[u] = {}), s.locales[u].name = m.target.value;
                 });
               }
             }
           ),
           /* @__PURE__ */ t(
-            C,
+            V,
             {
               label: g("type"),
               size: "small",
               select: !0,
               sx: { flex: 1 },
               value: e.type === "string" && e.multiline ? "multiline" : e.type || "string",
-              onChange: (y) => {
-                b((P) => {
-                  const c = P.properties[e.id].data;
-                  if (c.locales)
-                    for (const v of Object.keys(c.locales))
-                      c.locales[v].defaultValue = void 0;
-                  const x = y.target.value;
-                  x === "multiline" ? (c.type = "string", c.multiline = !0) : (typeof c.multiline < "u" && delete c.multiline, c.type = x);
+              onChange: (m) => {
+                x((w) => {
+                  const s = w.properties[e.id].data;
+                  if (s.locales)
+                    for (const f of Object.keys(s.locales))
+                      s.locales[f].defaultValue = void 0;
+                  const h = m.target.value;
+                  h === "multiline" ? (s.type = "string", s.multiline = !0) : (typeof s.multiline < "u" && delete s.multiline, s.type = h);
                 });
               },
-              children: Wr.map((y) => /* @__PURE__ */ t(me, { value: y.value, children: y.label }, y.value))
+              children: dr.map((m) => /* @__PURE__ */ t(ue, { value: m.value, children: m.label }, m.value))
             }
           )
         ] }),
-        /* @__PURE__ */ S(j, { direction: "row", gap: 1, children: [
+        /* @__PURE__ */ O(R, { direction: "row", gap: 1, children: [
           /* @__PURE__ */ t(
-            f,
+            y,
             {
               allComponents: a,
-              defaultLocale: m,
-              component: i,
+              defaultLocale: b,
+              component: l,
               property: e,
               label: g("defaultValue"),
               size: "small",
               fullWidth: !0,
-              value: (d = (n = e.locales) == null ? void 0 : n[u]) == null ? void 0 : d.defaultValue,
-              onChange: (y, P) => {
-                b((c) => {
-                  var v;
-                  const x = c.properties[e.id].data;
-                  if (P != null && P.forceUpdateProperty) {
-                    const k = ye(x), O = ye(y);
-                    Object.keys(O).forEach((h) => {
-                      k[h] || lt(x, h, O[h]);
+              value: (d = (c = e.locales) == null ? void 0 : c[u]) == null ? void 0 : d.defaultValue,
+              onChange: (m, w) => {
+                x((s) => {
+                  var f;
+                  const h = s.properties[e.id].data;
+                  if (w != null && w.forceUpdateProperty) {
+                    const P = fe(h), S = fe(m);
+                    Object.keys(S).forEach((p) => {
+                      P[p] || He(h, p, S[p]);
                     });
                   } else
-                    x.locales ?? (x.locales = {}), (v = x.locales)[u] ?? (v[u] = {}), x.locales[u].defaultValue = y;
+                    h.locales ?? (h.locales = {}), (f = h.locales)[u] ?? (f[u] = {}), h.locales[u].defaultValue = m;
                 });
               }
             }
           ),
-          e.type === "custom" ? /* @__PURE__ */ t(R, { children: /* @__PURE__ */ t(Fr, { property: e, allComponents: a }) }) : null
+          e.type === "custom" ? /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(fr, { property: e, allComponents: a }) }) : null
         ] })
       ] })
     }
   );
 }
-function $r(e, r) {
-  const [o, i] = J(0);
-  return M(() => {
-    const m = setTimeout(() => {
+function pr(e, r) {
+  const [i, l] = Q(0);
+  return $(() => {
+    const b = setTimeout(() => {
       if (e.current) {
-        let a = e.current.parentElement, b = 0;
+        let a = e.current.parentElement, x = 0;
         for (; a; )
-          a.classList.contains("property-container") && b++, a = a.parentElement;
-        i(b);
+          a.classList.contains("property-container") && x++, a = a.parentElement;
+        l(x);
       }
     }, 100);
-    return () => clearTimeout(m);
-  }, [e, r]), o;
+    return () => clearTimeout(b);
+  }, [e, r]), i;
 }
-function _r({
+function mr({
   config: e,
   currentLocale: r,
-  defaultLocale: o,
-  allComponents: i,
+  defaultLocale: i,
+  allComponents: l,
   onUpdateConfig: u,
-  useI18nEditor: m = !0
+  useI18nEditor: b = !0
 }) {
-  const { t: a } = D(), b = Se({ variant: "dialog" }), g = e.properties && V(Object.values(e.properties), "index");
-  return /* @__PURE__ */ t(Ie, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ S(j, { direction: "row", gap: 1, alignItems: "center", justifyContent: "space-between", children: [
-      /* @__PURE__ */ t(F, { variant: "subtitle1", children: a("properties") }),
-      /* @__PURE__ */ t(R, { flex: 1 }),
-      m && /* @__PURE__ */ t(T, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...Oe(b), children: /* @__PURE__ */ t(st, { fontSize: "small" }) })
+  const { t: a } = C(), x = Pe({ variant: "dialog" }), g = e.properties && A(Object.values(e.properties), "index");
+  return /* @__PURE__ */ t(ge, { children: /* @__PURE__ */ O(R, { gap: 2, children: [
+    /* @__PURE__ */ O(R, { direction: "row", gap: 1, alignItems: "center", justifyContent: "space-between", children: [
+      /* @__PURE__ */ t(M, { variant: "subtitle1", children: a("properties") }),
+      /* @__PURE__ */ t(j, { flex: 1 }),
+      b && /* @__PURE__ */ t(E, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...we(x), children: /* @__PURE__ */ t(qe, { fontSize: "small" }) })
     ] }),
     e.properties && Object.keys(e.properties).length > 0 ? /* @__PURE__ */ t(
-      mt,
+      tt,
       {
-        component: j,
+        component: R,
         gap: 2,
         list: e.properties,
-        renderItem: (f, w, p) => {
-          const l = ve(e.properties, f.id);
+        renderItem: (y, k, v) => {
+          const o = he(e.properties, y.id);
           return /* @__PURE__ */ t(
-            ee,
+            Z,
             {
               elevation: 0,
               className: "property-container",
               sx: {
                 p: 1.25,
                 borderRadius: 1,
-                border: l ? "1px solid" : "1px dashed",
+                border: o ? "1px solid" : "1px dashed",
                 borderColor: "divider"
               },
-              children: /* @__PURE__ */ t(j, { gap: 2, children: /* @__PURE__ */ t(
-                ft,
+              children: /* @__PURE__ */ t(R, { gap: 2, children: /* @__PURE__ */ t(
+                rt,
                 {
-                  data: f,
-                  params: p,
-                  visible: l,
+                  data: y,
+                  params: v,
+                  visible: o,
                   config: e,
                   currentLocale: r,
-                  defaultLocale: o,
-                  allComponents: i,
+                  defaultLocale: i,
+                  allComponents: l,
                   onUpdateConfig: u
                 }
               ) })
             },
-            f.id
+            y.id
           );
         }
       }
-    ) : /* @__PURE__ */ t(Z, { style: { fontSize: 12 }, children: a("maker.properties.noProperties") }),
+    ) : /* @__PURE__ */ t(de, { style: { fontSize: 12 }, children: a("maker.properties.noProperties") }),
     /* @__PURE__ */ t(
-      T,
+      E,
       {
         fullWidth: !0,
         variant: "outlined",
         className: "ignore-style-override",
         onClick: () => {
-          u((f) => {
-            var p;
-            const w = Me();
-            f.properties ?? (f.properties = {}), (p = f.properties)[w] ?? (p[w] = { index: (g == null ? void 0 : g.length) || 0, data: { id: w } });
+          u((y) => {
+            var v;
+            const k = We();
+            y.properties ?? (y.properties = {}), (v = y.properties)[k] ?? (v[k] = { index: (g == null ? void 0 : g.length) || 0, data: { id: k } });
           });
         },
-        startIcon: /* @__PURE__ */ t(ct, {}),
+        startIcon: /* @__PURE__ */ t(Ge, {}),
         children: a("addObject", { object: a("property") })
       }
     ),
-    m && /* @__PURE__ */ t(ht, { ...ut(b), component: e })
+    b && /* @__PURE__ */ t(it, { ...Ze(x), component: e })
   ] }) });
 }
-function Fr({
+function fr({
   property: e,
   allComponents: r
 }) {
-  const o = Se({ variant: "popper" });
-  return /* @__PURE__ */ S(H, { children: [
-    /* @__PURE__ */ t(T, { sx: { minWidth: 0 }, ...Oe(o), children: /* @__PURE__ */ t(dt, { fontSize: "small" }) }),
-    /* @__PURE__ */ t(Rt, { ...vr(o), children: /* @__PURE__ */ t(lr, { onClickAway: o.close, children: /* @__PURE__ */ t(ee, { children: /* @__PURE__ */ t(R, { width: 500, p: 2, children: /* @__PURE__ */ t(
-      Re,
+  const i = Pe({ variant: "popper" });
+  return /* @__PURE__ */ O(X, { children: [
+    /* @__PURE__ */ t(E, { sx: { minWidth: 0 }, ...we(i), children: /* @__PURE__ */ t(Xe, { fontSize: "small" }) }),
+    /* @__PURE__ */ t(gt, { ...qt(i), children: /* @__PURE__ */ t(Dt, { onClickAway: i.close, children: /* @__PURE__ */ t(Z, { children: /* @__PURE__ */ t(j, { width: 500, p: 2, children: /* @__PURE__ */ t(
+      ke,
       {
         value: e.componentId,
-        onChange: (i, u) => e.componentId = u,
+        onChange: (l, u) => e.componentId = u,
         allComponents: r
       }
     ) }) }) }) })
   ] });
 }
-function Jr({
+function hr({
   value: e,
   valueImmutable: r,
-  onChange: o,
-  defaultLocale: i,
+  onChange: i,
+  defaultLocale: l,
   allComponents: u
 }) {
-  var w;
-  const [m, a] = J(!1), { t: b, locale: g } = D(), f = typeof (e == null ? void 0 : e.componentId) == "string" ? (w = u[e.componentId]) == null ? void 0 : w.data : void 0;
-  return f ? /* @__PURE__ */ S(R, { sx: { width: "100%", position: "relative" }, children: [
+  var k;
+  const [b, a] = Q(!1), { t: x, locale: g } = C(), y = typeof (e == null ? void 0 : e.componentId) == "string" ? (k = u[e.componentId]) == null ? void 0 : k.data : void 0;
+  return y ? /* @__PURE__ */ O(j, { sx: { width: "100%", position: "relative" }, children: [
     /* @__PURE__ */ t(
-      ue,
+      ae,
       {
         sx: { minWidth: 0 },
-        disabled: !f,
+        disabled: !y,
         size: "small",
-        onClick: () => a(!m),
-        color: m ? "primary" : "default",
-        children: /* @__PURE__ */ t(dt, { fontSize: "small" })
+        onClick: () => a(!b),
+        color: b ? "primary" : "default",
+        children: /* @__PURE__ */ t(Xe, { fontSize: "small" })
       }
     ),
-    /* @__PURE__ */ t(St, { in: m, timeout: "auto", unmountOnExit: !0, sx: { width: "100%", zIndex: 10 }, children: /* @__PURE__ */ S(
-      ee,
+    /* @__PURE__ */ t(vt, { in: b, timeout: "auto", unmountOnExit: !0, sx: { width: "100%", zIndex: 10 }, children: /* @__PURE__ */ O(
+      Z,
       {
         elevation: 1,
         sx: {
@@ -1425,133 +1239,133 @@ function Jr({
           width: "100%"
         },
         children: [
-          /* @__PURE__ */ t(R, { width: "100%", mb: 2, children: /* @__PURE__ */ t(
-            bt,
+          /* @__PURE__ */ t(j, { width: "100%", mb: 2, children: /* @__PURE__ */ t(
+            lt,
             {
-              config: f,
+              config: y,
               currentLocale: g,
-              defaultLocale: i,
+              defaultLocale: l,
               allComponents: u,
               propertiesValue: e == null ? void 0 : e.properties,
-              onChange: ({ id: p, value: l }) => {
-                const s = tr(l.value), n = JSON.parse(JSON.stringify(e));
-                r ? o == null || o({ ...n, properties: { ...n.properties, [p]: { value: s } } }) : (n.properties = n.properties ?? {}, n.properties[p] = { value: s }, o == null || o(n));
+              onChange: ({ id: v, value: o }) => {
+                const n = Rt(o.value), c = JSON.parse(JSON.stringify(e));
+                r ? i == null || i({ ...c, properties: { ...c.properties, [v]: { value: n } } }) : (c.properties = c.properties ?? {}, c.properties[v] = { value: n }, i == null || i(c));
               }
             }
           ) }),
-          /* @__PURE__ */ t(T, { size: "small", onClick: () => a(!1), sx: { mt: 1 }, children: b("close") })
+          /* @__PURE__ */ t(E, { size: "small", onClick: () => a(!1), sx: { mt: 1 }, children: x("close") })
         ]
       }
     ) })
   ] }) : null;
 }
-function ht({
+function it({
   type: e = "properties",
   component: r,
-  ...o
+  ...i
 }) {
-  var p, l, s;
-  const { t: i } = D(), {
+  var v, o, n;
+  const { t: l } = C(), {
     state: {
       components: u,
-      supportedLocales: m,
+      supportedLocales: b,
       config: { defaultLocale: a }
     }
-  } = de(), b = xe(), g = te(r).doc, f = e === "properties" ? r.properties : e === "parameters" && ((p = r.renderer) == null ? void 0 : p.type) === "component" ? (l = u[r.renderer.componentId]) == null ? void 0 : l.data.properties : void 0, w = ((s = r.renderer) == null ? void 0 : s.type) === "component" ? r : void 0;
-  return /* @__PURE__ */ S(ke, { ...o, fullWidth: !0, maxWidth: "lg", children: [
-    /* @__PURE__ */ t(Qe, { children: i("i18nEditorTitle") }),
-    /* @__PURE__ */ t(Xe, { children: f && /* @__PURE__ */ t(j, { children: /* @__PURE__ */ S(He, { stickyHeader: !0, sx: { td: { verticalAlign: "top" } }, children: [
-      /* @__PURE__ */ t(Ye, { children: /* @__PURE__ */ t(ne, { children: m.map(({ locale: n, name: d }) => /* @__PURE__ */ S(se, { children: [
+  } = ce(), x = ye(), g = ee(r).doc, y = e === "properties" ? r.properties : e === "parameters" && ((v = r.renderer) == null ? void 0 : v.type) === "component" ? (o = u[r.renderer.componentId]) == null ? void 0 : o.data.properties : void 0, k = ((n = r.renderer) == null ? void 0 : n.type) === "component" ? r : void 0;
+  return /* @__PURE__ */ O(Je, { ...i, fullWidth: !0, maxWidth: "lg", children: [
+    /* @__PURE__ */ t(ht, { children: l("i18nEditorTitle") }),
+    /* @__PURE__ */ t(bt, { children: y && /* @__PURE__ */ t(R, { children: /* @__PURE__ */ O(Ke, { stickyHeader: !0, sx: { td: { verticalAlign: "top" } }, children: [
+      /* @__PURE__ */ t(Be, { children: /* @__PURE__ */ t(le, { children: b.map(({ locale: c, name: d }) => /* @__PURE__ */ O(oe, { children: [
         d,
-        a === n && /* @__PURE__ */ t(dr, { sx: { fontSize: 12, color: "text.secondary" } })
-      ] }, n)) }) }),
-      /* @__PURE__ */ t(Ge, { children: V(Object.values(f), "index").map(({ data: n }) => /* @__PURE__ */ t(ne, { children: m.map(({ locale: d }) => {
-        var y, P, c, x, v, k, O, h, I, z, N, E, U, W, re, Y, G, L, q, Q, je, ze, Ne, Ce, De, Ae;
-        return /* @__PURE__ */ t(se, { children: /* @__PURE__ */ t(j, { gap: 1, children: e === "properties" ? /* @__PURE__ */ S(H, { children: [
+        a === c && /* @__PURE__ */ t(Wt, { sx: { fontSize: 12, color: "text.secondary" } })
+      ] }, c)) }) }),
+      /* @__PURE__ */ t(Fe, { children: A(Object.values(y), "index").map(({ data: c }) => /* @__PURE__ */ t(le, { children: b.map(({ locale: d }) => {
+        var m, w, s, h, f, P, S, p, I, z, N, T, U, W, te, _, H, Y, L, q, Ie, Se, Oe, je, Re, ze;
+        return /* @__PURE__ */ t(oe, { children: /* @__PURE__ */ t(R, { gap: 1, children: e === "properties" ? /* @__PURE__ */ O(X, { children: [
           /* @__PURE__ */ t(
-            C,
+            V,
             {
               size: "small",
               label: "Key",
-              value: n.key || "",
-              onChange: (K) => {
+              value: c.key || "",
+              onChange: (B) => {
                 g.transact(() => {
-                  n.key = K.target.value.trim();
+                  c.key = B.target.value.trim();
                 });
               }
             }
           ),
           /* @__PURE__ */ t(
-            C,
+            V,
             {
               size: "small",
-              label: i("label"),
-              value: (((P = (y = n.locales) == null ? void 0 : y[d]) == null ? void 0 : P.name) ?? ((x = (c = n.locales) == null ? void 0 : c[a]) == null ? void 0 : x.name)) || "",
-              onChange: (K) => {
+              label: l("label"),
+              value: (((w = (m = c.locales) == null ? void 0 : m[d]) == null ? void 0 : w.name) ?? ((h = (s = c.locales) == null ? void 0 : s[a]) == null ? void 0 : h.name)) || "",
+              onChange: (B) => {
                 g.transact(() => {
-                  var B;
-                  n.locales ?? (n.locales = {}), (B = n.locales)[d] ?? (B[d] = {}), n.locales[d].name = K.target.value;
+                  var K;
+                  c.locales ?? (c.locales = {}), (K = c.locales)[d] ?? (K[d] = {}), c.locales[d].name = B.target.value;
                 });
               }
             }
           ),
-          /* @__PURE__ */ t(R, { children: /* @__PURE__ */ t(
-            _,
+          /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(
+            J,
             {
-              allComponents: b,
+              allComponents: x,
               defaultLocale: a,
               component: r,
-              property: n,
+              property: c,
               size: "small",
               fullWidth: !0,
               label: "Default Value",
-              valueImmutable: ae((k = (v = n.locales) == null ? void 0 : v[d]) == null ? void 0 : k.defaultValue),
-              value: ((h = (O = n.locales) == null ? void 0 : O[d]) == null ? void 0 : h.defaultValue) ?? ((z = (I = n.locales) == null ? void 0 : I[a]) == null ? void 0 : z.defaultValue),
-              onChange: (K) => {
+              valueImmutable: se((P = (f = c.locales) == null ? void 0 : f[d]) == null ? void 0 : P.defaultValue),
+              value: ((p = (S = c.locales) == null ? void 0 : S[d]) == null ? void 0 : p.defaultValue) ?? ((z = (I = c.locales) == null ? void 0 : I[a]) == null ? void 0 : z.defaultValue),
+              onChange: (B) => {
                 g.transact(() => {
-                  var B;
-                  n.locales ?? (n.locales = {}), (B = n.locales)[d] ?? (B[d] = {}), n.locales[d].defaultValue = K;
+                  var K;
+                  c.locales ?? (c.locales = {}), (K = c.locales)[d] ?? (K[d] = {}), c.locales[d].defaultValue = B;
                 });
               }
             }
           ) })
-        ] }) : e === "parameters" && w ? /* @__PURE__ */ t(R, { children: /* @__PURE__ */ t(
-          _,
+        ] }) : e === "parameters" && k ? /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(
+          J,
           {
-            allComponents: b,
+            allComponents: x,
             defaultLocale: a,
             component: r,
-            property: n,
+            property: c,
             size: "small",
             fullWidth: !0,
-            valueImmutable: ae(
-              (W = (U = (E = (N = w.renderer.properties) == null ? void 0 : N[n.id]) == null ? void 0 : E.locales) == null ? void 0 : U[d]) == null ? void 0 : W.value
+            valueImmutable: se(
+              (W = (U = (T = (N = k.renderer.properties) == null ? void 0 : N[c.id]) == null ? void 0 : T.locales) == null ? void 0 : U[d]) == null ? void 0 : W.value
             ),
-            value: ((L = (G = (Y = (re = w.renderer.properties) == null ? void 0 : re[n.id]) == null ? void 0 : Y.locales) == null ? void 0 : G[d]) == null ? void 0 : L.value) ?? ((ze = (je = (Q = (q = w.renderer.properties) == null ? void 0 : q[n.id]) == null ? void 0 : Q.locales) == null ? void 0 : je[a]) == null ? void 0 : ze.value) ?? ((Ce = (Ne = n.locales) == null ? void 0 : Ne[d]) == null ? void 0 : Ce.defaultValue) ?? ((Ae = (De = n.locales) == null ? void 0 : De[a]) == null ? void 0 : Ae.defaultValue),
-            onChange: (K) => {
+            value: ((Y = (H = (_ = (te = k.renderer.properties) == null ? void 0 : te[c.id]) == null ? void 0 : _.locales) == null ? void 0 : H[d]) == null ? void 0 : Y.value) ?? ((Se = (Ie = (q = (L = k.renderer.properties) == null ? void 0 : L[c.id]) == null ? void 0 : q.locales) == null ? void 0 : Ie[a]) == null ? void 0 : Se.value) ?? ((je = (Oe = c.locales) == null ? void 0 : Oe[d]) == null ? void 0 : je.defaultValue) ?? ((ze = (Re = c.locales) == null ? void 0 : Re[a]) == null ? void 0 : ze.defaultValue),
+            onChange: (B) => {
               g.transact(() => {
-                var B, Te, Ve, Ee, Ue;
-                (B = w.renderer).properties ?? (B.properties = {}), (Te = w.renderer.properties)[Ve = n.id] ?? (Te[Ve] = {}), (Ee = w.renderer.properties[n.id]).locales ?? (Ee.locales = {}), (Ue = w.renderer.properties[n.id].locales)[d] ?? (Ue[d] = {}), w.renderer.properties[n.id].locales[d].value = K;
+                var K, Ne, Ve, Ce, De;
+                (K = k.renderer).properties ?? (K.properties = {}), (Ne = k.renderer.properties)[Ve = c.id] ?? (Ne[Ve] = {}), (Ce = k.renderer.properties[c.id]).locales ?? (Ce.locales = {}), (De = k.renderer.properties[c.id].locales)[d] ?? (De[d] = {}), k.renderer.properties[c.id].locales[d].value = B;
               });
             }
           }
-        ) }) : null }, n.id) }, d);
-      }) }, n.id)) })
+        ) }) : null }, c.id) }, d);
+      }) }, c.id)) })
     ] }) }) }),
-    /* @__PURE__ */ t(Ze, { children: /* @__PURE__ */ t(T, { onClick: (n) => {
+    /* @__PURE__ */ t(yt, { children: /* @__PURE__ */ t(E, { onClick: (c) => {
       var d;
-      return (d = o.onClose) == null ? void 0 : d.call(o, n, "escapeKeyDown");
-    }, children: i("close") }) })
+      return (d = i.onClose) == null ? void 0 : d.call(i, c, "escapeKeyDown");
+    }, children: l("close") }) })
   ] });
 }
-const _e = (e, r) => (o) => {
-  const i = [
-    o.palette.info.main,
-    o.palette.primary.main,
-    o.palette.secondary.main,
-    o.palette.success.main,
-    o.palette.warning.main
-  ], u = Math.min(i.length - 1, e), m = i[u], a = Ke(m, 0.5), b = Ke(m, 1);
+const Ue = (e, r) => (i) => {
+  const l = [
+    i.palette.info.main,
+    i.palette.primary.main,
+    i.palette.secondary.main,
+    i.palette.success.main,
+    i.palette.warning.main
+  ], u = Math.min(l.length - 1, e), b = l[u], a = Ae(b, 0.5), x = Ae(b, 1);
   return {
     // 保留原有的边框样式
     borderColor: `${a} !important`,
@@ -1559,117 +1373,117 @@ const _e = (e, r) => (o) => {
     // 稍粗的左侧边框
     borderLeftColor: a,
     // 使用透明度适应深色/浅色模式
-    color: b,
+    color: x,
     ...r
   };
 };
-function Mr({
+function br({
   property: e,
   onChange: r,
-  defaultLocale: o,
-  allComponents: i
+  defaultLocale: i,
+  allComponents: l
 }) {
-  const { t: u, locale: m } = D(), a = $(null), b = $r(a, e), g = A(() => {
+  const { t: u, locale: b } = C(), a = F(null), x = pr(a, e), g = D(() => {
     if (!(e.type !== "json" && e.type !== "yaml" && e.type !== "array") && e.subProperties)
       try {
-        const f = {};
-        V(Object.values(e.subProperties), "index").filter(
-          (l) => l.data.visible !== !1 && l.data.key
-        ).forEach(({ data: l }) => {
-          var n, d, y, P;
-          if (!l.key) return;
-          let s = ((d = (n = l.locales) == null ? void 0 : n[m]) == null ? void 0 : d.defaultValue) ?? ((P = (y = l.locales) == null ? void 0 : y[o]) == null ? void 0 : P.defaultValue);
-          if (l.type === "number")
-            s = Number(s);
-          else if (l.type === "boolean")
-            s = s === !0 || s === "true";
-          else if ((l.type === "json" || l.type === "yaml") && typeof s == "string")
+        const y = {};
+        A(Object.values(e.subProperties), "index").filter(
+          (o) => o.data.visible !== !1 && o.data.key
+        ).forEach(({ data: o }) => {
+          var c, d, m, w;
+          if (!o.key) return;
+          let n = ((d = (c = o.locales) == null ? void 0 : c[b]) == null ? void 0 : d.defaultValue) ?? ((w = (m = o.locales) == null ? void 0 : m[i]) == null ? void 0 : w.defaultValue);
+          if (o.type === "number")
+            n = Number(n);
+          else if (o.type === "boolean")
+            n = n === !0 || n === "true";
+          else if ((o.type === "json" || o.type === "yaml") && typeof n == "string")
             try {
-              l.type === "json" ? s = JSON.parse(s) : s = be.parse(s);
-            } catch (c) {
-              console.error("Error parsing nested value", s, c), s = {};
+              o.type === "json" ? n = JSON.parse(n) : n = pe.parse(n);
+            } catch (s) {
+              console.error("Error parsing nested value", n, s), n = {};
             }
-          f[l.key] = s;
+          y[o.key] = n;
         });
-        const p = ge(f, e.type);
-        r == null || r(p);
-      } catch (f) {
-        console.error("Error converting structure to text:", f);
+        const v = be(y, e.type);
+        r == null || r(v);
+      } catch (y) {
+        console.error("Error converting structure to text:", y);
       }
-  }, [e, m, o, r]);
-  return e.type !== "json" && e.type !== "yaml" && e.type !== "array" ? null : /* @__PURE__ */ S(j, { direction: "column", gap: 1.5, sx: { width: "100%" }, ref: a, children: [
-    /* @__PURE__ */ t(Ot, { sx: { mt: -1 }, children: /* @__PURE__ */ t(F, { variant: "caption", color: "text.secondary", children: u("maker.properties.subProperties") }) }),
+  }, [e, b, i, r]);
+  return e.type !== "json" && e.type !== "yaml" && e.type !== "array" ? null : /* @__PURE__ */ O(R, { direction: "column", gap: 1.5, sx: { width: "100%" }, ref: a, children: [
+    /* @__PURE__ */ t(xt, { sx: { mt: -1 }, children: /* @__PURE__ */ t(M, { variant: "caption", color: "text.secondary", children: u("maker.properties.subProperties") }) }),
     e.subProperties && Object.keys(e.subProperties).length > 0 ? /* @__PURE__ */ t(
-      mt,
+      tt,
       {
-        component: j,
+        component: R,
         gap: 2,
         list: e.subProperties,
-        renderItem: (f, w, p) => {
-          const l = f.visible !== !1;
+        renderItem: (y, k, v) => {
+          const o = y.visible !== !1;
           return /* @__PURE__ */ t(
-            ee,
+            Z,
             {
               elevation: 0,
               className: "property-container",
               sx: {
                 p: 1.25,
                 borderRadius: 1,
-                border: l ? "1px solid" : "1px dashed",
-                "&": _e(b)
+                border: o ? "1px solid" : "1px dashed",
+                "&": Ue(x)
               },
-              children: /* @__PURE__ */ t(j, { gap: 2, children: /* @__PURE__ */ t(
-                ft,
+              children: /* @__PURE__ */ t(R, { gap: 2, children: /* @__PURE__ */ t(
+                rt,
                 {
-                  data: f,
-                  params: p,
-                  visible: l,
+                  data: y,
+                  params: v,
+                  visible: o,
                   config: {
                     properties: e.subProperties
                   },
-                  currentLocale: m,
-                  defaultLocale: o,
-                  allComponents: i,
-                  onUpdateConfig: (s) => {
+                  currentLocale: b,
+                  defaultLocale: i,
+                  allComponents: l,
+                  onUpdateConfig: (n) => {
                     try {
-                      const n = { properties: e.subProperties || {} };
-                      s(n);
+                      const c = { properties: e.subProperties || {} };
+                      n(c);
                       const d = {
                         ...e,
-                        subProperties: n.properties
+                        subProperties: c.properties
                       };
                       r == null || r(d, { forceUpdateProperty: !0 }), g();
-                    } catch (n) {
-                      console.error("Error updating property:", n);
+                    } catch (c) {
+                      console.error("Error updating property:", c);
                     }
                   }
                 }
               ) })
             },
-            f.id
+            y.id
           );
         }
       }
-    ) : /* @__PURE__ */ t(Z, { style: { fontSize: 12, height: 100 }, children: u("maker.properties.noSubProperties") }),
+    ) : /* @__PURE__ */ t(de, { style: { fontSize: 12, height: 100 }, children: u("maker.properties.noSubProperties") }),
     /* @__PURE__ */ t(
-      T,
+      E,
       {
         fullWidth: !0,
         variant: "outlined",
         className: "ignore-style-override",
         size: "small",
-        startIcon: /* @__PURE__ */ t(ct, {}),
+        startIcon: /* @__PURE__ */ t(Ge, {}),
         onClick: () => {
           try {
-            const f = e.subProperties || {}, w = Me(), l = {
-              index: Object.values(f).length,
+            const y = e.subProperties || {}, k = We(), o = {
+              index: Object.values(y).length,
               data: {
-                id: w,
+                id: k,
                 key: "",
                 type: "string",
                 visible: !0,
                 locales: {
-                  [m]: {
+                  [b]: {
                     name: "",
                     defaultValue: ""
                   }
@@ -1677,20 +1491,20 @@ function Mr({
                 // 为嵌套属性预初始化
                 subProperties: {}
               }
-            }, s = {
+            }, n = {
               ...e,
               subProperties: {
-                ...f,
-                [w]: l
+                ...y,
+                [k]: o
               }
             };
-            r == null || r(s, { forceUpdateProperty: !0 }), g();
-          } catch (f) {
-            console.error("Error adding property:", f);
+            r == null || r(n, { forceUpdateProperty: !0 }), g();
+          } catch (y) {
+            console.error("Error adding property:", y);
           }
         },
         sx: {
-          "&": _e(b, {
+          "&": Ue(x, {
             // borderLeft: undefined,
           })
         },
@@ -1699,219 +1513,219 @@ function Mr({
     )
   ] });
 }
-function _({
+function J({
   component: e,
   property: r,
-  value: o,
-  onChange: i,
+  value: i,
+  onChange: l,
   valueImmutable: u,
-  defaultLocale: m,
+  defaultLocale: b,
   allComponents: a,
-  ...b
+  ...x
 }) {
-  var s, n, d, y, P;
-  const { locale: g } = D(), f = Zt(), w = $(null), p = () => {
-    var x;
-    const c = (x = f == null ? void 0 : f.current) == null ? void 0 : x.getUploader();
-    c == null || c.open(), w.current && c.onceUploadSuccess(({ response: v }) => {
-      var O, h;
-      let k = ((O = v == null ? void 0 : v.data) == null ? void 0 : O.filename) || "";
-      k && (k = `mediakit://${k}`, o && !o.includes("mediakit://") && (k += " # please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address")), (h = w.current) == null || h.call(w, k);
+  var n, c, d, m, w;
+  const { locale: g } = C(), y = St(), k = F(null), v = () => {
+    var h;
+    const s = (h = y == null ? void 0 : y.current) == null ? void 0 : h.getUploader();
+    s == null || s.open(), k.current && s.onceUploadSuccess(({ response: f }) => {
+      var S, p;
+      let P = ((S = f == null ? void 0 : f.data) == null ? void 0 : S.filename) || "";
+      P && (P = `mediakit://${P}`, i && !i.includes("mediakit://") && (P += " # please use < import { getMediaKitAbsoluteUrl } from '@blocklet/pages-kit/builtin/utils' > to get the full address")), (p = k.current) == null || p.call(k, P);
     });
-  }, l = b.label ?? (((n = (s = r.locales) == null ? void 0 : s[g]) == null ? void 0 : n.name) || ((y = (d = r.locales) == null ? void 0 : d[m]) == null ? void 0 : y.name) || r.key || r.id);
+  }, o = x.label ?? (((c = (n = r.locales) == null ? void 0 : n[g]) == null ? void 0 : c.name) || ((m = (d = r.locales) == null ? void 0 : d[b]) == null ? void 0 : m.name) || r.key || r.id);
   if (r.type === "number")
     return /* @__PURE__ */ t(
-      Hr,
+      yr,
       {
-        ...b,
-        label: l,
+        ...x,
+        label: o,
         NumberProps: {
-          value: ["number", "string"].includes(typeof o) ? o : null,
-          onChange: (c, x) => i == null ? void 0 : i(x)
+          value: ["number", "string"].includes(typeof i) ? i : null,
+          onChange: (s, h) => l == null ? void 0 : l(h)
         }
       }
     );
   if (r.type === "decimal")
     return /* @__PURE__ */ t(
-      C,
+      V,
       {
-        ...b,
-        label: l,
+        ...x,
+        label: o,
         type: "text",
-        value: o ?? "",
-        onChange: (c) => {
-          const x = c.target.value;
-          if (x === "" || x === "-") {
-            i == null || i(x);
+        value: i ?? "",
+        onChange: (s) => {
+          const h = s.target.value;
+          if (h === "" || h === "-") {
+            l == null || l(h);
             return;
           }
-          if (/^-?(?!.*\..*\.)[0-9]*(\.[0-9]{0,9})?$/.test(x)) {
-            let k = x;
-            /^-?[1-9]+[0-9]*(\.[0-9]{1,9})?$/.test(k) && (k = Number(k)), i == null || i(k);
+          if (/^-?(?!.*\..*\.)[0-9]*(\.[0-9]{0,9})?$/.test(h)) {
+            let P = h;
+            /^-?[1-9]+[0-9]*(\.[0-9]{1,9})?$/.test(P) && (P = Number(P)), l == null || l(P);
           }
         }
       }
     );
   if (r.type === "boolean")
     return /* @__PURE__ */ t(
-      Le,
+      mt,
       {
-        label: l,
+        label: o,
         labelPlacement: "start",
-        control: /* @__PURE__ */ t(qe, { checked: o === !0, onChange: (c, x) => i == null ? void 0 : i(x) })
+        control: /* @__PURE__ */ t(ft, { checked: i === !0, onChange: (s, h) => l == null ? void 0 : l(h) })
       }
     );
   if (r.type === "color")
     return /* @__PURE__ */ t(
-      Dr,
+      ir,
       {
-        label: l,
-        value: o,
-        onChange: (c) => {
-          i == null || i(c);
+        label: o,
+        value: i,
+        onChange: (s) => {
+          l == null || l(s);
         }
       }
     );
   if (r.type === "json" || r.type === "yaml")
     return /* @__PURE__ */ t(
-      Ar,
+      lr,
       {
-        label: l,
-        value: o,
-        onChange: (c) => {
-          i == null || i(c);
+        label: o,
+        value: i,
+        onChange: (s) => {
+          l == null || l(s);
         },
         property: r,
         component: e,
-        defaultLocale: m,
+        defaultLocale: b,
         allComponents: a,
-        PropertyValueField: _,
-        onUpload: (c) => {
-          w.current = c, p();
+        PropertyValueField: J,
+        onUpload: (s) => {
+          k.current = s, v();
         }
       }
     );
   if (r.type === "custom") {
-    const c = (P = a[r.componentId]) == null ? void 0 : P.data;
-    return c ? /* @__PURE__ */ t(R, { width: "100%", children: /* @__PURE__ */ t(
-      nt,
+    const s = (w = a[r.componentId]) == null ? void 0 : w.data;
+    return s ? /* @__PURE__ */ t(j, { width: "100%", children: /* @__PURE__ */ t(
+      Le,
       {
-        componentId: c.id,
-        props: { label: l, value: o, onChange: i },
+        componentId: s.id,
+        props: { label: o, value: i, onChange: l },
         locale: g,
         dev: {
           mode: "draft",
           components: a,
-          defaultLocale: m
+          defaultLocale: b
         }
       }
-    ) }) : /* @__PURE__ */ t(C, { ...b, label: l, disabled: !0, placeholder: "Click right button select a component" });
+    ) }) : /* @__PURE__ */ t(V, { ...x, label: o, disabled: !0, placeholder: "Click right button select a component" });
   }
   if (r.type === "component")
-    return /* @__PURE__ */ S(j, { width: "100%", direction: "column", gap: 1, children: [
+    return /* @__PURE__ */ O(R, { width: "100%", direction: "column", gap: 1, children: [
       /* @__PURE__ */ t(
-        Re,
+        ke,
         {
           allComponents: a,
-          label: l,
-          value: o == null ? void 0 : o.componentId,
-          onChange: (c, x) => {
-            u || !o ? i == null || i({ ...o && JSON.parse(JSON.stringify(o)), componentId: x }) : typeof o == "object" && (o.componentId = x, i == null || i({ ...o && JSON.parse(JSON.stringify(o)), componentId: x }));
+          label: o,
+          value: i == null ? void 0 : i.componentId,
+          onChange: (s, h) => {
+            u || !i ? l == null || l({ ...i && JSON.parse(JSON.stringify(i)), componentId: h }) : typeof i == "object" && (i.componentId = h, l == null || l({ ...i && JSON.parse(JSON.stringify(i)), componentId: h }));
           }
         }
       ),
-      (o == null ? void 0 : o.componentId) && /* @__PURE__ */ t(
-        Jr,
+      (i == null ? void 0 : i.componentId) && /* @__PURE__ */ t(
+        hr,
         {
-          value: o,
+          value: i,
           valueImmutable: u,
-          onChange: i,
-          defaultLocale: m,
+          onChange: l,
+          defaultLocale: b,
           allComponents: a
         }
       )
     ] });
   if (!r.type || ["string", "url", "multiline"].includes(r.type)) {
-    let c = r.type === "string" ? r.multiline : void 0;
-    r.type === "multiline" && (c = !0);
-    const x = r.type === "url" ? o == null ? void 0 : o.url : o;
+    let s = r.type === "string" ? r.multiline : void 0;
+    r.type === "multiline" && (s = !0);
+    const h = r.type === "url" ? i == null ? void 0 : i.url : i;
     return /* @__PURE__ */ t(
-      C,
+      V,
       {
-        ...b,
-        label: l,
-        value: typeof x == "string" ? x : "",
-        multiline: c,
-        minRows: c ? 2 : void 0,
-        maxRows: c ? 10 : void 0,
-        onChange: (v) => i == null ? void 0 : i(
-          r.type === "url" ? { ...o, url: v.target.value, mediaKitUrl: v.target.value } : v.target.value
+        ...x,
+        label: o,
+        value: typeof h == "string" ? h : "",
+        multiline: s,
+        minRows: s ? 2 : void 0,
+        maxRows: s ? 10 : void 0,
+        onChange: (f) => l == null ? void 0 : l(
+          r.type === "url" ? { ...i, url: f.target.value, mediaKitUrl: f.target.value } : f.target.value
         ),
         InputProps: r.type === "url" ? {
           sx: {
             pr: 0
           },
-          endAdornment: /* @__PURE__ */ S(pe, { position: "end", children: [
+          endAdornment: /* @__PURE__ */ O(xe, { position: "end", children: [
             /* @__PURE__ */ t(
-              Pe,
+              Ye,
               {
-                onChange: async ({ response: v }) => {
+                onChange: async ({ response: f }) => {
                   var I, z, N;
-                  const k = ((I = v == null ? void 0 : v.data) == null ? void 0 : I.url) || ((z = v == null ? void 0 : v.data) == null ? void 0 : z.fileUrl);
-                  let O;
-                  k && (O = await fe(k).catch(() => he(k)).catch(() => {
+                  const P = ((I = f == null ? void 0 : f.data) == null ? void 0 : I.url) || ((z = f == null ? void 0 : f.data) == null ? void 0 : z.fileUrl);
+                  let S;
+                  P && (S = await Ot(P).catch(() => jt(P)).catch(() => {
                   }));
-                  let h = ((N = v == null ? void 0 : v.data) == null ? void 0 : N.filename) || "";
-                  h && (h = `mediakit://${h}`), i == null || i({
-                    url: k,
-                    mediaKitUrl: h,
-                    width: O == null ? void 0 : O.naturalWidth,
-                    height: O == null ? void 0 : O.naturalHeight
+                  let p = ((N = f == null ? void 0 : f.data) == null ? void 0 : N.filename) || "";
+                  p && (p = `mediakit://${p}`), l == null || l({
+                    url: P,
+                    mediaKitUrl: p,
+                    width: S == null ? void 0 : S.naturalWidth,
+                    height: S == null ? void 0 : S.naturalHeight
                   });
                 }
               }
             ),
-            /* @__PURE__ */ t(X, { 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__ */ t(at, { sx: { cursor: "default", mr: 1 }, fontSize: "small" }) })
+            /* @__PURE__ */ t(G, { 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__ */ t(Qe, { sx: { cursor: "default", mr: 1 }, fontSize: "small" }) })
           ] })
         } : void 0
       }
     );
   }
   return r.type === "array" ? /* @__PURE__ */ t(
-    Ir,
+    rr,
     {
-      label: l,
-      value: Array.isArray(o) ? o : [],
-      onChange: (c) => i == null ? void 0 : i(c),
+      label: o,
+      value: Array.isArray(i) ? i : [],
+      onChange: (s) => l == null ? void 0 : l(s),
       property: r,
-      renderItem: ({ item: c, index: x, onChange: v }) => r.subProperties && Object.keys(r.subProperties).length > 0 ? /* @__PURE__ */ t(j, { gap: 1, width: "100%", children: V(Object.values(r.subProperties), "index").filter((k) => k.data.visible !== !1).map(({ data: k }) => k.key ? /* @__PURE__ */ t(
-        _,
+      renderItem: ({ item: s, index: h, onChange: f }) => r.subProperties && Object.keys(r.subProperties).length > 0 ? /* @__PURE__ */ t(R, { gap: 1, width: "100%", children: A(Object.values(r.subProperties), "index").filter((P) => P.data.visible !== !1).map(({ data: P }) => P.key ? /* @__PURE__ */ t(
+        J,
         {
           component: e,
-          property: k,
-          value: c[k.key],
-          onChange: (O) => {
-            const h = { ...c, [k.key]: O };
-            v(h);
+          property: P,
+          value: s[P.key],
+          onChange: (S) => {
+            const p = { ...s, [P.key]: S };
+            f(p);
           },
           size: "small",
           fullWidth: !0,
-          defaultLocale: m,
+          defaultLocale: b,
           allComponents: a
         },
-        k.id
-      ) : null) }, x) : /* @__PURE__ */ t(C, { size: b.size, fullWidth: !0, value: c, onChange: (k) => v(k.target.value) })
+        P.id
+      ) : null) }, h) : /* @__PURE__ */ t(V, { size: x.size, fullWidth: !0, value: s, onChange: (P) => f(P.target.value) })
     }
   ) : (console.error("Unsupported property type", r.type), null);
 }
-function Hr({
+function yr({
   NumberProps: e,
   ...r
 }) {
-  const { getInputProps: o } = or(e), i = o();
-  return /* @__PURE__ */ t(C, { ...r, inputProps: i });
+  const { getInputProps: i } = Ct(e), l = i();
+  return /* @__PURE__ */ t(V, { ...r, inputProps: l });
 }
-const Yr = `import React from '@blocklet/pages-kit/builtin/react'
+const vr = `import React from '@blocklet/pages-kit/builtin/react'
 import { Box } from '@blocklet/pages-kit/builtin/mui/material'
 
 export default function () {
@@ -1920,232 +1734,235 @@ export default function () {
       Hello World
     </Box>
   )
-}`, Gr = `console.log('hello')
+}`, xr = `console.log('hello')
 `;
-function Lr({
+function gr({
   value: e
 }) {
-  const { locale: r } = D(), o = it(), i = te(e).doc;
-  return M(() => {
+  const { locale: r } = C(), i = $e(), l = ee(e).doc;
+  return $(() => {
     var u;
-    (u = e.renderer) != null && u.script || (i.transact(() => {
-      e.renderer.script = e.renderer.type === "react-component" ? Yr : Gr;
-    }), o());
-  }, [e]), /* @__PURE__ */ t(R, { sx: { border: 1, borderColor: "divider", borderRadius: 1, overflow: "hidden" }, children: /* @__PURE__ */ t(
-    we,
+    (u = e.renderer) != null && u.script || (l.transact(() => {
+      e.renderer.script = e.renderer.type === "react-component" ? vr : xr;
+    }), i());
+  }, [e]), /* @__PURE__ */ t(j, { sx: { border: 1, borderColor: "divider", borderRadius: 1, overflow: "hidden" }, children: /* @__PURE__ */ t(
+    ve,
     {
       keyId: e.id,
       locale: r,
       language: "typescript",
       value: e.renderer.script || "",
       onChange: (u) => e.renderer.script = u,
-      typeScriptNoValidation: !1
+      typeScriptNoValidation: !1,
+      fullScreenOptions: {
+        enableEscExit: !0
+      }
     },
     e.id
   ) });
 }
-function qr({ value: e }) {
-  var w, p, l;
-  const { t: r } = D(), o = te(e).doc, {
+function Pr({ value: e }) {
+  var k, v, o;
+  const { t: r } = C(), i = ee(e).doc, {
     state: {
-      components: i,
+      components: l,
       config: { defaultLocale: u },
-      resources: m
+      resources: b
     },
     localState: { currentLocale: a }
-  } = de(), b = xe(), g = ((w = i[e.renderer.componentId]) == null ? void 0 : w.data) ?? ((l = (p = m.components) == null ? void 0 : p[e.renderer.componentId]) == null ? void 0 : l.component), f = Se({ variant: "dialog" });
-  return /* @__PURE__ */ S(j, { gap: 1, children: [
+  } = ce(), x = ye(), g = ((k = l[e.renderer.componentId]) == null ? void 0 : k.data) ?? ((o = (v = b.components) == null ? void 0 : v[e.renderer.componentId]) == null ? void 0 : o.component), y = Pe({ variant: "dialog" });
+  return /* @__PURE__ */ O(R, { gap: 1, children: [
     /* @__PURE__ */ t(
-      Re,
+      ke,
       {
-        allComponents: b,
+        allComponents: x,
         excludes: [e.id],
         value: e.renderer.componentId,
-        onChange: (s, n) => e.renderer.componentId = n
+        onChange: (n, c) => e.renderer.componentId = c
       }
     ),
-    g && /* @__PURE__ */ S(H, { children: [
-      /* @__PURE__ */ S(j, { direction: "row", justifyContent: "space-between", alignItems: "center", children: [
-        /* @__PURE__ */ t(F, { variant: "subtitle2", children: r("parameters") }),
-        /* @__PURE__ */ t(T, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...Oe(f), children: /* @__PURE__ */ t(st, { fontSize: "small" }) })
+    g && /* @__PURE__ */ O(X, { children: [
+      /* @__PURE__ */ O(R, { direction: "row", justifyContent: "space-between", alignItems: "center", children: [
+        /* @__PURE__ */ t(M, { variant: "subtitle2", children: r("parameters") }),
+        /* @__PURE__ */ t(E, { sx: { minWidth: 32, minHeight: 32, p: 0 }, ...we(y), children: /* @__PURE__ */ t(qe, { fontSize: "small" }) })
       ] }),
-      g.properties && V(Object.values(g.properties), "index").map(({ data: s }) => {
-        var n, d, y, P, c, x, v, k, O, h, I, z, N, E, U, W;
-        return /* @__PURE__ */ t(R, { children: /* @__PURE__ */ t(
-          _,
+      g.properties && A(Object.values(g.properties), "index").map(({ data: n }) => {
+        var c, d, m, w, s, h, f, P, S, p, I, z, N, T, U, W;
+        return /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(
+          J,
           {
-            allComponents: b,
+            allComponents: x,
             defaultLocale: u,
             component: g,
-            property: s,
+            property: n,
             fullWidth: !0,
             size: "small",
-            valueImmutable: ae((P = (y = (d = (n = e.renderer.properties) == null ? void 0 : n[s.id]) == null ? void 0 : d.locales) == null ? void 0 : y[a]) == null ? void 0 : P.value),
-            value: ((k = (v = (x = (c = e.renderer.properties) == null ? void 0 : c[s.id]) == null ? void 0 : x.locales) == null ? void 0 : v[a]) == null ? void 0 : k.value) ?? ((z = (I = (h = (O = e.renderer.properties) == null ? void 0 : O[s.id]) == null ? void 0 : h.locales) == null ? void 0 : I[u]) == null ? void 0 : z.value) ?? ((E = (N = s.locales) == null ? void 0 : N[a]) == null ? void 0 : E.defaultValue) ?? ((W = (U = s.locales) == null ? void 0 : U[u]) == null ? void 0 : W.defaultValue),
-            onChange: (re) => {
-              o.transact(() => {
-                var Y, G, L, q, Q;
-                (Y = e.renderer).properties ?? (Y.properties = {}), (G = e.renderer.properties)[L = s.id] ?? (G[L] = {}), (q = e.renderer.properties[s.id]).locales ?? (q.locales = {}), (Q = e.renderer.properties[s.id].locales)[a] ?? (Q[a] = {}), e.renderer.properties[s.id].locales[a].value = re;
+            valueImmutable: se((w = (m = (d = (c = e.renderer.properties) == null ? void 0 : c[n.id]) == null ? void 0 : d.locales) == null ? void 0 : m[a]) == null ? void 0 : w.value),
+            value: ((P = (f = (h = (s = e.renderer.properties) == null ? void 0 : s[n.id]) == null ? void 0 : h.locales) == null ? void 0 : f[a]) == null ? void 0 : P.value) ?? ((z = (I = (p = (S = e.renderer.properties) == null ? void 0 : S[n.id]) == null ? void 0 : p.locales) == null ? void 0 : I[u]) == null ? void 0 : z.value) ?? ((T = (N = n.locales) == null ? void 0 : N[a]) == null ? void 0 : T.defaultValue) ?? ((W = (U = n.locales) == null ? void 0 : U[u]) == null ? void 0 : W.defaultValue),
+            onChange: (te) => {
+              i.transact(() => {
+                var _, H, Y, L, q;
+                (_ = e.renderer).properties ?? (_.properties = {}), (H = e.renderer.properties)[Y = n.id] ?? (H[Y] = {}), (L = e.renderer.properties[n.id]).locales ?? (L.locales = {}), (q = e.renderer.properties[n.id].locales)[a] ?? (q[a] = {}), e.renderer.properties[n.id].locales[a].value = te;
               });
             }
           }
-        ) }, s.id);
+        ) }, n.id);
       }),
-      /* @__PURE__ */ t(ht, { ...ut(f), component: e, type: "parameters" })
+      /* @__PURE__ */ t(it, { ...Ze(y), component: e, type: "parameters" })
     ] })
   ] });
 }
-function Re({
+function ke({
   label: e,
   options: r,
-  excludes: o,
-  value: i,
+  excludes: i,
+  value: l,
   onChange: u,
-  allComponents: m,
+  allComponents: b,
   ...a
 }) {
-  var w;
-  const { t: b } = D(), g = r ?? V(Object.values(hr(m, ...o ?? [])), "index").map((p) => p.data), f = (typeof i == "string" ? (w = m[i]) == null ? void 0 : w.data : void 0) ?? null;
+  var k;
+  const { t: x } = C(), g = r ?? A(Object.values(Ht(b, ...i ?? [])), "index").map((v) => v.data), y = (typeof l == "string" ? (k = b[l]) == null ? void 0 : k.data : void 0) ?? null;
   return /* @__PURE__ */ t(
-    et,
+    Me,
     {
       ...a,
       size: "small",
       options: g,
       autoHighlight: !0,
-      isOptionEqualToValue: (p, l) => p.id === l.id,
-      getOptionKey: (p) => p.id,
-      getOptionLabel: (p) => p.name || p.id,
-      renderInput: (p) => /* @__PURE__ */ t(C, { label: e || b("component"), ...p }),
-      value: f,
-      onChange: (p, l) => {
-        var n, d, y, P, c, x;
-        let s = {};
-        l && (s = {
-          blockletId: (n = m[l == null ? void 0 : l.id]) == null ? void 0 : n.blockletId,
-          blockletTitle: (d = m[l == null ? void 0 : l.id]) == null ? void 0 : d.blockletTitle,
-          componentName: ((P = (y = m[l == null ? void 0 : l.id]) == null ? void 0 : y.data) == null ? void 0 : P.name) || ((x = (c = m[l == null ? void 0 : l.id]) == null ? void 0 : c.data) == null ? void 0 : x.id)
-        }), u == null || u(p, l == null ? void 0 : l.id, s);
+      isOptionEqualToValue: (v, o) => v.id === o.id,
+      getOptionKey: (v) => v.id,
+      getOptionLabel: (v) => v.name || v.id,
+      renderInput: (v) => /* @__PURE__ */ t(V, { label: e || x("component"), ...v }),
+      value: y,
+      onChange: (v, o) => {
+        var c, d, m, w, s, h;
+        let n = {};
+        o && (n = {
+          blockletId: (c = b[o == null ? void 0 : o.id]) == null ? void 0 : c.blockletId,
+          blockletTitle: (d = b[o == null ? void 0 : o.id]) == null ? void 0 : d.blockletTitle,
+          componentName: ((w = (m = b[o == null ? void 0 : o.id]) == null ? void 0 : m.data) == null ? void 0 : w.name) || ((h = (s = b[o == null ? void 0 : o.id]) == null ? void 0 : s.data) == null ? void 0 : h.id)
+        }), u == null || u(v, o == null ? void 0 : o.id, n);
       }
     }
   );
 }
-function bt({
+function lt({
   config: e,
   allComponents: r,
-  defaultLocale: o,
-  propertiesValue: i,
+  defaultLocale: i,
+  propertiesValue: l,
   currentLocale: u,
-  onChange: m,
+  onChange: b,
   props: a
 }) {
-  const { t: b } = D(), [g, f] = J(e == null ? void 0 : e.properties), [w, p] = J(null);
-  M(() => {
+  const { t: x } = C(), [g, y] = Q(e == null ? void 0 : e.properties), [k, v] = Q(null);
+  $(() => {
     (() => {
-      var P, c;
-      ((P = e == null ? void 0 : e.renderer) == null ? void 0 : P.type) === "react-component" && ot(e == null ? void 0 : e.properties) ? rr((c = e == null ? void 0 : e.renderer) == null ? void 0 : c.script).then((x) => {
-        const v = ir(x);
-        f(v);
-      }) : f(e == null ? void 0 : e.properties);
+      var w, s;
+      ((w = e == null ? void 0 : e.renderer) == null ? void 0 : w.type) === "react-component" && _e(e == null ? void 0 : e.properties) ? zt((s = e == null ? void 0 : e.renderer) == null ? void 0 : s.script).then((h) => {
+        const f = Nt(h);
+        y(f);
+      }) : y(e == null ? void 0 : e.properties);
     })();
   }, [JSON.stringify(e)]);
-  const l = A(() => !e || !g ? {} : Object.values(g).reduce(
-    (y, { data: P }) => {
-      var x, v, k, O, h;
-      const c = P.key || P.id;
-      return y[P.id] = {
-        key: c,
-        value: (a == null ? void 0 : a[c]) ?? ((x = i == null ? void 0 : i[P.id]) == null ? void 0 : x.value) ?? ((k = (v = P.locales) == null ? void 0 : v[u]) == null ? void 0 : k.defaultValue) ?? ((h = (O = P.locales) == null ? void 0 : O[o]) == null ? void 0 : h.defaultValue),
-        id: P.id,
-        type: P.type
-      }, y;
+  const o = D(() => !e || !g ? {} : Object.values(g).reduce(
+    (m, { data: w }) => {
+      var h, f, P, S, p;
+      const s = w.key || w.id;
+      return m[w.id] = {
+        key: s,
+        value: (a == null ? void 0 : a[s]) ?? ((h = l == null ? void 0 : l[w.id]) == null ? void 0 : h.value) ?? ((P = (f = w.locales) == null ? void 0 : f[u]) == null ? void 0 : P.defaultValue) ?? ((p = (S = w.locales) == null ? void 0 : S[i]) == null ? void 0 : p.defaultValue),
+        id: w.id,
+        type: w.type
+      }, m;
     },
     {}
-  ), [JSON.stringify(g), e, i, u, o]), s = ce(() => {
+  ), [JSON.stringify(g), e, l, u, i]), n = ne(() => {
     if (!g)
       return {
         canUseProperties: [],
         visibleProperties: [],
         canUsePropertiesKeys: []
       };
-    const y = V(Object.values(g), "index"), P = y.filter(({ data: v }) => v.key && ve(g, v.id)), c = y.filter(({ data: v }) => v.key && v.type !== "component"), x = c.map(({ data: v }) => v.key);
+    const m = A(Object.values(g), "index"), w = m.filter(({ data: f }) => f.key && he(g, f.id)), s = m.filter(({ data: f }) => f.key && f.type !== "component"), h = s.map(({ data: f }) => f.key);
     return {
-      canUseProperties: c,
-      visibleProperties: P,
-      canUsePropertiesKeys: x
+      canUseProperties: s,
+      visibleProperties: w,
+      canUsePropertiesKeys: h
     };
-  }, [JSON.stringify(g)]), n = l(), d = fr(n, "key");
-  return /* @__PURE__ */ t(Ie, { children: /* @__PURE__ */ S(j, { gap: 2, children: [
-    /* @__PURE__ */ t(F, { variant: "subtitle1", children: b("maker.properties.parameters") }),
-    !e || s.canUsePropertiesKeys.length === 0 ? /* @__PURE__ */ t(Z, { style: { fontSize: 12 }, children: b("maker.properties.noParameters") }) : /* @__PURE__ */ S(H, { children: [
-      /* @__PURE__ */ t(j, { gap: 2, children: s.visibleProperties.map(({ data: y }) => {
-        var P, c;
-        return /* @__PURE__ */ t(R, { children: /* @__PURE__ */ t(
-          _,
+  }, [JSON.stringify(g)]), c = o(), d = _t(c, "key");
+  return /* @__PURE__ */ t(ge, { children: /* @__PURE__ */ O(R, { gap: 2, children: [
+    /* @__PURE__ */ t(M, { variant: "subtitle1", children: x("maker.properties.parameters") }),
+    !e || n.canUsePropertiesKeys.length === 0 ? /* @__PURE__ */ t(de, { style: { fontSize: 12 }, children: x("maker.properties.noParameters") }) : /* @__PURE__ */ O(X, { children: [
+      /* @__PURE__ */ t(R, { gap: 2, children: n.visibleProperties.map(({ data: m }) => {
+        var w, s;
+        return /* @__PURE__ */ t(j, { children: /* @__PURE__ */ t(
+          J,
           {
             allComponents: r,
-            defaultLocale: o,
+            defaultLocale: i,
             size: "small",
             fullWidth: !0,
             component: e,
-            property: y,
-            valueImmutable: ae((P = i == null ? void 0 : i[y.id]) == null ? void 0 : P.value),
-            value: (a == null ? void 0 : a[y.key || y.id]) ?? ((c = n[y.id]) == null ? void 0 : c.value),
-            onChange: (x) => {
-              m({
-                path: ["properties", y.id],
-                id: y.id,
-                value: { value: x },
-                shouldSync: $e(y),
+            property: m,
+            valueImmutable: se((w = l == null ? void 0 : l[m.id]) == null ? void 0 : w.value),
+            value: (a == null ? void 0 : a[m.key || m.id]) ?? ((s = c[m.id]) == null ? void 0 : s.value),
+            onChange: (h) => {
+              b({
+                path: ["properties", m.id],
+                id: m.id,
+                value: { value: h },
+                shouldSync: Te(m),
                 excludeKeys: [],
-                key: y.key || y.id
+                key: m.key || m.id
               });
             }
           }
-        ) }, y.id);
+        ) }, m.id);
       }) }),
-      /* @__PURE__ */ t(j, { gap: 2, sx: { width: "100%" }, children: /* @__PURE__ */ t(
-        nt,
+      /* @__PURE__ */ t(R, { gap: 2, sx: { width: "100%" }, children: /* @__PURE__ */ t(
+        Le,
         {
           componentId: (e == null ? void 0 : e.id) || "",
           renderType: "setting",
           locale: u,
-          properties: n,
-          dev: { mode: "draft", components: r, defaultLocale: o },
+          properties: c,
+          dev: { mode: "draft", components: r, defaultLocale: i },
           props: {
-            ...br(a ?? {}, s.canUsePropertiesKeys),
-            onChange: (y) => {
-              const { canUsePropertiesKeys: P } = s;
-              Object.keys(y).filter((x) => {
-                var v;
-                return y[x] !== ((v = d == null ? void 0 : d[x]) == null ? void 0 : v.value);
-              }).filter((x) => {
-                var v, k, O, h;
-                return !(x === "locale" && !pr(d[x], "locale") || ((v = d[x]) == null ? void 0 : v.type) === "component" || (((k = d[x]) == null ? void 0 : k.type) === "yaml" || ((O = d[x]) == null ? void 0 : O.type) === "json") && ve(g, (h = d[x]) == null ? void 0 : h.id));
-              }).reduce((x, v) => x.then(() => {
-                const k = d[v], O = P.includes(v);
-                if (k != null && k.id && O)
-                  return m({
-                    path: ["properties", k.id],
-                    id: k.id,
-                    value: { value: y[v] },
-                    shouldSync: $e(k),
+            ...Yt(a ?? {}, n.canUsePropertiesKeys),
+            onChange: (m) => {
+              const { canUsePropertiesKeys: w } = n;
+              Object.keys(m).filter((h) => {
+                var f;
+                return m[h] !== ((f = d == null ? void 0 : d[h]) == null ? void 0 : f.value);
+              }).filter((h) => {
+                var f, P, S, p;
+                return !(h === "locale" && !Mt(d[h], "locale") || ((f = d[h]) == null ? void 0 : f.type) === "component" || (((P = d[h]) == null ? void 0 : P.type) === "yaml" || ((S = d[h]) == null ? void 0 : S.type) === "json") && he(g, (p = d[h]) == null ? void 0 : p.id));
+              }).reduce((h, f) => h.then(() => {
+                const P = d[f], S = w.includes(f);
+                if (P != null && P.id && S)
+                  return b({
+                    path: ["properties", P.id],
+                    id: P.id,
+                    value: { value: m[f] },
+                    shouldSync: Te(P),
                     excludeKeys: [],
-                    key: k.key || k.id
+                    key: P.key || P.id
                   }), Promise.resolve();
-                const h = `propertyNotFound${v}`;
-                if (w === h)
+                const p = `propertyNotFound${f}`;
+                if (k === p)
                   return Promise.resolve();
-                Be.close(w);
-                const I = Be.warning(
-                  b("maker.properties.propertyNotFound", {
-                    key: v
+                me.close(k);
+                const I = me.warning(
+                  x("maker.properties.propertyNotFound", {
+                    key: f
                   }),
                   {
-                    key: h
+                    key: p
                   }
                 );
-                return p(I), Promise.resolve();
+                return v(I), Promise.resolve();
               }), Promise.resolve());
             }
           }
@@ -2155,12 +1972,12 @@ function bt({
   ] }) });
 }
 export {
-  Kr as BasicInfo,
-  Re as CustomComponentAutocomplete,
-  Bi as CustomComponentSettings,
-  Yr as DefaultReactComponentScriptTemplate,
-  Gr as DefaultWebComponentScriptTemplate,
-  bt as ParametersConfig,
-  _r as PropertiesConfig,
-  _ as PropertyValueField
+  ur as BasicInfo,
+  ke as CustomComponentAutocomplete,
+  si as CustomComponentSettings,
+  vr as DefaultReactComponentScriptTemplate,
+  xr as DefaultWebComponentScriptTemplate,
+  lt as ParametersConfig,
+  mr as PropertiesConfig,
+  J as PropertyValueField
 };