@oneflowui/ui 0.4.2 → 0.4.4

package/dist/composables/useTable.js

@@ -0,0 +1,135 @@
+import { shallowRef as B, ref as d, computed as S, readonly as f, triggerRef as g } from "vue";
+let D = !1;
+function H(u = {}) {
+  const r = B(u.data ?? []), h = d(!1), p = d(null), i = d(/* @__PURE__ */ new Set()), n = d({ field: null, order: null }), t = d({
+    page: 1,
+    pageSize: u.pageSize ?? 20,
+    total: (u.data ?? []).length
+  });
+  function x(e) {
+    n.value.field === e ? (n.value.order = n.value.order === "asc" ? "desc" : n.value.order === "desc" ? null : "asc", n.value.order === null && (n.value.field = null)) : (n.value.field = e, n.value.order = "asc"), t.value.page = 1, i.value.clear(), u.serverSide && c();
+  }
+  function M(e, l) {
+    n.value = { field: e, order: l }, t.value.page = 1, i.value.clear(), u.serverSide && c();
+  }
+  function P(e) {
+    if (!n.value.field || !n.value.order) return e;
+    const l = n.value.field, a = n.value.order;
+    return [...e].sort((o, y) => {
+      const s = o[l], v = y[l];
+      if (s == null && v == null) return 0;
+      if (s == null) return 1;
+      if (v == null) return -1;
+      if (typeof s == "number" && typeof v == "number")
+        return a === "asc" ? s - v : v - s;
+      const R = String(s), b = String(v);
+      return a === "asc" ? R.localeCompare(b) : b.localeCompare(R);
+    });
+  }
+  function C(e) {
+    t.value.page = Math.max(1, Math.min(e, z.value)), u.serverSide && c();
+  }
+  function A(e) {
+    t.value.pageSize = e, t.value.page = 1, u.serverSide && c();
+  }
+  const z = S(
+    () => Math.max(1, Math.ceil(t.value.total / t.value.pageSize))
+  ), w = S(() => {
+    if (u.serverSide) return r.value;
+    const e = P(r.value);
+    t.value.total = e.length;
+    const { page: l, pageSize: a } = t.value;
+    return e.slice((l - 1) * a, l * a);
+  });
+  function m(e, l) {
+    const a = e.id;
+    return a == null && !D && (D = !0, console.warn(
+      "[OneUI] DataTable: row is missing an `id` field. Row selection may behave incorrectly after sorting or filtering. Please ensure each row has a unique `id` property."
+    )), a ?? l;
+  }
+  function F(e, l) {
+    const a = m(e, l);
+    i.value.has(a) ? i.value.delete(a) : i.value.add(a);
+  }
+  function I(e) {
+    i.value.size === e.length ? i.value.clear() : e.forEach((l, a) => i.value.add(m(l, a)));
+  }
+  function T(e, l) {
+    return i.value.has(m(e, l));
+  }
+  function k() {
+    i.value.clear();
+  }
+  const q = S(() => i.value.size), E = S(
+    () => w.value.length > 0 && i.value.size === w.value.length
+  );
+  async function c() {
+    if (u.onFetch) {
+      h.value = !0, p.value = null;
+      try {
+        const e = await u.onFetch({
+          page: t.value.page,
+          pageSize: t.value.pageSize,
+          sort: n.value
+        });
+        r.value = e.data, g(r), t.value.total = e.total;
+      } catch (e) {
+        p.value = e;
+      } finally {
+        h.value = !1;
+      }
+    }
+  }
+  function K() {
+    u.serverSide ? c() : t.value.page = 1;
+  }
+  function O(e) {
+    r.value = e, g(r), t.value.page = 1, u.serverSide || (t.value.total = e.length);
+  }
+  function U(e, l) {
+    const a = r.value, o = a.findIndex((y) => y.id === e);
+    o !== -1 && (a[o] = { ...a[o], ...l }, g(r));
+  }
+  function _(e, l) {
+    const a = r.value;
+    l !== void 0 && l >= 0 && l <= a.length ? a.splice(l, 0, e) : a.push(e), g(r), u.serverSide || (t.value.total = a.length);
+  }
+  function j(e) {
+    const l = new Set(e.map(String)), a = r.value;
+    r.value = a.filter(
+      (o) => !l.has(String(o.id))
+    ), g(r);
+    for (const o of e)
+      i.value.delete(o);
+    u.serverSide || (t.value.total = r.value.length);
+  }
+  return {
+    data: w,
+    rawData: f(r),
+    loading: f(h),
+    error: f(p),
+    sort: f(n),
+    pagination: f(t),
+    totalPages: z,
+    selectedRows: f(i),
+    selectedCount: q,
+    isAllSelected: E,
+    toggleSort: x,
+    setSort: M,
+    setPage: C,
+    setPageSize: A,
+    toggleRowSelection: F,
+    toggleSelectAll: I,
+    isRowSelected: T,
+    clearSelection: k,
+    refresh: K,
+    fetchData: c,
+    setData: O,
+    patchRow: U,
+    insertRow: _,
+    removeRows: j
+  };
+}
+export {
+  H as useTable
+};

