@pdfme/ui 4.2.5 → 4.3.0

package/dist/index.es.js

@@ -9250,6 +9250,7 @@ z.object({
   rotate: z.string(),
   edit: z.string(),
   required: z.string(),
+  editable: z.string(),
   plsInputName: z.string(),
   fieldMustUniq: z.string(),
   notUniq: z.string(),
@@ -59761,7 +59762,7 @@ function getMods(a, s) {
     $[_] = a[$[_].toLowerCase()];
   return $;
 }
-function getKeys$3(a) {
+function getKeys$2(a) {
   typeof a != "string" && (a = ""), a = a.replace(/\s/g, "");
   const s = a.split(",");
   let $ = s.lastIndexOf("");
@@ -59950,7 +59951,7 @@ const eachUnbind = (a) => {
     method: _,
     splitKey: _e = "+"
   } = a;
-  getKeys$3(s).forEach((nt) => {
+  getKeys$2(s).forEach((nt) => {
     const at = nt.split(_e), ot = at.length, rt = at[ot - 1], st = rt === "*" ? "*" : code(rt);
     if (!_handlers[st])
       return;
@@ -60009,7 +60010,7 @@ function isElementBind(a) {
 }
 function hotkeys(a, s, $) {
   _downKeys = [];
-  const _ = getKeys$3(a);
+  const _ = getKeys$2(a);
   let _e = [], tt = "all", nt = document, at = 0, ot = !1, rt = !0, st = "+", lt = !1, et = !1;
   for ($ === void 0 && typeof s == "function" && ($ = s), Object.prototype.toString.call(s) === "[object Object]" && (s.scope && (tt = s.scope), s.element && (nt = s.element), s.keyup && (ot = s.keyup), s.keydown !== void 0 && (rt = s.keydown), s.capture !== void 0 && (lt = s.capture), typeof s.splitKey == "string" && (st = s.splitKey), s.single === !0 && (et = !0)), typeof s == "string" && (tt = s), et && unbind(a, tt); at < _.length; at++)
     a = _[at].split(st), _e = [], a.length > 1 && (_e = getMods(_modifier, a)), a = a[a.length - 1], a = a === "*" ? "*" : code(a), a in _handlers || (_handlers[a] = []), _handlers[a].push({
@@ -87197,7 +87198,7 @@ var parseStyle = function a(s) {
 function uniqueHash(a, s) {
   return murmur2("".concat(a.join("%")).concat(s));
 }
-function Empty$4() {
+function Empty$3() {
   return null;
 }
 var STYLE_PREFIX = "style";
@@ -87257,7 +87258,7 @@ function useStyleRegister(a, s) {
   return function(St) {
     var Bt;
     if (!ft || ct || !et)
-      Bt = /* @__PURE__ */ reactExports.createElement(Empty$4, null);
+      Bt = /* @__PURE__ */ reactExports.createElement(Empty$3, null);
     else {
       var Ot;
       Bt = /* @__PURE__ */ reactExports.createElement("style", _extends$2({}, (Ot = {}, _defineProperty$c(Ot, ATTR_TOKEN, bt), _defineProperty$c(Ot, ATTR_MARK, Et), Ot), {
@@ -99399,7 +99400,7 @@ function getStatusClassNames(a, s, $) {
     [`${a}-has-feedback`]: $
   });
 }
-const getMergedStatus = (a, s) => s || a, Empty$3 = () => {
+const getMergedStatus = (a, s) => s || a, Empty$2 = () => {
   const [, a] = useToken$1(), $ = new TinyColor(a.colorBgBase).toHsl().l < 0.5 ? {
     opacity: 0.65
   } : {};
@@ -99448,7 +99449,7 @@ const getMergedStatus = (a, s) => s || a, Empty$3 = () => {
   }), /* @__PURE__ */ reactExports.createElement("path", {
     d: "M5.698 5.63H0L2.898.704zM9.259.704h4.985V5.63H9.259z"
   }))));
-}, DefaultEmptyImg = Empty$3, Simple = () => {
+}, DefaultEmptyImg = Empty$2, Simple = () => {
   const [, a] = useToken$1(), {
     colorFill: s,
     colorFillTertiary: $,
@@ -99564,7 +99565,7 @@ var __rest$X = function(a, s) {
       s.indexOf(_[_e]) < 0 && Object.prototype.propertyIsEnumerable.call(a, _[_e]) && ($[_[_e]] = a[_[_e]]);
   return $;
 };
-const defaultEmptyImg = /* @__PURE__ */ reactExports.createElement(DefaultEmptyImg, null), simpleEmptyImg = /* @__PURE__ */ reactExports.createElement(SimpleEmptyImg, null), Empty$1 = (a) => {
+const defaultEmptyImg = /* @__PURE__ */ reactExports.createElement(DefaultEmptyImg, null), simpleEmptyImg = /* @__PURE__ */ reactExports.createElement(SimpleEmptyImg, null), Empty = (a) => {
   var {
     className: s,
     rootClassName: $,
@@ -99599,9 +99600,9 @@ const defaultEmptyImg = /* @__PURE__ */ reactExports.createElement(DefaultEmptyI
     className: `${it}-footer`
   }, nt)));
 };
-Empty$1.PRESENTED_IMAGE_DEFAULT = defaultEmptyImg;
-Empty$1.PRESENTED_IMAGE_SIMPLE = simpleEmptyImg;
-const Empty$2 = Empty$1, DefaultRenderEmpty = (a) => {
+Empty.PRESENTED_IMAGE_DEFAULT = defaultEmptyImg;
+Empty.PRESENTED_IMAGE_SIMPLE = simpleEmptyImg;
+const Empty$1 = Empty, DefaultRenderEmpty = (a) => {
   const {
     componentName: s
   } = a, {
@@ -99610,20 +99611,20 @@ const Empty$2 = Empty$1, DefaultRenderEmpty = (a) => {
   switch (s) {
     case "Table":
     case "List":
-      return /* @__PURE__ */ React$a.createElement(Empty$2, {
-        image: Empty$2.PRESENTED_IMAGE_SIMPLE
+      return /* @__PURE__ */ React$a.createElement(Empty$1, {
+        image: Empty$1.PRESENTED_IMAGE_SIMPLE
       });
     case "Select":
     case "TreeSelect":
     case "Cascader":
     case "Transfer":
     case "Mentions":
-      return /* @__PURE__ */ React$a.createElement(Empty$2, {
-        image: Empty$2.PRESENTED_IMAGE_SIMPLE,
+      return /* @__PURE__ */ React$a.createElement(Empty$1, {
+        image: Empty$1.PRESENTED_IMAGE_SIMPLE,
         className: `${_}-small`
       });
     default:
-      return /* @__PURE__ */ React$a.createElement(Empty$2, null);
+      return /* @__PURE__ */ React$a.createElement(Empty$1, null);
   }
 }, DefaultRenderEmpty$1 = DefaultRenderEmpty, genItemStyle = (a) => {
   const {
@@ -119254,10 +119255,10 @@ function getOffset$2(a) {
     top: s.top + (window.pageYOffset || $.scrollTop) - ($.clientTop || document.body.clientTop || 0)
   };
 }
-var COMMON_PROPS = ["crossOrigin", "decoding", "draggable", "loading", "referrerPolicy", "sizes", "srcSet", "useMap", "alt"], PreviewGroupContext = /* @__PURE__ */ reactExports.createContext(null), uid$4 = 0;
+var COMMON_PROPS = ["crossOrigin", "decoding", "draggable", "loading", "referrerPolicy", "sizes", "srcSet", "useMap", "alt"], PreviewGroupContext = /* @__PURE__ */ reactExports.createContext(null), uid$3 = 0;
 function useRegisterImage(a, s) {
   var $ = reactExports.useState(function() {
-    return uid$4 += 1, String(uid$4);
+    return uid$3 += 1, String(uid$3);
   }), _ = _slicedToArray$e($, 1), _e = _[0], tt = reactExports.useContext(PreviewGroupContext), nt = {
     data: s,
     canPreview: a
@@ -129649,8 +129650,8 @@ function FilterDropdown(a) {
   else if (tt.filterDropdown)
     Vt = tt.filterDropdown;
   else {
-    const ar = Ot() || [], Jt = () => (tt.filters || []).length === 0 ? /* @__PURE__ */ reactExports.createElement(Empty$2, {
-      image: Empty$2.PRESENTED_IMAGE_SIMPLE,
+    const ar = Ot() || [], Jt = () => (tt.filters || []).length === 0 ? /* @__PURE__ */ reactExports.createElement(Empty$1, {
+      image: Empty$1.PRESENTED_IMAGE_SIMPLE,
       description: it.filterEmptyText,
       imageStyle: {
         height: 24
@@ -133630,7 +133631,7 @@ function upload(a) {
   };
 }
 var now$1 = +/* @__PURE__ */ new Date(), index$3 = 0;
-function uid$3() {
+function uid$2() {
   return "rc-upload-".concat(now$1, "-").concat(++index$3);
 }
 const attrAccept = function(a, s) {
@@ -133693,7 +133694,7 @@ var traverseFileTree = function a(s, $, _) {
     for (var _e = arguments.length, tt = new Array(_e), nt = 0; nt < _e; nt++)
       tt[nt] = arguments[nt];
     return _ = s.call.apply(s, [this].concat(tt)), _.state = {
-      uid: uid$3()
+      uid: uid$2()
     }, _.reqs = {}, _.fileInput = void 0, _._isMounted = void 0, _.onChange = function(at) {
       var ot = _.props, rt = ot.accept, st = ot.directory, lt = at.target.files, et = _toConsumableArray$d(lt).filter(function(it) {
         return !st || attrAccept(it, rt);
@@ -133726,7 +133727,7 @@ var traverseFileTree = function a(s, $, _) {
         }
     }, _.uploadFiles = function(at) {
       var ot = _toConsumableArray$d(at), rt = ot.map(function(st) {
-        return st.uid = uid$3(), _.processFile(st, ot);
+        return st.uid = uid$2(), _.processFile(st, ot);
       });
       Promise.all(rt).then(function(st) {
         var lt = _.props.onBatchStart;
@@ -133859,7 +133860,7 @@ var traverseFileTree = function a(s, $, _) {
     key: "reset",
     value: function() {
       this.setState({
-        uid: uid$3()
+        uid: uid$2()
       });
     }
   }, {
@@ -135134,6 +135135,15 @@ var ExclamationCircleOutlined = function a(s, $) {
   }));
 };
 const ExclamationCircleOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(ExclamationCircleOutlined);
+var LockOutlined$2 = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M832 464h-68V240c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM332 240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v224H332V240zm460 600H232V536h560v304zM484 701v53c0 4.4 3.6 8 8 8h40c4.4 0 8-3.6 8-8v-53a48.01 48.01 0 10-56 0z" } }] }, name: "lock", theme: "outlined" };
+const LockOutlinedSvg = LockOutlined$2;
+var LockOutlined = function a(s, $) {
+  return /* @__PURE__ */ reactExports.createElement(AntdIcon$1, _extends$2({}, s, {
+    ref: $,
+    icon: LockOutlinedSvg
+  }));
+};
+const LockOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(LockOutlined);
 var MenuOutlined$2 = { icon: { tag: "svg", attrs: { viewBox: "64 64 896 896", focusable: "false" }, children: [{ tag: "path", attrs: { d: "M904 160H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0 624H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8zm0-312H120c-4.4 0-8 3.6-8 8v64c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-64c0-4.4-3.6-8-8-8z" } }] }, name: "menu", theme: "outlined" };
 const MenuOutlinedSvg = MenuOutlined$2;
 var MenuOutlined = function a(s, $) {
@@ -135161,6 +135171,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "Opacity",
   rotate: "Rotate",
   required: "Required",
+  editable: "Editable",
   edit: "Edit",
   plsInputName: "Please input name",
   fieldMustUniq: "Name of field is not unique",
@@ -135224,6 +135235,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "透明度",
   rotate: "旋转",
   required: "必需的",
+  editable: "可编辑的",
   edit: "编辑",
   plsInputName: "请输入名称",
   fieldMustUniq: "字段名称必须唯一",
@@ -135287,6 +135299,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "不透明度",
   rotate: "回転",
   required: "必須",
+  editable: "編集可能",
   edit: "編集する",
   plsInputName: "項目名を入力してください",
   fieldMustUniq: "他の入力項目名と被っています",
@@ -135350,6 +135363,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "투명도",
   rotate: "회전",
   required: "필수의",
+  editable: "편집 가능한",
   edit: "편집",
   plsInputName: "이름을 입력하세요",
   fieldMustUniq: "필드 이름은 유일해야 합니다",
@@ -135413,6 +135427,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "الشفافية",
   rotate: "تدوير",
   required: "مطلوب",
+  editable: "قابل للتحرير",
   edit: "تعديل",
   plsInputName: "الرجاء إدخال الاسم",
   fieldMustUniq: "يجب أن يكون الحقل فريداً",
@@ -135476,6 +135491,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "ความทึบ",
   rotate: "หมุน",
   required: "ที่จำเป็น",
+  editable: "แก้ไขได้",
   edit: "แก้ไข",
   plsInputName: "กรุณาใส่ชื่อ",
   fieldMustUniq: "ชื่อฟิลด์ต้องไม่ซ้ำกัน",
@@ -135539,6 +135555,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "Opacità",
   rotate: "Ruota",
   required: "Necessaria",
+  editable: "Modificabile",
   edit: "Modifica",
   plsInputName: "Inserisci il nome per favore",
   fieldMustUniq: "Il nome del campo non è univoco",
@@ -135602,6 +135619,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "przezroczystość",
   rotate: "Obrót",
   required: "Wymagany",
+  editable: "Edytowalny",
   edit: "Edytuj",
   plsInputName: "Wymagane wprowadzenie klucza pola",
   fieldMustUniq: "Klucz pola nie jest unikalny",
@@ -135665,6 +135683,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "Opazität",
   rotate: "Drehen",
   required: "Erforderlich",
+  editable: "Bearbeitbar",
   edit: "Bearbeiten",
   plsInputName: "Bitte geben Sie einen Namen ein",
   fieldMustUniq: "Feldname ist nicht eindeutig",
@@ -135728,6 +135747,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "Opacidad",
   rotate: "Rotar",
   required: "Requerido",
+  editable: "Editable",
   edit: "Editar",
   plsInputName: "Introduce el nombre",
   fieldMustUniq: "El nombre del campo no es único",
@@ -135791,6 +135811,7 @@ const MinusOutlined$1 = /* @__PURE__ */ reactExports.forwardRef(MinusOutlined),
   opacity: "Opacité",
   rotate: "Rotation",
   required: "Requis",
+  editable: "Modifiable",
   edit: "Éditer",
   plsInputName: "Veuillez saisir le nom",
   fieldMustUniq: "Le nom du champ n'est pas unique",
@@ -136292,38 +136313,39 @@ const { Text: Text$4 } = Typography$1, Item = React$a.memo(
       status: $,
       title: _,
       required: _e,
-      style: tt,
-      dragOverlay: nt,
-      onClick: at,
-      onMouseEnter: ot,
-      onMouseLeave: rt,
-      dragging: st,
-      fadeIn: lt,
-      listeners: et,
-      sorting: it,
-      transition: ut,
-      transform: ft,
-      ...ht
-    }, dt) => {
-      const gt = reactExports.useContext(I18nContext);
+      readOnly: tt,
+      style: nt,
+      dragOverlay: at,
+      onClick: ot,
+      onMouseEnter: rt,
+      onMouseLeave: st,
+      dragging: lt,
+      fadeIn: et,
+      listeners: it,
+      sorting: ut,
+      transition: ft,
+      transform: ht,
+      ...dt
+    }, gt) => {
+      const pt = reactExports.useContext(I18nContext);
       reactExports.useEffect(() => {
-        if (nt)
+        if (at)
           return document.body.style.cursor = "grabbing", () => {
             document.body.style.cursor = "";
           };
-      }, [nt]);
-      const { x: pt, y: mt, scaleX: ct, scaleY: vt } = ft || { x: 0, y: 0, scaleX: 1, scaleY: 1 };
+      }, [at]);
+      const { x: mt, y: ct, scaleX: vt, scaleY: At } = ht || { x: 0, y: 0, scaleX: 1, scaleY: 1 };
       return /* @__PURE__ */ jsxRuntimeExports.jsx(
         "li",
         {
           style: {
             marginTop: 10,
-            transition: ut,
-            transform: `translate(${pt}px, ${mt}px) scale(${ct}, ${vt})`
+            transition: ft,
+            transform: `translate(${mt}px, ${ct}px) scale(${vt}, ${At})`
           },
-          onMouseEnter: ot,
-          onMouseLeave: rt,
-          ref: dt,
+          onMouseEnter: rt,
+          onMouseLeave: st,
+          ref: gt,
           children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
             "div",
             {
@@ -136331,15 +136353,15 @@ const { Text: Text$4 } = Typography$1, Item = React$a.memo(
                 display: "flex",
                 alignItems: "center",
                 cursor: "pointer",
-                ...tt
+                ...nt
               },
-              ...ht,
-              onClick: () => at && at(),
+              ...dt,
+              onClick: () => ot && ot(),
               children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx(
                   Button$2,
                   {
-                    ...et,
+                    ...it,
                     style: {
                       display: "flex",
                       alignItems: "center",
@@ -136365,9 +136387,10 @@ const { Text: Text$4 } = Typography$1, Item = React$a.memo(
                     children: [
                       $ === void 0 ? s : /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
                         /* @__PURE__ */ jsxRuntimeExports.jsx(ExclamationCircleOutlined$1, { width: 15, style: { marginRight: "0.5rem" } }),
-                        $ === "is-warning" ? gt("noKeyName") : s,
-                        $ === "is-danger" ? gt("notUniq") : ""
+                        $ === "is-warning" ? pt("noKeyName") : s,
+                        $ === "is-danger" ? pt("notUniq") : ""
                       ] }),
+                      tt && /* @__PURE__ */ jsxRuntimeExports.jsx(LockOutlined$1, { style: { marginLeft: "0.5rem" } }),
                       _e && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "red", marginLeft: "0.5rem" }, children: "*" })
                     ]
                   }
@@ -136537,7 +136560,7 @@ const { Text: Text$4 } = Typography$1, Item = React$a.memo(
 }, PluginIcon = (a) => {
   var ot;
   const { plugin: s, label: $, size: _, styles: _e } = a, nt = ((ot = reactExports.useContext(OptionsContext).icons) == null ? void 0 : ot[s.propPanel.defaultSchema.type]) ?? s.icon, at = { ..._e, display: "flex", justifyContent: "center" };
-  return nt ? _ ? getWithModifiedSize(nt, $, _, at) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: at, title: $, dangerouslySetInnerHTML: { __html: nt } }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ..._e, overflow: "hidden", fontSize: 10 }, children: $ });
+  return nt ? _ ? getWithModifiedSize(nt, $, _, at) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: at, title: $, dangerouslySetInnerHTML: { __html: nt } }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { ..._e, overflow: "hidden", fontSize: 10 }, title: $, children: $ });
 }, PluginIcon$1 = PluginIcon, SelectableSortableItem = ({
   isSelected: a,
   style: s,
@@ -136573,6 +136596,7 @@ const { Text: Text$4 } = Typography$1, Item = React$a.memo(
       status: At,
       title: xt,
       required: _e.required,
+      readOnly: _e.readOnly,
       style: { ...bt, ...s },
       dragging: it,
       sorting: ut,
@@ -136647,29 +136671,34 @@ const { Text: Text$4 } = Typography$1, Item = React$a.memo(
           gt.id
         )) }) }) }),
         reactDomExports.createPortal(
-          /* @__PURE__ */ jsxRuntimeExports.jsx(DragOverlay, { adjustScale: !0, children: lt ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { style: { margin: 0, padding: 0, listStyle: "none" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-              Item$1,
-              {
-                icon: dt(lt),
-                value: $.find((gt) => gt.id === lt).key,
-                required: $.find((gt) => gt.id === lt).required,
-                style: { background: s.colorPrimary },
-                dragOverlay: !0
-              }
-            ) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { style: { margin: 0, padding: 0, listStyle: "none" }, children: at.filter((gt) => gt.id !== lt).map((gt) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-              Item$1,
-              {
-                icon: dt(gt),
-                value: gt.key,
-                required: gt.required,
-                style: { background: s.colorPrimary },
-                dragOverlay: !0
-              },
-              gt.id
-            )) })
-          ] }) : null }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(DragOverlay, { adjustScale: !0, children: lt ? (() => {
+            const gt = $.find((pt) => pt.id === lt);
+            return gt ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { style: { margin: 0, padding: 0, listStyle: "none" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                Item$1,
+                {
+                  icon: dt(lt),
+                  value: gt.key,
+                  required: gt.required,
+                  readOnly: gt.readOnly,
+                  style: { background: s.colorPrimary },
+                  dragOverlay: !0
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { style: { margin: 0, padding: 0, listStyle: "none" }, children: at.filter((pt) => pt.id !== lt).map((pt) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+                Item$1,
+                {
+                  icon: dt(pt),
+                  value: pt.key,
+                  required: pt.required,
+                  readOnly: pt.readOnly,
+                  style: { background: s.colorPrimary },
+                  dragOverlay: !0
+                },
+                pt.id
+              )) })
+            ] }) : null;
+          })() : null }),
           document.body
         )
       ] })
@@ -142384,11 +142413,11 @@ var _ie8DomDefine = !require_descriptors() && !require_fails()(function() {
   if (s && typeof ($ = a.toString) == "function" && !isObject$4(_ = $.call(a)) || typeof ($ = a.valueOf) == "function" && !isObject$4(_ = $.call(a)) || !s && typeof ($ = a.toString) == "function" && !isObject$4(_ = $.call(a)))
     return _;
   throw TypeError("Can't convert object to primitive value");
-}, anObject$3 = _anObject, IE8_DOM_DEFINE$1 = _ie8DomDefine, toPrimitive$3 = _toPrimitive$5, dP$3 = Object.defineProperty;
+}, anObject$1 = _anObject, IE8_DOM_DEFINE$1 = _ie8DomDefine, toPrimitive$3 = _toPrimitive$5, dP$2 = Object.defineProperty;
 _objectDp.f = require_descriptors() ? Object.defineProperty : function a(s, $, _) {
-  if (anObject$3(s), $ = toPrimitive$3($, !0), anObject$3(_), IE8_DOM_DEFINE$1)
+  if (anObject$1(s), $ = toPrimitive$3($, !0), anObject$1(_), IE8_DOM_DEFINE$1)
     try {
-      return dP$3(s, $, _);
+      return dP$2(s, $, _);
     } catch {
     }
   if ("get" in _ || "set" in _)
@@ -142402,14 +142431,14 @@ var _propertyDesc = function(a, s) {
     writable: !(a & 4),
     value: s
   };
-}, dP$2 = _objectDp, createDesc$2 = _propertyDesc, _hide = require_descriptors() ? function(a, s, $) {
-  return dP$2.f(a, s, createDesc$2(1, $));
+}, dP$1 = _objectDp, createDesc$2 = _propertyDesc, _hide = require_descriptors() ? function(a, s, $) {
+  return dP$1.f(a, s, createDesc$2(1, $));
 } : function(a, s, $) {
   return a[s] = $, a;
 }, hasOwnProperty = {}.hasOwnProperty, _has = function(a, s) {
   return hasOwnProperty.call(a, s);
-}, global$4 = _globalExports, core$2 = _coreExports, ctx = _ctx, hide$1 = _hide, has$4 = _has, PROTOTYPE$2 = "prototype", $export$5 = function(a, s, $) {
-  var _ = a & $export$5.F, _e = a & $export$5.G, tt = a & $export$5.S, nt = a & $export$5.P, at = a & $export$5.B, ot = a & $export$5.W, rt = _e ? core$2 : core$2[s] || (core$2[s] = {}), st = rt[PROTOTYPE$2], lt = _e ? global$4 : tt ? global$4[s] : (global$4[s] || {})[PROTOTYPE$2], et, it, ut;
+}, global$4 = _globalExports, core$2 = _coreExports, ctx = _ctx, hide$1 = _hide, has$4 = _has, PROTOTYPE$1 = "prototype", $export$5 = function(a, s, $) {
+  var _ = a & $export$5.F, _e = a & $export$5.G, tt = a & $export$5.S, nt = a & $export$5.P, at = a & $export$5.B, ot = a & $export$5.W, rt = _e ? core$2 : core$2[s] || (core$2[s] = {}), st = rt[PROTOTYPE$1], lt = _e ? global$4 : tt ? global$4[s] : (global$4[s] || {})[PROTOTYPE$1], et, it, ut;
   _e && ($ = s);
   for (et in $)
     it = !_ && lt && lt[et] !== void 0, !(it && has$4(rt, et)) && (ut = it ? lt[et] : $[et], rt[et] = _e && typeof lt[et] != "function" ? $[et] : at && it ? ctx(ut, global$4) : ot && lt[et] == ut ? function(ft) {
@@ -142427,7 +142456,7 @@ var _propertyDesc = function(a, s) {
         }
         return ft.apply(this, arguments);
       };
-      return ht[PROTOTYPE$2] = ft[PROTOTYPE$2], ht;
+      return ht[PROTOTYPE$1] = ft[PROTOTYPE$1], ht;
     }(ut) : nt && typeof ut == "function" ? ctx(Function.call, ut) : ut, nt && ((rt.virtual || (rt.virtual = {}))[et] = ut, a & $export$5.R && st && !st[et] && hide$1(st, et, ut)));
 };
 $export$5.F = 1;
@@ -142521,14 +142550,22 @@ var _shared = { exports: {} }, _library = !0, core$1 = _coreExports, global$3 =
 });
 var _sharedExports = _shared.exports, id$1 = 0, px = Math.random(), _uid = function(a) {
   return "Symbol(".concat(a === void 0 ? "" : a, ")_", (++id$1 + px).toString(36));
-}, shared$1 = _sharedExports("keys"), uid$2 = _uid, _sharedKey = function(a) {
-  return shared$1[a] || (shared$1[a] = uid$2(a));
-}, _objectKeysInternal, hasRequired_objectKeysInternal;
+}, _sharedKey, hasRequired_sharedKey;
+function require_sharedKey() {
+  if (hasRequired_sharedKey)
+    return _sharedKey;
+  hasRequired_sharedKey = 1;
+  var a = _sharedExports("keys"), s = _uid;
+  return _sharedKey = function($) {
+    return a[$] || (a[$] = s($));
+  }, _sharedKey;
+}
+var _objectKeysInternal, hasRequired_objectKeysInternal;
 function require_objectKeysInternal() {
   if (hasRequired_objectKeysInternal)
     return _objectKeysInternal;
   hasRequired_objectKeysInternal = 1;
-  var a = _has, s = _toIobject, $ = require_arrayIncludes()(!1), _ = _sharedKey("IE_PROTO");
+  var a = _has, s = _toIobject, $ = require_arrayIncludes()(!1), _ = require_sharedKey()("IE_PROTO");
   return _objectKeysInternal = function(_e, tt) {
     var nt = s(_e), at = 0, ot = [], rt;
     for (rt in nt)
@@ -142538,12 +142575,16 @@ function require_objectKeysInternal() {
     return ot;
   }, _objectKeysInternal;
 }
-var _enumBugKeys = "constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf".split(","), _objectKeys, hasRequired_objectKeys;
+var _enumBugKeys, hasRequired_enumBugKeys;
+function require_enumBugKeys() {
+  return hasRequired_enumBugKeys || (hasRequired_enumBugKeys = 1, _enumBugKeys = "constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf".split(",")), _enumBugKeys;
+}
+var _objectKeys, hasRequired_objectKeys;
 function require_objectKeys() {
   if (hasRequired_objectKeys)
     return _objectKeys;
   hasRequired_objectKeys = 1;
-  var a = require_objectKeysInternal(), s = _enumBugKeys;
+  var a = require_objectKeysInternal(), s = require_enumBugKeys();
   return _objectKeys = Object.keys || function(_) {
     return a(_, s);
   }, _objectKeys;
@@ -143255,12 +143296,20 @@ var _default$f = /* @__PURE__ */ function() {
     var _ = String(defined(s)), _e = toInteger($), tt = _.length, nt, at;
     return _e < 0 || _e >= tt ? a ? "" : void 0 : (nt = _.charCodeAt(_e), nt < 55296 || nt > 56319 || _e + 1 === tt || (at = _.charCodeAt(_e + 1)) < 56320 || at > 57343 ? a ? _.charAt(_e) : nt : a ? _.slice(_e, _e + 2) : (nt - 55296 << 10) + (at - 56320) + 65536);
   };
-}, _redefine = _hide, _iterators = {}, dP$1 = _objectDp, anObject$2 = _anObject, getKeys$2 = require_objectKeys(), _objectDps = require_descriptors() ? Object.defineProperties : function a(s, $) {
-  anObject$2(s);
-  for (var _ = getKeys$2($), _e = _.length, tt = 0, nt; _e > tt; )
-    dP$1.f(s, nt = _[tt++], $[nt]);
-  return s;
-}, _html, hasRequired_html;
+}, _redefine = _hide, _iterators = {}, _objectDps, hasRequired_objectDps;
+function require_objectDps() {
+  if (hasRequired_objectDps)
+    return _objectDps;
+  hasRequired_objectDps = 1;
+  var a = _objectDp, s = _anObject, $ = require_objectKeys();
+  return _objectDps = require_descriptors() ? Object.defineProperties : function(_e, tt) {
+    s(_e);
+    for (var nt = $(tt), at = nt.length, ot = 0, rt; at > ot; )
+      a.f(_e, rt = nt[ot++], tt[rt]);
+    return _e;
+  }, _objectDps;
+}
+var _html, hasRequired_html;
 function require_html() {
   if (hasRequired_html)
     return _html;
@@ -143268,16 +143317,24 @@ function require_html() {
   var a = _globalExports.document;
   return _html = a && a.documentElement, _html;
 }
-var anObject$1 = _anObject, dPs = _objectDps, enumBugKeys = _enumBugKeys, IE_PROTO = _sharedKey("IE_PROTO"), Empty = function() {
-}, PROTOTYPE$1 = "prototype", createDict = function() {
-  var a = require_domCreate()("iframe"), s = enumBugKeys.length, $ = "<", _ = ">", _e;
-  for (a.style.display = "none", require_html().appendChild(a), a.src = "javascript:", _e = a.contentWindow.document, _e.open(), _e.write($ + "script" + _ + "document.F=Object" + $ + "/script" + _), _e.close(), createDict = _e.F; s--; )
-    delete createDict[PROTOTYPE$1][enumBugKeys[s]];
-  return createDict();
-}, _objectCreate = Object.create || function a(s, $) {
-  var _;
-  return s !== null ? (Empty[PROTOTYPE$1] = anObject$1(s), _ = new Empty(), Empty[PROTOTYPE$1] = null, _[IE_PROTO] = s) : _ = createDict(), $ === void 0 ? _ : dPs(_, $);
-}, _wks = { exports: {} }, store = _sharedExports("wks"), uid$1 = _uid, Symbol$1 = _globalExports.Symbol, USE_SYMBOL = typeof Symbol$1 == "function", $exports = _wks.exports = function(a) {
+var _objectCreate, hasRequired_objectCreate;
+function require_objectCreate() {
+  if (hasRequired_objectCreate)
+    return _objectCreate;
+  hasRequired_objectCreate = 1;
+  var a = _anObject, s = require_objectDps(), $ = require_enumBugKeys(), _ = require_sharedKey()("IE_PROTO"), _e = function() {
+  }, tt = "prototype", nt = function() {
+    var at = require_domCreate()("iframe"), ot = $.length, rt = "<", st = ">", lt;
+    for (at.style.display = "none", require_html().appendChild(at), at.src = "javascript:", lt = at.contentWindow.document, lt.open(), lt.write(rt + "script" + st + "document.F=Object" + rt + "/script" + st), lt.close(), nt = lt.F; ot--; )
+      delete nt[tt][$[ot]];
+    return nt();
+  };
+  return _objectCreate = Object.create || function(ot, rt) {
+    var st;
+    return ot !== null ? (_e[tt] = a(ot), st = new _e(), _e[tt] = null, st[_] = ot) : st = nt(), rt === void 0 ? st : s(st, rt);
+  }, _objectCreate;
+}
+var _wks = { exports: {} }, store = _sharedExports("wks"), uid$1 = _uid, Symbol$1 = _globalExports.Symbol, USE_SYMBOL = typeof Symbol$1 == "function", $exports = _wks.exports = function(a) {
   return store[a] || (store[a] = USE_SYMBOL && Symbol$1[a] || (USE_SYMBOL ? Symbol$1 : uid$1)("Symbol." + a));
 };
 $exports.store = store;
@@ -143288,7 +143345,7 @@ function require_iterCreate() {
   if (hasRequired_iterCreate)
     return _iterCreate;
   hasRequired_iterCreate = 1;
-  var a = _objectCreate, s = _propertyDesc, $ = _setToStringTag, _ = {};
+  var a = require_objectCreate(), s = _propertyDesc, $ = _setToStringTag, _ = {};
   return _hide(_, _wksExports("iterator"), function() {
     return this;
   }), _iterCreate = function(_e, tt, nt) {
@@ -143300,7 +143357,7 @@ function require_objectGpo() {
   if (hasRequired_objectGpo)
     return _objectGpo;
   hasRequired_objectGpo = 1;
-  var a = _has, s = require_toObject(), $ = _sharedKey("IE_PROTO"), _ = Object.prototype;
+  var a = _has, s = require_toObject(), $ = require_sharedKey()("IE_PROTO"), _ = Object.prototype;
   return _objectGpo = Object.getPrototypeOf || function(_e) {
     return _e = s(_e), a(_e, $) ? _e[$] : typeof _e.constructor == "function" && _e instanceof _e.constructor ? _e.constructor.prototype : _e instanceof Object ? _ : null;
   }, _objectGpo;
@@ -143421,7 +143478,7 @@ var iterator$1 = _wksExt.f("iterator"), iterator = { default: iterator$1, __esMo
   return s;
 }, cof = require_cof(), _isArray = Array.isArray || function a(s) {
   return cof(s) == "Array";
-}, _objectGopnExt = {}, _objectGopn = {}, $keys$1 = require_objectKeysInternal(), hiddenKeys = _enumBugKeys.concat("length", "prototype");
+}, _objectGopnExt = {}, _objectGopn = {}, $keys$1 = require_objectKeysInternal(), hiddenKeys = require_enumBugKeys().concat("length", "prototype");
 _objectGopn.f = Object.getOwnPropertyNames || function a(s) {
   return $keys$1(s, hiddenKeys);
 };
@@ -143445,7 +143502,7 @@ _objectGopd.f = require_descriptors() ? gOPD$1 : function a(s, $) {
   if (has$1(s, $))
     return createDesc$1(!pIE.f.call(s, $), s[$]);
 };
-var global$1 = _globalExports, has = _has, DESCRIPTORS = require_descriptors(), $export$2 = _export, redefine = _redefine, META = _metaExports.KEY, $fails = require_fails(), shared = _sharedExports, setToStringTag = _setToStringTag, uid = _uid, wks = _wksExports, wksExt = _wksExt, wksDefine = _wksDefine, enumKeys = _enumKeys, isArray$1 = _isArray, anObject = _anObject, isObject$2 = _isObject, toObject = require_toObject(), toIObject = _toIobject, toPrimitive$1 = _toPrimitive$5, createDesc = _propertyDesc, _create$1 = _objectCreate, gOPNExt = _objectGopnExt, $GOPD = _objectGopd, $GOPS = require_objectGops(), $DP = _objectDp, $keys = require_objectKeys(), gOPD = $GOPD.f, dP = $DP.f, gOPN = gOPNExt.f, $Symbol = global$1.Symbol, $JSON = global$1.JSON, _stringify = $JSON && $JSON.stringify, PROTOTYPE = "prototype", HIDDEN = wks("_hidden"), TO_PRIMITIVE = wks("toPrimitive"), isEnum = {}.propertyIsEnumerable, SymbolRegistry = shared("symbol-registry"), AllSymbols = shared("symbols"), OPSymbols = shared("op-symbols"), ObjectProto = Object[PROTOTYPE], USE_NATIVE = typeof $Symbol == "function" && !!$GOPS.f, QObject = global$1.QObject, setter = !QObject || !QObject[PROTOTYPE] || !QObject[PROTOTYPE].findChild, setSymbolDesc = DESCRIPTORS && $fails(function() {
+var global$1 = _globalExports, has = _has, DESCRIPTORS = require_descriptors(), $export$2 = _export, redefine = _redefine, META = _metaExports.KEY, $fails = require_fails(), shared = _sharedExports, setToStringTag = _setToStringTag, uid = _uid, wks = _wksExports, wksExt = _wksExt, wksDefine = _wksDefine, enumKeys = _enumKeys, isArray$1 = _isArray, anObject = _anObject, isObject$2 = _isObject, toObject = require_toObject(), toIObject = _toIobject, toPrimitive$1 = _toPrimitive$5, createDesc = _propertyDesc, _create$1 = require_objectCreate(), gOPNExt = _objectGopnExt, $GOPD = _objectGopd, $GOPS = require_objectGops(), $DP = _objectDp, $keys = require_objectKeys(), gOPD = $GOPD.f, dP = $DP.f, gOPN = gOPNExt.f, $Symbol = global$1.Symbol, $JSON = global$1.JSON, _stringify = $JSON && $JSON.stringify, PROTOTYPE = "prototype", HIDDEN = wks("_hidden"), TO_PRIMITIVE = wks("toPrimitive"), isEnum = {}.propertyIsEnumerable, SymbolRegistry = shared("symbol-registry"), AllSymbols = shared("symbols"), OPSymbols = shared("op-symbols"), ObjectProto = Object[PROTOTYPE], USE_NATIVE = typeof $Symbol == "function" && !!$GOPS.f, QObject = global$1.QObject, setter = !QObject || !QObject[PROTOTYPE] || !QObject[PROTOTYPE].findChild, setSymbolDesc = DESCRIPTORS && $fails(function() {
   return _create$1(dP({}, "a", {
     get: function() {
       return dP(this, "a", { value: 7 }).a;
@@ -143620,7 +143677,7 @@ function require_setProto() {
 var $export$1 = _export;
 $export$1($export$1.S, "Object", { setPrototypeOf: require_setProto().set });
 var setPrototypeOf$1 = _coreExports.Object.setPrototypeOf, setPrototypeOf = { default: setPrototypeOf$1, __esModule: !0 }, $export = _export;
-$export($export.S, "Object", { create: _objectCreate });
+$export($export.S, "Object", { create: require_objectCreate() });
 var $Object = _coreExports.Object, create$1 = function a(s, $) {
   return $Object.create(s, $);
 }, create = { default: create$1, __esModule: !0 }, _setPrototypeOf = setPrototypeOf, _setPrototypeOf2 = _interopRequireDefault$c(_setPrototypeOf), _create = create, _create2 = _interopRequireDefault$c(_create), _typeof2 = _typeof$j, _typeof3 = _interopRequireDefault$c(_typeof2);
@@ -151934,7 +151991,7 @@ const FormRender = withProvider(FormCore, defaultWidgets), svgBaseProp = {
     );
   }) }) });
 }, ButtonGroupWidget$1 = ButtonGroupWidget, { Text: Text$2 } = Typography$1, DetailView = (a) => {
-  const { token: s } = theme.useToken(), { size: $, schemas: _, changeSchemas: _e, deselectSchema: tt, activeSchema: nt } = a, at = useForm(), ot = reactExports.useContext(I18nContext), rt = reactExports.useContext(PluginsRegistry), st = reactExports.useContext(OptionsContext), [lt, et] = reactExports.useState({});
+  const { token: s } = theme.useToken(), { size: $, schemasList: _, changeSchemas: _e, deselectSchema: tt, activeSchema: nt } = a, at = useForm(), ot = reactExports.useContext(I18nContext), rt = reactExports.useContext(PluginsRegistry), st = reactExports.useContext(OptionsContext), [lt, et] = reactExports.useState({});
   reactExports.useEffect(() => {
     const ct = {
       AlignWidget: (vt) => /* @__PURE__ */ jsxRuntimeExports.jsx(AlignWidget$1, { ...vt, ...a, options: st }),
@@ -151960,30 +152017,38 @@ const FormRender = withProvider(FormCore, defaultWidgets), svgBaseProp = {
     et(ct);
   }, [nt, rt, JSON.stringify(st)]), reactExports.useEffect(() => {
     const ct = { ...nt };
-    ct.x = ct.position.x, ct.y = ct.position.y, delete ct.position, at.setValues(ct);
+    ct.editable = !ct.readOnly, at.setValues(ct);
   }, [nt, at]), reactExports.useEffect(() => at.resetFields(), [nt.id]), reactExports.useEffect(() => {
     it.current = (ct) => {
-      for (const vt of Object.values(_))
-        if (vt.key === ct && vt.id !== nt.id)
-          return !1;
+      for (const vt of _)
+        for (const At of Object.values(vt))
+          if (At.key === ct && At.id !== nt.id)
+            return !1;
       return !0;
     };
   }, [_, nt]);
   const it = reactExports.useRef((ct) => !0), ut = (ct, vt) => it.current(vt), ft = debounce$1((ct) => {
     const vt = (xt, bt) => typeof xt == "object" ? JSON.stringify(xt) !== JSON.stringify(bt) : xt !== bt;
     let At = [];
-    for (let xt in ct) {
+    for (const xt in ct) {
       if (["id", "content"].includes(xt))
         continue;
-      let bt = ct[xt], Et = !1;
-      ["x", "y"].includes(xt) ? (Et = bt !== nt.position[xt], xt = "position." + xt) : Et = vt(bt, nt[xt]), Et && (bt === null && ["rotate", "opacity"].includes(xt) && (bt = void 0), At.push({ key: xt, value: bt, schemaId: nt.id }));
+      let bt = ct[xt];
+      if (vt(bt, nt[xt])) {
+        if (bt === null && ["rotate", "opacity"].includes(xt) && (bt = void 0), xt === "editable") {
+          const Et = !bt;
+          At.push({ key: "readOnly", value: Et, schemaId: nt.id }), Et && At.push({ key: "required", value: !1, schemaId: nt.id });
+          continue;
+        }
+        At.push({ key: xt, value: bt, schemaId: nt.id });
+      }
     }
     At.length && at.validateFields().then(() => _e(At)).catch((xt) => {
       xt.errorFields.length && (At = At.filter((bt) => !xt.errorFields.find(
         (Et) => Et.name.includes(bt.key)
       ))), At.length && _e(At);
     });
-  }, 500), ht = Object.values(rt).find(
+  }, 100), ht = Object.values(rt).find(
     (ct) => (ct == null ? void 0 : ct.propPanel.defaultSchema.type) === nt.type
   ), dt = ht == null ? void 0 : ht.propPanel.schema;
   dt || console.error(`[@pdfme/ui] No propPanel.schema for ${nt.type}.
@@ -152012,28 +152077,26 @@ Check this document: https://pdfme.com/docs/custom-schemas`);
           validator: ut,
           message: ot("validation.uniqueName")
         }],
-        props: { autocomplete: "off" }
+        props: { autoComplete: "off" }
       },
-      required: { title: ot("required"), type: "boolean", span: 8, hidden: pt == null ? void 0 : pt.readOnly },
+      editable: { title: ot("editable"), type: "boolean", span: 8, hidden: (pt == null ? void 0 : pt.readOnly) !== void 0 },
+      required: { title: ot("required"), type: "boolean", span: 16, hidden: "{{!formData.editable}}" },
       "-": { type: "void", widget: "Divider" },
       align: { title: ot("align"), type: "void", widget: "AlignWidget" },
-      x: { title: "X", type: "number", widget: "inputNumber", required: !0, span: 8, min: 0 },
-      y: { title: "Y", type: "number", widget: "inputNumber", required: !0, span: 8, min: 0 },
-      rotate: {
-        title: ot("rotate"),
-        type: "number",
-        widget: "inputNumber",
-        disabled: (pt == null ? void 0 : pt.rotate) === void 0,
-        max: 360,
-        props: { min: 0 },
-        span: 8
+      position: {
+        type: "object",
+        widget: "card",
+        properties: {
+          x: { title: "X", type: "number", widget: "inputNumber", required: !0, span: 8, min: 0 },
+          y: { title: "Y", type: "number", widget: "inputNumber", required: !0, span: 8, min: 0 }
+        }
       },
       width: {
         title: ot("width"),
         type: "number",
         widget: "inputNumber",
         required: !0,
-        span: 8,
+        span: 6,
         props: { min: 0 }
       },
       height: {
@@ -152041,30 +152104,39 @@ Check this document: https://pdfme.com/docs/custom-schemas`);
         type: "number",
         widget: "inputNumber",
         required: !0,
-        span: 8,
+        span: 6,
         props: { min: 0 }
       },
+      rotate: {
+        title: ot("rotate"),
+        type: "number",
+        widget: "inputNumber",
+        disabled: (pt == null ? void 0 : pt.rotate) === void 0,
+        max: 360,
+        props: { min: 0 },
+        span: 6
+      },
       opacity: {
         title: ot("opacity"),
         type: "number",
         widget: "inputNumber",
         disabled: (pt == null ? void 0 : pt.opacity) === void 0,
         props: { step: 0.1, min: 0, max: 1 },
-        span: 8
+        span: 6
       }
     }
   };
   if (typeof dt == "function") {
-    const ct = dt({
-      ...a,
+    const { schemasList: ct, ...vt } = a, At = dt({
+      ...vt,
       options: st,
       theme: s,
       i18n: ot
     }) || {};
     mt.properties = {
       ...mt.properties,
-      ...Object.keys(ct).length === 0 ? {} : { "--": { type: "void", widget: "Divider" } },
-      ...ct
+      ...Object.keys(At).length === 0 ? {} : { "--": { type: "void", widget: "Divider" } },
+      ...At
     };
   } else {
     const ct = dt || {};
@@ -162423,8 +162495,8 @@ const Guides$2 = Guides$1, guideStyle = (a, s, $, _) => ({
     dt(Dt), Ct(), pt(0), (Ut = at.current) != null && Ut.scroll && at.current.scroll({ top: 0, behavior: "smooth" });
   }, []), jt = (Tt) => {
     const [Dt, Ut, Vt, Qt] = isBlankPdf(a.basePdf) ? a.basePdf.padding : [0, 0, 0, 0], qt = St[gt], Zt = (rr) => {
-      let Yt = ht[gt].length + 1, Kt = rr + Yt;
-      for (; ht[gt].find((nr) => nr.key === Kt); )
+      let Yt = ht.reduce((nr, tr) => nr + tr.length, 1), Kt = rr + Yt;
+      for (; ht.some((nr) => nr.find((tr) => tr.key === Kt)); )
         Yt++, Kt = rr + Yt;
       return Kt;
     }, ar = (rr, Yt, Kt) => Math.min(Math.max(rr, Yt), Kt), Jt = {
@@ -162512,6 +162584,7 @@ const Guides$2 = Guides$1, guideStyle = (a, s, $, _) => ({
             size: s,
             pageSize: St[gt] ?? [],
             activeElements: ut,
+            schemasList: ht,
             schemas: ht[gt] ?? [],
             changeSchemas: Rt,
             onSortEnd: Ht,