@lattice-php/lattice 0.38.0 → 0.40.0

package/dist/table/components/column-header.js

@@ -1,53 +0,0 @@
-import { useT } from "../../i18n/instance.js";
-import { cn } from "../../lib/utils.js";
-import { Icon } from "../../icons/sprite.js";
-import { alignJustify, alignText } from "../lib/align.js";
-import { getColumnAriaSort, getColumnSort } from "../lib/query.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/table/components/column-header.tsx
-function SortIndicator({ sort }) {
-	if (sort?.direction === "asc") return /* @__PURE__ */ jsx(Icon, {
-		name: "arrow-up",
-		"aria-hidden": "true",
-		className: "size-lt-icon-sm shrink-0"
-	});
-	if (sort?.direction === "desc") return /* @__PURE__ */ jsx(Icon, {
-		name: "arrow-down",
-		"aria-hidden": "true",
-		className: "size-lt-icon-sm shrink-0"
-	});
-	return /* @__PURE__ */ jsx(Icon, {
-		name: "chevrons-up-down",
-		"aria-hidden": "true",
-		className: "size-lt-icon-sm shrink-0 opacity-50"
-	});
-}
-function ColumnHeader({ column, processing, resizeHandleProps, sort, query }) {
-	const columnSort = getColumnSort(query, column);
-	const { t } = useT("lattice");
-	const { align, label, sortable } = column.props;
-	return /* @__PURE__ */ jsxs("div", {
-		"aria-sort": getColumnAriaSort(columnSort),
-		className: cn("relative min-w-0 px-4 py-3 pr-5 align-middle font-semibold text-lt-fg", alignText(align)),
-		role: "columnheader",
-		children: [sortable ? /* @__PURE__ */ jsxs("button", {
-			type: "button",
-			"aria-label": t("table.sort.column", "Sort {{label}}", { label }),
-			className: cn("flex w-full items-center gap-1.5 font-semibold", alignJustify(align)),
-			"data-test": `sort-${column.key}`,
-			disabled: processing,
-			onClick: () => sort(column),
-			children: [/* @__PURE__ */ jsx("span", {
-				className: cn("min-w-0 flex-1 truncate", alignText(align)),
-				children: label
-			}), /* @__PURE__ */ jsx(SortIndicator, { sort: columnSort })]
-		}) : /* @__PURE__ */ jsx("span", {
-			className: cn("block truncate", alignText(align)),
-			children: label
-		}), resizeHandleProps && /* @__PURE__ */ jsx("div", { ...resizeHandleProps })]
-	});
-}
-//#endregion
-export { ColumnHeader };
-
-//# sourceMappingURL=column-header.js.map

package/dist/table/components/column-header.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"column-header.js","names":[],"sources":["../../../resources/js/table/components/column-header.tsx"],"sourcesContent":["import { Icon } from \"@lattice-php/lattice/icons\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport type { HTMLAttributes } from \"react\";\nimport { alignJustify, alignText } from \"@lattice-php/lattice/table/lib/align\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport { getColumnAriaSort, getColumnSort } from \"@lattice-php/lattice/table/lib/query\";\nimport type { TableColumn, TableSort, TableQuery } from \"@lattice-php/lattice/table/types\";\n\nfunction SortIndicator({ sort }: { sort: TableSort | undefined }) {\n  if (sort?.direction === \"asc\") {\n    return <Icon name=\"arrow-up\" aria-hidden=\"true\" className=\"size-lt-icon-sm shrink-0\" />;\n  }\n\n  if (sort?.direction === \"desc\") {\n    return <Icon name=\"arrow-down\" aria-hidden=\"true\" className=\"size-lt-icon-sm shrink-0\" />;\n  }\n\n  return (\n    <Icon\n      name=\"chevrons-up-down\"\n      aria-hidden=\"true\"\n      className=\"size-lt-icon-sm shrink-0 opacity-50\"\n    />\n  );\n}\n\nexport function ColumnHeader({\n  column,\n  processing,\n  resizeHandleProps,\n  sort,\n  query,\n}: {\n  column: TableColumn;\n  processing: boolean;\n  resizeHandleProps?: HTMLAttributes<HTMLDivElement>;\n  sort: (column: TableColumn) => void;\n  query: TableQuery;\n}) {\n  const columnSort = getColumnSort(query, column);\n  const { t } = useT(\"lattice\");\n  const { align, label, sortable } = column.props;\n\n  return (\n    <div\n      aria-sort={getColumnAriaSort(columnSort)}\n      className={cn(\n        \"relative min-w-0 px-4 py-3 pr-5 align-middle font-semibold text-lt-fg\",\n        alignText(align),\n      )}\n      role=\"columnheader\"\n    >\n      {sortable ? (\n        <button\n          type=\"button\"\n          aria-label={t(\"table.sort.column\", \"Sort {{label}}\", { label })}\n          className={cn(\"flex w-full items-center gap-1.5 font-semibold\", alignJustify(align))}\n          data-test={`sort-${column.key}`}\n          disabled={processing}\n          onClick={() => sort(column)}\n        >\n          <span className={cn(\"min-w-0 flex-1 truncate\", alignText(align))}>{label}</span>\n          <SortIndicator sort={columnSort} />\n        </button>\n      ) : (\n        <span className={cn(\"block truncate\", alignText(align))}>{label}</span>\n      )}\n      {resizeHandleProps && <div {...resizeHandleProps} />}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAQA,SAAS,cAAc,EAAE,QAAyC;CAChE,IAAI,MAAM,cAAc,OACtB,OAAO,oBAAC,MAAD;EAAM,MAAK;EAAW,eAAY;EAAO,WAAU;CAA4B,CAAA;CAGxF,IAAI,MAAM,cAAc,QACtB,OAAO,oBAAC,MAAD;EAAM,MAAK;EAAa,eAAY;EAAO,WAAU;CAA4B,CAAA;CAG1F,OACE,oBAAC,MAAD;EACE,MAAK;EACL,eAAY;EACZ,WAAU;CACX,CAAA;AAEL;AAEA,SAAgB,aAAa,EAC3B,QACA,YACA,mBACA,MACA,SAOC;CACD,MAAM,aAAa,cAAc,OAAO,MAAM;CAC9C,MAAM,EAAE,MAAM,KAAK,SAAS;CAC5B,MAAM,EAAE,OAAO,OAAO,aAAa,OAAO;CAE1C,OACE,qBAAC,OAAD;EACE,aAAW,kBAAkB,UAAU;EACvC,WAAW,GACT,yEACA,UAAU,KAAK,CACjB;EACA,MAAK;EANP,UAAA,CAQG,WACC,qBAAC,UAAD;GACE,MAAK;GACL,cAAY,EAAE,qBAAqB,kBAAkB,EAAE,MAAM,CAAC;GAC9D,WAAW,GAAG,kDAAkD,aAAa,KAAK,CAAC;GACnF,aAAW,QAAQ,OAAO;GAC1B,UAAU;GACV,eAAe,KAAK,MAAM;GAN5B,UAAA,CAQE,oBAAC,QAAD;IAAM,WAAW,GAAG,2BAA2B,UAAU,KAAK,CAAC;IAAI,UAAA;GAAY,CAAA,GAC/E,oBAAC,eAAD,EAAe,MAAM,WAAa,CAAA,CAC5B;EAER,CAAA,IAAA,oBAAC,QAAD;GAAM,WAAW,GAAG,kBAAkB,UAAU,KAAK,CAAC;GAAI,UAAA;EAAY,CAAA,GAEvE,qBAAqB,oBAAC,OAAD,EAAK,GAAI,kBAAoB,CAAA,CAChD;;AAET"}

