@prolibu-suite/cobalt-form-builder 0.2.0

package/dist/cobalt-form-builder.js

@@ -0,0 +1,3446 @@
+import { ref as de, computed as F, reactive as Nn, inject as al, defineComponent as xe, openBlock as C, createElementBlock as D, createElementVNode as p, unref as b, normalizeClass as Ee, createStaticVNode as il, createVNode as x, toDisplayString as ce, createCommentVNode as U, Fragment as Q, renderList as De, watch as Ke, toRefs as rl, h as sl, getCurrentInstance as an, onMounted as An, nextTick as Pn, onUnmounted as ul, isRef as Bt, withModifiers as He, createBlock as Se, createTextVNode as Ye, withCtx as St, normalizeStyle as $n, mergeProps as dl, withDirectives as Fn, vModelText as cl, provide as pl, onBeforeUnmount as fl, renderSlot as mt, vShow as vl } from "vue";
+import { CoInput as W, CoListItem as ml, CoSelect as Ue, CoIconButton as Et, CoButton as It, CoSwitch as it, CoRating as hl, CoSlider as Mn, CoTabGroup as jt, CoTab as zt, CoCheckbox as ht } from "@prolibu-suite/cobalt-vue";
+import { defineCustomElements as gl } from "@prolibu-suite/cobalt-core/loader";
+import { defineCustomElements as bl } from "@prolibu-suite/cobalt-form/loader";
+import { resolveTheme as yl, isPagedSchema as Qt, toPagedSchema as pn, themeToStyles as _l, ACCENT_PRESET_HEX as gt } from "@prolibu-suite/cobalt-form-core";
+const Cl = 50;
+function Lt() {
+  return {
+    title: "Untitled Form",
+    description: "",
+    mode: "form",
+    pages: [
+      {
+        name: "page1",
+        title: "Page 1",
+        description: "",
+        fields: {
+          name: { type: "String", required: !0, label: "Nombre", full: !0 },
+          email: { type: "String", required: !0, format: "email", label: "Email" }
+        }
+      }
+    ],
+    theme: {}
+  };
+}
+const Kt = {
+  text: () => ({ type: "String" }),
+  textarea: () => ({ type: "String", uiCom: "TextArea" }),
+  number: () => ({ type: "Number" }),
+  date: () => ({ type: "Date" }),
+  boolean: () => ({ type: "Boolean" }),
+  select: () => ({ type: "String", enum: ["Option A", "Option B"] }),
+  ref: () => ({ type: "ObjectId", ref: "Company", displayName: "name" }),
+  rating: () => ({ type: "Number", uiCom: "Rating", max: 5 }),
+  slider: () => ({ type: "Number", uiCom: "Slider", min: 0, max: 100 }),
+  color: () => ({ type: "String", uiCom: "ColorPicker" }),
+  section: () => ({ uiCom: "Section" }),
+  file: () => ({ type: "String", uiCom: "File" })
+};
+function fn(e) {
+  return e.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/_/g, " ").toLowerCase().replace(/^./, (n) => n.toUpperCase());
+}
+function nt(e) {
+  return JSON.parse(JSON.stringify(e));
+}
+function Sl(e = {}) {
+  const n = e.onEvent ?? (() => {
+  }), t = de(Lt()), l = de({ kind: "page", pageIdx: 0, fieldName: null }), o = de([]), i = de([]), r = F(() => o.value.length > 0), s = F(() => i.value.length > 0), a = F(
+    () => t.value.pages[l.value.pageIdx] ?? null
+  ), g = F(() => {
+    const v = a.value, h = l.value.fieldName;
+    return !v || !h ? null : v.fields[h] ?? null;
+  });
+  function u(v) {
+    l.value = v, n({ type: "selection-changed", selection: v });
+  }
+  function d(v, h) {
+    u({
+      kind: h ? "field" : "page",
+      pageIdx: v,
+      fieldName: h
+    });
+  }
+  function T(v) {
+    u({ kind: "page", pageIdx: v, fieldName: null });
+  }
+  function w() {
+    u({ ...l.value, kind: "form" });
+  }
+  function y() {
+    o.value.push(nt(t.value)), o.value.length > Cl && o.value.shift(), i.value = [];
+  }
+  function k() {
+    const v = o.value.pop();
+    v && (i.value.push(nt(t.value)), t.value = v, j(), n({ type: "undo" }));
+  }
+  function B() {
+    const v = i.value.pop();
+    v && (o.value.push(nt(t.value)), t.value = v, j(), n({ type: "redo" }));
+  }
+  function j() {
+    const v = Math.min(l.value.pageIdx, t.value.pages.length - 1), h = t.value.pages[v], S = l.value.fieldName && h?.fields[l.value.fieldName] ? l.value.fieldName : null, $ = l.value.kind === "form" ? "form" : S ? "field" : "page";
+    l.value = { kind: $, pageIdx: Math.max(v, 0), fieldName: S };
+  }
+  function te(v) {
+    v !== t.value.title && (y(), t.value.title = v);
+  }
+  function z(v) {
+    v !== t.value.description && (y(), t.value.description = v);
+  }
+  function X(v) {
+    v !== t.value.mode && (y(), t.value.mode = v);
+  }
+  function O() {
+    y();
+    const v = t.value.pages.length + 1;
+    t.value.pages.push({
+      name: `page${v}`,
+      title: `Page ${v}`,
+      description: "",
+      fields: {}
+    });
+    const h = t.value.pages.length - 1;
+    T(h), n({ type: "page-added", pageIdx: h });
+  }
+  function se(v) {
+    t.value.pages.length <= 1 || (y(), t.value.pages.splice(v, 1), j(), n({ type: "page-removed", pageIdx: v }));
+  }
+  function J(v) {
+    const h = t.value.pages[v];
+    if (!h) return;
+    y();
+    const S = nt(h);
+    S.name = G(`${h.name}_copy`), S.title = `${h.title || h.name} (copy)`, t.value.pages.splice(v + 1, 0, S);
+    const $ = v + 1;
+    T($), n({ type: "page-duplicated", sourceIdx: v, newIdx: $ });
+  }
+  function ue(v, h) {
+    const S = t.value.pages[v];
+    S && (y(), Object.assign(S, h), n({ type: "page-updated", pageIdx: v, patch: h }));
+  }
+  function G(v) {
+    const h = new Set(t.value.pages.map(($) => $.name));
+    if (!h.has(v)) return v;
+    let S = 1;
+    for (; h.has(`${v}_${S}`); ) S++;
+    return `${v}_${S}`;
+  }
+  function E(v, h) {
+    const S = t.value.pages[v];
+    if (!S) return h;
+    let $ = h, ae = 1;
+    for (; $ in S.fields; ) $ = `${h}_${ae++}`;
+    return $;
+  }
+  function L(v, h = l.value.pageIdx) {
+    const S = t.value.pages[h];
+    if (!S) return;
+    const ae = (Kt[v] ?? (() => ({ type: "String" })))(), K = E(h, v);
+    if (K.startsWith("_")) throw new Error(`Reserved name "${K}"`);
+    y(), S.fields = { ...S.fields, [K]: { ...ae, label: fn(K) } }, d(h, K), n({ type: "field-added", pageIdx: h, fieldName: K, kind: v });
+  }
+  function Y(v, h, S) {
+    const $ = t.value.pages[v];
+    if (!$) return;
+    const K = (Kt[S] ?? (() => ({ type: "String" })))(), fe = E(v, S);
+    if (fe.startsWith("_")) throw new Error(`Reserved name "${fe}"`);
+    y();
+    const Ae = Object.entries($.fields), dn = Ae.findIndex(([ol]) => ol === h), cn = [fe, { ...K, label: fn(fe) }];
+    dn === -1 ? Ae.push(cn) : Ae.splice(dn + 1, 0, cn), $.fields = Object.fromEntries(Ae), d(v, fe), n({ type: "field-added", pageIdx: v, fieldName: fe, kind: S });
+  }
+  function le(v, h) {
+    const S = t.value.pages[v];
+    if (!S || !(h in S.fields)) return;
+    y();
+    const $ = { ...S.fields };
+    delete $[h], S.fields = $, l.value.pageIdx === v && l.value.fieldName === h && (l.value = { kind: "page", pageIdx: v, fieldName: null }), n({ type: "field-removed", pageIdx: v, fieldName: h });
+  }
+  function H(v, h) {
+    const S = t.value.pages[v];
+    if (!S || !(h in S.fields)) return;
+    y();
+    const $ = nt(S.fields[h]), ae = E(v, `${h}_copy`), K = {};
+    for (const [fe, Ae] of Object.entries(S.fields))
+      K[fe] = Ae, fe === h && (K[ae] = $);
+    S.fields = K, d(v, ae), n({ type: "field-duplicated", pageIdx: v, sourceName: h, newName: ae });
+  }
+  function N(v, h, S) {
+    const $ = t.value.pages[v];
+    !$ || !(h in $.fields) || (y(), $.fields = {
+      ...$.fields,
+      [h]: { ...$.fields[h], ...S }
+    }, n({ type: "field-updated", pageIdx: v, fieldName: h, patch: S }));
+  }
+  function c(v, h, S) {
+    const $ = t.value.pages[v];
+    !$ || !(h in $.fields) || (y(), $.fields = { ...$.fields, [h]: { ...S } }, n({ type: "field-updated", pageIdx: v, fieldName: h, patch: S }));
+  }
+  function m(v, h, S) {
+    if (h === S) return;
+    const $ = t.value.pages[v];
+    if (!$ || !(h in $.fields)) return;
+    if (S in $.fields) throw new Error(`Field "${S}" already exists`);
+    if (S.startsWith("_")) throw new Error(`Reserved name "${S}"`);
+    y();
+    const ae = {};
+    for (const [K, fe] of Object.entries($.fields))
+      ae[K === h ? S : K] = fe;
+    $.fields = ae, l.value.pageIdx === v && l.value.fieldName === h && (l.value = { kind: "field", pageIdx: v, fieldName: S }), n({ type: "field-renamed", pageIdx: v, oldName: h, newName: S });
+  }
+  function ge(v, h, S) {
+    const $ = t.value.pages[v];
+    if (!$) return;
+    const ae = Object.keys($.fields);
+    if (h === S || h < 0 || h >= ae.length || S < 0 || S >= ae.length) return;
+    y();
+    const [K] = ae.splice(h, 1);
+    ae.splice(S, 0, K);
+    const fe = {};
+    for (const Ae of ae) fe[Ae] = $.fields[Ae];
+    $.fields = fe, n({ type: "field-reordered", pageIdx: v, order: ae });
+  }
+  function we(v, h) {
+    const S = t.value.pages[v];
+    if (!S) return;
+    const $ = Object.keys(S.fields);
+    if (h.length !== $.length) return;
+    for (const K of h)
+      if (!$.includes(K)) return;
+    if ($.every((K, fe) => K === h[fe])) return;
+    y();
+    const ae = {};
+    for (const K of h) ae[K] = S.fields[K];
+    S.fields = ae, n({ type: "field-reordered", pageIdx: v, order: h });
+  }
+  const Me = F(() => yl(t.value.theme));
+  function Rt(v) {
+    y(), t.value.theme = { ...t.value.theme, ...v }, n({ type: "theme-changed", theme: t.value.theme });
+  }
+  function vt(v, h) {
+    y();
+    const S = t.value.theme[v] ?? {};
+    t.value.theme = {
+      ...t.value.theme,
+      [v]: { ...S, ...h }
+    }, n({ type: "theme-changed", theme: t.value.theme });
+  }
+  function I() {
+    y(), t.value.theme = {}, n({ type: "theme-changed", theme: t.value.theme });
+  }
+  function f(v) {
+    if (y(), Qt(v)) {
+      const h = pn(v);
+      t.value = {
+        title: v.title || t.value.title,
+        description: v.description || "",
+        mode: h.mode || "form",
+        pages: h.pages.map((S) => ({
+          name: S.name,
+          title: S.title,
+          description: S.description,
+          visibleIf: S.visibleIf,
+          hideTitle: S.hideTitle,
+          hideDescription: S.hideDescription,
+          fields: S.fields
+        })),
+        theme: h.theme || {}
+      };
+    } else
+      t.value = {
+        ...Lt(),
+        pages: [{ name: "page1", title: "Page 1", description: "", fields: v }]
+      };
+    l.value = { kind: "page", pageIdx: 0, fieldName: null }, n({ type: "schema-replaced" });
+  }
+  const M = F(() => {
+    const v = Object.keys(t.value.theme).length > 0;
+    return t.value.pages.length === 1 && !v ? t.value.pages[0].fields : {
+      title: t.value.title,
+      ...t.value.description ? { description: t.value.description } : {},
+      mode: t.value.mode,
+      pages: t.value.pages.map((h) => ({
+        name: h.name,
+        title: h.title,
+        description: h.description,
+        visibleIf: h.visibleIf,
+        ...h.hideTitle ? { hideTitle: !0 } : {},
+        ...h.hideDescription ? { hideDescription: !0 } : {},
+        fields: h.fields
+      })),
+      ...v ? { theme: t.value.theme } : {}
+    };
+  });
+  if (e.initialSchema && Object.keys(e.initialSchema).length > 0)
+    if (Qt(e.initialSchema)) {
+      const v = pn(e.initialSchema);
+      t.value = {
+        title: e.initialSchema.title || "Untitled Form",
+        description: e.initialSchema.description || "",
+        mode: v.mode || "form",
+        pages: v.pages.map((h) => ({
+          name: h.name,
+          title: h.title,
+          description: h.description,
+          visibleIf: h.visibleIf,
+          hideTitle: h.hideTitle,
+          hideDescription: h.hideDescription,
+          fields: h.fields
+        })),
+        theme: v.theme || {}
+      };
+    } else
+      t.value = {
+        ...Lt(),
+        pages: [{ name: "page1", title: "Page 1", description: "", fields: e.initialSchema }]
+      };
+  return Nn({
+    data: t,
+    selection: l,
+    currentPage: a,
+    selectedField: g,
+    canUndo: r,
+    canRedo: s,
+    exported: M,
+    resolvedTheme: Me,
+    selectField: d,
+    selectPage: T,
+    selectForm: w,
+    undo: k,
+    redo: B,
+    setTitle: te,
+    setDescription: z,
+    setMode: X,
+    setTheme: Rt,
+    setThemeSection: vt,
+    resetTheme: I,
+    addPage: O,
+    removePage: se,
+    duplicatePage: J,
+    updatePage: ue,
+    addField: L,
+    insertFieldAfter: Y,
+    removeField: le,
+    duplicateField: H,
+    updateField: N,
+    replaceFieldDef: c,
+    renameField: m,
+    moveField: ge,
+    reorderFieldsByNames: we,
+    replaceAll: f
+  });
+}
+const Rn = /* @__PURE__ */ Symbol(
+  "CobaltFormBuilder.schemaStore"
+);
+function ze() {
+  const e = al(Rn);
+  if (!e)
+    throw new Error(
+      "[cobalt-form-builder] useSchemaStore() must be called inside a <CobaltFormBuilder>. Make sure the component lives in the builder subtree, or call createSchemaStore() and provide it yourself."
+    );
+  return e;
+}
+const Z = [
+  // Inputs
+  { id: "text", label: "Single-line input", group: "inputs", aliases: ["text", "string"], icon: "text-aa" },
+  { id: "textarea", label: "Multi-line text", group: "inputs", aliases: ["textarea", "comment"], icon: "text-align-left" },
+  { id: "number", label: "Number", group: "inputs", aliases: ["integer", "numeric"], icon: "hash" },
+  { id: "date", label: "Date", group: "inputs", aliases: ["calendar"], icon: "calendar" },
+  // Choices
+  { id: "boolean", label: "Yes / No", group: "choices", aliases: ["switch", "toggle"], icon: "toggle-left" },
+  { id: "select", label: "Dropdown", group: "choices", aliases: ["dropdown", "enum"], icon: "caret-circle-down" },
+  { id: "ref", label: "Reference", group: "choices", aliases: ["lookup", "model"], icon: "link" },
+  // Advanced
+  { id: "rating", label: "Rating scale", group: "advanced", aliases: ["stars", "score"], icon: "star" },
+  { id: "slider", label: "Slider", group: "advanced", aliases: ["range"], icon: "sliders-horizontal" },
+  { id: "color", label: "Color picker", group: "advanced", aliases: ["hex", "palette"], icon: "palette" },
+  { id: "file", label: "File upload", group: "advanced", aliases: ["attachment"], icon: "paperclip" },
+  // Layout
+  { id: "section", label: "Section divider", group: "layout", aliases: ["header", "group"], icon: "minus" }
+], xl = {
+  inputs: "Inputs",
+  choices: "Choices",
+  advanced: "Advanced",
+  layout: "Layout"
+}, wl = { class: "toolbox" }, kl = { class: "toolbox__search" }, Tl = { class: "toolbox__scroll" }, Dl = {
+  key: 0,
+  class: "toolbox__empty"
+}, El = { class: "toolbox__group-label" }, Il = { class: "toolbox__list" }, Ol = ["onDragstart"], Nl = /* @__PURE__ */ xe({
+  __name: "FieldToolbox",
+  setup(e) {
+    const n = ze(), t = de(""), l = F(() => {
+      const s = t.value.trim().toLowerCase(), a = s ? Z.filter((u) => u.label.toLowerCase().includes(s) || u.id.toLowerCase().includes(s) ? !0 : (u.aliases || []).some((d) => d.toLowerCase().includes(s))) : Z, g = {};
+      for (const u of a)
+        g[u.group] || (g[u.group] = {
+          id: u.group,
+          label: xl[u.group],
+          items: []
+        }), g[u.group].items.push(u);
+      return Object.values(g);
+    });
+    function o(s, a) {
+      s.dataTransfer && (s.dataTransfer.setData("application/cobalt-field-kind", a), s.dataTransfer.effectAllowed = "copy");
+    }
+    function i(s) {
+      n.addField(s);
+    }
+    function r(s) {
+      const a = s.detail;
+      return a != null && typeof a == "object" && "value" in a ? a.value : a;
+    }
+    return (s, a) => (C(), D("div", wl, [
+      p("button", {
+        class: Ee(["toolbox__form-btn", { "is-active": b(n).selection.kind === "form" }]),
+        onClick: a[0] || (a[0] = (g) => b(n).selectForm())
+      }, [...a[2] || (a[2] = [
+        il('<span class="toolbox__form-btn-icon" data-v-8ac1929e><co-icon name="paint-brush" size="16" data-v-8ac1929e></co-icon></span><span class="toolbox__form-btn-body" data-v-8ac1929e><span class="toolbox__form-btn-label" data-v-8ac1929e>Theme</span><span class="toolbox__form-btn-sub" data-v-8ac1929e>Global form settings</span></span><co-icon name="caret-right" size="14" data-v-8ac1929e></co-icon>', 3)
+      ])], 2),
+      p("div", kl, [
+        x(b(W), {
+          placeholder: "Type to search…",
+          "icon-left": "magnifying-glass",
+          value: t.value,
+          onCoInput: a[1] || (a[1] = (g) => t.value = r(g) ?? "")
+        }, null, 8, ["value"])
+      ]),
+      p("div", Tl, [
+        l.value.length === 0 ? (C(), D("div", Dl, ' No matches for "' + ce(t.value) + '" ', 1)) : U("", !0),
+        (C(!0), D(Q, null, De(l.value, (g) => (C(), D("div", {
+          key: g.id,
+          class: "toolbox__group"
+        }, [
+          p("div", El, ce(g.label), 1),
+          p("ul", Il, [
+            (C(!0), D(Q, null, De(g.items, (u) => (C(), D("li", {
+              key: u.id,
+              draggable: "true",
+              class: "toolbox__row",
+              onDragstart: (d) => o(d, u.id)
+            }, [
+              x(b(ml), {
+                label: u.label,
+                icon: u.icon,
+                dense: "",
+                onCoSelect: (d) => i(u.id)
+              }, null, 8, ["label", "icon", "onCoSelect"])
+            ], 40, Ol))), 128))
+          ])
+        ]))), 128))
+      ])
+    ]));
+  }
+}), Ie = (e, n) => {
+  const t = e.__vccOpts || e;
+  for (const [l, o] of n)
+    t[l] = o;
+  return t;
+}, Al = /* @__PURE__ */ Ie(Nl, [["__scopeId", "data-v-8ac1929e"]]), Pl = ["data-placeholder"], $l = /* @__PURE__ */ xe({
+  __name: "EditableText",
+  props: {
+    modelValue: {},
+    placeholder: {},
+    multiline: { type: Boolean }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: n }) {
+    const t = e, l = n, o = de(null), i = de(!1);
+    Ke(
+      () => t.modelValue,
+      (d) => {
+        i.value || o.value && o.value.innerText !== d && (o.value.innerText = d);
+      },
+      { immediate: !1 }
+    );
+    function r() {
+    }
+    function s() {
+      if (!o.value) return;
+      const d = o.value.innerText.replace(/\n+$/, "");
+      d !== t.modelValue && l("update:modelValue", d);
+    }
+    function a() {
+      i.value = !1, s();
+    }
+    function g() {
+      i.value = !0;
+    }
+    function u(d) {
+      !t.multiline && d.key === "Enter" ? (d.preventDefault(), d.target.blur()) : d.key === "Escape" && (o.value && (o.value.innerText = t.modelValue), d.target.blur());
+    }
+    return (d, T) => (C(), D("span", {
+      ref_key: "el",
+      ref: o,
+      class: Ee(["editable", { "is-empty": !e.modelValue }]),
+      "data-placeholder": e.placeholder,
+      contenteditable: "plaintext-only",
+      spellcheck: "false",
+      onInput: r,
+      onBlur: a,
+      onFocus: g,
+      onKeydown: u
+    }, ce(e.modelValue), 43, Pl));
+  }
+}), et = /* @__PURE__ */ Ie($l, [["__scopeId", "data-v-85570517"]]);
+var Fl = Object.defineProperty, Ot = Object.getOwnPropertySymbols, Bn = Object.prototype.hasOwnProperty, jn = Object.prototype.propertyIsEnumerable, vn = (e, n, t) => n in e ? Fl(e, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[n] = t, Ge = (e, n) => {
+  for (var t in n || (n = {}))
+    Bn.call(n, t) && vn(e, t, n[t]);
+  if (Ot)
+    for (var t of Ot(n))
+      jn.call(n, t) && vn(e, t, n[t]);
+  return e;
+}, zn = (e, n) => {
+  var t = {};
+  for (var l in e)
+    Bn.call(e, l) && n.indexOf(l) < 0 && (t[l] = e[l]);
+  if (e != null && Ot)
+    for (var l of Ot(e))
+      n.indexOf(l) < 0 && jn.call(e, l) && (t[l] = e[l]);
+  return t;
+};
+const Ln = "[vue-draggable-plus]: ";
+function Ml(e) {
+  console.warn(Ln + e);
+}
+function Rl(e) {
+  console.error(Ln + e);
+}
+function mn(e, n, t) {
+  return t >= 0 && t < e.length && e.splice(t, 0, e.splice(n, 1)[0]), e;
+}
+function Bl(e) {
+  return e.replace(/-(\w)/g, (n, t) => t ? t.toUpperCase() : "");
+}
+function jl(e) {
+  return Object.keys(e).reduce((n, t) => (typeof e[t] < "u" && (n[Bl(t)] = e[t]), n), {});
+}
+function hn(e, n) {
+  return Array.isArray(e) && e.splice(n, 1), e;
+}
+function gn(e, n, t) {
+  return Array.isArray(e) && e.splice(n, 0, t), e;
+}
+function zl(e) {
+  return typeof e > "u";
+}
+function Ll(e) {
+  return typeof e == "string";
+}
+function bn(e, n, t) {
+  const l = e.children[t];
+  e.insertBefore(n, l);
+}
+function Vt(e) {
+  e.parentNode && e.parentNode.removeChild(e);
+}
+function Vl(e, n = document) {
+  var t;
+  let l = null;
+  return typeof n?.querySelector == "function" ? l = (t = n?.querySelector) == null ? void 0 : t.call(n, e) : l = document.querySelector(e), l || Ml(`Element not found: ${e}`), l;
+}
+function Yl(e, n, t = null) {
+  return function(...l) {
+    return e.apply(t, l), n.apply(t, l);
+  };
+}
+function Ul(e, n) {
+  const t = Ge({}, e);
+  return Object.keys(n).forEach((l) => {
+    t[l] ? t[l] = Yl(e[l], n[l]) : t[l] = n[l];
+  }), t;
+}
+function Xl(e) {
+  return e instanceof HTMLElement;
+}
+function yn(e, n) {
+  Object.keys(e).forEach((t) => {
+    n(t, e[t]);
+  });
+}
+function Hl(e) {
+  return e.charCodeAt(0) === 111 && e.charCodeAt(1) === 110 && (e.charCodeAt(2) > 122 || e.charCodeAt(2) < 97);
+}
+const ql = Object.assign;
+function _n(e, n) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var l = Object.getOwnPropertySymbols(e);
+    n && (l = l.filter(function(o) {
+      return Object.getOwnPropertyDescriptor(e, o).enumerable;
+    })), t.push.apply(t, l);
+  }
+  return t;
+}
+function Ne(e) {
+  for (var n = 1; n < arguments.length; n++) {
+    var t = arguments[n] != null ? arguments[n] : {};
+    n % 2 ? _n(Object(t), !0).forEach(function(l) {
+      Jl(e, l, t[l]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : _n(Object(t)).forEach(function(l) {
+      Object.defineProperty(e, l, Object.getOwnPropertyDescriptor(t, l));
+    });
+  }
+  return e;
+}
+function xt(e) {
+  "@babel/helpers - typeof";
+  return typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? xt = function(n) {
+    return typeof n;
+  } : xt = function(n) {
+    return n && typeof Symbol == "function" && n.constructor === Symbol && n !== Symbol.prototype ? "symbol" : typeof n;
+  }, xt(e);
+}
+function Jl(e, n, t) {
+  return n in e ? Object.defineProperty(e, n, {
+    value: t,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[n] = t, e;
+}
+function $e() {
+  return $e = Object.assign || function(e) {
+    for (var n = 1; n < arguments.length; n++) {
+      var t = arguments[n];
+      for (var l in t)
+        Object.prototype.hasOwnProperty.call(t, l) && (e[l] = t[l]);
+    }
+    return e;
+  }, $e.apply(this, arguments);
+}
+function Wl(e, n) {
+  if (e == null)
+    return {};
+  var t = {}, l = Object.keys(e), o, i;
+  for (i = 0; i < l.length; i++)
+    o = l[i], !(n.indexOf(o) >= 0) && (t[o] = e[o]);
+  return t;
+}
+function Gl(e, n) {
+  if (e == null)
+    return {};
+  var t = Wl(e, n), l, o;
+  if (Object.getOwnPropertySymbols) {
+    var i = Object.getOwnPropertySymbols(e);
+    for (o = 0; o < i.length; o++)
+      l = i[o], !(n.indexOf(l) >= 0) && Object.prototype.propertyIsEnumerable.call(e, l) && (t[l] = e[l]);
+  }
+  return t;
+}
+var Zl = "1.15.2";
+function Pe(e) {
+  if (typeof window < "u" && window.navigator)
+    return !!/* @__PURE__ */ navigator.userAgent.match(e);
+}
+var Fe = Pe(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i), pt = Pe(/Edge/i), Cn = Pe(/firefox/i), rt = Pe(/safari/i) && !Pe(/chrome/i) && !Pe(/android/i), Vn = Pe(/iP(ad|od|hone)/i), Yn = Pe(/chrome/i) && Pe(/android/i), Un = {
+  capture: !1,
+  passive: !1
+};
+function q(e, n, t) {
+  e.addEventListener(n, t, !Fe && Un);
+}
+function V(e, n, t) {
+  e.removeEventListener(n, t, !Fe && Un);
+}
+function Nt(e, n) {
+  if (n) {
+    if (n[0] === ">" && (n = n.substring(1)), e)
+      try {
+        if (e.matches)
+          return e.matches(n);
+        if (e.msMatchesSelector)
+          return e.msMatchesSelector(n);
+        if (e.webkitMatchesSelector)
+          return e.webkitMatchesSelector(n);
+      } catch {
+        return !1;
+      }
+    return !1;
+  }
+}
+function Ql(e) {
+  return e.host && e !== document && e.host.nodeType ? e.host : e.parentNode;
+}
+function Te(e, n, t, l) {
+  if (e) {
+    t = t || document;
+    do {
+      if (n != null && (n[0] === ">" ? e.parentNode === t && Nt(e, n) : Nt(e, n)) || l && e === t)
+        return e;
+      if (e === t)
+        break;
+    } while (e = Ql(e));
+  }
+  return null;
+}
+var Sn = /\s+/g;
+function be(e, n, t) {
+  if (e && n)
+    if (e.classList)
+      e.classList[t ? "add" : "remove"](n);
+    else {
+      var l = (" " + e.className + " ").replace(Sn, " ").replace(" " + n + " ", " ");
+      e.className = (l + (t ? " " + n : "")).replace(Sn, " ");
+    }
+}
+function A(e, n, t) {
+  var l = e && e.style;
+  if (l) {
+    if (t === void 0)
+      return document.defaultView && document.defaultView.getComputedStyle ? t = document.defaultView.getComputedStyle(e, "") : e.currentStyle && (t = e.currentStyle), n === void 0 ? t : t[n];
+    !(n in l) && n.indexOf("webkit") === -1 && (n = "-webkit-" + n), l[n] = t + (typeof t == "string" ? "" : "px");
+  }
+}
+function Qe(e, n) {
+  var t = "";
+  if (typeof e == "string")
+    t = e;
+  else
+    do {
+      var l = A(e, "transform");
+      l && l !== "none" && (t = l + " " + t);
+    } while (!n && (e = e.parentNode));
+  var o = window.DOMMatrix || window.WebKitCSSMatrix || window.CSSMatrix || window.MSCSSMatrix;
+  return o && new o(t);
+}
+function Xn(e, n, t) {
+  if (e) {
+    var l = e.getElementsByTagName(n), o = 0, i = l.length;
+    if (t)
+      for (; o < i; o++)
+        t(l[o], o);
+    return l;
+  }
+  return [];
+}
+function Oe() {
+  var e = document.scrollingElement;
+  return e || document.documentElement;
+}
+function re(e, n, t, l, o) {
+  if (!(!e.getBoundingClientRect && e !== window)) {
+    var i, r, s, a, g, u, d;
+    if (e !== window && e.parentNode && e !== Oe() ? (i = e.getBoundingClientRect(), r = i.top, s = i.left, a = i.bottom, g = i.right, u = i.height, d = i.width) : (r = 0, s = 0, a = window.innerHeight, g = window.innerWidth, u = window.innerHeight, d = window.innerWidth), (n || t) && e !== window && (o = o || e.parentNode, !Fe))
+      do
+        if (o && o.getBoundingClientRect && (A(o, "transform") !== "none" || t && A(o, "position") !== "static")) {
+          var T = o.getBoundingClientRect();
+          r -= T.top + parseInt(A(o, "border-top-width")), s -= T.left + parseInt(A(o, "border-left-width")), a = r + i.height, g = s + i.width;
+          break;
+        }
+      while (o = o.parentNode);
+    if (l && e !== window) {
+      var w = Qe(o || e), y = w && w.a, k = w && w.d;
+      w && (r /= k, s /= y, d /= y, u /= k, a = r + u, g = s + d);
+    }
+    return {
+      top: r,
+      left: s,
+      bottom: a,
+      right: g,
+      width: d,
+      height: u
+    };
+  }
+}
+function xn(e, n, t) {
+  for (var l = je(e, !0), o = re(e)[n]; l; ) {
+    var i = re(l)[t], r = void 0;
+    if (r = o >= i, !r)
+      return l;
+    if (l === Oe())
+      break;
+    l = je(l, !1);
+  }
+  return !1;
+}
+function tt(e, n, t, l) {
+  for (var o = 0, i = 0, r = e.children; i < r.length; ) {
+    if (r[i].style.display !== "none" && r[i] !== P.ghost && (l || r[i] !== P.dragged) && Te(r[i], t.draggable, e, !1)) {
+      if (o === n)
+        return r[i];
+      o++;
+    }
+    i++;
+  }
+  return null;
+}
+function rn(e, n) {
+  for (var t = e.lastElementChild; t && (t === P.ghost || A(t, "display") === "none" || n && !Nt(t, n)); )
+    t = t.previousElementSibling;
+  return t || null;
+}
+function Ce(e, n) {
+  var t = 0;
+  if (!e || !e.parentNode)
+    return -1;
+  for (; e = e.previousElementSibling; )
+    e.nodeName.toUpperCase() !== "TEMPLATE" && e !== P.clone && (!n || Nt(e, n)) && t++;
+  return t;
+}
+function wn(e) {
+  var n = 0, t = 0, l = Oe();
+  if (e)
+    do {
+      var o = Qe(e), i = o.a, r = o.d;
+      n += e.scrollLeft * i, t += e.scrollTop * r;
+    } while (e !== l && (e = e.parentNode));
+  return [n, t];
+}
+function Kl(e, n) {
+  for (var t in e)
+    if (e.hasOwnProperty(t)) {
+      for (var l in n)
+        if (n.hasOwnProperty(l) && n[l] === e[t][l])
+          return Number(t);
+    }
+  return -1;
+}
+function je(e, n) {
+  if (!e || !e.getBoundingClientRect)
+    return Oe();
+  var t = e, l = !1;
+  do
+    if (t.clientWidth < t.scrollWidth || t.clientHeight < t.scrollHeight) {
+      var o = A(t);
+      if (t.clientWidth < t.scrollWidth && (o.overflowX == "auto" || o.overflowX == "scroll") || t.clientHeight < t.scrollHeight && (o.overflowY == "auto" || o.overflowY == "scroll")) {
+        if (!t.getBoundingClientRect || t === document.body)
+          return Oe();
+        if (l || n)
+          return t;
+        l = !0;
+      }
+    }
+  while (t = t.parentNode);
+  return Oe();
+}
+function eo(e, n) {
+  if (e && n)
+    for (var t in n)
+      n.hasOwnProperty(t) && (e[t] = n[t]);
+  return e;
+}
+function Yt(e, n) {
+  return Math.round(e.top) === Math.round(n.top) && Math.round(e.left) === Math.round(n.left) && Math.round(e.height) === Math.round(n.height) && Math.round(e.width) === Math.round(n.width);
+}
+var st;
+function Hn(e, n) {
+  return function() {
+    if (!st) {
+      var t = arguments, l = this;
+      t.length === 1 ? e.call(l, t[0]) : e.apply(l, t), st = setTimeout(function() {
+        st = void 0;
+      }, n);
+    }
+  };
+}
+function to() {
+  clearTimeout(st), st = void 0;
+}
+function qn(e, n, t) {
+  e.scrollLeft += n, e.scrollTop += t;
+}
+function Jn(e) {
+  var n = window.Polymer, t = window.jQuery || window.Zepto;
+  return n && n.dom ? n.dom(e).cloneNode(!0) : t ? t(e).clone(!0)[0] : e.cloneNode(!0);
+}
+function Wn(e, n, t) {
+  var l = {};
+  return Array.from(e.children).forEach(function(o) {
+    var i, r, s, a;
+    if (!(!Te(o, n.draggable, e, !1) || o.animated || o === t)) {
+      var g = re(o);
+      l.left = Math.min((i = l.left) !== null && i !== void 0 ? i : 1 / 0, g.left), l.top = Math.min((r = l.top) !== null && r !== void 0 ? r : 1 / 0, g.top), l.right = Math.max((s = l.right) !== null && s !== void 0 ? s : -1 / 0, g.right), l.bottom = Math.max((a = l.bottom) !== null && a !== void 0 ? a : -1 / 0, g.bottom);
+    }
+  }), l.width = l.right - l.left, l.height = l.bottom - l.top, l.x = l.left, l.y = l.top, l;
+}
+var _e = "Sortable" + (/* @__PURE__ */ new Date()).getTime();
+function no() {
+  var e = [], n;
+  return {
+    captureAnimationState: function() {
+      if (e = [], !!this.options.animation) {
+        var t = [].slice.call(this.el.children);
+        t.forEach(function(l) {
+          if (!(A(l, "display") === "none" || l === P.ghost)) {
+            e.push({
+              target: l,
+              rect: re(l)
+            });
+            var o = Ne({}, e[e.length - 1].rect);
+            if (l.thisAnimationDuration) {
+              var i = Qe(l, !0);
+              i && (o.top -= i.f, o.left -= i.e);
+            }
+            l.fromRect = o;
+          }
+        });
+      }
+    },
+    addAnimationState: function(t) {
+      e.push(t);
+    },
+    removeAnimationState: function(t) {
+      e.splice(Kl(e, {
+        target: t
+      }), 1);
+    },
+    animateAll: function(t) {
+      var l = this;
+      if (!this.options.animation) {
+        clearTimeout(n), typeof t == "function" && t();
+        return;
+      }
+      var o = !1, i = 0;
+      e.forEach(function(r) {
+        var s = 0, a = r.target, g = a.fromRect, u = re(a), d = a.prevFromRect, T = a.prevToRect, w = r.rect, y = Qe(a, !0);
+        y && (u.top -= y.f, u.left -= y.e), a.toRect = u, a.thisAnimationDuration && Yt(d, u) && !Yt(g, u) && // Make sure animatingRect is on line between toRect & fromRect
+        (w.top - u.top) / (w.left - u.left) === (g.top - u.top) / (g.left - u.left) && (s = oo(w, d, T, l.options)), Yt(u, g) || (a.prevFromRect = g, a.prevToRect = u, s || (s = l.options.animation), l.animate(a, w, u, s)), s && (o = !0, i = Math.max(i, s), clearTimeout(a.animationResetTimer), a.animationResetTimer = setTimeout(function() {
+          a.animationTime = 0, a.prevFromRect = null, a.fromRect = null, a.prevToRect = null, a.thisAnimationDuration = null;
+        }, s), a.thisAnimationDuration = s);
+      }), clearTimeout(n), o ? n = setTimeout(function() {
+        typeof t == "function" && t();
+      }, i) : typeof t == "function" && t(), e = [];
+    },
+    animate: function(t, l, o, i) {
+      if (i) {
+        A(t, "transition", ""), A(t, "transform", "");
+        var r = Qe(this.el), s = r && r.a, a = r && r.d, g = (l.left - o.left) / (s || 1), u = (l.top - o.top) / (a || 1);
+        t.animatingX = !!g, t.animatingY = !!u, A(t, "transform", "translate3d(" + g + "px," + u + "px,0)"), this.forRepaintDummy = lo(t), A(t, "transition", "transform " + i + "ms" + (this.options.easing ? " " + this.options.easing : "")), A(t, "transform", "translate3d(0,0,0)"), typeof t.animated == "number" && clearTimeout(t.animated), t.animated = setTimeout(function() {
+          A(t, "transition", ""), A(t, "transform", ""), t.animated = !1, t.animatingX = !1, t.animatingY = !1;
+        }, i);
+      }
+    }
+  };
+}
+function lo(e) {
+  return e.offsetWidth;
+}
+function oo(e, n, t, l) {
+  return Math.sqrt(Math.pow(n.top - e.top, 2) + Math.pow(n.left - e.left, 2)) / Math.sqrt(Math.pow(n.top - t.top, 2) + Math.pow(n.left - t.left, 2)) * l.animation;
+}
+var qe = [], Ut = {
+  initializeByDefault: !0
+}, ft = {
+  mount: function(e) {
+    for (var n in Ut)
+      Ut.hasOwnProperty(n) && !(n in e) && (e[n] = Ut[n]);
+    qe.forEach(function(t) {
+      if (t.pluginName === e.pluginName)
+        throw "Sortable: Cannot mount plugin ".concat(e.pluginName, " more than once");
+    }), qe.push(e);
+  },
+  pluginEvent: function(e, n, t) {
+    var l = this;
+    this.eventCanceled = !1, t.cancel = function() {
+      l.eventCanceled = !0;
+    };
+    var o = e + "Global";
+    qe.forEach(function(i) {
+      n[i.pluginName] && (n[i.pluginName][o] && n[i.pluginName][o](Ne({
+        sortable: n
+      }, t)), n.options[i.pluginName] && n[i.pluginName][e] && n[i.pluginName][e](Ne({
+        sortable: n
+      }, t)));
+    });
+  },
+  initializePlugins: function(e, n, t, l) {
+    qe.forEach(function(r) {
+      var s = r.pluginName;
+      if (!(!e.options[s] && !r.initializeByDefault)) {
+        var a = new r(e, n, e.options);
+        a.sortable = e, a.options = e.options, e[s] = a, $e(t, a.defaults);
+      }
+    });
+    for (var o in e.options)
+      if (e.options.hasOwnProperty(o)) {
+        var i = this.modifyOption(e, o, e.options[o]);
+        typeof i < "u" && (e.options[o] = i);
+      }
+  },
+  getEventProperties: function(e, n) {
+    var t = {};
+    return qe.forEach(function(l) {
+      typeof l.eventProperties == "function" && $e(t, l.eventProperties.call(n[l.pluginName], e));
+    }), t;
+  },
+  modifyOption: function(e, n, t) {
+    var l;
+    return qe.forEach(function(o) {
+      e[o.pluginName] && o.optionListeners && typeof o.optionListeners[n] == "function" && (l = o.optionListeners[n].call(e[o.pluginName], t));
+    }), l;
+  }
+};
+function ao(e) {
+  var n = e.sortable, t = e.rootEl, l = e.name, o = e.targetEl, i = e.cloneEl, r = e.toEl, s = e.fromEl, a = e.oldIndex, g = e.newIndex, u = e.oldDraggableIndex, d = e.newDraggableIndex, T = e.originalEvent, w = e.putSortable, y = e.extraEventProperties;
+  if (n = n || t && t[_e], !!n) {
+    var k, B = n.options, j = "on" + l.charAt(0).toUpperCase() + l.substr(1);
+    window.CustomEvent && !Fe && !pt ? k = new CustomEvent(l, {
+      bubbles: !0,
+      cancelable: !0
+    }) : (k = document.createEvent("Event"), k.initEvent(l, !0, !0)), k.to = r || t, k.from = s || t, k.item = o || t, k.clone = i, k.oldIndex = a, k.newIndex = g, k.oldDraggableIndex = u, k.newDraggableIndex = d, k.originalEvent = T, k.pullMode = w ? w.lastPutMode : void 0;
+    var te = Ne(Ne({}, y), ft.getEventProperties(l, n));
+    for (var z in te)
+      k[z] = te[z];
+    t && t.dispatchEvent(k), B[j] && B[j].call(n, k);
+  }
+}
+var io = ["evt"], he = function(e, n) {
+  var t = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {}, l = t.evt, o = Gl(t, io);
+  ft.pluginEvent.bind(P)(e, n, Ne({
+    dragEl: _,
+    parentEl: oe,
+    ghostEl: R,
+    rootEl: ee,
+    nextEl: Xe,
+    lastDownEl: wt,
+    cloneEl: ne,
+    cloneHidden: Be,
+    dragStarted: lt,
+    putSortable: pe,
+    activeSortable: P.active,
+    originalEvent: l,
+    oldIndex: Ze,
+    oldDraggableIndex: ut,
+    newIndex: ye,
+    newDraggableIndex: Re,
+    hideGhostForTarget: Kn,
+    unhideGhostForTarget: el,
+    cloneNowHidden: function() {
+      Be = !0;
+    },
+    cloneNowShown: function() {
+      Be = !1;
+    },
+    dispatchSortableEvent: function(i) {
+      me({
+        sortable: n,
+        name: i,
+        originalEvent: l
+      });
+    }
+  }, o));
+};
+function me(e) {
+  ao(Ne({
+    putSortable: pe,
+    cloneEl: ne,
+    targetEl: _,
+    rootEl: ee,
+    oldIndex: Ze,
+    oldDraggableIndex: ut,
+    newIndex: ye,
+    newDraggableIndex: Re
+  }, e));
+}
+var _, oe, R, ee, Xe, wt, ne, Be, Ze, ye, ut, Re, bt, pe, We = !1, At = !1, Pt = [], Le, ke, Xt, Ht, kn, Tn, lt, Je, dt, ct = !1, yt = !1, kt, ve, qt = [], en = !1, $t = [], Mt = typeof document < "u", _t = Vn, Dn = pt || Fe ? "cssFloat" : "float", ro = Mt && !Yn && !Vn && "draggable" in document.createElement("div"), Gn = (function() {
+  if (Mt) {
+    if (Fe)
+      return !1;
+    var e = document.createElement("x");
+    return e.style.cssText = "pointer-events:auto", e.style.pointerEvents === "auto";
+  }
+})(), Zn = function(e, n) {
+  var t = A(e), l = parseInt(t.width) - parseInt(t.paddingLeft) - parseInt(t.paddingRight) - parseInt(t.borderLeftWidth) - parseInt(t.borderRightWidth), o = tt(e, 0, n), i = tt(e, 1, n), r = o && A(o), s = i && A(i), a = r && parseInt(r.marginLeft) + parseInt(r.marginRight) + re(o).width, g = s && parseInt(s.marginLeft) + parseInt(s.marginRight) + re(i).width;
+  if (t.display === "flex")
+    return t.flexDirection === "column" || t.flexDirection === "column-reverse" ? "vertical" : "horizontal";
+  if (t.display === "grid")
+    return t.gridTemplateColumns.split(" ").length <= 1 ? "vertical" : "horizontal";
+  if (o && r.float && r.float !== "none") {
+    var u = r.float === "left" ? "left" : "right";
+    return i && (s.clear === "both" || s.clear === u) ? "vertical" : "horizontal";
+  }
+  return o && (r.display === "block" || r.display === "flex" || r.display === "table" || r.display === "grid" || a >= l && t[Dn] === "none" || i && t[Dn] === "none" && a + g > l) ? "vertical" : "horizontal";
+}, so = function(e, n, t) {
+  var l = t ? e.left : e.top, o = t ? e.right : e.bottom, i = t ? e.width : e.height, r = t ? n.left : n.top, s = t ? n.right : n.bottom, a = t ? n.width : n.height;
+  return l === r || o === s || l + i / 2 === r + a / 2;
+}, uo = function(e, n) {
+  var t;
+  return Pt.some(function(l) {
+    var o = l[_e].options.emptyInsertThreshold;
+    if (!(!o || rn(l))) {
+      var i = re(l), r = e >= i.left - o && e <= i.right + o, s = n >= i.top - o && n <= i.bottom + o;
+      if (r && s)
+        return t = l;
+    }
+  }), t;
+}, Qn = function(e) {
+  function n(o, i) {
+    return function(r, s, a, g) {
+      var u = r.options.group.name && s.options.group.name && r.options.group.name === s.options.group.name;
+      if (o == null && (i || u))
+        return !0;
+      if (o == null || o === !1)
+        return !1;
+      if (i && o === "clone")
+        return o;
+      if (typeof o == "function")
+        return n(o(r, s, a, g), i)(r, s, a, g);
+      var d = (i ? r : s).options.group.name;
+      return o === !0 || typeof o == "string" && o === d || o.join && o.indexOf(d) > -1;
+    };
+  }
+  var t = {}, l = e.group;
+  (!l || xt(l) != "object") && (l = {
+    name: l
+  }), t.name = l.name, t.checkPull = n(l.pull, !0), t.checkPut = n(l.put), t.revertClone = l.revertClone, e.group = t;
+}, Kn = function() {
+  !Gn && R && A(R, "display", "none");
+}, el = function() {
+  !Gn && R && A(R, "display", "");
+};
+Mt && !Yn && document.addEventListener("click", function(e) {
+  if (At)
+    return e.preventDefault(), e.stopPropagation && e.stopPropagation(), e.stopImmediatePropagation && e.stopImmediatePropagation(), At = !1, !1;
+}, !0);
+var Ve = function(e) {
+  if (_) {
+    e = e.touches ? e.touches[0] : e;
+    var n = uo(e.clientX, e.clientY);
+    if (n) {
+      var t = {};
+      for (var l in e)
+        e.hasOwnProperty(l) && (t[l] = e[l]);
+      t.target = t.rootEl = n, t.preventDefault = void 0, t.stopPropagation = void 0, n[_e]._onDragOver(t);
+    }
+  }
+}, co = function(e) {
+  _ && _.parentNode[_e]._isOutsideThisEl(e.target);
+};
+function P(e, n) {
+  if (!(e && e.nodeType && e.nodeType === 1))
+    throw "Sortable: `el` must be an HTMLElement, not ".concat({}.toString.call(e));
+  this.el = e, this.options = n = $e({}, n), e[_e] = this;
+  var t = {
+    group: null,
+    sort: !0,
+    disabled: !1,
+    store: null,
+    handle: null,
+    draggable: /^[uo]l$/i.test(e.nodeName) ? ">li" : ">*",
+    swapThreshold: 1,
+    // percentage; 0 <= x <= 1
+    invertSwap: !1,
+    // invert always
+    invertedSwapThreshold: null,
+    // will be set to same as swapThreshold if default
+    removeCloneOnHide: !0,
+    direction: function() {
+      return Zn(e, this.options);
+    },
+    ghostClass: "sortable-ghost",
+    chosenClass: "sortable-chosen",
+    dragClass: "sortable-drag",
+    ignore: "a, img",
+    filter: null,
+    preventOnFilter: !0,
+    animation: 0,
+    easing: null,
+    setData: function(i, r) {
+      i.setData("Text", r.textContent);
+    },
+    dropBubble: !1,
+    dragoverBubble: !1,
+    dataIdAttr: "data-id",
+    delay: 0,
+    delayOnTouchOnly: !1,
+    touchStartThreshold: (Number.parseInt ? Number : window).parseInt(window.devicePixelRatio, 10) || 1,
+    forceFallback: !1,
+    fallbackClass: "sortable-fallback",
+    fallbackOnBody: !1,
+    fallbackTolerance: 0,
+    fallbackOffset: {
+      x: 0,
+      y: 0
+    },
+    supportPointer: P.supportPointer !== !1 && "PointerEvent" in window && !rt,
+    emptyInsertThreshold: 5
+  };
+  ft.initializePlugins(this, e, t);
+  for (var l in t)
+    !(l in n) && (n[l] = t[l]);
+  Qn(n);
+  for (var o in this)
+    o.charAt(0) === "_" && typeof this[o] == "function" && (this[o] = this[o].bind(this));
+  this.nativeDraggable = n.forceFallback ? !1 : ro, this.nativeDraggable && (this.options.touchStartThreshold = 1), n.supportPointer ? q(e, "pointerdown", this._onTapStart) : (q(e, "mousedown", this._onTapStart), q(e, "touchstart", this._onTapStart)), this.nativeDraggable && (q(e, "dragover", this), q(e, "dragenter", this)), Pt.push(this.el), n.store && n.store.get && this.sort(n.store.get(this) || []), $e(this, no());
+}
+P.prototype = /** @lends Sortable.prototype */
+{
+  constructor: P,
+  _isOutsideThisEl: function(e) {
+    !this.el.contains(e) && e !== this.el && (Je = null);
+  },
+  _getDirection: function(e, n) {
+    return typeof this.options.direction == "function" ? this.options.direction.call(this, e, n, _) : this.options.direction;
+  },
+  _onTapStart: function(e) {
+    if (e.cancelable) {
+      var n = this, t = this.el, l = this.options, o = l.preventOnFilter, i = e.type, r = e.touches && e.touches[0] || e.pointerType && e.pointerType === "touch" && e, s = (r || e).target, a = e.target.shadowRoot && (e.path && e.path[0] || e.composedPath && e.composedPath()[0]) || s, g = l.filter;
+      if (yo(t), !_ && !(/mousedown|pointerdown/.test(i) && e.button !== 0 || l.disabled) && !a.isContentEditable && !(!this.nativeDraggable && rt && s && s.tagName.toUpperCase() === "SELECT") && (s = Te(s, l.draggable, t, !1), !(s && s.animated) && wt !== s)) {
+        if (Ze = Ce(s), ut = Ce(s, l.draggable), typeof g == "function") {
+          if (g.call(this, e, s, this)) {
+            me({
+              sortable: n,
+              rootEl: a,
+              name: "filter",
+              targetEl: s,
+              toEl: t,
+              fromEl: t
+            }), he("filter", n, {
+              evt: e
+            }), o && e.cancelable && e.preventDefault();
+            return;
+          }
+        } else if (g && (g = g.split(",").some(function(u) {
+          if (u = Te(a, u.trim(), t, !1), u)
+            return me({
+              sortable: n,
+              rootEl: u,
+              name: "filter",
+              targetEl: s,
+              fromEl: t,
+              toEl: t
+            }), he("filter", n, {
+              evt: e
+            }), !0;
+        }), g)) {
+          o && e.cancelable && e.preventDefault();
+          return;
+        }
+        l.handle && !Te(a, l.handle, t, !1) || this._prepareDragStart(e, r, s);
+      }
+    }
+  },
+  _prepareDragStart: function(e, n, t) {
+    var l = this, o = l.el, i = l.options, r = o.ownerDocument, s;
+    if (t && !_ && t.parentNode === o) {
+      var a = re(t);
+      if (ee = o, _ = t, oe = _.parentNode, Xe = _.nextSibling, wt = t, bt = i.group, P.dragged = _, Le = {
+        target: _,
+        clientX: (n || e).clientX,
+        clientY: (n || e).clientY
+      }, kn = Le.clientX - a.left, Tn = Le.clientY - a.top, this._lastX = (n || e).clientX, this._lastY = (n || e).clientY, _.style["will-change"] = "all", s = function() {
+        if (he("delayEnded", l, {
+          evt: e
+        }), P.eventCanceled) {
+          l._onDrop();
+          return;
+        }
+        l._disableDelayedDragEvents(), !Cn && l.nativeDraggable && (_.draggable = !0), l._triggerDragStart(e, n), me({
+          sortable: l,
+          name: "choose",
+          originalEvent: e
+        }), be(_, i.chosenClass, !0);
+      }, i.ignore.split(",").forEach(function(g) {
+        Xn(_, g.trim(), Jt);
+      }), q(r, "dragover", Ve), q(r, "mousemove", Ve), q(r, "touchmove", Ve), q(r, "mouseup", l._onDrop), q(r, "touchend", l._onDrop), q(r, "touchcancel", l._onDrop), Cn && this.nativeDraggable && (this.options.touchStartThreshold = 4, _.draggable = !0), he("delayStart", this, {
+        evt: e
+      }), i.delay && (!i.delayOnTouchOnly || n) && (!this.nativeDraggable || !(pt || Fe))) {
+        if (P.eventCanceled) {
+          this._onDrop();
+          return;
+        }
+        q(r, "mouseup", l._disableDelayedDrag), q(r, "touchend", l._disableDelayedDrag), q(r, "touchcancel", l._disableDelayedDrag), q(r, "mousemove", l._delayedDragTouchMoveHandler), q(r, "touchmove", l._delayedDragTouchMoveHandler), i.supportPointer && q(r, "pointermove", l._delayedDragTouchMoveHandler), l._dragStartTimer = setTimeout(s, i.delay);
+      } else
+        s();
+    }
+  },
+  _delayedDragTouchMoveHandler: function(e) {
+    var n = e.touches ? e.touches[0] : e;
+    Math.max(Math.abs(n.clientX - this._lastX), Math.abs(n.clientY - this._lastY)) >= Math.floor(this.options.touchStartThreshold / (this.nativeDraggable && window.devicePixelRatio || 1)) && this._disableDelayedDrag();
+  },
+  _disableDelayedDrag: function() {
+    _ && Jt(_), clearTimeout(this._dragStartTimer), this._disableDelayedDragEvents();
+  },
+  _disableDelayedDragEvents: function() {
+    var e = this.el.ownerDocument;
+    V(e, "mouseup", this._disableDelayedDrag), V(e, "touchend", this._disableDelayedDrag), V(e, "touchcancel", this._disableDelayedDrag), V(e, "mousemove", this._delayedDragTouchMoveHandler), V(e, "touchmove", this._delayedDragTouchMoveHandler), V(e, "pointermove", this._delayedDragTouchMoveHandler);
+  },
+  _triggerDragStart: function(e, n) {
+    n = n || e.pointerType == "touch" && e, !this.nativeDraggable || n ? this.options.supportPointer ? q(document, "pointermove", this._onTouchMove) : n ? q(document, "touchmove", this._onTouchMove) : q(document, "mousemove", this._onTouchMove) : (q(_, "dragend", this), q(ee, "dragstart", this._onDragStart));
+    try {
+      document.selection ? Tt(function() {
+        document.selection.empty();
+      }) : window.getSelection().removeAllRanges();
+    } catch {
+    }
+  },
+  _dragStarted: function(e, n) {
+    if (We = !1, ee && _) {
+      he("dragStarted", this, {
+        evt: n
+      }), this.nativeDraggable && q(document, "dragover", co);
+      var t = this.options;
+      !e && be(_, t.dragClass, !1), be(_, t.ghostClass, !0), P.active = this, e && this._appendGhost(), me({
+        sortable: this,
+        name: "start",
+        originalEvent: n
+      });
+    } else
+      this._nulling();
+  },
+  _emulateDragOver: function() {
+    if (ke) {
+      this._lastX = ke.clientX, this._lastY = ke.clientY, Kn();
+      for (var e = document.elementFromPoint(ke.clientX, ke.clientY), n = e; e && e.shadowRoot && (e = e.shadowRoot.elementFromPoint(ke.clientX, ke.clientY), e !== n); )
+        n = e;
+      if (_.parentNode[_e]._isOutsideThisEl(e), n)
+        do {
+          if (n[_e]) {
+            var t = void 0;
+            if (t = n[_e]._onDragOver({
+              clientX: ke.clientX,
+              clientY: ke.clientY,
+              target: e,
+              rootEl: n
+            }), t && !this.options.dragoverBubble)
+              break;
+          }
+          e = n;
+        } while (n = n.parentNode);
+      el();
+    }
+  },
+  _onTouchMove: function(e) {
+    if (Le) {
+      var n = this.options, t = n.fallbackTolerance, l = n.fallbackOffset, o = e.touches ? e.touches[0] : e, i = R && Qe(R, !0), r = R && i && i.a, s = R && i && i.d, a = _t && ve && wn(ve), g = (o.clientX - Le.clientX + l.x) / (r || 1) + (a ? a[0] - qt[0] : 0) / (r || 1), u = (o.clientY - Le.clientY + l.y) / (s || 1) + (a ? a[1] - qt[1] : 0) / (s || 1);
+      if (!P.active && !We) {
+        if (t && Math.max(Math.abs(o.clientX - this._lastX), Math.abs(o.clientY - this._lastY)) < t)
+          return;
+        this._onDragStart(e, !0);
+      }
+      if (R) {
+        i ? (i.e += g - (Xt || 0), i.f += u - (Ht || 0)) : i = {
+          a: 1,
+          b: 0,
+          c: 0,
+          d: 1,
+          e: g,
+          f: u
+        };
+        var d = "matrix(".concat(i.a, ",").concat(i.b, ",").concat(i.c, ",").concat(i.d, ",").concat(i.e, ",").concat(i.f, ")");
+        A(R, "webkitTransform", d), A(R, "mozTransform", d), A(R, "msTransform", d), A(R, "transform", d), Xt = g, Ht = u, ke = o;
+      }
+      e.cancelable && e.preventDefault();
+    }
+  },
+  _appendGhost: function() {
+    if (!R) {
+      var e = this.options.fallbackOnBody ? document.body : ee, n = re(_, !0, _t, !0, e), t = this.options;
+      if (_t) {
+        for (ve = e; A(ve, "position") === "static" && A(ve, "transform") === "none" && ve !== document; )
+          ve = ve.parentNode;
+        ve !== document.body && ve !== document.documentElement ? (ve === document && (ve = Oe()), n.top += ve.scrollTop, n.left += ve.scrollLeft) : ve = Oe(), qt = wn(ve);
+      }
+      R = _.cloneNode(!0), be(R, t.ghostClass, !1), be(R, t.fallbackClass, !0), be(R, t.dragClass, !0), A(R, "transition", ""), A(R, "transform", ""), A(R, "box-sizing", "border-box"), A(R, "margin", 0), A(R, "top", n.top), A(R, "left", n.left), A(R, "width", n.width), A(R, "height", n.height), A(R, "opacity", "0.8"), A(R, "position", _t ? "absolute" : "fixed"), A(R, "zIndex", "100000"), A(R, "pointerEvents", "none"), P.ghost = R, e.appendChild(R), A(R, "transform-origin", kn / parseInt(R.style.width) * 100 + "% " + Tn / parseInt(R.style.height) * 100 + "%");
+    }
+  },
+  _onDragStart: function(e, n) {
+    var t = this, l = e.dataTransfer, o = t.options;
+    if (he("dragStart", this, {
+      evt: e
+    }), P.eventCanceled) {
+      this._onDrop();
+      return;
+    }
+    he("setupClone", this), P.eventCanceled || (ne = Jn(_), ne.removeAttribute("id"), ne.draggable = !1, ne.style["will-change"] = "", this._hideClone(), be(ne, this.options.chosenClass, !1), P.clone = ne), t.cloneId = Tt(function() {
+      he("clone", t), !P.eventCanceled && (t.options.removeCloneOnHide || ee.insertBefore(ne, _), t._hideClone(), me({
+        sortable: t,
+        name: "clone"
+      }));
+    }), !n && be(_, o.dragClass, !0), n ? (At = !0, t._loopId = setInterval(t._emulateDragOver, 50)) : (V(document, "mouseup", t._onDrop), V(document, "touchend", t._onDrop), V(document, "touchcancel", t._onDrop), l && (l.effectAllowed = "move", o.setData && o.setData.call(t, l, _)), q(document, "drop", t), A(_, "transform", "translateZ(0)")), We = !0, t._dragStartId = Tt(t._dragStarted.bind(t, n, e)), q(document, "selectstart", t), lt = !0, rt && A(document.body, "user-select", "none");
+  },
+  // Returns true - if no further action is needed (either inserted or another condition)
+  _onDragOver: function(e) {
+    var n = this.el, t = e.target, l, o, i, r = this.options, s = r.group, a = P.active, g = bt === s, u = r.sort, d = pe || a, T, w = this, y = !1;
+    if (en)
+      return;
+    function k(m, ge) {
+      he(m, w, Ne({
+        evt: e,
+        isOwner: g,
+        axis: T ? "vertical" : "horizontal",
+        revert: i,
+        dragRect: l,
+        targetRect: o,
+        canSort: u,
+        fromSortable: d,
+        target: t,
+        completed: j,
+        onMove: function(we, Me) {
+          return Ct(ee, n, _, l, we, re(we), e, Me);
+        },
+        changed: te
+      }, ge));
+    }
+    function B() {
+      k("dragOverAnimationCapture"), w.captureAnimationState(), w !== d && d.captureAnimationState();
+    }
+    function j(m) {
+      return k("dragOverCompleted", {
+        insertion: m
+      }), m && (g ? a._hideClone() : a._showClone(w), w !== d && (be(_, pe ? pe.options.ghostClass : a.options.ghostClass, !1), be(_, r.ghostClass, !0)), pe !== w && w !== P.active ? pe = w : w === P.active && pe && (pe = null), d === w && (w._ignoreWhileAnimating = t), w.animateAll(function() {
+        k("dragOverAnimationComplete"), w._ignoreWhileAnimating = null;
+      }), w !== d && (d.animateAll(), d._ignoreWhileAnimating = null)), (t === _ && !_.animated || t === n && !t.animated) && (Je = null), !r.dragoverBubble && !e.rootEl && t !== document && (_.parentNode[_e]._isOutsideThisEl(e.target), !m && Ve(e)), !r.dragoverBubble && e.stopPropagation && e.stopPropagation(), y = !0;
+    }
+    function te() {
+      ye = Ce(_), Re = Ce(_, r.draggable), me({
+        sortable: w,
+        name: "change",
+        toEl: n,
+        newIndex: ye,
+        newDraggableIndex: Re,
+        originalEvent: e
+      });
+    }
+    if (e.preventDefault !== void 0 && e.cancelable && e.preventDefault(), t = Te(t, r.draggable, n, !0), k("dragOver"), P.eventCanceled)
+      return y;
+    if (_.contains(e.target) || t.animated && t.animatingX && t.animatingY || w._ignoreWhileAnimating === t)
+      return j(!1);
+    if (At = !1, a && !r.disabled && (g ? u || (i = oe !== ee) : pe === this || (this.lastPutMode = bt.checkPull(this, a, _, e)) && s.checkPut(this, a, _, e))) {
+      if (T = this._getDirection(e, t) === "vertical", l = re(_), k("dragOverValid"), P.eventCanceled)
+        return y;
+      if (i)
+        return oe = ee, B(), this._hideClone(), k("revert"), P.eventCanceled || (Xe ? ee.insertBefore(_, Xe) : ee.appendChild(_)), j(!0);
+      var z = rn(n, r.draggable);
+      if (!z || mo(e, T, this) && !z.animated) {
+        if (z === _)
+          return j(!1);
+        if (z && n === e.target && (t = z), t && (o = re(t)), Ct(ee, n, _, l, t, o, e, !!t) !== !1)
+          return B(), z && z.nextSibling ? n.insertBefore(_, z.nextSibling) : n.appendChild(_), oe = n, te(), j(!0);
+      } else if (z && vo(e, T, this)) {
+        var X = tt(n, 0, r, !0);
+        if (X === _)
+          return j(!1);
+        if (t = X, o = re(t), Ct(ee, n, _, l, t, o, e, !1) !== !1)
+          return B(), n.insertBefore(_, X), oe = n, te(), j(!0);
+      } else if (t.parentNode === n) {
+        o = re(t);
+        var O = 0, se, J = _.parentNode !== n, ue = !so(_.animated && _.toRect || l, t.animated && t.toRect || o, T), G = T ? "top" : "left", E = xn(t, "top", "top") || xn(_, "top", "top"), L = E ? E.scrollTop : void 0;
+        Je !== t && (se = o[G], ct = !1, yt = !ue && r.invertSwap || J), O = ho(e, t, o, T, ue ? 1 : r.swapThreshold, r.invertedSwapThreshold == null ? r.swapThreshold : r.invertedSwapThreshold, yt, Je === t);
+        var Y;
+        if (O !== 0) {
+          var le = Ce(_);
+          do
+            le -= O, Y = oe.children[le];
+          while (Y && (A(Y, "display") === "none" || Y === R));
+        }
+        if (O === 0 || Y === t)
+          return j(!1);
+        Je = t, dt = O;
+        var H = t.nextElementSibling, N = !1;
+        N = O === 1;
+        var c = Ct(ee, n, _, l, t, o, e, N);
+        if (c !== !1)
+          return (c === 1 || c === -1) && (N = c === 1), en = !0, setTimeout(fo, 30), B(), N && !H ? n.appendChild(_) : t.parentNode.insertBefore(_, N ? H : t), E && qn(E, 0, L - E.scrollTop), oe = _.parentNode, se !== void 0 && !yt && (kt = Math.abs(se - re(t)[G])), te(), j(!0);
+      }
+      if (n.contains(_))
+        return j(!1);
+    }
+    return !1;
+  },
+  _ignoreWhileAnimating: null,
+  _offMoveEvents: function() {
+    V(document, "mousemove", this._onTouchMove), V(document, "touchmove", this._onTouchMove), V(document, "pointermove", this._onTouchMove), V(document, "dragover", Ve), V(document, "mousemove", Ve), V(document, "touchmove", Ve);
+  },
+  _offUpEvents: function() {
+    var e = this.el.ownerDocument;
+    V(e, "mouseup", this._onDrop), V(e, "touchend", this._onDrop), V(e, "pointerup", this._onDrop), V(e, "touchcancel", this._onDrop), V(document, "selectstart", this);
+  },
+  _onDrop: function(e) {
+    var n = this.el, t = this.options;
+    if (ye = Ce(_), Re = Ce(_, t.draggable), he("drop", this, {
+      evt: e
+    }), oe = _ && _.parentNode, ye = Ce(_), Re = Ce(_, t.draggable), P.eventCanceled) {
+      this._nulling();
+      return;
+    }
+    We = !1, yt = !1, ct = !1, clearInterval(this._loopId), clearTimeout(this._dragStartTimer), tn(this.cloneId), tn(this._dragStartId), this.nativeDraggable && (V(document, "drop", this), V(n, "dragstart", this._onDragStart)), this._offMoveEvents(), this._offUpEvents(), rt && A(document.body, "user-select", ""), A(_, "transform", ""), e && (lt && (e.cancelable && e.preventDefault(), !t.dropBubble && e.stopPropagation()), R && R.parentNode && R.parentNode.removeChild(R), (ee === oe || pe && pe.lastPutMode !== "clone") && ne && ne.parentNode && ne.parentNode.removeChild(ne), _ && (this.nativeDraggable && V(_, "dragend", this), Jt(_), _.style["will-change"] = "", lt && !We && be(_, pe ? pe.options.ghostClass : this.options.ghostClass, !1), be(_, this.options.chosenClass, !1), me({
+      sortable: this,
+      name: "unchoose",
+      toEl: oe,
+      newIndex: null,
+      newDraggableIndex: null,
+      originalEvent: e
+    }), ee !== oe ? (ye >= 0 && (me({
+      rootEl: oe,
+      name: "add",
+      toEl: oe,
+      fromEl: ee,
+      originalEvent: e
+    }), me({
+      sortable: this,
+      name: "remove",
+      toEl: oe,
+      originalEvent: e
+    }), me({
+      rootEl: oe,
+      name: "sort",
+      toEl: oe,
+      fromEl: ee,
+      originalEvent: e
+    }), me({
+      sortable: this,
+      name: "sort",
+      toEl: oe,
+      originalEvent: e
+    })), pe && pe.save()) : ye !== Ze && ye >= 0 && (me({
+      sortable: this,
+      name: "update",
+      toEl: oe,
+      originalEvent: e
+    }), me({
+      sortable: this,
+      name: "sort",
+      toEl: oe,
+      originalEvent: e
+    })), P.active && ((ye == null || ye === -1) && (ye = Ze, Re = ut), me({
+      sortable: this,
+      name: "end",
+      toEl: oe,
+      originalEvent: e
+    }), this.save()))), this._nulling();
+  },
+  _nulling: function() {
+    he("nulling", this), ee = _ = oe = R = Xe = ne = wt = Be = Le = ke = lt = ye = Re = Ze = ut = Je = dt = pe = bt = P.dragged = P.ghost = P.clone = P.active = null, $t.forEach(function(e) {
+      e.checked = !0;
+    }), $t.length = Xt = Ht = 0;
+  },
+  handleEvent: function(e) {
+    switch (e.type) {
+      case "drop":
+      case "dragend":
+        this._onDrop(e);
+        break;
+      case "dragenter":
+      case "dragover":
+        _ && (this._onDragOver(e), po(e));
+        break;
+      case "selectstart":
+        e.preventDefault();
+        break;
+    }
+  },
+  /**
+   * Serializes the item into an array of string.
+   * @returns {String[]}
+   */
+  toArray: function() {
+    for (var e = [], n, t = this.el.children, l = 0, o = t.length, i = this.options; l < o; l++)
+      n = t[l], Te(n, i.draggable, this.el, !1) && e.push(n.getAttribute(i.dataIdAttr) || bo(n));
+    return e;
+  },
+  /**
+   * Sorts the elements according to the array.
+   * @param  {String[]}  order  order of the items
+   */
+  sort: function(e, n) {
+    var t = {}, l = this.el;
+    this.toArray().forEach(function(o, i) {
+      var r = l.children[i];
+      Te(r, this.options.draggable, l, !1) && (t[o] = r);
+    }, this), n && this.captureAnimationState(), e.forEach(function(o) {
+      t[o] && (l.removeChild(t[o]), l.appendChild(t[o]));
+    }), n && this.animateAll();
+  },
+  /**
+   * Save the current sorting
+   */
+  save: function() {
+    var e = this.options.store;
+    e && e.set && e.set(this);
+  },
+  /**
+   * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
+   * @param   {HTMLElement}  el
+   * @param   {String}       [selector]  default: `options.draggable`
+   * @returns {HTMLElement|null}
+   */
+  closest: function(e, n) {
+    return Te(e, n || this.options.draggable, this.el, !1);
+  },
+  /**
+   * Set/get option
+   * @param   {string} name
+   * @param   {*}      [value]
+   * @returns {*}
+   */
+  option: function(e, n) {
+    var t = this.options;
+    if (n === void 0)
+      return t[e];
+    var l = ft.modifyOption(this, e, n);
+    typeof l < "u" ? t[e] = l : t[e] = n, e === "group" && Qn(t);
+  },
+  /**
+   * Destroy
+   */
+  destroy: function() {
+    he("destroy", this);
+    var e = this.el;
+    e[_e] = null, V(e, "mousedown", this._onTapStart), V(e, "touchstart", this._onTapStart), V(e, "pointerdown", this._onTapStart), this.nativeDraggable && (V(e, "dragover", this), V(e, "dragenter", this)), Array.prototype.forEach.call(e.querySelectorAll("[draggable]"), function(n) {
+      n.removeAttribute("draggable");
+    }), this._onDrop(), this._disableDelayedDragEvents(), Pt.splice(Pt.indexOf(this.el), 1), this.el = e = null;
+  },
+  _hideClone: function() {
+    if (!Be) {
+      if (he("hideClone", this), P.eventCanceled)
+        return;
+      A(ne, "display", "none"), this.options.removeCloneOnHide && ne.parentNode && ne.parentNode.removeChild(ne), Be = !0;
+    }
+  },
+  _showClone: function(e) {
+    if (e.lastPutMode !== "clone") {
+      this._hideClone();
+      return;
+    }
+    if (Be) {
+      if (he("showClone", this), P.eventCanceled)
+        return;
+      _.parentNode == ee && !this.options.group.revertClone ? ee.insertBefore(ne, _) : Xe ? ee.insertBefore(ne, Xe) : ee.appendChild(ne), this.options.group.revertClone && this.animate(_, ne), A(ne, "display", ""), Be = !1;
+    }
+  }
+};
+function po(e) {
+  e.dataTransfer && (e.dataTransfer.dropEffect = "move"), e.cancelable && e.preventDefault();
+}
+function Ct(e, n, t, l, o, i, r, s) {
+  var a, g = e[_e], u = g.options.onMove, d;
+  return window.CustomEvent && !Fe && !pt ? a = new CustomEvent("move", {
+    bubbles: !0,
+    cancelable: !0
+  }) : (a = document.createEvent("Event"), a.initEvent("move", !0, !0)), a.to = n, a.from = e, a.dragged = t, a.draggedRect = l, a.related = o || n, a.relatedRect = i || re(n), a.willInsertAfter = s, a.originalEvent = r, e.dispatchEvent(a), u && (d = u.call(g, a, r)), d;
+}
+function Jt(e) {
+  e.draggable = !1;
+}
+function fo() {
+  en = !1;
+}
+function vo(e, n, t) {
+  var l = re(tt(t.el, 0, t.options, !0)), o = Wn(t.el, t.options, R), i = 10;
+  return n ? e.clientX < o.left - i || e.clientY < l.top && e.clientX < l.right : e.clientY < o.top - i || e.clientY < l.bottom && e.clientX < l.left;
+}
+function mo(e, n, t) {
+  var l = re(rn(t.el, t.options.draggable)), o = Wn(t.el, t.options, R), i = 10;
+  return n ? e.clientX > o.right + i || e.clientY > l.bottom && e.clientX > l.left : e.clientY > o.bottom + i || e.clientX > l.right && e.clientY > l.top;
+}
+function ho(e, n, t, l, o, i, r, s) {
+  var a = l ? e.clientY : e.clientX, g = l ? t.height : t.width, u = l ? t.top : t.left, d = l ? t.bottom : t.right, T = !1;
+  if (!r) {
+    if (s && kt < g * o) {
+      if (!ct && (dt === 1 ? a > u + g * i / 2 : a < d - g * i / 2) && (ct = !0), ct)
+        T = !0;
+      else if (dt === 1 ? a < u + kt : a > d - kt)
+        return -dt;
+    } else if (a > u + g * (1 - o) / 2 && a < d - g * (1 - o) / 2)
+      return go(n);
+  }
+  return T = T || r, T && (a < u + g * i / 2 || a > d - g * i / 2) ? a > u + g / 2 ? 1 : -1 : 0;
+}
+function go(e) {
+  return Ce(_) < Ce(e) ? 1 : -1;
+}
+function bo(e) {
+  for (var n = e.tagName + e.className + e.src + e.href + e.textContent, t = n.length, l = 0; t--; )
+    l += n.charCodeAt(t);
+  return l.toString(36);
+}
+function yo(e) {
+  $t.length = 0;
+  for (var n = e.getElementsByTagName("input"), t = n.length; t--; ) {
+    var l = n[t];
+    l.checked && $t.push(l);
+  }
+}
+function Tt(e) {
+  return setTimeout(e, 0);
+}
+function tn(e) {
+  return clearTimeout(e);
+}
+Mt && q(document, "touchmove", function(e) {
+  (P.active || We) && e.cancelable && e.preventDefault();
+});
+P.utils = {
+  on: q,
+  off: V,
+  css: A,
+  find: Xn,
+  is: function(e, n) {
+    return !!Te(e, n, e, !1);
+  },
+  extend: eo,
+  throttle: Hn,
+  closest: Te,
+  toggleClass: be,
+  clone: Jn,
+  index: Ce,
+  nextTick: Tt,
+  cancelNextTick: tn,
+  detectDirection: Zn,
+  getChild: tt
+};
+P.get = function(e) {
+  return e[_e];
+};
+P.mount = function() {
+  for (var e = arguments.length, n = new Array(e), t = 0; t < e; t++)
+    n[t] = arguments[t];
+  n[0].constructor === Array && (n = n[0]), n.forEach(function(l) {
+    if (!l.prototype || !l.prototype.constructor)
+      throw "Sortable: Mounted plugin must be a constructor function, not ".concat({}.toString.call(l));
+    l.utils && (P.utils = Ne(Ne({}, P.utils), l.utils)), ft.mount(l);
+  });
+};
+P.create = function(e, n) {
+  return new P(e, n);
+};
+P.version = Zl;
+var ie = [], ot, nn, ln = !1, Wt, Gt, Ft, at;
+function _o() {
+  function e() {
+    this.defaults = {
+      scroll: !0,
+      forceAutoScrollFallback: !1,
+      scrollSensitivity: 30,
+      scrollSpeed: 10,
+      bubbleScroll: !0
+    };
+    for (var n in this)
+      n.charAt(0) === "_" && typeof this[n] == "function" && (this[n] = this[n].bind(this));
+  }
+  return e.prototype = {
+    dragStarted: function(n) {
+      var t = n.originalEvent;
+      this.sortable.nativeDraggable ? q(document, "dragover", this._handleAutoScroll) : this.options.supportPointer ? q(document, "pointermove", this._handleFallbackAutoScroll) : t.touches ? q(document, "touchmove", this._handleFallbackAutoScroll) : q(document, "mousemove", this._handleFallbackAutoScroll);
+    },
+    dragOverCompleted: function(n) {
+      var t = n.originalEvent;
+      !this.options.dragOverBubble && !t.rootEl && this._handleAutoScroll(t);
+    },
+    drop: function() {
+      this.sortable.nativeDraggable ? V(document, "dragover", this._handleAutoScroll) : (V(document, "pointermove", this._handleFallbackAutoScroll), V(document, "touchmove", this._handleFallbackAutoScroll), V(document, "mousemove", this._handleFallbackAutoScroll)), En(), Dt(), to();
+    },
+    nulling: function() {
+      Ft = nn = ot = ln = at = Wt = Gt = null, ie.length = 0;
+    },
+    _handleFallbackAutoScroll: function(n) {
+      this._handleAutoScroll(n, !0);
+    },
+    _handleAutoScroll: function(n, t) {
+      var l = this, o = (n.touches ? n.touches[0] : n).clientX, i = (n.touches ? n.touches[0] : n).clientY, r = document.elementFromPoint(o, i);
+      if (Ft = n, t || this.options.forceAutoScrollFallback || pt || Fe || rt) {
+        Zt(n, this.options, r, t);
+        var s = je(r, !0);
+        ln && (!at || o !== Wt || i !== Gt) && (at && En(), at = setInterval(function() {
+          var a = je(document.elementFromPoint(o, i), !0);
+          a !== s && (s = a, Dt()), Zt(n, l.options, a, t);
+        }, 10), Wt = o, Gt = i);
+      } else {
+        if (!this.options.bubbleScroll || je(r, !0) === Oe()) {
+          Dt();
+          return;
+        }
+        Zt(n, this.options, je(r, !1), !1);
+      }
+    }
+  }, $e(e, {
+    pluginName: "scroll",
+    initializeByDefault: !0
+  });
+}
+function Dt() {
+  ie.forEach(function(e) {
+    clearInterval(e.pid);
+  }), ie = [];
+}
+function En() {
+  clearInterval(at);
+}
+var Zt = Hn(function(e, n, t, l) {
+  if (n.scroll) {
+    var o = (e.touches ? e.touches[0] : e).clientX, i = (e.touches ? e.touches[0] : e).clientY, r = n.scrollSensitivity, s = n.scrollSpeed, a = Oe(), g = !1, u;
+    nn !== t && (nn = t, Dt(), ot = n.scroll, u = n.scrollFn, ot === !0 && (ot = je(t, !0)));
+    var d = 0, T = ot;
+    do {
+      var w = T, y = re(w), k = y.top, B = y.bottom, j = y.left, te = y.right, z = y.width, X = y.height, O = void 0, se = void 0, J = w.scrollWidth, ue = w.scrollHeight, G = A(w), E = w.scrollLeft, L = w.scrollTop;
+      w === a ? (O = z < J && (G.overflowX === "auto" || G.overflowX === "scroll" || G.overflowX === "visible"), se = X < ue && (G.overflowY === "auto" || G.overflowY === "scroll" || G.overflowY === "visible")) : (O = z < J && (G.overflowX === "auto" || G.overflowX === "scroll"), se = X < ue && (G.overflowY === "auto" || G.overflowY === "scroll"));
+      var Y = O && (Math.abs(te - o) <= r && E + z < J) - (Math.abs(j - o) <= r && !!E), le = se && (Math.abs(B - i) <= r && L + X < ue) - (Math.abs(k - i) <= r && !!L);
+      if (!ie[d])
+        for (var H = 0; H <= d; H++)
+          ie[H] || (ie[H] = {});
+      (ie[d].vx != Y || ie[d].vy != le || ie[d].el !== w) && (ie[d].el = w, ie[d].vx = Y, ie[d].vy = le, clearInterval(ie[d].pid), (Y != 0 || le != 0) && (g = !0, ie[d].pid = setInterval((function() {
+        l && this.layer === 0 && P.active._onTouchMove(Ft);
+        var N = ie[this.layer].vy ? ie[this.layer].vy * s : 0, c = ie[this.layer].vx ? ie[this.layer].vx * s : 0;
+        typeof u == "function" && u.call(P.dragged.parentNode[_e], c, N, e, Ft, ie[this.layer].el) !== "continue" || qn(ie[this.layer].el, c, N);
+      }).bind({
+        layer: d
+      }), 24))), d++;
+    } while (n.bubbleScroll && T !== a && (T = je(T, !1)));
+    ln = g;
+  }
+}, 30), tl = function(e) {
+  var n = e.originalEvent, t = e.putSortable, l = e.dragEl, o = e.activeSortable, i = e.dispatchSortableEvent, r = e.hideGhostForTarget, s = e.unhideGhostForTarget;
+  if (n) {
+    var a = t || o;
+    r();
+    var g = n.changedTouches && n.changedTouches.length ? n.changedTouches[0] : n, u = document.elementFromPoint(g.clientX, g.clientY);
+    s(), a && !a.el.contains(u) && (i("spill"), this.onSpill({
+      dragEl: l,
+      putSortable: t
+    }));
+  }
+};
+function sn() {
+}
+sn.prototype = {
+  startIndex: null,
+  dragStart: function(e) {
+    var n = e.oldDraggableIndex;
+    this.startIndex = n;
+  },
+  onSpill: function(e) {
+    var n = e.dragEl, t = e.putSortable;
+    this.sortable.captureAnimationState(), t && t.captureAnimationState();
+    var l = tt(this.sortable.el, this.startIndex, this.options);
+    l ? this.sortable.el.insertBefore(n, l) : this.sortable.el.appendChild(n), this.sortable.animateAll(), t && t.animateAll();
+  },
+  drop: tl
+};
+$e(sn, {
+  pluginName: "revertOnSpill"
+});
+function un() {
+}
+un.prototype = {
+  onSpill: function(e) {
+    var n = e.dragEl, t = e.putSortable, l = t || this.sortable;
+    l.captureAnimationState(), n.parentNode && n.parentNode.removeChild(n), l.animateAll();
+  },
+  drop: tl
+};
+$e(un, {
+  pluginName: "removeOnSpill"
+});
+P.mount(new _o());
+P.mount(un, sn);
+function Co(e) {
+  return e == null ? e : JSON.parse(JSON.stringify(e));
+}
+function So(e) {
+  an() && ul(e);
+}
+function xo(e) {
+  an() ? An(e) : Pn(e);
+}
+let nl = null, ll = null;
+function In(e = null, n = null) {
+  nl = e, ll = n;
+}
+function wo() {
+  return {
+    data: nl,
+    clonedData: ll
+  };
+}
+const On = /* @__PURE__ */ Symbol("cloneElement");
+function ko(...e) {
+  var n, t;
+  const l = (n = an()) == null ? void 0 : n.proxy;
+  let o = null;
+  const i = e[0];
+  let [, r, s] = e;
+  Array.isArray(b(r)) || (s = r, r = null);
+  let a = null;
+  const {
+    immediate: g = !0,
+    clone: u = Co,
+    forceFallback: d,
+    fallbackOnBody: T,
+    customUpdate: w
+  } = (t = b(s)) != null ? t : {};
+  function y(E) {
+    var L;
+    const { from: Y, oldIndex: le, item: H } = E, N = Array.from(Y.childNodes);
+    o = d && !T ? N.slice(0, -1) : N;
+    const c = b((L = b(r)) == null ? void 0 : L[le]), m = u(c);
+    In(c, m), H[On] = m;
+  }
+  function k(E) {
+    const L = E.item[On];
+    if (!zl(L)) {
+      if (Vt(E.item), Bt(r)) {
+        const Y = [...b(r)];
+        r.value = gn(Y, E.newDraggableIndex, L);
+        return;
+      }
+      gn(b(r), E.newDraggableIndex, L);
+    }
+  }
+  function B(E) {
+    const { from: L, item: Y, oldIndex: le, oldDraggableIndex: H, pullMode: N, clone: c } = E;
+    if (bn(L, Y, le), N === "clone") {
+      Vt(c);
+      return;
+    }
+    if (Bt(r)) {
+      const m = [...b(r)];
+      r.value = hn(m, H);
+      return;
+    }
+    hn(b(r), H);
+  }
+  function j(E) {
+    if (w) {
+      w(E);
+      return;
+    }
+    const { from: L, item: Y, oldIndex: le, oldDraggableIndex: H, newDraggableIndex: N } = E;
+    if (Vt(Y), bn(L, Y, le), Bt(r)) {
+      const c = [...b(r)];
+      r.value = mn(
+        c,
+        H,
+        N
+      );
+      return;
+    }
+    mn(b(r), H, N);
+  }
+  function te(E) {
+    const { newIndex: L, oldIndex: Y, from: le, to: H } = E;
+    let N = null;
+    const c = L === Y && le === H;
+    try {
+      if (c) {
+        let m = null;
+        o?.some((ge, we) => {
+          if (m && o?.length !== H.childNodes.length)
+            return le.insertBefore(m, ge.nextSibling), !0;
+          const Me = H.childNodes[we];
+          m = H?.replaceChild(ge, Me);
+        });
+      }
+    } catch (m) {
+      N = m;
+    } finally {
+      o = null;
+    }
+    Pn(() => {
+      if (In(), N)
+        throw N;
+    });
+  }
+  const z = {
+    onUpdate: j,
+    onStart: y,
+    onAdd: k,
+    onRemove: B,
+    onEnd: te
+  };
+  function X(E) {
+    const L = b(i);
+    return E || (E = Ll(L) ? Vl(L, l?.$el) : L), E && !Xl(E) && (E = E.$el), E || Rl("Root element not found"), E;
+  }
+  function O() {
+    var E;
+    const L = (E = b(s)) != null ? E : {}, { immediate: Y, clone: le } = L, H = zn(L, ["immediate", "clone"]);
+    return yn(H, (N, c) => {
+      Hl(N) && (H[N] = (m, ...ge) => {
+        const we = wo();
+        return ql(m, we), c(m, ...ge);
+      });
+    }), Ul(
+      r === null ? {} : z,
+      H
+    );
+  }
+  const se = (E) => {
+    E = X(E), a && J.destroy(), a = new P(E, O());
+  };
+  Ke(
+    () => s,
+    () => {
+      a && yn(O(), (E, L) => {
+        a?.option(E, L);
+      });
+    },
+    { deep: !0 }
+  );
+  const J = {
+    option: (E, L) => a?.option(E, L),
+    destroy: () => {
+      a?.destroy(), a = null;
+    },
+    save: () => a?.save(),
+    toArray: () => a?.toArray(),
+    closest: (...E) => a?.closest(...E)
+  }, ue = () => J?.option("disabled", !0), G = () => J?.option("disabled", !1);
+  return xo(() => {
+    g && se();
+  }), So(J.destroy), Ge({ start: se, pause: ue, resume: G }, J);
+}
+const on = [
+  "update",
+  "start",
+  "add",
+  "remove",
+  "choose",
+  "unchoose",
+  "end",
+  "sort",
+  "filter",
+  "clone",
+  "move",
+  "change"
+], To = [
+  "clone",
+  "animation",
+  "ghostClass",
+  "group",
+  "sort",
+  "disabled",
+  "store",
+  "handle",
+  "draggable",
+  "swapThreshold",
+  "invertSwap",
+  "invertedSwapThreshold",
+  "removeCloneOnHide",
+  "direction",
+  "chosenClass",
+  "dragClass",
+  "ignore",
+  "filter",
+  "preventOnFilter",
+  "easing",
+  "setData",
+  "dropBubble",
+  "dragoverBubble",
+  "dataIdAttr",
+  "delay",
+  "delayOnTouchOnly",
+  "touchStartThreshold",
+  "forceFallback",
+  "fallbackClass",
+  "fallbackOnBody",
+  "fallbackTolerance",
+  "fallbackOffset",
+  "supportPointer",
+  "emptyInsertThreshold",
+  "scroll",
+  "forceAutoScrollFallback",
+  "scrollSensitivity",
+  "scrollSpeed",
+  "bubbleScroll",
+  "modelValue",
+  "tag",
+  "target",
+  "customUpdate",
+  ...on.map((e) => `on${e.replace(/^\S/, (n) => n.toUpperCase())}`)
+], Do = xe({
+  name: "VueDraggable",
+  model: {
+    prop: "modelValue",
+    event: "update:modelValue"
+  },
+  props: To,
+  emits: ["update:modelValue", ...on],
+  setup(e, { slots: n, emit: t, expose: l, attrs: o }) {
+    const i = on.reduce((u, d) => {
+      const T = `on${d.replace(/^\S/, (w) => w.toUpperCase())}`;
+      return u[T] = (...w) => t(d, ...w), u;
+    }, {}), r = F(() => {
+      const u = rl(e), { modelValue: d } = u, T = zn(u, ["modelValue"]), w = Object.entries(T).reduce((y, [k, B]) => {
+        const j = b(B);
+        return j !== void 0 && (y[k] = j), y;
+      }, {});
+      return Ge(Ge({}, i), jl(Ge(Ge({}, o), w)));
+    }), s = F({
+      get: () => e.modelValue,
+      set: (u) => t("update:modelValue", u)
+    }), a = de(), g = Nn(
+      ko(e.target || a, s, r)
+    );
+    return l(g), () => {
+      var u;
+      return sl(e.tag || "div", { ref: a }, (u = n?.default) == null ? void 0 : u.call(n, g));
+    };
+  }
+}), Eo = { class: "expanded" }, Io = { class: "expanded__head" }, Oo = { class: "expanded__icon" }, No = ["name"], Ao = { class: "expanded__title" }, Po = { class: "expanded__meta" }, $o = { class: "expanded__head-actions" }, Fo = { class: "expanded__body" }, Mo = { class: "expanded__preview" }, Ro = {
+  key: 1,
+  class: "expanded__options"
+}, Bo = ["onDragstart", "onDragover", "onDrop"], jo = { class: "expanded__options-foot" }, zo = ["name"], Lo = {
+  key: 2,
+  class: "expanded__preview"
+}, Vo = { class: "expanded__row" }, Yo = { class: "expanded__preview" }, Uo = { class: "expanded__row expanded__row--3" }, Xo = { class: "expanded__preview" }, Ho = { class: "expanded__row expanded__row--2" }, qo = { class: "expanded__preview" }, Jo = { class: "expanded__preview" }, Wo = { class: "expanded__section-preview" }, Go = { key: 0 }, Zo = { class: "expanded__foot" }, Qo = ["onClick"], Ko = ["name"], ea = /* @__PURE__ */ xe({
+  __name: "FieldCardExpanded",
+  props: {
+    pageIdx: {},
+    fieldName: {}
+  },
+  setup(e) {
+    const n = e, t = ze(), l = F(
+      () => t.data.pages[n.pageIdx]?.fields[n.fieldName] ?? {}
+    ), o = F(() => {
+      const I = l.value;
+      return I.uiCom === "TextArea" ? Z.find((f) => f.id === "textarea") : I.uiCom === "Rating" ? Z.find((f) => f.id === "rating") : I.uiCom === "Slider" ? Z.find((f) => f.id === "slider") : I.uiCom === "ColorPicker" ? Z.find((f) => f.id === "color") : I.uiCom === "Section" ? Z.find((f) => f.id === "section") : I.uiCom === "File" ? Z.find((f) => f.id === "file") : I.ref ? Z.find((f) => f.id === "ref") : Array.isArray(I.enum) ? Z.find((f) => f.id === "select") : I.type === "Number" ? Z.find((f) => f.id === "number") : I.type === "Date" ? Z.find((f) => f.id === "date") : I.type === "Boolean" ? Z.find((f) => f.id === "boolean") : Z.find((f) => f.id === "text");
+    }), i = F(() => o.value?.id ?? "text"), r = Z.map((I) => ({ label: I.label, value: I.id }));
+    function s(I) {
+      const f = I.detail;
+      return f != null && typeof f == "object" && "value" in f ? f.value : f != null && typeof f == "object" && "checked" in f ? f.checked : f;
+    }
+    function a(I, f) {
+      t.updateField(n.pageIdx, n.fieldName, { [I]: f });
+    }
+    function g(I) {
+      if (!(!I || I === n.fieldName))
+        try {
+          t.renameField(n.pageIdx, n.fieldName, I);
+        } catch (f) {
+          console.warn("[builder] rename failed:", f.message);
+        }
+    }
+    function u() {
+      t.selectPage(n.pageIdx);
+    }
+    function d() {
+      t.duplicateField(n.pageIdx, n.fieldName);
+    }
+    function T() {
+      t.removeField(n.pageIdx, n.fieldName);
+    }
+    const w = [
+      "label",
+      "required",
+      "helperText",
+      "placeholder",
+      "full",
+      "hidden",
+      "disabled",
+      "readOnly",
+      "visibleIf",
+      "enableIf",
+      "requiredIf"
+    ];
+    function y(I) {
+      if (!I || I === i.value) return;
+      const f = Kt[I], M = f ? f() : { type: "String" }, v = {};
+      for (const h of w)
+        l.value[h] !== void 0 && (v[h] = l.value[h]);
+      t.replaceFieldDef(n.pageIdx, n.fieldName, {
+        ...M,
+        ...v
+      });
+    }
+    const k = F(
+      () => Array.isArray(l.value.enum) ? l.value.enum : []
+    );
+    function B(I, f) {
+      const M = [...k.value];
+      M[I] = f, a("enum", M);
+    }
+    function j(I) {
+      const f = k.value.filter((M, v) => v !== I);
+      a("enum", f.length ? f : void 0);
+    }
+    function te() {
+      const I = [...k.value, `Option ${k.value.length + 1}`];
+      a("enum", I);
+    }
+    const z = de(null), X = de(null);
+    function O(I, f) {
+      I.dataTransfer && (z.value = f, I.dataTransfer.setData("application/cobalt-option-move", String(f)), I.dataTransfer.effectAllowed = "move");
+    }
+    function se(I, f) {
+      z.value !== null && (I.preventDefault(), I.dataTransfer && (I.dataTransfer.dropEffect = "move"), X.value = f);
+    }
+    function J() {
+      X.value = null;
+    }
+    function ue(I, f) {
+      I.preventDefault();
+      const M = z.value;
+      if (z.value = null, X.value = null, M === null || M === f) return;
+      const v = [...k.value], [h] = v.splice(M, 1), S = M < f ? f - 1 : f;
+      v.splice(S, 0, h), a("enum", v);
+    }
+    function G() {
+      z.value = null, X.value = null;
+    }
+    const E = F(
+      () => k.value.some((I) => String(I).trim().toLowerCase() === "other")
+    );
+    function L() {
+      E.value ? a(
+        "enum",
+        k.value.filter((I) => String(I).trim().toLowerCase() !== "other")
+      ) : a("enum", [...k.value, "Other"]);
+    }
+    const Y = de(!1), le = Z.filter(
+      (I) => ["text", "textarea", "number", "date", "select", "boolean", "rating"].includes(I.id)
+    );
+    function H(I) {
+      Y.value = !1, t.insertFieldAfter(n.pageIdx, n.fieldName, I);
+    }
+    function N() {
+      Y.value = !1, t.insertFieldAfter(n.pageIdx, n.fieldName, "section");
+    }
+    const c = F(() => {
+      switch (i.value) {
+        case "number":
+          return "number";
+        case "date":
+          return "date";
+        case "color":
+          return "color";
+        case "file":
+          return "file";
+        default:
+          return "text";
+      }
+    });
+    function m(I) {
+      if (I === "" || I == null) return;
+      const f = Number(I);
+      return Number.isFinite(f) ? f : void 0;
+    }
+    const ge = F(() => Number(l.value.min ?? 0)), we = F(() => Number(l.value.max ?? 100)), Me = F(() => Number(l.value.step ?? 1)), Rt = F(() => ge.value), vt = F(() => Number(l.value.max ?? 5));
+    return (I, f) => (C(), D("div", {
+      class: "expanded-wrap",
+      onClick: f[14] || (f[14] = He(() => {
+      }, ["stop"]))
+    }, [
+      p("div", Eo, [
+        p("header", Io, [
+          p("span", Oo, [
+            o.value ? (C(), D("co-icon", {
+              key: 0,
+              name: o.value.icon,
+              size: "20"
+            }, null, 8, No)) : U("", !0)
+          ]),
+          p("div", Ao, [
+            x(et, {
+              class: "expanded__label",
+              "model-value": l.value.label || "",
+              placeholder: "Untitled field",
+              "onUpdate:modelValue": f[0] || (f[0] = (M) => a("label", M))
+            }, null, 8, ["model-value"]),
+            p("div", Po, [
+              x(et, {
+                class: "expanded__id",
+                "model-value": e.fieldName,
+                placeholder: "field_id",
+                "onUpdate:modelValue": g
+              }, null, 8, ["model-value"]),
+              f[15] || (f[15] = p("span", { class: "expanded__sep" }, "·", -1)),
+              p("span", null, ce(o.value?.label || "Field"), 1)
+            ])
+          ]),
+          p("div", $o, [
+            x(b(Ue), {
+              class: "expanded__type",
+              options: JSON.stringify(b(r)),
+              value: i.value,
+              onCoChange: f[1] || (f[1] = (M) => y(s(M)))
+            }, null, 8, ["options", "value"]),
+            x(b(Et), {
+              icon: "x",
+              variant: "outlined",
+              size: "sm",
+              label: "Collapse",
+              onClick: u
+            })
+          ])
+        ]),
+        p("div", Fo, [
+          ["text", "textarea", "number", "date", "color", "file"].includes(i.value) ? (C(), D(Q, { key: 0 }, [
+            x(b(W), {
+              label: "Placeholder",
+              value: l.value.placeholder || "",
+              onCoInput: f[2] || (f[2] = (M) => a("placeholder", s(M)))
+            }, null, 8, ["value"]),
+            p("div", Mo, [
+              f[16] || (f[16] = p("div", { class: "expanded__preview-label" }, "Preview", -1)),
+              x(b(W), {
+                label: l.value.label,
+                placeholder: l.value.placeholder,
+                "helper-text": l.value.helperText,
+                type: c.value,
+                multiline: i.value === "textarea" || void 0,
+                required: !!l.value.required,
+                disabled: ""
+              }, null, 8, ["label", "placeholder", "helper-text", "type", "multiline", "required"])
+            ])
+          ], 64)) : i.value === "select" ? (C(), D("div", Ro, [
+            f[20] || (f[20] = p("div", { class: "expanded__options-label" }, "Options", -1)),
+            (C(!0), D(Q, null, De(k.value, (M, v) => (C(), D("div", {
+              key: v,
+              class: Ee(["expanded__option", {
+                "is-drop-target": X.value === v && z.value !== v,
+                "is-dragging": z.value === v
+              }]),
+              draggable: "true",
+              onDragstart: (h) => O(h, v),
+              onDragover: (h) => se(h, v),
+              onDragleave: J,
+              onDrop: (h) => ue(h, v),
+              onDragend: G
+            }, [
+              f[17] || (f[17] = p("span", {
+                class: "expanded__option-grip",
+                "aria-hidden": "true"
+              }, "⋮⋮", -1)),
+              f[18] || (f[18] = p("span", {
+                class: "expanded__option-bullet",
+                "aria-hidden": "true"
+              }, null, -1)),
+              x(b(W), {
+                class: "expanded__option-input",
+                value: M,
+                placeholder: `Option ${v + 1}`,
+                onCoInput: (h) => B(v, s(h))
+              }, null, 8, ["value", "placeholder", "onCoInput"]),
+              x(b(Et), {
+                icon: "x",
+                variant: "outlined",
+                size: "xs",
+                label: "Remove option",
+                onClick: (h) => j(v)
+              }, null, 8, ["onClick"])
+            ], 42, Bo))), 128)),
+            p("div", jo, [
+              x(b(It), {
+                label: "Add option",
+                variant: "stroke",
+                size: "s",
+                "icon-left": "plus",
+                onClick: te
+              }),
+              p("button", {
+                class: Ee(["expanded__other-toggle", { "is-active": E.value }]),
+                onClick: L
+              }, [
+                p("co-icon", {
+                  name: E.value ? "check-square" : "square",
+                  size: "14"
+                }, null, 8, zo),
+                f[19] || (f[19] = p("span", null, 'Add "Other (describe)"', -1))
+              ], 2)
+            ])
+          ])) : i.value === "boolean" ? (C(), D("div", Lo, [
+            f[21] || (f[21] = p("div", { class: "expanded__preview-label" }, "Preview", -1)),
+            x(b(it), {
+              label: l.value.label || e.fieldName,
+              "helper-text": l.value.helperText,
+              disabled: ""
+            }, null, 8, ["label", "helper-text"])
+          ])) : i.value === "rating" ? (C(), D(Q, { key: 3 }, [
+            p("div", Vo, [
+              x(b(W), {
+                label: "Max stars",
+                type: "number",
+                value: String(vt.value),
+                onCoInput: f[3] || (f[3] = (M) => a("max", m(s(M)) ?? 5))
+              }, null, 8, ["value"])
+            ]),
+            p("div", Yo, [
+              f[22] || (f[22] = p("div", { class: "expanded__preview-label" }, "Preview", -1)),
+              x(b(hl), {
+                label: l.value.label || e.fieldName,
+                max: vt.value,
+                value: 0,
+                "read-only": ""
+              }, null, 8, ["label", "max"])
+            ])
+          ], 64)) : i.value === "slider" ? (C(), D(Q, { key: 4 }, [
+            p("div", Uo, [
+              x(b(W), {
+                label: "Min",
+                type: "number",
+                value: String(ge.value),
+                onCoInput: f[4] || (f[4] = (M) => a("min", m(s(M)) ?? 0))
+              }, null, 8, ["value"]),
+              x(b(W), {
+                label: "Max",
+                type: "number",
+                value: String(we.value),
+                onCoInput: f[5] || (f[5] = (M) => a("max", m(s(M)) ?? 100))
+              }, null, 8, ["value"]),
+              x(b(W), {
+                label: "Step",
+                type: "number",
+                value: String(Me.value),
+                onCoInput: f[6] || (f[6] = (M) => a("step", m(s(M)) ?? 1))
+              }, null, 8, ["value"])
+            ]),
+            p("div", Xo, [
+              f[23] || (f[23] = p("div", { class: "expanded__preview-label" }, "Preview", -1)),
+              x(b(Mn), {
+                label: l.value.label || e.fieldName,
+                min: ge.value,
+                max: we.value,
+                step: Me.value,
+                value: Rt.value,
+                "show-value": "",
+                disabled: ""
+              }, null, 8, ["label", "min", "max", "step", "value"])
+            ])
+          ], 64)) : i.value === "ref" ? (C(), D(Q, { key: 5 }, [
+            p("div", Ho, [
+              x(b(W), {
+                label: "Model",
+                placeholder: "Company, User, Deal…",
+                value: l.value.ref || "",
+                onCoInput: f[7] || (f[7] = (M) => a("ref", s(M)))
+              }, null, 8, ["value"]),
+              x(b(W), {
+                label: "Display field",
+                placeholder: "name",
+                value: l.value.displayName || "",
+                onCoInput: f[8] || (f[8] = (M) => a("displayName", s(M)))
+              }, null, 8, ["value"])
+            ]),
+            p("div", qo, [
+              f[24] || (f[24] = p("div", { class: "expanded__preview-label" }, "Preview", -1)),
+              x(b(W), {
+                label: l.value.label || e.fieldName,
+                placeholder: `Search ${l.value.ref || "model"}…`,
+                "icon-left": "magnifying-glass",
+                disabled: ""
+              }, null, 8, ["label", "placeholder"])
+            ])
+          ], 64)) : i.value === "section" ? (C(), D(Q, { key: 6 }, [
+            x(b(W), {
+              label: "Description",
+              multiline: "",
+              placeholder: "Optional explanatory text shown under the section title.",
+              value: l.value.helperText || "",
+              onCoInput: f[9] || (f[9] = (M) => a("helperText", s(M)))
+            }, null, 8, ["value"]),
+            p("div", Jo, [
+              f[25] || (f[25] = p("div", { class: "expanded__preview-label" }, "Preview", -1)),
+              p("div", Wo, [
+                p("h4", null, ce(l.value.label || "Section title"), 1),
+                l.value.helperText ? (C(), D("p", Go, ce(l.value.helperText), 1)) : U("", !0)
+              ])
+            ])
+          ], 64)) : U("", !0),
+          i.value !== "section" ? (C(), Se(b(W), {
+            key: 7,
+            label: "Helper text",
+            value: l.value.helperText || "",
+            placeholder: "Optional helper / hint shown below the field",
+            onCoInput: f[10] || (f[10] = (M) => a("helperText", s(M)))
+          }, null, 8, ["value"])) : U("", !0)
+        ]),
+        p("footer", Zo, [
+          x(b(it), {
+            checked: !!l.value.required,
+            label: "Required",
+            onCoChange: f[11] || (f[11] = (M) => a("required", s(M)))
+          }, null, 8, ["checked"]),
+          f[28] || (f[28] = p("div", { class: "expanded__foot-spacer" }, null, -1)),
+          p("button", {
+            class: "expanded__foot-btn",
+            onClick: d
+          }, [...f[26] || (f[26] = [
+            p("co-icon", {
+              name: "copy",
+              size: "14"
+            }, null, -1),
+            p("span", null, "Duplicate", -1)
+          ])]),
+          p("button", {
+            class: "expanded__foot-btn expanded__foot-btn--danger",
+            onClick: T
+          }, [...f[27] || (f[27] = [
+            p("co-icon", {
+              name: "trash",
+              size: "14"
+            }, null, -1),
+            p("span", null, "Delete", -1)
+          ])])
+        ])
+      ]),
+      p("aside", {
+        class: Ee(["mini-toolbar", { "is-open": Y.value }])
+      }, [
+        p("button", {
+          class: "mini-toolbar__btn",
+          title: "Add field below",
+          onClick: f[12] || (f[12] = He((M) => Y.value = !Y.value, ["stop"]))
+        }, [...f[29] || (f[29] = [
+          p("co-icon", {
+            name: "plus",
+            size: "16"
+          }, null, -1)
+        ])]),
+        p("button", {
+          class: "mini-toolbar__btn",
+          title: "Add section below",
+          onClick: N
+        }, [...f[30] || (f[30] = [
+          p("co-icon", {
+            name: "minus",
+            size: "16"
+          }, null, -1)
+        ])]),
+        p("button", {
+          class: "mini-toolbar__btn",
+          title: "Duplicate",
+          onClick: d
+        }, [...f[31] || (f[31] = [
+          p("co-icon", {
+            name: "copy",
+            size: "16"
+          }, null, -1)
+        ])]),
+        Y.value ? (C(), D("div", {
+          key: 0,
+          class: "mini-popover",
+          onClick: f[13] || (f[13] = He(() => {
+          }, ["stop"]))
+        }, [
+          f[32] || (f[32] = p("div", { class: "mini-popover__label" }, "Insert field below", -1)),
+          (C(!0), D(Q, null, De(b(le), (M) => (C(), D("button", {
+            key: M.id,
+            class: "mini-popover__item",
+            onClick: (v) => H(M.id)
+          }, [
+            p("co-icon", {
+              name: M.icon,
+              size: "16"
+            }, null, 8, Ko),
+            p("span", null, ce(M.label), 1)
+          ], 8, Qo))), 128))
+        ])) : U("", !0)
+      ], 2)
+    ]));
+  }
+}), ta = /* @__PURE__ */ Ie(ea, [["__scopeId", "data-v-d1c82738"]]), na = { class: "field__icon" }, la = ["name"], oa = { class: "field__body" }, aa = { class: "field__name" }, ia = {
+  key: 0,
+  class: "field__chip field__chip--warn"
+}, ra = {
+  key: 1,
+  class: "field__chip"
+}, sa = {
+  key: 2,
+  class: "field__chip"
+}, ua = { class: "field__meta" }, da = { class: "field__meta-id" }, ca = /* @__PURE__ */ xe({
+  __name: "FieldCard",
+  props: {
+    pageIdx: {},
+    fieldIdx: {},
+    fieldName: {}
+  },
+  setup(e) {
+    const n = e, t = ze(), l = F(() => t.data.pages[n.pageIdx]), o = F(
+      () => l.value?.fields[n.fieldName] ?? {}
+    ), i = F(
+      () => t.selection.pageIdx === n.pageIdx && t.selection.fieldName === n.fieldName
+    ), r = F(() => {
+      const u = o.value;
+      return u.uiCom === "TextArea" ? Z.find((d) => d.id === "textarea") : u.uiCom === "Rating" ? Z.find((d) => d.id === "rating") : u.uiCom === "Slider" ? Z.find((d) => d.id === "slider") : u.uiCom === "ColorPicker" ? Z.find((d) => d.id === "color") : u.uiCom === "Section" ? Z.find((d) => d.id === "section") : u.uiCom === "File" ? Z.find((d) => d.id === "file") : u.ref ? Z.find((d) => d.id === "ref") : Array.isArray(u.enum) ? Z.find((d) => d.id === "select") : u.type === "Number" ? Z.find((d) => d.id === "number") : u.type === "Date" ? Z.find((d) => d.id === "date") : u.type === "Boolean" ? Z.find((d) => d.id === "boolean") : Z.find((d) => d.id === "text");
+    });
+    function s() {
+      t.selectField(n.pageIdx, n.fieldName);
+    }
+    function a(u) {
+      u.stopPropagation(), t.duplicateField(n.pageIdx, n.fieldName);
+    }
+    function g(u) {
+      u.stopPropagation(), t.removeField(n.pageIdx, n.fieldName);
+    }
+    return (u, d) => i.value ? (C(), Se(ta, {
+      key: 0,
+      "page-idx": e.pageIdx,
+      "field-name": e.fieldName
+    }, null, 8, ["page-idx", "field-name"])) : (C(), D("div", {
+      key: 1,
+      class: "field",
+      onClick: He(s, ["stop"])
+    }, [
+      d[4] || (d[4] = p("span", {
+        class: "field__grip",
+        "aria-hidden": "true"
+      }, "⋮⋮", -1)),
+      p("span", na, [
+        r.value ? (C(), D("co-icon", {
+          key: 0,
+          name: r.value.icon,
+          size: "18"
+        }, null, 8, la)) : U("", !0)
+      ]),
+      p("div", oa, [
+        p("div", aa, [
+          Ye(ce(o.value.label || e.fieldName) + " ", 1),
+          o.value.required ? (C(), D("span", ia, "required")) : U("", !0),
+          o.value.visibleIf ? (C(), D("span", ra, "visibleIf")) : U("", !0),
+          o.value.full ? (C(), D("span", sa, "full")) : U("", !0)
+        ]),
+        p("div", ua, [
+          p("span", da, ce(e.fieldName), 1),
+          d[1] || (d[1] = p("span", { class: "field__meta-sep" }, "·", -1)),
+          p("span", null, ce(r.value?.label || o.value.type || "String"), 1)
+        ])
+      ]),
+      p("div", {
+        class: "field__actions",
+        onClick: d[0] || (d[0] = He(() => {
+        }, ["stop"]))
+      }, [
+        p("button", {
+          class: "field__action",
+          title: "Duplicate",
+          onClick: a
+        }, [...d[2] || (d[2] = [
+          p("co-icon", {
+            name: "copy",
+            size: "14"
+          }, null, -1)
+        ])]),
+        p("button", {
+          class: "field__action field__action--danger",
+          title: "Delete",
+          onClick: g
+        }, [...d[3] || (d[3] = [
+          p("co-icon", {
+            name: "trash",
+            size: "14"
+          }, null, -1)
+        ])])
+      ])
+    ]));
+  }
+}), pa = /* @__PURE__ */ Ie(ca, [["__scopeId", "data-v-aad445c0"]]), fa = { class: "page__head" }, va = { class: "page__head-text" }, ma = { class: "page__head-pill" }, ha = ["disabled"], ga = {
+  key: 0,
+  class: "page__empty"
+}, ba = /* @__PURE__ */ xe({
+  __name: "PageCard",
+  props: {
+    pageIdx: {}
+  },
+  setup(e) {
+    const n = e, t = ze(), l = F(() => t.data.pages[n.pageIdx]), o = F(
+      () => t.selection.pageIdx === n.pageIdx && t.selection.fieldName === null
+    ), i = F({
+      get: () => l.value ? Object.keys(l.value.fields) : [],
+      set: (y) => t.reorderFieldsByNames(n.pageIdx, y)
+    }), r = de(!1);
+    function s() {
+      t.selectPage(n.pageIdx);
+    }
+    function a(y) {
+      y.stopPropagation(), t.duplicatePage(n.pageIdx);
+    }
+    function g(y) {
+      y.stopPropagation(), !(t.data.pages.length <= 1) && t.removePage(n.pageIdx);
+    }
+    function u(y) {
+      t.updatePage(n.pageIdx, y);
+    }
+    function d(y) {
+      y.dataTransfer && Array.from(y.dataTransfer.types).includes("application/cobalt-field-kind") && (y.preventDefault(), y.dataTransfer.dropEffect = "copy", r.value = !0);
+    }
+    function T(y) {
+      y.currentTarget === y.target && (r.value = !1);
+    }
+    function w(y) {
+      r.value = !1;
+      const k = y.dataTransfer?.getData("application/cobalt-field-kind");
+      k && (y.preventDefault(), t.addField(k, n.pageIdx));
+    }
+    return (y, k) => l.value ? (C(), D("section", {
+      key: 0,
+      class: Ee(["page", { "is-selected": o.value, "is-toolbox-drag": r.value }]),
+      onClick: s
+    }, [
+      p("header", fa, [
+        p("div", va, [
+          p("div", ma, "PAGE " + ce(e.pageIdx + 1), 1),
+          x(et, {
+            class: "page__title",
+            "model-value": l.value.title || "",
+            placeholder: "Untitled page",
+            "onUpdate:modelValue": k[0] || (k[0] = (B) => u({ title: B }))
+          }, null, 8, ["model-value"]),
+          x(et, {
+            class: "page__desc",
+            "model-value": l.value.description || "",
+            placeholder: "Add a description for this page (optional)",
+            "onUpdate:modelValue": k[1] || (k[1] = (B) => u({ description: B }))
+          }, null, 8, ["model-value"])
+        ]),
+        p("div", {
+          class: "page__head-actions",
+          onClick: k[2] || (k[2] = He(() => {
+          }, ["stop"]))
+        }, [
+          p("button", {
+            class: "page__action",
+            title: "Duplicate page",
+            onClick: a
+          }, [...k[4] || (k[4] = [
+            p("co-icon", {
+              name: "copy",
+              size: "14"
+            }, null, -1),
+            p("span", null, "Duplicate", -1)
+          ])]),
+          p("button", {
+            class: "page__action page__action--danger",
+            disabled: b(t).data.pages.length <= 1,
+            title: "Delete page",
+            onClick: g
+          }, [...k[5] || (k[5] = [
+            p("co-icon", {
+              name: "trash",
+              size: "14"
+            }, null, -1),
+            p("span", null, "Delete", -1)
+          ])], 8, ha)
+        ])
+      ]),
+      p("div", {
+        class: "page__body",
+        onDragover: d,
+        onDragleave: T,
+        onDrop: w
+      }, [
+        x(b(Do), {
+          modelValue: i.value,
+          "onUpdate:modelValue": k[3] || (k[3] = (B) => i.value = B),
+          class: "page__sortable",
+          animation: 140,
+          "ghost-class": "page__ghost",
+          "chosen-class": "page__chosen",
+          "drag-class": "page__drag",
+          handle: ".field__grip"
+        }, {
+          default: St(() => [
+            (C(!0), D(Q, null, De(i.value, (B, j) => (C(), Se(pa, {
+              key: B,
+              "page-idx": e.pageIdx,
+              "field-idx": j,
+              "field-name": B
+            }, null, 8, ["page-idx", "field-idx", "field-name"]))), 128))
+          ]),
+          _: 1
+        }, 8, ["modelValue"]),
+        i.value.length === 0 ? (C(), D("div", ga, [...k[6] || (k[6] = [
+          p("co-icon", {
+            name: "plus",
+            size: "20"
+          }, null, -1),
+          p("span", null, "Drag a field here or click one in the toolbox", -1)
+        ])])) : U("", !0)
+      ], 32)
+    ], 2)) : U("", !0);
+  }
+}), ya = /* @__PURE__ */ Ie(ba, [["__scopeId", "data-v-c2fa3971"]]), _a = { class: "canvas__pages" }, Ca = /* @__PURE__ */ xe({
+  __name: "FieldCanvas",
+  setup(e) {
+    const n = ze(), t = F(() => _l(n.resolvedTheme)), l = F(() => ({
+      ...t.value.customProperties
+    })), o = F(() => ({
+      ...t.value.inlineStyles
+    })), i = F(() => ({
+      "data-theme": t.value.modifiers.colorScheme,
+      "data-appearance": t.value.modifiers.appearance,
+      "data-density": t.value.modifiers.density,
+      "data-radius": t.value.modifiers.radius,
+      ...t.value.modifiers.hideHeader ? { "data-hide-header": "" } : {}
+    }));
+    return (r, s) => (C(), D("div", {
+      class: "canvas",
+      style: $n(o.value)
+    }, [
+      p("div", dl({
+        class: "canvas__inner",
+        style: l.value
+      }, i.value), [
+        t.value.modifiers.hideHeader ? U("", !0) : (C(), D("header", {
+          key: 0,
+          class: Ee(["canvas__head", { "is-selected": b(n).selection.kind === "form" }]),
+          onClick: s[2] || (s[2] = He((a) => b(n).selectForm(), ["stop"]))
+        }, [
+          x(et, {
+            class: "canvas__title",
+            "model-value": b(n).data.title,
+            placeholder: "Untitled form",
+            "onUpdate:modelValue": s[0] || (s[0] = (a) => b(n).setTitle(a))
+          }, null, 8, ["model-value"]),
+          x(et, {
+            class: "canvas__desc",
+            "model-value": b(n).data.description,
+            placeholder: "Add a description (optional)",
+            "onUpdate:modelValue": s[1] || (s[1] = (a) => b(n).setDescription(a))
+          }, null, 8, ["model-value"])
+        ], 2)),
+        p("div", _a, [
+          (C(!0), D(Q, null, De(b(n).data.pages, (a, g) => (C(), Se(ya, {
+            key: b(n).data.pages[g].name + "-" + g,
+            "page-idx": g
+          }, null, 8, ["page-idx"]))), 128))
+        ]),
+        p("button", {
+          class: "canvas__add-page",
+          onClick: s[3] || (s[3] = (a) => b(n).addPage())
+        }, [...s[4] || (s[4] = [
+          p("co-icon", {
+            name: "plus",
+            size: "14"
+          }, null, -1),
+          p("span", null, "Add page", -1)
+        ])])
+      ], 16)
+    ], 4));
+  }
+}), Sa = /* @__PURE__ */ Ie(Ca, [["__scopeId", "data-v-c8380252"]]), xa = { class: "props" }, wa = { class: "props__head" }, ka = { class: "props__title" }, Ta = { class: "props__subtitle" }, Da = { class: "props__body" }, Ea = { class: "row" }, Ia = { class: "seg" }, Oa = { class: "row" }, Na = { class: "row__label" }, Aa = { class: "row" }, Pa = { class: "accent" }, $a = ["title", "onClick"], Fa = {
+  key: 4,
+  class: "row"
+}, Ma = ["value"], Ra = { class: "props__foot" }, Ba = { class: "props__body" }, ja = { class: "props__body" }, za = /* @__PURE__ */ xe({
+  __name: "PropertiesPanel",
+  setup(e) {
+    const n = [
+      { id: "general", label: "General", icon: "gear" },
+      { id: "header", label: "Header", icon: "image" },
+      { id: "background", label: "Background", icon: "paint-bucket" },
+      { id: "appearance", label: "Appearance", icon: "paint-brush" },
+      { id: "advanced", label: "Advanced", icon: "code" }
+    ], t = [
+      { id: "general", label: "General", icon: "gear" },
+      { id: "logic", label: "Logic", icon: "git-branch" }
+    ], l = [
+      { id: "layout", label: "Layout", icon: "layout" },
+      { id: "logic", label: "Logic", icon: "git-branch" },
+      { id: "validation", label: "Validation", icon: "shield-check" }
+    ], o = [
+      { label: "Panels (default)", value: "panels" },
+      { label: "Without panels", value: "flat" }
+    ], i = [
+      { label: "Comfortable", value: "comfortable" },
+      { label: "Compact", value: "compact" }
+    ], r = [
+      { label: "Rounded", value: "rounded" },
+      { label: "Sharp", value: "sharp" }
+    ], s = [
+      { label: "Auto", value: "auto" },
+      { label: "Contain", value: "contain" },
+      { label: "Cover", value: "cover" }
+    ], a = [
+      { label: "Scroll", value: "scroll" },
+      { label: "Fixed", value: "fixed" }
+    ], g = [
+      { label: "(none)", value: "" },
+      { label: "email", value: "email" },
+      { label: "url", value: "url" },
+      { label: "uuid", value: "uuid" }
+    ], u = [
+      { id: "azul", label: "Azul", hex: gt.azul },
+      { id: "verde", label: "Verde", hex: gt.verde },
+      { id: "amarillo", label: "Amarillo", hex: gt.amarillo },
+      { id: "rosado", label: "Rosado", hex: gt.rosado }
+    ], d = ze(), T = F(() => d.selection.kind), w = F(() => d.currentPage), y = F(() => d.selectedField || {}), k = F(() => d.selection.fieldName ?? ""), B = de("general"), j = de("general"), te = de("layout");
+    Ke(T, (N) => {
+      N === "form" ? B.value = "general" : N === "page" ? j.value = "general" : N === "field" && (te.value = "layout");
+    });
+    const z = F(() => d.data.theme), X = F(() => d.resolvedTheme);
+    function O(N) {
+      const c = N.detail;
+      return c != null && typeof c == "object" && "value" in c ? c.value : c != null && typeof c == "object" && "checked" in c ? c.checked : c;
+    }
+    function se(N) {
+      if (N === "" || N == null) return;
+      const c = Number(N);
+      return Number.isFinite(c) ? c : void 0;
+    }
+    function J(N, c) {
+      d.updateField(d.selection.pageIdx, k.value, { [N]: c });
+    }
+    function ue(N, c) {
+      d.updatePage(d.selection.pageIdx, { [N]: c });
+    }
+    function G(N, c) {
+      d.setTheme({ [N]: c });
+    }
+    function E(N, c, m) {
+      d.setThemeSection(N, { [c]: m });
+    }
+    function L(N) {
+      G("accent", N);
+    }
+    function Y(N) {
+      const c = N.trim();
+      /^#[0-9a-fA-F]{3,8}$/.test(c) && d.setTheme({ accent: "custom", accentHex: c });
+    }
+    const le = F(() => T.value === "form" ? "Form" : T.value === "page" ? "Page" : "Field"), H = F(() => T.value === "form" ? d.data.title || "Untitled form" : T.value === "page" ? w.value?.name ?? "" : k.value);
+    return (N, c) => (C(), D("div", xa, [
+      p("header", wa, [
+        p("div", ka, ce(le.value), 1),
+        p("div", Ta, ce(H.value), 1)
+      ]),
+      T.value === "form" ? (C(), D(Q, { key: 0 }, [
+        x(b(jt), {
+          class: "props__tabs",
+          value: B.value,
+          onCoTabChange: c[0] || (c[0] = (m) => B.value = O(m) || B.value)
+        }, {
+          default: St(() => [
+            (C(), D(Q, null, De(n, (m) => x(b(zt), {
+              key: m.id,
+              label: m.label,
+              value: m.id,
+              "icon-left": m.icon,
+              size: "small"
+            }, null, 8, ["label", "value", "icon-left"])), 64))
+          ]),
+          _: 1
+        }, 8, ["value"]),
+        p("div", Da, [
+          B.value === "general" ? (C(), D(Q, { key: 0 }, [
+            p("div", Ea, [
+              c[39] || (c[39] = p("div", { class: "row__label" }, "Color scheme", -1)),
+              p("div", Ia, [
+                p("button", {
+                  class: Ee(["seg__btn", { "is-active": X.value.colorScheme === "light" }]),
+                  onClick: c[1] || (c[1] = (m) => G("colorScheme", "light"))
+                }, [...c[37] || (c[37] = [
+                  p("co-icon", {
+                    name: "sun",
+                    size: "14"
+                  }, null, -1),
+                  p("span", null, "Light", -1)
+                ])], 2),
+                p("button", {
+                  class: Ee(["seg__btn", { "is-active": X.value.colorScheme === "dark" }]),
+                  onClick: c[2] || (c[2] = (m) => G("colorScheme", "dark"))
+                }, [...c[38] || (c[38] = [
+                  p("co-icon", {
+                    name: "moon",
+                    size: "14"
+                  }, null, -1),
+                  p("span", null, "Dark", -1)
+                ])], 2)
+              ])
+            ]),
+            x(b(Ue), {
+              label: "Question appearance",
+              options: JSON.stringify(o),
+              value: X.value.questionAppearance,
+              onCoChange: c[3] || (c[3] = (m) => G("questionAppearance", O(m)))
+            }, null, 8, ["options", "value"]),
+            x(b(Ue), {
+              label: "Density",
+              options: JSON.stringify(i),
+              value: X.value.density,
+              onCoChange: c[4] || (c[4] = (m) => G("density", O(m)))
+            }, null, 8, ["options", "value"]),
+            x(b(Ue), {
+              label: "Border radius",
+              options: JSON.stringify(r),
+              value: X.value.borderRadius,
+              onCoChange: c[5] || (c[5] = (m) => G("borderRadius", O(m)))
+            }, null, 8, ["options", "value"])
+          ], 64)) : U("", !0),
+          B.value === "header" ? (C(), D(Q, { key: 1 }, [
+            x(b(it), {
+              label: "Show header",
+              checked: X.value.header.show,
+              onCoChange: c[6] || (c[6] = (m) => E("header", "show", O(m)))
+            }, null, 8, ["checked"]),
+            x(b(W), {
+              label: "Background color",
+              placeholder: "#fff or rgb(...)",
+              value: z.value.header?.backgroundColor || "",
+              onCoInput: c[7] || (c[7] = (m) => E("header", "backgroundColor", O(m) || null))
+            }, null, 8, ["value"]),
+            x(b(W), {
+              label: "Height",
+              placeholder: "120px",
+              "helper-text": "Any CSS length. Leave empty for auto.",
+              value: z.value.header?.height || "",
+              onCoInput: c[8] || (c[8] = (m) => E("header", "height", O(m) || null))
+            }, null, 8, ["value"])
+          ], 64)) : U("", !0),
+          B.value === "background" ? (C(), D(Q, { key: 2 }, [
+            x(b(W), {
+              label: "Background color",
+              placeholder: "#F3F3F3",
+              value: z.value.background?.color || "",
+              onCoInput: c[9] || (c[9] = (m) => E("background", "color", O(m) || null))
+            }, null, 8, ["value"]),
+            x(b(W), {
+              label: "Background image URL",
+              placeholder: "https://…",
+              value: z.value.background?.imageUrl || "",
+              onCoInput: c[10] || (c[10] = (m) => E("background", "imageUrl", O(m) || null))
+            }, null, 8, ["value"]),
+            x(b(Ue), {
+              label: "Image size",
+              options: JSON.stringify(s),
+              value: X.value.background.imageSize,
+              onCoChange: c[11] || (c[11] = (m) => E("background", "imageSize", O(m)))
+            }, null, 8, ["options", "value"]),
+            x(b(Ue), {
+              label: "Image attachment",
+              options: JSON.stringify(a),
+              value: X.value.background.imageAttachment,
+              onCoChange: c[12] || (c[12] = (m) => E("background", "imageAttachment", O(m)))
+            }, null, 8, ["options", "value"]),
+            p("div", Oa, [
+              p("div", Na, "Opacity (" + ce(X.value.background.opacity) + "%)", 1),
+              x(b(Mn), {
+                min: 0,
+                max: 100,
+                step: 5,
+                value: X.value.background.opacity,
+                "show-value": "",
+                onCoChange: c[13] || (c[13] = (m) => E("background", "opacity", O(m)))
+              }, null, 8, ["value"])
+            ])
+          ], 64)) : U("", !0),
+          B.value === "appearance" ? (C(), D(Q, { key: 3 }, [
+            p("div", Aa, [
+              c[41] || (c[41] = p("div", { class: "row__label" }, "Accent", -1)),
+              p("div", Pa, [
+                (C(), D(Q, null, De(u, (m) => p("button", {
+                  key: m.id,
+                  class: Ee(["accent__chip", { "is-active": X.value.accent === m.id }]),
+                  style: $n({ "--accent": m.hex }),
+                  title: m.label,
+                  onClick: (ge) => L(m.id)
+                }, [
+                  c[40] || (c[40] = p("span", { class: "accent__chip-dot" }, null, -1)),
+                  p("span", null, ce(m.label), 1)
+                ], 14, $a)), 64))
+              ])
+            ]),
+            x(b(W), {
+              label: "Custom accent (hex)",
+              placeholder: "#2563EB",
+              "helper-text": "Sets accent to Custom and overrides the primary.",
+              value: X.value.accent === "custom" ? X.value.accentHex : "",
+              onCoChange: c[14] || (c[14] = (m) => Y(O(m) ?? ""))
+            }, null, 8, ["value"]),
+            x(b(W), {
+              label: "Font family",
+              placeholder: "Inter, system-ui, sans-serif",
+              "helper-text": "CSS font stack. Empty = Geist (Cobalt default).",
+              value: z.value.fontFamily || "",
+              onCoInput: c[15] || (c[15] = (m) => G("fontFamily", O(m) || void 0))
+            }, null, 8, ["value"])
+          ], 64)) : U("", !0),
+          B.value === "advanced" ? (C(), D("div", Fa, [
+            c[42] || (c[42] = p("div", { class: "row__label" }, "Custom CSS", -1)),
+            p("textarea", {
+              class: "codebox",
+              spellcheck: "false",
+              rows: "14",
+              placeholder: '.co-form-wizard [data-co-field="email"] co-input { ... }',
+              value: z.value.customCss || "",
+              onInput: c[16] || (c[16] = (m) => G("customCss", m.target.value || void 0))
+            }, null, 40, Ma),
+            c[43] || (c[43] = p("p", { class: "props__hint" }, [
+              Ye(" Injected scoped to the form. Target fields via "),
+              p("code", null, '[data-co-field="name"]'),
+              Ye(" or "),
+              p("code", null, '[data-co-field-kind="select"]'),
+              Ye(". "),
+              p("code", null, "@import"),
+              Ye(", inline scripts and "),
+              p("code", null, "</style>"),
+              Ye(" are stripped. ")
+            ], -1))
+          ])) : U("", !0)
+        ]),
+        p("footer", Ra, [
+          x(b(It), {
+            label: "Reset theme",
+            variant: "stroke",
+            size: "s",
+            "icon-left": "arrow-counter-clockwise",
+            onClick: b(d).resetTheme
+          }, null, 8, ["onClick"])
+        ])
+      ], 64)) : T.value === "page" ? (C(), D(Q, { key: 1 }, [
+        x(b(jt), {
+          class: "props__tabs",
+          value: j.value,
+          onCoTabChange: c[17] || (c[17] = (m) => j.value = O(m) || j.value)
+        }, {
+          default: St(() => [
+            (C(), D(Q, null, De(t, (m) => x(b(zt), {
+              key: m.id,
+              label: m.label,
+              value: m.id,
+              "icon-left": m.icon,
+              size: "small"
+            }, null, 8, ["label", "value", "icon-left"])), 64))
+          ]),
+          _: 1
+        }, 8, ["value"]),
+        p("div", Ba, [
+          j.value === "general" ? (C(), D(Q, { key: 0 }, [
+            x(b(W), {
+              label: "Name (id)",
+              value: w.value.name,
+              "helper-text": "Used as the page key in the schema.",
+              onCoInput: c[18] || (c[18] = (m) => ue("name", O(m)))
+            }, null, 8, ["value"]),
+            x(b(W), {
+              label: "Title",
+              value: w.value.title || "",
+              "helper-text": "Also editable inline on the canvas.",
+              onCoInput: c[19] || (c[19] = (m) => ue("title", O(m)))
+            }, null, 8, ["value"]),
+            x(b(it), {
+              label: "Show title in form",
+              checked: !w.value.hideTitle,
+              onCoChange: c[20] || (c[20] = (m) => ue("hideTitle", O(m) ? void 0 : !0))
+            }, null, 8, ["checked"]),
+            x(b(W), {
+              label: "Description",
+              multiline: "",
+              value: w.value.description || "",
+              onCoInput: c[21] || (c[21] = (m) => ue("description", O(m)))
+            }, null, 8, ["value"]),
+            x(b(it), {
+              label: "Show description in form",
+              checked: !w.value.hideDescription,
+              onCoChange: c[22] || (c[22] = (m) => ue("hideDescription", O(m) ? void 0 : !0))
+            }, null, 8, ["checked"])
+          ], 64)) : U("", !0),
+          j.value === "logic" ? (C(), Se(b(W), {
+            key: 1,
+            label: "visibleIf",
+            placeholder: "{customerType} == 'premium'",
+            "helper-text": "Page hidden unless expression is truthy.",
+            value: w.value.visibleIf || "",
+            onCoInput: c[23] || (c[23] = (m) => ue("visibleIf", O(m) || void 0))
+          }, null, 8, ["value"])) : U("", !0)
+        ])
+      ], 64)) : (C(), D(Q, { key: 2 }, [
+        x(b(jt), {
+          class: "props__tabs",
+          value: te.value,
+          onCoTabChange: c[24] || (c[24] = (m) => te.value = O(m) || te.value)
+        }, {
+          default: St(() => [
+            (C(), D(Q, null, De(l, (m) => x(b(zt), {
+              key: m.id,
+              label: m.label,
+              value: m.id,
+              "icon-left": m.icon,
+              size: "small"
+            }, null, 8, ["label", "value", "icon-left"])), 64))
+          ]),
+          _: 1
+        }, 8, ["value"]),
+        p("div", ja, [
+          te.value === "layout" ? (C(), D(Q, { key: 0 }, [
+            x(b(ht), {
+              label: "Full width (span all columns)",
+              checked: !!y.value.full,
+              onCoChange: c[25] || (c[25] = (m) => J("full", O(m)))
+            }, null, 8, ["checked"]),
+            x(b(ht), {
+              label: "Hidden",
+              checked: !!y.value.hidden,
+              onCoChange: c[26] || (c[26] = (m) => J("hidden", O(m)))
+            }, null, 8, ["checked"]),
+            x(b(ht), {
+              label: "Disabled",
+              checked: !!y.value.disabled || !!y.value.readOnly,
+              onCoChange: c[27] || (c[27] = (m) => J("disabled", O(m) || void 0))
+            }, null, 8, ["checked"]),
+            y.value.type === "String" ? (C(), Se(b(Ue), {
+              key: 0,
+              label: "Format",
+              options: JSON.stringify(g),
+              value: y.value.format || "",
+              onCoChange: c[28] || (c[28] = (m) => J("format", O(m) || void 0))
+            }, null, 8, ["options", "value"])) : U("", !0)
+          ], 64)) : U("", !0),
+          te.value === "logic" ? (C(), D(Q, { key: 1 }, [
+            x(b(W), {
+              label: "visibleIf",
+              placeholder: "{type} == 'premium'",
+              value: y.value.visibleIf || "",
+              onCoInput: c[29] || (c[29] = (m) => J("visibleIf", O(m) || void 0))
+            }, null, 8, ["value"]),
+            x(b(W), {
+              label: "enableIf",
+              placeholder: "{accepted} == true",
+              value: y.value.enableIf || "",
+              onCoInput: c[30] || (c[30] = (m) => J("enableIf", O(m) || void 0))
+            }, null, 8, ["value"]),
+            x(b(W), {
+              label: "requiredIf",
+              placeholder: "{country} == 'US'",
+              value: y.value.requiredIf || "",
+              onCoInput: c[31] || (c[31] = (m) => J("requiredIf", O(m) || void 0))
+            }, null, 8, ["value"]),
+            c[44] || (c[44] = p("p", { class: "props__hint" }, [
+              Ye(" Operators: "),
+              p("code", null, "== != > < >= <= contains && ||")
+            ], -1))
+          ], 64)) : U("", !0),
+          te.value === "validation" ? (C(), D(Q, { key: 2 }, [
+            x(b(ht), {
+              label: "Required",
+              checked: !!y.value.required,
+              onCoChange: c[32] || (c[32] = (m) => J("required", O(m)))
+            }, null, 8, ["checked"]),
+            y.value.type === "String" ? (C(), Se(b(W), {
+              key: 0,
+              label: "Min length",
+              type: "number",
+              value: y.value.minLength ?? "",
+              onCoInput: c[33] || (c[33] = (m) => J("minLength", se(O(m))))
+            }, null, 8, ["value"])) : U("", !0),
+            y.value.type === "String" ? (C(), Se(b(W), {
+              key: 1,
+              label: "Max length",
+              type: "number",
+              value: y.value.maxLength ?? "",
+              onCoInput: c[34] || (c[34] = (m) => J("maxLength", se(O(m))))
+            }, null, 8, ["value"])) : U("", !0),
+            y.value.type === "Number" ? (C(), Se(b(W), {
+              key: 2,
+              label: "Min",
+              type: "number",
+              value: y.value.min ?? "",
+              onCoInput: c[35] || (c[35] = (m) => J("min", se(O(m))))
+            }, null, 8, ["value"])) : U("", !0),
+            y.value.type === "Number" ? (C(), Se(b(W), {
+              key: 3,
+              label: "Max",
+              type: "number",
+              value: y.value.max ?? "",
+              onCoInput: c[36] || (c[36] = (m) => J("max", se(O(m))))
+            }, null, 8, ["value"])) : U("", !0)
+          ], 64)) : U("", !0)
+        ])
+      ], 64))
+    ]));
+  }
+}), La = /* @__PURE__ */ Ie(za, [["__scopeId", "data-v-eefaf8de"]]), Va = { class: "designer" }, Ya = { class: "designer__panel designer__panel--left" }, Ua = { class: "designer__canvas" }, Xa = { class: "designer__panel designer__panel--right" }, Ha = /* @__PURE__ */ xe({
+  __name: "DesignerTab",
+  setup(e) {
+    return (n, t) => (C(), D("div", Va, [
+      p("aside", Ya, [
+        x(Al)
+      ]),
+      p("section", Ua, [
+        x(Sa)
+      ]),
+      p("aside", Xa, [
+        x(La)
+      ])
+    ]));
+  }
+}), qa = /* @__PURE__ */ Ie(Ha, [["__scopeId", "data-v-d8b2c553"]]), Ja = { class: "json-tab" }, Wa = { class: "json-tab__bar" }, Ga = {
+  key: 0,
+  class: "json-tab__err"
+}, Za = /* @__PURE__ */ xe({
+  __name: "JsonTab",
+  setup(e) {
+    const n = ze(), t = de(""), l = de(null), o = F(() => JSON.stringify(n.exported, null, 2));
+    Ke(o, (s) => t.value = s, { immediate: !0 });
+    function i() {
+      try {
+        const s = JSON.parse(t.value);
+        if (!s || typeof s != "object")
+          throw new Error("Schema must be a JSON object");
+        n.replaceAll(s), l.value = null;
+      } catch (s) {
+        l.value = s.message;
+      }
+    }
+    function r() {
+      t.value = o.value, l.value = null;
+    }
+    return (s, a) => (C(), D("div", Ja, [
+      p("div", Wa, [
+        x(b(It), {
+          label: "Apply",
+          variant: "primary",
+          size: "s",
+          onClick: i
+        }),
+        x(b(It), {
+          label: "Discard",
+          variant: "stroke",
+          size: "s",
+          onClick: r
+        }),
+        l.value ? (C(), D("span", Ga, ce(l.value), 1)) : U("", !0),
+        a[1] || (a[1] = p("span", { class: "json-tab__hint" }, " Plain editor — Monaco integration is a follow-up. ", -1))
+      ]),
+      Fn(p("textarea", {
+        "onUpdate:modelValue": a[0] || (a[0] = (g) => t.value = g),
+        class: "json-tab__area",
+        spellcheck: "false"
+      }, null, 512), [
+        [cl, t.value]
+      ])
+    ]));
+  }
+}), Qa = /* @__PURE__ */ Ie(Za, [["__scopeId", "data-v-6f8a102d"]]), Ka = { class: "preview" }, ei = { class: "preview__pane preview__pane--form" }, ti = ["schema", "theme"], ni = ["schema", "theme"], li = { class: "preview__pane preview__pane--side" }, oi = {
+  key: 0,
+  class: "preview__json"
+}, ai = {
+  key: 1,
+  class: "preview__empty"
+}, ii = /* @__PURE__ */ xe({
+  __name: "PreviewTab",
+  setup(e) {
+    const n = ze(), t = F(() => n.exported), l = F(() => Qt(t.value)), o = F(() => JSON.stringify(t.value)), i = F(() => {
+      const a = Object.keys(n.data.theme).length > 0 ? JSON.stringify(n.data.theme) : void 0;
+      return console.log("[PreviewTab] themeJson →", a, "rawTheme:", n.data.theme, "isPaged:", l.value), a;
+    }), r = de(null);
+    function s(a) {
+      const g = a.detail;
+      r.value = g?.values ?? null;
+    }
+    return (a, g) => (C(), D("div", Ka, [
+      p("div", ei, [
+        l.value ? (C(), D("co-form-wizard", {
+          key: o.value + (i.value ?? ""),
+          schema: o.value,
+          theme: i.value,
+          layout: "grid",
+          columns: "1",
+          "on:coSubmit": s
+        }, null, 40, ti)) : (C(), D("co-form", {
+          key: o.value + (i.value ?? ""),
+          schema: o.value,
+          theme: i.value,
+          layout: "grid",
+          columns: "2",
+          "on:coSubmit": s
+        }, null, 40, ni))
+      ]),
+      p("aside", li, [
+        g[0] || (g[0] = p("div", { class: "preview__pane-head" }, [
+          p("h3", { class: "preview__title" }, "Last submit"),
+          p("p", { class: "preview__desc" }, "Fill the form and press Submit to see the payload.")
+        ], -1)),
+        r.value ? (C(), D("pre", oi, ce(JSON.stringify(r.value, null, 2)), 1)) : (C(), D("div", ai, "No submissions yet."))
+      ])
+    ]));
+  }
+}), ri = /* @__PURE__ */ Ie(ii, [["__scopeId", "data-v-275d3bfc"]]), si = { class: "shell" }, ui = { class: "shell__topbar" }, di = {
+  key: 0,
+  class: "shell__brand"
+}, ci = { class: "shell__brand-title" }, pi = { class: "shell__tabs" }, fi = ["onClick"], vi = { class: "shell__actions" }, mi = { class: "shell__content" }, hi = /* @__PURE__ */ xe({
+  __name: "CobaltFormBuilder",
+  props: {
+    modelValue: { default: () => ({}) },
+    tabs: { default: () => ["designer", "preview", "json"] },
+    hideBrand: { type: Boolean, default: !1 },
+    brandLabel: { default: "Cobalt Form Builder" },
+    skipCobaltRegister: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "event", "field-added", "field-removed", "field-renamed", "field-updated", "field-duplicated", "field-reordered", "page-added", "page-removed", "page-duplicated", "page-updated", "theme-changed", "selection-changed", "schema-replaced", "undo", "redo"],
+  setup(e, { emit: n }) {
+    const t = e, l = n, o = {
+      designer: { label: "Designer" },
+      preview: { label: "Preview" },
+      json: { label: "JSON Editor" }
+    }, i = F(
+      () => t.tabs.map((u) => ({ id: u, label: o[u].label }))
+    ), r = de(t.tabs[0] ?? "designer");
+    let s = !1;
+    const a = Sl({
+      initialSchema: t.modelValue,
+      onEvent: (u) => {
+        l("event", u), l(u.type, u);
+      }
+    });
+    pl(Rn, a), Ke(
+      () => a.exported,
+      (u) => {
+        s || l("update:modelValue", u);
+      },
+      { deep: !0 }
+    ), Ke(
+      () => t.modelValue,
+      (u) => {
+        if (!u) return;
+        const d = JSON.stringify(u), T = JSON.stringify(a.exported);
+        d !== T && (s = !0, a.replaceAll(u), s = !1);
+      },
+      { deep: !0 }
+    ), An(() => {
+      t.skipCobaltRegister || (gl(), bl()), window.addEventListener("keydown", g);
+    }), fl(() => {
+      window.removeEventListener("keydown", g);
+    });
+    function g(u) {
+      if (u.key === "Escape") {
+        const T = u.target;
+        if (T?.isContentEditable || T?.tagName === "INPUT" || T?.tagName === "TEXTAREA" || T?.tagName === "SELECT") {
+          T.blur();
+          return;
+        }
+        a.selection.fieldName !== null && a.selectPage(a.selection.pageIdx);
+        return;
+      }
+      (u.metaKey || u.ctrlKey) && (u.key === "z" && !u.shiftKey ? (u.preventDefault(), a.undo()) : (u.key === "z" && u.shiftKey || u.key === "y") && (u.preventDefault(), a.redo()));
+    }
+    return (u, d) => (C(), D("div", si, [
+      mt(u.$slots, "before", {}, void 0, !0),
+      p("header", ui, [
+        mt(u.$slots, "brand", {}, () => [
+          e.hideBrand ? U("", !0) : (C(), D("div", di, [
+            d[2] || (d[2] = p("div", { class: "shell__brand-mark" }, "CF", -1)),
+            p("h1", ci, ce(e.brandLabel), 1)
+          ]))
+        ], !0),
+        p("nav", pi, [
+          (C(!0), D(Q, null, De(i.value, (T) => (C(), D("button", {
+            key: T.id,
+            class: Ee(["shell__tab", { "is-active": r.value === T.id }]),
+            onClick: (w) => r.value = T.id
+          }, ce(T.label), 11, fi))), 128))
+        ]),
+        p("div", vi, [
+          mt(u.$slots, "actions", { store: b(a) }, () => [
+            x(b(Et), {
+              icon: "arrow-counter-clockwise",
+              variant: "outlined",
+              size: "sm",
+              label: "Undo (⌘Z)",
+              disabled: !b(a).canUndo,
+              onClick: d[0] || (d[0] = (T) => b(a).undo())
+            }, null, 8, ["disabled"]),
+            x(b(Et), {
+              icon: "arrow-clockwise",
+              variant: "outlined",
+              size: "sm",
+              label: "Redo (⌘⇧Z)",
+              disabled: !b(a).canRedo,
+              onClick: d[1] || (d[1] = (T) => b(a).redo())
+            }, null, 8, ["disabled"])
+          ], !0)
+        ])
+      ]),
+      p("main", mi, [
+        Fn(x(qa, null, null, 512), [
+          [vl, r.value === "designer"]
+        ]),
+        r.value === "preview" ? (C(), Se(ri, { key: 0 })) : U("", !0),
+        r.value === "json" ? (C(), Se(Qa, { key: 1 })) : U("", !0)
+      ]),
+      mt(u.$slots, "after", { store: b(a) }, void 0, !0)
+    ]));
+  }
+}), Si = /* @__PURE__ */ Ie(hi, [["__scopeId", "data-v-d5541509"]]);
+export {
+  Si as CobaltFormBuilder
+};
+//# sourceMappingURL=cobalt-form-builder.js.map