@oneflowui/ui 0.7.0 → 0.8.1

package/dist/components/overlay/Drawer.vue.d.ts

@@ -6,6 +6,9 @@ type __VLS_Props = {
     maskClosable?: boolean;
     zIndex?: number;
     fullscreen?: boolean;
+    resizable?: boolean;
+    minWidth?: number;
+    maxWidth?: number;
 };
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -21,15 +24,20 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
+    "update:width": (value: number) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    "onUpdate:width"?: ((value: number) => any) | undefined;
 }>, {
     title: string;
     width: number;
     fullscreen: boolean;
+    maxWidth: number;
+    minWidth: number;
     zIndex: number;
     maskClosable: boolean;
     showClose: boolean;
+    resizable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     drawerRef: HTMLElement;
 }, any>;

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

@@ -1,7 +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-1f598ba6"]]);
+const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-c40443d8"]]);
 export {
-  m as default
+  p as default
 };

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

@@ -1,13 +1,13 @@
-import { defineComponent as p, useSlots as _, computed as V, 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 I, createElementBlock as a, normalizeStyle as f, createCommentVNode as l, createElementVNode as r, withModifiers as N, normalizeClass as R, unref as c, renderSlot as m, toDisplayString as $ } from "vue";
+import { defineComponent as V, useSlots as _, computed as W, onMounted as L, watch as S, onBeforeUnmount as M, openBlock as n, createBlock as T, Teleport as R, createVNode as c, Transition as D, withCtx as I, createElementBlock as a, normalizeStyle as m, createCommentVNode as l, createElementVNode as r, withModifiers as N, normalizeClass as P, unref as w, renderSlot as y, toDisplayString as $ } from "vue";
 import { X as g } from "lucide-vue-next";
