@oneflowui/ui 0.4.3 → 0.5.0

package/dist/components/table/TableGroupRow.vue2.js

@@ -1,12 +1,12 @@
-import { defineComponent as m, computed as n, openBlock as o, createElementBlock as l, createCommentVNode as c, createElementVNode as u, normalizeClass as _, normalizeStyle as p, createTextVNode as f, toDisplayString as r } from "vue";
-import { resolveBadge as y } from "../../composables/useBadge.js";
-const v = {
+import { defineComponent as w, computed as u, openBlock as l, createElementBlock as a, normalizeStyle as p, createCommentVNode as g, createElementVNode as d, normalizeClass as k, createTextVNode as x, toDisplayString as n, Fragment as h, renderList as B } from "vue";
+import { resolveBadge as C } from "../../composables/useBadge.js";
+const N = {
   key: 0,
   class: "of-table-group-row__checkbox-spacer"
-}, w = {
+}, K = {
   key: 2,
   class: "of-table-group-row__label"
-}, k = { class: "of-table-group-row__count" }, C = /* @__PURE__ */ m({
+}, L = { class: "of-table-group-row__count" }, T = /* @__PURE__ */ w({
   name: "TableGroupRow",
   __name: "TableGroupRow",
   props: {
@@ -14,35 +14,45 @@ const v = {
     count: {},
     collapsed: { type: Boolean, default: !1 },
     colorMap: {},
-    selectable: { type: Boolean, default: !0 }
+    selectable: { type: Boolean, default: !0 },
+    level: { default: 0 },
+    aggregations: {}
   },
   emits: ["toggle"],
-  setup(t, { emit: d }) {
-    const a = t, g = d, e = n(() => a.colorMap ? y(a.groupKey, a.colorMap) : null), b = n(() => a.groupKey || "(空)");
-    return (i, s) => (o(), l("div", {
+  setup(s, { emit: i }) {
+    const o = s, m = i, r = u(() => o.colorMap ? C(o.groupKey, o.colorMap) : null), b = u(() => o.groupKey || "(空)"), f = u(() => o.level * 16), _ = u(() => o.aggregations ? Object.entries(o.aggregations).map(([c, t]) => {
+      const [, e] = c.split(":"), y = e === "sum" ? "总计" : e === "avg" ? "平均" : e === "min" ? "最小" : e === "max" ? "最大" : "计数", v = typeof t == "number" && !Number.isInteger(t) ? t.toFixed(2) : String(t);
+      return { key: c, label: y, value: v };
+    }) : []);
+    return (c, t) => (l(), a("div", {
       class: "of-table-group-row",
-      onClick: s[0] || (s[0] = (h) => g("toggle"))
+      onClick: t[0] || (t[0] = (e) => m("toggle")),
+      style: p({ paddingLeft: `${12 + f.value}px` })
     }, [
-      t.selectable ? (o(), l("div", v)) : c("", !0),
-      u("span", {
-        class: _(["of-table-group-row__chevron", { "of-table-group-row__chevron--collapsed": t.collapsed }])
+      s.selectable ? (l(), a("div", N)) : g("", !0),
+      d("span", {
+        class: k(["of-table-group-row__chevron", { "of-table-group-row__chevron--collapsed": s.collapsed }])
       }, "▼", 2),
-      e.value ? (o(), l("span", {
+      r.value ? (l(), a("span", {
         key: 1,
         class: "of-table-group-row__badge",
-        style: p(e.value.style)
+        style: p(r.value.style)
       }, [
-        e.value.dot ? (o(), l("span", {
+        r.value.dot ? (l(), a("span", {
           key: 0,
           class: "of-table-group-row__badge-dot",
-          style: p({ background: e.value.dot })
-        }, null, 4)) : c("", !0),
-        f(" " + r(e.value.label), 1)
-      ], 4)) : (o(), l("span", w, r(b.value), 1)),
-      u("span", k, "(" + r(t.count) + ")", 1)
-    ]));
+          style: p({ background: r.value.dot })
+        }, null, 4)) : g("", !0),
+        x(" " + n(r.value.label), 1)
+      ], 4)) : (l(), a("span", K, n(b.value), 1)),
+      d("span", L, "(" + n(s.count) + ")", 1),
+      (l(!0), a(h, null, B(_.value, (e) => (l(), a("span", {
+        key: e.key,
+        class: "of-table-group-row__agg"
+      }, n(e.label) + ": " + n(e.value), 1))), 128))
+    ], 4));
   }
 });
 export {
-  C as default
+  T as default
 };

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

@@ -6,18 +6,34 @@ type __VLS_Props = {
     sortOrder?: "asc" | "desc";
     allSelected?: boolean;
     indeterminate?: boolean;
+    enableResize?: boolean;
+    enableFieldMenu?: boolean;
+    enableAddField?: boolean;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     sort: (key: string) => any;
     "select-all": () => any;
+    "resize-start": (event: MouseEvent, colKey: string) => any;
+    "resize-dblclick": (colKey: string) => any;
+    "header-contextmenu": (event: MouseEvent, colKey: string) => any;
+    "header-dblclick": (colKey: string) => any;
+    "add-field": () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     onSort?: ((key: string) => any) | undefined;
     "onSelect-all"?: (() => any) | undefined;
+    "onResize-start"?: ((event: MouseEvent, colKey: string) => any) | undefined;
+    "onResize-dblclick"?: ((colKey: string) => any) | undefined;
+    "onHeader-contextmenu"?: ((event: MouseEvent, colKey: string) => any) | undefined;
+    "onHeader-dblclick"?: ((colKey: string) => any) | undefined;
+    "onAdd-field"?: (() => any) | undefined;
 }>, {
     selectable: boolean;
     sortKey: string;
     sortOrder: "asc" | "desc";
     allSelected: boolean;
     indeterminate: boolean;
+    enableResize: boolean;
+    enableFieldMenu: boolean;
+    enableAddField: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

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

@@ -1,7 +1,7 @@
 import o from "./TableHeaderRow.vue2.js";
 /* empty css                    */
 import a from "../../_virtual/_plugin-vue_export-helper.js";
-const f = /* @__PURE__ */ a(o, [["__scopeId", "data-v-5f75e88a"]]);
+const m = /* @__PURE__ */ a(o, [["__scopeId", "data-v-1a914c68"]]);
 export {
-  f as default
+  m as default
 };

package/dist/components/table/TableHeaderRow.vue2.js

@@ -1,9 +1,9 @@
-import { defineComponent as u, openBlock as n, createElementBlock as a, createElementVNode as l, createCommentVNode as y, Fragment as k, renderList as b, normalizeStyle as v, normalizeClass as x, toDisplayString as C, createBlock as r, unref as i } from "vue";
-import { ChevronUp as S, ChevronDown as d } from "lucide-vue-next";
-const w = { class: "of-table-header" }, B = {
+import { defineComponent as v, openBlock as o, createElementBlock as i, createElementVNode as c, createCommentVNode as f, Fragment as x, renderList as z, withModifiers as d, normalizeStyle as C, normalizeClass as w, toDisplayString as B, createBlock as u, unref as r, createVNode as S } from "vue";
+import { ChevronUp as $, ChevronDown as k, Plus as g } from "lucide-vue-next";
+const D = { class: "of-table-header" }, F = {
   key: 0,
   class: "of-th of-th-checkbox"
-}, g = ["checked", "indeterminate"], z = ["aria-sort", "onClick"], K = { class: "of-th-label" }, $ = { class: "of-th-sort-icon" }, N = /* @__PURE__ */ u({
+}, M = ["checked", "indeterminate"], K = ["aria-sort", "onClick", "onContextmenu", "onDblclick"], O = { class: "of-th-label" }, R = { class: "of-th-sort-icon" }, N = ["onMousedown", "onDblclick"], E = /* @__PURE__ */ v({
   __name: "TableHeaderRow",
   props: {
     columns: {},
@@ -11,59 +11,80 @@ const w = { class: "of-table-header" }, B = {
     sortKey: { default: "" },
     sortOrder: { default: "asc" },
     allSelected: { type: Boolean, default: !1 },
-    indeterminate: { type: Boolean, default: !1 }
+    indeterminate: { type: Boolean, default: !1 },
+    enableResize: { type: Boolean, default: !1 },
+    enableFieldMenu: { type: Boolean, default: !1 },
+    enableAddField: { type: Boolean, default: !1 }
   },
-  emits: ["sort", "select-all"],
-  setup(e, { emit: f }) {
-    const c = f;
-    function h(o) {
-      if (o.width === "fill") {
-        const s = `${o.minWidth ?? 220}px`;
-        return { flex: `1 1 ${s}`, minWidth: s };
+  emits: ["sort", "select-all", "resize-start", "resize-dblclick", "header-contextmenu", "header-dblclick", "add-field"],
+  setup(e, { emit: h }) {
+    const s = h;
+    function y(n) {
+      if (n.width === "fill") {
+        const l = `${n.minWidth ?? 220}px`;
+        return { flex: `1 1 ${l}`, minWidth: l };
       }
-      return { width: `${o.width}px`, flexShrink: "0", flexGrow: "0" };
+      return { width: `${n.width}px`, flexShrink: "0", flexGrow: "0" };
     }
-    function m(o) {
-      c("sort", o);
+    function m(n) {
+      s("sort", n);
     }
-    return (o, s) => (n(), a("div", w, [
-      e.selectable ? (n(), a("div", B, [
-        l("input", {
+    function b(n, l) {
+      n.stopPropagation(), s("resize-start", n, l);
+    }
+    return (n, l) => (o(), i("div", D, [
+      e.selectable ? (o(), i("div", F, [
+        c("input", {
           type: "checkbox",
           class: "of-checkbox",
           checked: e.allSelected,
           indeterminate: e.indeterminate,
-          onChange: s[0] || (s[0] = (t) => c("select-all"))
-        }, null, 40, g)
-      ])) : y("", !0),
-      (n(!0), a(k, null, b(e.columns, (t) => (n(), a("div", {
+          onChange: l[0] || (l[0] = (t) => s("select-all"))
+        }, null, 40, M)
+      ])) : f("", !0),
+      (o(!0), i(x, null, z(e.columns, (t) => (o(), i("div", {
         key: t.key,
         role: "columnheader",
-        class: x(["of-th", { "of-th--sortable": !0, "of-th--active": e.sortKey === t.key }]),
-        style: v(h(t)),
+        class: w(["of-th", { "of-th--sortable": !0, "of-th--active": e.sortKey === t.key }]),
+        style: C(y(t)),
         "aria-sort": e.sortKey === t.key ? e.sortOrder === "asc" ? "ascending" : "descending" : "none",
-        onClick: (O) => m(t.key)
+        onClick: (a) => m(t.key),
+        onContextmenu: d((a) => e.enableFieldMenu && s("header-contextmenu", a, t.key), ["prevent"]),
+        onDblclick: d((a) => e.enableFieldMenu && s("header-dblclick", t.key), ["stop"])
       }, [
-        l("span", K, C(t.label), 1),
-        l("span", $, [
-          e.sortKey === t.key && e.sortOrder === "asc" ? (n(), r(i(S), {
+        c("span", O, B(t.label), 1),
+        c("span", R, [
+          e.sortKey === t.key && e.sortOrder === "asc" ? (o(), u(r($), {
             key: 0,
             size: 12,
             class: "of-sort-icon-active"
-          })) : e.sortKey === t.key && e.sortOrder === "desc" ? (n(), r(i(d), {
+          })) : e.sortKey === t.key && e.sortOrder === "desc" ? (o(), u(r(k), {
             key: 1,
             size: 12,
             class: "of-sort-icon-active"
-          })) : (n(), r(i(d), {
+          })) : (o(), u(r(k), {
             key: 2,
             size: 12,
             class: "of-sort-icon-idle"
           }))
-        ])
-      ], 14, z))), 128))
+        ]),
+        e.enableResize ? (o(), i("div", {
+          key: 0,
+          class: "of-th-resizer",
+          onMousedown: (a) => b(a, t.key),
+          onDblclick: d((a) => s("resize-dblclick", t.key), ["stop"])
+        }, null, 40, N)) : f("", !0)
+      ], 46, K))), 128)),
+      e.enableAddField ? (o(), i("div", {
+        key: 1,
+        class: "of-th of-th-add",
+        onClick: l[1] || (l[1] = d((t) => s("add-field"), ["stop"]))
+      }, [
+        S(r(g), { size: 14 })
+      ])) : f("", !0)
     ]));
   }
 });
 export {
-  N as default
+  E as default
 };

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

@@ -0,0 +1,118 @@
+import { Component } from 'vue';
+import { TableColumn } from '../../types';
+import { FilterCondition, FilterLogic } from '../../composables/useTableFilter';
+export interface ViewSwitcherTab {
+    value: string;
+    label: string;
+    icon?: string | Component;
+}
+type __VLS_Props = {
+    /** 当前视图模式 */
+    currentView?: string;
+    /** 视图标签配置 */
+    viewTabs?: ViewSwitcherTab[];
+    /** 列配置 */
+    columns: TableColumn[];
+    /** 筛选条件 */
+    filterConditions?: readonly FilterCondition[];
+    /** 筛选逻辑 */
+    filterLogic?: FilterLogic;
+    /** 筛选是否激活 */
+    filterActive?: boolean;
+    /** 当前排序 */
+    currentSort?: {
+        field: string | null;
+        order: "asc" | "desc" | null;
+    };
+    /** 当前分组字段 */
+    currentGroup?: string;
+    /** 搜索关键词 */
+    searchKeyword?: string;
+    /** 显示控制 */
+    showViewSwitch?: boolean;
+    showFilter?: boolean;
+    showSort?: boolean;
+    showGroup?: boolean;
+    showColumns?: boolean;
+    showSearch?: boolean;
+    /** 可用的保存视图列表 */
+    savedViews?: {
+        id: string;
+        name: string;
+    }[];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        filterBtnRef: HTMLDivElement;
+        sortBtnRef: HTMLDivElement;
+        groupBtnRef: HTMLDivElement;
+        columnBtnRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    sort: (field: string) => any;
+    group: (field: string | null) => any;
+    "update:columns": (columns: TableColumn[]) => any;
+    "update:currentView": (view: string) => any;
+    "update:searchKeyword": (keyword: string) => any;
+    "add-filter": () => any;
+    "remove-filter": (id: string) => any;
+    "update-filter": (id: string, update: Partial<FilterCondition>) => any;
+    "clear-filters": () => any;
+    "update:filterLogic": (logic: FilterLogic) => any;
+    "save-view": (name: string) => any;
+    "load-view": (viewId: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSort?: ((field: string) => any) | undefined;
+    onGroup?: ((field: string | null) => any) | undefined;
+    "onUpdate:columns"?: ((columns: TableColumn[]) => any) | undefined;
+    "onUpdate:currentView"?: ((view: string) => any) | undefined;
+    "onUpdate:searchKeyword"?: ((keyword: string) => any) | undefined;
+    "onAdd-filter"?: (() => any) | undefined;
+    "onRemove-filter"?: ((id: string) => any) | undefined;
+    "onUpdate-filter"?: ((id: string, update: Partial<FilterCondition>) => any) | undefined;
+    "onClear-filters"?: (() => any) | undefined;
+    "onUpdate:filterLogic"?: ((logic: FilterLogic) => any) | undefined;
+    "onSave-view"?: ((name: string) => any) | undefined;
+    "onLoad-view"?: ((viewId: string) => any) | undefined;
+}>, {
+    showFilter: boolean;
+    showGroup: boolean;
+    showSort: boolean;
+    showSearch: boolean;
+    currentView: string;
+    viewTabs: ViewSwitcherTab[];
+    filterConditions: readonly FilterCondition[];
+    filterLogic: FilterLogic;
+    filterActive: boolean;
+    currentSort: {
+        field: string | null;
+        order: "asc" | "desc" | null;
+    };
+    currentGroup: string;
+    searchKeyword: string;
+    showViewSwitch: boolean;
+    showColumns: boolean;
+    savedViews: {
+        id: string;
+        name: string;
+    }[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    filterBtnRef: HTMLDivElement;
+    sortBtnRef: HTMLDivElement;
+    groupBtnRef: HTMLDivElement;
+    columnBtnRef: HTMLDivElement;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

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

package/dist/components/table/TableToolbar.vue2.js

@@ -0,0 +1,273 @@
+import { defineComponent as Q, computed as T, ref as i, onMounted as W, onUnmounted as X, openBlock as o, createElementBlock as n, Fragment as V, renderList as L, normalizeClass as m, createBlock as C, resolveDynamicComponent as Y, unref as w, createCommentVNode as s, createElementVNode as a, toDisplayString as g, withModifiers as d, createVNode as b, Teleport as B, normalizeStyle as $, renderSlot as Z, nextTick as ee } from "vue";
+import { resolveIcon as te } from "../../utils/icon.js";
+import oe from "./TableFilterPanel.vue.js";
+import le from "./TableColumnManager.vue.js";
+import { ListFilter as ne, ArrowUpDown as re, Layers as se, Columns3 as ae, Search as ue } from "lucide-vue-next";
+const ie = { class: "of-table-toolbar" }, fe = {
+  key: 0,
+  class: "of-table-toolbar__views"
+}, de = ["onClick"], be = {
+  key: 1,
+  class: "of-table-toolbar__sep"
+}, ve = {
+  key: 0,
+  class: "of-table-toolbar__badge"
+}, ce = { class: "of-table-toolbar__simple-panel" }, ye = ["onClick"], me = {
+  key: 0,
+  class: "of-table-toolbar__sort-dir"
+}, we = { class: "of-table-toolbar__simple-panel" }, ke = ["onClick"], pe = {
+  key: 6,
+  class: "of-table-toolbar__search"
+}, Ce = ["value"], Ve = /* @__PURE__ */ Q({
+  __name: "TableToolbar",
+  props: {
+    currentView: { default: "table" },
+    viewTabs: { default: void 0 },
+    columns: {},
+    filterConditions: { default: void 0 },
+    filterLogic: { default: "and" },
+    filterActive: { type: Boolean, default: !1 },
+    currentSort: { default: void 0 },
+    currentGroup: { default: void 0 },
+    searchKeyword: { default: "" },
+    showViewSwitch: { type: Boolean, default: !0 },
+    showFilter: { type: Boolean, default: !0 },
+    showSort: { type: Boolean, default: !0 },
+    showGroup: { type: Boolean, default: !0 },
+    showColumns: { type: Boolean, default: !0 },
+    showSearch: { type: Boolean, default: !0 },
+    savedViews: { default: void 0 }
+  },
+  emits: ["update:currentView", "update:columns", "update:searchKeyword", "add-filter", "remove-filter", "update-filter", "clear-filters", "update:filterLogic", "sort", "group", "save-view", "load-view"],
+  setup(l, { emit: N }) {
+    const I = [
+      { value: "table", label: "表格", icon: "table-2" },
+      { value: "kanban", label: "看板", icon: "columns-3" },
+      { value: "timeline", label: "时间线", icon: "calendar" }
+    ], R = l, u = N, j = T(() => R.viewTabs ?? I), k = i(!1), v = i(!1), c = i(!1), p = i(!1), D = i(null), G = i(null), A = i(null), z = i(null), F = i({}), P = i({}), U = i({}), E = i({});
+    function q(r) {
+      if (!r) return {};
+      const e = r.getBoundingClientRect();
+      return {
+        top: `${e.bottom + 4}px`,
+        left: `${e.left}px`
+      };
+    }
+    function S(r) {
+      r !== "filter" && (k.value = !1), r !== "sort" && (v.value = !1), r !== "group" && (c.value = !1), r !== "column" && (p.value = !1);
+      const f = {
+        filter: { show: k, btnRef: D, style: F },
+        sort: { show: v, btnRef: G, style: P },
+        group: { show: c, btnRef: A, style: U },
+        column: { show: p, btnRef: z, style: E }
+      }[r];
+      f.show.value = !f.show.value, f.show.value && ee(() => {
+        f.style.value = q(f.btnRef.value);
+      });
+    }
+    function H() {
+      k.value = !1, v.value = !1, c.value = !1, p.value = !1;
+    }
+    function h(r) {
+      const e = r.target;
+      !e.closest(".of-table-toolbar__btn-group") && !e.closest(".of-table-toolbar__dropdown") && H();
+    }
+    W(() => document.addEventListener("click", h, !0)), X(() => document.removeEventListener("click", h, !0));
+    const J = T(() => R.columns.filter((r) => !r.hidden)), O = T(
+      () => R.columns.filter(
+        (r) => !r.hidden && (r.type === "status" || r.type === "string" || r.type === "priority")
+      )
+    );
+    return (r, e) => {
+      var f, x, K;
+      return o(), n("div", ie, [
+        l.showViewSwitch ? (o(), n("div", fe, [
+          (o(!0), n(V, null, L(j.value, (t) => (o(), n("button", {
+            key: t.value,
+            class: m(["of-table-toolbar__view-tab", { "of-table-toolbar__view-tab--active": l.currentView === t.value }]),
+            onClick: (y) => u("update:currentView", t.value)
+          }, [
+            t.icon ? (o(), C(Y(w(te)(t.icon)), {
+              key: 0,
+              class: "of-table-toolbar__tab-icon"
+            })) : s("", !0),
+            a("span", null, g(t.label), 1)
+          ], 10, de))), 128))
+        ])) : s("", !0),
+        l.showViewSwitch ? (o(), n("div", be)) : s("", !0),
+        l.showFilter ? (o(), n("div", {
+          key: 2,
+          ref_key: "filterBtnRef",
+          ref: D,
+          class: "of-table-toolbar__btn-group"
+        }, [
+          a("button", {
+            class: m(["of-table-toolbar__btn", { "of-table-toolbar__btn--active": l.filterActive }]),
+            onClick: e[0] || (e[0] = d((t) => S("filter"), ["stop"]))
+          }, [
+            b(w(ne), { size: 14 }),
+            e[19] || (e[19] = a("span", null, "筛选", -1)),
+            l.filterActive ? (o(), n("span", ve, g(((f = l.filterConditions) == null ? void 0 : f.length) ?? 0), 1)) : s("", !0)
+          ], 2),
+          (o(), C(B, { to: "body" }, [
+            k.value ? (o(), n("div", {
+              key: 0,
+              class: "of-table-toolbar__dropdown",
+              style: $(F.value),
+              onClick: e[7] || (e[7] = d(() => {
+              }, ["stop"]))
+            }, [
+              b(oe, {
+                conditions: l.filterConditions ?? [],
+                columns: l.columns,
+                logic: l.filterLogic ?? "and",
+                visible: !0,
+                onAddCondition: e[1] || (e[1] = (t) => u("add-filter")),
+                onRemoveCondition: e[2] || (e[2] = (t) => u("remove-filter", t)),
+                onUpdateCondition: e[3] || (e[3] = (t, y) => u("update-filter", t, y)),
+                onClear: e[4] || (e[4] = (t) => u("clear-filters")),
+                "onUpdate:logic": e[5] || (e[5] = (t) => u("update:filterLogic", t)),
+                onClose: e[6] || (e[6] = (t) => k.value = !1)
+              }, null, 8, ["conditions", "columns", "logic"])
+            ], 4)) : s("", !0)
+          ]))
+        ], 512)) : s("", !0),
+        l.showSort ? (o(), n("div", {
+          key: 3,
+          ref_key: "sortBtnRef",
+          ref: G,
+          class: "of-table-toolbar__btn-group"
+        }, [
+          a("button", {
+            class: m(["of-table-toolbar__btn", { "of-table-toolbar__btn--active": (x = l.currentSort) == null ? void 0 : x.field }]),
+            onClick: e[8] || (e[8] = d((t) => S("sort"), ["stop"]))
+          }, [
+            b(w(re), { size: 14 }),
+            e[20] || (e[20] = a("span", null, "排序", -1))
+          ], 2),
+          (o(), C(B, { to: "body" }, [
+            v.value ? (o(), n("div", {
+              key: 0,
+              class: "of-table-toolbar__dropdown",
+              style: $(P.value),
+              onClick: e[10] || (e[10] = d(() => {
+              }, ["stop"]))
+            }, [
+              a("div", ce, [
+                e[21] || (e[21] = a("div", { class: "of-table-toolbar__panel-title" }, "排序", -1)),
+                (o(!0), n(V, null, L(J.value, (t) => {
+                  var y, _, M;
+                  return o(), n("button", {
+                    key: t.key,
+                    class: m(["of-table-toolbar__sort-item", { active: ((y = l.currentSort) == null ? void 0 : y.field) === t.key }]),
+                    onClick: (ge) => {
+                      u("sort", t.key), v.value = !1;
+                    }
+                  }, [
+                    a("span", null, g(t.label), 1),
+                    ((_ = l.currentSort) == null ? void 0 : _.field) === t.key ? (o(), n("span", me, g(((M = l.currentSort) == null ? void 0 : M.order) === "asc" ? "↑" : "↓"), 1)) : s("", !0)
+                  ], 10, ye);
+                }), 128)),
+                (K = l.currentSort) != null && K.field ? (o(), n("button", {
+                  key: 0,
+                  class: "of-table-toolbar__clear-btn",
+                  onClick: e[9] || (e[9] = (t) => {
+                    u("sort", ""), v.value = !1;
+                  })
+                }, " 清除排序 ")) : s("", !0)
+              ])
+            ], 4)) : s("", !0)
+          ]))
+        ], 512)) : s("", !0),
+        l.showGroup ? (o(), n("div", {
+          key: 4,
+          ref_key: "groupBtnRef",
+          ref: A,
+          class: "of-table-toolbar__btn-group"
+        }, [
+          a("button", {
+            class: m(["of-table-toolbar__btn", { "of-table-toolbar__btn--active": !!l.currentGroup }]),
+            onClick: e[11] || (e[11] = d((t) => S("group"), ["stop"]))
+          }, [
+            b(w(se), { size: 14 }),
+            e[22] || (e[22] = a("span", null, "分组", -1))
+          ], 2),
+          (o(), C(B, { to: "body" }, [
+            c.value ? (o(), n("div", {
+              key: 0,
+              class: "of-table-toolbar__dropdown",
+              style: $(U.value),
+              onClick: e[13] || (e[13] = d(() => {
+              }, ["stop"]))
+            }, [
+              a("div", we, [
+                e[23] || (e[23] = a("div", { class: "of-table-toolbar__panel-title" }, "分组", -1)),
+                (o(!0), n(V, null, L(O.value, (t) => (o(), n("button", {
+                  key: t.key,
+                  class: m(["of-table-toolbar__sort-item", { active: l.currentGroup === t.key }]),
+                  onClick: (y) => {
+                    u("group", l.currentGroup === t.key ? null : t.key), c.value = !1;
+                  }
+                }, g(t.label), 11, ke))), 128)),
+                l.currentGroup ? (o(), n("button", {
+                  key: 0,
+                  class: "of-table-toolbar__clear-btn",
+                  onClick: e[12] || (e[12] = (t) => {
+                    u("group", null), c.value = !1;
+                  })
+                }, " 取消分组 ")) : s("", !0)
+              ])
+            ], 4)) : s("", !0)
+          ]))
+        ], 512)) : s("", !0),
+        l.showColumns ? (o(), n("div", {
+          key: 5,
+          ref_key: "columnBtnRef",
+          ref: z,
+          class: "of-table-toolbar__btn-group"
+        }, [
+          a("button", {
+            class: "of-table-toolbar__btn",
+            onClick: e[14] || (e[14] = d((t) => S("column"), ["stop"]))
+          }, [
+            b(w(ae), { size: 14 }),
+            e[24] || (e[24] = a("span", null, "列", -1))
+          ]),
+          (o(), C(B, { to: "body" }, [
+            p.value ? (o(), n("div", {
+              key: 0,
+              class: "of-table-toolbar__dropdown",
+              style: $(E.value),
+              onClick: e[17] || (e[17] = d(() => {
+              }, ["stop"]))
+            }, [
+              b(le, {
+                columns: l.columns,
+                visible: !0,
+                "onUpdate:columns": e[15] || (e[15] = (t) => u("update:columns", t)),
+                onClose: e[16] || (e[16] = (t) => p.value = !1)
+              }, null, 8, ["columns"])
+            ], 4)) : s("", !0)
+          ]))
+        ], 512)) : s("", !0),
+        e[25] || (e[25] = a("div", { class: "of-table-toolbar__spacer" }, null, -1)),
+        l.showSearch ? (o(), n("div", pe, [
+          b(w(ue), {
+            size: 14,
+            class: "of-table-toolbar__search-icon"
+          }),
+          a("input", {
+            class: "of-table-toolbar__search-input",
+            placeholder: "搜索...",
+            value: l.searchKeyword,
+            onInput: e[18] || (e[18] = (t) => u("update:searchKeyword", t.target.value))
+          }, null, 40, Ce)
+        ])) : s("", !0),
+        Z(r.$slots, "default", {}, void 0, !0)
+      ]);
+    };
+  }
+});
+export {
+  Ve as default
+};

package/dist/components/table/index.d.ts

@@ -7,3 +7,8 @@ export { default as TableColumnManager } from './TableColumnManager.vue';
 export { default as FieldCell } from './FieldCell.vue';
 export type { FieldDef, FieldType, FieldOption, CellValue } from './FieldCell.vue';
 export { default as TableGroupRow } from './TableGroupRow.vue';
+export { default as MobileListView } from './MobileListView.vue';
+export { default as DetailSheet } from './DetailSheet.vue';
+export { default as TableToolbar } from './TableToolbar.vue';
+export { default as FieldTypePicker } from './FieldTypePicker.vue';
+export { default as ColumnHeaderMenu } from './ColumnHeaderMenu.vue';