@oneflowui/ui 0.6.0 → 0.8.0

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 f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-6f065a71"]]);
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-33d4366a"]]);
 export {
-  f as default
+  m as default
 };

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

@@ -1,121 +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(() => ({
-      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());
-      }
-    ), B(() => {
-      typeof document > "u" || (document.removeEventListener("keydown", c), document.body.style.overflow = "");
+      () => a.modelValue,
+      (t) => {
+        typeof document > "u" || (document.body.style.overflow = t ? "hidden" : "", t ? z() : V());
+      },
+      { immediate: !0 }
+    ), 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

@@ -1,5 +1,18 @@
 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 | ((context: BulkActionContext<unknown>) => string);
+    variant?: "default" | "danger";
+    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<{
@@ -55,7 +68,12 @@ declare const _default: <T extends {
         readonly "onSchema-hide-field"?: ((fieldId: string) => any) | undefined;
         readonly "onSchema-delete-field"?: ((fieldId: string) => any) | undefined;
         readonly "onSchema-duplicate-field"?: ((fieldId: string) => any) | undefined;
-    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onPaste" | "onRow-click" | "onAdd-row" | "onCell-edit" | "onRow-click-record" | "onSelection-change" | "onColumn-resize" | "onActive-cell-change" | "onRow-reorder" | "onRow-group-change" | "onDraft-commit" | "onDraft-discard" | "onDrafts-commit-all" | "onRow-delete" | "onSchema-add-field" | "onSchema-rename-field" | "onSchema-change-field-type" | "onSchema-hide-field" | "onSchema-delete-field" | "onSchema-duplicate-field"> & {
+        readonly "onBulk-action"?: ((payload: {
+            actionKey: string;
+            rowIds: string[];
+            rows: (T | DataRecord)[];
+        }) => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onPaste" | "onRow-click" | "onAdd-row" | "onCell-edit" | "onRow-click-record" | "onSelection-change" | "onColumn-resize" | "onActive-cell-change" | "onRow-reorder" | "onRow-group-change" | "onDraft-commit" | "onDraft-discard" | "onDrafts-commit-all" | "onRow-delete" | "onSchema-add-field" | "onSchema-rename-field" | "onSchema-change-field-type" | "onSchema-hide-field" | "onSchema-delete-field" | "onSchema-duplicate-field" | "onBulk-action"> & {
         tasks?: Task[];
         records?: DataRecord[];
         schema?: TableSchema;
@@ -90,6 +108,14 @@ declare const _default: <T extends {
         enableFieldManagement?: boolean;
         /** Density preset used for table, list, and detail affordances */
         density?: Density;
+        /** 显示默认行级快捷操作 */
+        showRowActions?: boolean;
+        /** 显示批量操作条 */
+        showSelectionBar?: boolean;
+        /** 批量操作定义，默认仅提供清空选择 */
+        bulkActionItems?: BulkActionItem[];
+        /** 开启表格容器感知密度收缩 */
+        containerResponsive?: boolean;
     } & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
@@ -168,7 +194,11 @@ declare const _default: <T extends {
     }) => void) & ((evt: "schema-change-field-type", payload: {
         fieldId: string;
         newType: string;
-    }) => void) & ((evt: "schema-hide-field", fieldId: string) => void) & ((evt: "schema-delete-field", fieldId: string) => void) & ((evt: "schema-duplicate-field", fieldId: string) => void);
+    }) => void) & ((evt: "schema-hide-field", fieldId: string) => void) & ((evt: "schema-delete-field", fieldId: string) => void) & ((evt: "schema-duplicate-field", fieldId: string) => void) & ((evt: "bulk-action", payload: {
+        actionKey: string;
+        rowIds: string[];
+        rows: (T | DataRecord)[];
+    }) => void);
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

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

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