package/dist/composables/useTableColumns.js

@@ -0,0 +1,24 @@
+import { computed as c } from "vue";
+import { DEFAULT_TABLE_COLUMNS as v } from "../constants/table.js";
+function d(e) {
+  return e.type === "number" || e.type === "date" ? e.type : e.type === "select" ? "status" : "string";
+}
+function f(e) {
+  return {
+    key: e.id,
+    label: e.name,
+    width: e.width,
+    type: d(e)
+  };
+}
+function T(e) {
+  return { columns: c(() => {
+    var u, t, i, n, r, s, m, a;
+    return (t = (u = e.columns) == null ? void 0 : u.value) != null && t.length ? e.columns.value : (r = (n = (i = e.schema) == null ? void 0 : i.value) == null ? void 0 : n.fields) != null && r.length ? ((a = (m = (s = e.view) == null ? void 0 : s.value) == null ? void 0 : m.visibleFields) != null && a.length ? e.schema.value.fields.filter(
+      (l) => e.view.value.visibleFields.includes(l.id)
+    ) : e.schema.value.fields).filter((l) => !l.hidden).map(f) : v;
+  }) };
+}
+export {
+  T as useTableColumns
+};

package/dist/composables/useTableData.js

@@ -0,0 +1,16 @@
+import { computed as d } from "vue";
+function n(t) {
+  return { rows: d(() => {
+    var a, r, u;
+    return (r = (a = t.records) == null ? void 0 : a.value) != null && r.length ? t.records.value.map((e) => ({
+      id: e.id,
+      ...e.fields,
+      createdAt: e.createdAt,
+      updatedAt: e.updatedAt,
+      __record: e
+    })) : ((u = t.tasks) == null ? void 0 : u.value) ?? [];
+  }) };
+}
+export {
+  n as useTableData
+};

package/dist/composables/useTableFilter.js

@@ -0,0 +1,97 @@
+import { shallowRef as m, ref as _, computed as p, readonly as g, triggerRef as o } from "vue";
+const h = [
+  { value: "contains", label: "包含" },
+  { value: "not_contains", label: "不包含" },
+  { value: "equals", label: "等于" },
+  { value: "not_equals", label: "不等于" },
+  { value: "starts_with", label: "开头是" },
+  { value: "ends_with", label: "结尾是" },
+  { value: "is_empty", label: "为空" },
+  { value: "is_not_empty", label: "不为空" }
+], y = [
+  { value: "equals", label: "等于" },
+  { value: "not_equals", label: "不等于" },
+  { value: "gt", label: "大于" },
+  { value: "gte", label: "大于等于" },
+  { value: "lt", label: "小于" },
+  { value: "lte", label: "小于等于" },
+  { value: "is_empty", label: "为空" },
+  { value: "is_not_empty", label: "不为空" }
+];
+function N() {
+  return Math.random().toString(36).slice(2, 8);
+}
+function w(n, e) {
+  const t = String(n ?? "").toLowerCase(), r = e.value.toLowerCase();
+  switch (e.operator) {
+    case "equals":
+      return t === r;
+    case "not_equals":
+      return t !== r;
+    case "contains":
+      return t.includes(r);
+    case "not_contains":
+      return !t.includes(r);
+    case "starts_with":
+      return t.startsWith(r);
+    case "ends_with":
+      return t.endsWith(r);
+    case "is_empty":
+      return t === "" || n == null;
+    case "is_not_empty":
+      return t !== "" && n != null;
+    case "gt":
+      return Number(n) > Number(e.value);
+    case "gte":
+      return Number(n) >= Number(e.value);
+    case "lt":
+      return Number(n) < Number(e.value);
+    case "lte":
+      return Number(n) <= Number(e.value);
+    default:
+      return !0;
+  }
+}
+function C(n = {}) {
+  const e = m([]), t = _("and"), r = p(() => e.value.length > 0);
+  function i(l) {
+    var u, a;
+    e.value.push({
+      id: N(),
+      field: l ?? ((a = (u = n.columns) == null ? void 0 : u[0]) == null ? void 0 : a.key) ?? "",
+      operator: "contains",
+      value: ""
+    }), o(e);
+  }
+  function c(l) {
+    e.value = e.value.filter((u) => u.id !== l), o(e);
+  }
+  function v(l, u) {
+    const a = e.value.findIndex((s) => s.id === l);
+    a !== -1 && (e.value[a] = { ...e.value[a], ...u }, o(e));
+  }
+  function b() {
+    e.value = [], o(e);
+  }
+  function d(l) {
+    return e.value.length ? l.filter((u) => {
+      const a = e.value.map((s) => s.field ? w(u[s.field], s) : !0);
+      return t.value === "and" ? a.every(Boolean) : a.some(Boolean);
+    }) : l;
+  }
+  const f = (l) => l === "number" ? y : h;
+  return {
+    conditions: g(e),
+    logic: t,
+    isActive: r,
+    addCondition: i,
+    removeCondition: c,
+    updateCondition: v,
+    clearConditions: b,
+    filterData: d,
+    operatorsFor: f
+  };
+}
+export {
+  C as useTableFilter
+};

