@oneflowui/ui 0.4.2 → 0.4.3

package/dist/components/overlay/Dialog.vue2.js

@@ -0,0 +1,89 @@
+import { defineComponent as p, computed as d, openBlock as t, createBlock as c, withCtx as f, createElementVNode as o, normalizeClass as u, resolveDynamicComponent as v, toDisplayString as n, createElementBlock as r, createCommentVNode as s, renderSlot as x, unref as V, createTextVNode as w } from "vue";
+import { CheckCircle2 as B, AlertCircle as T, AlertTriangle as z, Info as D, Loader2 as N } from "lucide-vue-next";
+import A from "./Modal.vue.js";
+const E = { class: "of-dialog" }, I = { class: "of-dialog__content" }, M = { class: "of-dialog__title" }, S = {
+  key: 0,
+  class: "of-dialog__text"
+}, $ = ["disabled"], L = ["disabled"], G = /* @__PURE__ */ p({
+  __name: "Dialog",
+  props: {
+    modelValue: { type: Boolean },
+    title: { default: "提示" },
+    content: {},
+    confirmText: { default: "确认" },
+    cancelText: { default: "取消" },
+    type: { default: "info" },
+    loading: { type: Boolean, default: !1 },
+    width: { default: "420px" },
+    hideCancel: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "confirm", "cancel"],
+  setup(e, { emit: m }) {
+    const l = e, a = m, g = {
+      info: D,
+      warning: z,
+      danger: T,
+      success: B
+    }, h = d(() => `of-dialog__icon--${l.type}`), C = d(() => g[l.type]), b = d(
+      () => l.type === "danger" ? "of-dialog__btn--danger" : "of-dialog__btn--primary"
+    );
+    function y(i) {
+      a("update:modelValue", i);
+    }
+    function _() {
+      l.loading || a("confirm");
+    }
+    function k() {
+      a("cancel"), a("update:modelValue", !1);
+    }
+    return (i, U) => (t(), c(A, {
+      "model-value": e.modelValue,
+      width: e.width,
+      closable: !1,
+      "mask-closable": !e.loading,
+      class: "of-dialog-modal",
+      "onUpdate:modelValue": y
+    }, {
+      footer: f(() => [
+        e.hideCancel ? s("", !0) : (t(), r("button", {
+          key: 0,
+          class: "of-dialog__btn of-dialog__btn--cancel",
+          disabled: e.loading,
+          type: "button",
+          onClick: k
+        }, n(e.cancelText), 9, $)),
+        o("button", {
+          class: u(["of-dialog__btn", b.value]),
+          disabled: e.loading,
+          type: "button",
+          onClick: _
+        }, [
+          e.loading ? (t(), c(V(N), {
+            key: 0,
+            size: 14,
+            class: "of-dialog__spinner"
+          })) : s("", !0),
+          w(" " + n(e.confirmText), 1)
+        ], 10, L)
+      ]),
+      default: f(() => [
+        o("div", E, [
+          o("div", {
+            class: u(["of-dialog__icon-wrap", h.value])
+          }, [
+            (t(), c(v(C.value), { size: 28 }))
+          ], 2),
+          o("div", I, [
+            o("h3", M, n(e.title), 1),
+            e.content ? (t(), r("p", S, n(e.content), 1)) : s("", !0),
+            x(i.$slots, "default", {}, void 0, !0)
+          ])
+        ])
+      ]),
+      _: 3
+    }, 8, ["model-value", "width", "mask-closable"]));
+  }
+});
+export {
+  G as default
+};

package/dist/components/overlay/Drawer.vue.js

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

package/dist/components/overlay/Drawer.vue2.js