package/dist/table/components/column-visibility-menu.d.ts

@@ -1,10 +0,0 @@
-import { ToggleableColumn } from '../hooks/use-column-visibility.js';
-export declare function ColumnVisibilityMenu({ columns, hasHidden, isVisible, onReset, onToggle, processing, visibleColumnCount, }: {
-    columns: ToggleableColumn[];
-    hasHidden: boolean;
-    isVisible: (column: ToggleableColumn) => boolean;
-    onReset: () => void;
-    onToggle: (key: string, visible: boolean) => void;
-    processing: boolean;
-    visibleColumnCount: number;
-}): import("react").JSX.Element;

package/dist/table/components/column-visibility-menu.js

@@ -1,49 +0,0 @@
-import { useT } from "../../i18n/instance.js";
-import { Popover, PopoverContent, PopoverTrigger } from "../../ui/popover.js";
-import { IconButton } from "../../ui/icon-button.js";
-import { Checkbox } from "../../ui/checkbox.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/table/components/column-visibility-menu.tsx
-function ColumnVisibilityMenu({ columns, hasHidden, isVisible, onReset, onToggle, processing, visibleColumnCount }) {
-	const { t } = useT("lattice");
-	const columnsLabel = t("table.columns.label", "Columns");
-	return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
-		asChild: true,
-		children: /* @__PURE__ */ jsx(IconButton, {
-			size: "sm",
-			icon: "columns-3",
-			label: columnsLabel,
-			"data-test": "table-columns-menu",
-			disabled: processing
-		})
-	}), /* @__PURE__ */ jsx(PopoverContent, {
-		align: "end",
-		className: "w-64 p-4",
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "grid gap-3",
-			children: [columns.map((column) => {
-				const visible = isVisible(column);
-				const lockedLast = visible && visibleColumnCount <= 1;
-				return /* @__PURE__ */ jsxs("label", {
-					className: "flex items-center gap-2 text-base text-lt-fg",
-					children: [/* @__PURE__ */ jsx(Checkbox, {
-						"data-test": `table-column-toggle-${column.key}`,
-						checked: visible,
-						disabled: lockedLast,
-						onCheckedChange: (next) => onToggle(column.key, next === true)
-					}), /* @__PURE__ */ jsx("span", { children: column.props.label ?? column.key })]
-				}, column.key);
-			}), hasHidden && /* @__PURE__ */ jsx("button", {
-				type: "button",
-				"data-test": "table-columns-reset",
-				className: "mt-1 justify-self-start text-sm text-lt-muted-fg hover:text-lt-fg",
-				onClick: onReset,
-				children: t("table.columns.reset", "Reset")
-			})]
-		})
-	})] });
-}
-//#endregion
-export { ColumnVisibilityMenu };
-
-//# sourceMappingURL=column-visibility-menu.js.map

