@epxing/designer 0.0.0-stage → 5.3.0-beta.1

package/dist/src/visual/config-page/dashboard-theme-setting/Background.js

@@ -0,0 +1,179 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, toDisplayString, createVNode, withCtx, createTextVNode } from "vue";
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  props: {
+    label: String,
+    value: Object
+  },
+  data() {
+    return {
+      unfold: false,
+      style: {},
+      predefineColors: ["#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"]
+    };
+  },
+  watch: {
+    style: {
+      handler(v) {
+        const style = { ...v };
+        if (style["background-color"] === null) style["background-color"] = "transparent";
+        this.$emit("change", style);
+      },
+      deep: true
+    }
+  },
+  methods: {
+    changeBgImage(e) {
+      const file = e.target.files[0];
+      if (file) {
+        this.$http.save({
+          action: "upload",
+          file,
+          SOURCE: "page"
+        }, {
+          requestType: "formData"
+        }).then((data) => {
+          if (data && data.bean) {
+            this.style["background-image"] = data.bean;
+          }
+        });
+      }
+    }
+  },
+  created() {
+    if (this.value) {
+      const style = { ...this.value };
+      if (style["background-color"] === "transparent") style["background-color"] = null;
+      this.style = style;
+    }
+  }
+};
+const _hoisted_1 = { class: "epx-page-designer-setting-style__header" };
+const _hoisted_2 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_3 = { class: "epx-page-designer-setting-style__content" };
+const _hoisted_4 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_5 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_6 = { class: "epx-page-designer-setting-style__content" };
+const _hoisted_7 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_8 = { class: "epx-page-designer-setting-style__upload" };
+const _hoisted_9 = { class: "epx-page-designer-setting-style__content" };
+const _hoisted_10 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_11 = { class: "epx-page-designer-setting-style__upload" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_color_picker = resolveComponent("el-color-picker");
+  const _component_el_input = resolveComponent("el-input");
+  const _component_el_radio = resolveComponent("el-radio");
+  const _component_el_radio_group = resolveComponent("el-radio-group");
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass({ "epx-page-designer-setting-style__item": true, "epx-page-designer-setting-style__item--unfold": $data.unfold })
+  }, [
+    createElementVNode("div", _hoisted_1, [
+      createElementVNode("span", null, [
+        createElementVNode("i", {
+          class: "epx-page-designer-setting-style__fold-icon el-icon-caret-right",
+          onClick: _cache[0] || (_cache[0] = ($event) => $data.unfold = !$data.unfold)
+        }),
+        createElementVNode("label", _hoisted_2, toDisplayString($props.label), 1)
+      ])
+    ]),
+    createElementVNode("div", _hoisted_3, [
+      createElementVNode("div", _hoisted_4, [
+        createElementVNode("label", _hoisted_5, toDisplayString(_ctx.$t("background color")), 1),
+        createVNode(_component_el_color_picker, {
+          modelValue: $data.style["background-color"],
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => $data.style["background-color"] = $event),
+          "show-alpha": "",
+          predefine: $data.predefineColors
+        }, null, 8, ["modelValue", "predefine"])
+      ])
+    ]),
+    createElementVNode("div", _hoisted_6, [
+      createElementVNode("div", _hoisted_7, [
+        _cache[6] || (_cache[6] = createElementVNode("label", {
+          class: "epx-page-designer-setting-style__label",
+          for: ""
+        }, "背景图片", -1)),
+        createElementVNode("div", _hoisted_8, [
+          createVNode(_component_el_input, {
+            class: "input upload-input",
+            "model-value": $data.style["background-image"],
+            type: "text",
+            size: "default",
+            clearable: "",
+            onClear: _cache[3] || (_cache[3] = ($event) => $data.style["background-image"] = "")
+          }, {
+            suffix: withCtx(() => [
+              createElementVNode("i", {
+                class: "el-icon-upload",
+                onClick: _cache[2] || (_cache[2] = ($event) => _ctx.$refs.fileInput.click())
+              })
+            ]),
+            _: 1
+          }, 8, ["model-value"]),
+          createElementVNode("input", {
+            style: { width: 0, height: 0 },
+            ref: "fileInput",
+            type: "file",
+            onChange: _cache[4] || (_cache[4] = (...args) => $options.changeBgImage && $options.changeBgImage(...args))
+          }, null, 544)
+        ])
+      ])
+    ]),
+    createElementVNode("div", _hoisted_9, [
+      createElementVNode("div", _hoisted_10, [
+        _cache[10] || (_cache[10] = createElementVNode("label", {
+          class: "epx-page-designer-setting-style__label",
+          for: ""
+        }, "背景适应模式", -1)),
+        createElementVNode("div", _hoisted_11, [
+          createVNode(_component_el_radio_group, {
+            modelValue: $data.style["background-size"],
+            "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => $data.style["background-size"] = $event),
+            size: "default"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_el_radio, {
+                label: "cover",
+                value: "cover"
+              }, {
+                default: withCtx(() => [..._cache[7] || (_cache[7] = [
+                  createTextVNode("裁剪", -1)
+                ])]),
+                _: 1
+              }),
+              createVNode(_component_el_radio, {
+                label: "contain",
+                value: "contain"
+              }, {
+                default: withCtx(() => [..._cache[8] || (_cache[8] = [
+                  createTextVNode("适应", -1)
+                ])]),
+                _: 1
+              }),
+              createVNode(_component_el_radio, {
+                label: "100% 100%",
+                value: "100% 100%"
+              }, {
+                default: withCtx(() => [..._cache[9] || (_cache[9] = [
+                  createTextVNode("拉伸", -1)
+                ])]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["modelValue"])
+        ])
+      ])
+    ])
+  ], 2);
+}
+const Background = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  Background as default
+};

