@oneflowui/ui 0.4.2 → 0.4.4

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-cf8560a2"]]);
+export {
+  m as default
+};

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

@@ -0,0 +1,96 @@
+import { defineComponent as p, useSlots as V, computed as _, onMounted as B, watch as x, onBeforeUnmount as z, openBlock as o, createBlock as E, Teleport as S, createVNode as u, Transition as T, withCtx as $, createElementBlock as l, normalizeStyle as f, createElementVNode as d, withModifiers as I, unref as c, renderSlot as m, toDisplayString as N, createCommentVNode as n } from "vue";
+import { X as R } from "lucide-vue-next";
+import { useFocusTrap as g } from "../../composables/useFocusTrap.js";
+const D = ["aria-label"], L = { class: "of-drawer__inner" }, M = {
+  key: 0,
+  class: "of-drawer__header"
+}, F = { class: "of-drawer__title" }, K = {
+  key: 0,
+  class: "of-drawer__title-text"
+}, U = { class: "of-drawer__body" }, G = /* @__PURE__ */ p({
+  __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(e, { emit: y }) {
+    const r = e, w = y, v = V(), h = _(() => ({
+      width: `${r.width}px`
+    })), {
+      containerRef: k,
+      activate: C,
+      deactivate: b
+    } = g();
+    function i() {
+      w("update:modelValue", !1);
+    }
+    function s(t) {
+      t.key === "Escape" && r.modelValue && i();
+    }
+    return B(() => {
+      typeof document > "u" || document.addEventListener("keydown", s);
+    }), x(
+      () => r.modelValue,
+      (t) => {
+        typeof document > "u" || (document.body.style.overflow = t ? "hidden" : "", t ? C() : b());
+      },
+      { immediate: !0 }
+    ), z(() => {
+      typeof document > "u" || (document.removeEventListener("keydown", s), document.body.style.overflow = "");
+    }), (t, a) => (o(), E(S, { to: "body" }, [
+      u(T, { name: "of-drawer" }, {
+        default: $(() => [
+          e.modelValue ? (o(), l("div", {
+            key: 0,
+            class: "of-drawer-overlay",
+            style: f({ zIndex: e.zIndex }),
+            onClick: a[1] || (a[1] = (X) => e.maskClosable && i())
+          }, [
+            d("aside", {
+              ref_key: "drawerRef",
+              ref: k,
+              class: "of-drawer",
+              role: "dialog",
+              "aria-modal": "true",
+              "aria-label": e.title,
+              style: f(h.value),
+              onClick: a[0] || (a[0] = I(() => {
+              }, ["stop"]))
+            }, [
+              d("div", L, [
+                c(v).title || e.title || e.showClose ? (o(), l("div", M, [
+                  d("div", F, [
+                    m(t.$slots, "title", {}, () => [
+                      e.title ? (o(), l("h3", K, N(e.title), 1)) : n("", !0)
+                    ], !0)
+                  ]),
+                  e.showClose ? (o(), l("button", {
+                    key: 0,
+                    class: "of-drawer__close",
+                    type: "button",
+                    "aria-label": "关闭",
+                    onClick: i
+                  }, [
+                    u(c(R), { size: 18 })
+                  ])) : n("", !0)
+                ])) : n("", !0),
+                d("div", U, [
+                  m(t.$slots, "default", {}, void 0, !0)
+                ])
+              ])
+            ], 12, D)
+          ], 4)) : n("", !0)
+        ]),
+        _: 3
+      })
+    ]));
+  }
+});
+export {
+  G 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-98fd9016"]]);
+export {
+  m as default
+};

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

@@ -0,0 +1,99 @@
+import { defineComponent as b, watch as w, onUnmounted as p, openBlock as o, createBlock as C, Teleport as V, createVNode as r, Transition as B, withCtx as _, createElementBlock as l, withModifiers as z, normalizeStyle as c, createElementVNode as m, normalizeClass as E, renderSlot as s, toDisplayString as T, unref as $, createCommentVNode as a } from "vue";
+import { X as x } from "lucide-vue-next";
+import { useFocusTrap as I } from "../../composables/useFocusTrap.js";
+const L = ["aria-label"], M = {
+  key: 0,
+  class: "of-modal__header"
+}, N = {
+  key: 0,
+  class: "of-modal__title"
+}, R = {
+  key: 1,
+  class: "of-modal__title-placeholder"
+}, S = { class: "of-modal__body" }, g = {
+  key: 1,
+  class: "of-modal__footer"
+}, U = /* @__PURE__ */ b({
+  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(e, { emit: f }) {
+    const d = e, u = f, {
+      containerRef: y,
+      activate: h,
+      deactivate: k
+    } = I();
+    function n() {
+      u("update:modelValue", !1);
+    }
+    function v() {
+      d.maskClosable && n();
+    }
+    function i(t) {
+      t.key === "Escape" && d.modelValue && n();
+    }
+    return w(
+      () => d.modelValue,
+      (t) => {
+        typeof document > "u" || (t ? (document.body.style.overflow = "hidden", document.addEventListener("keydown", i), h()) : (document.body.style.overflow = "", document.removeEventListener("keydown", i), k()));
+      }
+    ), p(() => {
+      typeof document > "u" || (document.body.style.overflow = "", document.removeEventListener("keydown", i));
+    }), (t, A) => (o(), C(V, { to: "body" }, [
+      r(B, { name: "of-modal" }, {
+        default: _(() => [
+          e.modelValue ? (o(), l("div", {
+            key: 0,
+            class: "of-modal-backdrop",
+            style: c({ zIndex: e.zIndex }),
+            onClick: z(v, ["self"])
+          }, [
+            m("div", {
+              ref_key: "modalRef",
+              ref: y,
+              class: E(["of-modal", { "of-modal--centered": e.centered }]),
+              style: c({ width: e.width, maxWidth: "90vw" }),
+              role: "dialog",
+              "aria-modal": "true",
+              "aria-label": e.title
+            }, [
+              t.$slots.header || e.title || e.closable ? (o(), l("div", M, [
+                s(t.$slots, "header", {}, () => [
+                  e.title ? (o(), l("h3", N, T(e.title), 1)) : (o(), l("div", R))
+                ], !0),
+                e.closable ? (o(), l("button", {
+                  key: 0,
+                  class: "of-modal__close",
+                  onClick: n,
+                  "aria-label": "关闭",
+                  type: "button"
+                }, [
+                  r($(x), { size: 18 })
+                ])) : a("", !0)
+              ])) : a("", !0),
+              m("div", S, [
+                s(t.$slots, "default", {}, void 0, !0)
+              ]),
+              t.$slots.footer ? (o(), l("div", g, [
+                s(t.$slots, "footer", {}, void 0, !0)
+              ])) : a("", !0)
+            ], 14, L)
+          ], 4)) : a("", !0)
+        ]),
+        _: 3
+      })
+    ]));
+  }
+});
+export {
+  U 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 e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-45ffc40d"]]);
+export {
+  e as default
+};

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

@@ -0,0 +1,121 @@
+import { defineComponent as _, computed as V, onMounted as C, watch as $, onBeforeUnmount as B, openBlock as t, createBlock as S, Teleport as E, createElementBlock as l, Fragment as g, normalizeStyle as u, renderSlot as d, toDisplayString as f, createVNode as m, unref as y, createCommentVNode as a, createElementVNode as h, withDirectives as z, vShow as P } from "vue";
+import { X as k } from "lucide-vue-next";
+import { useFocusTrap as R } from "../../composables/useFocusTrap.js";
+const T = ["aria-label"], N = {
+  key: 0,
+  class: "of-side-panel__header"
+}, D = {
+  key: 0,
+  class: "of-side-panel__title"
+}, F = {
+  key: 1,
+  class: "of-side-panel__title-placeholder"
+}, L = { class: "of-side-panel__body" }, K = ["aria-label"], M = {
+  key: 0,
+  class: "of-side-panel__header"
+}, U = {
+  key: 0,
+  class: "of-side-panel__title"
+}, X = {
+  key: 1,
+  class: "of-side-panel__title-placeholder"
+}, j = { class: "of-side-panel__body" }, I = /* @__PURE__ */ _({
+  __name: "SidePanel",
+  props: {
+    modelValue: { type: Boolean },
+    width: { default: 500 },
+    title: {},
+    showClose: { type: Boolean, default: !0 },
+    mode: { default: "persistent" }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: v }) {
+    const i = e, w = v, n = V(() => ({
+      width: `${i.width}px`
+    })), {
+      containerRef: r,
+      activate: b,
+      deactivate: p
+    } = R();
+    function c(o) {
+      o.key === "Escape" && i.modelValue && s();
+    }
+    C(() => {
+      typeof document > "u" || document.addEventListener("keydown", c);
+    }), $(
+      () => i.modelValue,
+      (o) => {
+        typeof document > "u" || (document.body.style.overflow = o ? "hidden" : "", o ? b() : p());
+      }
+    ), B(() => {
+      typeof document > "u" || (document.removeEventListener("keydown", c), document.body.style.overflow = "");
+    });
+    function s() {
+      w("update:modelValue", !1);
+    }
+    return (o, q) => (t(), S(E, { to: "body" }, [
+      e.mode === "lazy" ? (t(), l(g, { key: 0 }, [
+        e.modelValue ? (t(), l("aside", {
+          key: 0,
+          ref_key: "sidePanelRef",
+          ref: r,
+          class: "of-side-panel",
+          style: u(n.value),
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": e.title
+        }, [
+          o.$slots.header || e.title || e.showClose ? (t(), l("div", N, [
+            d(o.$slots, "header", {}, () => [
+              e.title ? (t(), l("h3", D, f(e.title), 1)) : (t(), l("div", F))
+            ], !0),
+            e.showClose ? (t(), l("button", {
+              key: 0,
+              class: "of-side-panel__close",
+              type: "button",
+              "aria-label": "关闭",
+              onClick: s
+            }, [
+              m(y(k), { size: 18 })
+            ])) : a("", !0)
+          ])) : a("", !0),
+          h("div", L, [
+            d(o.$slots, "default", {}, void 0, !0)
+          ])
+        ], 12, T)) : a("", !0)
+      ], 64)) : z((t(), l("aside", {
+        key: 1,
+        ref_key: "sidePanelRef",
+        ref: r,
+        class: "of-side-panel",
+        style: u(n.value),
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": e.title
+      }, [
+        o.$slots.header || e.title || e.showClose ? (t(), l("div", M, [
+          d(o.$slots, "header", {}, () => [
+            e.title ? (t(), l("h3", U, f(e.title), 1)) : (t(), l("div", X))
+          ], !0),
+          e.showClose ? (t(), l("button", {
+            key: 0,
+            class: "of-side-panel__close",
+            type: "button",
+            "aria-label": "关闭",
+            onClick: s
+          }, [
+            m(y(k), { size: 18 })
+          ])) : a("", !0)
+        ])) : a("", !0),
+        h("div", j, [
+          d(o.$slots, "default", {}, void 0, !0)
+        ])
+      ], 12, K)), [
+        [P, e.modelValue]
+      ])
+    ]));
+  }
+});
+export {
+  I 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/ColumnHeaderMenu.vue.d.ts

@@ -0,0 +1,33 @@
+import { FieldType } from '../../types';
+type __VLS_Props = {
+    colKey: string;
+    colLabel: string;
+    fieldType?: FieldType;
+    sortOrder?: "asc" | "desc" | null;
+    visible: boolean;
+    x: number;
+    y: number;
+    deletable?: boolean;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    sort: (colKey: string, direction: "asc" | "desc") => any;
+    delete: (colKey: string) => any;
+    close: () => any;
+    rename: (colKey: string, newName: string) => any;
+    "change-type": (colKey: string, newType: FieldType) => any;
+    hide: (colKey: string) => any;
+    duplicate: (colKey: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSort?: ((colKey: string, direction: "asc" | "desc") => any) | undefined;
+    onDelete?: ((colKey: string) => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onRename?: ((colKey: string, newName: string) => any) | undefined;
+    "onChange-type"?: ((colKey: string, newType: FieldType) => any) | undefined;
+    onHide?: ((colKey: string) => any) | undefined;
+    onDuplicate?: ((colKey: string) => any) | undefined;
+}>, {
+    deletable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    renameInput: HTMLInputElement;
+}, any>;
+export default _default;

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

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