@vipl520/dk-ui 1.0.48 → 1.0.50

package/dist/index.mjs

@@ -955,7 +955,7 @@ const groupProps = {
 
 const _hoisted_1$V = { key: 1 };
 const _hoisted_2$I = { class: "collapse-title" };
-const _hoisted_3$v = { class: "_dk-group-handle" };
+const _hoisted_3$w = { class: "_dk-group-handle" };
 const __default__$N = defineComponent({
   name: "DkGroup"
 });
@@ -1259,7 +1259,7 @@ var _sfc_main$1c = /* @__PURE__ */ defineComponent({
                       onEmitEvent: (name, ...args) => emitEvent(name, args, index),
                       "onUpdate:api": ($f) => add$f(index, $f)
                     }, null, 8, ["model-value", "rule", "option", "onUpdate:modelValue", "onEmitEvent", "onUpdate:api"])),
-                    createElementVNode("div", _hoisted_3$v, [
+                    createElementVNode("div", _hoisted_3$w, [
                       createVNode(
                         _component_el_button_group,
                         null,
@@ -1426,7 +1426,7 @@ const tinyEditorProps = {
 
 const _hoisted_1$U = { key: 0 };
 const _hoisted_2$H = { key: 1 };
-const _hoisted_3$u = { class: "text-center" };
+const _hoisted_3$v = { class: "text-center" };
 const __default__$M = defineComponent({
   name: "DkTinyEditor"
 });
@@ -1559,7 +1559,7 @@ var _sfc_main$1b = /* @__PURE__ */ defineComponent({
               "z-index": 1298
             }, {
               footer: withCtx(() => [
-                createElementVNode("div", _hoisted_3$u, [
+                createElementVNode("div", _hoisted_3$v, [
                   createVNode(_component_el_button, {
                     type: "primary",
                     style: { "width": "200px" },
@@ -1788,7 +1788,7 @@ const hotAreaInputProps = {
 
 const _hoisted_1$S = { class: "hot-area-content" };
 const _hoisted_2$G = { class: "hot-area-draggable" };
-const _hoisted_3$t = {
+const _hoisted_3$u = {
   class: "hot-item-content",
   style: { "position": "relative", "width": "100%", "height": "100%", "background": "#0003" }
 };
@@ -1946,7 +1946,7 @@ var _sfc_main$18 = /* @__PURE__ */ defineComponent({
                     default: withCtx(() => [
                       createElementVNode(
                         "div",
-                        _hoisted_3$t,
+                        _hoisted_3$u,
                         toDisplayString(key + 1),
                         1
                         /* TEXT */
@@ -2676,7 +2676,7 @@ const _hoisted_2$D = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$s = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$t = /* @__PURE__ */ createElementVNode(
   "path",
   {
     fill: "#B0B7BD",
@@ -2813,7 +2813,7 @@ var _sfc_main$14 = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("svg", _hoisted_1$O, [
         createElementVNode("g", null, [
           _hoisted_2$D,
-          _hoisted_3$s,
+          _hoisted_3$t,
           _hoisted_4$l,
           createElementVNode(
             "path",
@@ -2861,7 +2861,7 @@ const attachmentProps = {
 
 const _hoisted_1$N = { class: "dk-attachment attachment" };
 const _hoisted_2$C = { class: "attachment-header flex justify-between pt-5px pb-5px" };
-const _hoisted_3$r = { class: "header-form z" };
+const _hoisted_3$s = { class: "header-form z" };
 const _hoisted_4$k = { class: "header-button y" };
 const _hoisted_5$e = /* @__PURE__ */ createElementVNode(
   "i",
@@ -2906,7 +2906,7 @@ const _hoisted_20$1 = { key: 3 };
 const _hoisted_21$1 = { class: "file-name over" };
 const _hoisted_22$1 = { class: "right" };
 const _hoisted_23$1 = { class: "block p-10px" };
-const _hoisted_24$1 = {
+const _hoisted_24 = {
   key: 1,
   style: { "display": "flex", "align-items": "center", "justify-content": "center", "height": "340px" }
 };
@@ -3117,7 +3117,7 @@ var _sfc_main$13 = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", _hoisted_1$N, [
         createCommentVNode(" \u9876\u90E8"),
         createElementVNode("div", _hoisted_2$C, [
-          createElementVNode("div", _hoisted_3$r, [
+          createElementVNode("div", _hoisted_3$s, [
             createVNode(_component_el_input, {
               modelValue: searchFileName.value,
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchFileName.value = $event),
@@ -3406,7 +3406,7 @@ var _sfc_main$13 = /* @__PURE__ */ defineComponent({
               ])
             ])), [
               [_directive_loading, loading.value]
-            ]) : (openBlock(), createElementBlock("div", _hoisted_24$1, [
+            ]) : (openBlock(), createElementBlock("div", _hoisted_24, [
               createVNode(_component_el_empty, { description: "\u6682\u65E0\u6570\u636E" })
             ])),
             (openBlock(), createBlock(_component_dk_form, {
@@ -3544,7 +3544,7 @@ const fileInputProps = {
 
 const _hoisted_1$L = { class: "show m-t-5px" };
 const _hoisted_2$B = { class: "image-error" };
-const _hoisted_3$q = { class: "image-slot" };
+const _hoisted_3$r = { class: "image-slot" };
 const _hoisted_4$j = { class: "no-image" };
 const __default__$C = defineComponent({
   name: "DkFileInput"
@@ -3681,7 +3681,7 @@ var _sfc_main$11 = /* @__PURE__ */ defineComponent({
                         style: { "width": "100%", "height": "100%" }
                       }, {
                         error: withCtx(() => [
-                          createElementVNode("div", _hoisted_3$q, [
+                          createElementVNode("div", _hoisted_3$r, [
                             createElementVNode("div", _hoisted_4$j, [
                               createVNode(_component_el_icon, null, {
                                 default: withCtx(() => [
@@ -3941,7 +3941,7 @@ const fileListInputProps = {
 
 const _hoisted_1$K = { class: "dk-image-list" };
 const _hoisted_2$A = ["onClick"];
-const _hoisted_3$p = { key: 0 };
+const _hoisted_3$q = { key: 0 };
 const __default__$y = defineComponent({
   name: "DkFileListInput"
 });
@@ -4051,7 +4051,7 @@ var _sfc_main$Z = /* @__PURE__ */ defineComponent({
                 128
                 /* KEYED_FRAGMENT */
               )),
-              _ctx.limit > input.value.length && !_ctx.disabled ? (openBlock(), createElementBlock("li", _hoisted_3$p, [
+              _ctx.limit > input.value.length && !_ctx.disabled ? (openBlock(), createElementBlock("li", _hoisted_3$q, [
                 createElementVNode(
                   "div",
                   {
@@ -4313,7 +4313,7 @@ const _hoisted_2$z = {
   class: "text-center",
   style: { "font-size": "12px", "color": "#999" }
 };
-const _hoisted_3$o = { class: "search-icon" };
+const _hoisted_3$p = { class: "search-icon" };
 const __default__$u = defineComponent({
   name: "DkIconContent"
 });
@@ -4527,7 +4527,7 @@ var _sfc_main$V = /* @__PURE__ */ defineComponent({
           _: 1
           /* STABLE */
         }, 8, ["modelValue"]),
-        createElementVNode("div", _hoisted_3$o, [
+        createElementVNode("div", _hoisted_3$p, [
           createVNode(_component_el_input, {
             modelValue: searchIcon.value,
             "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchIcon.value = $event),
@@ -4850,6 +4850,24 @@ const styleInputProps = {
       return {};
     },
     type: Object
+  },
+  isDrawer: {
+    default: false,
+    type: Boolean
+  },
+  drawerProps: {
+    default: () => {
+      return {
+        title: "\u7F16\u8F91\u6837\u5F0F",
+        direction: "rtl",
+        size: "400px"
+      };
+    },
+    type: Object
+  },
+  drawerText: {
+    default: "\u7F16\u8F91\u6837\u5F0F",
+    type: String
   }
 };
 
@@ -4858,6 +4876,7 @@ const _hoisted_2$y = {
   key: 0,
   class: "p-5px"
 };
+const _hoisted_3$o = { key: 1 };
 const __default__$r = defineComponent({
   name: "DkStyleInput"
 });
@@ -4867,6 +4886,7 @@ var _sfc_main$S = /* @__PURE__ */ defineComponent({
   emits: ["update:modelValue"],
   setup(__props, { emit }) {
     const props = __props;
+    const drawer = ref(false);
     const activeNames = ref([0]);
     const values = ref({});
     const loading = ref(true);
@@ -4915,9 +4935,12 @@ var _sfc_main$S = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       const _component_el_collapse_item = resolveComponent("el-collapse-item");
       const _component_el_collapse = resolveComponent("el-collapse");
+      const _component_el_button = resolveComponent("el-button");
+      const _component_el_drawer = resolveComponent("el-drawer");
       return openBlock(), createElementBlock("div", _hoisted_1$G, [
         !loading.value ? (openBlock(), createElementBlock("div", _hoisted_2$y, [
-          createVNode(_component_el_collapse, {
+          !props.isDrawer ? (openBlock(), createBlock(_component_el_collapse, {
+            key: 0,
             modelValue: activeNames.value,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeNames.value = $event)
           }, {
@@ -4955,7 +4978,72 @@ var _sfc_main$S = /* @__PURE__ */ defineComponent({
             ]),
             _: 1
             /* STABLE */
-          }, 8, ["modelValue"])
+          }, 8, ["modelValue"])) : (openBlock(), createElementBlock("div", _hoisted_3$o, [
+            createVNode(_component_el_button, {
+              type: "primary",
+              plain: "",
+              style: { "width": "100%" },
+              onClick: _cache[1] || (_cache[1] = ($event) => drawer.value = true)
+            }, {
+              default: withCtx(() => [
+                createTextVNode(
+                  toDisplayString(props.drawerText),
+                  1
+                  /* TEXT */
+                )
+              ]),
+              _: 1
+              /* STABLE */
+            }),
+            createVNode(_component_el_drawer, mergeProps({
+              modelValue: drawer.value,
+              "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => drawer.value = $event)
+            }, props.drawerProps), {
+              default: withCtx(() => [
+                createVNode(_component_el_collapse, {
+                  modelValue: activeNames.value,
+                  "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => activeNames.value = $event)
+                }, {
+                  default: withCtx(() => [
+                    (openBlock(true), createElementBlock(
+                      Fragment,
+                      null,
+                      renderList(_components.value, (item, key) => {
+                        return openBlock(), createBlock(_component_el_collapse_item, {
+                          key,
+                          title: "",
+                          name: key
+                        }, {
+                          title: withCtx(() => [
+                            createTextVNode(
+                              toDisplayString(item.title),
+                              1
+                              /* TEXT */
+                            )
+                          ]),
+                          default: withCtx(() => [
+                            activeNames.value.includes(key) ? (openBlock(), createBlock(resolveDynamicComponent(item.name), mergeProps({
+                              key: 0,
+                              modelValue: values.value[item.name],
+                              "onUpdate:modelValue": ($event) => values.value[item.name] = $event
+                            }, item.props, { onChange }), null, 16, ["modelValue", "onUpdate:modelValue"])) : createCommentVNode("v-if", true)
+                          ]),
+                          _: 2
+                          /* DYNAMIC */
+                        }, 1032, ["name"]);
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    ))
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["modelValue"])
+              ]),
+              _: 1
+              /* STABLE */
+            }, 16, ["modelValue"])
+          ]))
         ])) : createCommentVNode("v-if", true)
       ]);
     };
@@ -5353,8 +5441,8 @@ const styleBoxInputProps = {
     default: () => ({})
   },
   height: {
-    type: Number,
-    default: 180
+    type: [Number, String],
+    default: "auto"
   },
   help: {
     type: String,
@@ -5478,50 +5566,46 @@ const _hoisted_4$i = { class: "float-right cursor-pointer" };
 const _hoisted_5$d = { class: "name-header-operations" };
 const _hoisted_6$b = { class: "name-header-operations" };
 const _hoisted_7$b = { class: "name-header-operations" };
-const _hoisted_8$9 = ["title"];
-const _hoisted_9$7 = ["onMouseenter"];
-const _hoisted_10$5 = ["onUpdate:modelValue", "onBlur"];
-const _hoisted_11$5 = ["width", "height", "viewBox", "data-link-anchor", "innerHTML"];
-const _hoisted_12$4 = /* @__PURE__ */ createElementVNode(
+const _hoisted_8$9 = ["title", "onClick"];
+const _hoisted_9$7 = ["onUpdate:modelValue", "onBlur"];
+const _hoisted_10$5 = ["width", "height", "viewBox", "data-link-anchor", "innerHTML"];
+const _hoisted_11$5 = /* @__PURE__ */ createElementVNode(
   "div",
   { style: { "position": "absolute", "display": "none", "width": "100%", "height": "100%" } },
   null,
   -1
   /* HOISTED */
 );
-const _hoisted_13$3 = { class: "anchor-wrapper" };
-const _hoisted_14$3 = ["onMousedown"];
-const _hoisted_15$2 = /* @__PURE__ */ createElementVNode(
+const _hoisted_12$4 = { class: "anchor-wrapper" };
+const _hoisted_13$3 = ["onMousedown"];
+const _hoisted_14$3 = /* @__PURE__ */ createElementVNode(
   "span",
   { class: "title" },
   " \u5916\u8FB9\u8DDD ",
   -1
   /* HOISTED */
 );
-const _hoisted_16$2 = { class: "thumnail border" };
-const _hoisted_17$1 = ["title"];
-const _hoisted_18 = ["onMouseenter"];
-const _hoisted_19 = ["onUpdate:modelValue", "onBlur"];
-const _hoisted_20 = ["width", "height", "viewBox", "data-link-anchor", "innerHTML"];
-const _hoisted_21 = { class: "anchor-wrapper" };
-const _hoisted_22 = ["onMousedown"];
-const _hoisted_23 = /* @__PURE__ */ createElementVNode(
+const _hoisted_15$2 = { class: "thumnail border" };
+const _hoisted_16$2 = ["title", "onClick"];
+const _hoisted_17$1 = ["onUpdate:modelValue", "onBlur"];
+const _hoisted_18 = ["width", "height", "viewBox", "data-link-anchor", "innerHTML"];
+const _hoisted_19 = { class: "anchor-wrapper" };
+const _hoisted_20 = ["onMousedown"];
+const _hoisted_21 = /* @__PURE__ */ createElementVNode(
   "span",
   { class: "title" },
   " \u5185\u8FB9\u8DDD ",
   -1
   /* HOISTED */
 );
-const _hoisted_24 = { class: "title" };
-const _hoisted_25 = { class: "content-unit left-0" };
-const _hoisted_26 = /* @__PURE__ */ createElementVNode(
+const _hoisted_22 = { class: "title" };
+const _hoisted_23 = /* @__PURE__ */ createElementVNode(
   "span",
   null,
   " x ",
   -1
   /* HOISTED */
 );
-const _hoisted_27 = { class: "content-unit right-0" };
 const __default__$p = defineComponent({
   name: "DkStyleBoxInput"
 });
@@ -5551,13 +5635,17 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
       width: props.modelValue.width || "",
       height: props.modelValue.height || ""
     });
-    ref(props.height);
-    watch(
-      () => props.height,
-      () => {
-        console.log("height", props.height);
+    const box = ref(null);
+    const { width } = useElementSize(box);
+    const height = computed(() => {
+      console.log("props.height", props.height);
+      if (props.height === "auto") {
+        const h = width.value / 1.8;
+        return h > 300 ? 300 : h;
+      } else {
+        return props.height;
       }
-    );
+    });
     watch(
       () => props.modelValue,
       (newVal, oldVal) => {
@@ -5650,17 +5738,16 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
       stopChangeBound.value = handleMouseUp.bind(event);
       document.addEventListener("mouseup", stopChangeBound.value);
       dragging.value = true;
-      const height2 = props.height;
       const wrapperElement = document.querySelector(".wrapper");
-      const width = wrapperElement ? wrapperElement.offsetWidth : 0;
+      const width2 = wrapperElement ? wrapperElement.offsetWidth : 0;
       const multiples = {
         margin: 0.9,
         padding: 0.9 * 0.7
       };
       const { clientX, clientY } = event;
-      const setCursorAndDimensions = (cursor, left, top, width2, height3) => {
+      const setCursorAndDimensions = (cursor, left, top, width3, height2) => {
         document.body.style.cursor = cursor;
-        Object.assign(positionStyle, { left, top, width: width2, height: height3, display: "block" });
+        Object.assign(positionStyle, { left, top, width: width3, height: height2, display: "block" });
       };
       startPosition.x = clientX;
       startPosition.y = clientY;
@@ -5668,16 +5755,16 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
         setCursorAndDimensions(
           "ew-resize",
           clientX + "px",
-          clientY - height2 * 0.5 * multiples[type] + "px",
+          clientY - height.value * 0.5 * multiples[type] + "px",
           "0.1px",
-          height2 * multiples[type] + "px"
+          height.value * multiples[type] + "px"
         );
       } else {
         setCursorAndDimensions(
           "ns-resize",
-          clientX - width * 0.5 * multiples[type] + "px",
+          clientX - width2 * 0.5 * multiples[type] + "px",
           clientY + "px",
-          width * multiples[type] + "px",
+          width2 * multiples[type] + "px",
           "0.1px"
         );
       }
@@ -5856,9 +5943,11 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
           createElementVNode(
             "div",
             {
+              ref_key: "box",
+              ref: box,
               tabindex: "0",
               class: "wrapper",
-              style: normalizeStyle([{ "margin-top": "10px" }, { height: props.height + "px" }])
+              style: normalizeStyle([{ "margin-top": "10px" }, { height: height.value + "px" }])
             },
             [
               createElementVNode(
@@ -5878,11 +5967,16 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                         return openBlock(), createElementBlock("div", { key }, [
                           createElementVNode("span", {
                             title: item.title,
-                            class: normalizeClass(`anchor-tip-${item.position} value-indicator`)
+                            class: normalizeClass(`anchor-tip-${item.position} value-indicator`),
+                            onClick: ($event) => onDblclick(item.value, key)
                           }, [
-                            createElementVNode("span", {
-                              onMouseenter: ($event) => onDblclick(item.value, key)
-                            }, toDisplayString(getValue(styles[item.value])), 41, _hoisted_9$7)
+                            createElementVNode(
+                              "span",
+                              null,
+                              toDisplayString(getValue(styles[item.value])),
+                              1
+                              /* TEXT */
+                            )
                           ], 10, _hoisted_8$9),
                           withDirectives(createElementVNode("input", {
                             ref_for: true,
@@ -5891,7 +5985,7 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                             "onUpdate:modelValue": ($event) => styles[item.value] = $event,
                             class: normalizeClass("input-box anchor-tip-" + item.position + (showStyles[item.value] ? " show" : "")),
                             onBlur: ($event) => onBlur(item.value)
-                          }, null, 42, _hoisted_10$5), [
+                          }, null, 42, _hoisted_9$7), [
                             [vModelText, styles[item.value]]
                           ]),
                           (openBlock(), createElementBlock("svg", {
@@ -5903,15 +5997,15 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                             style: normalizeStyle(item.svg.style),
                             class: "esm-modal-svg",
                             innerHTML: item.svg.content
-                          }, null, 12, _hoisted_11$5))
+                          }, null, 12, _hoisted_10$5))
                         ]);
                       }),
                       128
                       /* KEYED_FRAGMENT */
                     ))
                   ]),
-                  _hoisted_12$4,
-                  createElementVNode("div", _hoisted_13$3, [
+                  _hoisted_11$5,
+                  createElementVNode("div", _hoisted_12$4, [
                     (openBlock(), createElementBlock(
                       Fragment,
                       null,
@@ -5922,16 +6016,16 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                           onMousemove: handleMouseMove,
                           onMousedown: ($event) => handleMouseDown("margin", item, $event),
                           onMouseup: handleMouseUp
-                        }, null, 42, _hoisted_14$3);
+                        }, null, 42, _hoisted_13$3);
                       }),
                       64
                       /* STABLE_FRAGMENT */
                     ))
                   ]),
-                  _hoisted_15$2,
+                  _hoisted_14$3,
                   createCommentVNode("\u5916\u8FB9\u8DDD Margin END"),
                   createCommentVNode("\u5185\u8FB9\u8DDD Padding"),
-                  createElementVNode("div", _hoisted_16$2, [
+                  createElementVNode("div", _hoisted_15$2, [
                     createElementVNode(
                       "div",
                       {
@@ -5948,12 +6042,17 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                               return openBlock(), createElementBlock("div", { key }, [
                                 createElementVNode("span", {
                                   title: item.title,
-                                  class: normalizeClass(`anchor-tip-${item.position} value-indicator`)
+                                  class: normalizeClass(`anchor-tip-${item.position} value-indicator`),
+                                  onClick: ($event) => onDblclick(item.value, key + 4)
                                 }, [
-                                  createElementVNode("span", {
-                                    onMouseenter: ($event) => onDblclick(item.value, key + 4)
-                                  }, toDisplayString(getValue(styles[item.value])), 41, _hoisted_18)
-                                ], 10, _hoisted_17$1),
+                                  createElementVNode(
+                                    "span",
+                                    null,
+                                    toDisplayString(getValue(styles[item.value])),
+                                    1
+                                    /* TEXT */
+                                  )
+                                ], 10, _hoisted_16$2),
                                 withDirectives(createElementVNode("input", {
                                   ref_for: true,
                                   ref_key: "inputField",
@@ -5961,7 +6060,7 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                                   "onUpdate:modelValue": ($event) => styles[item.value] = $event,
                                   class: normalizeClass("input-box anchor-tip-" + item.position + (showStyles[item.value] ? " show" : "")),
                                   onBlur: ($event) => onBlur(item.value)
-                                }, null, 42, _hoisted_19), [
+                                }, null, 42, _hoisted_17$1), [
                                   [vModelText, styles[item.value]]
                                 ]),
                                 (openBlock(), createElementBlock("svg", {
@@ -5973,14 +6072,14 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                                   style: normalizeStyle(item.svg.style),
                                   class: "esm-modal-svg",
                                   innerHTML: item.svg.content
-                                }, null, 12, _hoisted_20))
+                                }, null, 12, _hoisted_18))
                               ]);
                             }),
                             128
                             /* KEYED_FRAGMENT */
                           ))
                         ]),
-                        createElementVNode("div", _hoisted_21, [
+                        createElementVNode("div", _hoisted_19, [
                           (openBlock(), createElementBlock(
                             Fragment,
                             null,
@@ -5991,13 +6090,13 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                                 onMousemove: handleMouseMove,
                                 onMousedown: ($event) => handleMouseDown("padding", item, $event),
                                 onMouseup: handleMouseUp
-                              }, null, 42, _hoisted_22);
+                              }, null, 42, _hoisted_20);
                             }),
                             64
                             /* STABLE_FRAGMENT */
                           ))
                         ]),
-                        _hoisted_23,
+                        _hoisted_21,
                         createCommentVNode("\u5185\u8FB9\u8DDD END"),
                         createElementVNode(
                           "div",
@@ -6007,16 +6106,17 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                             onMouseleave: _cache[10] || (_cache[10] = ($event) => onMouseMove("widthHeight", "leave", $event))
                           },
                           [
-                            createElementVNode("span", _hoisted_24, [
-                              createElementVNode("span", _hoisted_25, [
+                            createElementVNode("span", _hoisted_22, [
+                              createElementVNode("span", {
+                                class: "content-unit left-0",
+                                onClick: _cache[3] || (_cache[3] = ($event) => onDblclick("width", 9))
+                              }, [
                                 createElementVNode(
                                   "em",
-                                  {
-                                    onMouseenter: _cache[3] || (_cache[3] = ($event) => onDblclick("width", 9))
-                                  },
+                                  null,
                                   toDisplayString(getValue(styles["width"])),
-                                  33
-                                  /* TEXT, HYDRATE_EVENTS */
+                                  1
+                                  /* TEXT */
                                 )
                               ]),
                               withDirectives(createElementVNode(
@@ -6034,16 +6134,17 @@ var _sfc_main$Q = /* @__PURE__ */ defineComponent({
                               ), [
                                 [vModelText, styles.width]
                               ]),
-                              _hoisted_26,
-                              createElementVNode("span", _hoisted_27, [
+                              _hoisted_23,
+                              createElementVNode("span", {
+                                class: "content-unit right-0",
+                                onClick: _cache[6] || (_cache[6] = ($event) => onDblclick("height", 9))
+                              }, [
                                 createElementVNode(
                                   "em",
-                                  {
-                                    onMouseenter: _cache[6] || (_cache[6] = ($event) => onDblclick("height", 9))
-                                  },
+                                  null,
                                   toDisplayString(getValue(styles["height"])),
-                                  33
-                                  /* TEXT, HYDRATE_EVENTS */
+                                  1
+                                  /* TEXT */
                                 )
                               ]),
                               withDirectives(createElementVNode(

package/dist/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "http://json.schemastore.org/web-types",
   "framework": "vue",
   "name": "dk",
-  "version": "1.0.47",
+  "version": "1.0.49",
   "js-types-syntax": "typescript",
   "description-markup": "markdown",
   "contributions": {

package/es/style-box-input/index.d.ts

@@ -4,8 +4,8 @@ export declare const StyleBoxInput: import("@vipl520/utils").WithInstall<import(
         default: () => {};
     };
     height: {
-        type: NumberConstructor;
-        default: number;
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
     };
     help: {
         type: StringConstructor;
@@ -17,8 +17,8 @@ export declare const StyleBoxInput: import("@vipl520/utils").WithInstall<import(
         default: () => {};
     };
     height: {
-        type: NumberConstructor;
-        default: number;
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
     };
     help: {
         type: StringConstructor;
@@ -29,7 +29,7 @@ export declare const StyleBoxInput: import("@vipl520/utils").WithInstall<import(
     onChange?: ((...args: any[]) => any) | undefined;
 }, {
     modelValue: Record<string, any>;
-    height: number;
+    height: string | number;
     help: string;
 }, {}>>;
 export default StyleBoxInput;