hldesigner 0.0.281 → 0.0.282

package/css-editor-362763ce.js

@@ -0,0 +1,1355 @@
+import { defineComponent as A, ref as S, computed as M, watch as U, resolveComponent as F, openBlock as L, createBlock as X, withCtx as c, renderSlot as ge, createVNode as d, mergeProps as ie, createElementBlock as q, Fragment as ae, renderList as pe, unref as s, createCommentVNode as ce, createTextVNode as me, toDisplayString as z, reactive as le, createElementVNode as a, withKeys as be, normalizeClass as I, onMounted as fe, normalizeProps as ve, guardReactiveProps as ye } from "vue";
+import { d as B, i as Z, h as H, f as Ve } from "./obj-571dd058.js";
+import { a as m } from "./enum-type-dfa86fd6.js";
+import { u as he } from "./icon-aff7bde2.js";
+import { w as _e } from "./expression-b8f60625.js";
+import { S as W, b6 as Re, bW as ue, bX as $e, bY as Te, bZ as ke, b_ as we, b$ as Ue, c0 as xe, c1 as Be, c2 as Le, bV as Se, ay as Ce } from "./enum-type-fe807357.js";
+import { C as x } from "./baseImp-f2767c96.js";
+import { I as Ee } from "./property-base-2e08f1cd.js";
+import { u as Ie } from "./share-editor-7c525c97.js";
+import { E as Fe, O as De } from "./editor-wrapper-ac06b695.js";
+import { S as V } from "./index-d9f3ea25.js";
+import { _ as D } from "./_share_size.vue_vue_type_script_setup_true_lang-22bdb232.js";
+import { s as J } from "./_share_wrapper-9d61ae87.js";
+import { _ as j } from "./_plugin-vue_export-helper-dad06003.js";
+import { c as de, a as ne, u as We } from "./cssIndex-87c6de29.js";
+import { h as Me } from "./_share_image-9ce786a4.js";
+import { u as Ae } from "./share-event-f999e66a.js";
+import "./source-map-b04aec4a.js";
+import "./uuid-46529de4.js";
+import "./_commonjsHelpers-e7ea1525.js";
+import "./esprima-e8d15055.js";
+import "axios";
+import "./dialog-8367296a.js";
+import "element-plus";
+import "./index-1584a7a5.js";
+import "./optionItem-3c87120a.js";
+import "./index-31195212.js";
+import "./index-126a08b9.js";
+import "./index-6bcfdc22.js";
+import "./emitter-1acbfda9.js";
+const Ke = /* @__PURE__ */ A({
+  __name: "_share_color",
+  props: {
+    modelValue: {},
+    label: {},
+    color: {},
+    options: {}
+  },
+  emits: ["update:modelValue"],
+  setup($, { emit: T }) {
+    const _ = $, i = S([
+      "#ff4500",
+      "#ff8c00",
+      "#ffd700",
+      "#90ee90",
+      "#00ced1",
+      "#1e90ff",
+      "#c71585",
+      "rgba(255, 69, 0, 0.68)",
+      "rgb(255, 120, 0)",
+      "hsv(51, 100, 98)",
+      "hsva(120, 40, 94, 0.5)",
+      "hsl(181, 100%, 37%)",
+      "hsla(209, 100%, 56%, 0.73)",
+      "#c7158577"
+    ]), h = S(_.modelValue), R = M(() => h.value || ""), v = T, e = () => {
+      v("update:modelValue", R.value);
+    }, u = S(), n = () => {
+      setTimeout(() => {
+        var f;
+        (f = u.value) == null || f.show();
+      }, 100);
+    };
+    return U(() => h.value, () => {
+      e();
+    }), U(() => _.modelValue, (f) => {
+      h.value = f;
+    }), (f, p) => {
+      const b = F("el-color-picker"), w = F("el-input");
+      return L(), X(J, {
+        label: $.label,
+        color: $.color
+      }, {
+        label: c(() => [
+          ge(f.$slots, "label", {}, void 0, !0)
+        ]),
+        input: c(() => [
+          d(w, {
+            modelValue: h.value,
+            "onUpdate:modelValue": p[1] || (p[1] = (k) => h.value = k),
+            onClick: n
+          }, {
+            prepend: c(() => [
+              d(b, ie({
+                ref_key: "colorRef",
+                ref: u,
+                modelValue: h.value,
+                "onUpdate:modelValue": p[0] || (p[0] = (k) => h.value = k)
+              }, $.options, { predefine: i.value }), null, 16, ["modelValue", "predefine"])
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        _: 3
+      }, 8, ["label", "color"]);
+    };
+  }
+});
+const re = /* @__PURE__ */ j(Ke, [["__scopeId", "data-v-6f08b1ee"]]), oe = /* @__PURE__ */ A({
+  __name: "_share_select",
+  props: {
+    modelValue: {},
+    iconTitle: {},
+    options: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup($, { emit: T }) {
+    const _ = $, i = S(_.modelValue), h = M(() => i.value || ""), R = T, v = () => {
+      R("update:modelValue", h.value);
+    }, e = (u) => {
+      R("change", u);
+    };
+    return U(() => i.value, () => {
+      v();
+    }), U(() => _.modelValue, (u) => {
+      i.value = u;
+    }), (u, n) => {
+      const f = F("el-option"), p = F("el-select");
+      return L(), X(p, {
+        modelValue: i.value,
+        "onUpdate:modelValue": n[0] || (n[0] = (b) => i.value = b),
+        "suffix-icon": "",
+        placeholder: " ",
+        teleported: !1,
+        clearable: !0,
+        onChange: e
+      }, {
+        default: c(() => [
+          (L(!0), q(ae, null, pe($.options, (b) => (L(), X(f, {
+            key: b.value,
+            label: b.label,
+            value: b.value
+          }, {
+            default: c(() => [
+              $.iconTitle ? (L(), X(V, {
+                key: 0,
+                name: `@css-${$.iconTitle ? $.iconTitle + "-" : ""}${s(de)(b.value, "kebab")}`
+              }, null, 8, ["name"])) : ce("", !0),
+              me(z(b == null ? void 0 : b.label), 1)
+            ]),
+            _: 2
+          }, 1032, ["label", "value"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+}), Ne = /* @__PURE__ */ A({
+  __name: "_share_radio",
+  props: {
+    modelValue: {},
+    iconTitle: {},
+    options: {}
+  },
+  emits: ["update:modelValue"],
+  setup($, { emit: T }) {
+    const _ = $, i = S(_.modelValue), h = M(() => i.value || ""), R = T, v = () => {
+      R("update:modelValue", h.value || "");
+    };
+    return U(() => i.value, () => {
+      v();
+    }), U(() => _.modelValue, (e) => {
+      i.value = e;
+    }), (e, u) => {
+      const n = F("el-tooltip"), f = F("el-radio-button"), p = F("el-radio-group");
+      return L(), X(p, {
+        modelValue: i.value,
+        "onUpdate:modelValue": u[0] || (u[0] = (b) => i.value = b),
+        class: "flex-wrapper"
+      }, {
+        default: c(() => [
+          (L(!0), q(ae, null, pe($.options, (b) => (L(), X(f, {
+            key: b.value,
+            label: b.label,
+            value: b.value,
+            class: "flex-item"
+          }, {
+            default: c(() => [
+              d(n, {
+                effect: "dark",
+                content: b.value,
+                placement: "top"
+              }, {
+                default: c(() => [
+                  d(V, {
+                    name: `@css-${$.iconTitle ? $.iconTitle + "-" : ""}${s(de)(b.value, "kebab")}`
+                  }, null, 8, ["name"])
+                ]),
+                _: 2
+              }, 1032, ["content"])
+            ]),
+            _: 2
+          }, 1032, ["label", "value"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue"]);
+    };
+  }
+});
+const se = /* @__PURE__ */ j(Ne, [["__scopeId", "data-v-12dcba4d"]]), ze = { class: "flex flexJustify" }, Je = { class: "flex flexJustify" }, Xe = /* @__PURE__ */ A({
+  __name: "_boxShadow",
+  props: {
+    modelValue: {}
+  },
+  emits: ["update:modelValue"],
+  setup($, { emit: T }) {
+    const { switchColor: _ } = ne(), i = le({}), h = $, R = T, v = (n) => {
+      R("update:modelValue", e(n));
+    }, e = (n) => `${n == null ? void 0 : n.color} ${n == null ? void 0 : n.offsetX} ${n == null ? void 0 : n.offsetY} ${n == null ? void 0 : n.blurRadius} ${n == null ? void 0 : n.spreadRadius}`, u = (n) => {
+      const f = n == null ? void 0 : n.split(" "), [p, b, w, k, K] = f || [], C = (N) => Z(N) || N === "undefined" ? "" : N;
+      return {
+        color: C(p),
+        offsetX: C(b),
+        offsetY: C(w),
+        blurRadius: C(k),
+        spreadRadius: C(K)
+      };
+    };
+    return U(i, (n) => {
+      v(n);
+    }), U(() => h.modelValue, (n) => {
+      B(i, u(n));
+    }), (n, f) => (L(), q(ae, null, [
+      d(re, {
+        modelValue: i.color,
+        "onUpdate:modelValue": f[0] || (f[0] = (p) => i.color = p),
+        label: s(m).i18nt("designer.style.boxShadowColor")
+      }, {
+        label: c(() => [
+          d(V, {
+            name: "@css-background-color",
+            color: s(_)(i == null ? void 0 : i.color)
+          }, null, 8, ["color"])
+        ]),
+        _: 1
+      }, 8, ["modelValue", "label"]),
+      a("div", ze, [
+        d(D, {
+          modelValue: i.offsetX,
+          "onUpdate:modelValue": f[1] || (f[1] = (p) => i.offsetX = p),
+          options: s(x)(W),
+          label: s(m).i18nt("designer.style.boxShadowHShadow"),
+          style: { width: "48%" }
+        }, {
+          label: c(() => [
+            d(V, {
+              name: "@css-box-shadow-h-shadow",
+              color: s(_)(i == null ? void 0 : i.offsetX)
+            }, null, 8, ["color"])
+          ]),
+          _: 1
+        }, 8, ["modelValue", "options", "label"]),
+        d(D, {
+          modelValue: i.offsetY,
+          "onUpdate:modelValue": f[2] || (f[2] = (p) => i.offsetY = p),
+          options: s(x)(W),
+          label: s(m).i18nt("designer.style.boxShadowVShadow"),
+          style: { width: "48%" }
+        }, {
+          label: c(() => [
+            d(V, {
+              name: "@css-box-shadow-v-shadow",
+              color: s(_)(i == null ? void 0 : i.offsetY)
+            }, null, 8, ["color"])
+          ]),
+          _: 1
+        }, 8, ["modelValue", "options", "label"])
+      ]),
+      a("div", Je, [
+        d(D, {
+          modelValue: i.blurRadius,
+          "onUpdate:modelValue": f[3] || (f[3] = (p) => i.blurRadius = p),
+          options: s(x)(W),
+          label: s(m).i18nt("designer.style.boxShadowBlur"),
+          style: { width: "48%" }
+        }, {
+          label: c(() => [
+            d(V, {
+              name: "@css-box-shadow-blur",
+              color: s(_)(i.blurRadius)
+            }, null, 8, ["color"])
+          ]),
+          _: 1
+        }, 8, ["modelValue", "options", "label"]),
+        d(D, {
+          modelValue: i.spreadRadius,
+          "onUpdate:modelValue": f[4] || (f[4] = (p) => i.spreadRadius = p),
+          options: s(x)(W),
+          label: s(m).i18nt("designer.style.boxShadowSpread"),
+          style: { width: "48%" }
+        }, {
+          label: c(() => [
+            d(V, {
+              name: "@css-box-shadow-spread",
+              color: s(_)(i.spreadRadius)
+            }, null, 8, ["color"])
+          ]),
+          _: 1
+        }, 8, ["modelValue", "options", "label"])
+      ])
+    ], 64));
+  }
+}), Ye = /* @__PURE__ */ A({
+  __name: "_share_input_switch",
+  props: {
+    modelValue: {},
+    title: {}
+  },
+  emits: ["update:modelValue"],
+  setup($, { emit: T }) {
+    const _ = $, { switchColorClass: i } = ne(), h = S(), R = S(_.modelValue), v = S(), e = T, u = (p) => {
+      e("update:modelValue", p);
+    }, n = () => {
+      var p;
+      h.value = !0, (p = v.value) == null || p.focus();
+    }, f = () => {
+      var p;
+      h.value = !1, (p = v.value) == null || p.blur();
+    };
+    return U(() => R.value, (p) => {
+      u(p);
+    }), U(() => _.modelValue, (p) => {
+      R.value = p;
+    }), (p, b) => {
+      const w = F("el-input");
+      return L(), X(w, {
+        ref_key: "inputRef",
+        ref: v,
+        modelValue: R.value,
+        "onUpdate:modelValue": b[0] || (b[0] = (k) => R.value = k),
+        editable: h.value,
+        onKeyup: be(f, ["enter"]),
+        onBlur: f,
+        placeholder: `${R.value || "0"}`,
+        class: I([h.value ? "" : "readonly", s(i)(R.value)]),
+        onClick: n
+      }, null, 8, ["modelValue", "editable", "placeholder", "class"]);
+    };
+  }
+});
+const Y = /* @__PURE__ */ j(Ye, [["__scopeId", "data-v-c44ac24d"]]), He = {
+  style: { position: "relative" },
+  class: "hl-margin-padding"
+}, Oe = { class: "hl-layout-box hl-margin-box" }, Pe = { class: "hl-inline-input hl-input-h hl-input-top" }, Ge = { class: "hl-inline-input hl-input-v hl-input-right" }, Ze = { class: "hl-inline-input hl-input-h hl-input-bottom" }, qe = { class: "hl-inline-input hl-input-v hl-input-left" }, Qe = { class: "hl-layout-box hl-padding-box" }, je = { class: "hl-inline-input hl-input-h hl-input-top" }, et = { class: "hl-inline-input hl-input-v hl-input-right" }, tt = { class: "hl-inline-input hl-input-h hl-input-bottom" }, ot = { class: "hl-inline-input hl-input-v hl-input-left" }, lt = /* @__PURE__ */ A({
+  __name: "_margin_padding",
+  props: {
+    margin: {},
+    padding: {}
+  },
+  emits: ["update:margin", "update:padding"],
+  setup($, { emit: T }) {
+    const { splitNumericUnit: _ } = We(), i = le({ margin: {}, padding: {} }), h = $, R = T, v = (e, u, n) => {
+      let f = e[u];
+      Z(f) && (f = {});
+      let p = f[n];
+      Z(p) && (p = "0px");
+      const b = _(p);
+      if (!b.valid)
+        return;
+      const w = ((b == null ? void 0 : b.numeric) || 0) + 1, k = b == null ? void 0 : b.unit;
+      B(e, { [u]: { [n]: `${w}${k}` } });
+    };
+    return U(() => i.margin, (e) => {
+      R("update:margin", e);
+    }, { deep: !0 }), U(() => i.padding, (e) => {
+      R("update:padding", e);
+    }, { deep: !0 }), U(() => h.margin, (e) => {
+      B(i, { margin: e });
+    }), U(() => h.padding, (e) => {
+      B(i, { padding: e });
+    }), (e, u) => (L(), q("div", He, [
+      a("div", Oe, [
+        a("div", {
+          class: "hl-handle hl-handle-top hl-handle-top-border",
+          onClick: u[0] || (u[0] = (n) => v(i, "margin", "top"))
+        }, [
+          d(V, { name: "@css-arrow-top" })
+        ]),
+        a("div", Pe, [
+          d(Y, {
+            modelValue: i.margin.top,
+            "onUpdate:modelValue": u[1] || (u[1] = (n) => i.margin.top = n),
+            title: s(m).i18nt("designer.style.marginTop")
+          }, null, 8, ["modelValue", "title"])
+        ]),
+        a("div", {
+          class: "hl-handle hl-handle-right hl-handle-right-border",
+          onClick: u[2] || (u[2] = (n) => v(i, "margin", "right"))
+        }, [
+          d(V, { name: "@css-arrow-right" })
+        ]),
+        a("div", Ge, [
+          d(Y, {
+            modelValue: i.margin.right,
+            "onUpdate:modelValue": u[3] || (u[3] = (n) => i.margin.right = n),
+            title: s(m).i18nt("designer.style.marginRight")
+          }, null, 8, ["modelValue", "title"])
+        ]),
+        a("div", {
+          class: "hl-handle hl-handle-bottom hl-handle-bottom-border",
+          onClick: u[4] || (u[4] = (n) => v(i, "margin", "bottom"))
+        }, [
+          u[16] || (u[16] = a("span", { class: "hl-border-desp" }, "MARGIN", -1)),
+          d(V, { name: "@css-arrow-bottom" })
+        ]),
+        a("div", Ze, [
+          d(Y, {
+            modelValue: i.margin.bottom,
+            "onUpdate:modelValue": u[5] || (u[5] = (n) => i.margin.bottom = n),
+            title: s(m).i18nt("designer.style.marginBottom")
+          }, null, 8, ["modelValue", "title"])
+        ]),
+        a("div", {
+          class: "hl-handle hl-handle-left hl-handle-left-border",
+          onClick: u[6] || (u[6] = (n) => v(i, "margin", "left"))
+        }, [
+          d(V, { name: "@css-arrow-left" })
+        ]),
+        a("div", qe, [
+          d(Y, {
+            modelValue: i.margin.left,
+            "onUpdate:modelValue": u[7] || (u[7] = (n) => i.margin.left = n),
+            title: s(m).i18nt("designer.style.marginLeft")
+          }, null, 8, ["modelValue", "title"])
+        ])
+      ]),
+      a("div", Qe, [
+        a("div", {
+          class: "hl-handle hl-handle-top hl-handle-top-border",
+          onClick: u[8] || (u[8] = (n) => v(i, "padding", "top"))
+        }, [
+          d(V, { name: "@css-arrow-top" })
+        ]),
+        a("div", je, [
+          d(Y, {
+            modelValue: i.padding.top,
+            "onUpdate:modelValue": u[9] || (u[9] = (n) => i.padding.top = n),
+            title: s(m).i18nt("designer.style.paddingTop")
+          }, null, 8, ["modelValue", "title"])
+        ]),
+        a("div", {
+          class: "hl-handle hl-handle-right hl-handle-right-border",
+          onClick: u[10] || (u[10] = (n) => v(i, "padding", "right"))
+        }, [
+          d(V, { name: "@css-arrow-right" })
+        ]),
+        a("div", et, [
+          d(Y, {
+            modelValue: i.padding.right,
+            "onUpdate:modelValue": u[11] || (u[11] = (n) => i.padding.right = n),
+            title: s(m).i18nt("designer.style.paddingRight")
+          }, null, 8, ["modelValue", "title"])
+        ]),
+        a("div", {
+          class: "hl-handle hl-handle-bottom hl-handle-bottom-border",
+          onClick: u[12] || (u[12] = (n) => v(i, "padding", "bottom"))
+        }, [
+          u[17] || (u[17] = a("span", { class: "hl-border-desp" }, "PADDING", -1)),
+          d(V, { name: "@css-arrow-bottom" })
+        ]),
+        a("div", tt, [
+          d(Y, {
+            modelValue: i.padding.bottom,
+            "onUpdate:modelValue": u[13] || (u[13] = (n) => i.padding.bottom = n),
+            title: s(m).i18nt("designer.style.paddingBottom")
+          }, null, 8, ["modelValue", "title"])
+        ]),
+        a("div", {
+          class: "hl-handle hl-handle-left hl-handle-left-border",
+          onClick: u[14] || (u[14] = (n) => v(i, "padding", "left"))
+        }, [
+          d(V, { name: "@css-arrow-left" })
+        ]),
+        a("div", ot, [
+          d(Y, {
+            modelValue: i.padding.left,
+            "onUpdate:modelValue": u[15] || (u[15] = (n) => i.padding.left = n),
+            title: s(m).i18nt("designer.style.paddingLeft")
+          }, null, 8, ["modelValue", "title"])
+        ])
+      ])
+    ]));
+  }
+});
+const nt = /* @__PURE__ */ j(lt, [["__scopeId", "data-v-bc109a82"]]), st = { class: "vs-style-border-style" }, it = { class: "vs-style-border-setter-left-pane" }, dt = { class: "vs-style-border-setter-row" }, rt = { class: "vs-style-border-setter-row" }, at = { class: "vs-style-border-setter-row" }, ut = { class: "vs-style-border-setter-right-pane" }, pt = /* @__PURE__ */ A({
+  __name: "_border",
+  props: {
+    borderWidth: {},
+    borderStyle: {},
+    borderColor: {},
+    borderLeftWidth: {},
+    borderLeftStyle: {},
+    borderLeftColor: {},
+    borderTopWidth: {},
+    borderTopStyle: {},
+    borderTopColor: {},
+    borderBottomWidth: {},
+    borderBottomStyle: {},
+    borderBottomColor: {},
+    borderRightWidth: {},
+    borderRightStyle: {},
+    borderRightColor: {}
+  },
+  emits: [
+    "update:border"
+  ],
+  setup($, { emit: T }) {
+    const { switchColorClass: _ } = ne(), i = [
+      "borderBottom",
+      "borderLeft",
+      "borderRight",
+      "borderTop"
+      /* borderTop */
+    ], h = [
+      "color",
+      "style",
+      "width"
+      /* width */
+    ], R = T, v = $, e = S(
+      "border"
+      /* border */
+    ), u = (o) => {
+      e.value = o;
+    }, n = le({}), f = S(!1), p = (o, t) => de(`${de(o, "kebab")}-${t}`, "camel"), b = (o) => {
+      const t = p(e.value, o);
+      var r = p("border", o);
+      return (n == null ? void 0 : n[t]) || (n == null ? void 0 : n[r]);
+    }, w = (o, t) => {
+      const r = p(e.value, t);
+      ee(r, t, o);
+    }, k = M({
+      get: () => b(
+        "width"
+        /* width */
+      ),
+      set: (o) => {
+        w(
+          o,
+          "width"
+          /* width */
+        );
+      }
+    }), K = M({
+      get: () => b(
+        "style"
+        /* style */
+      ),
+      set: (o) => {
+        w(
+          o,
+          "style"
+          /* style */
+        );
+      }
+    }), C = M({
+      get: () => b(
+        "color"
+        /* color */
+      ),
+      set: (o) => {
+        w(
+          o,
+          "color"
+          /* color */
+        );
+      }
+    }), N = (o) => {
+      const t = H(o);
+      return h.forEach((r) => {
+        const l = p("border", r);
+        t == null || delete t[l];
+      }), t;
+    }, O = (o, t) => {
+      let r = !0, l = null;
+      return i.forEach((y) => {
+        const g = p(y, t);
+        var E = o == null ? void 0 : o[g];
+        r = r && (E == l || l === null), l = E;
+      }), r;
+    }, P = (o) => {
+      let t = H(o);
+      return h.forEach((r) => {
+        if (!O(o, r))
+          return;
+        const l = o == null ? void 0 : o[p("borderLeft", r)], y = p("border", r), g = o == null ? void 0 : o[y];
+        Ve(g) && B(t, { [y]: l });
+      }), t;
+    }, G = (o, t, r, l) => {
+      o === "border" && i.forEach((y) => {
+        const g = p(y, t), E = n[g];
+        (E == l || Z(E)) && B(n, { [g]: r });
+      });
+    }, ee = (o, t, r) => {
+      (n == null ? void 0 : n[o]) != r && (f.value = !0, G(e.value, t, r, n == null ? void 0 : n[o]), B(n, { [o]: r }), R("update:border", N(n)), setTimeout(() => {
+        f.value = !1;
+      }, 1e3));
+    }, te = (o) => {
+      B(n, H(P(o)));
+    };
+    return U(() => v, (o) => {
+      f.value || te(o);
+    }, { deep: !0, immediate: !0 }), (o, t) => {
+      const r = F("el-tooltip");
+      return L(), q("div", st, [
+        a("div", it, [
+          a("div", dt, [
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderLeft"
+                /* borderLeft */
+              }]),
+              onClick: t[0] || (t[0] = (l) => u(
+                "borderLeft"
+                /* borderLeft */
+              ))
+            }, [
+              d(r, {
+                placement: "left",
+                content: s(m).i18nt("designer.style.borderLeft")
+              }, {
+                default: c(() => [...t[8] || (t[8] = [
+                  a("span", null, "┣", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2)
+          ]),
+          a("div", rt, [
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderTop"
+                /* borderTop */
+              }]),
+              onClick: t[1] || (t[1] = (l) => u(
+                "borderTop"
+                /* borderTop */
+              ))
+            }, [
+              d(r, {
+                placement: "top",
+                content: s(m).i18nt("designer.style.borderTop")
+              }, {
+                default: c(() => [...t[9] || (t[9] = [
+                  a("span", null, "┳", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2),
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "border"
+                /* border */
+              }]),
+              onClick: t[2] || (t[2] = (l) => u(
+                "border"
+                /* border */
+              ))
+            }, [
+              d(r, {
+                content: s(m).i18nt("designer.style.border")
+              }, {
+                default: c(() => [...t[10] || (t[10] = [
+                  a("span", null, "╋", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2),
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderBottom"
+                /* borderBottom */
+              }]),
+              onClick: t[3] || (t[3] = (l) => u(
+                "borderBottom"
+                /* borderBottom */
+              ))
+            }, [
+              d(r, {
+                placement: "bottom",
+                content: s(m).i18nt("designer.style.borderBottom")
+              }, {
+                default: c(() => [...t[11] || (t[11] = [
+                  a("span", null, "┻", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2)
+          ]),
+          a("div", at, [
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderRight"
+                /* borderRight */
+              }]),
+              onClick: t[4] || (t[4] = (l) => u(
+                "borderRight"
+                /* borderRight */
+              ))
+            }, [
+              d(r, {
+                placement: "right",
+                content: s(m).i18nt("designer.style.borderRight")
+              }, {
+                default: c(() => [...t[12] || (t[12] = [
+                  a("span", null, "┫", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2)
+          ])
+        ]),
+        a("div", ut, [
+          d(J, {
+            label: s(m).i18nt("designer.style.borderStyle"),
+            color: s(_)(K.value)
+          }, {
+            input: c(() => [
+              d(oe, {
+                options: Re,
+                modelValue: K.value,
+                "onUpdate:modelValue": t[5] || (t[5] = (l) => K.value = l)
+              }, null, 8, ["options", "modelValue"])
+            ]),
+            _: 1
+          }, 8, ["label", "color"]),
+          d(D, {
+            modelValue: k.value,
+            "onUpdate:modelValue": t[6] || (t[6] = (l) => k.value = l),
+            options: s(x)(W),
+            "show-label": !0,
+            label: s(m).i18nt("designer.style.borderWidth"),
+            color: s(_)(k.value)
+          }, null, 8, ["modelValue", "options", "label", "color"]),
+          d(re, {
+            modelValue: C.value,
+            "onUpdate:modelValue": t[7] || (t[7] = (l) => C.value = l),
+            label: s(m).i18nt("designer.style.borderColor"),
+            color: s(_)(C.value)
+          }, null, 8, ["modelValue", "label", "color"])
+        ])
+      ]);
+    };
+  }
+});
+const mt = /* @__PURE__ */ j(pt, [["__scopeId", "data-v-11351887"]]), gt = { class: "vs-style-border-radius" }, ct = { class: "vs-style-border-setter-left-pane" }, bt = { class: "vs-style-border-setter-row" }, ft = { class: "vs-style-border-setter-row" }, vt = { class: "vs-style-border-setter-row" }, yt = { class: "vs-style-border-setter-right-pane" }, Vt = {
+  key: 1,
+  class: "flex flexJustify",
+  style: { margin: "5px 0px" }
+}, ht = /* @__PURE__ */ A({
+  __name: "_border_radius",
+  props: {
+    borderRadius: {},
+    borderTopLeftRadius: {},
+    borderTopRightRadius: {},
+    borderBottomLeftRadius: {},
+    borderBottomRightRadius: {}
+  },
+  emits: [
+    "update:borderRadius"
+  ],
+  setup($, { emit: T }) {
+    const { switchColorClass: _ } = ne();
+    let i = le({});
+    const h = $, R = T;
+    let v = S(!1);
+    const e = S(
+      "borderRadius"
+      /* borderRadius */
+    ), u = [
+      "borderBottomLeftRadius",
+      "borderBottomRightRadius",
+      "borderTopLeftRadius",
+      "borderTopRightRadius"
+      /* borderTopRightRadius */
+    ], n = M({
+      get: () => {
+        const o = e.value;
+        var t = "borderRadius";
+        return (i == null ? void 0 : i[o]) || (i == null ? void 0 : i[t]);
+      },
+      set: (o) => {
+        const t = e.value;
+        w(t, o);
+      }
+    }), f = (o) => {
+      let t = H(o);
+      return B(t, { ["borderRadius"]: P(o) }), t;
+    }, p = (o, t, r) => {
+      o === "borderRadius" && u.forEach((l) => {
+        const y = l, g = i[y];
+        (g == r || Z(g)) && B(i, { [y]: t });
+      });
+    }, b = (o) => {
+      const t = H(o);
+      return t == null || delete t.borderRadius, t;
+    }, w = (o, t) => {
+      (i == null ? void 0 : i[o]) != t && (v.value = !0, p(e.value, t, i == null ? void 0 : i[o]), B(i, { [o]: t }), R("update:borderRadius", b(i)), setTimeout(() => {
+        v.value = !1;
+      }, 1e3));
+    }, k = (o) => {
+      v.value = !1, e.value = o, B(i, { borderRadius: P(i) }), setTimeout(() => {
+        v.value = !0;
+      }, 1e3);
+    }, K = (o) => `${(o == null ? void 0 : o.borderTopLeftRadius) || "0px"} ${(o == null ? void 0 : o.borderTopRightRadius) || "0px"} ${(o == null ? void 0 : o.borderBottomRightRadius) || "0px"} ${(o == null ? void 0 : o.borderBottomLeftRadius) || "0px"}`, C = (o) => {
+      var t = {}, r = !0;
+      if (Z(o) || o === "")
+        return { obj: t, isSame: r };
+      var l = (o == null ? void 0 : o.split(" ")) || [];
+      if (!l || (l == null ? void 0 : l.length) <= 0)
+        return { obj: t, isSame: r };
+      let y, g, E, Q;
+      return (l == null ? void 0 : l.length) === 1 ? y = g = Q = E = l == null ? void 0 : l[0] : (l == null ? void 0 : l.length) == 2 ? (y = g = l == null ? void 0 : l[0], Q = E = l == null ? void 0 : l[1]) : (l == null ? void 0 : l.length) == 4 && (y = l == null ? void 0 : l[0], g = l == null ? void 0 : l[1], E = l == null ? void 0 : l[2], Q = l == null ? void 0 : l[3]), t.borderTopLeftRadius = y, t.borderTopRightRadius = g, t.borderBottomRightRadius = E, t.borderBottomLeftRadius = Q, t.borderRadius = P(t), { obj: t, isSame: O(t) };
+    }, N = (o) => {
+      var t = !0, r = void 0;
+      return o == null || o.forEach((l) => {
+        t = t && (r === void 0 || l === r), Z(l) || (r = l);
+      }), t;
+    }, O = (o) => N([
+      o == null ? void 0 : o.borderTopLeftRadius,
+      o == null ? void 0 : o.borderTopRightRadius,
+      o == null ? void 0 : o.borderBottomRightRadius,
+      o == null ? void 0 : o.borderBottomLeftRadius
+    ]), P = (o) => O(o) ? o == null ? void 0 : o.borderTopLeftRadius : K(o), G = (o) => {
+      var t;
+      return !((t = C(o)) != null && t.isSame);
+    }, ee = M(() => G(n.value)), te = (o) => {
+      B(i, H(f(o)));
+    };
+    return U(() => h, (o) => {
+      v.value || te(o);
+    }, { immediate: !0, deep: !0 }), (o, t) => {
+      const r = F("el-tooltip"), l = F("el-input");
+      return L(), q("div", gt, [
+        a("div", ct, [
+          a("div", bt, [
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderTopLeftRadius"
+                /* borderTopLeftRadius */
+              }]),
+              onClick: t[0] || (t[0] = (y) => k(
+                "borderTopLeftRadius"
+                /* borderTopLeftRadius */
+              ))
+            }, [
+              d(r, {
+                placement: "left-start",
+                content: s(m).i18nt("designer.style.borderRadiusTopLeft")
+              }, {
+                default: c(() => [...t[7] || (t[7] = [
+                  a("span", null, "┏", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2),
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderBottomLeftRadius"
+                /* borderBottomLeftRadius */
+              }]),
+              onClick: t[1] || (t[1] = (y) => k(
+                "borderBottomLeftRadius"
+                /* borderBottomLeftRadius */
+              ))
+            }, [
+              d(r, {
+                placement: "left-end",
+                content: s(m).i18nt("designer.style.borderRadiusBottomLeft")
+              }, {
+                default: c(() => [...t[8] || (t[8] = [
+                  a("span", null, "┗", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2)
+          ]),
+          a("div", ft, [
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderRadius"
+                /* borderRadius */
+              }]),
+              onClick: t[2] || (t[2] = (y) => k(
+                "borderRadius"
+                /* borderRadius */
+              ))
+            }, [
+              d(r, {
+                content: s(m).i18nt("designer.style.borderRadiusAll")
+              }, {
+                default: c(() => [...t[9] || (t[9] = [
+                  a("span", null, "╋", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2)
+          ]),
+          a("div", vt, [
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderTopRightRadius"
+                /* borderTopRightRadius */
+              }]),
+              onClick: t[3] || (t[3] = (y) => k(
+                "borderTopRightRadius"
+                /* borderTopRightRadius */
+              ))
+            }, [
+              d(r, {
+                placement: "right-start",
+                content: s(m).i18nt("designer.style.borderRadiusTopRight")
+              }, {
+                default: c(() => [...t[10] || (t[10] = [
+                  a("span", null, "┓", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2),
+            a("div", {
+              class: I(["vs-style-border-col", {
+                "vs-style-border-selected": e.value === "borderBottomRightRadius"
+                /* borderBottomRightRadius */
+              }]),
+              onClick: t[4] || (t[4] = (y) => k(
+                "borderBottomRightRadius"
+                /* borderBottomRightRadius */
+              ))
+            }, [
+              d(r, {
+                placement: "right-end",
+                content: s(m).i18nt("designer.style.borderRadiusBottomRight")
+              }, {
+                default: c(() => [...t[11] || (t[11] = [
+                  a("span", null, "┛", -1)
+                ])]),
+                _: 1
+              }, 8, ["content"])
+            ], 2)
+          ])
+        ]),
+        a("div", yt, [
+          ee.value ? (L(), q("div", Vt, [
+            a("div", {
+              style: { width: "3em" },
+              class: I([s(_)(n.value)])
+            }, z(s(m).i18nt("designer.style.width")), 3),
+            d(l, {
+              modelValue: n.value,
+              "onUpdate:modelValue": t[6] || (t[6] = (y) => n.value = y),
+              readonly: !0
+            }, null, 8, ["modelValue"])
+          ])) : (L(), X(D, {
+            key: 0,
+            modelValue: n.value,
+            "onUpdate:modelValue": t[5] || (t[5] = (y) => n.value = y),
+            options: s(x)(W),
+            "show-label": !0,
+            label: s(m).i18nt("designer.style.width"),
+            color: s(_)(n.value)
+          }, null, 8, ["modelValue", "options", "label", "color"]))
+        ])
+      ]);
+    };
+  }
+});
+const _t = /* @__PURE__ */ j(ht, [["__scopeId", "data-v-9561dee6"]]), Rt = { class: "custom-divider" }, $t = { class: "flex flexJustify" }, Tt = { style: { width: "48%" } }, kt = { class: "custom-divider" }, wt = { class: "flex flexJustify" }, Ut = { class: "custom-divider" }, xt = { class: "flex flexJustify" }, Bt = { class: "flex flexJustify" }, Lt = { class: "custom-divider" }, St = { class: "custom-divider" }, Ct = { class: "custom-divider" }, Et = A({ componentName: _e.PropertyEditor }), po = /* @__PURE__ */ A({
+  ...Et,
+  __name: "css-editor",
+  props: { ...Ee },
+  setup($) {
+    const T = $, { propValue: _, propName: i, propChanged: h } = Ie(T);
+    let R = S({});
+    const v = S(ue.default), e = le({}), { changeListener: u, switchColor: n, toStateInf: f } = ne(), p = (r) => {
+      var l;
+      t.value = !1, (l = Object.keys(e)) == null || l.forEach((y) => {
+        delete e[y];
+      }), B(e, H(R.value[r])), setTimeout(() => {
+        t.value = !0;
+      }, 1e3);
+    }, b = () => {
+      f(_.value || "").then((r) => {
+        R.value = r, v.value = ue.default, p(v.value), t.value = !0;
+      });
+    }, w = (r) => {
+      B(e, r);
+    }, k = M(() => ({
+      top: e == null ? void 0 : e.marginTop,
+      left: e == null ? void 0 : e.marginLeft,
+      right: e == null ? void 0 : e.marginRight,
+      bottom: e == null ? void 0 : e.marginBottom
+    })), K = M(() => ({
+      top: e == null ? void 0 : e.paddingTop,
+      left: e == null ? void 0 : e.paddingLeft,
+      right: e == null ? void 0 : e.paddingRight,
+      bottom: e == null ? void 0 : e.paddingBottom
+    })), C = (r) => {
+      w({
+        marginTop: r == null ? void 0 : r.top,
+        marginLeft: r == null ? void 0 : r.left,
+        marginRight: r == null ? void 0 : r.right,
+        marginBottom: r == null ? void 0 : r.bottom
+      });
+    }, N = (r) => {
+      w({
+        paddingTop: r == null ? void 0 : r.top,
+        paddingLeft: r == null ? void 0 : r.left,
+        paddingRight: r == null ? void 0 : r.right,
+        paddingBottom: r == null ? void 0 : r.bottom
+      });
+    }, O = (r) => {
+      h(r), G(!1);
+    }, P = () => {
+      G(!1);
+    }, G = (r = !0, l, y, g, E, Q) => {
+      te({
+        attrs: B({
+          props: {
+            optionModel: T.optionModel,
+            propConfig: { ...T.propConfig, ...l },
+            ...g
+          },
+          dialogType: y,
+          visible: r,
+          title: m.i18nt("designer.setting.widgetCss"),
+          name: i.value
+        }, Q),
+        events: {
+          confirm: E || O,
+          cancel: P
+        }
+      });
+    }, { getInstance: ee } = he(), { editHandler: te } = Ae({ ...T, instance: ee() }), o = () => {
+      G(!0, { ...T.propConfig, type: Ce.css }, Se.code, void 0, (r) => {
+        var l = r;
+        f(l).then((y) => {
+          R.value = y, p(v.value), O(l);
+        });
+      });
+    }, t = S(!1);
+    return U(e, (r) => {
+      t.value && (R.value[v.value] = H(r), u(R.value).then((l) => {
+        h(l);
+      }));
+    }, { deep: !0 }), fe(() => {
+      b();
+    }), (r, l) => {
+      const y = F("el-button");
+      return L(), X(Fe, ve(ye(r.$props)), {
+        slotEditor: c(() => [
+          d(De, ie(r.$props, { "prop-config": r.propConfig }), {
+            specialEditor: c(() => [
+              a("div", null, [
+                a("div", Rt, z(s(m).i18nt("designer.style.state")), 1),
+                a("div", $t, [
+                  d(y, {
+                    type: "primary",
+                    onClick: o
+                  }, {
+                    default: c(() => [
+                      me(z(s(m).i18nt("designer.style.codeEdit")), 1)
+                    ]),
+                    _: 1
+                  }),
+                  a("div", Tt, [
+                    d(oe, {
+                      options: $e,
+                      modelValue: v.value,
+                      "onUpdate:modelValue": l[0] || (l[0] = (g) => v.value = g),
+                      onChange: p
+                    }, null, 8, ["options", "modelValue"])
+                  ])
+                ]),
+                a("div", kt, z(s(m).i18nt("designer.style.container")), 1),
+                d(J, {
+                  label: s(m).i18nt("designer.style.display")
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-display",
+                      color: s(n)(e == null ? void 0 : e.display)
+                    }, null, 8, ["color"])
+                  ]),
+                  input: c(() => [
+                    d(se, {
+                      options: s(x)(Te),
+                      "icon-title": "display",
+                      modelValue: e.display,
+                      "onUpdate:modelValue": l[1] || (l[1] = (g) => e.display = g)
+                    }, null, 8, ["options", "modelValue"])
+                  ]),
+                  _: 1
+                }, 8, ["label"]),
+                d(nt, {
+                  margin: k.value,
+                  padding: K.value,
+                  "onUpdate:margin": C,
+                  "onUpdate:padding": N
+                }, null, 8, ["margin", "padding"]),
+                a("div", wt, [
+                  d(D, {
+                    modelValue: e.width,
+                    "onUpdate:modelValue": l[2] || (l[2] = (g) => e.width = g),
+                    options: s(x)(W),
+                    label: s(m).i18nt("designer.style.width")
+                  }, {
+                    label: c(() => [
+                      d(V, {
+                        name: "@css-width",
+                        color: s(n)(e == null ? void 0 : e.width)
+                      }, null, 8, ["color"])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "options", "label"]),
+                  d(D, {
+                    modelValue: e.height,
+                    "onUpdate:modelValue": l[3] || (l[3] = (g) => e.height = g),
+                    options: s(x)(W),
+                    label: s(m).i18nt("designer.style.height")
+                  }, {
+                    label: c(() => [
+                      d(V, {
+                        name: "@css-height",
+                        color: s(n)(e == null ? void 0 : e.height)
+                      }, null, 8, ["color"])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "options", "label"])
+                ]),
+                a("div", Ut, z(s(m).i18nt("designer.style.wordFont")), 1),
+                d(J, {
+                  label: s(m).i18nt("designer.style.fontFamily")
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-font-family",
+                      color: s(n)(e == null ? void 0 : e.fontFamily)
+                    }, null, 8, ["color"])
+                  ]),
+                  input: c(() => [
+                    d(oe, {
+                      options: ke,
+                      modelValue: e.fontFamily,
+                      "onUpdate:modelValue": l[4] || (l[4] = (g) => e.fontFamily = g)
+                    }, null, 8, ["options", "modelValue"])
+                  ]),
+                  _: 1
+                }, 8, ["label"]),
+                d(re, {
+                  modelValue: e.color,
+                  "onUpdate:modelValue": l[5] || (l[5] = (g) => e.color = g),
+                  label: s(m).i18nt("designer.style.color"),
+                  options: { showAlpha: !0 }
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-font-color",
+                      color: s(n)(e == null ? void 0 : e.color)
+                    }, null, 8, ["color"])
+                  ]),
+                  _: 1
+                }, 8, ["modelValue", "label"]),
+                a("div", xt, [
+                  d(J, {
+                    label: s(m).i18nt("designer.style.fontWeight"),
+                    style: { width: "48%" }
+                  }, {
+                    label: c(() => [
+                      d(V, {
+                        name: "@css-font-weight",
+                        color: s(n)(e == null ? void 0 : e.fontWeight)
+                      }, null, 8, ["color"])
+                    ]),
+                    input: c(() => [
+                      d(oe, {
+                        options: s(x)(we),
+                        modelValue: e.fontWeight,
+                        "onUpdate:modelValue": l[6] || (l[6] = (g) => e.fontWeight = g)
+                      }, null, 8, ["options", "modelValue"])
+                    ]),
+                    _: 1
+                  }, 8, ["label"]),
+                  d(J, {
+                    label: s(m).i18nt("designer.style.fontStyle"),
+                    style: { width: "48%" }
+                  }, {
+                    label: c(() => [
+                      d(V, {
+                        name: "@css-font-style",
+                        color: s(n)(e == null ? void 0 : e.fontStyle)
+                      }, null, 8, ["color"])
+                    ]),
+                    input: c(() => [
+                      d(se, {
+                        options: s(x)(Ue),
+                        "icon-title": "font-style",
+                        modelValue: e.fontStyle,
+                        "onUpdate:modelValue": l[7] || (l[7] = (g) => e.fontStyle = g)
+                      }, null, 8, ["options", "modelValue"])
+                    ]),
+                    _: 1
+                  }, 8, ["label"])
+                ]),
+                a("div", Bt, [
+                  d(D, {
+                    modelValue: e.fontSize,
+                    "onUpdate:modelValue": l[8] || (l[8] = (g) => e.fontSize = g),
+                    options: s(x)(W),
+                    label: s(m).i18nt("designer.style.fontSize"),
+                    style: { width: "48%" }
+                  }, {
+                    label: c(() => [
+                      d(V, {
+                        name: "@css-font-size",
+                        color: s(n)(e == null ? void 0 : e.fontSize)
+                      }, null, 8, ["color"])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "options", "label"]),
+                  d(D, {
+                    modelValue: e.lineHeight,
+                    "onUpdate:modelValue": l[9] || (l[9] = (g) => e.lineHeight = g),
+                    options: s(x)(W),
+                    label: s(m).i18nt("designer.style.lineHeight"),
+                    style: { width: "48%" }
+                  }, {
+                    label: c(() => [
+                      d(V, {
+                        name: "@css-line-height",
+                        color: s(n)(e == null ? void 0 : e.lineHeight)
+                      }, null, 8, ["color"])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "options", "label"])
+                ]),
+                d(J, {
+                  label: s(m).i18nt("designer.style.textAlign")
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-text-align",
+                      color: s(n)(e == null ? void 0 : e.textAlign)
+                    }, null, 8, ["color"])
+                  ]),
+                  input: c(() => [
+                    d(se, {
+                      options: s(x)(xe),
+                      "icon-title": "text-align",
+                      modelValue: e.textAlign,
+                      "onUpdate:modelValue": l[10] || (l[10] = (g) => e.textAlign = g)
+                    }, null, 8, ["options", "modelValue"])
+                  ]),
+                  _: 1
+                }, 8, ["label"]),
+                d(J, {
+                  label: s(m).i18nt("designer.style.textDecoration")
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-text-decoration",
+                      color: s(n)(e == null ? void 0 : e.textDecoration)
+                    }, null, 8, ["color"])
+                  ]),
+                  input: c(() => [
+                    d(se, {
+                      options: s(x)(Be),
+                      "icon-title": "text-decoration",
+                      modelValue: e.textDecoration,
+                      "onUpdate:modelValue": l[11] || (l[11] = (g) => e.textDecoration = g)
+                    }, null, 8, ["options", "modelValue"])
+                  ]),
+                  _: 1
+                }, 8, ["label"]),
+                a("div", Lt, z(s(m).i18nt("designer.style.background")), 1),
+                d(re, {
+                  modelValue: e.backgroundColor,
+                  "onUpdate:modelValue": l[12] || (l[12] = (g) => e.backgroundColor = g),
+                  label: s(m).i18nt("designer.style.backgroundColor"),
+                  options: { showAlpha: !0 }
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-background-color",
+                      color: s(n)(e == null ? void 0 : e.backgroundColor)
+                    }, null, 8, ["color"])
+                  ]),
+                  _: 1
+                }, 8, ["modelValue", "label"]),
+                d(Me, {
+                  modelValue: e.backgroundImage,
+                  "onUpdate:modelValue": l[13] || (l[13] = (g) => e.backgroundImage = g),
+                  label: s(m).i18nt("designer.style.backgroundImage")
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-background-image",
+                      color: s(n)(e == null ? void 0 : e.backgroundImage)
+                    }, null, 8, ["color"])
+                  ]),
+                  _: 1
+                }, 8, ["modelValue", "label"]),
+                a("div", St, z(s(m).i18nt("designer.style.border")), 1),
+                d(mt, ie(e, { "onUpdate:border": w }), null, 16),
+                d(_t, ie(e, { "onUpdate:borderRadius": w }), null, 16),
+                a("div", Ct, z(s(m).i18nt("designer.style.effect")), 1),
+                d(D, {
+                  modelValue: e.opacity,
+                  "onUpdate:modelValue": l[14] || (l[14] = (g) => e.opacity = g),
+                  options: [{ value: "%", label: "%" }],
+                  label: s(m).i18nt("designer.style.opacity"),
+                  style: { width: "48%" }
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-line-height",
+                      color: s(n)(e == null ? void 0 : e.opacity)
+                    }, null, 8, ["color"])
+                  ]),
+                  _: 1
+                }, 8, ["modelValue", "label"]),
+                d(J, {
+                  label: s(m).i18nt("designer.style.cursor")
+                }, {
+                  label: c(() => [
+                    d(V, {
+                      name: "@css-cursor",
+                      color: s(n)(e == null ? void 0 : e.cursor)
+                    }, null, 8, ["color"])
+                  ]),
+                  input: c(() => [
+                    d(oe, {
+                      options: s(x)(Le),
+                      modelValue: e.cursor,
+                      "onUpdate:modelValue": l[15] || (l[15] = (g) => e.cursor = g),
+                      "icon-title": "cursor"
+                    }, null, 8, ["options", "modelValue"])
+                  ]),
+                  _: 1
+                }, 8, ["label"]),
+                d(Xe, {
+                  modelValue: e.boxShadow,
+                  "onUpdate:modelValue": l[16] || (l[16] = (g) => e.boxShadow = g)
+                }, null, 8, ["modelValue"])
+              ])
+            ]),
+            _: 1
+          }, 16, ["prop-config"])
+        ]),
+        _: 1
+      }, 16);
+    };
+  }
+});
+export {
+  po as default
+};