@farris/ui-vue 1.7.1 → 1.7.2-beta.1

package/components/json-editor/index.esm.js

@@ -1,9 +1,82 @@
-import { inject as N, reactive as S, defineComponent as T, computed as F, createVNode as o, createTextVNode as w, ref as V, watch as k } from "vue";
-import A, { FButtonEdit as J } from "../button-edit/index.esm.js";
-import { F_NOTIFY_SERVICE_TOKEN as I } from "../notify/index.esm.js";
-import M, { EditorType as R } from "../event-parameter/index.esm.js";
-import { useGuid as K, withInstall as U } from "../common/index.esm.js";
-const _ = {
+import { inject as J, reactive as S, defineComponent as O, computed as V, createVNode as n, createTextVNode as w, ref as T, watch as B } from "vue";
+import { createPropsResolver as M } from "../dynamic-resolver/index.esm.js";
+import R, { FButtonEdit as I } from "../button-edit/index.esm.js";
+import { F_NOTIFY_SERVICE_TOKEN as $ } from "../notify/index.esm.js";
+import K, { EditorType as U } from "../event-parameter/index.esm.js";
+import { useGuid as _, withInstall as q } from "../common/index.esm.js";
+const z = "https://json-schema.org/draft/2020-12/schema", H = "https://farris-design.gitee.io/json-editor.schema.json", L = "json-editor", G = "A Farris Component", W = "object", Y = {
+  type: {
+    description: "The type string of json-editor",
+    type: "string",
+    default: "json-editor"
+  },
+  parameterDescriptors: {
+    description: "Description of parameters to be configured",
+    type: "array",
+    default: []
+  },
+  formContextData: {
+    description: "Form context data",
+    type: "object",
+    default: {}
+  },
+  beforeOpen: {
+    description: "Before opening the configuration dialog, the callback function is executed",
+    type: "function",
+    default: null
+  },
+  dialogTitle: {
+    description: "Title of the dialog modal",
+    type: "string",
+    default: "JSON编辑器"
+  },
+  keyColumnTitle: {
+    description: "Title for the key column in the table",
+    type: "string",
+    default: "键"
+  },
+  valueColumnTitle: {
+    description: "Title for the value column in the table",
+    type: "string",
+    default: "值"
+  },
+  operationColumnTitle: {
+    description: "Title for the operation column",
+    type: "string",
+    default: "操作"
+  },
+  keyColumnPlaceholder: {
+    description: "Placeholder text for key input fields",
+    type: "string",
+    default: ""
+  },
+  valueColumnPlaceholder: {
+    description: "Placeholder text for value input fields",
+    type: "string",
+    default: ""
+  },
+  addButtonText: {
+    description: "Text displayed on the add new row button",
+    type: "string",
+    default: "添加"
+  }
+}, Q = [
+  "id",
+  "type"
+], X = [], Z = {
+  $schema: z,
+  $id: H,
+  title: L,
+  description: G,
+  type: W,
+  properties: Y,
+  required: Q,
+  ignore: X
+}, ee = /* @__PURE__ */ new Map([]);
+function te(e, r, u) {
+  return r;
+}
+const N = {
   /** 组件值 */
   modelValue: { type: String, default: "" },
   /** 待配置参数的描述信息 */
@@ -19,25 +92,25 @@ const _ = {
   keyColumnPlaceholder: { type: String, default: "" },
   valueColumnPlaceholder: { type: String, default: "" },
   addButtonText: { type: String, default: "添加" }
-};
-function z(e, a, s) {
-  const i = N(I, null), {
-    formContextData: m,
-    parameterDescriptors: p,
+}, oe = M(N, Z, ee, te);
+function ne(e, r, u) {
+  const l = J($, null), {
+    formContextData: p,
+    parameterDescriptors: m,
     initialize: c,
-    hasDuplicateParameter: g,
-    getNewValue: h
-  } = s;
-  function C(u) {
-    a.emit("change", u), a.emit("update:modelValue", u);
+    hasDuplicateParameter: C,
+    getNewValue: b
+  } = u;
+  function g(d) {
+    r.emit("change", d), r.emit("update:modelValue", d);
   }
-  function P() {
-    if (g())
-      return i == null || i.warning({ message: `配置中存在重复的${e.keyColumnTitle}，请修改。`, position: "top-center" }), !1;
-    const u = h();
-    return C(u), !0;
+  function j() {
+    if (C())
+      return l == null || l.warning({ message: `配置中存在重复的${e.keyColumnTitle}，请修改。`, position: "top-center" }), !1;
+    const d = b();
+    return g(d), !0;
   }
-  const b = S({
+  const h = S({
     title: e.dialogTitle,
     width: 675,
     height: 500,
@@ -58,34 +131,34 @@ function z(e, a, s) {
       {
         class: "btn btn-primary",
         text: "确定",
-        handle: () => P()
+        handle: () => j()
       }
     ]
   });
-  function l() {
-    C("");
+  function i() {
+    g("");
   }
-  function d() {
+  function s() {
     if (c(), typeof e.beforeOpen == "function") {
-      const u = e.beforeOpen();
-      if (!u)
+      const d = e.beforeOpen();
+      if (!d)
         return;
-      u.then((v) => {
+      d.then((v) => {
         const f = v == null ? void 0 : v.formContextData;
-        m.value = f || m.value || {};
-        const j = v == null ? void 0 : v.parameterDescriptors;
-        p.value = j || p.value || [];
+        p.value = f || p.value || {};
+        const P = v == null ? void 0 : v.parameterDescriptors;
+        m.value = P || m.value || [];
       });
     }
   }
   return {
-    modalConfigs: b,
-    beforeOpenModalDialog: d,
-    onClear: l,
-    changeValue: C
+    modalConfigs: h,
+    beforeOpenModalDialog: s,
+    onClear: i,
+    changeValue: g
   };
 }
-const $ = {
+const re = {
   /** 下拉选项的数据源 */
   options: { type: Array, default: [] },
   /** 下拉选项的ID字段 */
@@ -96,54 +169,54 @@ const $ = {
   textField: { type: String, default: "name" },
   /** 下拉选项的标题字段 */
   titleField: { type: String, default: "name" }
-}, H = /* @__PURE__ */ T({
+}, ae = /* @__PURE__ */ O({
   name: "FEditableComboPopupContainer",
-  props: $,
+  props: re,
   emits: ["select", "close"],
-  setup(e, a) {
-    const s = F(() => e.options.length === 0);
-    function i(l) {
-      a.emit("select", l);
+  setup(e, r) {
+    const u = V(() => e.options.length === 0);
+    function l(i) {
+      r.emit("select", i);
     }
-    function m() {
-      a.emit("close");
+    function p() {
+      r.emit("close");
     }
-    function p(l) {
-      return l[e.idField];
+    function m(i) {
+      return i[e.idField];
     }
-    function c(l) {
-      return l[e.textField];
+    function c(i) {
+      return i[e.textField];
     }
-    function g(l) {
-      return l[e.titleField] || "";
+    function C(i) {
+      return i[e.titleField] || "";
     }
-    function h() {
-      return o("div", {
+    function b() {
+      return n("div", {
         class: "fv-editable-combo-list-close",
-        onClick: m
-      }, [o("span", null, [w("关闭")])]);
+        onClick: p
+      }, [n("span", null, [w("关闭")])]);
     }
-    function C(l) {
-      return o("div", {
+    function g(i) {
+      return n("div", {
         class: "fv-editable-combo-list-item",
-        key: p(l),
-        title: g(l),
-        onClick: () => i(l)
-      }, [o("span", null, [c(l)])]);
+        key: m(i),
+        title: C(i),
+        onClick: () => l(i)
+      }, [n("span", null, [c(i)])]);
     }
-    function P() {
-      return e.options.map((l) => C(l));
+    function j() {
+      return e.options.map((i) => g(i));
     }
-    function b() {
-      return o("div", {
+    function h() {
+      return n("div", {
         class: "fv-editable-combo-list-placeholder"
-      }, [o("span", null, [w("无选项")])]);
+      }, [n("span", null, [w("无选项")])]);
     }
-    return () => o("div", {
+    return () => n("div", {
       class: "fv-editable-combo-list"
-    }, [s.value && b(), P(), h()]);
+    }, [u.value && h(), j(), b()]);
   }
-}), L = {
+}), ie = {
   /** 绑定值 */
   modelValue: { type: String, default: "" },
   /** 下拉选项的数据源 */
@@ -164,221 +237,221 @@ const $ = {
   autoApply: { type: Boolean, default: !0 },
   /** 是否在输入时自动根据当前值过滤选项 */
   filterOnType: { type: Boolean, default: !0 }
-}, q = /* @__PURE__ */ T({
+}, le = /* @__PURE__ */ O({
   name: "FEditableCombo",
-  props: L,
+  props: ie,
   emits: ["update:modelValue", "select"],
-  setup(e, a) {
-    const s = V(), i = V(""), m = F(() => Array.isArray(e.options) ? e.options.filter((d) => {
-      if (!d || typeof d != "object")
+  setup(e, r) {
+    const u = T(), l = T(""), p = V(() => Array.isArray(e.options) ? e.options.filter((s) => {
+      if (!s || typeof s != "object")
         return !1;
-      const u = d[e.valueField] || "";
-      return typeof u != "string" ? !1 : u.includes(i.value);
-    }) : []), p = F(() => m.value.length > 0);
-    function c(d) {
-      var u, v;
-      d ? (u = s.value) == null || u.showPopup() : (v = s.value) == null || v.hidePopup();
+      const d = s[e.valueField] || "";
+      return typeof d != "string" ? !1 : d.includes(l.value);
+    }) : []), m = V(() => p.value.length > 0);
+    function c(s) {
+      var d, v;
+      s ? (d = u.value) == null || d.showPopup() : (v = u.value) == null || v.hidePopup();
     }
-    function g(d) {
-      if (d.code === "Escape") {
+    function C(s) {
+      if (s.code === "Escape") {
         c(!1);
         return;
       }
-      e.filterOnType && (i.value = e.modelValue, p.value ? c(!0) : c(!1));
+      e.filterOnType && (l.value = e.modelValue, m.value ? c(!0) : c(!1));
     }
-    function h() {
-      i.value = "";
+    function b() {
+      l.value = "";
     }
-    function C() {
-      h(), p.value && c(!0);
+    function g() {
+      b(), m.value && c(!0);
     }
-    function P() {
-      h();
+    function j() {
+      b();
     }
-    function b(d) {
-      a.emit("update:modelValue", d);
+    function h(s) {
+      r.emit("update:modelValue", s);
     }
-    function l(d) {
-      if (a.emit("select", d), e.autoApply) {
-        const u = d[e.valueField];
-        b(u);
+    function i(s) {
+      if (r.emit("select", s), e.autoApply) {
+        const d = s[e.valueField];
+        h(d);
       }
       c(!1);
     }
-    return () => o(A, {
-      ref: s,
+    return () => n(R, {
+      ref: u,
       modelValue: e.modelValue,
-      "onUpdate:modelValue": b,
+      "onUpdate:modelValue": h,
       editable: !0,
       enableClear: !0,
       placeholder: e.placeholder,
       buttonContent: e.dropDownIcon,
       placement: "auto",
       popupClass: "fv-editable-combo-popup",
-      onClick: C,
-      onClickButton: P,
-      onKeyup: g
+      onClick: g,
+      onClickButton: j,
+      onKeyup: C
     }, {
-      default: () => [o(H, {
-        options: m.value,
+      default: () => [n(ae, {
+        options: p.value,
         idField: e.idField,
         valueField: e.valueField,
         textField: e.textField,
         titleField: e.titleField,
-        onSelect: l,
+        onSelect: i,
         onClose: () => c(!1)
       }, null)]
     });
   }
-}), G = {
+}), ue = {
   useParametersComposition: { type: Object, require: !0 },
   jsonEditorProps: { type: Object, default: {} },
   formContextData: { type: Object, default: {} }
-}, W = /* @__PURE__ */ T({
+}, de = /* @__PURE__ */ O({
   name: "FJsonEditorModalContainer",
-  props: G,
+  props: ue,
   emits: [],
   setup(e) {
     const {
-      parameterItems: a,
-      parameterCodeOptions: s,
-      appendNewParameter: i,
-      deleteParameterById: m,
-      onParameterCodeChanged: p
-    } = e.useParametersComposition, c = F(() => a.value.length === 0), g = F(() => !c.value);
-    function h() {
-      return o("div", {
+      parameterItems: r,
+      parameterCodeOptions: u,
+      appendNewParameter: l,
+      deleteParameterById: p,
+      onParameterCodeChanged: m
+    } = e.useParametersComposition, c = V(() => r.value.length === 0), C = V(() => !c.value);
+    function b() {
+      return n("div", {
         class: "fv-json-editor-header"
-      }, [o("div", {
+      }, [n("div", {
         class: "fv-json-editor-key-col"
-      }, [e.jsonEditorProps.keyColumnTitle]), o("div", {
+      }, [e.jsonEditorProps.keyColumnTitle]), n("div", {
         class: "fv-json-editor-value-col"
-      }, [e.jsonEditorProps.valueColumnTitle]), o("div", {
+      }, [e.jsonEditorProps.valueColumnTitle]), n("div", {
         class: "fv-json-editor-operation-col"
       }, [e.jsonEditorProps.operationColumnTitle])]);
     }
-    function C() {
-      return o("div", {
+    function g() {
+      return n("div", {
         class: "fv-json-editor-placeholder"
-      }, [o("div", {
+      }, [n("div", {
         class: "fv-json-editor-default-add-button",
-        onClick: i
-      }, [o("span", {
+        onClick: l
+      }, [n("span", {
         class: "fv-json-editor-default-add-icon f-icon f-icon-add"
-      }, null), o("span", {
+      }, null), n("span", {
         class: "fv-json-editor-default-add-text"
       }, [e.jsonEditorProps.addButtonText])])]);
     }
-    function P(f) {
-      return o(q, {
+    function j(f) {
+      return n(le, {
         modelValue: f.code,
-        "onUpdate:modelValue": [(j) => f.code = j, () => p(f.id)],
-        options: s.value,
+        "onUpdate:modelValue": [(P) => f.code = P, () => m(f.id)],
+        options: u.value,
         placeholder: e.jsonEditorProps.keyColumnPlaceholder
       }, null);
     }
-    function b(f) {
-      var j, O, E;
-      return o(M, {
+    function h(f) {
+      var P, D, x;
+      return n(K, {
         modelValue: f.value,
-        "onUpdate:modelValue": (x) => f.value = x,
+        "onUpdate:modelValue": (E) => f.value = E,
         editorType: f.editorType,
-        fieldData: (j = e.formContextData) == null ? void 0 : j.fieldData,
-        varData: (O = e.formContextData) == null ? void 0 : O.varData,
-        formData: (E = e.formContextData) == null ? void 0 : E.formData
+        fieldData: (P = e.formContextData) == null ? void 0 : P.fieldData,
+        varData: (D = e.formContextData) == null ? void 0 : D.varData,
+        formData: (x = e.formContextData) == null ? void 0 : x.formData
       }, null);
     }
-    function l(f) {
-      return o("div", {
+    function i(f) {
+      return n("div", {
         class: "fv-json-editor-row"
-      }, [o("div", {
+      }, [n("div", {
         class: "fv-json-editor-key-col"
-      }, [P(f)]), o("div", {
+      }, [j(f)]), n("div", {
         class: "fv-json-editor-value-col"
-      }, [b(f)]), o("div", {
+      }, [h(f)]), n("div", {
         class: "fv-json-editor-operation-col"
-      }, [o("div", {
+      }, [n("div", {
         class: "fv-json-editor-delete-button"
-      }, [o("span", {
+      }, [n("span", {
         class: "fv-json-editor-delete-icon f-icon f-icon-yxs_delete",
-        onClick: () => m(f.id)
+        onClick: () => p(f.id)
       }, null)])])]);
     }
-    function d() {
-      return a.value.map((f) => l(f));
+    function s() {
+      return r.value.map((f) => i(f));
     }
-    function u() {
-      return o("div", {
+    function d() {
+      return n("div", {
         class: "fv-json-editor-add-button",
-        onClick: i
-      }, [o("span", {
+        onClick: l
+      }, [n("span", {
         class: "fv-json-editor-add-icon f-icon f-icon-add"
-      }, null), o("span", {
+      }, null), n("span", {
         class: "fv-json-editor-add-text"
       }, [e.jsonEditorProps.addButtonText])]);
     }
     function v() {
-      return o("div", {
+      return n("div", {
         class: "fv-json-editor-body"
-      }, [c.value && C(), d(), g.value && u()]);
+      }, [c.value && g(), s(), C.value && d()]);
     }
-    return () => o("div", {
+    return () => n("div", {
       class: "fv-json-editor"
-    }, [h(), v()]);
+    }, [b(), v()]);
   }
 });
-function Y(e) {
-  const a = V([]), s = V([]), i = V(e.parameterDescriptors || []);
-  k(
+function se(e) {
+  const r = T([]), u = T([]), l = T(e.parameterDescriptors || []);
+  B(
     () => e.parameterDescriptors,
     (t) => {
-      i.value = t;
+      l.value = t;
     }
   );
-  const { guid: m } = K();
-  function p(t) {
-    if (a.value = [], s.value = [], !h(t))
+  const { guid: p } = _();
+  function m(t) {
+    if (r.value = [], u.value = [], !b(t))
       return;
-    const n = JSON.parse(t);
-    Object.keys(n).forEach((r) => {
-      const y = m(), D = l(r);
-      a.value.push(S({
+    const o = JSON.parse(t);
+    Object.keys(o).forEach((a) => {
+      const y = p(), F = i(a);
+      r.value.push(S({
         id: y,
-        code: r,
-        value: C(n[r], y),
-        editorType: D
+        code: a,
+        value: g(o[a], y),
+        editorType: F
       }));
     });
   }
-  k(
+  B(
     () => e.modelValue,
-    (t) => p(t)
+    (t) => m(t)
   );
   function c() {
-    p(e.modelValue);
+    m(e.modelValue);
   }
-  function g() {
+  function C() {
     const t = {};
-    return a.value.forEach((r) => {
-      const y = r == null ? void 0 : r.code;
-      y && y.trim().length > 0 && (t[y] = P(r.value, r.id));
+    return r.value.forEach((a) => {
+      const y = a == null ? void 0 : a.code;
+      y && y.trim().length > 0 && (t[y] = j(a.value, a.id));
     }), Object.keys(t).length === 0 ? "" : JSON.stringify(t);
   }
-  function h(t) {
+  function b(t) {
     try {
-      const n = JSON.parse(t);
-      if (!n || typeof n != "object" || Array.isArray(n))
+      const o = JSON.parse(t);
+      if (!o || typeof o != "object" || Array.isArray(o))
         return !1;
     } catch {
       return !1;
     }
     return !0;
   }
-  function C(t, n) {
-    return typeof t == "object" ? (s.value.push(n), JSON.stringify(t)) : t;
+  function g(t, o) {
+    return typeof t == "object" ? (u.value.push(o), JSON.stringify(t)) : t;
   }
-  function P(t, n) {
-    if (t && typeof t == "string" && s.value.includes(n))
+  function j(t, o) {
+    if (t && typeof t == "string" && u.value.includes(o))
       try {
         t = JSON.parse(t);
       } catch {
@@ -386,119 +459,124 @@ function Y(e) {
       }
     return t === void 0 ? "" : t;
   }
-  function b(t) {
-    const n = i.value;
-    return !t || !n ? void 0 : n.find((y) => y.id === t);
+  function h(t) {
+    const o = l.value;
+    return !t || !o ? void 0 : o.find((y) => y.id === t);
   }
-  function l(t) {
-    const n = b(t);
-    return n == null ? void 0 : n.editorType;
+  function i(t) {
+    const o = h(t);
+    return o == null ? void 0 : o.editorType;
   }
-  function d(t) {
+  function s(t) {
     if (!t)
       return "";
     switch (t) {
-      case R.Switch:
+      case U.Switch:
         return !1;
       default:
         return "";
     }
   }
-  function u(t) {
-    const n = b(t);
-    if (!n)
+  function d(t) {
+    const o = h(t);
+    if (!o)
       return;
-    const { editorType: r, defaultValue: y } = n;
-    return y !== void 0 ? y : d(r);
+    const { editorType: a, defaultValue: y } = o;
+    return y !== void 0 ? y : s(a);
   }
   function v() {
     const t = /* @__PURE__ */ new Set();
-    for (const n of a.value) {
-      const r = n == null ? void 0 : n.code;
-      if (!(!r || r.trim().length === 0)) {
-        if (t.has(r))
+    for (const o of r.value) {
+      const a = o == null ? void 0 : o.code;
+      if (!(!a || a.trim().length === 0)) {
+        if (t.has(a))
           return !0;
-        t.add(r);
+        t.add(a);
       }
     }
     return !1;
   }
   function f(t) {
-    const n = a.value.find((B) => B.id === t);
-    if (!n)
+    const o = r.value.find((A) => A.id === t);
+    if (!o)
       return;
-    const r = n.code;
-    if (!r)
+    const a = o.code;
+    if (!a)
       return;
-    const y = l(r);
-    n.editorType = y || void 0;
-    let D = u(r);
-    D = C(D, t), n.value = D;
+    const y = i(a);
+    o.editorType = y || void 0;
+    let F = d(a);
+    F = g(F, t), o.value = F;
   }
-  function j(t) {
-    const n = a.value.findIndex((r) => r.id === t);
-    n >= 0 && a.value.splice(n, 1);
+  function P(t) {
+    const o = r.value.findIndex((a) => a.id === t);
+    o >= 0 && r.value.splice(o, 1);
   }
-  function O() {
-    a.value.push(S({
-      id: m(),
+  function D() {
+    r.value.push(S({
+      id: p(),
       code: "",
       value: "",
       editorType: void 0
     }));
   }
-  const E = F(() => i.value.map((t) => {
-    let n = t.label;
-    return t.description && (n += `（${t.description}）`), {
+  const x = V(() => l.value.map((t) => {
+    let o = t.label;
+    return t.description && (o += `（${t.description}）`), {
       id: t.id,
-      name: n
+      name: o
     };
-  })), x = V(e.formContextData);
+  })), E = T(e.formContextData);
   return {
-    parameterItems: a,
-    parameterCodeOptions: E,
-    formContextData: x,
-    parameterDescriptors: i,
+    parameterItems: r,
+    parameterCodeOptions: x,
+    formContextData: E,
+    parameterDescriptors: l,
     initialize: c,
     onParameterCodeChanged: f,
     hasDuplicateParameter: v,
-    deleteParameterById: j,
-    appendNewParameter: O,
-    getNewValue: g
+    deleteParameterById: P,
+    appendNewParameter: D,
+    getNewValue: C
   };
 }
-const Q = /* @__PURE__ */ T({
+const k = /* @__PURE__ */ O({
   name: "FJsonEditor",
-  props: _,
+  props: N,
   emits: ["change", "update:modelValue"],
-  setup(e, a) {
-    const s = Y(e), {
-      modalConfigs: i,
-      onClear: m,
-      beforeOpenModalDialog: p,
+  setup(e, r) {
+    const u = se(e), {
+      modalConfigs: l,
+      onClear: p,
+      beforeOpenModalDialog: m,
       changeValue: c
-    } = z(e, a, s), {
-      formContextData: g
-    } = s;
-    return () => o(J, {
+    } = ne(e, r, u), {
+      formContextData: C
+    } = u;
+    return () => n(I, {
       modelValue: e.modelValue,
       enableClear: !0,
       buttonBehavior: "Modal",
-      modalOptions: i,
-      beforeOpen: p,
-      onClear: m,
+      modalOptions: l,
+      beforeOpen: m,
+      onClear: p,
       "onUpdate:modelValue": c
     }, {
-      default: () => [o(W, {
-        useParametersComposition: s,
+      default: () => [n(de, {
+        useParametersComposition: u,
         jsonEditorProps: e,
-        formContextData: g.value
+        formContextData: C.value
       }, null)]
     });
   }
-}), oe = U(Q);
+});
+k.register = (e, r, u, l) => {
+  e["json-editor"] = k, r["json-editor"] = oe;
+};
+const ge = q(k);
 export {
-  Q as FJsonEditor,
-  oe as default,
-  _ as jsonEditorProps
+  k as FJsonEditor,
+  ge as default,
+  N as jsonEditorProps,
+  oe as propsResolver
 };