package/dist/table/components/column-visibility-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"column-visibility-menu.js","names":[],"sources":["../../../resources/js/table/components/column-visibility-menu.tsx"],"sourcesContent":["import { Checkbox } from \"@lattice-php/lattice/ui/checkbox\";\nimport type { ToggleableColumn } from \"@lattice-php/lattice/table/hooks/use-column-visibility\";\nimport { IconButton } from \"@lattice-php/lattice/ui/icon-button\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@lattice-php/lattice/ui/popover\";\n\nexport function ColumnVisibilityMenu({\n  columns,\n  hasHidden,\n  isVisible,\n  onReset,\n  onToggle,\n  processing,\n  visibleColumnCount,\n}: {\n  columns: ToggleableColumn[];\n  hasHidden: boolean;\n  isVisible: (column: ToggleableColumn) => boolean;\n  onReset: () => void;\n  onToggle: (key: string, visible: boolean) => void;\n  processing: boolean;\n  visibleColumnCount: number;\n}) {\n  const { t } = useT(\"lattice\");\n  const columnsLabel = t(\"table.columns.label\", \"Columns\");\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <IconButton\n          size=\"sm\"\n          icon=\"columns-3\"\n          label={columnsLabel}\n          data-test=\"table-columns-menu\"\n          disabled={processing}\n        />\n      </PopoverTrigger>\n      <PopoverContent align=\"end\" className=\"w-64 p-4\">\n        <div className=\"grid gap-3\">\n          {columns.map((column) => {\n            const visible = isVisible(column);\n            const lockedLast = visible && visibleColumnCount <= 1;\n\n            return (\n              <label key={column.key} className=\"flex items-center gap-2 text-base text-lt-fg\">\n                <Checkbox\n                  data-test={`table-column-toggle-${column.key}`}\n                  checked={visible}\n                  disabled={lockedLast}\n                  onCheckedChange={(next) => onToggle(column.key, next === true)}\n                />\n                <span>{column.props.label ?? column.key}</span>\n              </label>\n            );\n          })}\n          {hasHidden && (\n            <button\n              type=\"button\"\n              data-test=\"table-columns-reset\"\n              className=\"mt-1 justify-self-start text-sm text-lt-muted-fg hover:text-lt-fg\"\n              onClick={onReset}\n            >\n              {t(\"table.columns.reset\", \"Reset\")}\n            </button>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";;;;;;AAMA,SAAgB,qBAAqB,EACnC,SACA,WACA,WACA,SACA,UACA,YACA,sBASC;CACD,MAAM,EAAE,MAAM,KAAK,SAAS;CAC5B,MAAM,eAAe,EAAE,uBAAuB,SAAS;CAEvD,OACE,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,gBAAD;EAAgB,SAAA;EACd,UAAA,oBAAC,YAAD;GACE,MAAK;GACL,MAAK;GACL,OAAO;GACP,aAAU;GACV,UAAU;EACX,CAAA;CACa,CAAA,GAChB,oBAAC,gBAAD;EAAgB,OAAM;EAAM,WAAU;EACpC,UAAA,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACG,QAAQ,KAAK,WAAW;IACvB,MAAM,UAAU,UAAU,MAAM;IAChC,MAAM,aAAa,WAAW,sBAAsB;IAEpD,OACE,qBAAC,SAAD;KAAwB,WAAU;KAAlC,UAAA,CACE,oBAAC,UAAD;MACE,aAAW,uBAAuB,OAAO;MACzC,SAAS;MACT,UAAU;MACV,kBAAkB,SAAS,SAAS,OAAO,KAAK,SAAS,IAAI;KAC9D,CAAA,GACD,oBAAC,QAAD,EAAA,UAAO,OAAO,MAAM,SAAS,OAAO,IAAU,CAAA,CACzC;IARK,GAAA,OAAO,GAQZ;GAEX,CAAC,GACA,aACC,oBAAC,UAAD;IACE,MAAK;IACL,aAAU;IACV,WAAU;IACV,SAAS;IAER,UAAA,EAAE,uBAAuB,OAAO;GAC3B,CAAA,CAEP;;CACS,CAAA,CACT,EAAA,CAAA;AAEb"}

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

@@ -1,18 +0,0 @@
-import { Option } from '../../types/generated.js';
-import { FilterClause, FilterIndicator, FilterNode, TableColumn } from '../types.js';
-export declare function FilterBar({ clauses, columnsByKey, indicators, processing, onRemoveClause, onChange, onReset, }: {
-    clauses: FilterClause[];
-    columnsByKey: Map<string, TableColumn>;
-    indicators: FilterIndicator[];
-    processing: boolean;
-    onRemoveClause: (index: number) => void;
-    onChange: (key: string, value: unknown) => void;
-    onReset: () => void;
-}): import("react").JSX.Element | null;
-export declare function FilterMenu({ filters, values, processing, onChange, onSearch, }: {
-    filters: FilterNode[];
-    values: Record<string, unknown>;
-    processing: boolean;
-    onChange: (key: string, value: unknown) => void;
-    onSearch?: (searchKey: string, query: string, signal?: AbortSignal) => Promise<Option[]>;
-}): import("react").JSX.Element;

package/dist/table/components/filter-bar.js

@@ -1,106 +0,0 @@
-import { useT } from "../../i18n/instance.js";
-import { Popover, PopoverContent, PopoverTrigger } from "../../ui/popover.js";
-import { IconButton } from "../../ui/icon-button.js";
-import { isActiveFilterValue } from "../lib/filter-values.js";
-import { VALUELESS_FILTER_OPERATORS, operatorLabel } from "../lib/query.js";
-import { TableFilterControl } from "./filter-controls.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/table/components/filter-bar.tsx
-function FilterBar({ clauses, columnsByKey, indicators, processing, onRemoveClause, onChange, onReset }) {
-	const { t } = useT("lattice");
-	if (clauses.length === 0 && indicators.length === 0) return null;
-	return /* @__PURE__ */ jsx("div", {
-		className: "border-b border-lt-border px-4 py-3",
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "flex flex-wrap items-center gap-2 text-sm",
-			children: [
-				clauses.map((clause, index) => {
-					const label = columnsByKey.get(clause.field)?.props.label ?? clause.field;
-					const valueless = VALUELESS_FILTER_OPERATORS.has(clause.operator);
-					return /* @__PURE__ */ jsx(FilterChip, {
-						label: `${label} ${operatorLabel(clause.operator)}`,
-						value: valueless ? "" : clause.value,
-						removeTestId: `filter-chip-${clause.field}-remove`,
-						removeLabel: t("table.filter.remove", "Remove {{label}} filter", { label }),
-						processing,
-						onRemove: () => onRemoveClause(index)
-					}, `${clause.field}-${clause.operator}-${index}`);
-				}),
-				indicators.map((indicator) => /* @__PURE__ */ jsx(FilterChip, {
-					label: indicator.label,
-					value: indicator.value,
-					removeTestId: `table-filter-chip-${indicator.filter}-remove`,
-					removeLabel: t("table.filter.remove", "Remove {{label}} filter", { label: indicator.label }),
-					processing,
-					onRemove: () => onChange(indicator.filter, void 0)
-				}, `${indicator.filter}:${indicator.label}:${indicator.value}`)),
-				/* @__PURE__ */ jsx("button", {
-					type: "button",
-					"data-test": "table-filters-reset",
-					className: "text-lt-muted-fg underline-offset-2 hover:underline disabled:text-lt-disabled-fg",
-					disabled: processing,
-					onClick: onReset,
-					children: t("table.filter.reset-all", "Reset all")
-				})
-			]
-		})
-	});
-}
-function FilterChip({ label, value, removeTestId, removeLabel, processing, onRemove }) {
-	return /* @__PURE__ */ jsxs("span", {
-		className: "inline-flex items-center gap-1.5 rounded-lt-sm bg-lt-muted px-2 py-1",
-		children: [/* @__PURE__ */ jsx("span", { children: value === "" ? /* @__PURE__ */ jsx("span", {
-			className: "font-semibold",
-			children: label
-		}) : /* @__PURE__ */ jsxs(Fragment, { children: [`${label}: `, /* @__PURE__ */ jsx("span", {
-			className: "font-semibold",
-			children: value
-		})] }) }), /* @__PURE__ */ jsx(IconButton, {
-			size: "xs",
-			icon: "x",
-			label: removeLabel,
-			"data-test": removeTestId,
-			disabled: processing,
-			onClick: onRemove
-		})]
-	});
-}
-function FilterMenu({ filters, values, processing, onChange, onSearch }) {
-	const { t } = useT("lattice");
-	const active = filters.filter((filter) => isActiveFilterValue(values[filter.key]));
-	const filtersLabel = t("table.filter.filters", "Filters");
-	return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
-		asChild: true,
-		children: /* @__PURE__ */ jsx(IconButton, {
-			size: "sm",
-			icon: "filter",
-			label: filtersLabel,
-			"data-test": "table-filters-menu",
-			disabled: processing,
-			children: active.length > 0 && /* @__PURE__ */ jsx("span", {
-				className: "absolute -right-1 -top-1 inline-flex size-3.5 items-center justify-center rounded-full bg-lt-primary text-[10px] font-medium leading-none text-lt-primary-fg",
-				children: active.length
-			})
-		})
-	}), /* @__PURE__ */ jsx(PopoverContent, {
-		align: "end",
-		className: "w-80 p-4",
-		children: /* @__PURE__ */ jsx("div", {
-			className: "grid gap-3",
-			children: filters.map((filter) => /* @__PURE__ */ jsx("div", {
-				className: "grid gap-1",
-				children: /* @__PURE__ */ jsx(TableFilterControl, {
-					filter,
-					value: values[filter.key],
-					processing,
-					onChange: (value) => onChange(filter.key, value),
-					onSearch: onSearch ? (field, query, signal) => onSearch(`filter:${filter.key}.${field}`, query, signal) : void 0
-				})
-			}, filter.key))
-		})
-	})] });
-}
-//#endregion
-export { FilterBar, FilterMenu };
-
-//# sourceMappingURL=filter-bar.js.map

