@ztwoint/z-ui 0.1.64 → 0.1.66

package/dist/components/column-reorder/column-reorder.js

@@ -1,26 +1,36 @@
 import { jsx as r } from "react/jsx-runtime";
 import "react";
-import { cn as n } from "../../lib/utils.js";
-import { ColumnItem as s } from "./components/column-item/column-item.js";
-import { useColumnReorder as a } from "./column-reorder.hook.js";
-const b = ({
+import { cn as s } from "../../lib/utils.js";
+import { ColumnItem as a } from "./components/column-item/column-item.js";
+import { useColumnReorder as u } from "./column-reorder.hook.js";
+const v = ({
   columns: e,
   onReorder: d,
   onRemove: i,
-  className: m
+  renderAction: m,
+  className: t
 }) => {
-  const { internalColumns: t } = a({ columns: e, onReorder: d });
+  const { internalColumns: l } = u({ columns: e, onReorder: d });
   return /* @__PURE__ */ r(
     "div",
     {
-      className: n(
+      className: s(
         "rounded-2xl border-[0.5px] border-stroke-solid-light bg-background-neutral-default overflow-hidden box-shadow-medium-10",
-        m
+        t
       ),
-      children: /* @__PURE__ */ r("div", { className: "divide-y divide-stroke-solid-light", children: t.map((o, l) => /* @__PURE__ */ r(s, { column: o, index: l, onRemove: i }, o.id)) })
+      children: /* @__PURE__ */ r("div", { className: "divide-y divide-stroke-solid-light", children: l.map((o, n) => /* @__PURE__ */ r(
+        a,
+        {
+          column: o,
+          index: n,
+          onRemove: i,
+          renderAction: m
+        },
+        o.id
+      )) })
     }
   );
 };
 export {
-  b as ColumnReOrder
+  v as ColumnReOrder
 };

package/dist/components/column-reorder/column-reorder.type.d.ts

@@ -8,5 +8,6 @@ export interface ColumnReOrderProps {
     columns: ColumnType[];
     onReorder?: (reorderedColumns: ColumnType[]) => void;
     onRemove?: (columnId: string) => void;
+    renderAction?: (column: ColumnType, onRemove: ((columnId: string) => void) | undefined) => React.ReactNode;
     className?: string;
 }

package/dist/components/column-reorder/components/column-item/column-item.js

@@ -1,79 +1,84 @@
-import { jsxs as s, Fragment as u, jsx as e } from "react/jsx-runtime";
-import { createPortal as g } from "react-dom";
+import { jsxs as i, Fragment as g, jsx as e } from "react/jsx-runtime";
+import { createPortal as p } from "react-dom";
 import "react";
-import { cn as i } from "../../../../lib/utils.js";
-import { useColumnItemDragAndDrop as p } from "./column-item.hook.js";
-import { Button as f } from "../../../button/button.js";
-import { Minus as h } from "../../../assets/icons/minus.js";
-import { parseColumnLabel as l } from "./column-item.util.js";
-import c from "../../../assets/icons/drag-handle.js";
-const x = {
+import { cn as l } from "../../../../lib/utils.js";
+import { useColumnItemDragAndDrop as f } from "./column-item.hook.js";
+import { Button as h } from "../../../button/button.js";
+import { Minus as x } from "../../../assets/icons/minus.js";
+import { parseColumnLabel as c } from "./column-item.util.js";
+import d from "../../../assets/icons/drag-handle.js";
+const b = {
   "is-dragging": "opacity-40",
   "is-dragging-over": "bg-background-neutral-medium"
-}, b = ({
+}, N = ({
   edge: t,
   isFirstElement: r = !1
 }) => /* @__PURE__ */ e(
   "div",
   {
-    className: i(
+    className: l(
       "absolute left-0 right-0 h-0.5 bg-blue-500",
       t === "top" ? r ? "top-0" : "top-[-3px]" : "bottom-0"
     )
   }
 );
-function N({ column: t }) {
-  const { groupLabel: r, fieldLabel: n } = l(t);
-  return /* @__PURE__ */ s("div", { className: "flex items-center gap-3 p-1 bg-background-neutral-default border border-stroke-solid-light rounded-xl ", children: [
-    /* @__PURE__ */ e(c, {}),
+function v({ column: t }) {
+  const { groupLabel: r, fieldLabel: a } = c(t);
+  return /* @__PURE__ */ i("div", { className: "flex items-center gap-3 p-1 bg-background-neutral-default border border-stroke-solid-light rounded-xl ", children: [
+    /* @__PURE__ */ e(d, {}),
     /* @__PURE__ */ e("div", { className: "shrink-0 flex items-center justify-center w-3.5 h-3.5 ", children: t.icon }),
-    /* @__PURE__ */ s("div", { className: "flex items-center gap-0.5 min-w-0 leading-none-regular-sm", children: [
+    /* @__PURE__ */ i("div", { className: "flex items-center gap-0.5 min-w-0 leading-none-regular-sm", children: [
       /* @__PURE__ */ e("span", { className: "text-text-neutral-secondary  truncate", children: r }),
       /* @__PURE__ */ e("span", { className: "text-text-neutral-muted", children: "/" }),
-      /* @__PURE__ */ e("span", { className: "text-text-neutral-primary truncate", children: n })
+      /* @__PURE__ */ e("span", { className: "text-text-neutral-primary truncate", children: a })
     ] })
   ] });
 }
-const E = ({ column: t, index: r, onRemove: n }) => {
-  const { ref: d, state: a } = p(t, r), { groupLabel: o, fieldLabel: m } = l(t);
-  return /* @__PURE__ */ s(u, { children: [
-    /* @__PURE__ */ s("div", { className: "relative border-b-0.5", children: [
-      /* @__PURE__ */ s(
+const F = ({
+  column: t,
+  index: r,
+  onRemove: a,
+  renderAction: n
+}) => {
+  const { ref: o, state: s } = f(t, r), { groupLabel: m, fieldLabel: u } = c(t);
+  return /* @__PURE__ */ i(g, { children: [
+    /* @__PURE__ */ i("div", { className: "relative border-b-0.5", children: [
+      /* @__PURE__ */ i(
         "div",
         {
           "data-column-id": t.id,
-          ref: d,
-          className: i(
+          ref: o,
+          className: l(
             "flex items-center gap-2 p-1 pl-3 bg-background-neutral-default cursor-grab hover:bg-background-neutral-medium transition-colors",
-            x[a.type] ?? ""
+            b[s.type] ?? ""
           ),
           children: [
-            /* @__PURE__ */ e(c, {}),
+            /* @__PURE__ */ e(d, {}),
             /* @__PURE__ */ e("div", { className: "shrink-0 flex items-center justify-center w-3.5 h-3.5", children: t.icon }),
-            /* @__PURE__ */ s("div", { className: "flex items-center gap-0.5 min-w-0 leading-none-regular-sm", children: [
-              /* @__PURE__ */ e("span", { className: "text-text-neutral-secondary  truncate", children: o }),
+            /* @__PURE__ */ i("div", { className: "flex items-center gap-0.5 min-w-0 leading-none-regular-sm", children: [
+              /* @__PURE__ */ e("span", { className: "text-text-neutral-secondary  truncate", children: m }),
               /* @__PURE__ */ e("span", { className: "text-text-neutral-muted", children: "/" }),
-              /* @__PURE__ */ e("span", { className: "text-text-neutral-primary   truncate", children: m })
+              /* @__PURE__ */ e("span", { className: "text-text-neutral-primary   truncate", children: u })
             ] }),
-            /* @__PURE__ */ e("div", { className: "ml-auto flex items-center gap-3", children: /* @__PURE__ */ e(
-              f,
+            /* @__PURE__ */ e("div", { className: "ml-auto flex items-center gap-3", children: n ? n(t, a) : /* @__PURE__ */ e(
+              h,
               {
-                onClick: () => n == null ? void 0 : n(t.id),
+                onClick: () => a == null ? void 0 : a(t.id),
                 variant: "ghost",
                 shade: "neutral",
                 size: "medium",
-                leftIcon: /* @__PURE__ */ e(h, { className: "w-4 h-4" })
+                leftIcon: /* @__PURE__ */ e(x, { className: "w-4 h-4" })
               }
             ) })
           ]
         }
       ),
-      a.type === "is-dragging-over" && a.closestEdge && /* @__PURE__ */ e(b, { edge: a.closestEdge, isFirstElement: r === 0 })
+      s.type === "is-dragging-over" && s.closestEdge && /* @__PURE__ */ e(N, { edge: s.closestEdge, isFirstElement: r === 0 })
     ] }),
-    a.type === "preview" && g(/* @__PURE__ */ e(N, { column: t }), a.container)
+    s.type === "preview" && p(/* @__PURE__ */ e(v, { column: t }), s.container)
   ] });
 };
 export {
-  E as ColumnItem,
-  E as default
+  F as ColumnItem,
+  F as default
 };

package/dist/components/column-reorder/components/column-item/column-item.type.d.ts

@@ -15,4 +15,5 @@ export interface ColumnItemProps {
     column: ColumnType;
     index: number;
     onRemove?: (columnId: string) => void;
+    renderAction?: (column: ColumnType, onRemove?: (columnId: string) => void) => React.ReactNode;
 }

package/dist/components/table/components/cell/avatar-cell.js

@@ -32,12 +32,13 @@ import "../../table-provider.js";
 import { Avatar as p } from "../../../avatar/avatar.js";
 import "../../table.context.js";
 import "../../../tooltip/tooltip.js";
+import "../../../table-filter/index.js";
 import "../../../badge/badge.js";
 import "../../../text-preset/text-preset.js";
 import "react-dom";
 import "../../../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/util/changing-window/count-events-for-safari.js";
 import "../../../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/ledger/dispatch-consumer-event.js";
-const _ = ({
+const $ = ({
   avatar: m,
   value: a,
   rightIcon: o,
@@ -75,5 +76,5 @@ const _ = ({
   }
 );
 export {
-  _ as AvatarCell
+  $ as AvatarCell
 };

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

@@ -1,6 +1,6 @@
 export { Table as default, Table, TableProvider } from './table-provider';
 export { TableBody } from './table';
-export type { TableProps, TableSchema, TableSchemaColumn, CellType, CellValue, CellRenderer, CellRendererProps, FilterRule, FilterCondition, FilterOption, TableFilter as TableFilterType, TablePaginationConfig, SortDirection, SortColumn, TableSort, } from './table.type';
+export type { TableProps, TableSchema, TableSchemaColumn, CellType, CellValue, CellRenderer, CellRendererProps, TablePaginationConfig, SortDirection, SortColumn, TableSort, } from './table.type';
 export { extractCellValue } from './table.utils';
 export { DEFAULT_EMPTY_MESSAGE, TABLE_CSS_CLASSES } from './table.const';
 export { TableContext, useTableContext } from './table.context';

package/dist/components/table/table-provider.d.ts

@@ -1,6 +1,5 @@
 import { TableProps } from './table.type';
 import { TableBody } from './table';
-import { TableFilter } from './components/table-filter/table-filter-provider';
 import { TableSearch } from './components/table-search';
 import { Pagination } from './components/pagination';
 import { TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent } from './components';
@@ -12,7 +11,6 @@ export interface TableProviderProps extends TableProps {
 declare const TableProvider: React.FC<TableProviderProps>;
 interface TableCompoundComponent extends React.FC<TableProviderProps> {
     Body: typeof TableBody;
-    Filter: typeof TableFilter;
     Search: typeof TableSearch;
     Pagination: typeof Pagination;
     PaginationInfo: typeof PaginationInfo;

package/dist/components/table/table-provider.js

@@ -2,11 +2,10 @@ import { jsx as p } from "react/jsx-runtime";
 import * as e from "react";
 import { TableContext as a } from "./table.context.js";
 import { TableBody as n } from "./table.js";
-import { TableFilter as f } from "./components/table-filter/table-filter-provider.js";
-import { TableSearch as l } from "./components/table-search/table-search.js";
-import { Pagination as s } from "./components/pagination/pagination.js";
-import { PaginationInfo as T } from "./components/pagination/components/pagination-info.js";
-import { PaginationQuickJumper as b } from "./components/pagination/components/pagination-quick-jumper.js";
+import { TableSearch as f } from "./components/table-search/table-search.js";
+import { Pagination as l } from "./components/pagination/pagination.js";
+import { PaginationInfo as c } from "./components/pagination/components/pagination-info.js";
+import { PaginationQuickJumper as d } from "./components/pagination/components/pagination-quick-jumper.js";
 import "clsx";
 import "tailwind-merge";
 /* empty css                        */
@@ -37,22 +36,21 @@ import "../stepper/stepper.js";
 import "../stepper-item/stepper-item.js";
 import "@radix-ui/react-tabs";
 import "../tooltip/tooltip.js";
+import "../table-filter/index.js";
 import "../badge/badge.js";
 import "../avatar/avatar.js";
 import "../text-preset/text-preset.js";
 import "react-dom";
 import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/util/changing-window/count-events-for-safari.js";
 import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/ledger/dispatch-consumer-event.js";
-import { TableHeaderWrapper as c } from "./components/table-header-wrapper.js";
-import { TableHeaderContent as d } from "./components/table-header-content.js";
-import { TableFooter as u } from "./components/table-footer.js";
-import { TableFooterContent as g } from "./components/table-footer-content.js";
+import { TableHeaderWrapper as T } from "./components/table-header-wrapper.js";
+import { TableHeaderContent as b } from "./components/table-header-content.js";
+import { TableFooter as s } from "./components/table-footer.js";
+import { TableFooterContent as u } from "./components/table-footer-content.js";
 const t = ({
   children: i,
-  pagination: C,
-  sort: F,
-  filter: v,
-  filterComponents: x,
+  pagination: P,
+  sort: C,
   ...r
 }) => {
   const m = e.useMemo(
@@ -62,18 +60,17 @@ const t = ({
     [r]
   );
   return /* @__PURE__ */ p(a.Provider, { value: m, children: i });
-}, P = t, o = P;
+}, g = t, o = g;
 o.Body = n;
-o.Filter = f;
-o.Search = l;
-o.Pagination = s;
-o.PaginationInfo = T;
-o.PaginationQuickJumper = b;
+o.Search = f;
+o.Pagination = l;
+o.PaginationInfo = c;
+o.PaginationQuickJumper = d;
 o.Provider = t;
-o.Header = c;
-o.HeaderContent = d;
-o.Footer = u;
-o.FooterContent = g;
+o.Header = T;
+o.HeaderContent = b;
+o.Footer = s;
+o.FooterContent = u;
 export {
   o as Table,
   t as TableProvider,

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

@@ -1,5 +1,4 @@
 import { FC } from 'react';
-import { FilterComponentType } from './components/table-filter/table-filter.type';
 import { NumberCellProps } from './components/cell/number-cell';
 import { BooleanCellProps } from './components/cell/boolean-cell';
 import { LinkCellProps } from './components/cell/link-cell';
@@ -14,21 +13,6 @@ export type CellRendererProps = {
     index: number;
 };
 export type CellRenderer = FC<CellRendererProps>;
-export type FilterCondition = 'contains' | 'notEqual' | 'equal' | '>' | '<' | '=' | '!=';
-export type FilterRule = {
-    field: string;
-    condition?: string;
-    value: string | string[];
-};
-export type FilterOption = {
-    label: string;
-    value: string;
-    total?: number;
-};
-export type TableFilter = {
-    value: FilterRule[];
-    onChange: (filters: FilterRule[]) => void;
-};
 export type TableSearch = {
     value: string;
     onChange: (searchValue: string) => void;
@@ -68,10 +52,8 @@ type ColumnBase<T extends CellType> = {
     title: string;
     cellType: T;
     cellRenderer?: CellRenderer;
-    filterable?: boolean;
     hideable?: boolean;
     sortable?: boolean;
-    filterOptions?: FilterOption[];
 };
 export type TableSchemaColumn = (ColumnBase<'number'> & {
     valueGetter?: (record: Record<string, unknown>) => CellValue | CellPropsByType['number'];
@@ -97,8 +79,6 @@ export type TableProps = {
     schema: TableSchema;
     loading?: boolean;
     emptyMessage?: string;
-    filter?: TableFilter;
-    filterComponents?: Record<string, FilterComponentType>;
     pagination?: TablePaginationConfig;
     sort?: TableSort;
     customCells?: Record<string, CellRenderer>;

package/dist/components/table-card/table-card.js

@@ -1,5 +1,5 @@
-import { jsx as t, jsxs as a } from "react/jsx-runtime";
-import { Table as e } from "../table/table-provider.js";
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { Table as r } from "../table/table-provider.js";
 import "react";
 import { cn as i } from "../../lib/utils.js";
 /* empty css                        */
@@ -30,7 +30,8 @@ import "../stepper/stepper.js";
 import "../stepper-item/stepper-item.js";
 import "@radix-ui/react-tabs";
 import "../tooltip/tooltip.js";
-import f from "../assets/icons/octagon-warning-Copy.js";
+import { Filter as P } from "../table-filter/index.js";
+import S from "../assets/icons/octagon-warning-Copy.js";
 import "../badge/badge.js";
 import "../avatar/avatar.js";
 import "../text-preset/text-preset.js";
@@ -38,18 +39,18 @@ import "react-dom";
 import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/util/changing-window/count-events-for-safari.js";
 import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/ledger/dispatch-consumer-event.js";
 import "../table/table.context.js";
-const Ct = ({
+const vt = ({
   dataSource: w,
-  schema: P,
-  loading: H,
-  emptyMessage: k,
-  className: T,
+  schema: H,
+  loading: k,
+  emptyMessage: T,
+  className: _,
   rounded: d = !0,
   bordered: n = !0,
-  showHeader: g = !0,
-  headerClassName: _,
-  search: m,
-  filter: r,
+  showHeader: p = !0,
+  headerClassName: f,
+  search: a,
+  filter: e,
   headerLeftContent: h,
   headerActions: u,
   body: l = {
@@ -57,79 +58,79 @@ const Ct = ({
     className: "",
     stickyHeader: !0
   },
-  showFooter: p = !0,
+  showFooter: g = !0,
   footerClassName: j,
   pagination: o,
   paginationInfo: c,
   paginationQuickJumper: s,
   error: x = !1
 }) => {
-  var v;
+  var F;
   if (x)
-    return /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center h-64 bg-background-error-subtle rounded-lg text-text-warning-secondary", children: /* @__PURE__ */ a("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ t(f, { className: "mt-1.5" }),
-      /* @__PURE__ */ a("div", { className: "flex flex-col gap-2", children: [
+    return /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center h-64 bg-background-error-subtle rounded-lg text-text-warning-secondary", children: /* @__PURE__ */ m("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ t(S, { className: "mt-1.5" }),
+      /* @__PURE__ */ m("div", { className: "flex flex-col gap-2", children: [
         /* @__PURE__ */ t("div", { className: "text-text-error-primary text-lg font-medium", children: "Error loading data" }),
         /* @__PURE__ */ t("div", { className: "text-sm", children: "Please try again later" }),
         typeof x == "string" && /* @__PURE__ */ t("div", { className: "text-text-warning-secondary text-sm", children: x })
       ] })
     ] }) });
-  const C = s && s.totalPage && s.totalPage >= 2, N = o && o.totalPage && o.totalPage >= 2 || !!c || C, F = m || r || h || u, R = typeof (r == null ? void 0 : r.showFilterButton) > "u" ? !0 : r == null ? void 0 : r.showFilterButton;
-  return /* @__PURE__ */ t("div", { className: i("flex flex-col overflow-hidden", T), children: /* @__PURE__ */ a(e, { dataSource: w, schema: P, loading: H, emptyMessage: k, children: [
-    g && F && /* @__PURE__ */ a(
-      e.Header,
+  const C = s && s.totalPage && s.totalPage >= 2, N = o && o.totalPage && o.totalPage >= 2 || !!c || C, v = a || e || h || u, R = typeof (e == null ? void 0 : e.showFilterButton) > "u" ? !0 : e == null ? void 0 : e.showFilterButton;
+  return /* @__PURE__ */ t("div", { className: i("flex flex-col overflow-hidden", _), children: /* @__PURE__ */ m(r, { dataSource: w, schema: H, loading: k, emptyMessage: T, children: [
+    p && v && /* @__PURE__ */ m(
+      r.Header,
       {
         className: i(
           "flex-shrink-0",
           n && "border-stroke-solid-medium border-1 border-b-0",
           d && "rounded-t-xl",
-          _
+          f
         ),
         children: [
-          /* @__PURE__ */ a(e.HeaderContent, { children: [
+          /* @__PURE__ */ m(r.HeaderContent, { children: [
             h && h,
-            m && /* @__PURE__ */ t(
-              e.Search,
+            a && /* @__PURE__ */ t(
+              r.Search,
               {
                 search: {
-                  value: m.value || "",
-                  onChange: m.onChange || (() => {
+                  value: a.value || "",
+                  onChange: a.onChange || (() => {
                   }),
-                  placeholder: m.placeholder
+                  placeholder: a.placeholder
                 },
-                className: m.className
+                className: a.className
               }
             ),
-            r && /* @__PURE__ */ a(
-              e.Filter,
+            e && /* @__PURE__ */ m(
+              P,
               {
-                schema: P,
+                filterSchema: e.filterSchema,
                 filter: {
-                  value: r.value || [],
-                  onChange: r.onChange || (() => {
+                  value: e.value || [],
+                  onChange: e.onChange || (() => {
                   })
                 },
                 children: [
-                  R && /* @__PURE__ */ t(e.Filter.FilterButton, {}),
-                  (v = r == null ? void 0 : r.quickFilters) == null ? void 0 : v.map((B) => /* @__PURE__ */ t(e.Filter.FilterColumnButton, { filterName: B }, B))
+                  R && /* @__PURE__ */ t(P.FilterButton, {}),
+                  (F = e == null ? void 0 : e.quickFilters) == null ? void 0 : F.map((B) => /* @__PURE__ */ t(P.FilterColumnButton, { filterName: B }, B))
                 ]
               }
             )
           ] }),
-          u && /* @__PURE__ */ t(e.HeaderContent, { children: u })
+          u && /* @__PURE__ */ t(r.HeaderContent, { children: u })
         ]
       }
     ),
     /* @__PURE__ */ t(
-      e.Body,
+      r.Body,
       {
         cell: l == null ? void 0 : l.cell,
         sort: l == null ? void 0 : l.sort,
         className: i(
           "flex-1 min-h-0",
           n && "border-stroke-solid-light border-1",
-          d && !(g && F) && "rounded-t-xl",
-          d && !(p && N) && "rounded-b-xl",
+          d && !(p && v) && "rounded-t-xl",
+          d && !(g && N) && "rounded-b-xl",
           n && "[&_td:first-child]:border-l-0 [&_td:last-child]:border-r-0",
           n && "[&_th:first-child]:border-l-0 [&_th:last-child]:border-r-0",
           l == null ? void 0 : l.className
@@ -137,8 +138,8 @@ const Ct = ({
         stickyHeader: l == null ? void 0 : l.stickyHeader
       }
     ),
-    p && N && /* @__PURE__ */ a(
-      e.Footer,
+    g && N && /* @__PURE__ */ m(
+      r.Footer,
       {
         className: i(
           "flex-shrink-0 border-stroke-solid-light border-t-[0.5px] mt-[-2px]",
@@ -147,18 +148,18 @@ const Ct = ({
           j
         ),
         children: [
-          c ? /* @__PURE__ */ t(e.FooterContent, { children: /* @__PURE__ */ t(
-            e.PaginationInfo,
+          c ? /* @__PURE__ */ t(r.FooterContent, { children: /* @__PURE__ */ t(
+            r.PaginationInfo,
             {
               showTotal: c.showTotal,
               totalItems: c.totalItems,
               currentPage: c.currentPage,
               itemsPerPage: c.itemsPerPage
             }
-          ) }) : s || o ? /* @__PURE__ */ t(e.FooterContent, { children: null }) : null,
-          (s || o) && /* @__PURE__ */ a(e.FooterContent, { children: [
+          ) }) : s || o ? /* @__PURE__ */ t(r.FooterContent, { children: null }) : null,
+          (s || o) && /* @__PURE__ */ m(r.FooterContent, { children: [
             C && /* @__PURE__ */ t(
-              e.PaginationQuickJumper,
+              r.PaginationQuickJumper,
               {
                 currentPage: s.currentPage,
                 totalPage: s.totalPage,
@@ -168,7 +169,7 @@ const Ct = ({
               }
             ),
             o && /* @__PURE__ */ t(
-              e.Pagination,
+              r.Pagination,
               {
                 currentPage: o.currentPage,
                 totalPage: o.totalPage,
@@ -184,5 +185,5 @@ const Ct = ({
   ] }) });
 };
 export {
-  Ct as default
+  vt as default
 };

package/dist/components/table-card/table-card.type.d.ts

@@ -1,5 +1,6 @@
 import { default as React } from 'react';
-import { TableProps, TableSchema, TableFilter, TableSearch, TableSort } from '../table/table.type';
+import { TableProps, TableSchema, TableSearch, TableSort } from '../table/table.type';
+import { TableFilter, FilterSchema } from '../table-filter/table-filter.type';
 import { PaginationProps, PaginationInfoProps, PaginationQuickJumperProps } from '../table/components/pagination/pagination.type';
 export interface TableCardProps {
     dataSource: Record<string, unknown>[];
@@ -15,6 +16,7 @@ export interface TableCardProps {
     filter?: Partial<TableFilter> & {
         quickFilters?: string[];
         showFilterButton?: boolean;
+        filterSchema: FilterSchema;
     };
     headerLeftContent?: React.ReactNode;
     headerActions?: React.ReactNode;

package/dist/components/{table/components/table-filter → table-filter}/close-filter-confirm/filter-confirmation-dialog.js

@@ -1,6 +1,6 @@
 import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import { Button as l } from "../../../../button/button.js";
-import { Z2Dialog as s, Z2DialogContent as d, Z2DialogHeader as h, Z2DialogTitle as c, Z2DialogDescription as g, Z2DialogFooter as m } from "../../../../dialog/dialog.js";
+import { Button as l } from "../../button/button.js";
+import { Z2Dialog as s, Z2DialogContent as d, Z2DialogHeader as h, Z2DialogTitle as c, Z2DialogDescription as g, Z2DialogFooter as m } from "../../dialog/dialog.js";
 const v = ({
   onClose: r,
   onKeepChanges: i,

package/dist/{types/components/table/components → components}/table-filter/close-filter-confirm/filter-confirmation-dialog.utils.d.ts

@@ -1,4 +1,4 @@
-import { FilterRule } from '../../../table.type';
+import { FilterRule } from '../table-filter.type';
 /**
  * Compares two filter arrays to determine if they are different
  */

package/dist/components/{table/components/table-filter → table-filter}/filters/checkbox.js

@@ -1,7 +1,7 @@
 import { jsx as t, jsxs as s } from "react/jsx-runtime";
 import { useState as i, useEffect as h } from "react";
-import { MagnifierIcon as y } from "../../../../assets/icons/magnifier-icon.js";
-import C from "../../../../assets/icons/x.js";
+import { MagnifierIcon as y } from "../../assets/icons/magnifier-icon.js";
+import C from "../../assets/icons/x.js";
 const k = ["includesAny", "includesAll", "excludes"], j = ({ value: r, onChange: d, filterOptions: c = [] }) => {
   const [n, o] = i([]), [u, m] = i(""), [x, f] = i(c), p = (e) => {
     m(e.target.value);

package/dist/components/{table/components/table-filter → table-filter}/filters/number/filter-input-field.js

@@ -1,5 +1,5 @@
 import { jsxs as a, jsx as t } from "react/jsx-runtime";
-import i from "../../../../../assets/icons/x.js";
+import i from "../../../assets/icons/x.js";
 const d = ({
   label: l,
   operator: n,

package/dist/components/{table/components/table-filter → table-filter}/filters/text.js

@@ -1,8 +1,8 @@
 import { jsxs as l, jsx as e } from "react/jsx-runtime";
 import { useEffect as c } from "react";
-import s from "../../../../assets/icons/x.js";
-import { MagnifierIcon as u } from "../../../../assets/icons/magnifier-icon.js";
-import { Input as d } from "../../../../input/input.js";
+import s from "../../assets/icons/x.js";
+import { MagnifierIcon as u } from "../../assets/icons/magnifier-icon.js";
+import { Input as d } from "../../input/input.js";
 const o = [
   { label: "Contains", value: "contains" },
   { label: "Does not equal", value: "notEqual" },

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

@@ -0,0 +1,9 @@
+import { TableFilterProviderProps } from './table-filter.type';
+import { TableFilterButton } from './table-filter-button';
+import { TableFilterColumnButton } from './table-filter-column-button';
+export { useTableFilterContext } from './table-filter.context';
+export interface FilterCompoundComponent extends React.FC<TableFilterProviderProps> {
+    FilterButton: typeof TableFilterButton;
+    FilterColumnButton: typeof TableFilterColumnButton;
+}
+export declare const Filter: FilterCompoundComponent;