zaravand-ui 7.0.1 → 7.0.2

package/dist/components/Table/Table.utils.cjs

@@ -1 +1 @@
-const e=require(`../../services/convertToEnglishDigits/convertToEnglishDigits.cjs`),t=require(`../../services/localizeDigits/localizeDigits.cjs`);var n=96,r=56,i=16,a=/^(\d*\.?\d+)\s*(px|%|rem|em)?$/i;function o(){if(typeof window>`u`||typeof document>`u`)return i;let e=Number.parseFloat(window.getComputedStyle(document.documentElement).fontSize);return Number.isFinite(e)&&e>0?e:i}function s(e){if(typeof e==`number`)return Number.isFinite(e)&&e>0?{kind:`weight`,value:e}:{kind:`weight`,value:n};let t=typeof e==`string`?e.trim().match(a):null,r=t?Number.parseFloat(t[1]):NaN;if(!t||!Number.isFinite(r)||r<=0)return{kind:`weight`,value:n};let i=(t[2]??`px`).toLowerCase();return i===`%`?{kind:`percent`,value:r}:i===`rem`||i===`em`?{kind:`weight`,value:r*o()}:{kind:`weight`,value:r}}function c(e,t,n){let i=n?{width:`112px`,minWidth:`112px`}:void 0;if(e.length===0&&!t)return{rowNumberColumnStyle:void 0,columnStyleByKey:{},actionsColumnStyle:i};let a=t?r:0,o=e.map(e=>s(e.width)),c=o.reduce((e,t)=>t.kind===`percent`?e+t.value:e,0),l=c>100?100/c:1,u=Math.max(0,100-c*l),d=a+o.reduce((e,t)=>t.kind===`weight`?e+t.value:e,0),f=e=>d>0?e/d*u:0,p=e=>({width:`${e.toFixed(4)}%`}),m=Object.fromEntries(e.map((e,t)=>{let n=o[t],r=n.kind===`percent`?n.value*l:f(n.value);return[e.key,p(r)]}));return{rowNumberColumnStyle:t?p(f(a)):void 0,columnStyleByKey:m,actionsColumnStyle:i}}function l(e,t){return typeof e==`number`&&Number.isFinite(e)&&e>0?Math.min(12,Math.max(1,Math.floor(e))):t>0?Math.min(12,t):6}function u(e,t){let n=t%3;return e.type===`checkbox`?`zui:size-4`:e.type===`number`||e.type===`money`?n===0?`zui:h-4 zui:w-16`:n===1?`zui:h-4 zui:w-12`:`zui:h-4 zui:w-20`:e.type===`date`?n===0?`zui:h-4 zui:w-28`:n===1?`zui:h-4 zui:w-24`:`zui:h-4 zui:w-32`:e.type===`textarea`?n===0?`zui:h-4 zui:w-[92%]`:n===1?`zui:h-4 zui:w-[76%]`:`zui:h-4 zui:w-[84%]`:n===0?`zui:h-4 zui:w-[78%]`:n===1?`zui:h-4 zui:w-[62%]`:`zui:h-4 zui:w-[86%]`}function d(e){return e==null?!0:typeof e==`string`?e.trim().length===0:!1}function f(e){if(typeof e==`number`)return Number.isFinite(e)?e:null;if(typeof e==`string`){let t=e.replace(/,/g,``).trim();if(t.length===0)return null;let n=Number(t);return Number.isFinite(n)?n:null}return null}function p(e){return e.toLocaleString(`en-US`)}function m(e){if(e instanceof Date&&!Number.isNaN(e.getTime()))return e;if(typeof e==`string`&&e.trim().length>0){let t=new Date(e);if(!Number.isNaN(t.getTime()))return t}return null}function h(e){return typeof e.placeholder==`string`&&e.placeholder.trim().length>0?e.placeholder:`---`}function g(e){return typeof e.displayPlaceholder==`string`&&e.displayPlaceholder.trim().length>0?e.displayPlaceholder:h(e)}function _(e,t){if(t.type!==`select`&&t.type!==`radio`||!Array.isArray(t.options)||t.options.length===0)return null;let n=String(e).trim();if(n.length===0)return null;let r=t.options.find(e=>e.value.trim()===n);if(r){let e=r.label.trim();return e.length>0?e:null}let i=e=>{let t=e.trim().toLocaleLowerCase();return/^[0-9a-f-]+$/i.test(t)?t.replaceAll(`-`,``):t},a=n.toLocaleLowerCase(),o=t.options.find(e=>e.value.trim().toLocaleLowerCase()===a);if(o){let e=o.label.trim();return e.length>0?e:null}let s=i(n),c=t.options.find(e=>i(e.value)===s);if(!c)return null;let l=c.label.trim();return l.length>0?l:null}var v=new Map;function y(e){let t=v.get(e);return t||(t=new Intl.DateTimeFormat(`${e}-u-ca-persian`,{dateStyle:`medium`}),v.set(e,t)),t}function b(t,n,{messages:r}){if(d(t))return g(n);if(n.type===`checkbox`)return t===!0?r.common.yes:r.common.no;if(n.type===`date`){let i=m(t);return i?e.convertToEnglishDigits({value:y(r.calendar.locale).format(i)}):g(n)}if(n.type===`money`){let e=f(t);return e===null?g(n):p(e)}return typeof t==`string`||typeof t==`number`?_(t,n)||(n.type===`select`&&n.optionsSource?g(n):String(t)):g(n)}function x(e,n,r){return t.localizeDigits(b(e,n,r),r.digits)}function S(e,t,n){if(typeof n!=`function`)return;let r=n(e,t);if(typeof r==`number`)return Number.isFinite(r)?r:void 0;if(typeof r==`string`){let e=r.trim();return e.length>0?e:void 0}}function C(e,t,n,r){if(n!==void 0&&typeof r==`function`){let t=e.findIndex((e,t)=>S(e,t,r)===n);if(t>=0)return t}return t>=0&&t<e.length?t:-1}function w(e,t){if(d(e))return t.type===`number`||t.type===`money`||t.type===`date`?-1/0:``;if(t.type===`number`||t.type===`money`)return f(e)??-1/0;if(t.type===`date`){let t=m(e);return t?t.getTime():-1/0}return typeof e==`number`?e:String(e)}function T(e,t,n,r){let i=w(e[n.key],n),a=w(t[n.key],n),o=typeof i==`number`&&typeof a==`number`?i-a:String(i).localeCompare(String(a),`fa`);return r===`asc`?o:-o}function E(e,t){return e?.sortKey===t?e.direction===`asc`?{sortKey:t,direction:`desc`}:null:{sortKey:t,direction:`asc`}}function D(e){return e===`asc`?`ascending`:e===`desc`?`descending`:`none`}function O(e,t,n){return t===`asc`?`${n.sortBy} ${e} (${n.sortDescending})`:t===`desc`?`${n.sortClear} ${e} (${n.sortDefault})`:`${n.sortBy} ${e} (${n.sortAscending})`}function k(e,t,n,r,i){let a=C(e,t,n,r);if(a<0)return e;let o=[...e];return o[a]=i,o}exports.compareTableRowsByColumn=T,exports.formatCellValue=x,exports.replaceRowByIdentifier=k,exports.resolveAriaSort=D,exports.resolveColumnWidthPercentages=c,exports.resolveLoadingCellSkeletonClassName=u,exports.resolveLoadingRowsCount=l,exports.resolveNextSort=E,exports.resolvePlaceholder=h,exports.resolveSafeRowId=S,exports.resolveSortToggleTooltipText=O;
+const e=require(`../../services/convertToEnglishDigits/convertToEnglishDigits.cjs`),t=require(`../../services/localizeDigits/localizeDigits.cjs`);var n=96,r=56,i=16,a=/^(\d*\.?\d+)\s*(px|%|rem|em)?$/i;function o(){if(typeof window>`u`||typeof document>`u`)return i;let e=Number.parseFloat(window.getComputedStyle(document.documentElement).fontSize);return Number.isFinite(e)&&e>0?e:i}function s(e){if(typeof e==`number`)return Number.isFinite(e)&&e>0?{kind:`weight`,value:e}:{kind:`weight`,value:n};let t=typeof e==`string`?e.trim().match(a):null,r=t?Number.parseFloat(t[1]):NaN;if(!t||!Number.isFinite(r)||r<=0)return{kind:`weight`,value:n};let i=(t[2]??`px`).toLowerCase();return i===`%`?{kind:`percent`,value:r}:i===`rem`||i===`em`?{kind:`weight`,value:r*o()}:{kind:`weight`,value:r}}function c(e,t,n){let i=n?{width:`112px`,minWidth:`112px`}:void 0;if(e.length===0&&!t)return{rowNumberColumnStyle:void 0,columnStyleByKey:{},actionsColumnStyle:i};let a=t?r:0,o=e.map(e=>s(e.width)),c=o.reduce((e,t)=>t.kind===`percent`?e+t.value:e,0),l=c>100?100/c:1,u=Math.max(0,100-c*l),d=a+o.reduce((e,t)=>t.kind===`weight`?e+t.value:e,0),f=e=>d>0?e/d*u:0,p=e=>({width:`${e.toFixed(4)}%`}),m=Object.fromEntries(e.map((e,t)=>{let n=o[t],r=n.kind===`percent`?n.value*l:f(n.value);return[e.key,p(r)]}));return{rowNumberColumnStyle:t?p(f(a)):void 0,columnStyleByKey:m,actionsColumnStyle:i}}function l(e,t){return typeof e==`number`&&Number.isFinite(e)&&e>0?Math.min(12,Math.max(1,Math.floor(e))):t>0?Math.min(12,t):6}function u(e,t){let n=t%3;return e.type===`checkbox`?`zui:size-4`:e.type===`number`||e.type===`money`?n===0?`zui:h-4 zui:w-16`:n===1?`zui:h-4 zui:w-12`:`zui:h-4 zui:w-20`:e.type===`date`?n===0?`zui:h-4 zui:w-28`:n===1?`zui:h-4 zui:w-24`:`zui:h-4 zui:w-32`:e.type===`textarea`?n===0?`zui:h-4 zui:w-[92%]`:n===1?`zui:h-4 zui:w-[76%]`:`zui:h-4 zui:w-[84%]`:n===0?`zui:h-4 zui:w-[78%]`:n===1?`zui:h-4 zui:w-[62%]`:`zui:h-4 zui:w-[86%]`}function d(e){return e==null?!0:typeof e==`string`?e.trim().length===0:!1}function f(e){if(typeof e==`number`)return Number.isFinite(e)?e:null;if(typeof e==`string`){let t=e.replace(/,/g,``).trim();if(t.length===0)return null;let n=Number(t);return Number.isFinite(n)?n:null}return null}function p(e){return e.toLocaleString(`en-US`)}function m(e){if(e instanceof Date&&!Number.isNaN(e.getTime()))return e;if(typeof e==`string`&&e.trim().length>0){let t=new Date(e);if(!Number.isNaN(t.getTime()))return t}return null}function h(e){return typeof e.placeholder==`string`&&e.placeholder.trim().length>0?e.placeholder:`---`}function g(e){return typeof e.displayPlaceholder==`string`&&e.displayPlaceholder.trim().length>0?e.displayPlaceholder:h(e)}function _(e,t){if(t.type!==`select`&&t.type!==`radio`||!Array.isArray(t.options)||t.options.length===0)return null;let n=String(e).trim();if(n.length===0)return null;let r=t.options.find(e=>e.value.trim()===n);if(r){let e=r.label.trim();return e.length>0?e:null}let i=e=>{let t=e.trim().toLocaleLowerCase();return/^[0-9a-f-]+$/i.test(t)?t.replaceAll(`-`,``):t},a=n.toLocaleLowerCase(),o=t.options.find(e=>e.value.trim().toLocaleLowerCase()===a);if(o){let e=o.label.trim();return e.length>0?e:null}let s=i(n),c=t.options.find(e=>i(e.value)===s);if(!c)return null;let l=c.label.trim();return l.length>0?l:null}var v=new Map;function y(e){let t=v.get(e);return t||(t=new Intl.DateTimeFormat(`${e}-u-ca-persian`,{dateStyle:`medium`}),v.set(e,t)),t}function b(t,n,{messages:r}){if(d(t))return g(n);if(n.type===`checkbox`)return t===!0?r.common.yes:r.common.no;if(n.type===`date`){let i=m(t);return i?e.convertToEnglishDigits({value:y(r.calendar.locale).format(i)}):g(n)}if(n.type===`money`){let e=f(t);return e===null?g(n):p(e)}return typeof t==`string`||typeof t==`number`?_(t,n)||(n.type===`select`&&n.optionsSource?g(n):String(t)):g(n)}function x(e,n,r){return t.localizeDigits(b(e,n,r),r.digits)}function S(e,t,n){if(typeof n!=`function`)return;let r=n(e,t);if(typeof r==`number`)return Number.isFinite(r)?r:void 0;if(typeof r==`string`){let e=r.trim();return e.length>0?e:void 0}}function C(e,t,n,r){if(n!==void 0&&typeof r==`function`){let t=e.findIndex((e,t)=>S(e,t,r)===n);if(t>=0)return t}return t>=0&&t<e.length?t:-1}function w(e,t){if(d(e))return t.type===`number`||t.type===`money`||t.type===`date`?-1/0:``;if(t.type===`number`||t.type===`money`)return f(e)??-1/0;if(t.type===`date`){let t=m(e);return t?t.getTime():-1/0}return typeof e==`number`?e:String(e)}function T(e,t,n,r){let i=w(e[n.key],n),a=w(t[n.key],n),o=typeof i==`number`&&typeof a==`number`?i-a:String(i).localeCompare(String(a),`fa`);return r===`asc`?o:-o}function E(e,t){return e?.sortKey===t?e.direction===`asc`?{sortKey:t,direction:`desc`}:null:{sortKey:t,direction:`asc`}}function D(e){return e===`asc`?`ascending`:e===`desc`?`descending`:`none`}function O(e,t,n){return t===`asc`?`${n.sortBy} ${e} (${n.sortDescending})`:t===`desc`?`${n.sortClear} ${e} (${n.sortDefault})`:`${n.sortBy} ${e} (${n.sortAscending})`}function k(e,t,n,r,i){let a=C(e,t,n,r);if(a<0)return e;let o=[...e];return o[a]=i,o}function A(e){return e===void 0||e.length===0}function j(e,t){return e.map(e=>t.find(t=>t.value===e)?.label??e).join(`, `)}function M(e,t,n){let r=e[t.key];return n.includes(r==null?``:String(r).trim())}function N(e,t,n){if(Array.isArray(e.options)&&e.options.length>0)return e.options;if(e.optionsSource)return[];let r=new Map;return t.forEach(t=>{let i=t[e.key],a=i==null?``:String(i).trim();a.length>0&&!r.has(a)&&r.set(a,x(i,e,n))}),Array.from(r,([e,t])=>({value:e,label:t})).sort((e,t)=>e.label.localeCompare(t.label,void 0,{numeric:!0}))}exports.compareTableRowsByColumn=T,exports.formatCellValue=x,exports.isEmptyFilterValue=A,exports.replaceRowByIdentifier=k,exports.resolveAriaSort=D,exports.resolveColumnWidthPercentages=c,exports.resolveFilterOptions=N,exports.resolveFilterText=j,exports.resolveLoadingCellSkeletonClassName=u,exports.resolveLoadingRowsCount=l,exports.resolveNextSort=E,exports.resolvePlaceholder=h,exports.resolveSafeRowId=S,exports.resolveSortToggleTooltipText=O,exports.rowMatchesColumnFilter=M;