package/dist/composables/useTableGroup.d.ts

@@ -1,12 +1,25 @@
 import { Ref } from 'vue';
+import { AggregationConfig } from '../types';
+export interface GroupConfig {
+    fieldId: string;
+}
 export interface UseTableGroupOptions<T> {
     data: Ref<T[]>;
-    groupBy: Ref<string | undefined>;
+    /** Single groupBy field (backwards-compatible) */
+    groupBy?: Ref<string | undefined>;
+    /** Multi-level group configs (takes priority over groupBy) */
+    groups?: Ref<GroupConfig[] | undefined>;
+    /** Aggregation configs applied to each group */
+    aggregations?: Ref<AggregationConfig[] | undefined>;
 }
 export type GroupHeaderItem = {
     __type: "group-header";
     __groupKey: string;
+    /** Full path for nested groups, e.g. ['status:done', 'priority:P0'] */
+    __groupPath: string[];
+    __groupLevel: number;
     __groupCount: number;
+    __aggregations?: Record<string, number>;
     id: string;
 };
 export type GroupedListItem<T> = (T & {

package/dist/composables/useTableGroup.js

@@ -0,0 +1,70 @@
+import { ref as G, computed as h, watch as I } from "vue";
+import { computeAggregations as L } from "../utils/aggregation.js";
+function b(r) {
+  const n = G(/* @__PURE__ */ new Set());
+  function p(e) {
+    const t = new Set(n.value);
+    t.has(e) ? t.delete(e) : t.add(e), n.value = t;
+  }
+  const f = h(() => {
+    var t, s;
+    if ((t = r.groups) != null && t.value && r.groups.value.length > 0)
+      return r.groups.value;
+    const e = (s = r.groupBy) == null ? void 0 : s.value;
+    return e ? [{ fieldId: e }] : [];
+  });
+  I(f, () => {
+    n.value = /* @__PURE__ */ new Set();
+  });
+  const d = h(() => {
+    var _;
+    const e = r.data.value, t = f.value;
+    if (t.length === 0)
+      return e.map((o) => ({ ...o, __type: "data-row" }));
+    const s = ((_ = r.aggregations) == null ? void 0 : _.value) ?? [], l = n.value, a = [];
+    return v(e, t, 0, [], l, s, a), a;
+  });
+  function g(e) {
+    return e && e.__type === "group-header";
+  }
+  return {
+    groupedItems: d,
+    collapsedGroups: n,
+    toggleGroup: p,
+    isGroupHeader: g
+  };
+}
+function v(r, n, p, f, d, g, e) {
+  const t = n[p];
+  if (!t) {
+    for (const o of r)
+      e.push({ ...o, __type: "data-row" });
+    return;
+  }
+  const s = t.fieldId, l = [], a = /* @__PURE__ */ new Map();
+  for (const o of r) {
+    const c = o[s], u = c != null ? String(c) : "";
+    a.has(u) || (l.push(u), a.set(u, [])), a.get(u).push(o);
+  }
+  const _ = p === n.length - 1;
+  for (const o of l) {
+    const c = a.get(o), u = [...f, `${s}:${o}`], i = u.join("/"), w = g.length > 0 ? L(c, g) : void 0, y = {
+      __type: "group-header",
+      __groupKey: o,
+      __groupPath: u,
+      __groupLevel: p,
+      __groupCount: c.length,
+      __aggregations: w,
+      id: `__group__${i}`
+    };
+    if (e.push(y), !d.has(i))
+      if (_)
+        for (const m of c)
+          e.push({ ...m, __type: "data-row" });
+      else
+        v(c, n, p + 1, u, d, g, e);
+  }
+}
+export {
+  b as useTableGroup
+};

package/dist/composables/useToast.js

@@ -0,0 +1,38 @@
+import { reactive as d } from "vue";
+const n = d([]);
+let s = 0;
+function u(t, e, r) {
+  const a = `toast-${Date.now()}-${s++}`, i = {
+    id: a,
+    type: t,
+    message: e,
+    title: r == null ? void 0 : r.title,
+    duration: (r == null ? void 0 : r.duration) ?? 3e3
+  };
+  return n.push(i), i.duration && i.duration > 0 && setTimeout(() => c(a), i.duration), a;
+}
+function c(t) {
+  const e = n.findIndex((r) => r.id === t);
+  e !== -1 && n.splice(e, 1);
+}
+function o() {
+  return {
+    /** 响应式 toast 列表 */
+    toasts: n,
+    /** 显示 info 类型通知 */
+    info: (t, e) => u("info", t, e),
+    /** 显示 success 类型通知 */
+    success: (t, e) => u("success", t, e),
+    /** 显示 warning 类型通知 */
+    warning: (t, e) => u("warning", t, e),
+    /** 显示 error 类型通知 */
+    error: (t, e) => u("error", t, e),
+    /** 移除指定 id 的 toast */
+    remove: c,
+    /** 清除所有 toast */
+    clear: () => n.splice(0, n.length)
+  };
+}
+export {
+  o as useToast
+};

package/dist/composables/useTypewriter.js

@@ -0,0 +1,56 @@
+import { ref as h, readonly as g } from "vue";
+function U(e = {}) {
+  const a = h(""), u = h(!1);
+  let f = "", r = 0, t = null, c = null;
+  const v = e.speed ?? 20;
+  function m() {
+    t !== null && (cancelAnimationFrame(t), t = null), c !== null && (clearTimeout(c), c = null);
+  }
+  function i() {
+    var l, n;
+    if (r >= f.length) {
+      u.value = !1, c = null, (l = e.onComplete) == null || l.call(e);
+      return;
+    }
+    a.value = f.slice(0, ++r), (n = e.onUpdate) == null || n.call(e, a.value), u.value && (c = setTimeout(i, v));
+  }
+  function x() {
+    if (typeof document < "u" && document.hidden) {
+      i();
+      return;
+    }
+    let l = 0;
+    function n(d) {
+      var T, y;
+      if (l || (l = d), d - l >= v) {
+        if (l = d, r >= f.length) {
+          u.value = !1, t = null, (T = e.onComplete) == null || T.call(e);
+          return;
+        }
+        a.value = f.slice(0, ++r), (y = e.onUpdate) == null || y.call(e, a.value);
+      }
+      u.value && (t = requestAnimationFrame(n));
+    }
+    t = requestAnimationFrame(n);
+  }
+  function A(l) {
+    f += l, u.value || (u.value = !0, x());
+  }
+  function C() {
+    m(), f = "", r = 0, a.value = "", u.value = !1;
+  }
+  function F() {
+    var l, n;
+    m(), a.value = f, r = f.length, u.value = !1, (l = e.onUpdate) == null || l.call(e, a.value), (n = e.onComplete) == null || n.call(e);
+  }
+  return {
+    displayText: g(a),
+    isTyping: g(u),
+    append: A,
+    reset: C,
+    flush: F
+  };
+}
+export {
+  U as useTypewriter
+};

package/dist/composables/useViewPersistence.d.ts

@@ -0,0 +1,98 @@
+import { ViewConfig } from '../types';
+export interface ViewStorageBackend {
+    /** 加载指定表的所有视图 */
+    load(tableId: string): Promise<ViewConfig[]>;
+    /** 保存/更新视图 */
+    save(tableId: string, view: ViewConfig): Promise<void>;
+    /** 删除视图 */
+    remove(tableId: string, viewId: string): Promise<void>;
+}
+export declare function createLocalStorageBackend(): ViewStorageBackend;
+export interface SupabaseViewBackendOptions {
+    /** Supabase client (最小接口：from().select/insert/update/delete) */
+    client: {
+        from(table: string): any;
+    };
+    /** 存储视图配置的表名，默认 'view_configs' */
+    tableName?: string;
+}
+export declare function createSupabaseBackend(options: SupabaseViewBackendOptions): ViewStorageBackend;
+export interface UseViewPersistenceOptions {
+    /** 表 ID */
+    tableId: string;
+    /** 存储后端，默认 localStorage */
+    backend?: ViewStorageBackend;
+    /** 默认视图（当没有保存的视图时使用） */
+    defaultView?: ViewConfig;
+    /** 是否自动加载（默认 true） */
+    autoLoad?: boolean;
+}
+export declare function useViewPersistence(options: UseViewPersistenceOptions): {
+    views: Readonly<import('vue').Ref<readonly {
+        readonly viewId: string;
+        readonly viewType: import('..').ViewType;
+        readonly name: string;
+        readonly visibleFields: readonly string[];
+        readonly sorts?: readonly {
+            readonly fieldId: string;
+            readonly direction: "asc" | "desc";
+        }[] | undefined;
+        readonly groups?: readonly {
+            readonly fieldId: string;
+        }[] | undefined;
+        readonly filters?: readonly {
+            readonly fieldId: string;
+            readonly operator: "eq" | "neq" | "contains" | "gt" | "lt" | "is_empty" | "is_not_empty";
+            readonly value?: string | number | boolean | readonly string[] | null | undefined;
+        }[] | undefined;
+        readonly kanbanFieldId?: string | undefined;
+        readonly galleryCoverFieldId?: string | undefined;
+        readonly galleryCardFields?: readonly string[] | undefined;
+        readonly aggregations?: readonly {
+            readonly fieldId: string;
+            readonly fn: import('..').AggregationFn;
+        }[] | undefined;
+        readonly fixedColumns?: readonly string[] | undefined;
+    }[], readonly {
+        readonly viewId: string;
+        readonly viewType: import('..').ViewType;
+        readonly name: string;
+        readonly visibleFields: readonly string[];
+        readonly sorts?: readonly {
+            readonly fieldId: string;
+            readonly direction: "asc" | "desc";
+        }[] | undefined;
+        readonly groups?: readonly {
+            readonly fieldId: string;
+        }[] | undefined;
+        readonly filters?: readonly {
+            readonly fieldId: string;
+            readonly operator: "eq" | "neq" | "contains" | "gt" | "lt" | "is_empty" | "is_not_empty";
+            readonly value?: string | number | boolean | readonly string[] | null | undefined;
+        }[] | undefined;
+        readonly kanbanFieldId?: string | undefined;
+        readonly galleryCoverFieldId?: string | undefined;
+        readonly galleryCardFields?: readonly string[] | undefined;
+        readonly aggregations?: readonly {
+            readonly fieldId: string;
+            readonly fn: import('..').AggregationFn;
+        }[] | undefined;
+        readonly fixedColumns?: readonly string[] | undefined;
+    }[]>>;
+    activeView: import('vue').ComputedRef<ViewConfig>;
+    activeViewId: import('vue').Ref<string, string>;
+    viewList: import('vue').ComputedRef<{
+        id: string;
+        name: string;
+        type: import('..').ViewType;
+    }[]>;
+    loading: Readonly<import('vue').Ref<boolean, boolean>>;
+    error: Readonly<import('vue').Ref<Error | null, Error | null>>;
+    loadViews: () => Promise<void>;
+    saveView: (config?: Partial<ViewConfig>) => Promise<void>;
+    createView: (name: string, baseConfig?: Partial<ViewConfig>) => Promise<string>;
+    deleteView: (viewId: string) => Promise<void>;
+    switchView: (viewId: string) => void;
+    duplicateView: (sourceViewId: string, newName: string) => Promise<string>;
+    updateActiveView: (patch: Partial<ViewConfig>) => void;
+};