package/dist/src/visual/config-page/dashboard-theme-setting/Border.js

@@ -0,0 +1,313 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, toDisplayString, createVNode, withCtx, Fragment, renderList, createBlock, createTextVNode, createCommentVNode } from "vue";
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  props: {
+    label: String,
+    value: Object
+  },
+  data() {
+    return {
+      unfold: false,
+      style: {},
+      predefineColors: ["#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"],
+      borderWidthType: "same"
+    };
+  },
+  computed: {
+    clearSuffix() {
+      return (v = "") => v === "auto" ? "auto" : typeof v === "string" ? v.replace(/(px|%)/, "") : v;
+    }
+  },
+  watch: {
+    style: {
+      handler(v) {
+        this.$emit("change", v);
+      },
+      deep: true
+    }
+  },
+  methods: {
+    changePx(key, v, unit = "px") {
+      if ((unit || v) === "auto") {
+        this.style[key] = unit;
+      } else {
+        const formatV = parseFloat(v) ? parseFloat(v) + unit : "";
+        if (formatV || v === "-") {
+          this.style[key] = formatV || v + unit;
+        } else {
+          delete this.style[key];
+        }
+      }
+    },
+    changeBorderWidthPosition(key, v) {
+      this.style[`border-${key}-width`] = v + "px";
+    },
+    changeBorderRadiusPosition(key, v) {
+      const borderRadiusPosition = {
+        ...this.borderRadiusPosition,
+        [key]: v + "px"
+      };
+      const same = Object.values(borderRadiusPosition).every((item) => item === v + "px");
+      if (same) {
+        this.style["border-radius"] = v + "px";
+      } else if (borderRadiusPosition["top-left"] === borderRadiusPosition["bottom-right"] && borderRadiusPosition["top-right"] === borderRadiusPosition["bottom-left"]) {
+        this.style["border-radius"] = `${borderRadiusPosition["top-left"]} ${borderRadiusPosition["top-right"]}`;
+      } else {
+        this.style["border-radius"] = `${borderRadiusPosition["top-left"]} ${borderRadiusPosition["top-right"]} ${borderRadiusPosition["bottom-right"]} ${borderRadiusPosition["bottom-left"]}`;
+      }
+      for (const key2 in borderRadiusPosition) {
+        delete this.style[`border-${key2}-radius`];
+      }
+    }
+  },
+  created() {
+    if (this.value) this.style = { ...this.value };
+    this.borderStyleOption = [
+      {
+        label: this.$t("full line"),
+        value: "solid"
+      },
+      {
+        label: this.$t("dotted line"),
+        value: "dashed"
+      },
+      {
+        label: this.$t("stipple line"),
+        value: "dotted"
+      },
+      {
+        label: this.$t("not"),
+        value: "none"
+      }
+    ];
+    this.borderWidthPositionList = [{
+      label: "上",
+      value: "top"
+    }, {
+      label: "右",
+      value: "right"
+    }, {
+      label: "下",
+      value: "bottom"
+    }, {
+      label: "左",
+      value: "left"
+    }];
+    this.borderRadiusPositionList = [{
+      label: "左上",
+      value: "top-left",
+      index: 0
+    }, {
+      label: "右上",
+      value: "top-right",
+      index: 1
+    }, {
+      label: "右下",
+      value: "bottom-right",
+      index: 2
+    }, {
+      label: "左下",
+      value: "bottom-left",
+      index: 3
+    }];
+  }
+};
+const _hoisted_1 = { class: "epx-page-designer-setting-style__header" };
+const _hoisted_2 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_3 = { class: "epx-page-designer-setting-style__content" };
+const _hoisted_4 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_5 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_6 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_7 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_8 = {
+  key: 0,
+  class: "epx-page-designer-setting-style__border-position"
+};
+const _hoisted_9 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_10 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_11 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_12 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_13 = {
+  key: 0,
+  class: "epx-page-designer-setting-style__border-position"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_option = resolveComponent("el-option");
+  const _component_el_select = resolveComponent("el-select");
+  const _component_el_input_number = resolveComponent("el-input-number");
+  const _component_el_radio_button = resolveComponent("el-radio-button");
+  const _component_el_radio_group = resolveComponent("el-radio-group");
+  const _component_el_color_picker = resolveComponent("el-color-picker");
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass({ "epx-page-designer-setting-style__item": true, "epx-page-designer-setting-style__item--unfold": $data.unfold })
+  }, [
+    createElementVNode("div", _hoisted_1, [
+      createElementVNode("span", null, [
+        createElementVNode("i", {
+          class: "epx-page-designer-setting-style__fold-icon el-icon-caret-right",
+          onClick: _cache[0] || (_cache[0] = ($event) => $data.unfold = !$data.unfold)
+        }),
+        createElementVNode("label", _hoisted_2, toDisplayString($props.label), 1)
+      ])
+    ]),
+    createElementVNode("div", _hoisted_3, [
+      createElementVNode("div", _hoisted_4, [
+        createElementVNode("label", _hoisted_5, toDisplayString(_ctx.$t("linear")), 1),
+        createVNode(_component_el_select, {
+          class: "selection",
+          size: "small",
+          modelValue: $data.style["border-style"],
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => $data.style["border-style"] = $event),
+          placeholder: _ctx.$t("not")
+        }, {
+          default: withCtx(() => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.borderStyleOption, (item) => {
+              return openBlock(), createBlock(_component_el_option, {
+                key: item.value,
+                label: item.label,
+                value: item.value
+              }, null, 8, ["label", "value"]);
+            }), 128))
+          ]),
+          _: 1
+        }, 8, ["modelValue", "placeholder"])
+      ]),
+      createElementVNode("div", _hoisted_6, [
+        createElementVNode("label", _hoisted_7, toDisplayString(_ctx.$t("width")), 1),
+        createVNode(_component_el_input_number, {
+          size: "small",
+          "model-value": $options.clearSuffix($data.style["border-width"]),
+          "controls-position": "right",
+          onChange: _cache[2] || (_cache[2] = (v) => $data.style["border-width"] = v + "px")
+        }, null, 8, ["model-value"]),
+        createVNode(_component_el_radio_group, {
+          class: "epx-page-designer-setting-style__border-width-radio",
+          modelValue: $data.borderWidthType,
+          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => $data.borderWidthType = $event),
+          size: "small"
+        }, {
+          default: withCtx(() => [
+            createVNode(_component_el_radio_button, {
+              label: "same",
+              value: "same"
+            }, {
+              default: withCtx(() => [..._cache[7] || (_cache[7] = [
+                createElementVNode("i", { class: "epx-icon-border" }, null, -1)
+              ])]),
+              _: 1
+            }),
+            createVNode(_component_el_radio_button, {
+              label: "diff",
+              value: "diff"
+            }, {
+              default: withCtx(() => [..._cache[8] || (_cache[8] = [
+                createElementVNode("i", { class: "epx-icon-xuxian" }, null, -1)
+              ])]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["modelValue"]),
+        $data.borderWidthType === "diff" ? (openBlock(), createElementBlock("div", _hoisted_8, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.borderWidthPositionList, (item) => {
+            return openBlock(), createElementBlock("div", {
+              class: "epx-page-designer-setting-style__border-position-item",
+              key: item.value
+            }, [
+              createVNode(_component_el_input_number, {
+                "model-value": $options.clearSuffix(_ctx.borderWidthPosition[item.value]),
+                controls: false,
+                min: 0,
+                size: "small",
+                onChange: (v) => $options.changeBorderWidthPosition(item.value, v)
+              }, null, 8, ["model-value", "onChange"]),
+              createTextVNode(" " + toDisplayString(item.label), 1)
+            ]);
+          }), 128))
+        ])) : createCommentVNode("", true)
+      ]),
+      createElementVNode("div", _hoisted_9, [
+        createElementVNode("label", _hoisted_10, toDisplayString(_ctx.$t("color")), 1),
+        createVNode(_component_el_color_picker, {
+          modelValue: $data.style["borderColor"],
+          "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => $data.style["borderColor"] = $event),
+          "show-alpha": "",
+          predefine: $data.predefineColors
+        }, null, 8, ["modelValue", "predefine"])
+      ]),
+      createElementVNode("div", _hoisted_11, [
+        createElementVNode("label", _hoisted_12, toDisplayString(_ctx.$t("filleted corner")), 1),
+        createVNode(_component_el_input_number, {
+          size: "small",
+          "model-value": $options.clearSuffix($data.style["border-radius"]),
+          "controls-position": "right",
+          onChange: _cache[5] || (_cache[5] = (v) => $data.style["border-radius"] = v + "px")
+        }, null, 8, ["model-value"]),
+        createVNode(_component_el_radio_group, {
+          class: "epx-page-designer-setting-style__border-width-radio",
+          modelValue: _ctx.borderRadiusType,
+          "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => _ctx.borderRadiusType = $event),
+          size: "small"
+        }, {
+          default: withCtx(() => [
+            createVNode(_component_el_radio_button, {
+              label: "same",
+              value: "same"
+            }, {
+              default: withCtx(() => [..._cache[9] || (_cache[9] = [
+                createElementVNode("i", { class: "epx-icon-border" }, null, -1)
+              ])]),
+              _: 1
+            }),
+            createVNode(_component_el_radio_button, {
+              label: "diff",
+              value: "diff"
+            }, {
+              default: withCtx(() => [..._cache[10] || (_cache[10] = [
+                createElementVNode("i", { class: "epx-icon-xuxian" }, null, -1)
+              ])]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["modelValue"]),
+        _ctx.borderRadiusType === "diff" ? (openBlock(), createElementBlock("div", _hoisted_13, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.borderRadiusPositionList, (item) => {
+            return openBlock(), createElementBlock("div", {
+              class: "epx-page-designer-setting-style__border-position-item",
+              key: item.value
+            }, [
+              createVNode(_component_el_input_number, {
+                "model-value": $options.clearSuffix(_ctx.borderRadiusPosition[item.value]),
+                controls: false,
+                min: 0,
+                size: "small",
+                onChange: (v) => $options.changeBorderRadiusPosition(item.value, v)
+              }, null, 8, ["model-value", "onChange"]),
+              createTextVNode(" " + toDisplayString(item.label), 1)
+            ]);
+          }), 128))
+        ])) : createCommentVNode("", true)
+      ])
+    ])
+  ], 2);
+}
+const Border = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  Border as default
+};

