@vipl520/dk-ui 1.0.13 → 1.0.15

package/dist/index.mjs

@@ -9866,7 +9866,7 @@ const groupProps = {
 
 const _hoisted_1$Q = { key: 1 };
 const _hoisted_2$C = { class: "collapse-title" };
-const _hoisted_3$p = { class: "_dk-group-handle" };
+const _hoisted_3$q = { class: "_dk-group-handle" };
 const __default__$I = defineComponent({
   name: "DkGroup"
 });
@@ -10177,7 +10177,7 @@ var _sfc_main$15 = /* @__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$p, [
+                    createElementVNode("div", _hoisted_3$q, [
                       createVNode(
                         _component_el_button_group,
                         null,
@@ -10344,7 +10344,7 @@ const tinyEditorProps = {
 
 const _hoisted_1$P = { key: 0 };
 const _hoisted_2$B = { key: 1 };
-const _hoisted_3$o = { class: "text-center" };
+const _hoisted_3$p = { class: "text-center" };
 const __default__$H = defineComponent({
   name: "DkTinyEditor"
 });
@@ -10475,7 +10475,7 @@ var _sfc_main$14 = /* @__PURE__ */ defineComponent({
               width: "900px"
             }, {
               footer: withCtx(() => [
-                createElementVNode("div", _hoisted_3$o, [
+                createElementVNode("div", _hoisted_3$p, [
                   createVNode(_component_el_button, {
                     type: "primary",
                     style: { "width": "200px" },
@@ -10704,7 +10704,7 @@ const hotAreaInputProps = {
 
 const _hoisted_1$N = { class: "hot-area-content" };
 const _hoisted_2$A = { class: "hot-area-draggable" };
-const _hoisted_3$n = {
+const _hoisted_3$o = {
   class: "hot-item-content",
   style: { "position": "relative", "width": "100%", "height": "100%", "background": "#0003" }
 };
@@ -10861,7 +10861,7 @@ var _sfc_main$11 = /* @__PURE__ */ defineComponent({
                     default: withCtx(() => [
                       createElementVNode(
                         "div",
-                        _hoisted_3$n,
+                        _hoisted_3$o,
                         toDisplayString(key + 1),
                         1
                         /* TEXT */
@@ -11585,7 +11585,7 @@ const _hoisted_2$x = /* @__PURE__ */ createElementVNode(
   -1
   /* HOISTED */
 );
-const _hoisted_3$m = /* @__PURE__ */ createElementVNode(
+const _hoisted_3$n = /* @__PURE__ */ createElementVNode(
   "path",
   {
     fill: "#B0B7BD",
@@ -11722,7 +11722,7 @@ var _sfc_main$Z = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("svg", _hoisted_1$J, [
         createElementVNode("g", null, [
           _hoisted_2$x,
-          _hoisted_3$m,
+          _hoisted_3$n,
           _hoisted_4$i,
           createElementVNode(
             "path",
@@ -11770,7 +11770,7 @@ const attachmentProps = {
 
 const _hoisted_1$I = { class: "dk-attachment attachment" };
 const _hoisted_2$w = { class: "attachment-header flex justify-between pt-5px pb-5px" };
-const _hoisted_3$l = { class: "header-form z" };
+const _hoisted_3$m = { class: "header-form z" };
 const _hoisted_4$h = { class: "header-button y" };
 const _hoisted_5$c = /* @__PURE__ */ createElementVNode(
   "i",
@@ -12026,7 +12026,7 @@ var _sfc_main$Y = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", _hoisted_1$I, [
         createCommentVNode(" \u9876\u90E8"),
         createElementVNode("div", _hoisted_2$w, [
-          createElementVNode("div", _hoisted_3$l, [
+          createElementVNode("div", _hoisted_3$m, [
             createVNode(_component_el_input, {
               modelValue: searchFileName.value,
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchFileName.value = $event),
@@ -12448,7 +12448,7 @@ const fileInputProps = {
 
 const _hoisted_1$G = { class: "show m-t-5px" };
 const _hoisted_2$v = { class: "image-error" };
-const _hoisted_3$k = { class: "image-slot" };
+const _hoisted_3$l = { class: "image-slot" };
 const _hoisted_4$g = { class: "no-image" };
 const __default__$x = defineComponent({
   name: "DkFileInput"
@@ -12585,7 +12585,7 @@ var _sfc_main$W = /* @__PURE__ */ defineComponent({
                         style: { "width": "100%", "height": "100%" }
                       }, {
                         error: withCtx(() => [
-                          createElementVNode("div", _hoisted_3$k, [
+                          createElementVNode("div", _hoisted_3$l, [
                             createElementVNode("div", _hoisted_4$g, [
                               createVNode(_component_el_icon, null, {
                                 default: withCtx(() => [
@@ -12845,7 +12845,7 @@ const fileListInputProps = {
 
 const _hoisted_1$F = { class: "dk-image-list" };
 const _hoisted_2$u = ["onClick"];
-const _hoisted_3$j = { key: 0 };
+const _hoisted_3$k = { key: 0 };
 const __default__$t = defineComponent({
   name: "DkFileListInput"
 });
@@ -12955,7 +12955,7 @@ var _sfc_main$S = /* @__PURE__ */ defineComponent({
                 128
                 /* KEYED_FRAGMENT */
               )),
-              _ctx.limit > input.value.length && !_ctx.disabled ? (openBlock(), createElementBlock("li", _hoisted_3$j, [
+              _ctx.limit > input.value.length && !_ctx.disabled ? (openBlock(), createElementBlock("li", _hoisted_3$k, [
                 createElementVNode(
                   "div",
                   {
@@ -13217,7 +13217,7 @@ const _hoisted_2$t = {
   class: "text-center",
   style: { "font-size": "12px", "color": "#999" }
 };
-const _hoisted_3$i = { class: "search-icon" };
+const _hoisted_3$j = { class: "search-icon" };
 const __default__$p = defineComponent({
   name: "DkIconContent"
 });
@@ -13431,7 +13431,7 @@ var _sfc_main$O = /* @__PURE__ */ defineComponent({
           _: 1
           /* STABLE */
         }, 8, ["modelValue"]),
-        createElementVNode("div", _hoisted_3$i, [
+        createElementVNode("div", _hoisted_3$j, [
           createVNode(_component_el_input, {
             modelValue: searchIcon.value,
             "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchIcon.value = $event),
@@ -14366,7 +14366,7 @@ const paddings = [
 
 const _hoisted_1$z = { class: "dk-style-box-input" };
 const _hoisted_2$r = { class: "header" };
-const _hoisted_3$h = { class: "items-center" };
+const _hoisted_3$i = { class: "items-center" };
 const _hoisted_4$f = { class: "float-right cursor-pointer" };
 const _hoisted_5$b = { class: "name-header-operations" };
 const _hoisted_6$8 = { class: "name-header-operations" };
@@ -14665,7 +14665,7 @@ var _sfc_main$J = /* @__PURE__ */ defineComponent({
           /* STYLE */
         ),
         createElementVNode("div", _hoisted_2$r, [
-          createElementVNode("label", _hoisted_3$h, [
+          createElementVNode("label", _hoisted_3$i, [
             createTextVNode(" \u5185\u5916\u8FB9\u8DDD | \u9AD8\u5BBD "),
             createVNode(_component_el_popover, {
               ref: "popover",
@@ -14982,7 +14982,7 @@ const styleFontInputProps = {
 
 const _hoisted_1$y = { class: "dk-style-font-input" };
 const _hoisted_2$q = { style: { "display": "flex", "flex-flow": "row wrap" } };
-const _hoisted_3$g = { class: "m-b-5px" };
+const _hoisted_3$h = { class: "m-b-5px" };
 const _hoisted_4$e = {
   style: { "width": "100px" },
   class: "m-b-5px"
@@ -15096,7 +15096,7 @@ var _sfc_main$I = /* @__PURE__ */ defineComponent({
               }, 8, ["disabled"])
             ]),
             default: withCtx(() => [
-              createElementVNode("div", _hoisted_3$g, [
+              createElementVNode("div", _hoisted_3$h, [
                 createVNode(_component_el_color_picker, {
                   modelValue: styles.color,
                   "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => styles.color = $event)
@@ -15445,6 +15445,7 @@ const _hoisted_2$p = {
   style: { "width": "100%" },
   class: "m-l-20px"
 };
+const _hoisted_3$g = { style: { "display": "flex" } };
 const __default__$i = defineComponent({
   name: "DkStyleBorderInput"
 });
@@ -15676,51 +15677,54 @@ var _sfc_main$H = /* @__PURE__ */ defineComponent({
                     }, 8, ["disabled"])
                   ]),
                   default: withCtx(() => [
-                    createVNode(_component_el_slider, {
-                      modelValue: form[position.value].borderWidth,
-                      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => form[position.value].borderWidth = $event),
-                      class: "dk-border-slider",
-                      max: 50,
-                      onChange: _cache[2] || (_cache[2] = ($event) => clearOtherBorder())
-                    }, null, 8, ["modelValue"]),
-                    createVNode(_component_el_input, {
-                      modelValue: form[position.value].borderWidth,
-                      "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => form[position.value].borderWidth = $event),
-                      class: "dk-border-input",
-                      type: "number",
-                      onChange: _cache[6] || (_cache[6] = ($event) => clearOtherBorder())
-                    }, {
-                      append: withCtx(() => [
-                        createVNode(_component_el_select, {
-                          modelValue: form[position.value].unit,
-                          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => form[position.value].unit = $event),
-                          placeholder: "\u8BF7\u9009\u62E9",
-                          class: "dk-border-select",
-                          "suffix-icon": "",
-                          onChange: _cache[4] || (_cache[4] = ($event) => clearOtherBorder())
-                        }, {
-                          default: withCtx(() => [
-                            (openBlock(), createElementBlock(
-                              Fragment,
-                              null,
-                              renderList(units, (item) => {
-                                return createVNode(_component_el_option, {
-                                  key: item,
-                                  label: item,
-                                  value: item
-                                }, null, 8, ["label", "value"]);
-                              }),
-                              64
-                              /* STABLE_FRAGMENT */
-                            ))
-                          ]),
-                          _: 1
-                          /* STABLE */
-                        }, 8, ["modelValue"])
-                      ]),
-                      _: 1
-                      /* STABLE */
-                    }, 8, ["modelValue"])
+                    createElementVNode("div", _hoisted_3$g, [
+                      createVNode(_component_el_slider, {
+                        modelValue: form[position.value].borderWidth,
+                        "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => form[position.value].borderWidth = $event),
+                        class: "dk-border-slider",
+                        max: 50,
+                        onChange: _cache[2] || (_cache[2] = ($event) => clearOtherBorder())
+                      }, null, 8, ["modelValue"]),
+                      createVNode(_component_el_input, {
+                        modelValue: form[position.value].borderWidth,
+                        "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => form[position.value].borderWidth = $event),
+                        class: "dk-border-input",
+                        type: "number",
+                        onChange: _cache[6] || (_cache[6] = ($event) => clearOtherBorder())
+                      }, {
+                        append: withCtx(() => [
+                          createVNode(_component_el_select, {
+                            modelValue: form[position.value].unit,
+                            "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => form[position.value].unit = $event),
+                            placeholder: "\u8BF7\u9009\u62E9",
+                            class: "dk-border-select",
+                            style: { "width": "50px" },
+                            "suffix-icon": "",
+                            onChange: _cache[4] || (_cache[4] = ($event) => clearOtherBorder())
+                          }, {
+                            default: withCtx(() => [
+                              (openBlock(), createElementBlock(
+                                Fragment,
+                                null,
+                                renderList(units, (item) => {
+                                  return createVNode(_component_el_option, {
+                                    key: item,
+                                    label: item,
+                                    value: item
+                                  }, null, 8, ["label", "value"]);
+                                }),
+                                64
+                                /* STABLE_FRAGMENT */
+                              ))
+                            ]),
+                            _: 1
+                            /* STABLE */
+                          }, 8, ["modelValue"])
+                        ]),
+                        _: 1
+                        /* STABLE */
+                      }, 8, ["modelValue"])
+                    ])
                   ]),
                   _: 1
                   /* STABLE */
@@ -16012,13 +16016,14 @@ var _sfc_main$F = /* @__PURE__ */ defineComponent({
       return shadows.value.join(",");
     });
     watch(boxShadow, (n, o) => {
-      emit("update:modelValue", { boxShadow });
+      emit("update:modelValue", { boxShadow: boxShadow.value });
     });
     watch(
       () => props.modelValue,
       () => {
         init();
-      }
+      },
+      { deep: true }
     );
     onMounted(() => {
       init();
@@ -17872,7 +17877,8 @@ var _sfc_main$B = /* @__PURE__ */ defineComponent({
     const cache = JSON.parse(storage.get(key) || "{}");
     const form = ref({
       showLine: cache.showLine || false,
-      margin: cache.margin || 0
+      margin: cache.margin || 0,
+      preview: cache.preview || false
     });
     const changeForm = () => {
       storage.set(key, JSON.stringify(form.value));
@@ -17894,13 +17900,23 @@ var _sfc_main$B = /* @__PURE__ */ defineComponent({
       });
     };
     const _style = computed(() => {
-      let line = {};
-      if (form.value.showLine) {
+      let line = {
+        "--padding": "0",
+        "--overflow": "initial"
+      };
+      if (form.value.showLine && !form.value.preview) {
         line = {
           "--margin": form.value.margin + "px",
           "--showDashed": "1px"
         };
       }
+      if (form.value.preview) {
+        line["--padding"] = "0";
+        line["--overflow"] = "hidden";
+      } else {
+        line["--padding"] = "2px 0";
+        line["--overflow"] = "initial";
+      }
       return {
         ...props.pageConfig.style,
         ...line
@@ -18029,12 +18045,23 @@ var _sfc_main$B = /* @__PURE__ */ defineComponent({
                           min: 0,
                           step: 1,
                           "show-stops": "",
-                          max: 10,
+                          max: 20,
                           onChange: _cache[5] || (_cache[5] = ($event) => changeForm())
                         }, null, 8, ["modelValue"])
                       ]),
                       _: 1
                       /* STABLE */
+                    }),
+                    createVNode(_component_el_form_item, { label: "\u6548\u679C\u9884\u89C8" }, {
+                      default: withCtx(() => [
+                        createVNode(_component_el_switch, {
+                          modelValue: form.value.preview,
+                          "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => form.value.preview = $event),
+                          onChange: _cache[7] || (_cache[7] = ($event) => changeForm())
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                      /* STABLE */
                     })
                   ]),
                   _: 1
@@ -20739,7 +20766,7 @@ var DkMinBlank$1 = {
     return {
       type: name$2,
       props: {
-        height: "20"
+        height: 20
       },
       showStyle: true
     };
@@ -20977,6 +21004,14 @@ const pageDiyProps = {
   loading: {
     type: Boolean,
     default: void 0
+  },
+  rightAsideWidth: {
+    type: String,
+    default: "300px"
+  },
+  leftAsideWidth: {
+    type: String,
+    default: "285px"
   }
   // 'menu', 'height', 'config', 'mask', 'locale', 'loading'
 };
@@ -21204,8 +21239,8 @@ const _sfc_main$x = {
   name: 'DkMinBlank',
   props: {
     height: {
-      default: '',
-      type: String,
+      default: 20,
+      type: [String, Number],
     },
   },
   data() {
@@ -21345,7 +21380,8 @@ function _sfc_render$g(_ctx, _cache, $props, $setup, $data, $options) {
       ? (openBlock(), createElementBlock("img", {
           key: 0,
           src: $props.hotData.background,
-          alt: ""
+          alt: "",
+          style: {"width":"100%"}
         }, null, 8 /* PROPS */, _hoisted_2$i))
       : (openBlock(), createBlock(_component_el_empty, {
           key: 1,
@@ -22637,12 +22673,12 @@ const _sfc_main$g = defineComponent({
       stopChangeBound: null,
       rightAside: {
         style: {
-          width: '300px',
+          width: props.rightAsideWidth,
         },
         hide: false,
       },
       leftAside: {
-        style: { width: '285px' },
+        style: { width: props.leftAsideWidth },
         hide: false,
       },
       treeAside: {
@@ -23936,6 +23972,7 @@ const _sfc_main$e = defineComponent({
 
     const keys = {};
     if (ctx.$slots.default) {
+      // 这里报错 Unhandled error during execution of render function
       const children = ctx.$slots.default();
       children.forEach((v) => {
         if (v.key) {
@@ -30900,7 +30937,7 @@ var _sfc_main$8 = /* @__PURE__ */ defineComponent({
       }, { ...props }, {
         "remote-method": remoteMethod,
         remote: "",
-        placeholder: "c\u6D4B\u8BD5",
+        placeholder: "\u8BF7\u9009\u62E9",
         options: internalOptions.value,
         style: { "width": "100%" },
         onChange: handleChange,

package/dist/web-types.json

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

package/es/hot-area-input/style/index.scss

@@ -1,6 +1,5 @@
 /* stylelint-disable */
 .dk-hot-area-input {
-
 }
 .hot-area-content {
   display: flex;

package/es/page-diy/index.d.ts

@@ -23,6 +23,14 @@ export declare const PageDiy: import("@vipl520/utils").WithInstall<import("vue")
         type: BooleanConstructor;
         default: undefined;
     };
+    rightAsideWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    leftAsideWidth: {
+        type: StringConstructor;
+        default: string;
+    };
 }, {
     countObj: import("vue").ComputedRef<{}>;
     diyTree: import("vue").ComputedRef<any[]>;
@@ -270,6 +278,14 @@ export declare const PageDiy: import("@vipl520/utils").WithInstall<import("vue")
         type: BooleanConstructor;
         default: undefined;
     };
+    rightAsideWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    leftAsideWidth: {
+        type: StringConstructor;
+        default: string;
+    };
 }>>, {
     type: string;
     config: Record<string, any>;
@@ -277,6 +293,8 @@ export declare const PageDiy: import("@vipl520/utils").WithInstall<import("vue")
     menu: Record<string, any>;
     mask: string;
     height: string;
+    rightAsideWidth: string;
+    leftAsideWidth: string;
 }, {}>>;
 export default PageDiy;
 export * from './src/props';

package/es/page-diy/src/components/DragBox.vue.mjs

@@ -16,6 +16,7 @@ const _sfc_main = defineComponent({
 
     const keys = {};
     if (ctx.$slots.default) {
+      // 这里报错 Unhandled error during execution of render function
       const children = ctx.$slots.default();
       children.forEach((v) => {
         if (v.key) {

package/es/page-diy/src/components/DragBox.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DragBox.vue.mjs","sources":["../../../../src/page-diy/src/components/DragBox.vue"],"sourcesContent":["<script>\nimport { h, defineComponent } from 'vue'\nimport draggable from 'vuedraggable/src/vuedraggable'\n\nexport default defineComponent({\n  name: 'DragBox',\n  props: ['rule', 'tag', 'formCreateInject'],\n  render(ctx) {\n    const subRule = { ...ctx.$props.rule.props, ...ctx.$attrs }\n    let _class = ctx.tag + '-drag drag-box'\n    if (!Object.keys(ctx.$slots).length) {\n      _class += ' ' + ctx.tag + '-holder'\n    }\n    subRule.class = _class\n    subRule.modelValue = [...this.$props.formCreateInject.children]\n\n    const keys = {}\n    if (ctx.$slots.default) {\n      const children = ctx.$slots.default()\n      children.forEach((v) => {\n        if (v.key) {\n          keys[v.key] = v\n        }\n      })\n    }\n\n    return h(draggable, subRule, {\n      item: ({ element }) => {\n        return h('div', {}, keys[element.__fc__.key + 'fc'])\n      },\n    })\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;AAIA,MAAK,SAAU,GAAG,eAAa,CAAA;AAC7B,EAAA,IAAI,EAAE,SAAS;AACf,EAAA,KAAK,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,kBAAkB,CAAC;EAC1C,MAAM,CAAC,GAAG,EAAE;IACV,MAAM,OAAM,GAAI,EAAE,GAAG,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,GAAG,CAAC,MAAO,GAAA;AAC1D,IAAA,IAAI,MAAK,GAAI,GAAG,CAAC,GAAI,GAAE,iBAAe;AACtC,IAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE;MACnC,MAAK,IAAK,GAAI,GAAE,GAAG,CAAC,GAAE,GAAI,UAAQ;AACpC,KAAA;AACA,IAAA,OAAO,CAAC,KAAM,GAAE,OAAK;IACrB,OAAO,CAAC,UAAS,GAAI,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAA;;IAE9D,MAAM,IAAK,GAAE,GAAC;IACd,IAAI,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE;AACtB,MAAA,MAAM,QAAO,GAAI,GAAG,CAAC,MAAM,CAAC,OAAO,GAAC;MACpC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;AACtB,QAAA,IAAI,CAAC,CAAC,GAAG,EAAE;UACT,IAAI,CAAC,CAAC,CAAC,GAAG,CAAA,GAAI,EAAA;AAChB,SAAA;OACD,EAAA;AACH,KAAA;;IAEA,OAAO,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE;AAC3B,MAAA,IAAI,EAAE,CAAC,EAAE,OAAM,EAAG,KAAK;QACrB,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAI,GAAE,IAAI,CAAC,CAAA;OACpD;KACF,CAAA;GACF;AACH,CAAC,EAAA;;;;;"}
+{"version":3,"file":"DragBox.vue.mjs","sources":["../../../../src/page-diy/src/components/DragBox.vue"],"sourcesContent":["<script>\nimport { h, defineComponent } from 'vue'\nimport draggable from 'vuedraggable/src/vuedraggable'\n\nexport default defineComponent({\n  name: 'DragBox',\n  props: ['rule', 'tag', 'formCreateInject'],\n  render(ctx) {\n    const subRule = { ...ctx.$props.rule.props, ...ctx.$attrs }\n    let _class = ctx.tag + '-drag drag-box'\n    if (!Object.keys(ctx.$slots).length) {\n      _class += ' ' + ctx.tag + '-holder'\n    }\n    subRule.class = _class\n    subRule.modelValue = [...this.$props.formCreateInject.children]\n\n    const keys = {}\n    if (ctx.$slots.default) {\n      // 这里报错 Unhandled error during execution of render function\n      const children = ctx.$slots.default()\n      children.forEach((v) => {\n        if (v.key) {\n          keys[v.key] = v\n        }\n      })\n    }\n\n    return h(draggable, subRule, {\n      item: ({ element }) => {\n        return h('div', {}, keys[element.__fc__.key + 'fc'])\n      },\n    })\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;AAIA,MAAK,SAAU,GAAG,eAAa,CAAA;AAC7B,EAAA,IAAI,EAAE,SAAS;AACf,EAAA,KAAK,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,kBAAkB,CAAC;EAC1C,MAAM,CAAC,GAAG,EAAE;IACV,MAAM,OAAM,GAAI,EAAE,GAAG,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,GAAG,GAAG,CAAC,MAAO,GAAA;AAC1D,IAAA,IAAI,MAAK,GAAI,GAAG,CAAC,GAAI,GAAE,iBAAe;AACtC,IAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE;MACnC,MAAK,IAAK,GAAI,GAAE,GAAG,CAAC,GAAE,GAAI,UAAQ;AACpC,KAAA;AACA,IAAA,OAAO,CAAC,KAAM,GAAE,OAAK;IACrB,OAAO,CAAC,UAAS,GAAI,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAA;;IAE9D,MAAM,IAAK,GAAE,GAAC;IACd,IAAI,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE;;AAEtB,MAAA,MAAM,QAAO,GAAI,GAAG,CAAC,MAAM,CAAC,OAAO,GAAC;MACpC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;AACtB,QAAA,IAAI,CAAC,CAAC,GAAG,EAAE;UACT,IAAI,CAAC,CAAC,CAAC,GAAG,CAAA,GAAI,EAAA;AAChB,SAAA;OACD,EAAA;AACH,KAAA;;IAEA,OAAO,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE;AAC3B,MAAA,IAAI,EAAE,CAAC,EAAE,OAAM,EAAG,KAAK;QACrB,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAI,GAAE,IAAI,CAAC,CAAA;OACpD;KACF,CAAA;GACF;AACH,CAAC,EAAA;;;;;"}

package/es/page-diy/src/components/DragTool.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DragTool.vue.mjs","sources":["../../../../src/page-diy/src/components/DragTool.vue"],"sourcesContent":["<template>\n  <div\n    class=\"drag-tool animate__animated\"\n    :class=\"{ active: state.active === id }\"\n    :style=\"_style\"\n    @click.stop=\"active\"\n  >\n    <div v-if=\"mask\" class=\"drag-mask\"></div>\n    <div class=\"drag-r\">\n      <div class=\"drag-btn\" title=\"添加当前组件\" @click=\"$emit('create')\">\n        <dk-icon icon=\"CirclePlus\"></dk-icon>\n      </div>\n      <div class=\"drag-btn\" title=\"复制当前组件\" @click=\"$emit('copy')\">\n        <dk-icon icon=\"CopyDocument\"></dk-icon>\n      </div>\n      <div\n        v-if=\"children\"\n        class=\"drag-btn\"\n        title=\"添加子组件\"\n        @click=\"$emit('addChild')\"\n      >\n        <dk-icon icon=\"fluent:tab-add-20-regular\"></dk-icon>\n      </div>\n      <div\n        class=\"drag-btn drag-btn-danger\"\n        title=\"删除组件\"\n        @click=\"$emit('delete')\"\n      >\n        <dk-icon icon=\"Close\"></dk-icon>\n      </div>\n    </div>\n    <slot name=\"default\"></slot>\n  </div>\n</template>\n\n<script>\nimport { computed, inject, toRefs, defineComponent } from 'vue'\n\nlet uni = 1\nexport default defineComponent({\n  name: 'DragTool',\n  props: {\n    dragBtn: {\n      default: false,\n      type: Boolean,\n    },\n    children: {\n      default: '',\n      type: String,\n    },\n    unique: {\n      default: '',\n      type: String,\n    },\n    mask: {\n      default: false,\n      type: Boolean,\n    },\n    setting: {\n      default: () => {},\n      type: [Object],\n    },\n  },\n  setup(props) {\n    const { unique } = toRefs(props)\n    const id = computed(() => unique.value || uni++)\n    const state = inject('fcx')\n    return {\n      id,\n      state,\n    }\n  },\n  computed: {\n    pageConfig() {\n      return {}\n    },\n    _style() {\n      if (this.setting.is_position) {\n        return {\n          ...this.setting.style,\n          ...this.setting.position,\n          position: 'absolute',\n        }\n      } else {\n        return {\n          ...this.setting.style,\n        }\n      }\n    },\n    _animate() {\n      // if (this.setting.loop_animate) {\n      //   return 'animate__' + this.setting.loop_animate + ' '\n      // } else if (this.setting.animate) {\n      //   return 'animate__' + this.setting.animate\n      // } else {\n      return ''\n      // }\n    },\n  },\n  beforeUnmount() {\n    this.state = {}\n  },\n  methods: {\n    active() {\n      if (this.state.active === this.id) return\n      this.state.active = this.id\n      this.$emit('active')\n    },\n  },\n})\n</script>\n"],"names":["_createElementBlock","_openBlock","_createElementVNode","_createVNode","_renderSlot"],"mappings":"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"}
+{"version":3,"file":"DragTool.vue.mjs","sources":["../../../../src/page-diy/src/components/DragTool.vue"],"sourcesContent":["<template>\n  <div\n    class=\"drag-tool animate__animated\"\n    :class=\"{ active: state.active === id }\"\n    :style=\"_style\"\n    @click.stop=\"active\"\n  >\n    <div v-if=\"mask\" class=\"drag-mask\"></div>\n    <div class=\"drag-r\">\n      <div class=\"drag-btn\" title=\"添加当前组件\" @click=\"$emit('create')\">\n        <dk-icon icon=\"CirclePlus\"></dk-icon>\n      </div>\n      <div class=\"drag-btn\" title=\"复制当前组件\" @click=\"$emit('copy')\">\n        <dk-icon icon=\"CopyDocument\"></dk-icon>\n      </div>\n      <div v-if=\"children\" class=\"drag-btn\" title=\"添加子组件\" @click=\"$emit('addChild')\">\n        <dk-icon icon=\"fluent:tab-add-20-regular\"></dk-icon>\n      </div>\n      <div class=\"drag-btn drag-btn-danger\" title=\"删除组件\" @click=\"$emit('delete')\">\n        <dk-icon icon=\"Close\"></dk-icon>\n      </div>\n    </div>\n    <slot name=\"default\"></slot>\n  </div>\n</template>\n\n<script>\nimport { computed, inject, toRefs, defineComponent } from 'vue'\n\nlet uni = 1\nexport default defineComponent({\n  name: 'DragTool',\n  props: {\n    dragBtn: {\n      default: false,\n      type: Boolean,\n    },\n    children: {\n      default: '',\n      type: String,\n    },\n    unique: {\n      default: '',\n      type: String,\n    },\n    mask: {\n      default: false,\n      type: Boolean,\n    },\n    setting: {\n      default: () => {},\n      type: [Object],\n    },\n  },\n  setup(props) {\n    const { unique } = toRefs(props)\n    const id = computed(() => unique.value || uni++)\n    const state = inject('fcx')\n    return {\n      id,\n      state,\n    }\n  },\n  computed: {\n    pageConfig() {\n      return {}\n    },\n    _style() {\n      if (this.setting.is_position) {\n        return {\n          ...this.setting.style,\n          ...this.setting.position,\n          position: 'absolute',\n        }\n      } else {\n        return {\n          ...this.setting.style,\n        }\n      }\n    },\n    _animate() {\n      // if (this.setting.loop_animate) {\n      //   return 'animate__' + this.setting.loop_animate + ' '\n      // } else if (this.setting.animate) {\n      //   return 'animate__' + this.setting.animate\n      // } else {\n      return ''\n      // }\n    },\n  },\n  beforeUnmount() {\n    this.state = {}\n  },\n  methods: {\n    active() {\n      if (this.state.active === this.id) return\n      this.state.active = this.id\n      this.$emit('active')\n    },\n  },\n})\n</script>\n"],"names":["_createElementBlock","_openBlock","_createElementVNode","_createVNode","_renderSlot"],"mappings":"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"}

package/es/page-diy/src/components/PreviewPhone.vue2.mjs

@@ -55,7 +55,8 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     const cache = JSON.parse(storage.get(key) || "{}");
     const form = ref({
       showLine: cache.showLine || false,
-      margin: cache.margin || 0
+      margin: cache.margin || 0,
+      preview: cache.preview || false
     });
     const changeForm = () => {
       storage.set(key, JSON.stringify(form.value));
@@ -77,13 +78,23 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       });
     };
     const _style = computed(() => {
-      let line = {};
-      if (form.value.showLine) {
+      let line = {
+        "--padding": "0",
+        "--overflow": "initial"
+      };
+      if (form.value.showLine && !form.value.preview) {
         line = {
           "--margin": form.value.margin + "px",
           "--showDashed": "1px"
         };
       }
+      if (form.value.preview) {
+        line["--padding"] = "0";
+        line["--overflow"] = "hidden";
+      } else {
+        line["--padding"] = "2px 0";
+        line["--overflow"] = "initial";
+      }
       return {
         ...props.pageConfig.style,
         ...line
@@ -212,12 +223,23 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
                           min: 0,
                           step: 1,
                           "show-stops": "",
-                          max: 10,
+                          max: 20,
                           onChange: _cache[5] || (_cache[5] = ($event) => changeForm())
                         }, null, 8, ["modelValue"])
                       ]),
                       _: 1
                       /* STABLE */
+                    }),
+                    createVNode(_component_el_form_item, { label: "\u6548\u679C\u9884\u89C8" }, {
+                      default: withCtx(() => [
+                        createVNode(_component_el_switch, {
+                          modelValue: form.value.preview,
+                          "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => form.value.preview = $event),
+                          onChange: _cache[7] || (_cache[7] = ($event) => changeForm())
+                        }, null, 8, ["modelValue"])
+                      ]),
+                      _: 1
+                      /* STABLE */
                     })
                   ]),
                   _: 1

package/es/page-diy/src/components/PreviewPhone.vue2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PreviewPhone.vue2.mjs","sources":["../../../../src/page-diy/src/components/PreviewPhone.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { defineComponent as __MACROS_defineComponent } from \"vue\";\nexport default /*#__PURE__*/ __MACROS_defineComponent({\n  name: 'PreviewPhone',\n});\n</script>\n<template>\n  <div class=\"preview-phone\">\n    <div class=\"phone\">\n      <div class=\"phone-header\">\n        <div class=\"phone-header-top\">\n          <div class=\"phone-time\">\n            <span>{{ time }}</span>\n            <van-icon name=\"wechat\" color=\"#2ddd71\" />\n          </div>\n          <div />\n          <div class=\"phone-battery\">\n            <span class=\"m-r-4px\">100%</span>\n            <dk-icon icon=\"gg:battery-full\" :size=\"18\" color=\"#555\" hover-color=\"#f00\"></dk-icon>\n          </div>\n        </div>\n        <div class=\"phone-title\">\n          <div class=\"phone-title-icon\">\n            <el-dropdown trigger=\"click\" placement=\"bottom-start\">\n              <dk-icon icon=\"Close\" hover-color=\"var(--el-color-primary)\" :size=\"20\" style=\"cursor: pointer\"></dk-icon>\n              <template #dropdown>\n                <el-dropdown-menu>\n                  <el-dropdown-item @click=\"clear('rule')\">清除组件</el-dropdown-item>\n                  <el-dropdown-item @click=\"clear('page')\">清除页面</el-dropdown-item>\n                </el-dropdown-menu>\n              </template>\n            </el-dropdown>\n          </div>\n          <div>页面标题</div>\n          <div class=\"phone-title-icon\">\n            <el-popover placement=\"bottom\" :width=\"200\" trigger=\"click\">\n              <template #reference>\n                <dk-icon icon=\"MoreFilled\" :size=\"20\" hover-color=\"var(--el-color-primary)\" style=\"cursor: pointer\" />\n              </template>\n              <el-form-item label=\"显示网格\">\n                <el-switch v-model=\"form.showLine\" @change=\"changeForm()\" />\n              </el-form-item>\n              <el-form-item label=\"网格间距\">\n                <el-slider v-model=\"form.margin\" :min=\"0\" :step=\"1\" show-stops :max=\"10\" @change=\"changeForm()\" />\n              </el-form-item>\n            </el-popover>\n          </div>\n        </div>\n      </div>\n      <div class=\"phone-body _fc-m-drag\" :style=\"_style\">\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, inject } from 'vue'\nimport { storage } from '@vipl520/utils'\nimport { ElMessage, ElMessageBox } from 'element-plus'\n\nconst diy: any = inject('diy')\nconst props = defineProps({\n  value: {\n    default: '',\n    type: String,\n  },\n  pageConfig: {\n    default: () => {},\n    type: [Object],\n  },\n})\n\nconst key = 'preview-phone'\nconst cache: any = JSON.parse(storage.get(key) || '{}')\n\nconst form = ref({\n  showLine: cache.showLine || false,\n  margin: cache.margin || 0,\n})\n\nconst changeForm = () => {\n  storage.set(key, JSON.stringify(form.value))\n}\nconst clear = (type = '') => {\n  const { proxy } = diy\n  const typeName: any = {\n    rule: '组件',\n    config: '配置',\n  }\n  ElMessageBox.confirm('当前要清除' + typeName[type] + '，是否继续?', '警告', {\n    confirmButtonText: '确定',\n    cancelButtonText: '取消',\n    type: 'warning',\n  })\n    .then(() => {\n      proxy.clear(type)\n      ElMessage.success('清除成功')\n    })\n    .catch(() => {})\n}\nconst _style = computed(() => {\n  let line = {}\n  if (form.value.showLine) {\n    line = {\n      '--margin': form.value.margin + 'px',\n      '--showDashed': '1px',\n    }\n  }\n  return {\n    ...props.pageConfig.style,\n    ...line,\n  }\n})\n\nconst time = computed(() => {\n  const d = new Date()\n  const hour = d.getHours() // 得到小时数\n  const minute = d.getMinutes() // 得到分钟数\n  return hour + ':' + minute\n})\n</script>\n"],"names":["__MACROS_defineComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,MAA6B,cAAAA,eAAyB,CAAA;AAAA,EACpD,IAAM,EAAA,cAAA;AACR,CAAC,CAAA,CAAA;;;;;;;;;;;;;;;;AAyDD,IAAM,MAAA,GAAA,GAAW,OAAO,KAAK,CAAA,CAAA;AAY7B,IAAA,MAAM,GAAM,GAAA,eAAA,CAAA;AACZ,IAAA,MAAM,QAAa,IAAK,CAAA,KAAA,CAAM,QAAQ,GAAI,CAAA,GAAG,KAAK,IAAI,CAAA,CAAA;AAEtD,IAAA,MAAM,OAAO,GAAI,CAAA;AAAA,MACf,QAAA,EAAU,MAAM,QAAY,IAAA,KAAA;AAAA,MAC5B,MAAA,EAAQ,MAAM,MAAU,IAAA,CAAA;AAAA,KACzB,CAAA,CAAA;AAED,IAAA,MAAM,aAAa,MAAM;AACvB,MAAA,OAAA,CAAQ,IAAI,GAAK,EAAA,IAAA,CAAK,SAAU,CAAA,IAAA,CAAK,KAAK,CAAC,CAAA,CAAA;AAAA,KAC7C,CAAA;AACA,IAAM,MAAA,KAAA,GAAQ,CAAC,IAAA,GAAO,EAAO,KAAA;AAC3B,MAAM,MAAA,EAAE,OAAU,GAAA,GAAA,CAAA;AAClB,MAAA,MAAM,QAAgB,GAAA;AAAA,QACpB,IAAM,EAAA,cAAA;AAAA,QACN,MAAQ,EAAA,cAAA;AAAA,OACV,CAAA;AACA,MAAA,YAAA,CAAa,QAAQ,gCAAU,GAAA,QAAA,CAAS,IAAI,CAAA,GAAI,mCAAU,cAAM,EAAA;AAAA,QAC9D,iBAAmB,EAAA,cAAA;AAAA,QACnB,gBAAkB,EAAA,cAAA;AAAA,QAClB,IAAM,EAAA,SAAA;AAAA,OACP,CACE,CAAA,IAAA,CAAK,MAAM;AACV,QAAA,KAAA,CAAM,MAAM,IAAI,CAAA,CAAA;AAChB,QAAA,SAAA,CAAU,QAAQ,0BAAM,CAAA,CAAA;AAAA,OACzB,CACA,CAAA,KAAA,CAAM,MAAM;AAAA,OAAE,CAAA,CAAA;AAAA,KACnB,CAAA;AACA,IAAM,MAAA,MAAA,GAAS,SAAS,MAAM;AAC5B,MAAA,IAAI,OAAO,EAAC,CAAA;AACZ,MAAI,IAAA,IAAA,CAAK,MAAM,QAAU,EAAA;AACvB,QAAO,IAAA,GAAA;AAAA,UACL,UAAA,EAAY,IAAK,CAAA,KAAA,CAAM,MAAS,GAAA,IAAA;AAAA,UAChC,cAAgB,EAAA,KAAA;AAAA,SAClB,CAAA;AAAA,OACF;AACA,MAAO,OAAA;AAAA,QACL,GAAG,MAAM,UAAW,CAAA,KAAA;AAAA,QACpB,GAAG,IAAA;AAAA,OACL,CAAA;AAAA,KACD,CAAA,CAAA;AAED,IAAM,MAAA,IAAA,GAAO,SAAS,MAAM;AAC1B,MAAM,MAAA,CAAA,uBAAQ,IAAK,EAAA,CAAA;AACnB,MAAM,MAAA,IAAA,GAAO,EAAE,QAAS,EAAA,CAAA;AACxB,MAAM,MAAA,MAAA,GAAS,EAAE,UAAW,EAAA,CAAA;AAC5B,MAAA,OAAO,OAAO,GAAM,GAAA,MAAA,CAAA;AAAA,KACrB,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PreviewPhone.vue2.mjs","sources":["../../../../src/page-diy/src/components/PreviewPhone.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { defineComponent as __MACROS_defineComponent } from \"vue\";\nexport default /*#__PURE__*/ __MACROS_defineComponent({\n  name: 'PreviewPhone',\n});\n</script>\n<template>\n  <div class=\"preview-phone\">\n    <div class=\"phone\">\n      <div class=\"phone-header\">\n        <div class=\"phone-header-top\">\n          <div class=\"phone-time\">\n            <span>{{ time }}</span>\n            <van-icon name=\"wechat\" color=\"#2ddd71\" />\n          </div>\n          <div />\n          <div class=\"phone-battery\">\n            <span class=\"m-r-4px\">100%</span>\n            <dk-icon icon=\"gg:battery-full\" :size=\"18\" color=\"#555\" hover-color=\"#f00\"></dk-icon>\n          </div>\n        </div>\n        <div class=\"phone-title\">\n          <div class=\"phone-title-icon\">\n            <el-dropdown trigger=\"click\" placement=\"bottom-start\">\n              <dk-icon icon=\"Close\" hover-color=\"var(--el-color-primary)\" :size=\"20\" style=\"cursor: pointer\"></dk-icon>\n              <template #dropdown>\n                <el-dropdown-menu>\n                  <el-dropdown-item @click=\"clear('rule')\">清除组件</el-dropdown-item>\n                  <el-dropdown-item @click=\"clear('page')\">清除页面</el-dropdown-item>\n                </el-dropdown-menu>\n              </template>\n            </el-dropdown>\n          </div>\n          <div>页面标题</div>\n          <div class=\"phone-title-icon\">\n            <el-popover placement=\"bottom\" :width=\"200\" trigger=\"click\">\n              <template #reference>\n                <dk-icon icon=\"MoreFilled\" :size=\"20\" hover-color=\"var(--el-color-primary)\" style=\"cursor: pointer\" />\n              </template>\n              <el-form-item label=\"显示网格\">\n                <el-switch v-model=\"form.showLine\" @change=\"changeForm()\" />\n              </el-form-item>\n              <el-form-item label=\"网格间距\">\n                <el-slider v-model=\"form.margin\" :min=\"0\" :step=\"1\" show-stops :max=\"20\" @change=\"changeForm()\" />\n              </el-form-item>\n              <el-form-item label=\"效果预览\">\n                <el-switch v-model=\"form.preview\" @change=\"changeForm()\" />\n              </el-form-item>\n            </el-popover>\n          </div>\n        </div>\n      </div>\n      <div class=\"phone-body _fc-m-drag\" :style=\"_style\">\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, inject } from 'vue'\nimport { storage } from '@vipl520/utils'\nimport { ElMessage, ElMessageBox } from 'element-plus'\n\nconst diy: any = inject('diy')\nconst props = defineProps({\n  value: {\n    default: '',\n    type: String,\n  },\n  pageConfig: {\n    default: () => {},\n    type: [Object],\n  },\n})\n\nconst key = 'preview-phone'\nconst cache: any = JSON.parse(storage.get(key) || '{}')\n\nconst form = ref({\n  showLine: cache.showLine || false,\n  margin: cache.margin || 0,\n  preview: cache.preview || false,\n})\n\nconst changeForm = () => {\n  storage.set(key, JSON.stringify(form.value))\n}\nconst clear = (type = '') => {\n  const { proxy } = diy\n  const typeName: any = {\n    rule: '组件',\n    config: '配置',\n  }\n  ElMessageBox.confirm('当前要清除' + typeName[type] + '，是否继续?', '警告', {\n    confirmButtonText: '确定',\n    cancelButtonText: '取消',\n    type: 'warning',\n  })\n    .then(() => {\n      proxy.clear(type)\n      ElMessage.success('清除成功')\n    })\n    .catch(() => {})\n}\nconst _style = computed(() => {\n  let line: any = {\n    '--padding': '0',\n    '--overflow': 'initial',\n  }\n  if (form.value.showLine && !form.value.preview) {\n    line = {\n      '--margin': form.value.margin + 'px',\n      '--showDashed': '1px',\n    }\n  }\n  if (form.value.preview) {\n    line['--padding'] = '0'\n    line['--overflow'] = 'hidden'\n  } else {\n    line['--padding'] = '2px 0'\n    line['--overflow'] = 'initial'\n  }\n  return {\n    ...props.pageConfig.style,\n    ...line,\n  }\n})\n\nconst time = computed(() => {\n  const d = new Date()\n  const hour = d.getHours() // 得到小时数\n  const minute = d.getMinutes() // 得到分钟数\n  return hour + ':' + minute\n})\n</script>\n"],"names":["__MACROS_defineComponent"],"mappings":"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"}