@@ -0,0 +1,112 @@
+import { defineComponent as V, useSlots as _, computed as B, ref as g, onMounted as S, watch as z, nextTick as D, onBeforeUnmount as L, openBlock as l, createBlock as T, Teleport as $, createVNode as v, Transition as I, withCtx as N, createElementBlock as d, normalizeStyle as b, createElementVNode as a, withModifiers as A, unref as h, renderSlot as k, toDisplayString as K, createCommentVNode as r } from "vue";
+import { X as M } from "lucide-vue-next";
+const R = ["aria-label"], q = { class: "of-drawer__inner" }, F = {
+  key: 0,
+  class: "of-drawer__header"
+}, U = { class: "of-drawer__title" }, X = {
+  key: 0,
+  class: "of-drawer__title-text"
+}, j = { class: "of-drawer__body" }, J = /* @__PURE__ */ V({
+  __name: "Drawer",
+  props: {
+    modelValue: { type: Boolean },
+    width: { default: 390 },
+    title: {},
+    showClose: { type: Boolean, default: !0 },
+    maskClosable: { type: Boolean, default: !0 },
+    zIndex: { default: 1e3 }
+  },
+  emits: ["update:modelValue"],
+  setup(o, { emit: C }) {
+    const i = o, E = C, p = _(), x = B(() => ({
+      width: `${i.width}px`
+    })), s = g(null);
+    let n = null;
+    function m() {
+      return s.value ? Array.from(
+        s.value.querySelectorAll(
+          'button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]), a[href]'
+        )
+      ).filter((e) => !e.closest('[aria-hidden="true"]')) : [];
+    }
+    function u(e) {
+      if (e.key !== "Tab") return;
+      const t = m();
+      if (t.length === 0) {
+        e.preventDefault();
+        return;
+      }
+      const c = t[0], w = t[t.length - 1];
+      e.shiftKey ? document.activeElement === c && (e.preventDefault(), w.focus()) : document.activeElement === w && (e.preventDefault(), c.focus());
+    }
+    function f() {
+      E("update:modelValue", !1);
+    }
+    function y(e) {
+      e.key === "Escape" && i.modelValue && f();
+    }
+    return S(() => {
+      typeof document > "u" || document.addEventListener("keydown", y);
+    }), z(
+      () => i.modelValue,
+      (e) => {
+        typeof document > "u" || (document.body.style.overflow = e ? "hidden" : "", e ? (n = document.activeElement, D(() => {
+          const t = m();
+          t.length && t[0].focus(), document.addEventListener("keydown", u);
+        })) : (document.removeEventListener("keydown", u), n == null || n.focus(), n = null));
+      },
+      { immediate: !0 }
+    ), L(() => {
+      typeof document > "u" || (document.removeEventListener("keydown", y), document.removeEventListener("keydown", u), document.body.style.overflow = "");
+    }), (e, t) => (l(), T($, { to: "body" }, [
+      v(I, { name: "of-drawer" }, {
+        default: N(() => [
+          o.modelValue ? (l(), d("div", {
+            key: 0,
+            class: "of-drawer-overlay",
+            style: b({ zIndex: o.zIndex }),
+            onClick: t[1] || (t[1] = (c) => o.maskClosable && f())
+          }, [
+            a("aside", {
+              ref_key: "drawerRef",
+              ref: s,
+              class: "of-drawer",
+              role: "dialog",
+              "aria-modal": "true",
+              "aria-label": o.title,
+              style: b(x.value),
+              onClick: t[0] || (t[0] = A(() => {
+              }, ["stop"]))
+            }, [
+              a("div", q, [
+                h(p).title || o.title || o.showClose ? (l(), d("div", F, [
+                  a("div", U, [
+                    k(e.$slots, "title", {}, () => [
+                      o.title ? (l(), d("h3", X, K(o.title), 1)) : r("", !0)
+                    ], !0)
+                  ]),
+                  o.showClose ? (l(), d("button", {
+                    key: 0,
+                    class: "of-drawer__close",
+                    type: "button",
+                    "aria-label": "关闭",
+                    onClick: f
+                  }, [
+                    v(h(M), { size: 18 })
+                  ])) : r("", !0)
+                ])) : r("", !0),
+                a("div", j, [
+                  k(e.$slots, "default", {}, void 0, !0)
+                ])
+              ])
+            ], 12, R)
+          ], 4)) : r("", !0)
+        ]),
+        _: 3
+      })
+    ]));
+  }
+});
+export {
+  J as default
+};

package/dist/components/overlay/Modal.vue.js

@@ -0,0 +1,7 @@
+import o from "./Modal.vue2.js";
+/* empty css           */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-4d50e8f4"]]);
+export {
+  m as default
+};

package/dist/components/overlay/Modal.vue2.js