-import { useFocusTrap as D } from "../../composables/useFocusTrap.js";
-const L = ["aria-label"], M = { class: "of-drawer__inner" }, F = {
+import { useFocusTrap as U } from "../../composables/useFocusTrap.js";
+const X = ["aria-label"], F = { class: "of-drawer__inner" }, K = {
   key: 0,
   class: "of-drawer__header"
-}, K = { class: "of-drawer__title" }, U = {
+}, j = { class: "of-drawer__title" }, q = {
   key: 0,
   class: "of-drawer__title-text"
-}, X = { class: "of-drawer__body" }, G = /* @__PURE__ */ p({
+}, A = { class: "of-drawer__body" }, O = /* @__PURE__ */ V({
   __name: "Drawer",
   props: {
     modelValue: { type: Boolean },
@@ -16,81 +16,106 @@ const L = ["aria-label"], M = { class: "of-drawer__inner" }, F = {
     showClose: { type: Boolean, default: !0 },
     maskClosable: { type: Boolean, default: !0 },
     zIndex: { default: 1e3 },
-    fullscreen: { type: Boolean, default: !1 }
+    fullscreen: { type: Boolean, default: !1 },
+    resizable: { type: Boolean, default: !1 },
+    minWidth: { default: 360 },
+    maxWidth: { default: 1320 }
   },
-  emits: ["update:modelValue"],
-  setup(e, { emit: y }) {
-    const d = e, w = y, h = _(), v = V(() => ({
-      "--of-drawer-width": `${d.width}px`
+  emits: ["update:modelValue", "update:width"],
+  setup(e, { emit: h }) {
+    const o = e, s = h, v = _(), b = W(() => ({
+      "--of-drawer-width": `${o.width}px`
     })), {
-      containerRef: k,
-      activate: b,
+      containerRef: p,
+      activate: k,
       deactivate: C
-    } = D();
-    function n() {
-      w("update:modelValue", !1);
+    } = U();
+    function i() {
+      s("update:modelValue", !1);
     }
-    function i(t) {
-      t.key === "Escape" && d.modelValue && n();
+    function z(t) {
+      return Math.max(o.minWidth, Math.min(o.maxWidth, t));
     }
-    return B(() => {
-      typeof document > "u" || document.addEventListener("keydown", i);
-    }), x(
-      () => d.modelValue,
+    function u(t) {
+      t.key === "Escape" && o.modelValue && i();
+    }
+    L(() => {
+      typeof document > "u" || document.addEventListener("keydown", u);
+    }), S(
+      () => o.modelValue,
       (t) => {
-        typeof document > "u" || (document.body.style.overflow = t ? "hidden" : "", t ? b() : C());
+        typeof document > "u" || (document.body.style.overflow = t ? "hidden" : "", t ? k() : C());
       },
       { immediate: !0 }
-    ), z(() => {
-      typeof document > "u" || (document.removeEventListener("keydown", i), document.body.style.overflow = "");
-    }), (t, s) => (o(), E(S, { to: "body" }, [
-      u(T, { name: "of-drawer" }, {
+    ), M(() => {
+      typeof document > "u" || (document.removeEventListener("keydown", u), document.body.style.overflow = "");
+    });
+    function x(t) {
+      if (!o.resizable || o.fullscreen || typeof window > "u") return;
+      t.preventDefault();
+      const d = (B) => {
+        const E = z(window.innerWidth - B.clientX);
+        s("update:width", E);
+      }, f = () => {
+        window.removeEventListener("pointermove", d), window.removeEventListener("pointerup", f);
+      };
+      window.addEventListener("pointermove", d), window.addEventListener("pointerup", f, { once: !0 });
+    }
+    return (t, d) => (n(), T(R, { to: "body" }, [
+      c(D, { name: "of-drawer" }, {
         default: I(() => [
-          e.modelValue ? (o(), a("div", {
+          e.modelValue ? (n(), a("div", {
             key: 0,
             class: "of-drawer-overlay",
-            style: f({ zIndex: e.zIndex })
+            style: m({ zIndex: e.zIndex })
           }, [
-            e.maskClosable ? (o(), a("button", {
+            e.maskClosable ? (n(), a("button", {
               key: 0,
               type: "button",
               class: "of-drawer-overlay__hitarea",
               "aria-label": "关闭抽屉",
-              onClick: n
+              onClick: i
             })) : l("", !0),
             r("aside", {
               ref_key: "drawerRef",
-              ref: k,
-              class: R(["of-drawer", { "of-drawer--fullscreen": e.fullscreen }]),
+              ref: p,
+              class: P(["of-drawer", { "of-drawer--fullscreen": e.fullscreen }]),
               role: "dialog",
               "aria-modal": "true",
               "aria-label": e.title,
-              style: f(v.value),
-              onClick: s[0] || (s[0] = N(() => {
+              style: m(b.value),
+              onClick: d[0] || (d[0] = N(() => {
               }, ["stop"]))
             }, [
-              r("div", M, [
-                c(h).title || e.title || e.showClose ? (o(), a("div", F, [
-                  r("div", K, [
-                    m(t.$slots, "title", {}, () => [
-                      e.title ? (o(), a("h3", U, $(e.title), 1)) : l("", !0)
+              e.resizable && !e.fullscreen ? (n(), a("button", {
+                key: 0,
+                type: "button",
+                class: "of-drawer__resize-handle",
+                "aria-label": "调整抽屉宽度",
+                onPointerdown: x
+              }, null, 32)) : l("", !0),
+              r("div", F, [
+                w(v).title || e.title || e.showClose ? (n(), a("div", K, [
+                  r("div", j, [
+                    y(t.$slots, "title", {}, () => [
+                      e.title ? (n(), a("h3", q, $(e.title), 1)) : l("", !0)
                     ], !0)
                   ]),
-                  e.showClose ? (o(), a("button", {
+                  e.showClose ? (n(), a("button", {
                     key: 0,
                     class: "of-drawer__close",
                     type: "button",
                     "aria-label": "关闭",
-                    onClick: n
+                    onClick: i
                   }, [
-                    u(c(g), { size: 18 })
+                    c(w(g), { size: 18 })
                   ])) : l("", !0)
                 ])) : l("", !0),
-                r("div", X, [
-                  m(t.$slots, "default", {}, void 0, !0)
+                r("div", A, [
+                  y(t.$slots, "default", {}, void 0, !0)
                 ])
               ])
-            ], 14, L)
+            ], 14, X)
           ], 4)) : l("", !0)
         ]),
         _: 3
@@ -99,5 +124,5 @@ const L = ["aria-label"], M = { class: "of-drawer__inner" }, F = {
   }
 });
 export {
-  G as default
+  O as default
 };

package/dist/components/overlay/SidePanel.vue.d.ts

@@ -5,6 +5,9 @@ export interface SidePanelProps {
     title?: string;
     showClose?: boolean;
     mode?: "lazy" | "persistent";
+    resizable?: boolean;
+    minWidth?: number;
+    maxWidth?: number;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -23,13 +26,18 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<SidePanelProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
+    "update:width": (value: number) => any;
 }, string, import('vue').PublicProps, Readonly<SidePanelProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    "onUpdate:width"?: ((value: number) => any) | undefined;
 }>, {
     title: string;
     width: number;
     mode: "lazy" | "persistent";
+    maxWidth: number;
+    minWidth: number;
     showClose: boolean;
+    resizable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     sidePanelRef: HTMLElement;
 }, any>;

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

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

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

@@ -1,122 +1,153 @@
-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 v } from "lucide-vue-next";
-import { useFocusTrap as R } from "../../composables/useFocusTrap.js";
-const T = ["aria-label"], N = {
-  key: 0,
+import { defineComponent as B, computed as S, onMounted as W, watch as $, onBeforeUnmount as L, openBlock as o, createBlock as R, Teleport as g, createElementBlock as l, Fragment as M, normalizeStyle as y, createCommentVNode as n, renderSlot as i, toDisplayString as v, createVNode as w, unref as p, createElementVNode as b, withDirectives as T, vShow as D } from "vue";
+import { X as k } from "lucide-vue-next";
+import { useFocusTrap as N } from "../../composables/useFocusTrap.js";
+const F = ["aria-label"], U = {
+  key: 1,
   class: "of-side-panel__header"
-}, D = {
+}, X = {
   key: 0,
   class: "of-side-panel__title"
-}, F = {
+}, x = {
   key: 1,
   class: "of-side-panel__title-placeholder"
-}, L = { class: "of-side-panel__body" }, K = ["aria-label"], M = {
-  key: 0,
+}, K = { class: "of-side-panel__body" }, j = ["aria-label"], q = {
+  key: 1,
   class: "of-side-panel__header"
-}, U = {
+}, A = {
   key: 0,
   class: "of-side-panel__title"
-}, X = {
+}, G = {
   key: 1,
   class: "of-side-panel__title-placeholder"
-}, j = { class: "of-side-panel__body" }, I = /* @__PURE__ */ _({
+}, H = { class: "of-side-panel__body" }, Q = /* @__PURE__ */ B({
   __name: "SidePanel",
   props: {
     modelValue: { type: Boolean },
     width: { default: 500 },
     title: { default: void 0 },
     showClose: { type: Boolean, default: !0 },
-    mode: { default: "persistent" }
+    mode: { default: "persistent" },
+    resizable: { type: Boolean, default: !1 },
+    minWidth: { default: 360 },
+    maxWidth: { default: 1320 }
   },
-  emits: ["update:modelValue"],
-  setup(e, { emit: k }) {
-    const i = e, w = k, n = V(() => ({
-      "--of-side-panel-width": `${i.width}px`
+  emits: ["update:modelValue", "update:width"],
+  setup(e, { emit: _ }) {
+    const a = e, r = _, u = S(() => ({
+      "--of-side-panel-width": `${a.width}px`
     })), {
-      containerRef: r,
-      activate: b,
-      deactivate: p
-    } = R();
-    function c(o) {
-      o.key === "Escape" && i.modelValue && s();
+      containerRef: c,
+      activate: z,
+      deactivate: V
+    } = N();
+    function f(t) {
+      t.key === "Escape" && a.modelValue && d();
     }
-    C(() => {
-      typeof document > "u" || document.addEventListener("keydown", c);
+    W(() => {
+      typeof document > "u" || document.addEventListener("keydown", f);
     }), $(
-      () => i.modelValue,
-      (o) => {
-        typeof document > "u" || (document.body.style.overflow = o ? "hidden" : "", o ? b() : p());
+      () => a.modelValue,
+      (t) => {
+        typeof document > "u" || (document.body.style.overflow = t ? "hidden" : "", t ? z() : V());
       },
       { immediate: !0 }
-    ), B(() => {
-      typeof document > "u" || (document.removeEventListener("keydown", c), document.body.style.overflow = "");
+    ), L(() => {
+      typeof document > "u" || (document.removeEventListener("keydown", f), document.body.style.overflow = "");
     });
-    function s() {
-      w("update:modelValue", !1);
+    function d() {
+      r("update:modelValue", !1);
     }
-    return (o, q) => (t(), S(E, { to: "body" }, [
-      e.mode === "lazy" ? (t(), l(g, { key: 0 }, [
-        e.modelValue ? (t(), l("aside", {
+    function C(t) {
+      return Math.max(a.minWidth, Math.min(a.maxWidth, t));
+    }
+    function m(t) {
+      if (!a.resizable || typeof window > "u") return;
+      t.preventDefault();
+      const s = (E) => {
+        const P = C(window.innerWidth - E.clientX);
+        r("update:width", P);
+      }, h = () => {
+        window.removeEventListener("pointermove", s), window.removeEventListener("pointerup", h);
+      };
+      window.addEventListener("pointermove", s), window.addEventListener("pointerup", h, { once: !0 });
+    }
+    return (t, s) => (o(), R(g, { to: "body" }, [
+      e.mode === "lazy" ? (o(), l(M, { key: 0 }, [
+        e.modelValue ? (o(), l("aside", {
           key: 0,
           ref_key: "sidePanelRef",
-          ref: r,
+          ref: c,
           class: "of-side-panel",
-          style: u(n.value),
+          style: y(u.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))
+          e.resizable ? (o(), l("button", {
+            key: 0,
+            type: "button",
+            class: "of-side-panel__resize-handle",
+            "aria-label": "调整面板宽度",
+            onPointerdown: m
+          }, null, 32)) : n("", !0),
+          t.$slots.header || e.title || e.showClose ? (o(), l("div", U, [
+            i(t.$slots, "header", {}, () => [
+              e.title ? (o(), l("h3", X, v(e.title), 1)) : (o(), l("div", x))
             ], !0),
-            e.showClose ? (t(), l("button", {
+            e.showClose ? (o(), l("button", {
               key: 0,
               class: "of-side-panel__close",
               type: "button",
               "aria-label": "关闭",
-              onClick: s
+              onClick: d
             }, [
-              m(y(v), { size: 18 })
-            ])) : a("", !0)
-          ])) : a("", !0),
-          h("div", L, [
-            d(o.$slots, "default", {}, void 0, !0)
+              w(p(k), { size: 18 })
+            ])) : n("", !0)
+          ])) : n("", !0),
+          b("div", K, [
+            i(t.$slots, "default", {}, void 0, !0)
           ])
-        ], 12, T)) : a("", !0)
-      ], 64)) : z((t(), l("aside", {
+        ], 12, F)) : n("", !0)
+      ], 64)) : T((o(), l("aside", {
         key: 1,
         ref_key: "sidePanelRef",
-        ref: r,
+        ref: c,
         class: "of-side-panel",
-        style: u(n.value),
+        style: y(u.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))
+        e.resizable ? (o(), l("button", {
+          key: 0,
+          type: "button",
+          class: "of-side-panel__resize-handle",
+          "aria-label": "调整面板宽度",
+          onPointerdown: m
+        }, null, 32)) : n("", !0),
+        t.$slots.header || e.title || e.showClose ? (o(), l("div", q, [
+          i(t.$slots, "header", {}, () => [
+            e.title ? (o(), l("h3", A, v(e.title), 1)) : (o(), l("div", G))
           ], !0),
-          e.showClose ? (t(), l("button", {
+          e.showClose ? (o(), l("button", {
             key: 0,
             class: "of-side-panel__close",
             type: "button",
             "aria-label": "关闭",
-            onClick: s
+            onClick: d
           }, [
-            m(y(v), { size: 18 })
-          ])) : a("", !0)
-        ])) : a("", !0),
-        h("div", j, [
-          d(o.$slots, "default", {}, void 0, !0)
+            w(p(k), { size: 18 })
+          ])) : n("", !0)
+        ])) : n("", !0),
+        b("div", H, [
+          i(t.$slots, "default", {}, void 0, !0)
         ])
-      ], 12, K)), [
-        [P, e.modelValue]
+      ], 12, j)), [
+        [D, e.modelValue]
       ])
     ]));
   }
 });
 export {
-  I as default
+  Q as default
 };

package/dist/components/table/DataTable.vue.d.ts

@@ -2,11 +2,17 @@ import { FieldDef as CellFieldDef } from './FieldCell.vue';
 import { Density, Task, TableColumn, ColorMap, DataRecord, TableSchema, ViewConfig, ActiveCell, AggregationConfig, GroupConfig } from '../../types';
 export interface BulkActionItem {
     key: string;
-    label: string;
+    label: string | ((context: BulkActionContext<unknown>) => string);
     variant?: "default" | "danger";
-    disabled?: boolean;
+    disabled?: boolean | ((context: BulkActionContext<unknown>) => boolean);
+    visible?: boolean | ((context: BulkActionContext<unknown>) => boolean);
     clearSelectionAfter?: boolean;
 }
+export interface BulkActionContext<TRecord = DataRecord> {
+    selectionCount: number;
+    rowIds: string[];
+    rows: TRecord[];
+}
 declare const _default: <T extends {
     id: string;
 } & Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{

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

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