package/dist/src/visual/config-page/dashboard-theme-setting/Font.js

@@ -0,0 +1,191 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, toDisplayString, createVNode, withCtx, Fragment, renderList, createBlock } from "vue";
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+const _sfc_main = {
+  props: {
+    label: String,
+    value: Object
+  },
+  data() {
+    return {
+      unfold: false,
+      style: {},
+      predefineColors: ["#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"]
+    };
+  },
+  computed: {
+    clearSuffix() {
+      return (v = "") => v === "auto" ? "auto" : typeof v === "string" ? v.replace(/(px|%)/, "") : v;
+    }
+  },
+  watch: {
+    style: {
+      handler(v) {
+        console.log();
+        this.$emit("change", v);
+      },
+      deep: true
+    }
+  },
+  created() {
+    this.fontWeightOption = [
+      {
+        label: this.$t("overstriking"),
+        value: "700"
+      },
+      {
+        label: this.$t("thin"),
+        value: "400"
+      },
+      {
+        label: this.$t("default"),
+        value: "500"
+      }
+    ];
+    if (this.value) this.style = { ...this.value };
+  }
+};
+const _hoisted_1 = { class: "epx-page-designer-setting-style__header" };
+const _hoisted_2 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_3 = { class: "epx-page-designer-setting-style__content" };
+const _hoisted_4 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_5 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_6 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_7 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_8 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_9 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_10 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_11 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+const _hoisted_12 = { class: "epx-page-designer-setting-style__subitem" };
+const _hoisted_13 = {
+  class: "epx-page-designer-setting-style__label",
+  for: ""
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_input_number = resolveComponent("el-input-number");
+  const _component_el_radio_button = resolveComponent("el-radio-button");
+  const _component_el_radio_group = resolveComponent("el-radio-group");
+  const _component_el_option = resolveComponent("el-option");
+  const _component_el_select = resolveComponent("el-select");
+  const _component_el_color_picker = resolveComponent("el-color-picker");
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass({ "epx-page-designer-setting-style__item": true, "epx-page-designer-setting-style__item--unfold": $data.unfold })
+  }, [
+    createElementVNode("div", _hoisted_1, [
+      createElementVNode("span", null, [
+        createElementVNode("i", {
+          class: "epx-page-designer-setting-style__fold-icon el-icon-caret-right",
+          onClick: _cache[0] || (_cache[0] = ($event) => $data.unfold = !$data.unfold)
+        }),
+        createElementVNode("label", _hoisted_2, toDisplayString($props.label), 1)
+      ])
+    ]),
+    createElementVNode("div", _hoisted_3, [
+      createElementVNode("div", _hoisted_4, [
+        createElementVNode("label", _hoisted_5, toDisplayString(_ctx.$t("word size")), 1),
+        createVNode(_component_el_input_number, {
+          size: "small",
+          "model-value": $options.clearSuffix($data.style["font-size"]),
+          "controls-position": "right",
+          onChange: _cache[1] || (_cache[1] = (v) => $data.style["font-size"] = v + "px")
+        }, null, 8, ["model-value"])
+      ]),
+      createElementVNode("div", _hoisted_6, [
+        createElementVNode("label", _hoisted_7, toDisplayString(_ctx.$t("row height")), 1),
+        createVNode(_component_el_input_number, {
+          size: "small",
+          "model-value": $options.clearSuffix($data.style["line-height"]),
+          "controls-position": "right",
+          onChange: _cache[2] || (_cache[2] = (v) => $data.style["line-height"] = v + "px")
+        }, null, 8, ["model-value"])
+      ]),
+      createElementVNode("div", _hoisted_8, [
+        createElementVNode("label", _hoisted_9, toDisplayString(_ctx.$t("text direction")), 1),
+        createVNode(_component_el_radio_group, {
+          modelValue: $data.style["text-align"],
+          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => $data.style["text-align"] = $event),
+          size: "default"
+        }, {
+          default: withCtx(() => [
+            createVNode(_component_el_radio_button, {
+              label: "left",
+              value: "left"
+            }, {
+              default: withCtx(() => [..._cache[6] || (_cache[6] = [
+                createElementVNode("i", { class: "epx-icon-left" }, null, -1)
+              ])]),
+              _: 1
+            }),
+            createVNode(_component_el_radio_button, {
+              label: "center",
+              value: "center"
+            }, {
+              default: withCtx(() => [..._cache[7] || (_cache[7] = [
+                createElementVNode("i", { class: "epx-icon-center" }, null, -1)
+              ])]),
+              _: 1
+            }),
+            createVNode(_component_el_radio_button, {
+              label: "right",
+              value: "right"
+            }, {
+              default: withCtx(() => [..._cache[8] || (_cache[8] = [
+                createElementVNode("i", { class: "epx-icon-right" }, null, -1)
+              ])]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["modelValue"])
+      ]),
+      createElementVNode("div", _hoisted_10, [
+        createElementVNode("label", _hoisted_11, toDisplayString(_ctx.$t("word again")), 1),
+        createVNode(_component_el_select, {
+          class: "selection",
+          size: "small",
+          modelValue: $data.style["font-weight"],
+          "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => $data.style["font-weight"] = $event),
+          placeholder: _ctx.$t("default")
+        }, {
+          default: withCtx(() => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.fontWeightOption, (item) => {
+              return openBlock(), createBlock(_component_el_option, {
+                key: item.value,
+                label: item.label,
+                value: item.value
+              }, null, 8, ["label", "value"]);
+            }), 128))
+          ]),
+          _: 1
+        }, 8, ["modelValue", "placeholder"])
+      ]),
+      createElementVNode("div", _hoisted_12, [
+        createElementVNode("label", _hoisted_13, toDisplayString(_ctx.$t("font color")), 1),
+        createVNode(_component_el_color_picker, {
+          modelValue: $data.style.color,
+          "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => $data.style.color = $event),
+          "show-alpha": "",
+          predefine: $data.predefineColors
+        }, null, 8, ["modelValue", "predefine"])
+      ])
+    ])
+  ], 2);
+}
+const Font = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  Font as default
+};