@@ -0,0 +1,115 @@
+import { defineComponent as C, ref as V, watch as x, nextTick as B, onUnmounted as _, openBlock as l, createBlock as g, Teleport as z, createVNode as b, Transition as L, withCtx as $, createElementBlock as n, withModifiers as D, normalizeStyle as h, createElementVNode as k, normalizeClass as S, renderSlot as f, toDisplayString as T, unref as A, createCommentVNode as d } from "vue";
+import { X as I } from "lucide-vue-next";
+const M = ["aria-label"], N = {
+  key: 0,
+  class: "of-modal__header"
+}, K = {
+  key: 0,
+  class: "of-modal__title"
+}, R = {
+  key: 1,
+  class: "of-modal__title-placeholder"
+}, q = { class: "of-modal__body" }, F = {
+  key: 1,
+  class: "of-modal__footer"
+}, X = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "Modal",
+  props: {
+    modelValue: { type: Boolean },
+    width: { default: "500px" },
+    title: {},
+    closable: { type: Boolean, default: !0 },
+    maskClosable: { type: Boolean, default: !0 },
+    centered: { type: Boolean, default: !0 },
+    zIndex: { default: 1e3 }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { emit: w }) {
+    const i = t, E = w, s = V(null);
+    let a = null;
+    function m() {
+      return s.value ? Array.from(
+        s.value.querySelectorAll(
+          'button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]), a[href]'
+        )
+      ).filter((e) => !e.closest('[aria-hidden="true"]')) : [];
+    }
+    function r(e) {
+      if (e.key !== "Tab") return;
+      const o = m();
+      if (o.length === 0) {
+        e.preventDefault();
+        return;
+      }
+      const y = o[0], v = o[o.length - 1];
+      e.shiftKey ? document.activeElement === y && (e.preventDefault(), v.focus()) : document.activeElement === v && (e.preventDefault(), y.focus());
+    }
+    function u() {
+      E("update:modelValue", !1);
+    }
+    function p() {
+      i.maskClosable && u();
+    }
+    function c(e) {
+      e.key === "Escape" && i.modelValue && u();
+    }
+    return x(
+      () => i.modelValue,
+      (e) => {
+        typeof document > "u" || (e ? (document.body.style.overflow = "hidden", a = document.activeElement, document.addEventListener("keydown", c), B(() => {
+          const o = m();
+          o.length && o[0].focus(), document.addEventListener("keydown", r);
+        })) : (document.body.style.overflow = "", document.removeEventListener("keydown", c), document.removeEventListener("keydown", r), a == null || a.focus(), a = null));
+      }
+    ), _(() => {
+      typeof document > "u" || (document.body.style.overflow = "", document.removeEventListener("keydown", c), document.removeEventListener("keydown", r));
+    }), (e, o) => (l(), g(z, { to: "body" }, [
+      b(L, { name: "of-modal" }, {
+        default: $(() => [
+          t.modelValue ? (l(), n("div", {
+            key: 0,
+            class: "of-modal-backdrop",
+            style: h({ zIndex: t.zIndex }),
+            onClick: D(p, ["self"])
+          }, [
+            k("div", {
+              ref_key: "modalRef",
+              ref: s,
+              class: S(["of-modal", { "of-modal--centered": t.centered }]),
+              style: h({ width: t.width, maxWidth: "90vw" }),
+              role: "dialog",
+              "aria-modal": "true",
+              "aria-label": t.title
+            }, [
+              e.$slots.header || t.title || t.closable ? (l(), n("div", N, [
+                f(e.$slots, "header", {}, () => [
+                  t.title ? (l(), n("h3", K, T(t.title), 1)) : (l(), n("div", R))
+                ], !0),
+                t.closable ? (l(), n("button", {
+                  key: 0,
+                  class: "of-modal__close",
+                  onClick: u,
+                  "aria-label": "关闭",
+                  type: "button"
+                }, [
+                  b(A(I), { size: 18 })
+                ])) : d("", !0)
+              ])) : d("", !0),
+              k("div", q, [
+                f(e.$slots, "default", {}, void 0, !0)
+              ]),
+              e.$slots.footer ? (l(), n("div", F, [
+                f(e.$slots, "footer", {}, void 0, !0)
+              ])) : d("", !0)
+            ], 14, M)
+          ], 4)) : d("", !0)
+        ]),
+        _: 3
+      })
+    ]));
+  }
+});
+export {
+  X as default
+};

package/dist/components/overlay/SidePanel.vue.js

@@ -0,0 +1,7 @@
+import o from "./SidePanel.vue2.js";
+/* empty css               */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-a021fd10"]]);
+export {
+  f as default
+};

package/dist/components/overlay/SidePanel.vue2.js