package/dist/table/components/filter-bar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"filter-bar.js","names":[],"sources":["../../../resources/js/table/components/filter-bar.tsx"],"sourcesContent":["import { IconButton } from \"@lattice-php/lattice/ui/icon-button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@lattice-php/lattice/ui/popover\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport type { Option } from \"@lattice-php/lattice/types/generated\";\nimport { isActiveFilterValue } from \"@lattice-php/lattice/table/lib/filter-values\";\nimport { operatorLabel, VALUELESS_FILTER_OPERATORS } from \"@lattice-php/lattice/table/lib/query\";\nimport type {\n  FilterClause,\n  FilterIndicator,\n  FilterNode,\n  TableColumn,\n} from \"@lattice-php/lattice/table/types\";\nimport { TableFilterControl } from \"./filter-controls\";\n\nexport function FilterBar({\n  clauses,\n  columnsByKey,\n  indicators,\n  processing,\n  onRemoveClause,\n  onChange,\n  onReset,\n}: {\n  clauses: FilterClause[];\n  columnsByKey: Map<string, TableColumn>;\n  indicators: FilterIndicator[];\n  processing: boolean;\n  onRemoveClause: (index: number) => void;\n  onChange: (key: string, value: unknown) => void;\n  onReset: () => void;\n}) {\n  const { t } = useT(\"lattice\");\n\n  if (clauses.length === 0 && indicators.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className=\"border-b border-lt-border px-4 py-3\">\n      <div className=\"flex flex-wrap items-center gap-2 text-sm\">\n        {clauses.map((clause, index) => {\n          const label = columnsByKey.get(clause.field)?.props.label ?? clause.field;\n          const valueless = VALUELESS_FILTER_OPERATORS.has(clause.operator);\n\n          return (\n            <FilterChip\n              key={`${clause.field}-${clause.operator}-${index}`}\n              label={`${label} ${operatorLabel(clause.operator)}`}\n              value={valueless ? \"\" : clause.value}\n              removeTestId={`filter-chip-${clause.field}-remove`}\n              removeLabel={t(\"table.filter.remove\", \"Remove {{label}} filter\", { label })}\n              processing={processing}\n              onRemove={() => onRemoveClause(index)}\n            />\n          );\n        })}\n        {indicators.map((indicator) => (\n          <FilterChip\n            key={`${indicator.filter}:${indicator.label}:${indicator.value}`}\n            label={indicator.label}\n            value={indicator.value}\n            removeTestId={`table-filter-chip-${indicator.filter}-remove`}\n            removeLabel={t(\"table.filter.remove\", \"Remove {{label}} filter\", {\n              label: indicator.label,\n            })}\n            processing={processing}\n            onRemove={() => onChange(indicator.filter, undefined)}\n          />\n        ))}\n        <button\n          type=\"button\"\n          data-test=\"table-filters-reset\"\n          className=\"text-lt-muted-fg underline-offset-2 hover:underline disabled:text-lt-disabled-fg\"\n          disabled={processing}\n          onClick={onReset}\n        >\n          {t(\"table.filter.reset-all\", \"Reset all\")}\n        </button>\n      </div>\n    </div>\n  );\n}\n\nfunction FilterChip({\n  label,\n  value,\n  removeTestId,\n  removeLabel,\n  processing,\n  onRemove,\n}: {\n  label: string;\n  value: string;\n  removeTestId: string;\n  removeLabel: string;\n  processing: boolean;\n  onRemove: () => void;\n}) {\n  return (\n    <span className=\"inline-flex items-center gap-1.5 rounded-lt-sm bg-lt-muted px-2 py-1\">\n      <span>\n        {value === \"\" ? (\n          <span className=\"font-semibold\">{label}</span>\n        ) : (\n          <>\n            {`${label}: `}\n            <span className=\"font-semibold\">{value}</span>\n          </>\n        )}\n      </span>\n      <IconButton\n        size=\"xs\"\n        icon=\"x\"\n        label={removeLabel}\n        data-test={removeTestId}\n        disabled={processing}\n        onClick={onRemove}\n      />\n    </span>\n  );\n}\n\nexport function FilterMenu({\n  filters,\n  values,\n  processing,\n  onChange,\n  onSearch,\n}: {\n  filters: FilterNode[];\n  values: Record<string, unknown>;\n  processing: boolean;\n  onChange: (key: string, value: unknown) => void;\n  onSearch?: (searchKey: string, query: string, signal?: AbortSignal) => Promise<Option[]>;\n}) {\n  const { t } = useT(\"lattice\");\n  const active = filters.filter((filter) => isActiveFilterValue(values[filter.key]));\n  const filtersLabel = t(\"table.filter.filters\", \"Filters\");\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <IconButton\n          size=\"sm\"\n          icon=\"filter\"\n          label={filtersLabel}\n          data-test=\"table-filters-menu\"\n          disabled={processing}\n        >\n          {active.length > 0 && (\n            <span className=\"absolute -right-1 -top-1 inline-flex size-3.5 items-center justify-center rounded-full bg-lt-primary text-[10px] font-medium leading-none text-lt-primary-fg\">\n              {active.length}\n            </span>\n          )}\n        </IconButton>\n      </PopoverTrigger>\n      <PopoverContent align=\"end\" className=\"w-80 p-4\">\n        <div className=\"grid gap-3\">\n          {filters.map((filter) => (\n            <div key={filter.key} className=\"grid gap-1\">\n              <TableFilterControl\n                filter={filter}\n                value={values[filter.key]}\n                processing={processing}\n                onChange={(value) => onChange(filter.key, value)}\n                onSearch={\n                  onSearch\n                    ? (field, query, signal) =>\n                        onSearch(`filter:${filter.key}.${field}`, query, signal)\n                    : undefined\n                }\n              />\n            </div>\n          ))}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":"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"}

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

