@oneflowui/ui 0.5.6 → 0.5.8

package/dist/components/field/FieldSelect.vue2.js

@@ -1,43 +1,43 @@
-import { defineComponent as V, ref as f, computed as b, onMounted as z, nextTick as A, onBeforeUnmount as I, watch as T, openBlock as l, createElementBlock as a, normalizeStyle as x, toDisplayString as _, createBlock as F, Teleport as O, unref as B, normalizeClass as h, createElementVNode as P, withModifiers as L, Fragment as U, renderList as K, createCommentVNode as W } from "vue";
-import { useBreakpoint as j } from "../../composables/useBreakpoint.js";
-const q = {
+import { defineComponent as S, ref as m, computed as E, onMounted as V, nextTick as z, onBeforeUnmount as A, watch as I, openBlock as o, createElementBlock as u, normalizeStyle as h, toDisplayString as b, createBlock as T, Teleport as O, unref as K, normalizeClass as D, createElementVNode as P, withKeys as g, withModifiers as v, Fragment as U, renderList as W, createCommentVNode as j } from "vue";
+import { useBreakpoint as q } from "../../composables/useBreakpoint.js";
+const G = ["aria-label"], H = {
   key: 1,
   class: "of-field-select__display"
-}, G = ["onMouseenter", "onClick"], H = { key: 1 }, X = /* @__PURE__ */ V({
+}, J = ["aria-selected"], Q = ["aria-selected", "onMouseenter", "onClick", "onFocusin", "onKeydown"], X = { key: 1 }, ee = /* @__PURE__ */ S({
   __name: "FieldSelect",
   props: {
     value: { type: [String, Number, Boolean, Array, null] },
     field: {}
   },
   emits: ["commit", "cancel", "tabNext"],
-  setup($, { emit: N }) {
-    const { isMobile: E } = j(), i = $, y = N, s = f(null), D = f(null), C = f({ top: "0px", left: "0px", width: "0px" }), p = f(!0), r = b(() => i.field.options ?? []), c = b(() => {
-      const e = typeof i.value == "string" ? i.value : null;
-      return r.value.findIndex((t) => t.value === e);
-    }), n = f(0);
-    function d() {
-      if (!s.value) return;
-      const e = s.value.getBoundingClientRect();
-      C.value = {
+  setup(C, { emit: N }) {
+    const c = C, x = N, { isMobile: M } = q(), d = m(null), B = m(null), L = m({ top: "0px", left: "0px", width: "0px" }), y = m(!0), i = E(() => c.field.options ?? []), s = E(() => {
+      const e = typeof c.value == "string" ? c.value : null;
+      return i.value.findIndex((t) => t.value === e);
+    }), n = m(0);
+    function f() {
+      if (!d.value) return;
+      const e = d.value.getBoundingClientRect();
+      L.value = {
         top: `${e.bottom}px`,
         left: `${e.left}px`,
         width: `${Math.max(e.width, 160)}px`
       };
     }
-    function m(e) {
-      p.value = !1, y("commit", e);
+    function a(e) {
+      y.value = !1, x("commit", e);
     }
-    function k() {
-      p.value && (p.value = !1, y("cancel"));
+    function $() {
+      y.value && (y.value = !1, x("cancel"));
     }
     function R(e) {
-      var t, o;
-      if (!r.value.length) {
-        e.key === "Escape" && (e.preventDefault(), k());
+      var t, r;
+      if (!i.value.length) {
+        e.key === "Escape" && (e.preventDefault(), $());
         return;
       }
       if (e.key === "ArrowDown") {
-        e.preventDefault(), n.value = Math.min(n.value + 1, r.value.length - 1);
+        e.preventDefault(), n.value = Math.min(n.value + 1, i.value.length - 1);
         return;
       }
       if (e.key === "ArrowUp") {
@@ -45,78 +45,96 @@ const q = {
         return;
       }
       if (e.key === "Enter") {
-        e.preventDefault(), m(((t = r.value[n.value]) == null ? void 0 : t.value) ?? null);
+        e.preventDefault(), a(((t = i.value[n.value]) == null ? void 0 : t.value) ?? null);
         return;
       }
       if (e.key === "Escape") {
-        e.preventDefault(), k();
+        e.preventDefault(), $();
         return;
       }
-      e.key === "Tab" && (e.preventDefault(), m(((o = r.value[n.value]) == null ? void 0 : o.value) ?? null), y("tabNext"));
+      e.key === "Tab" && (e.preventDefault(), a(((r = i.value[n.value]) == null ? void 0 : r.value) ?? null), x("tabNext"));
     }
-    function M(e) {
-      var o, v;
+    function F(e) {
+      var r, p;
       const t = e.target;
-      t && ((o = s.value) != null && o.contains(t) || (v = D.value) != null && v.contains(t) || k());
+      t && ((r = d.value) != null && r.contains(t) || (p = B.value) != null && p.contains(t) || $());
     }
-    z(() => {
-      n.value = c.value >= 0 ? c.value : 0, A(() => {
+    V(() => {
+      n.value = s.value >= 0 ? s.value : 0, z(() => {
         var e;
-        d(), (e = s.value) == null || e.focus();
-      }), window.addEventListener("resize", d), window.addEventListener("scroll", d, !0), window.addEventListener("mousedown", M, !0);
-    }), I(() => {
-      window.removeEventListener("resize", d), window.removeEventListener("scroll", d, !0), window.removeEventListener("mousedown", M, !0);
-    }), T(c, (e) => {
+        f(), (e = d.value) == null || e.focus();
+      }), window.addEventListener("resize", f), window.addEventListener("scroll", f, !0), window.addEventListener("mousedown", F, !0);
+    }), A(() => {
+      window.removeEventListener("resize", f), window.removeEventListener("scroll", f, !0), window.removeEventListener("mousedown", F, !0);
+    }), I(s, (e) => {
       e >= 0 && (n.value = e);
     });
-    const w = b(() => {
-      const e = typeof i.value == "string" ? i.value : null;
-      return r.value.find((t) => t.value === e);
+    const k = E(() => {
+      const e = typeof c.value == "string" ? c.value : null;
+      return i.value.find((t) => t.value === e);
     });
     return (e, t) => {
-      var o, v;
-      return l(), a("div", {
+      var r, p;
+      return o(), u("div", {
         ref_key: "triggerRef",
-        ref: s,
+        ref: d,
         class: "of-field-select",
         tabindex: "0",
+        role: "listbox",
+        "aria-label": C.field.label,
         onKeydown: R
       }, [
-        (o = w.value) != null && o.color ? (l(), a("span", {
+        (r = k.value) != null && r.color ? (o(), u("span", {
           key: 0,
           class: "of-field-select__badge",
-          style: x({ background: w.value.color })
-        }, _(w.value.label), 5)) : (l(), a("span", q, _(((v = w.value) == null ? void 0 : v.label) ?? "—"), 1)),
-        (l(), F(O, { to: "body" }, [
-          p.value ? (l(), a("div", {
+          style: h({ background: k.value.color })
+        }, b(k.value.label), 5)) : (o(), u("span", H, b(((p = k.value) == null ? void 0 : p.label) ?? "—"), 1)),
+        (o(), T(O, { to: "body" }, [
+          y.value ? (o(), u("div", {
             key: 0,
             ref_key: "dropdownRef",
-            ref: D,
-            class: h(["of-field-select__dropdown", { "of-field-select__dropdown--sheet": B(E) }]),
-            style: x(B(E) ? {} : C.value)
+            ref: B,
+            class: D(["of-field-select__dropdown", { "of-field-select__dropdown--sheet": K(M) }]),
+            style: h(K(M) ? {} : L.value)
           }, [
             P("div", {
-              class: h(["of-field-select__option of-field-select__option--clear", { active: n.value === -1, selected: c.value === -1 }]),
-              onClick: t[0] || (t[0] = L((u) => m(null), ["stop"]))
-            }, " — ", 2),
-            (l(!0), a(U, null, K(r.value, (u, g) => (l(), a("div", {
-              key: u.value,
-              class: h(["of-field-select__option", { active: g === n.value, selected: g === c.value }]),
-              onMouseenter: (S) => n.value = g,
-              onClick: L((S) => m(u.value), ["stop"])
+              class: D(["of-field-select__option of-field-select__option--clear", { active: n.value === -1, selected: s.value === -1 }]),
+              role: "option",
+              tabindex: "0",
+              "aria-selected": s.value === -1,
+              onClick: t[0] || (t[0] = v((l) => a(null), ["stop"])),
+              onFocusin: t[1] || (t[1] = (l) => n.value = -1),
+              onKeydown: [
+                t[2] || (t[2] = g(v((l) => a(null), ["prevent"]), ["enter"])),
+                t[3] || (t[3] = g(v((l) => a(null), ["prevent"]), ["space"]))
+              ]
+            }, " — ", 42, J),
+            (o(!0), u(U, null, W(i.value, (l, w) => (o(), u("div", {
+              key: l.value,
+              class: D(["of-field-select__option", { active: w === n.value, selected: w === s.value }]),
+              role: "option",
+              tabindex: "0",
+              "aria-selected": w === s.value,
+              onMouseenter: (_) => n.value = w,
+              onClick: v((_) => a(l.value), ["stop"]),
+              onFocusin: (_) => n.value = w,
+              onKeydown: [
+                g(v((_) => a(l.value), ["prevent"]), ["enter"]),
+                g(v((_) => a(l.value), ["prevent"]), ["space"])
+              ]
             }, [
-              u.color ? (l(), a("span", {
+              l.color ? (o(), u("span", {
                 key: 0,
                 class: "of-field-select__badge",
-                style: x({ background: u.color })
-              }, _(u.label), 5)) : (l(), a("span", H, _(u.label), 1))
-            ], 42, G))), 128))
-          ], 6)) : W("", !0)
+                style: h({ background: l.color })
+              }, b(l.label), 5)) : (o(), u("span", X, b(l.label), 1))
+            ], 42, Q))), 128))
+          ], 6)) : j("", !0)
         ]))
-      ], 544);
+      ], 40, G);
     };
   }
 });
 export {
-  X as default
+  ee as default
 };

package/dist/components/field/FieldText.vue.js

@@ -1,7 +1,7 @@
 import o from "./FieldText.vue2.js";
 /* empty css               */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-836136e5"]]);
+const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-a9d8988d"]]);
 export {
-  p as default
+  e as default
 };

package/dist/components/field/FieldText.vue2.js

@@ -1,33 +1,34 @@
-import { defineComponent as c, ref as i, onMounted as m, nextTick as s, withDirectives as v, openBlock as d, createElementBlock as x, vModelText as y } from "vue";
-const b = /* @__PURE__ */ c({
+import { defineComponent as m, ref as u, onMounted as p, nextTick as s, withDirectives as v, openBlock as d, createElementBlock as x, vModelText as y } from "vue";
+const b = ["aria-label"], B = /* @__PURE__ */ m({
   __name: "FieldText",
   props: {
     value: { type: [String, Number, Boolean, Array, null] },
     field: {}
   },
   emits: ["commit", "cancel", "tabNext"],
-  setup(a, { emit: r }) {
-    const f = a, t = r, o = i(null), n = i(String(f.value ?? ""));
-    m(() => s(() => {
+  setup(o, { emit: r }) {
+    const f = o, t = r, a = u(null), l = u(String(f.value ?? ""));
+    p(() => s(() => {
       var e;
-      return (e = o.value) == null ? void 0 : e.focus();
+      return (e = a.value) == null ? void 0 : e.focus();
     }));
-    function p(e) {
-      e.key === "Enter" && (e.preventDefault(), t("commit", n.value)), e.key === "Escape" && (e.preventDefault(), t("cancel")), e.key === "Tab" && (e.preventDefault(), t("commit", n.value), t("tabNext"));
+    function c(e) {
+      e.key === "Enter" && (e.preventDefault(), t("commit", l.value)), e.key === "Escape" && (e.preventDefault(), t("cancel")), e.key === "Tab" && (e.preventDefault(), t("commit", l.value), t("tabNext"));
     }
-    return (e, l) => v((d(), x("input", {
+    return (e, n) => v((d(), x("input", {
       ref_key: "inputRef",
-      ref: o,
+      ref: a,
+      "onUpdate:modelValue": n[0] || (n[0] = (i) => l.value = i),
       class: "of-field-input",
       type: "text",
-      "onUpdate:modelValue": l[0] || (l[0] = (u) => n.value = u),
-      onKeydown: p,
-      onBlur: l[1] || (l[1] = (u) => t("commit", n.value))
-    }, null, 544)), [
-      [y, n.value]
+      "aria-label": o.field.label,
+      onKeydown: c,
+      onBlur: n[1] || (n[1] = (i) => t("commit", l.value))
+    }, null, 40, b)), [
+      [y, l.value]
     ]);
   }
 });
 export {
-  b as default
+  B as default
 };

package/dist/components/field/FieldUrl.vue.js

@@ -1,7 +1,7 @@
 import o from "./FieldUrl.vue2.js";
 /* empty css              */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-8d4527db"]]);
+const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-e2908cdc"]]);
 export {
-  p as default
+  m as default
 };

package/dist/components/field/FieldUrl.vue2.js

@@ -1,33 +1,34 @@
-import { defineComponent as c, ref as i, onMounted as m, nextTick as s, withDirectives as v, openBlock as d, createElementBlock as y, vModelText as k } from "vue";
-const b = /* @__PURE__ */ c({
+import { defineComponent as m, ref as u, onMounted as p, nextTick as s, withDirectives as v, openBlock as d, createElementBlock as y, vModelText as b } from "vue";
+const k = ["aria-label"], B = /* @__PURE__ */ m({
   __name: "FieldUrl",
   props: {
     value: { type: [String, Number, Boolean, Array, null] },
     field: {}
   },
   emits: ["commit", "cancel", "tabNext"],
-  setup(r, { emit: a }) {
-    const f = r, t = a, o = i(null), n = i(String(f.value ?? ""));
-    m(() => s(() => {
+  setup(o, { emit: r }) {
+    const f = o, t = r, a = u(null), l = u(String(f.value ?? ""));
+    p(() => s(() => {
       var e;
-      return (e = o.value) == null ? void 0 : e.focus();
+      return (e = a.value) == null ? void 0 : e.focus();
     }));
-    function p(e) {
-      e.key === "Enter" && (e.preventDefault(), t("commit", n.value)), e.key === "Escape" && (e.preventDefault(), t("cancel")), e.key === "Tab" && (e.preventDefault(), t("commit", n.value), t("tabNext"));
+    function c(e) {
+      e.key === "Enter" && (e.preventDefault(), t("commit", l.value)), e.key === "Escape" && (e.preventDefault(), t("cancel")), e.key === "Tab" && (e.preventDefault(), t("commit", l.value), t("tabNext"));
     }
-    return (e, l) => v((d(), y("input", {
+    return (e, n) => v((d(), y("input", {
       ref_key: "inputRef",
-      ref: o,
+      ref: a,
+      "onUpdate:modelValue": n[0] || (n[0] = (i) => l.value = i),
       class: "of-field-input",
       type: "url",
-      "onUpdate:modelValue": l[0] || (l[0] = (u) => n.value = u),
-      onKeydown: p,
-      onBlur: l[1] || (l[1] = (u) => t("commit", n.value))
-    }, null, 544)), [
-      [k, n.value]
+      "aria-label": o.field.label,
+      onKeydown: c,
+      onBlur: n[1] || (n[1] = (i) => t("commit", l.value))
+    }, null, 40, k)), [
+      [b, l.value]
     ]);
   }
 });
 export {
-  b as default
+  B as default
 };

package/dist/components/form/FormDesigner.vue.js

@@ -1,7 +1,7 @@
 import o from "./FormDesigner.vue2.js";
 /* empty css                  */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-85067929"]]);
+const f = /* @__PURE__ */ r(o, [["__scopeId", "data-v-27f61d04"]]);
 export {
-  p as default
+  f as default
 };

package/dist/components/form/FormDesigner.vue2.js

@@ -1,8 +1,8 @@
-import { defineComponent as z, ref as T, watch as L, computed as P, openBlock as i, createElementBlock as u, createElementVNode as a, toDisplayString as c, createVNode as m, unref as f, createTextVNode as _, createCommentVNode as b, withCtx as $, Fragment as C, renderList as x, normalizeClass as j } from "vue";
+import { defineComponent as z, ref as T, watch as L, computed as P, openBlock as i, createElementBlock as u, createElementVNode as t, toDisplayString as c, createVNode as m, unref as f, createTextVNode as _, createCommentVNode as b, withCtx as $, Fragment as C, renderList as x, normalizeClass as j } from "vue";
 import { Plus as G, GripVertical as U, Trash2 as Y } from "lucide-vue-next";
 import { VueDraggable as A } from "vue-draggable-plus";
 import { isSelectField as h } from "../../types/index.js";
-const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header" }, K = { class: "of-form-designer__title" }, M = { class: "of-form-designer__meta" }, Q = { class: "of-form-designer__inputs" }, R = ["value", "disabled", "onInput"], W = ["value", "disabled", "onChange"], X = ["value"], Z = { class: "of-form-designer__checkbox-label" }, ee = ["checked", "disabled", "onChange"], ne = { class: "of-form-designer__checkbox-label" }, le = ["checked", "disabled", "onChange"], te = ["onClick"], ae = {
+const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header" }, K = { class: "of-form-designer__title" }, M = { class: "of-form-designer__meta" }, Q = { class: "of-form-designer__inputs" }, R = ["value", "disabled", "onInput"], W = ["value", "disabled", "onChange"], X = ["value"], Z = { class: "of-form-designer__checkbox-label" }, ee = ["checked", "disabled", "onChange"], ae = { class: "of-form-designer__checkbox-label" }, ne = ["checked", "disabled", "onChange"], le = ["onClick"], te = {
   key: 1,
   class: "of-form-designer__options-wrap"
 }, oe = ["value", "disabled", "onChange"], de = /* @__PURE__ */ z({
@@ -14,7 +14,7 @@ const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header"
   },
   emits: ["update:schema", "change"],
   setup(r, { emit: F }) {
-    const S = [
+    const d = r, p = F, S = [
       { value: "text", label: "文本" },
       { value: "number", label: "数字" },
       { value: "select", label: "单选" },
@@ -30,7 +30,7 @@ const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header"
       { value: "attachment", label: "附件" },
       { value: "relation", label: "关联" },
       { value: "formula", label: "公式" }
-    ], d = r, p = F, o = T(v(d.schema));
+    ], o = T(v(d.schema));
     L(
       () => d.schema,
       (e) => {
@@ -43,13 +43,13 @@ const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header"
       return {
         ...e,
         fields: e.fields.map(y),
-        views: e.views.map((n) => ({ ...n }))
+        views: e.views.map((a) => ({ ...a }))
       };
     }
     function y(e) {
       return h(e) ? {
         ...e,
-        options: e.options.map((n) => ({ ...n }))
+        options: e.options.map((a) => ({ ...a }))
       } : { ...e };
     }
     function s() {
@@ -64,48 +64,48 @@ const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header"
         hidden: !1
       });
     }
-    function k(e, n) {
+    function k(e, a) {
       switch (e) {
         case "text":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "number":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "select":
         case "multi_select":
           return {
-            ...n,
+            ...a,
             type: e,
             options: D()
           };
         case "date":
         case "datetime":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "checkbox":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "url":
         case "email":
         case "phone":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "rating":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "user":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "attachment":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "relation":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "formula":
-          return { ...n, type: e, formula: "" };
+          return { ...a, type: e, formula: "" };
         case "currency":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "richtext":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "auto_number":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "creator":
-          return { ...n, type: e };
+          return { ...a, type: e };
         case "progress":
-          return { ...n, type: e };
+          return { ...a, type: e };
       }
     }
     function D() {
@@ -118,42 +118,42 @@ const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header"
       d.readonly || (o.value.fields.push(V()), s());
     }
     function E(e) {
-      d.readonly || (o.value.fields = o.value.fields.filter((n) => n.id !== e), s());
+      d.readonly || (o.value.fields = o.value.fields.filter((a) => a.id !== e), s());
     }
-    function q(e, n) {
-      const t = o.value.fields.findIndex((g) => g.id === e.id);
-      if (t === -1) return;
-      const l = {
+    function q(e, a) {
+      const l = o.value.fields.findIndex((g) => g.id === e.id);
+      if (l === -1) return;
+      const n = {
         id: e.id,
         name: e.name,
         required: e.required,
         hidden: e.hidden,
         width: e.width
       };
-      o.value.fields[t] = h(e) && (n === "select" || n === "multi_select") ? {
-        ...l,
-        type: n,
+      o.value.fields[l] = h(e) && (a === "select" || a === "multi_select") ? {
+        ...n,
+        type: a,
         options: e.options.map(
           (g) => ({ ...g })
         )
-      } : k(n, l), s();
+      } : k(a, n), s();
     }
-    function I(e, n) {
+    function I(e, a) {
       if (!h(e)) return;
-      const t = n.split(",").map((l) => l.trim()).filter(Boolean);
-      e.options = t.map((l) => ({ value: l, label: l })), s();
+      const l = a.split(",").map((n) => n.trim()).filter(Boolean);
+      e.options = l.map((n) => ({ value: n, label: n })), s();
     }
     function N(e) {
-      return h(e) ? e.options.map((n) => n.label).join(", ") : "";
+      return h(e) ? e.options.map((a) => a.label).join(", ") : "";
     }
     function O() {
       s();
     }
-    return (e, n) => (i(), u("div", H, [
-      a("div", J, [
-        a("div", null, [
-          a("h3", K, c(r.title), 1),
-          a("p", M, c(o.value.name) + " · " + c(w.value), 1)
+    return (e, a) => (i(), u("div", H, [
+      t("div", J, [
+        t("div", null, [
+          t("h3", K, c(r.title), 1),
+          t("p", M, c(o.value.name) + " · " + c(w.value), 1)
         ]),
         r.readonly ? b("", !0) : (i(), u("button", {
           key: 0,
@@ -161,86 +161,91 @@ const H = { class: "of-form-designer" }, J = { class: "of-form-designer__header"
           onClick: B
         }, [
           m(f(G), { size: 14 }),
-          n[1] || (n[1] = _(" 添加字段 ", -1))
+          a[1] || (a[1] = _(" 添加字段 ", -1))
         ]))
       ]),
       m(f(A), {
         modelValue: o.value.fields,
-        "onUpdate:modelValue": n[0] || (n[0] = (t) => o.value.fields = t),
+        "onUpdate:modelValue": a[0] || (a[0] = (l) => o.value.fields = l),
         handle: ".of-form-designer__drag",
         disabled: r.readonly,
         animation: 150,
         onEnd: O
       }, {
         default: $(() => [
-          (i(!0), u(C, null, x(o.value.fields, (t) => (i(), u("div", {
-            key: t.id,
+          (i(!0), u(C, null, x(o.value.fields, (l) => (i(), u("div", {
+            key: l.id,
             class: "of-form-designer__row"
           }, [
-            a("span", {
+            t("span", {
               class: j(["of-form-designer__drag", { disabled: r.readonly }])
             }, [
               m(f(U), { size: 14 })
             ], 2),
-            a("div", Q, [
-              a("input", {
-                value: t.name,
+            t("div", Q, [
+              t("input", {
+                value: l.name,
                 class: "of-form-designer__input",
+                "aria-label": "字段名称",
                 placeholder: "字段名称",
                 disabled: r.readonly,
-                onInput: (l) => {
-                  t.name = String(l.target.value), s();
+                onInput: (n) => {
+                  l.name = String(n.target.value), s();
                 }
               }, null, 40, R),
-              a("select", {
+              t("select", {
                 class: "of-form-designer__select",
-                value: t.type,
+                "aria-label": "字段类型",
+                value: l.type,
                 disabled: r.readonly,
-                onChange: (l) => q(t, l.target.value)
+                onChange: (n) => q(l, n.target.value)
               }, [
-                (i(), u(C, null, x(S, (l) => a("option", {
-                  key: l.value,
-                  value: l.value
-                }, c(l.label), 9, X)), 64))
+                (i(), u(C, null, x(S, (n) => t("option", {
+                  key: n.value,
+                  value: n.value
+                }, c(n.label), 9, X)), 64))
               ], 40, W),
-              a("label", Z, [
-                a("input", {
+              t("span", Z, [
+                t("input", {
                   type: "checkbox",
-                  checked: !!t.required,
+                  "aria-label": "必填",
+                  checked: !!l.required,
                   disabled: r.readonly,
-                  onChange: (l) => {
-                    t.required = l.target.checked, s();
+                  onChange: (n) => {
+                    l.required = n.target.checked, s();
                   }
                 }, null, 40, ee),
-                n[2] || (n[2] = _(" 必填 ", -1))
+                a[2] || (a[2] = _(" 必填 ", -1))
               ]),
-              a("label", ne, [
-                a("input", {
+              t("span", ae, [
+                t("input", {
                   type: "checkbox",
-                  checked: !!t.hidden,
+                  "aria-label": "隐藏",
+                  checked: !!l.hidden,
                   disabled: r.readonly,
-                  onChange: (l) => {
-                    t.hidden = l.target.checked, s();
+                  onChange: (n) => {
+                    l.hidden = n.target.checked, s();
                   }
-                }, null, 40, le),
-                n[3] || (n[3] = _(" 隐藏 ", -1))
+                }, null, 40, ne),
+                a[3] || (a[3] = _(" 隐藏 ", -1))
               ])
             ]),
             r.readonly ? b("", !0) : (i(), u("button", {
               key: 0,
               class: "of-form-designer__remove-btn",
-              onClick: (l) => E(t.id)
+              onClick: (n) => E(l.id)
             }, [
               m(f(Y), { size: 14 })
-            ], 8, te)),
-            t.type === "select" || t.type === "multi_select" ? (i(), u("div", ae, [
-              n[4] || (n[4] = a("label", { class: "of-form-designer__options-label" }, "选项（逗号分隔）", -1)),
-              a("input", {
-                value: N(t),
+            ], 8, le)),
+            l.type === "select" || l.type === "multi_select" ? (i(), u("div", te, [
+              a[4] || (a[4] = t("span", { class: "of-form-designer__options-label" }, "选项（逗号分隔）", -1)),
+              t("input", {
+                value: N(l),
                 class: "of-form-designer__input",
+                "aria-label": "选项列表",
                 placeholder: "例如：待办, 进行中, 完成",
                 disabled: r.readonly,
-                onChange: (l) => I(t, String(l.target.value))
+                onChange: (n) => I(l, String(n.target.value))
               }, null, 40, oe)
             ])) : b("", !0)
           ]))), 128))