@@ -0,0 +1,137 @@
+import { defineComponent as g, computed as S, ref as $, onMounted as B, watch as D, nextTick as L, onBeforeUnmount as z, openBlock as l, createBlock as P, Teleport as N, createElementBlock as o, Fragment as R, normalizeStyle as b, renderSlot as i, toDisplayString as k, createVNode as w, unref as p, createCommentVNode as d, createElementVNode as E, withDirectives as T, vShow as A } from "vue";
+import { X as _ } from "lucide-vue-next";
+const F = ["aria-label"], K = {
+  key: 0,
+  class: "of-side-panel__header"
+}, q = {
+  key: 0,
+  class: "of-side-panel__title"
+}, x = {
+  key: 1,
+  class: "of-side-panel__title-placeholder"
+}, M = { class: "of-side-panel__body" }, U = ["aria-label"], X = {
+  key: 0,
+  class: "of-side-panel__header"
+}, j = {
+  key: 0,
+  class: "of-side-panel__title"
+}, G = {
+  key: 1,
+  class: "of-side-panel__title-placeholder"
+}, H = { class: "of-side-panel__body" }, O = /* @__PURE__ */ g({
+  __name: "SidePanel",
+  props: {
+    modelValue: { type: Boolean },
+    width: { default: 500 },
+    title: {},
+    showClose: { type: Boolean, default: !0 },
+    mode: { default: "persistent" }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { emit: V }) {
+    const u = t, C = V, f = S(() => ({
+      width: `${u.width}px`
+    })), s = $(null);
+    let a = null;
+    function m() {
+      return s.value ? Array.from(
+        s.value.querySelectorAll(
+          'button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]), a[href]'
+        )
+      ).filter((e) => !e.closest('[aria-hidden="true"]')) : [];
+    }
+    function r(e) {
+      if (e.key !== "Tab") return;
+      const n = m();
+      if (n.length === 0) {
+        e.preventDefault();
+        return;
+      }
+      const h = n[0], v = n[n.length - 1];
+      e.shiftKey ? document.activeElement === h && (e.preventDefault(), v.focus()) : document.activeElement === v && (e.preventDefault(), h.focus());
+    }
+    function y(e) {
+      e.key === "Escape" && u.modelValue && c();
+    }
+    B(() => {
+      typeof document > "u" || document.addEventListener("keydown", y);
+    }), D(
+      () => u.modelValue,
+      (e) => {
+        typeof document > "u" || (document.body.style.overflow = e ? "hidden" : "", e ? (a = document.activeElement, L(() => {
+          const n = m();
+          n.length && n[0].focus(), document.addEventListener("keydown", r);
+        })) : (document.removeEventListener("keydown", r), a == null || a.focus(), a = null));
+      }
+    ), z(() => {
+      typeof document > "u" || (document.removeEventListener("keydown", y), document.removeEventListener("keydown", r), document.body.style.overflow = "");
+    });
+    function c() {
+      C("update:modelValue", !1);
+    }
+    return (e, n) => (l(), P(N, { to: "body" }, [
+      t.mode === "lazy" ? (l(), o(R, { key: 0 }, [
+        t.modelValue ? (l(), o("aside", {
+          key: 0,
+          ref_key: "sidePanelRef",
+          ref: s,
+          class: "of-side-panel",
+          style: b(f.value),
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": t.title
+        }, [
+          e.$slots.header || t.title || t.showClose ? (l(), o("div", K, [
+            i(e.$slots, "header", {}, () => [
+              t.title ? (l(), o("h3", q, k(t.title), 1)) : (l(), o("div", x))
+            ], !0),
+            t.showClose ? (l(), o("button", {
+              key: 0,
+              class: "of-side-panel__close",
+              type: "button",
+              "aria-label": "关闭",
+              onClick: c
+            }, [
+              w(p(_), { size: 18 })
+            ])) : d("", !0)
+          ])) : d("", !0),
+          E("div", M, [
+            i(e.$slots, "default", {}, void 0, !0)
+          ])
+        ], 12, F)) : d("", !0)
+      ], 64)) : T((l(), o("aside", {
+        key: 1,
+        ref_key: "sidePanelRef",
+        ref: s,
+        class: "of-side-panel",
+        style: b(f.value),
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": t.title
+      }, [
+        e.$slots.header || t.title || t.showClose ? (l(), o("div", X, [
+          i(e.$slots, "header", {}, () => [
+            t.title ? (l(), o("h3", j, k(t.title), 1)) : (l(), o("div", G))
+          ], !0),
+          t.showClose ? (l(), o("button", {
+            key: 0,
+            class: "of-side-panel__close",
+            type: "button",
+            "aria-label": "关闭",
+            onClick: c
+          }, [
+            w(p(_), { size: 18 })
+          ])) : d("", !0)
+        ])) : d("", !0),
+        E("div", H, [
+          i(e.$slots, "default", {}, void 0, !0)
+        ])
+      ], 12, U)), [
+        [A, t.modelValue]
+      ])
+    ]));
+  }
+});
+export {
+  O as default
+};