@@ -1,11 +0,0 @@
-import { Option } from '../../core/types.js';
-import { FilterNode } from '../types.js';
-export type FilterOptionSearch = (field: string, query: string, signal: AbortSignal) => Promise<Option[]>;
-export declare function TableFilterControl({ filter, value, processing, bare, onChange, onSearch, }: {
-    filter: FilterNode;
-    value: unknown;
-    processing: boolean;
-    bare?: boolean;
-    onChange: (value: unknown) => void;
-    onSearch?: FilterOptionSearch;
-}): import("react").JSX.Element;

package/dist/table/components/filter-controls.js

@@ -1,131 +0,0 @@
-import { useT } from "../../i18n/instance.js";
-import { cn } from "../../lib/utils.js";
-import { Renderer } from "../../core/renderer.js";
-import { FormProvider } from "../../form/hooks/context.js";
-import { PrefillProvider } from "../../form/hooks/prefill-context.js";
-import { getPath, setPath } from "../../form/lib/form-path.js";
-import { ResolvedNodesProvider } from "../../form/hooks/resolved-nodes.js";
-import { FormValuesProvider, useFormValues, useSetFormValue } from "../../form/hooks/values.js";
-import { FieldCommitOverrideProvider } from "../../form/hooks/use-field-commit.js";
-import { TableCellProvider } from "../../form/hooks/row-layout-context.js";
-import { IconButton } from "../../ui/icon-button.js";
-import { Checkbox } from "../../ui/checkbox.js";
-import { filterValue, isActiveFilterValue } from "../lib/filter-values.js";
-import { isTruthy } from "../../lib/is-truthy.js";
-import { useCallback, useMemo, useRef } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/table/components/filter-controls.tsx
-function TableFilterControl({ filter, value, processing, bare = false, onChange, onSearch }) {
-	const { t } = useT("lattice");
-	const schema = filter.schema ?? [];
-	if (schema.length === 0) return /* @__PURE__ */ jsx(ToggleControl, {
-		filter,
-		value,
-		processing,
-		onChange
-	});
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex items-end gap-2",
-		children: [/* @__PURE__ */ jsx("div", {
-			className: "min-w-0 flex-1",
-			children: /* @__PURE__ */ jsx(SchemaControl, {
-				filter,
-				schema,
-				value,
-				processing,
-				bare,
-				onChange,
-				onSearch
-			})
-		}), isActiveFilterValue(value) && /* @__PURE__ */ jsx(IconButton, {
-			size: "md",
-			icon: "x",
-			label: t("table.filter.clear", "Clear {{label}} filter", { label: filter.props.label ?? "" }),
-			disabled: processing,
-			onClick: () => onChange(void 0)
-		})]
-	});
-}
-function SchemaControl({ filter, schema, value, processing, bare, onChange, onSearch }) {
-	const initial = useMemo(() => filterValue(value), [value]);
-	const form = useMemo(() => ({
-		action: "#",
-		clearErrors: () => {},
-		componentId: `table-filter-${filter.key}`,
-		componentRef: "",
-		errors: {},
-		fieldIdPrefix: `table-filter-${filter.key}`,
-		fieldLabels: {},
-		precognitive: false,
-		processing,
-		searchOptions: (field, query, _values, signal) => onSearch ? onSearch(field, query, signal) : Promise.resolve([]),
-		touch: () => {},
-		validate: () => {},
-		validateFields: () => {},
-		validating: false
-	}), [
-		filter.key,
-		onSearch,
-		processing
-	]);
-	const content = /* @__PURE__ */ jsx("div", {
-		"aria-disabled": processing,
-		className: cn("grid gap-3", processing && "pointer-events-none opacity-60"),
-		children: /* @__PURE__ */ jsx(Renderer, { nodes: schema })
-	});
-	return /* @__PURE__ */ jsx(FormProvider, {
-		value: form,
-		children: /* @__PURE__ */ jsx(PrefillProvider, {
-			value: { markUserEdit: () => {} },
-			children: /* @__PURE__ */ jsx(ResolvedNodesProvider, {
-				nodes: {},
-				children: /* @__PURE__ */ jsx(FormValuesProvider, {
-					initial,
-					children: /* @__PURE__ */ jsx(TableFilterCommitBridge, {
-						onChange,
-						children: bare ? /* @__PURE__ */ jsx(TableCellProvider, { children: content }) : content
-					})
-				})
-			})
-		})
-	});
-}
-function TableFilterCommitBridge({ children, onChange }) {
-	const values = useFormValues();
-	const setValue = useSetFormValue();
-	const valuesRef = useRef(values);
-	valuesRef.current = values;
-	const write = useCallback((name, value) => {
-		const nextValue = typeof value === "function" ? value(getPath(valuesRef.current, name)) : value;
-		const next = setPath(valuesRef.current, name, nextValue);
-		valuesRef.current = next;
-		setValue(name, nextValue);
-		onChange(next);
-	}, [onChange, setValue]);
-	const commit = useMemo(() => ({
-		blur: () => {},
-		change: write,
-		commit: write
-	}), [write]);
-	return /* @__PURE__ */ jsx(FieldCommitOverrideProvider, {
-		value: commit,
-		children
-	});
-}
-function ToggleControl({ filter, value, processing, onChange }) {
-	const checked = isTruthy(filterValue(value).value);
-	return /* @__PURE__ */ jsxs("label", {
-		className: "flex h-lt-control-md cursor-pointer items-center gap-2 text-sm",
-		children: [/* @__PURE__ */ jsx(Checkbox, {
-			"aria-label": filter.props.label ?? void 0,
-			"data-test": `table-filter-${filter.key}`,
-			checked,
-			disabled: processing,
-			onCheckedChange: (next) => onChange(next === true ? { value: "1" } : void 0)
-		}), /* @__PURE__ */ jsx("span", { children: filter.props.label })]
-	});
-}
-//#endregion
-export { TableFilterControl };
-
-//# sourceMappingURL=filter-controls.js.map