package/dist/components/Table/Table.utils.d.cts

@@ -1,7 +1,7 @@
 import type * as React from "react";
 import type { ZuiMessages } from "../../config/messages.cjs";
 import { type ZuiDigits } from "../../services/localizeDigits/localizeDigits.cjs";
-import type { DynamicTableRow, TableActiveSort, TableRowId, TableRowIdResolver, TableSchemaColumn, TableSortDirection } from "./Table.interface.cjs";
+import type { DynamicTableRow, TableActiveSort, TableFilterValue, TableRowId, TableRowIdResolver, TableSchemaColumn, TableSelectOption, TableSortDirection } from "./Table.interface.cjs";
 export declare const ACTIONS_COLUMN_WIDTH_PX = 112;
 export declare function resolveColumnWidthPercentages(visibleColumns: TableSchemaColumn[], shouldShowRowNumbers: boolean, hasRowActions: boolean): {
     rowNumberColumnStyle: React.CSSProperties | undefined;
@@ -37,3 +37,12 @@ export declare function resolveAriaSort(direction: TableSortDirection | undefine
  */
 export declare function resolveSortToggleTooltipText(columnLabel: string, direction: TableSortDirection | undefined, labels: ZuiMessages["table"]): string;
 export declare function replaceRowByIdentifier(rows: DynamicTableRow[], targetRowIndex: number, targetRowId: TableRowId | undefined, getRowId: TableRowIdResolver | undefined, nextRow: DynamicTableRow): DynamicTableRow[];
+export declare function isEmptyFilterValue(value: TableFilterValue | undefined): boolean;
+/** The chosen values as the filter chips and the phone filter list show them. */
+export declare function resolveFilterText(value: TableFilterValue, options: TableSelectOption[]): string;
+export declare function rowMatchesColumnFilter(row: DynamicTableRow, column: TableSchemaColumn, value: TableFilterValue): boolean;
+/**
+ * The options a column filter offers: the column's own `options`, nothing for `optionsSource`
+ * (the select loads them), else the distinct values of `data`, shown the way the cells show them.
+ */
+export declare function resolveFilterOptions(column: TableSchemaColumn, data: DynamicTableRow[], formatOptions: TableCellFormatOptions): TableSelectOption[];

package/dist/components/Table/Table.utils.d.ts

@@ -1,7 +1,7 @@
 import type * as React from "react";
 import type { ZuiMessages } from "../../config/messages.js";
 import { type ZuiDigits } from "../../services/localizeDigits/localizeDigits.js";
-import type { DynamicTableRow, TableActiveSort, TableRowId, TableRowIdResolver, TableSchemaColumn, TableSortDirection } from "./Table.interface.js";
+import type { DynamicTableRow, TableActiveSort, TableFilterValue, TableRowId, TableRowIdResolver, TableSchemaColumn, TableSelectOption, TableSortDirection } from "./Table.interface.js";
 export declare const ACTIONS_COLUMN_WIDTH_PX = 112;
 export declare function resolveColumnWidthPercentages(visibleColumns: TableSchemaColumn[], shouldShowRowNumbers: boolean, hasRowActions: boolean): {
     rowNumberColumnStyle: React.CSSProperties | undefined;
@@ -37,3 +37,12 @@ export declare function resolveAriaSort(direction: TableSortDirection | undefine
  */
 export declare function resolveSortToggleTooltipText(columnLabel: string, direction: TableSortDirection | undefined, labels: ZuiMessages["table"]): string;
 export declare function replaceRowByIdentifier(rows: DynamicTableRow[], targetRowIndex: number, targetRowId: TableRowId | undefined, getRowId: TableRowIdResolver | undefined, nextRow: DynamicTableRow): DynamicTableRow[];
+export declare function isEmptyFilterValue(value: TableFilterValue | undefined): boolean;
+/** The chosen values as the filter chips and the phone filter list show them. */
+export declare function resolveFilterText(value: TableFilterValue, options: TableSelectOption[]): string;
+export declare function rowMatchesColumnFilter(row: DynamicTableRow, column: TableSchemaColumn, value: TableFilterValue): boolean;
+/**
+ * The options a column filter offers: the column's own `options`, nothing for `optionsSource`
+ * (the select loads them), else the distinct values of `data`, shown the way the cells show them.
+ */
+export declare function resolveFilterOptions(column: TableSchemaColumn, data: DynamicTableRow[], formatOptions: TableCellFormatOptions): TableSelectOption[];

package/dist/components/Table/Table.utils.js

@@ -182,5 +182,27 @@ function k(e, t, n, r, i) {
 	let o = [...e];
 	return o[a] = i, o;
 }
+function A(e) {
+	return e === void 0 || e.length === 0;
+}
+function j(e, t) {
+	return e.map((e) => t.find((t) => t.value === e)?.label ?? e).join(", ");
+}
+function M(e, t, n) {
+	let r = e[t.key];
+	return n.includes(r == null ? "" : String(r).trim());
+}
+function N(e, t, n) {
+	if (Array.isArray(e.options) && e.options.length > 0) return e.options;
+	if (e.optionsSource) return [];
+	let r = /* @__PURE__ */ new Map();
+	return t.forEach((t) => {
+		let i = t[e.key], a = i == null ? "" : String(i).trim();
+		a.length > 0 && !r.has(a) && r.set(a, x(i, e, n));
+	}), Array.from(r, ([e, t]) => ({
+		value: e,
+		label: t
+	})).sort((e, t) => e.label.localeCompare(t.label, void 0, { numeric: !0 }));
+}
 //#endregion
-export { T as compareTableRowsByColumn, x as formatCellValue, k as replaceRowByIdentifier, D as resolveAriaSort, c as resolveColumnWidthPercentages, u as resolveLoadingCellSkeletonClassName, l as resolveLoadingRowsCount, E as resolveNextSort, h as resolvePlaceholder, S as resolveSafeRowId, O as resolveSortToggleTooltipText };
+export { T as compareTableRowsByColumn, x as formatCellValue, A as isEmptyFilterValue, k as replaceRowByIdentifier, D as resolveAriaSort, c as resolveColumnWidthPercentages, N as resolveFilterOptions, j as resolveFilterText, u as resolveLoadingCellSkeletonClassName, l as resolveLoadingRowsCount, E as resolveNextSort, h as resolvePlaceholder, S as resolveSafeRowId, O as resolveSortToggleTooltipText, M as rowMatchesColumnFilter };

package/dist/components/Table/Table.variant.cjs

@@ -1 +1 @@
-require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../shared/responsiveScale.cjs`);let t=require(`class-variance-authority`);var n=(0,t.cva)(`zui:relative zui:w-full zui:min-w-0 zui:overflow-hidden zui:p-1.25`),r=(0,t.cva)(`zui:w-full zui:table-fixed ${e.TABLE_TEXT_SIZE}`,{variants:{showColumnBorder:{true:`zui:[&_th]:border-e zui:[&_td]:border-e zui:[&_th]:border-[var(--zui-theme-border-default)] zui:[&_td]:border-[var(--zui-theme-border-default)] zui:[&_tr>*:last-child]:border-e-0`,false:``},showRowBorder:{true:`zui:[&_tbody_tr>*]:border-b zui:[&_tbody_tr>*]:border-[var(--zui-theme-border-default)] zui:[&_tbody_tr:last-child>*]:border-b-0`,false:``}},defaultVariants:{showColumnBorder:!1,showRowBorder:!1}}),i=(0,t.cva)(``),a=(0,t.cva)(`zui:[&>tr:first-child>td]:pt-5 zui:[&>tr:nth-child(odd)>td]:bg-[var(--zui-color-muted-surface)] zui:[&>tr:nth-child(even)>td]:bg-[var(--zui-color-surface)]`),o=(0,t.cva)(`zui:bg-[var(--zui-color-surface)] zui:font-medium zui:text-[var(--zui-color-text)]`),s=(0,t.cva)(`zui:cursor-default`),c={start:`zui:text-start`,center:`zui:text-center`,end:`zui:text-end`},l=(0,t.cva)(`zui:relative ${e.TABLE_HEADER_HEIGHT} zui:whitespace-normal zui:break-words zui:bg-[var(--zui-color-primary)] ${e.CONTROL_PADDING_X} zui:align-middle zui:font-medium zui:text-[var(--zui-color-surface)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`,{variants:{align:c},defaultVariants:{align:`start`}}),u=(0,t.cva)(`zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:border-0 zui:bg-transparent zui:px-1.5 zui:py-1 zui:text-[var(--zui-color-surface)] zui:outline-none`),d=(0,t.cva)(`zui:transition-opacity zui:duration-200 zui:ease-out`,{variants:{emphasis:{highlighted:`zui:opacity-100`,idle:`zui:opacity-55`,dimmed:`zui:opacity-25`}},defaultVariants:{emphasis:`idle`}}),f=(0,t.cva)(`${e.CONTROL_PADDING_X} ${e.CONTROL_PADDING_Y} zui:whitespace-normal zui:break-words zui:align-middle zui:text-[var(--zui-color-text)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`,{variants:{align:c},defaultVariants:{align:`start`}});exports.tableBodyVariants=a,exports.tableCellVariants=f,exports.tableContainerVariants=n,exports.tableFooterVariants=o,exports.tableHeadVariants=l,exports.tableHeaderVariants=i,exports.tableRowVariants=s,exports.tableSortArrowVariants=d,exports.tableSortToggleVariants=u,exports.tableVariants=r;
+require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../shared/responsiveScale.cjs`);let t=require(`class-variance-authority`);var n=(0,t.cva)(`zui:relative zui:w-full zui:min-w-0 zui:overflow-hidden zui:p-1.25`),r=(0,t.cva)(`zui:w-full zui:table-fixed ${e.TABLE_TEXT_SIZE}`,{variants:{showColumnBorder:{true:`zui:[&_th]:border-e zui:[&_td]:border-e zui:[&_th]:border-[var(--zui-theme-border-default)] zui:[&_td]:border-[var(--zui-theme-border-default)] zui:[&_tr>*:last-child]:border-e-0`,false:``},showRowBorder:{true:`zui:[&_tbody_tr>*]:border-b zui:[&_tbody_tr>*]:border-[var(--zui-theme-border-default)] zui:[&_tbody_tr:last-child>*]:border-b-0`,false:``}},defaultVariants:{showColumnBorder:!1,showRowBorder:!1}}),i=(0,t.cva)(``),a=(0,t.cva)(`zui:[&>tr:first-child>td]:pt-5 zui:[&>tr:nth-child(odd)>td]:bg-[var(--zui-color-muted-surface)] zui:[&>tr:nth-child(even)>td]:bg-[var(--zui-color-surface)]`),o=(0,t.cva)(`zui:bg-[var(--zui-color-surface)] zui:font-medium zui:text-[var(--zui-color-text)]`),s=(0,t.cva)(`zui:cursor-default`),c={start:`zui:text-start`,center:`zui:text-center`,end:`zui:text-end`},l=(0,t.cva)(`zui:relative ${e.TABLE_HEADER_HEIGHT} zui:whitespace-normal zui:break-words zui:bg-[var(--zui-color-primary)] ${e.CONTROL_PADDING_X} zui:align-middle zui:font-medium zui:text-[var(--zui-color-surface)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`,{variants:{align:c},defaultVariants:{align:`start`}}),u=(0,t.cva)(`zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:border-0 zui:bg-transparent zui:px-1.5 zui:py-1 zui:text-[var(--zui-color-surface)] zui:outline-none`),d=(0,t.cva)(`zui:transition-opacity zui:duration-200 zui:ease-out`,{variants:{emphasis:{highlighted:`zui:opacity-100`,idle:`zui:opacity-55`,dimmed:`zui:opacity-25`}},defaultVariants:{emphasis:`idle`}}),f=(0,t.cva)(`${e.CONTROL_PADDING_X} ${e.CONTROL_PADDING_Y} zui:whitespace-normal zui:break-words zui:align-middle zui:text-[var(--zui-color-text)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`,{variants:{align:c},defaultVariants:{align:`start`}}),p=(0,t.cva)(`zui:relative zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-md zui:border-0 zui:p-1 zui:text-[var(--zui-color-surface)] zui:outline-none zui:transition-[opacity,background-color] zui:duration-200 zui:hover:bg-[color-mix(in_srgb,var(--zui-color-surface)_20%,transparent)] zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]`,{variants:{active:{true:`zui:bg-[color-mix(in_srgb,var(--zui-color-surface)_24%,transparent)] zui:opacity-100`,false:`zui:bg-transparent zui:opacity-85 zui:hover:opacity-100`}},defaultVariants:{active:!1}}),m=`zui:inline-flex zui:max-w-full zui:items-center zui:gap-1 zui-radius-xs zui:border zui:border-[var(--zui-theme-action-primary)] zui:bg-transparent zui:ps-3 zui:pe-1.5 zui:text-base zui:text-[var(--zui-color-text)] zui:md:text-sm zui:mobile:shrink-0 zui:duration-200 zui:animate-in zui:fade-in-0 zui:zoom-in-95 ${e.CONTROL_HEIGHT_SM}`,h=`zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-full zui:border-0 zui:bg-transparent zui:p-0.5 zui:text-[var(--zui-color-text)] zui:opacity-70 zui:outline-none zui:transition-colors zui:hover:bg-[var(--zui-color-muted-surface)] zui:hover:opacity-100 zui:focus-visible:opacity-100 zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]`;exports.tableActiveFilterChipClassName=m,exports.tableActiveFilterRemoveClassName=h,exports.tableBodyVariants=a,exports.tableCellVariants=f,exports.tableContainerVariants=n,exports.tableFilterToggleVariants=p,exports.tableFooterVariants=o,exports.tableHeadVariants=l,exports.tableHeaderVariants=i,exports.tableRowVariants=s,exports.tableSortArrowVariants=d,exports.tableSortToggleVariants=u,exports.tableVariants=r;

package/dist/components/Table/Table.variant.d.cts

@@ -17,3 +17,8 @@ export declare const tableSortArrowVariants: (props?: ({
 export declare const tableCellVariants: (props?: ({
     align?: "end" | "start" | "center" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const tableFilterToggleVariants: (props?: ({
+    active?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const tableActiveFilterChipClassName = "zui:inline-flex zui:max-w-full zui:items-center zui:gap-1 zui-radius-xs zui:border zui:border-[var(--zui-theme-action-primary)] zui:bg-transparent zui:ps-3 zui:pe-1.5 zui:text-base zui:text-[var(--zui-color-text)] zui:md:text-sm zui:mobile:shrink-0 zui:duration-200 zui:animate-in zui:fade-in-0 zui:zoom-in-95 zui:h-[calc(var(--zui-scale,10px)*4.608)]";
+export declare const tableActiveFilterRemoveClassName = "zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-full zui:border-0 zui:bg-transparent zui:p-0.5 zui:text-[var(--zui-color-text)] zui:opacity-70 zui:outline-none zui:transition-colors zui:hover:bg-[var(--zui-color-muted-surface)] zui:hover:opacity-100 zui:focus-visible:opacity-100 zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]";

package/dist/components/Table/Table.variant.d.ts

@@ -17,3 +17,8 @@ export declare const tableSortArrowVariants: (props?: ({
 export declare const tableCellVariants: (props?: ({
     align?: "end" | "start" | "center" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const tableFilterToggleVariants: (props?: ({
+    active?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const tableActiveFilterChipClassName = "zui:inline-flex zui:max-w-full zui:items-center zui:gap-1 zui-radius-xs zui:border zui:border-[var(--zui-theme-action-primary)] zui:bg-transparent zui:ps-3 zui:pe-1.5 zui:text-base zui:text-[var(--zui-color-text)] zui:md:text-sm zui:mobile:shrink-0 zui:duration-200 zui:animate-in zui:fade-in-0 zui:zoom-in-95 zui:h-[calc(var(--zui-scale,10px)*4.608)]";
+export declare const tableActiveFilterRemoveClassName = "zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-full zui:border-0 zui:bg-transparent zui:p-0.5 zui:text-[var(--zui-color-text)] zui:opacity-70 zui:outline-none zui:transition-colors zui:hover:bg-[var(--zui-color-muted-surface)] zui:hover:opacity-100 zui:focus-visible:opacity-100 zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]";

package/dist/components/Table/Table.variant.js

@@ -1,7 +1,7 @@
-import { CONTROL_PADDING_X as e, CONTROL_PADDING_Y as t, TABLE_HEADER_HEIGHT as n, TABLE_TEXT_SIZE as r } from "../shared/responsiveScale.js";
-import { cva as i } from "class-variance-authority";
+import { CONTROL_HEIGHT_SM as e, CONTROL_PADDING_X as t, CONTROL_PADDING_Y as n, TABLE_HEADER_HEIGHT as r, TABLE_TEXT_SIZE as i } from "../shared/responsiveScale.js";
+import { cva as a } from "class-variance-authority";
 //#region src/components/Table/Table.variant.ts
-var a = i("zui:relative zui:w-full zui:min-w-0 zui:overflow-hidden zui:p-1.25"), o = i(`zui:w-full zui:table-fixed ${r}`, {
+var o = a("zui:relative zui:w-full zui:min-w-0 zui:overflow-hidden zui:p-1.25"), s = a(`zui:w-full zui:table-fixed ${i}`, {
 	variants: {
 		showColumnBorder: {
 			true: "zui:[&_th]:border-e zui:[&_td]:border-e zui:[&_th]:border-[var(--zui-theme-border-default)] zui:[&_td]:border-[var(--zui-theme-border-default)] zui:[&_tr>*:last-child]:border-e-0",
@@ -16,23 +16,29 @@ var a = i("zui:relative zui:w-full zui:min-w-0 zui:overflow-hidden zui:p-1.25"),
 		showColumnBorder: !1,
 		showRowBorder: !1
 	}
-}), s = i(""), c = i("zui:[&>tr:first-child>td]:pt-5 zui:[&>tr:nth-child(odd)>td]:bg-[var(--zui-color-muted-surface)] zui:[&>tr:nth-child(even)>td]:bg-[var(--zui-color-surface)]"), l = i("zui:bg-[var(--zui-color-surface)] zui:font-medium zui:text-[var(--zui-color-text)]"), u = i("zui:cursor-default"), d = {
+}), c = a(""), l = a("zui:[&>tr:first-child>td]:pt-5 zui:[&>tr:nth-child(odd)>td]:bg-[var(--zui-color-muted-surface)] zui:[&>tr:nth-child(even)>td]:bg-[var(--zui-color-surface)]"), u = a("zui:bg-[var(--zui-color-surface)] zui:font-medium zui:text-[var(--zui-color-text)]"), d = a("zui:cursor-default"), f = {
 	start: "zui:text-start",
 	center: "zui:text-center",
 	end: "zui:text-end"
-}, f = i(`zui:relative ${n} zui:whitespace-normal zui:break-words zui:bg-[var(--zui-color-primary)] ${e} zui:align-middle zui:font-medium zui:text-[var(--zui-color-surface)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`, {
-	variants: { align: d },
+}, p = a(`zui:relative ${r} zui:whitespace-normal zui:break-words zui:bg-[var(--zui-color-primary)] ${t} zui:align-middle zui:font-medium zui:text-[var(--zui-color-surface)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`, {
+	variants: { align: f },
 	defaultVariants: { align: "start" }
-}), p = i("zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:border-0 zui:bg-transparent zui:px-1.5 zui:py-1 zui:text-[var(--zui-color-surface)] zui:outline-none"), m = i("zui:transition-opacity zui:duration-200 zui:ease-out", {
+}), m = a("zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:border-0 zui:bg-transparent zui:px-1.5 zui:py-1 zui:text-[var(--zui-color-surface)] zui:outline-none"), h = a("zui:transition-opacity zui:duration-200 zui:ease-out", {
 	variants: { emphasis: {
 		highlighted: "zui:opacity-100",
 		idle: "zui:opacity-55",
 		dimmed: "zui:opacity-25"
 	} },
 	defaultVariants: { emphasis: "idle" }
-}), h = i(`${e} ${t} zui:whitespace-normal zui:break-words zui:align-middle zui:text-[var(--zui-color-text)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`, {
-	variants: { align: d },
+}), g = a(`${t} ${n} zui:whitespace-normal zui:break-words zui:align-middle zui:text-[var(--zui-color-text)] zui:[&:has([role=checkbox])]:ps-0 zui:[&>[role=checkbox]]:translate-y-[2px]`, {
+	variants: { align: f },
 	defaultVariants: { align: "start" }
-});
+}), _ = a("zui:relative zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-md zui:border-0 zui:p-1 zui:text-[var(--zui-color-surface)] zui:outline-none zui:transition-[opacity,background-color] zui:duration-200 zui:hover:bg-[color-mix(in_srgb,var(--zui-color-surface)_20%,transparent)] zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]", {
+	variants: { active: {
+		true: "zui:bg-[color-mix(in_srgb,var(--zui-color-surface)_24%,transparent)] zui:opacity-100",
+		false: "zui:bg-transparent zui:opacity-85 zui:hover:opacity-100"
+	} },
+	defaultVariants: { active: !1 }
+}), v = `zui:inline-flex zui:max-w-full zui:items-center zui:gap-1 zui-radius-xs zui:border zui:border-[var(--zui-theme-action-primary)] zui:bg-transparent zui:ps-3 zui:pe-1.5 zui:text-base zui:text-[var(--zui-color-text)] zui:md:text-sm zui:mobile:shrink-0 zui:duration-200 zui:animate-in zui:fade-in-0 zui:zoom-in-95 ${e}`, y = "zui:inline-flex zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-full zui:border-0 zui:bg-transparent zui:p-0.5 zui:text-[var(--zui-color-text)] zui:opacity-70 zui:outline-none zui:transition-colors zui:hover:bg-[var(--zui-color-muted-surface)] zui:hover:opacity-100 zui:focus-visible:opacity-100 zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]";
 //#endregion
-export { c as tableBodyVariants, h as tableCellVariants, a as tableContainerVariants, l as tableFooterVariants, f as tableHeadVariants, s as tableHeaderVariants, u as tableRowVariants, m as tableSortArrowVariants, p as tableSortToggleVariants, o as tableVariants };
+export { v as tableActiveFilterChipClassName, y as tableActiveFilterRemoveClassName, l as tableBodyVariants, g as tableCellVariants, o as tableContainerVariants, _ as tableFilterToggleVariants, u as tableFooterVariants, p as tableHeadVariants, c as tableHeaderVariants, d as tableRowVariants, h as tableSortArrowVariants, m as tableSortToggleVariants, s as tableVariants };

package/dist/components/Table/TableActiveFilters.cjs

@@ -0,0 +1 @@
+"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../services/localizeDigits/localizeDigits.cjs`),n=require(`../Tooltip/Tooltip.cjs`),r=require(`../shared/FieldClearButton.cjs`),i=require(`./Table.utils.cjs`),a=require(`./Table.variant.cjs`);let o=require(`react/jsx-runtime`),s=require(`lucide-react`);function c({columns:c,values:l,optionsByColumn:u,onRemove:d,onSelect:f}){let{messages:p,digits:m}=e.useZuiConfig(),h=c.flatMap(e=>{let t=l[e.key];return t===void 0||i.isEmptyFilterValue(t)?[]:[{column:e,text:i.resolveFilterText(t,u[e.key]??[])}]});return h.length===0?null:(0,o.jsx)(`div`,{"data-slot":`table-active-filters`,className:`zui:mb-3 zui:flex zui:flex-wrap zui:items-center zui:gap-2 zui:mobile:flex-nowrap zui:mobile:overflow-x-auto zui:mobile:[scrollbar-width:none] zui:mobile:[&::-webkit-scrollbar]:hidden`,children:h.map(({column:e,text:i})=>{let c=`${p.table.filterClear}: ${t.localizeDigits(e.label,m)}`;return(0,o.jsxs)(`span`,{"data-slot":`table-active-filter`,className:a.tableActiveFilterChipClassName,children:[f?(0,o.jsx)(`button`,{type:`button`,"data-slot":`table-active-filter-button`,onClick:()=>f(e.key),className:`zui:min-w-0 zui:cursor-pointer zui:truncate zui:border-0 zui:bg-transparent zui:p-0 zui:text-inherit zui:outline-none`,children:t.localizeDigits(`${e.label}: ${i}`,m)}):(0,o.jsx)(`span`,{className:`zui:min-w-0 zui:truncate`,children:t.localizeDigits(`${e.label}: ${i}`,m)}),(0,o.jsx)(n.default,{text:c,position:`top`,trigger:(0,o.jsx)(`button`,{type:`button`,"aria-label":c,onClick:()=>d(e.key),className:a.tableActiveFilterRemoveClassName,children:(0,o.jsx)(s.X,{className:r.CLEAR_ICON_CLASS,"aria-hidden":`true`})})})]},e.key)})})}exports.default=c;

package/dist/components/Table/TableActiveFilters.d.cts

@@ -0,0 +1,12 @@
+import type { TableFilterValues, TableSchemaColumn, TableSelectOption } from "./Table.interface.cjs";
+type TableActiveFiltersProps = {
+    columns: TableSchemaColumn[];
+    values: TableFilterValues;
+    optionsByColumn: Record<string, TableSelectOption[]>;
+    onRemove: (columnKey: string) => void;
+    /** Makes the chip itself a button (on phones it reopens that column's filter). */
+    onSelect?: (columnKey: string) => void;
+};
+/** The row of chips above the table that lists the active column filters. */
+export default function TableActiveFilters({ columns, values, optionsByColumn, onRemove, onSelect, }: TableActiveFiltersProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/Table/TableActiveFilters.d.ts

@@ -0,0 +1,12 @@
+import type { TableFilterValues, TableSchemaColumn, TableSelectOption } from "./Table.interface.js";
+type TableActiveFiltersProps = {
+    columns: TableSchemaColumn[];
+    values: TableFilterValues;
+    optionsByColumn: Record<string, TableSelectOption[]>;
+    onRemove: (columnKey: string) => void;
+    /** Makes the chip itself a button (on phones it reopens that column's filter). */
+    onSelect?: (columnKey: string) => void;
+};
+/** The row of chips above the table that lists the active column filters. */
+export default function TableActiveFilters({ columns, values, optionsByColumn, onRemove, onSelect, }: TableActiveFiltersProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/Table/TableActiveFilters.js

@@ -0,0 +1,55 @@
+"use client";
+import { useZuiConfig as e } from "../../config/useZuiConfig.js";
+import { localizeDigits as t } from "../../services/localizeDigits/localizeDigits.js";
+import n from "../Tooltip/Tooltip.js";
+import { CLEAR_ICON_CLASS as r } from "../shared/FieldClearButton.js";
+import { isEmptyFilterValue as i, resolveFilterText as a } from "./Table.utils.js";
+import { tableActiveFilterChipClassName as o, tableActiveFilterRemoveClassName as s } from "./Table.variant.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { X as u } from "lucide-react";
+//#region src/components/Table/TableActiveFilters.tsx
+function d({ columns: d, values: f, optionsByColumn: p, onRemove: m, onSelect: h }) {
+	let { messages: g, digits: _ } = e(), v = d.flatMap((e) => {
+		let t = f[e.key];
+		return t === void 0 || i(t) ? [] : [{
+			column: e,
+			text: a(t, p[e.key] ?? [])
+		}];
+	});
+	return v.length === 0 ? null : /* @__PURE__ */ c("div", {
+		"data-slot": "table-active-filters",
+		className: "zui:mb-3 zui:flex zui:flex-wrap zui:items-center zui:gap-2 zui:mobile:flex-nowrap zui:mobile:overflow-x-auto zui:mobile:[scrollbar-width:none] zui:mobile:[&::-webkit-scrollbar]:hidden",
+		children: v.map(({ column: e, text: i }) => {
+			let a = `${g.table.filterClear}: ${t(e.label, _)}`;
+			return /* @__PURE__ */ l("span", {
+				"data-slot": "table-active-filter",
+				className: o,
+				children: [h ? /* @__PURE__ */ c("button", {
+					type: "button",
+					"data-slot": "table-active-filter-button",
+					onClick: () => h(e.key),
+					className: "zui:min-w-0 zui:cursor-pointer zui:truncate zui:border-0 zui:bg-transparent zui:p-0 zui:text-inherit zui:outline-none",
+					children: t(`${e.label}: ${i}`, _)
+				}) : /* @__PURE__ */ c("span", {
+					className: "zui:min-w-0 zui:truncate",
+					children: t(`${e.label}: ${i}`, _)
+				}), /* @__PURE__ */ c(n, {
+					text: a,
+					position: "top",
+					trigger: /* @__PURE__ */ c("button", {
+						type: "button",
+						"aria-label": a,
+						onClick: () => m(e.key),
+						className: s,
+						children: /* @__PURE__ */ c(u, {
+							className: r,
+							"aria-hidden": "true"
+						})
+					})
+				})]
+			}, e.key);
+		})
+	});
+}
+//#endregion
+export { d as default };

package/dist/components/Table/TableColumnFilter.cjs

@@ -0,0 +1 @@
+"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../services/localizeDigits/localizeDigits.cjs`),n=require(`../Select/Select.cjs`),r=require(`./Table.constants.cjs`),i=require(`./Table.utils.cjs`),a=require(`./Table.variant.cjs`);let o=require(`react/jsx-runtime`),s=require(`lucide-react`);function c({column:c,value:l,onChange:u,options:d}){let{messages:f,digits:p}=e.useZuiConfig(),m=!i.isEmptyFilterValue(l),h=`${f.table.filterBy} ${t.localizeDigits(c.label,p)}`;return(0,o.jsx)(`span`,{"data-slot":`table-filter`,className:`zui:inline-flex zui:shrink-0`,children:(0,o.jsxs)(n.default,{type:`multi`,isSearch:!0,searchActions:!1,placeholder:h,options:d,remoteOptions:c.optionsSource,value:l??[],onValueChange:e=>u(e.length>0?e:void 0),children:[(0,o.jsxs)(n.SelectTrigger,{unstyled:!0,"aria-label":h,tooltip:h,"data-slot":`table-filter-toggle-button`,"data-active":m||void 0,className:a.tableFilterToggleVariants({active:m}),children:[(0,o.jsx)(s.Funnel,{className:r.filterIconClassName,fill:m?`currentColor`:`none`,"aria-hidden":`true`}),m?(0,o.jsx)(`span`,{"aria-hidden":`true`,"data-slot":`table-filter-active-dot`,className:`zui:absolute zui:end-0 zui:top-0 zui:size-2 zui:rounded-full zui:bg-[var(--zui-color-surface)] zui:ring-2 zui:ring-[var(--zui-color-primary)]`}):null]}),(0,o.jsx)(n.SelectContent,{className:`zui:w-60`})]})})}function l({column:r,value:i,onChange:a,options:s,open:c,onOpenChange:l}){let{messages:u,digits:d}=e.useZuiConfig();return(0,o.jsx)(`div`,{"data-slot":`table-filter-sheet`,"aria-hidden":`true`,className:`zui:sr-only`,children:(0,o.jsx)(n.default,{type:`multi`,isSearch:!0,searchActions:!1,placeholder:`${u.table.filterBy} ${t.localizeDigits(r.label,d)}`,options:s,remoteOptions:r.optionsSource,value:i??[],onValueChange:e=>a(e.length>0?e:void 0),open:c,onOpenChange:l,children:(0,o.jsx)(n.SelectTrigger,{unstyled:!0,tabIndex:-1})})})}exports.TableColumnFilterSheet=l,exports.default=c;

package/dist/components/Table/TableColumnFilter.d.cts

@@ -0,0 +1,17 @@
+import type { TableColumnFilterProps } from "./Table.interface.cjs";
+/**
+ * The filter button of a column header. It opens the same dropdown as `Select`: a multi-select of
+ * the values the column can have, with its search field.
+ */
+export default function TableColumnFilter({ column, value, onChange, options, }: TableColumnFilterProps): import("react/jsx-runtime").JSX.Element;
+type TableColumnFilterSheetProps = TableColumnFilterProps & {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+};
+/**
+ * The filter of one column on a phone, where the header (and so its button) is not there: the same
+ * multi-select, opened from the filter list and shown as the bottom sheet every `Select` becomes
+ * below the mobile breakpoint. Nothing of it is visible while closed.
+ */
+export declare function TableColumnFilterSheet({ column, value, onChange, options, open, onOpenChange, }: TableColumnFilterSheetProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Table/TableColumnFilter.d.ts

@@ -0,0 +1,17 @@
+import type { TableColumnFilterProps } from "./Table.interface.js";
+/**
+ * The filter button of a column header. It opens the same dropdown as `Select`: a multi-select of
+ * the values the column can have, with its search field.
+ */
+export default function TableColumnFilter({ column, value, onChange, options, }: TableColumnFilterProps): import("react/jsx-runtime").JSX.Element;
+type TableColumnFilterSheetProps = TableColumnFilterProps & {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+};
+/**
+ * The filter of one column on a phone, where the header (and so its button) is not there: the same
+ * multi-select, opened from the filter list and shown as the bottom sheet every `Select` becomes
+ * below the mobile breakpoint. Nothing of it is visible while closed.
+ */
+export declare function TableColumnFilterSheet({ column, value, onChange, options, open, onOpenChange, }: TableColumnFilterSheetProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Table/TableColumnFilter.js

@@ -0,0 +1,70 @@
+"use client";
+import { useZuiConfig as e } from "../../config/useZuiConfig.js";
+import { localizeDigits as t } from "../../services/localizeDigits/localizeDigits.js";
+import n, { SelectContent as r, SelectTrigger as i } from "../Select/Select.js";
+import { filterIconClassName as a } from "./Table.constants.js";
+import { isEmptyFilterValue as o } from "./Table.utils.js";
+import { tableFilterToggleVariants as s } from "./Table.variant.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Funnel as u } from "lucide-react";
+//#region src/components/Table/TableColumnFilter.tsx
+function d({ column: d, value: f, onChange: p, options: m }) {
+	let { messages: h, digits: g } = e(), _ = !o(f), v = `${h.table.filterBy} ${t(d.label, g)}`;
+	return /* @__PURE__ */ c("span", {
+		"data-slot": "table-filter",
+		className: "zui:inline-flex zui:shrink-0",
+		children: /* @__PURE__ */ l(n, {
+			type: "multi",
+			isSearch: !0,
+			searchActions: !1,
+			placeholder: v,
+			options: m,
+			remoteOptions: d.optionsSource,
+			value: f ?? [],
+			onValueChange: (e) => p(e.length > 0 ? e : void 0),
+			children: [/* @__PURE__ */ l(i, {
+				unstyled: !0,
+				"aria-label": v,
+				tooltip: v,
+				"data-slot": "table-filter-toggle-button",
+				"data-active": _ || void 0,
+				className: s({ active: _ }),
+				children: [/* @__PURE__ */ c(u, {
+					className: a,
+					fill: _ ? "currentColor" : "none",
+					"aria-hidden": "true"
+				}), _ ? /* @__PURE__ */ c("span", {
+					"aria-hidden": "true",
+					"data-slot": "table-filter-active-dot",
+					className: "zui:absolute zui:end-0 zui:top-0 zui:size-2 zui:rounded-full zui:bg-[var(--zui-color-surface)] zui:ring-2 zui:ring-[var(--zui-color-primary)]"
+				}) : null]
+			}), /* @__PURE__ */ c(r, { className: "zui:w-60" })]
+		})
+	});
+}
+function f({ column: r, value: a, onChange: o, options: s, open: l, onOpenChange: u }) {
+	let { messages: d, digits: f } = e();
+	return /* @__PURE__ */ c("div", {
+		"data-slot": "table-filter-sheet",
+		"aria-hidden": "true",
+		className: "zui:sr-only",
+		children: /* @__PURE__ */ c(n, {
+			type: "multi",
+			isSearch: !0,
+			searchActions: !1,
+			placeholder: `${d.table.filterBy} ${t(r.label, f)}`,
+			options: s,
+			remoteOptions: r.optionsSource,
+			value: a ?? [],
+			onValueChange: (e) => o(e.length > 0 ? e : void 0),
+			open: l,
+			onOpenChange: u,
+			children: /* @__PURE__ */ c(i, {
+				unstyled: !0,
+				tabIndex: -1
+			})
+		})
+	});
+}
+//#endregion
+export { f as TableColumnFilterSheet, d as default };

package/dist/components/Table/TableEmptyState.cjs

@@ -1 +1 @@
-"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../lib/utils.cjs`),n=require(`./Table.variant.cjs`);let r=require(`react/jsx-runtime`);function i({colSpan:i,showSearchInput:a,normalizedSearchTerm:o}){let{messages:s}=e.useZuiConfig();return(0,r.jsx)(`tr`,{className:n.tableRowVariants(),children:(0,r.jsx)(`td`,{colSpan:i,className:t.cn(n.tableCellVariants(),`zui:py-7 zui:text-center zui:text-[var(--zui-color-text)]`),children:a&&o.length>0?s.table.noSearchResults:s.table.empty})})}exports.default=i;
+"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../lib/utils.cjs`),n=require(`./Table.variant.cjs`);let r=require(`react/jsx-runtime`);function i({colSpan:i,showSearchInput:a,normalizedSearchTerm:o,hasActiveFilters:s=!1,onClearFilters:c}){let{messages:l}=e.useZuiConfig();return(0,r.jsx)(`tr`,{className:n.tableRowVariants(),children:(0,r.jsxs)(`td`,{colSpan:i,className:t.cn(n.tableCellVariants(),`zui:py-7 zui:text-center zui:text-[var(--zui-color-text)]`),children:[s?l.table.noFilterResults:a&&o.length>0?l.table.noSearchResults:l.table.empty,s&&c?(0,r.jsx)(`div`,{className:`zui:mt-2`,children:(0,r.jsx)(`button`,{type:`button`,"data-slot":`table-empty-clear-filters`,onClick:c,className:`zui:cursor-pointer zui:border-0 zui:bg-transparent zui:p-0 zui:text-xs zui:text-[var(--zui-theme-action-primary)] zui:underline zui:outline-none zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]`,children:l.table.filterClearAll})}):null]})})}exports.default=i;

package/dist/components/Table/TableEmptyState.d.cts

@@ -1,2 +1,2 @@
 import type { TableEmptyStateProps } from "./Table.interface.cjs";
-export default function TableEmptyState({ colSpan, showSearchInput, normalizedSearchTerm, }: TableEmptyStateProps): import("react/jsx-runtime").JSX.Element;
+export default function TableEmptyState({ colSpan, showSearchInput, normalizedSearchTerm, hasActiveFilters, onClearFilters, }: TableEmptyStateProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Table/TableEmptyState.d.ts

@@ -1,2 +1,2 @@
 import type { TableEmptyStateProps } from "./Table.interface.js";
-export default function TableEmptyState({ colSpan, showSearchInput, normalizedSearchTerm, }: TableEmptyStateProps): import("react/jsx-runtime").JSX.Element;
+export default function TableEmptyState({ colSpan, showSearchInput, normalizedSearchTerm, hasActiveFilters, onClearFilters, }: TableEmptyStateProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Table/TableEmptyState.js

@@ -2,18 +2,27 @@
 import { useZuiConfig as e } from "../../config/useZuiConfig.js";
 import { cn as t } from "../../lib/utils.js";
 import { tableCellVariants as n, tableRowVariants as r } from "./Table.variant.js";
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/Table/TableEmptyState.tsx
-function a({ colSpan: a, showSearchInput: o, normalizedSearchTerm: s }) {
-	let { messages: c } = e();
+function o({ colSpan: o, showSearchInput: s, normalizedSearchTerm: c, hasActiveFilters: l = !1, onClearFilters: u }) {
+	let { messages: d } = e();
 	return /* @__PURE__ */ i("tr", {
 		className: r(),
-		children: /* @__PURE__ */ i("td", {
-			colSpan: a,
+		children: /* @__PURE__ */ a("td", {
+			colSpan: o,
 			className: t(n(), "zui:py-7 zui:text-center zui:text-[var(--zui-color-text)]"),
-			children: o && s.length > 0 ? c.table.noSearchResults : c.table.empty
+			children: [l ? d.table.noFilterResults : s && c.length > 0 ? d.table.noSearchResults : d.table.empty, l && u ? /* @__PURE__ */ i("div", {
+				className: "zui:mt-2",
+				children: /* @__PURE__ */ i("button", {
+					type: "button",
+					"data-slot": "table-empty-clear-filters",
+					onClick: u,
+					className: "zui:cursor-pointer zui:border-0 zui:bg-transparent zui:p-0 zui:text-xs zui:text-[var(--zui-theme-action-primary)] zui:underline zui:outline-none zui:focus-visible:ring-2 zui:focus-visible:ring-[var(--zui-theme-action-secondary)]",
+					children: d.table.filterClearAll
+				})
+			}) : null]
 		})
 	});
 }
 //#endregion
-export { a as default };
+export { o as default };

package/dist/components/Table/TableSkeletonRows.cjs

@@ -1 +1 @@
-"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../lib/utils.cjs`),n=require(`../Skeleton/Skeleton.cjs`),r=require(`./Table.constants.cjs`),i=require(`./TableParts.cjs`),a=require(`./Table.utils.cjs`);let o=require(`react/jsx-runtime`);function s({count:s,keyPrefix:c,showRowNumbers:l,columns:u,actionsCount:d}){let{messages:f}=e.useZuiConfig();return Array.from({length:s},(e,s)=>(0,o.jsxs)(i.TableRow,{slot:`table-loading-row`,children:[l?(0,o.jsx)(i.TableCell,{align:`center`,className:r.rowNumberColumnClassName,"data-label":f.table.rowNumber,children:(0,o.jsx)(n.default,{className:`zui:mx-auto zui:h-4 zui:w-8`})}):null,u.map(e=>(0,o.jsx)(i.TableCell,{align:e.align,"data-label":e.label,children:(0,o.jsx)(n.default,{className:t.cn(`zui:max-w-full`,e.align===`center`?`zui:mx-auto`:void 0,a.resolveLoadingCellSkeletonClassName(e,s))})},`${c}-cell-${e.key}-${s}`)),d>0?(0,o.jsx)(i.TableCell,{align:`center`,"data-cell":`actions`,className:t.cn(r.actionsColumnClassName,r.actionsColumnStickyClassName),children:(0,o.jsx)(`div`,{"data-slot":`table-row-actions-skeleton`,className:`zui:flex zui:items-center zui:justify-center zui:gap-0.5`,children:Array.from({length:d},(e,t)=>(0,o.jsx)(n.default,{className:`zui:size-9`},`${c}-action-${t}`))})}):null]},`${c}-row-${s}`))}exports.default=s;
+"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../lib/utils.cjs`),n=require(`../Skeleton/Skeleton.cjs`),r=require(`./Table.constants.cjs`),i=require(`./Table.utils.cjs`),a=require(`./TableParts.cjs`);let o=require(`react/jsx-runtime`);function s({count:s,keyPrefix:c,showRowNumbers:l,columns:u,actionsCount:d}){let{messages:f}=e.useZuiConfig();return Array.from({length:s},(e,s)=>(0,o.jsxs)(a.TableRow,{slot:`table-loading-row`,children:[l?(0,o.jsx)(a.TableCell,{align:`center`,className:r.rowNumberColumnClassName,"data-label":f.table.rowNumber,children:(0,o.jsx)(n.default,{className:`zui:mx-auto zui:h-4 zui:w-8`})}):null,u.map(e=>(0,o.jsx)(a.TableCell,{align:e.align,"data-label":e.label,children:(0,o.jsx)(n.default,{className:t.cn(`zui:max-w-full`,e.align===`center`?`zui:mx-auto`:void 0,i.resolveLoadingCellSkeletonClassName(e,s))})},`${c}-cell-${e.key}-${s}`)),d>0?(0,o.jsx)(a.TableCell,{align:`center`,"data-cell":`actions`,className:t.cn(r.actionsColumnClassName,r.actionsColumnStickyClassName),children:(0,o.jsx)(`div`,{"data-slot":`table-row-actions-skeleton`,className:`zui:flex zui:items-center zui:justify-center zui:gap-0.5`,children:Array.from({length:d},(e,t)=>(0,o.jsx)(n.default,{className:`zui:size-9`},`${c}-action-${t}`))})}):null]},`${c}-row-${s}`))}exports.default=s;

package/dist/components/Table/TableSkeletonRows.js

@@ -3,27 +3,27 @@ import { useZuiConfig as e } from "../../config/useZuiConfig.js";
 import { cn as t } from "../../lib/utils.js";
 import n from "../Skeleton/Skeleton.js";
 import { actionsColumnClassName as r, actionsColumnStickyClassName as i, rowNumberColumnClassName as a } from "./Table.constants.js";
-import { TableCell as o, TableRow as s } from "./TableParts.js";
-import { resolveLoadingCellSkeletonClassName as c } from "./Table.utils.js";
+import { resolveLoadingCellSkeletonClassName as o } from "./Table.utils.js";
+import { TableCell as s, TableRow as c } from "./TableParts.js";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/Table/TableSkeletonRows.tsx
 function d({ count: d, keyPrefix: f, showRowNumbers: p, columns: m, actionsCount: h }) {
 	let { messages: g } = e();
-	return Array.from({ length: d }, (e, d) => /* @__PURE__ */ u(s, {
+	return Array.from({ length: d }, (e, d) => /* @__PURE__ */ u(c, {
 		slot: "table-loading-row",
 		children: [
-			p ? /* @__PURE__ */ l(o, {
+			p ? /* @__PURE__ */ l(s, {
 				align: "center",
 				className: a,
 				"data-label": g.table.rowNumber,
 				children: /* @__PURE__ */ l(n, { className: "zui:mx-auto zui:h-4 zui:w-8" })
 			}) : null,
-			m.map((e) => /* @__PURE__ */ l(o, {
+			m.map((e) => /* @__PURE__ */ l(s, {
 				align: e.align,
 				"data-label": e.label,
-				children: /* @__PURE__ */ l(n, { className: t("zui:max-w-full", e.align === "center" ? "zui:mx-auto" : void 0, c(e, d)) })
+				children: /* @__PURE__ */ l(n, { className: t("zui:max-w-full", e.align === "center" ? "zui:mx-auto" : void 0, o(e, d)) })
 			}, `${f}-cell-${e.key}-${d}`)),
-			h > 0 ? /* @__PURE__ */ l(o, {
+			h > 0 ? /* @__PURE__ */ l(s, {
 				align: "center",
 				"data-cell": "actions",
 				className: t(r, i),

package/dist/components/Table/TableSortToggle.cjs

@@ -1 +1 @@
-"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../lib/utils.cjs`),n=require(`../Tooltip/Tooltip.cjs`),r=require(`./Table.variant.cjs`),i=require(`./Table.constants.cjs`),a=require(`./Table.utils.cjs`);let o=require(`react/jsx-runtime`);function s(e,t){return t===void 0?`idle`:e===t?`highlighted`:`dimmed`}function c({columnLabel:c,direction:l,onToggle:u,className:d}){let{messages:f}=e.useZuiConfig(),p=a.resolveSortToggleTooltipText(c,l,f.table);return(0,o.jsx)(n.default,{text:p,position:`top`,trigger:(0,o.jsx)(`button`,{type:`button`,"aria-label":p,"data-slot":`table-sort-toggle-button`,"data-sort-direction":l??`none`,onClick:u,className:t.cn(r.tableSortToggleVariants(),d),children:(0,o.jsxs)(`svg`,{viewBox:`0 0 10 16`,className:i.sortIconClassName,fill:`currentColor`,stroke:`currentColor`,strokeWidth:1,strokeLinejoin:`round`,"aria-hidden":`true`,children:[(0,o.jsx)(`path`,{d:`M5 1.5 L8.5 6.5 H1.5 Z`,className:r.tableSortArrowVariants({emphasis:s(`asc`,l)})}),(0,o.jsx)(`path`,{d:`M1.5 9.5 H8.5 L5 14.5 Z`,className:r.tableSortArrowVariants({emphasis:s(`desc`,l)})})]})})})}exports.default=c;
+"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../config/useZuiConfig.cjs`),t=require(`../../lib/utils.cjs`),n=require(`../Tooltip/Tooltip.cjs`),r=require(`./Table.constants.cjs`),i=require(`./Table.utils.cjs`),a=require(`./Table.variant.cjs`);let o=require(`react/jsx-runtime`);function s(e,t){return t===void 0?`idle`:e===t?`highlighted`:`dimmed`}function c({columnLabel:c,direction:l,onToggle:u,className:d}){let{messages:f}=e.useZuiConfig(),p=i.resolveSortToggleTooltipText(c,l,f.table);return(0,o.jsx)(n.default,{text:p,position:`top`,trigger:(0,o.jsx)(`button`,{type:`button`,"aria-label":p,"data-slot":`table-sort-toggle-button`,"data-sort-direction":l??`none`,onClick:u,className:t.cn(a.tableSortToggleVariants(),d),children:(0,o.jsxs)(`svg`,{viewBox:`0 0 10 16`,className:r.sortIconClassName,fill:`currentColor`,stroke:`currentColor`,strokeWidth:1,strokeLinejoin:`round`,"aria-hidden":`true`,children:[(0,o.jsx)(`path`,{d:`M5 1.5 L8.5 6.5 H1.5 Z`,className:a.tableSortArrowVariants({emphasis:s(`asc`,l)})}),(0,o.jsx)(`path`,{d:`M1.5 9.5 H8.5 L5 14.5 Z`,className:a.tableSortArrowVariants({emphasis:s(`desc`,l)})})]})})})}exports.default=c;

package/dist/components/Table/TableSortToggle.js

@@ -2,16 +2,16 @@
 import { useZuiConfig as e } from "../../config/useZuiConfig.js";
 import { cn as t } from "../../lib/utils.js";
 import n from "../Tooltip/Tooltip.js";
-import { tableSortArrowVariants as r, tableSortToggleVariants as i } from "./Table.variant.js";
-import { sortIconClassName as a } from "./Table.constants.js";
-import { resolveSortToggleTooltipText as o } from "./Table.utils.js";
+import { sortIconClassName as r } from "./Table.constants.js";
+import { resolveSortToggleTooltipText as i } from "./Table.utils.js";
+import { tableSortArrowVariants as a, tableSortToggleVariants as o } from "./Table.variant.js";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/Table/TableSortToggle.tsx
 function l(e, t) {
 	return t === void 0 ? "idle" : e === t ? "highlighted" : "dimmed";
 }
 function u({ columnLabel: u, direction: d, onToggle: f, className: p }) {
-	let { messages: m } = e(), h = o(u, d, m.table);
+	let { messages: m } = e(), h = i(u, d, m.table);
 	return /* @__PURE__ */ s(n, {
 		text: h,
 		position: "top",
@@ -21,10 +21,10 @@ function u({ columnLabel: u, direction: d, onToggle: f, className: p }) {
 			"data-slot": "table-sort-toggle-button",
 			"data-sort-direction": d ?? "none",
 			onClick: f,
-			className: t(i(), p),
+			className: t(o(), p),
 			children: /* @__PURE__ */ c("svg", {
 				viewBox: "0 0 10 16",
-				className: a,
+				className: r,
 				fill: "currentColor",
 				stroke: "currentColor",
 				strokeWidth: 1,
@@ -32,10 +32,10 @@ function u({ columnLabel: u, direction: d, onToggle: f, className: p }) {
 				"aria-hidden": "true",
 				children: [/* @__PURE__ */ s("path", {
 					d: "M5 1.5 L8.5 6.5 H1.5 Z",
-					className: r({ emphasis: l("asc", d) })
+					className: a({ emphasis: l("asc", d) })
 				}), /* @__PURE__ */ s("path", {
 					d: "M1.5 9.5 H8.5 L5 14.5 Z",
-					className: r({ emphasis: l("desc", d) })
+					className: a({ emphasis: l("desc", d) })
 				})]
 			})
 		})

package/dist/components/Table/hooks/useTableFilter.cjs

@@ -0,0 +1 @@
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../Table.utils.cjs`);let n=require(`react`);n=e.__toESM(n,1);var r={};function i({rows:e,columns:i,filterConfig:a}){let o=a?.onFilterChange,s=typeof o==`function`,c=a?.values,[l,u]=n.useState(r),d=s&&c?c:l,f=n.useMemo(()=>JSON.stringify(d),[d]),p=n.useMemo(()=>Object.values(d).filter(e=>!t.isEmptyFilterValue(e)).length,[d]),m=n.useMemo(()=>{if(s||p===0)return e;let n=i.flatMap(e=>{let n=d[e.key];return n===void 0||t.isEmptyFilterValue(n)?[]:[{column:e,value:n}]});return e.filter(({row:e})=>n.every(({column:n,value:r})=>t.rowMatchesColumnFilter(e,n,r)))},[p,i,d,s,e]),h=n.useRef({filterValues:d,onFilterChange:o});n.useEffect(()=>{h.current={filterValues:d,onFilterChange:o}});let g=n.useCallback(e=>{u(e),h.current.onFilterChange?.(e)},[]);return{filteredRows:m,filterValues:d,activeFilterCount:p,filterKey:f,isRemoteFilter:s,handleFilterChange:n.useCallback((e,n)=>{let r={...h.current.filterValues};n===void 0||t.isEmptyFilterValue(n)?delete r[e]:r[e]=n,g(r)},[g]),handleFilterClear:n.useCallback(()=>g(r),[g])}}exports.useTableFilter=i;

package/dist/components/Table/hooks/useTableFilter.d.cts

@@ -0,0 +1,18 @@
+import type { TableFilterValue, TableFilterValues, TableSchemaColumn, TableSchemaFilter, TableVisibleRow } from "../Table.interface.cjs";
+type UseTableFilterInput = {
+    rows: TableVisibleRow[];
+    columns: TableSchemaColumn[];
+    filterConfig?: TableSchemaFilter;
+};
+type UseTableFilterResult = {
+    filteredRows: TableVisibleRow[];
+    filterValues: TableFilterValues;
+    activeFilterCount: number;
+    /** Changes when any filter does; used to send the table back to its first page. */
+    filterKey: string;
+    isRemoteFilter: boolean;
+    handleFilterChange: (columnKey: string, value: TableFilterValue | undefined) => void;
+    handleFilterClear: () => void;
+};
+export declare function useTableFilter({ rows, columns, filterConfig, }: UseTableFilterInput): UseTableFilterResult;
+export {};

package/dist/components/Table/hooks/useTableFilter.d.ts

@@ -0,0 +1,18 @@
+import type { TableFilterValue, TableFilterValues, TableSchemaColumn, TableSchemaFilter, TableVisibleRow } from "../Table.interface.js";
+type UseTableFilterInput = {
+    rows: TableVisibleRow[];
+    columns: TableSchemaColumn[];
+    filterConfig?: TableSchemaFilter;
+};
+type UseTableFilterResult = {
+    filteredRows: TableVisibleRow[];
+    filterValues: TableFilterValues;
+    activeFilterCount: number;
+    /** Changes when any filter does; used to send the table back to its first page. */
+    filterKey: string;
+    isRemoteFilter: boolean;
+    handleFilterChange: (columnKey: string, value: TableFilterValue | undefined) => void;
+    handleFilterClear: () => void;
+};
+export declare function useTableFilter({ rows, columns, filterConfig, }: UseTableFilterInput): UseTableFilterResult;
+export {};