package/dist/components/split/SplitPane.vue.js

@@ -0,0 +1,8 @@
+import o from "./SplitPane.vue2.js";
+/* empty css               */
+/* empty css               */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-860f90a3"]]);
+export {
+  f as default
+};

package/dist/components/split/SplitPane.vue2.js

@@ -0,0 +1,68 @@
+import { defineComponent as g, ref as h, onUnmounted as S, openBlock as L, createElementBlock as M, normalizeClass as _, createElementVNode as c, normalizeStyle as w, renderSlot as z, withModifiers as x } from "vue";
+const B = { class: "of-split-pane__second" }, D = /* @__PURE__ */ g({
+  __name: "SplitPane",
+  props: {
+    direction: {},
+    defaultSize: {},
+    minSize: {},
+    maxSize: {}
+  },
+  setup(d) {
+    const n = d, u = h(n.defaultSize ?? 50), s = h(!1), r = h(null);
+    function p(e) {
+      e.preventDefault(), s.value = !0, document.addEventListener("mousemove", m), document.addEventListener("mouseup", o), document.addEventListener("touchmove", v, { passive: !1 }), document.addEventListener("touchend", o);
+    }
+    function m(e) {
+      if (!s.value || !r.value) return;
+      const t = r.value.getBoundingClientRect(), i = (n.direction || "horizontal") === "horizontal";
+      let a;
+      i ? a = (e.clientX - t.left) / t.width * 100 : a = (e.clientY - t.top) / t.height * 100;
+      const l = n.minSize ?? 10, f = n.maxSize ?? 90;
+      u.value = Math.min(f, Math.max(l, a));
+    }
+    function v(e) {
+      if (!s.value || !r.value) return;
+      e.preventDefault();
+      const t = e.touches[0], i = r.value.getBoundingClientRect(), a = (n.direction || "horizontal") === "horizontal";
+      let l;
+      a ? l = (t.clientX - i.left) / i.width * 100 : l = (t.clientY - i.top) / i.height * 100;
+      const f = n.minSize ?? 10, E = n.maxSize ?? 90;
+      u.value = Math.min(E, Math.max(f, l));
+    }
+    function o() {
+      s.value = !1, document.removeEventListener("mousemove", m), document.removeEventListener("mouseup", o), document.removeEventListener("touchmove", v), document.removeEventListener("touchend", o);
+    }
+    return S(() => {
+      document.removeEventListener("mousemove", m), document.removeEventListener("mouseup", o), document.removeEventListener("touchmove", v), document.removeEventListener("touchend", o);
+    }), (e, t) => (L(), M("div", {
+      ref_key: "containerRef",
+      ref: r,
+      class: _(["of-split-pane", [
+        `of-split-pane--${d.direction || "horizontal"}`,
+        { "of-split-pane--dragging": s.value }
+      ]])
+    }, [
+      c("div", {
+        class: "of-split-pane__first",
+        style: w(
+          (d.direction || "horizontal") === "vertical" ? { height: u.value + "%" } : { width: u.value + "%" }
+        )
+      }, [
+        z(e.$slots, "first", {}, void 0, !0)
+      ], 4),
+      c("div", {
+        class: "of-split-pane__divider",
+        onMousedown: p,
+        onTouchstart: x(p, ["prevent"])
+      }, [...t[0] || (t[0] = [
+        c("div", { class: "of-split-pane__divider-inner" }, null, -1)
+      ])], 32),
+      c("div", B, [
+        z(e.$slots, "second", {}, void 0, !0)
+      ])
+    ], 2));
+  }
+});
+export {
+  D as default
+};

package/dist/components/table/DataTable.vue.js

@@ -0,0 +1,7 @@
+import a from "./DataTable.vue2.js";
+/* empty css               */
+import o from "../../_virtual/_plugin-vue_export-helper.js";
+const p = /* @__PURE__ */ o(a, [["__scopeId", "data-v-85a23061"]]);
+export {
+  p as default
+};