package/dist/table/components/filter-controls.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"filter-controls.js","names":[],"sources":["../../../resources/js/table/components/filter-controls.tsx"],"sourcesContent":["import { useCallback, useMemo, useRef } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { Checkbox } from \"@lattice-php/lattice/ui/checkbox\";\nimport { Renderer } from \"@lattice-php/lattice/core/renderer\";\nimport type { Node, Option } from \"@lattice-php/lattice/core/types\";\nimport {\n  FieldCommitOverrideProvider,\n  FormProvider,\n  FormValuesProvider,\n  getPath,\n  PrefillProvider,\n  ResolvedNodesProvider,\n  setPath,\n  TableCellProvider,\n  useFormValues,\n  useSetFormValue,\n} from \"@lattice-php/lattice/form/embed\";\nimport { IconButton } from \"@lattice-php/lattice/ui/icon-button\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { isTruthy } from \"@lattice-php/lattice/lib/is-truthy\";\nimport { filterValue, isActiveFilterValue } from \"@lattice-php/lattice/table/lib/filter-values\";\nimport type { FilterNode } from \"@lattice-php/lattice/table/types\";\n\nexport type FilterOptionSearch = (\n  field: string,\n  query: string,\n  signal: AbortSignal,\n) => Promise<Option[]>;\n\ntype FilterValue = Record<string, unknown>;\n\nexport function TableFilterControl({\n  filter,\n  value,\n  processing,\n  bare = false,\n  onChange,\n  onSearch,\n}: {\n  filter: FilterNode;\n  value: unknown;\n  processing: boolean;\n  bare?: boolean;\n  onChange: (value: unknown) => void;\n  onSearch?: FilterOptionSearch;\n}) {\n  const { t } = useT(\"lattice\");\n  const schema = filter.schema ?? [];\n\n  if (schema.length === 0) {\n    return (\n      <ToggleControl filter={filter} value={value} processing={processing} onChange={onChange} />\n    );\n  }\n\n  return (\n    <div className=\"flex items-end gap-2\">\n      <div className=\"min-w-0 flex-1\">\n        <SchemaControl\n          filter={filter}\n          schema={schema}\n          value={value}\n          processing={processing}\n          bare={bare}\n          onChange={onChange}\n          onSearch={onSearch}\n        />\n      </div>\n      {isActiveFilterValue(value) && (\n        <IconButton\n          size=\"md\"\n          icon=\"x\"\n          label={t(\"table.filter.clear\", \"Clear {{label}} filter\", {\n            label: filter.props.label ?? \"\",\n          })}\n          disabled={processing}\n          onClick={() => onChange(undefined)}\n        />\n      )}\n    </div>\n  );\n}\n\nfunction SchemaControl({\n  filter,\n  schema,\n  value,\n  processing,\n  bare,\n  onChange,\n  onSearch,\n}: {\n  filter: FilterNode;\n  schema: Node[];\n  value: unknown;\n  processing: boolean;\n  bare: boolean;\n  onChange: (value: unknown) => void;\n  onSearch?: FilterOptionSearch;\n}) {\n  const initial = useMemo(() => filterValue(value), [value]);\n  const form = useMemo(\n    () => ({\n      action: \"#\",\n      clearErrors: () => {},\n      componentId: `table-filter-${filter.key}`,\n      componentRef: \"\",\n      errors: {},\n      fieldIdPrefix: `table-filter-${filter.key}`,\n      fieldLabels: {},\n      precognitive: false,\n      processing,\n      searchOptions: (\n        field: string,\n        query: string,\n        _values: Record<string, unknown>,\n        signal: AbortSignal,\n      ) => (onSearch ? onSearch(field, query, signal) : Promise.resolve([])),\n      touch: () => {},\n      validate: () => {},\n      validateFields: () => {},\n      validating: false,\n    }),\n    [filter.key, onSearch, processing],\n  );\n\n  const content = (\n    <div\n      aria-disabled={processing}\n      className={cn(\"grid gap-3\", processing && \"pointer-events-none opacity-60\")}\n    >\n      <Renderer nodes={schema} />\n    </div>\n  );\n\n  return (\n    <FormProvider value={form}>\n      <PrefillProvider value={{ markUserEdit: () => {} }}>\n        <ResolvedNodesProvider nodes={{}}>\n          <FormValuesProvider initial={initial}>\n            <TableFilterCommitBridge onChange={onChange}>\n              {bare ? <TableCellProvider>{content}</TableCellProvider> : content}\n            </TableFilterCommitBridge>\n          </FormValuesProvider>\n        </ResolvedNodesProvider>\n      </PrefillProvider>\n    </FormProvider>\n  );\n}\n\nfunction TableFilterCommitBridge({\n  children,\n  onChange,\n}: {\n  children: ReactNode;\n  onChange: (value: FilterValue) => void;\n}) {\n  const values = useFormValues();\n  const setValue = useSetFormValue();\n  const valuesRef = useRef(values);\n  valuesRef.current = values;\n\n  const write = useCallback(\n    (name: string, value: unknown) => {\n      const nextValue =\n        typeof value === \"function\"\n          ? (value as (previous: unknown) => unknown)(getPath(valuesRef.current, name))\n          : value;\n      const next = setPath(valuesRef.current, name, nextValue);\n\n      valuesRef.current = next;\n      setValue(name, nextValue);\n      onChange(next);\n    },\n    [onChange, setValue],\n  );\n\n  const commit = useMemo(\n    () => ({\n      blur: () => {},\n      change: write,\n      commit: write,\n    }),\n    [write],\n  );\n\n  return <FieldCommitOverrideProvider value={commit}>{children}</FieldCommitOverrideProvider>;\n}\n\nfunction ToggleControl({\n  filter,\n  value,\n  processing,\n  onChange,\n}: {\n  filter: FilterNode;\n  value: unknown;\n  processing: boolean;\n  onChange: (value: unknown) => void;\n}) {\n  const checked = isTruthy(filterValue(value).value);\n\n  return (\n    <label className=\"flex h-lt-control-md cursor-pointer items-center gap-2 text-sm\">\n      <Checkbox\n        aria-label={filter.props.label ?? undefined}\n        data-test={`table-filter-${filter.key}`}\n        checked={checked}\n        disabled={processing}\n        onCheckedChange={(next) => onChange(next === true ? { value: \"1\" } : undefined)}\n      />\n      <span>{filter.props.label}</span>\n    </label>\n  );\n}\n"],"mappings":"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"}

package/dist/table/components/filter-value-input.d.ts

@@ -1,13 +0,0 @@
-import { FilterType } from '../../types/generated.js';
-export declare function FilterValueInput({ type, label, value, processing, withSearchIcon, grouped, ariaLabel, testId, onCommit, onClear, }: {
-    type: FilterType;
-    label: string;
-    value: string;
-    processing: boolean;
-    withSearchIcon?: boolean;
-    grouped?: boolean;
-    ariaLabel?: string;
-    testId?: string;
-    onCommit: (value: string) => void;
-    onClear?: () => void;
-}): import("react").JSX.Element;

package/dist/table/components/filter-value-input.js

@@ -1,93 +0,0 @@
-import { useT } from "../../i18n/instance.js";
-import { cn } from "../../lib/utils.js";
-import { Icon } from "../../icons/sprite.js";
-import { IconButton } from "../../ui/icon-button.js";
-import { Input } from "../../ui/input.js";
-import { NativeSelect } from "../../ui/native-select.js";
-import { useEffect, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/table/components/filter-value-input.tsx
-function FilterValueInput({ type, label, value, processing, withSearchIcon = false, grouped = false, ariaLabel, testId, onCommit, onClear }) {
-	const { t } = useT("lattice");
-	const [draft, setDraft] = useState(value);
-	const inputLabel = ariaLabel ?? t("table.filter.filter-by", "Filter {{label}}", { label });
-	const groupedClass = grouped ? "rounded-r-none" : "";
-	useEffect(() => {
-		setDraft(value);
-	}, [value]);
-	if (type === "boolean") return /* @__PURE__ */ jsxs(NativeSelect, {
-		density: "compact",
-		"aria-label": inputLabel,
-		"data-test": testId,
-		className: groupedClass,
-		disabled: processing,
-		value,
-		onChange: (event) => onCommit(event.target.value),
-		children: [
-			/* @__PURE__ */ jsx("option", {
-				value: "",
-				children: t("table.filter.all", "All")
-			}),
-			/* @__PURE__ */ jsx("option", {
-				value: "true",
-				children: t("table.filter.true", "True")
-			}),
-			/* @__PURE__ */ jsx("option", {
-				value: "false",
-				children: t("table.filter.false", "False")
-			})
-		]
-	});
-	if (type === "date") return /* @__PURE__ */ jsx(Input, {
-		type: "date",
-		density: "compact",
-		"aria-label": inputLabel,
-		"data-test": testId,
-		className: groupedClass,
-		disabled: processing,
-		value: draft,
-		onChange: (event) => {
-			setDraft(event.target.value);
-			onCommit(event.target.value);
-		}
-	});
-	return /* @__PURE__ */ jsxs("div", {
-		className: "relative flex w-full min-w-0 items-center",
-		children: [
-			withSearchIcon && /* @__PURE__ */ jsx(Icon, {
-				name: "search",
-				"aria-hidden": "true",
-				className: "pointer-events-none absolute left-2 size-lt-icon-md text-lt-muted-fg"
-			}),
-			/* @__PURE__ */ jsx(Input, {
-				type: type === "number" ? "number" : "text",
-				density: "compact",
-				"aria-label": inputLabel,
-				"data-test": testId,
-				className: cn(groupedClass, withSearchIcon && "pl-8", onClear && "pr-8"),
-				disabled: processing,
-				value: draft,
-				onChange: (event) => setDraft(event.target.value),
-				onKeyDown: (event) => {
-					if (event.key === "Enter") onCommit(draft);
-				},
-				onBlur: () => {
-					if (draft !== value) onCommit(draft);
-				}
-			}),
-			onClear && draft !== "" && /* @__PURE__ */ jsx(IconButton, {
-				size: "xs",
-				icon: "x",
-				label: t("table.filter.clear", "Clear {{label}} filter", { label }),
-				"data-test": testId ? `${testId}-clear` : void 0,
-				className: "absolute right-1 size-6",
-				disabled: processing,
-				onClick: onClear
-			})
-		]
-	});
-}
-//#endregion
-export { FilterValueInput };
-
-//# sourceMappingURL=filter-value-input.js.map

package/dist/table/components/filter-value-input.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"filter-value-input.js","names":[],"sources":["../../../resources/js/table/components/filter-value-input.tsx"],"sourcesContent":["import { Icon } from \"@lattice-php/lattice/icons\";\nimport { useEffect, useState } from \"react\";\nimport { IconButton } from \"@lattice-php/lattice/ui/icon-button\";\nimport { Input } from \"@lattice-php/lattice/ui/input\";\nimport { NativeSelect } from \"@lattice-php/lattice/ui/native-select\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport type { FilterType } from \"@lattice-php/lattice/types/generated\";\n\nexport function FilterValueInput({\n  type,\n  label,\n  value,\n  processing,\n  withSearchIcon = false,\n  grouped = false,\n  ariaLabel,\n  testId,\n  onCommit,\n  onClear,\n}: {\n  type: FilterType;\n  label: string;\n  value: string;\n  processing: boolean;\n  withSearchIcon?: boolean;\n  grouped?: boolean;\n  ariaLabel?: string;\n  testId?: string;\n  onCommit: (value: string) => void;\n  onClear?: () => void;\n}) {\n  const { t } = useT(\"lattice\");\n  const [draft, setDraft] = useState(value);\n  const inputLabel = ariaLabel ?? t(\"table.filter.filter-by\", \"Filter {{label}}\", { label });\n  const groupedClass = grouped ? \"rounded-r-none\" : \"\";\n\n  useEffect(() => {\n    setDraft(value);\n  }, [value]);\n\n  if (type === \"boolean\") {\n    return (\n      <NativeSelect\n        density=\"compact\"\n        aria-label={inputLabel}\n        data-test={testId}\n        className={groupedClass}\n        disabled={processing}\n        value={value}\n        onChange={(event) => onCommit(event.target.value)}\n      >\n        <option value=\"\">{t(\"table.filter.all\", \"All\")}</option>\n        <option value=\"true\">{t(\"table.filter.true\", \"True\")}</option>\n        <option value=\"false\">{t(\"table.filter.false\", \"False\")}</option>\n      </NativeSelect>\n    );\n  }\n\n  if (type === \"date\") {\n    return (\n      <Input\n        type=\"date\"\n        density=\"compact\"\n        aria-label={inputLabel}\n        data-test={testId}\n        className={groupedClass}\n        disabled={processing}\n        value={draft}\n        onChange={(event) => {\n          setDraft(event.target.value);\n          onCommit(event.target.value);\n        }}\n      />\n    );\n  }\n\n  return (\n    <div className=\"relative flex w-full min-w-0 items-center\">\n      {withSearchIcon && (\n        <Icon\n          name=\"search\"\n          aria-hidden=\"true\"\n          className=\"pointer-events-none absolute left-2 size-lt-icon-md text-lt-muted-fg\"\n        />\n      )}\n      <Input\n        type={type === \"number\" ? \"number\" : \"text\"}\n        density=\"compact\"\n        aria-label={inputLabel}\n        data-test={testId}\n        className={cn(groupedClass, withSearchIcon && \"pl-8\", onClear && \"pr-8\")}\n        disabled={processing}\n        value={draft}\n        onChange={(event) => setDraft(event.target.value)}\n        onKeyDown={(event) => {\n          if (event.key === \"Enter\") {\n            onCommit(draft);\n          }\n        }}\n        onBlur={() => {\n          if (draft !== value) {\n            onCommit(draft);\n          }\n        }}\n      />\n      {onClear && draft !== \"\" && (\n        <IconButton\n          size=\"xs\"\n          icon=\"x\"\n          label={t(\"table.filter.clear\", \"Clear {{label}} filter\", { label })}\n          data-test={testId ? `${testId}-clear` : undefined}\n          className=\"absolute right-1 size-6\"\n          disabled={processing}\n          onClick={onClear}\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AASA,SAAgB,iBAAiB,EAC/B,MACA,OACA,OACA,YACA,iBAAiB,OACjB,UAAU,OACV,WACA,QACA,UACA,WAYC;CACD,MAAM,EAAE,MAAM,KAAK,SAAS;CAC5B,MAAM,CAAC,OAAO,YAAY,SAAS,KAAK;CACxC,MAAM,aAAa,aAAa,EAAE,0BAA0B,oBAAoB,EAAE,MAAM,CAAC;CACzF,MAAM,eAAe,UAAU,mBAAmB;CAElD,gBAAgB;EACd,SAAS,KAAK;CAChB,GAAG,CAAC,KAAK,CAAC;CAEV,IAAI,SAAS,WACX,OACE,qBAAC,cAAD;EACE,SAAQ;EACR,cAAY;EACZ,aAAW;EACX,WAAW;EACX,UAAU;EACH;EACP,WAAW,UAAU,SAAS,MAAM,OAAO,KAAK;EAPlD,UAAA;GASE,oBAAC,UAAD;IAAQ,OAAM;IAAI,UAAA,EAAE,oBAAoB,KAAK;GAAU,CAAA;GACvD,oBAAC,UAAD;IAAQ,OAAM;IAAQ,UAAA,EAAE,qBAAqB,MAAM;GAAU,CAAA;GAC7D,oBAAC,UAAD;IAAQ,OAAM;IAAS,UAAA,EAAE,sBAAsB,OAAO;GAAU,CAAA;EACpD;;CAIlB,IAAI,SAAS,QACX,OACE,oBAAC,OAAD;EACE,MAAK;EACL,SAAQ;EACR,cAAY;EACZ,aAAW;EACX,WAAW;EACX,UAAU;EACV,OAAO;EACP,WAAW,UAAU;GACnB,SAAS,MAAM,OAAO,KAAK;GAC3B,SAAS,MAAM,OAAO,KAAK;EAC7B;CACD,CAAA;CAIL,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACG,kBACC,oBAAC,MAAD;IACE,MAAK;IACL,eAAY;IACZ,WAAU;GACX,CAAA;GAEH,oBAAC,OAAD;IACE,MAAM,SAAS,WAAW,WAAW;IACrC,SAAQ;IACR,cAAY;IACZ,aAAW;IACX,WAAW,GAAG,cAAc,kBAAkB,QAAQ,WAAW,MAAM;IACvE,UAAU;IACV,OAAO;IACP,WAAW,UAAU,SAAS,MAAM,OAAO,KAAK;IAChD,YAAY,UAAU;KACpB,IAAI,MAAM,QAAQ,SAChB,SAAS,KAAK;IAElB;IACA,cAAc;KACZ,IAAI,UAAU,OACZ,SAAS,KAAK;IAElB;GACD,CAAA;GACA,WAAW,UAAU,MACpB,oBAAC,YAAD;IACE,MAAK;IACL,MAAK;IACL,OAAO,EAAE,sBAAsB,0BAA0B,EAAE,MAAM,CAAC;IAClE,aAAW,SAAS,GAAG,OAAO,UAAU,KAAA;IACxC,WAAU;IACV,UAAU;IACV,SAAS;GACV,CAAA;EAEA;;AAET"}

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

@@ -1,18 +0,0 @@
-import { RefObject } from 'react';
-import { PaginationType } from '../../types/generated.js';
-import { PerPageOption } from '../lib/payload.js';
-import { TablePagination as TablePaginationData } from '../types.js';
-export declare function TablePagination({ pagination, currentPage, processing, mode, hasNextPage, visiblePages, infiniteLoaderRef, perPageOptions, perPageValue, onPerPage, onPage, onLoadMore, }: {
-    pagination: TablePaginationData;
-    currentPage: number;
-    processing: boolean;
-    mode: PaginationType;
-    hasNextPage: boolean;
-    visiblePages: number[];
-    infiniteLoaderRef: RefObject<HTMLDivElement | null>;
-    perPageOptions: PerPageOption[];
-    perPageValue: PerPageOption;
-    onPerPage: (option: PerPageOption) => void;
-    onPage: (page: number) => void;
-    onLoadMore: () => void;
-}): import("react").JSX.Element;