@lattice-php/lattice 0.1.0

package/dist/table/components/table.js

@@ -0,0 +1,189 @@
+import { getBulkActions } from "../bulk.js";
+import { getRowActions, getRowKey } from "../payload.js";
+import { getColumnGridTemplate, getQueryParams, getVisiblePages } from "../query.js";
+import { useTableSelection } from "../use-table-selection.js";
+import { useTable } from "../use-table.js";
+import { BulkBar } from "./bulk-bar.js";
+import { ColumnFilterControl } from "./column-filter-control.js";
+import { ColumnHeader } from "./column-header.js";
+import { FilterStackBar } from "./filter-stack-bar.js";
+import { TablePagination } from "./pagination.js";
+import { SortBar } from "./sort-bar.js";
+import { TableActionNode } from "./table-action-node.js";
+import { ColumnCell } from "./table-cell.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region resources/js/table/components/table.tsx
+var TableComponent = ({ node }) => {
+	const { columns, rows, pagination, state, filters, addFilter, updateFilter, removeFilter, processing, hasLoaded, infiniteLoaderRef, sort, clearSort, goToPage, loadMore } = useTable(node);
+	const bulkActions = getBulkActions(node.props?.bulkActions);
+	const hasBulkActions = bulkActions.length > 0;
+	const rowEntries = rows.map((row, index) => ({
+		row,
+		actions: getRowActions(row),
+		key: getRowKey(row, index)
+	}));
+	const selection = useTableSelection(rowEntries.map((entry) => entry.key));
+	const currentPage = pagination.currentPage ?? state.page;
+	const lastPage = pagination.lastPage ?? currentPage;
+	const mode = pagination.mode ?? "table";
+	const visiblePages = getVisiblePages(currentPage, lastPage);
+	const hasNextPage = pagination.hasMore ?? currentPage < lastPage;
+	const hasActions = rowEntries.some((entry) => entry.actions.length > 0);
+	const striped = node.props?.striped === true;
+	const hasFilters = columns.some((column) => column.filter?.enabled);
+	const filterEntries = filters.map((clause, index) => ({
+		clause,
+		index
+	}));
+	const gridTemplateColumns = getColumnGridTemplate(columns, hasActions, hasBulkActions);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-lattice-component": node.id,
+		className: "overflow-x-auto rounded-lt-sm border border-lt-border",
+		children: [
+			hasBulkActions && selection.active && /* @__PURE__ */ jsx(BulkBar, {
+				actions: bulkActions,
+				selectedKeys: selection.selectedKeys,
+				allMatching: selection.allMatching,
+				total: pagination.total,
+				query: getQueryParams(state),
+				canSelectAllMatching: selection.allVisibleSelected && !selection.allMatching && pagination.total !== void 0 && pagination.total > selection.selectedKeys.length,
+				onSelectAllMatching: selection.selectAllMatching,
+				onCompleted: selection.clear
+			}),
+			filters.length > 0 && /* @__PURE__ */ jsx(FilterStackBar, {
+				filters,
+				columns,
+				processing,
+				onRemove: removeFilter
+			}),
+			state.sorts.length > 0 && /* @__PURE__ */ jsx(SortBar, {
+				columns,
+				state,
+				processing,
+				onClear: clearSort
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "w-max min-w-full text-sm",
+				role: "table",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "border-b border-lt-border bg-lt-muted/50",
+					role: "rowgroup",
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "hidden min-w-full md:grid md:grid-cols-[var(--lattice-table-columns)]",
+						role: "row",
+						style: { "--lattice-table-columns": gridTemplateColumns },
+						children: [
+							hasBulkActions && /* @__PURE__ */ jsx("div", {
+								className: "flex items-center px-4 py-3",
+								role: "columnheader",
+								children: /* @__PURE__ */ jsx("input", {
+									type: "checkbox",
+									"aria-label": "Select all rows",
+									checked: selection.allSelected,
+									onChange: selection.toggleAll
+								})
+							}),
+							columns.map((column) => /* @__PURE__ */ jsx(ColumnHeader, {
+								column,
+								processing,
+								sort,
+								state
+							}, column.key)),
+							hasActions && /* @__PURE__ */ jsx("div", {
+								className: "px-4 py-3 text-right align-middle font-medium text-lt-muted-fg",
+								role: "columnheader",
+								children: "Actions"
+							})
+						]
+					}), hasFilters && /* @__PURE__ */ jsxs("div", {
+						className: "hidden min-w-full border-t border-lt-border md:grid md:grid-cols-[var(--lattice-table-columns)]",
+						role: "row",
+						style: { "--lattice-table-columns": gridTemplateColumns },
+						children: [
+							hasBulkActions && /* @__PURE__ */ jsx("div", {
+								className: "px-4 py-2",
+								role: "cell"
+							}),
+							columns.map((column) => /* @__PURE__ */ jsx("div", {
+								className: "px-4 py-2",
+								role: "cell",
+								children: column.filter?.enabled && /* @__PURE__ */ jsx(ColumnFilterControl, {
+									column,
+									clauses: filterEntries.filter((entry) => entry.clause.field === column.key),
+									processing,
+									onAdd: addFilter,
+									onUpdate: updateFilter,
+									onRemove: removeFilter
+								})
+							}, column.key)),
+							hasActions && /* @__PURE__ */ jsx("div", {
+								className: "px-4 py-2",
+								role: "cell"
+							})
+						]
+					})]
+				}), /* @__PURE__ */ jsx("div", {
+					role: "rowgroup",
+					children: !hasLoaded ? /* @__PURE__ */ jsx("div", {
+						className: "p-4 text-lt-muted-fg",
+						role: "row",
+						children: /* @__PURE__ */ jsx("div", {
+							role: "cell",
+							children: "Loading rows..."
+						})
+					}) : rowEntries.map(({ row, actions, key }) => {
+						return /* @__PURE__ */ jsxs("div", {
+							className: `grid grid-cols-1 border-b border-lt-border last:border-b-0 md:grid-cols-[var(--lattice-table-columns)] ${striped ? "odd:bg-lt-muted/30" : ""}`,
+							role: "row",
+							style: { "--lattice-table-columns": gridTemplateColumns },
+							children: [
+								hasBulkActions && /* @__PURE__ */ jsx("div", {
+									className: "flex items-center p-4",
+									role: "cell",
+									children: /* @__PURE__ */ jsx("input", {
+										type: "checkbox",
+										"aria-label": `Select row ${key}`,
+										checked: selection.isSelected(key),
+										onChange: () => selection.toggle(key)
+									})
+								}),
+								columns.map((column) => /* @__PURE__ */ jsxs("div", {
+									className: "grid gap-1 p-4 align-middle",
+									role: "cell",
+									children: [/* @__PURE__ */ jsx("span", {
+										"aria-hidden": "true",
+										className: "text-xs font-medium text-lt-muted-fg md:hidden",
+										children: column.label
+									}), /* @__PURE__ */ jsx(ColumnCell, {
+										column,
+										row
+									})]
+								}, column.key)),
+								actions.length > 0 && /* @__PURE__ */ jsx("div", {
+									className: "flex items-center justify-start gap-2 p-4 md:justify-end",
+									role: "cell",
+									children: actions.map((action, actionIndex) => /* @__PURE__ */ jsx(TableActionNode, { node: action }, action.key ?? action.id ?? actionIndex))
+								})
+							]
+						}, key);
+					})
+				})]
+			}),
+			hasLoaded && /* @__PURE__ */ jsx(TablePagination, {
+				pagination,
+				currentPage,
+				processing,
+				mode,
+				hasNextPage,
+				visiblePages,
+				infiniteLoaderRef,
+				onPage: goToPage,
+				onLoadMore: loadMore
+			})
+		]
+	});
+};
+//#endregion
+export { TableComponent as default };
+
+//# sourceMappingURL=table.js.map

package/dist/table/components/table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.js","names":[],"sources":["../../../resources/js/table/components/table.tsx"],"sourcesContent":["import type { RendererComponent } from \"@lattice/lattice/core/types\";\nimport { getBulkActions } from \"../bulk\";\nimport { getRowActions, getRowKey } from \"../payload\";\nimport { getColumnGridTemplate, getQueryParams, getVisiblePages } from \"../query\";\nimport { useTable } from \"../use-table\";\nimport { useTableSelection } from \"../use-table-selection\";\nimport { BulkBar } from \"./bulk-bar\";\nimport { ColumnFilterControl } from \"./column-filter-control\";\nimport { ColumnHeader } from \"./column-header\";\nimport { FilterStackBar } from \"./filter-stack-bar\";\nimport { TablePagination } from \"./pagination\";\nimport { SortBar } from \"./sort-bar\";\nimport { TableActionNode } from \"./table-action-node\";\nimport { ColumnCell } from \"./table-cell\";\n\nconst TableComponent: RendererComponent<\"table\"> = ({ node }) => {\n  const {\n    columns,\n    rows,\n    pagination,\n    state,\n    filters,\n    addFilter,\n    updateFilter,\n    removeFilter,\n    processing,\n    hasLoaded,\n    infiniteLoaderRef,\n    sort,\n    clearSort,\n    goToPage,\n    loadMore,\n  } = useTable(node);\n\n  const bulkActions = getBulkActions(node.props?.bulkActions);\n  const hasBulkActions = bulkActions.length > 0;\n  const rowEntries = rows.map((row, index) => ({\n    row,\n    actions: getRowActions(row),\n    key: getRowKey(row, index),\n  }));\n  const selection = useTableSelection(rowEntries.map((entry) => entry.key));\n\n  const currentPage = pagination.currentPage ?? state.page;\n  const lastPage = pagination.lastPage ?? currentPage;\n  const mode = pagination.mode ?? \"table\";\n  const visiblePages = getVisiblePages(currentPage, lastPage);\n  const hasNextPage = pagination.hasMore ?? currentPage < lastPage;\n  const hasActions = rowEntries.some((entry) => entry.actions.length > 0);\n  const striped = node.props?.striped === true;\n  const hasFilters = columns.some((column) => column.filter?.enabled);\n  const filterEntries = filters.map((clause, index) => ({ clause, index }));\n  const gridTemplateColumns = getColumnGridTemplate(columns, hasActions, hasBulkActions);\n\n  return (\n    <div\n      data-lattice-component={node.id}\n      className=\"overflow-x-auto rounded-lt-sm border border-lt-border\"\n    >\n      {hasBulkActions && selection.active && (\n        <BulkBar\n          actions={bulkActions}\n          selectedKeys={selection.selectedKeys}\n          allMatching={selection.allMatching}\n          total={pagination.total}\n          query={getQueryParams(state)}\n          canSelectAllMatching={\n            selection.allVisibleSelected &&\n            !selection.allMatching &&\n            pagination.total !== undefined &&\n            pagination.total > selection.selectedKeys.length\n          }\n          onSelectAllMatching={selection.selectAllMatching}\n          onCompleted={selection.clear}\n        />\n      )}\n      {filters.length > 0 && (\n        <FilterStackBar\n          filters={filters}\n          columns={columns}\n          processing={processing}\n          onRemove={removeFilter}\n        />\n      )}\n      {state.sorts.length > 0 && (\n        <SortBar columns={columns} state={state} processing={processing} onClear={clearSort} />\n      )}\n      <div className=\"w-max min-w-full text-sm\" role=\"table\">\n        <div className=\"border-b border-lt-border bg-lt-muted/50\" role=\"rowgroup\">\n          <div\n            className=\"hidden min-w-full md:grid md:grid-cols-[var(--lattice-table-columns)]\"\n            role=\"row\"\n            style={{ \"--lattice-table-columns\": gridTemplateColumns } as never}\n          >\n            {hasBulkActions && (\n              <div className=\"flex items-center px-4 py-3\" role=\"columnheader\">\n                <input\n                  type=\"checkbox\"\n                  aria-label=\"Select all rows\"\n                  checked={selection.allSelected}\n                  onChange={selection.toggleAll}\n                />\n              </div>\n            )}\n            {columns.map((column) => (\n              <ColumnHeader\n                column={column}\n                key={column.key}\n                processing={processing}\n                sort={sort}\n                state={state}\n              />\n            ))}\n            {hasActions && (\n              <div\n                className=\"px-4 py-3 text-right align-middle font-medium text-lt-muted-fg\"\n                role=\"columnheader\"\n              >\n                Actions\n              </div>\n            )}\n          </div>\n          {hasFilters && (\n            <div\n              className=\"hidden min-w-full border-t border-lt-border md:grid md:grid-cols-[var(--lattice-table-columns)]\"\n              role=\"row\"\n              style={{ \"--lattice-table-columns\": gridTemplateColumns } as never}\n            >\n              {hasBulkActions && <div className=\"px-4 py-2\" role=\"cell\" />}\n              {columns.map((column) => (\n                <div key={column.key} className=\"px-4 py-2\" role=\"cell\">\n                  {column.filter?.enabled && (\n                    <ColumnFilterControl\n                      column={column}\n                      clauses={filterEntries.filter((entry) => entry.clause.field === column.key)}\n                      processing={processing}\n                      onAdd={addFilter}\n                      onUpdate={updateFilter}\n                      onRemove={removeFilter}\n                    />\n                  )}\n                </div>\n              ))}\n              {hasActions && <div className=\"px-4 py-2\" role=\"cell\" />}\n            </div>\n          )}\n        </div>\n        <div role=\"rowgroup\">\n          {!hasLoaded ? (\n            <div className=\"p-4 text-lt-muted-fg\" role=\"row\">\n              <div role=\"cell\">Loading rows...</div>\n            </div>\n          ) : (\n            rowEntries.map(({ row, actions, key }) => {\n              return (\n                <div\n                  key={key}\n                  className={`grid grid-cols-1 border-b border-lt-border last:border-b-0 md:grid-cols-[var(--lattice-table-columns)] ${\n                    striped ? \"odd:bg-lt-muted/30\" : \"\"\n                  }`}\n                  role=\"row\"\n                  style={{ \"--lattice-table-columns\": gridTemplateColumns } as never}\n                >\n                  {hasBulkActions && (\n                    <div className=\"flex items-center p-4\" role=\"cell\">\n                      <input\n                        type=\"checkbox\"\n                        aria-label={`Select row ${key}`}\n                        checked={selection.isSelected(key)}\n                        onChange={() => selection.toggle(key)}\n                      />\n                    </div>\n                  )}\n                  {columns.map((column) => (\n                    <div key={column.key} className=\"grid gap-1 p-4 align-middle\" role=\"cell\">\n                      <span\n                        aria-hidden=\"true\"\n                        className=\"text-xs font-medium text-lt-muted-fg md:hidden\"\n                      >\n                        {column.label}\n                      </span>\n                      <ColumnCell column={column} row={row} />\n                    </div>\n                  ))}\n                  {actions.length > 0 && (\n                    <div\n                      className=\"flex items-center justify-start gap-2 p-4 md:justify-end\"\n                      role=\"cell\"\n                    >\n                      {actions.map((action, actionIndex) => (\n                        <TableActionNode\n                          key={action.key ?? action.id ?? actionIndex}\n                          node={action}\n                        />\n                      ))}\n                    </div>\n                  )}\n                </div>\n              );\n            })\n          )}\n        </div>\n      </div>\n      {hasLoaded && (\n        <TablePagination\n          pagination={pagination}\n          currentPage={currentPage}\n          processing={processing}\n          mode={mode}\n          hasNextPage={hasNextPage}\n          visiblePages={visiblePages}\n          infiniteLoaderRef={infiniteLoaderRef}\n          onPage={goToPage}\n          onLoadMore={loadMore}\n        />\n      )}\n    </div>\n  );\n};\n\nexport default TableComponent;\n"],"mappings":"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"}

package/dist/table/format.d.ts

@@ -0,0 +1,3 @@
+import { TableColumn, TableRow } from './types';
+export declare function formatCell(value: unknown, column?: TableColumn): string;
+export declare function resolveLink(column: TableColumn, row: TableRow, value: unknown): string | null;

package/dist/table/format.js

@@ -0,0 +1,41 @@
+//#region resources/js/table/format.ts
+function formatCell(value, column) {
+	if (value === null || value === void 0) return "";
+	if (column?.date) return formatDate(value, column.date.format ?? null);
+	if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") return String(value);
+	return JSON.stringify(value);
+}
+function formatDate(value, format) {
+	const date = new Date(String(value));
+	if (Number.isNaN(date.getTime())) return formatCell(value);
+	if (!format) return new Intl.DateTimeFormat(void 0, {
+		dateStyle: "medium",
+		timeStyle: "short"
+	}).format(date);
+	const replacements = {
+		Y: String(date.getFullYear()),
+		y: String(date.getFullYear()).slice(-2),
+		m: String(date.getMonth() + 1).padStart(2, "0"),
+		n: String(date.getMonth() + 1),
+		d: String(date.getDate()).padStart(2, "0"),
+		j: String(date.getDate()),
+		H: String(date.getHours()).padStart(2, "0"),
+		G: String(date.getHours()),
+		i: String(date.getMinutes()).padStart(2, "0"),
+		s: String(date.getSeconds()).padStart(2, "0")
+	};
+	return format.replace(/[YymndjHGis]/g, (token) => replacements[token] ?? token);
+}
+function resolveLink(column, row, value) {
+	if (!column.link) return null;
+	const href = column.link.href ?? String(value ?? "");
+	if (href === "") return null;
+	return href.replace(/\{([^}]+)\}/g, (_, key) => {
+		if (key === "value") return encodeURIComponent(String(value ?? ""));
+		return encodeURIComponent(String(row[key] ?? ""));
+	});
+}
+//#endregion
+export { formatCell, resolveLink };
+
+//# sourceMappingURL=format.js.map

package/dist/table/format.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"format.js","names":[],"sources":["../../resources/js/table/format.ts"],"sourcesContent":["import type { TableColumn, TableRow } from \"./types\";\n\nexport function formatCell(value: unknown, column?: TableColumn): string {\n  if (value === null || value === undefined) {\n    return \"\";\n  }\n\n  if (column?.date) {\n    return formatDate(value, column.date.format ?? null);\n  }\n\n  if (typeof value === \"string\" || typeof value === \"number\" || typeof value === \"boolean\") {\n    return String(value);\n  }\n\n  return JSON.stringify(value);\n}\n\nfunction formatDate(value: unknown, format: string | null): string {\n  const date = new Date(String(value));\n\n  if (Number.isNaN(date.getTime())) {\n    return formatCell(value);\n  }\n\n  if (!format) {\n    return new Intl.DateTimeFormat(undefined, {\n      dateStyle: \"medium\",\n      timeStyle: \"short\",\n    }).format(date);\n  }\n\n  const replacements: Record<string, string> = {\n    Y: String(date.getFullYear()),\n    y: String(date.getFullYear()).slice(-2),\n    m: String(date.getMonth() + 1).padStart(2, \"0\"),\n    n: String(date.getMonth() + 1),\n    d: String(date.getDate()).padStart(2, \"0\"),\n    j: String(date.getDate()),\n    H: String(date.getHours()).padStart(2, \"0\"),\n    G: String(date.getHours()),\n    i: String(date.getMinutes()).padStart(2, \"0\"),\n    s: String(date.getSeconds()).padStart(2, \"0\"),\n  };\n\n  return format.replace(/[YymndjHGis]/g, (token) => replacements[token] ?? token);\n}\n\nexport function resolveLink(column: TableColumn, row: TableRow, value: unknown): string | null {\n  if (!column.link) {\n    return null;\n  }\n\n  const href = column.link.href ?? String(value ?? \"\");\n\n  if (href === \"\") {\n    return null;\n  }\n\n  return href.replace(/\\{([^}]+)\\}/g, (_, key: string) => {\n    if (key === \"value\") {\n      return encodeURIComponent(String(value ?? \"\"));\n    }\n\n    return encodeURIComponent(String(row[key] ?? \"\"));\n  });\n}\n"],"mappings":";AAEA,SAAgB,WAAW,OAAgB,QAA8B;CACvE,IAAI,UAAU,QAAQ,UAAU,KAAA,GAC9B,OAAO;CAGT,IAAI,QAAQ,MACV,OAAO,WAAW,OAAO,OAAO,KAAK,UAAU,IAAI;CAGrD,IAAI,OAAO,UAAU,YAAY,OAAO,UAAU,YAAY,OAAO,UAAU,WAC7E,OAAO,OAAO,KAAK;CAGrB,OAAO,KAAK,UAAU,KAAK;AAC7B;AAEA,SAAS,WAAW,OAAgB,QAA+B;CACjE,MAAM,OAAO,IAAI,KAAK,OAAO,KAAK,CAAC;CAEnC,IAAI,OAAO,MAAM,KAAK,QAAQ,CAAC,GAC7B,OAAO,WAAW,KAAK;CAGzB,IAAI,CAAC,QACH,OAAO,IAAI,KAAK,eAAe,KAAA,GAAW;EACxC,WAAW;EACX,WAAW;CACb,CAAC,EAAE,OAAO,IAAI;CAGhB,MAAM,eAAuC;EAC3C,GAAG,OAAO,KAAK,YAAY,CAAC;EAC5B,GAAG,OAAO,KAAK,YAAY,CAAC,EAAE,MAAM,EAAE;EACtC,GAAG,OAAO,KAAK,SAAS,IAAI,CAAC,EAAE,SAAS,GAAG,GAAG;EAC9C,GAAG,OAAO,KAAK,SAAS,IAAI,CAAC;EAC7B,GAAG,OAAO,KAAK,QAAQ,CAAC,EAAE,SAAS,GAAG,GAAG;EACzC,GAAG,OAAO,KAAK,QAAQ,CAAC;EACxB,GAAG,OAAO,KAAK,SAAS,CAAC,EAAE,SAAS,GAAG,GAAG;EAC1C,GAAG,OAAO,KAAK,SAAS,CAAC;EACzB,GAAG,OAAO,KAAK,WAAW,CAAC,EAAE,SAAS,GAAG,GAAG;EAC5C,GAAG,OAAO,KAAK,WAAW,CAAC,EAAE,SAAS,GAAG,GAAG;CAC9C;CAEA,OAAO,OAAO,QAAQ,kBAAkB,UAAU,aAAa,UAAU,KAAK;AAChF;AAEA,SAAgB,YAAY,QAAqB,KAAe,OAA+B;CAC7F,IAAI,CAAC,OAAO,MACV,OAAO;CAGT,MAAM,OAAO,OAAO,KAAK,QAAQ,OAAO,SAAS,EAAE;CAEnD,IAAI,SAAS,IACX,OAAO;CAGT,OAAO,KAAK,QAAQ,iBAAiB,GAAG,QAAgB;EACtD,IAAI,QAAQ,SACV,OAAO,mBAAmB,OAAO,SAAS,EAAE,CAAC;EAG/C,OAAO,mBAAmB,OAAO,IAAI,QAAQ,EAAE,CAAC;CAClD,CAAC;AACH"}

package/dist/table/index.d.ts

@@ -0,0 +1 @@
+export declare const tableComponents: import('../../../core/registry').Plugin;

package/dist/table/index.js

@@ -0,0 +1,10 @@
+import { createPlugin, lazyComponent } from "../core/registry.js";
+//#region resources/js/table/index.ts
+var tableComponents = createPlugin({
+	components: { table: lazyComponent(() => import("./components/table.js")) },
+	name: "lattice/table"
+});
+//#endregion
+export { tableComponents };
+
+//# sourceMappingURL=index.js.map

package/dist/table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../resources/js/table/index.ts"],"sourcesContent":["import { createPlugin, lazyComponent } from \"@lattice/lattice/core/registry\";\n\nexport const tableComponents = createPlugin({\n  components: {\n    table: lazyComponent(() => import(\"./components/table\")),\n  },\n  name: \"lattice/table\",\n});\n"],"mappings":";;AAEA,IAAa,kBAAkB,aAAa;CAC1C,YAAY,EACV,OAAO,oBAAoB,OAAO,wBAAqB,EACzD;CACA,MAAM;AACR,CAAC"}

package/dist/table/payload.d.ts

@@ -0,0 +1,9 @@
+import { Node } from '../../../core/types';
+import { TableColumn, TablePagination, TableRow, TableState } from './types';
+export declare function getColumns(value: unknown): TableColumn[];
+export declare function getRows(value: unknown): TableRow[];
+export declare function getPagination(value: unknown): TablePagination;
+export declare function flattenColumns(columns: TableColumn[]): TableColumn[];
+export declare function getState(value: unknown): TableState;
+export declare function getRowKey(row: TableRow, index: number): string;
+export declare function getRowActions(row: TableRow): Node[];

package/dist/table/payload.js

@@ -0,0 +1,46 @@
+//#region resources/js/table/payload.ts
+function getFilters(value) {
+	if (!Array.isArray(value)) return [];
+	return value.filter((clause) => typeof clause === "object" && clause !== null && typeof clause.field === "string" && typeof clause.operator === "string" && typeof clause.value === "string");
+}
+function getColumns(value) {
+	if (!Array.isArray(value)) return [];
+	return value.filter((column) => typeof column === "object" && column !== null && "key" in column && "label" in column && typeof column.key === "string" && typeof column.label === "string");
+}
+function getRows(value) {
+	if (!Array.isArray(value)) return [];
+	return value.filter((row) => typeof row === "object" && row !== null && !Array.isArray(row));
+}
+function getPagination(value) {
+	if (typeof value !== "object" || value === null || Array.isArray(value)) return {};
+	return value;
+}
+function flattenColumns(columns) {
+	return columns.flatMap((column) => [column, ...flattenColumns(column.columns ?? [])]);
+}
+function getState(value) {
+	if (typeof value !== "object" || value === null || Array.isArray(value)) return {
+		filters: [],
+		sorts: [],
+		page: 1,
+		perPage: 25
+	};
+	const state = value;
+	return {
+		filters: getFilters(state.filters),
+		sorts: Array.isArray(state.sorts) ? state.sorts : [],
+		page: typeof state.page === "number" ? state.page : 1,
+		perPage: typeof state.perPage === "number" ? state.perPage : 25
+	};
+}
+function getRowKey(row, index) {
+	const key = row.id ?? row.uuid ?? row.key ?? index;
+	return String(key);
+}
+function getRowActions(row) {
+	return Array.isArray(row.actions) ? row.actions : [];
+}
+//#endregion
+export { flattenColumns, getColumns, getPagination, getRowActions, getRowKey, getRows, getState };
+
+//# sourceMappingURL=payload.js.map

package/dist/table/payload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"payload.js","names":[],"sources":["../../resources/js/table/payload.ts"],"sourcesContent":["import type { Node } from \"@lattice/lattice/core/types\";\nimport type { FilterClause, TableColumn, TablePagination, TableRow, TableState } from \"./types\";\n\nfunction getFilters(value: unknown): FilterClause[] {\n  if (!Array.isArray(value)) {\n    return [];\n  }\n\n  return value.filter(\n    (clause): clause is FilterClause =>\n      typeof clause === \"object\" &&\n      clause !== null &&\n      typeof clause.field === \"string\" &&\n      typeof clause.operator === \"string\" &&\n      typeof clause.value === \"string\",\n  );\n}\n\nexport function getColumns(value: unknown): TableColumn[] {\n  if (!Array.isArray(value)) {\n    return [];\n  }\n\n  return value.filter(\n    (column): column is TableColumn =>\n      typeof column === \"object\" &&\n      column !== null &&\n      \"key\" in column &&\n      \"label\" in column &&\n      typeof column.key === \"string\" &&\n      typeof column.label === \"string\",\n  );\n}\n\nexport function getRows(value: unknown): TableRow[] {\n  if (!Array.isArray(value)) {\n    return [];\n  }\n\n  return value.filter(\n    (row): row is TableRow => typeof row === \"object\" && row !== null && !Array.isArray(row),\n  );\n}\n\nexport function getPagination(value: unknown): TablePagination {\n  if (typeof value !== \"object\" || value === null || Array.isArray(value)) {\n    return {};\n  }\n\n  return value as TablePagination;\n}\n\nexport function flattenColumns(columns: TableColumn[]): TableColumn[] {\n  return columns.flatMap((column) => [column, ...flattenColumns(column.columns ?? [])]);\n}\n\nexport function getState(value: unknown): TableState {\n  if (typeof value !== \"object\" || value === null || Array.isArray(value)) {\n    return {\n      filters: [],\n      sorts: [],\n      page: 1,\n      perPage: 25,\n    };\n  }\n\n  const state = value as Partial<TableState>;\n\n  return {\n    filters: getFilters(state.filters),\n    sorts: Array.isArray(state.sorts) ? state.sorts : [],\n    page: typeof state.page === \"number\" ? state.page : 1,\n    perPage: typeof state.perPage === \"number\" ? state.perPage : 25,\n  };\n}\n\nexport function getRowKey(row: TableRow, index: number): string {\n  const key = row.id ?? row.uuid ?? row.key ?? index;\n\n  return String(key);\n}\n\nexport function getRowActions(row: TableRow): Node[] {\n  return Array.isArray(row.actions) ? (row.actions as Node[]) : [];\n}\n"],"mappings":";AAGA,SAAS,WAAW,OAAgC;CAClD,IAAI,CAAC,MAAM,QAAQ,KAAK,GACtB,OAAO,CAAC;CAGV,OAAO,MAAM,QACV,WACC,OAAO,WAAW,YAClB,WAAW,QACX,OAAO,OAAO,UAAU,YACxB,OAAO,OAAO,aAAa,YAC3B,OAAO,OAAO,UAAU,QAC5B;AACF;AAEA,SAAgB,WAAW,OAA+B;CACxD,IAAI,CAAC,MAAM,QAAQ,KAAK,GACtB,OAAO,CAAC;CAGV,OAAO,MAAM,QACV,WACC,OAAO,WAAW,YAClB,WAAW,QACX,SAAS,UACT,WAAW,UACX,OAAO,OAAO,QAAQ,YACtB,OAAO,OAAO,UAAU,QAC5B;AACF;AAEA,SAAgB,QAAQ,OAA4B;CAClD,IAAI,CAAC,MAAM,QAAQ,KAAK,GACtB,OAAO,CAAC;CAGV,OAAO,MAAM,QACV,QAAyB,OAAO,QAAQ,YAAY,QAAQ,QAAQ,CAAC,MAAM,QAAQ,GAAG,CACzF;AACF;AAEA,SAAgB,cAAc,OAAiC;CAC7D,IAAI,OAAO,UAAU,YAAY,UAAU,QAAQ,MAAM,QAAQ,KAAK,GACpE,OAAO,CAAC;CAGV,OAAO;AACT;AAEA,SAAgB,eAAe,SAAuC;CACpE,OAAO,QAAQ,SAAS,WAAW,CAAC,QAAQ,GAAG,eAAe,OAAO,WAAW,CAAC,CAAC,CAAC,CAAC;AACtF;AAEA,SAAgB,SAAS,OAA4B;CACnD,IAAI,OAAO,UAAU,YAAY,UAAU,QAAQ,MAAM,QAAQ,KAAK,GACpE,OAAO;EACL,SAAS,CAAC;EACV,OAAO,CAAC;EACR,MAAM;EACN,SAAS;CACX;CAGF,MAAM,QAAQ;CAEd,OAAO;EACL,SAAS,WAAW,MAAM,OAAO;EACjC,OAAO,MAAM,QAAQ,MAAM,KAAK,IAAI,MAAM,QAAQ,CAAC;EACnD,MAAM,OAAO,MAAM,SAAS,WAAW,MAAM,OAAO;EACpD,SAAS,OAAO,MAAM,YAAY,WAAW,MAAM,UAAU;CAC/D;AACF;AAEA,SAAgB,UAAU,KAAe,OAAuB;CAC9D,MAAM,MAAM,IAAI,MAAM,IAAI,QAAQ,IAAI,OAAO;CAE7C,OAAO,OAAO,GAAG;AACnB;AAEA,SAAgB,cAAc,KAAuB;CACnD,OAAO,MAAM,QAAQ,IAAI,OAAO,IAAK,IAAI,UAAqB,CAAC;AACjE"}

package/dist/table/query.d.ts

@@ -0,0 +1,12 @@
+import { TableColumn, TableSort, TableState } from './types';
+export declare function getColumnSort(state: TableState, column: TableColumn): TableSort | undefined;
+export declare function getSortColumn(columns: TableColumn[], sort: TableSort): TableColumn | undefined;
+export declare function getColumnAriaSort(sort: TableSort | undefined): "ascending" | "descending" | undefined;
+export declare function buildEndpoint(endpoint: string, state: TableState): string;
+export declare function getQueryParams(state: TableState): Record<string, unknown>;
+export declare const VALUELESS_FILTER_OPERATORS: Set<string>;
+export declare function operatorLabel(operator: string): string;
+export declare function getSortDirectionLabel(direction: string): string;
+export declare function nextSort(sorts: TableSort[], column: TableColumn): TableSort[];
+export declare function getVisiblePages(currentPage: number, lastPage: number): number[];
+export declare function getColumnGridTemplate(columns: TableColumn[], hasActions: boolean, hasSelection: boolean): string;

package/dist/table/query.js

@@ -0,0 +1,83 @@
+import { flattenColumns } from "./payload.js";
+//#region resources/js/table/query.ts
+function getColumnSort(state, column) {
+	return state.sorts.find((currentSort) => currentSort.key === column.key);
+}
+function getSortColumn(columns, sort) {
+	return flattenColumns(columns).find((column) => column.key === sort.key);
+}
+function getColumnAriaSort(sort) {
+	if (sort?.direction === "asc") return "ascending";
+	if (sort?.direction === "desc") return "descending";
+}
+function buildEndpoint(endpoint, state) {
+	const url = new URL(endpoint, window.location.origin);
+	if (state.filters.length > 0) url.searchParams.set("filter", serializeFilters(state));
+	if (state.sorts.length > 0) url.searchParams.set("sort", serializeSorts(state));
+	url.searchParams.set("page", String(state.page));
+	url.searchParams.set("per_page", String(state.perPage));
+	return `${url.pathname}${url.search}`;
+}
+function getQueryParams(state) {
+	const params = {};
+	if (state.filters.length > 0) params.filter = serializeFilters(state);
+	if (state.sorts.length > 0) params.sort = serializeSorts(state);
+	return params;
+}
+function serializeFilters(state) {
+	return state.filters.map((clause) => `${clause.field}:${clause.operator}:${encodeURIComponent(clause.value)}`).join(",");
+}
+function serializeSorts(state) {
+	return state.sorts.map((sort) => sort.direction === "desc" ? `-${sort.key}` : sort.key).join(",");
+}
+var operatorLabels = {
+	contains: "contains",
+	starts_with: "starts with",
+	ends_with: "ends with",
+	eq: "equals",
+	neq: "not equals",
+	gt: ">",
+	gte: "≥",
+	lt: "<",
+	lte: "≤",
+	before: "before",
+	after: "after",
+	empty: "is empty",
+	filled: "is not empty"
+};
+var VALUELESS_FILTER_OPERATORS = new Set(["empty", "filled"]);
+function operatorLabel(operator) {
+	return operatorLabels[operator] ?? operator;
+}
+function getSortDirectionLabel(direction) {
+	return direction === "desc" ? "descending" : "ascending";
+}
+function nextSort(sorts, column) {
+	if (!column.sortable) return sorts;
+	const currentSort = sorts.find((sort) => sort.key === column.key);
+	const remainingSorts = sorts.filter((sort) => sort.key !== column.key);
+	if (!currentSort) return [...sorts, {
+		key: column.key,
+		direction: "asc"
+	}];
+	if (currentSort.direction === "asc") return [...remainingSorts, {
+		key: column.key,
+		direction: "desc"
+	}];
+	return remainingSorts;
+}
+function getVisiblePages(currentPage, lastPage) {
+	if (lastPage <= 5) return Array.from({ length: lastPage }, (_, index) => index + 1);
+	const start = Math.max(1, Math.min(currentPage - 2, lastPage - 4));
+	return Array.from({ length: 5 }, (_, index) => start + index);
+}
+function getColumnGridTemplate(columns, hasActions, hasSelection) {
+	const tracks = columns.map((column) => column.type === "stack" ? "minmax(16rem, 2fr)" : "minmax(9rem, 1fr)");
+	if (hasActions) tracks.push("max-content");
+	if (hasSelection) tracks.unshift("max-content");
+	return tracks.join(" ");
+}
+//#endregion
+export { VALUELESS_FILTER_OPERATORS, buildEndpoint, getColumnAriaSort, getColumnGridTemplate, getColumnSort, getQueryParams, getSortColumn, getSortDirectionLabel, getVisiblePages, nextSort, operatorLabel };
+
+//# sourceMappingURL=query.js.map

package/dist/table/query.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"query.js","names":[],"sources":["../../resources/js/table/query.ts"],"sourcesContent":["import { flattenColumns } from \"./payload\";\nimport type { TableColumn, TableSort, TableState } from \"./types\";\n\nexport function getColumnSort(state: TableState, column: TableColumn): TableSort | undefined {\n  return state.sorts.find((currentSort) => currentSort.key === column.key);\n}\n\nexport function getSortColumn(columns: TableColumn[], sort: TableSort): TableColumn | undefined {\n  return flattenColumns(columns).find((column) => column.key === sort.key);\n}\n\nexport function getColumnAriaSort(\n  sort: TableSort | undefined,\n): \"ascending\" | \"descending\" | undefined {\n  if (sort?.direction === \"asc\") {\n    return \"ascending\";\n  }\n\n  if (sort?.direction === \"desc\") {\n    return \"descending\";\n  }\n\n  return undefined;\n}\n\nexport function buildEndpoint(endpoint: string, state: TableState): string {\n  const url = new URL(endpoint, window.location.origin);\n\n  if (state.filters.length > 0) {\n    url.searchParams.set(\"filter\", serializeFilters(state));\n  }\n\n  if (state.sorts.length > 0) {\n    url.searchParams.set(\"sort\", serializeSorts(state));\n  }\n\n  url.searchParams.set(\"page\", String(state.page));\n  url.searchParams.set(\"per_page\", String(state.perPage));\n\n  return `${url.pathname}${url.search}`;\n}\n\nexport function getQueryParams(state: TableState): Record<string, unknown> {\n  const params: Record<string, unknown> = {};\n\n  if (state.filters.length > 0) {\n    params.filter = serializeFilters(state);\n  }\n\n  if (state.sorts.length > 0) {\n    params.sort = serializeSorts(state);\n  }\n\n  return params;\n}\n\nfunction serializeFilters(state: TableState): string {\n  return state.filters\n    .map((clause) => `${clause.field}:${clause.operator}:${encodeURIComponent(clause.value)}`)\n    .join(\",\");\n}\n\nfunction serializeSorts(state: TableState): string {\n  return state.sorts\n    .map((sort) => (sort.direction === \"desc\" ? `-${sort.key}` : sort.key))\n    .join(\",\");\n}\n\nconst operatorLabels: Record<string, string> = {\n  contains: \"contains\",\n  starts_with: \"starts with\",\n  ends_with: \"ends with\",\n  eq: \"equals\",\n  neq: \"not equals\",\n  gt: \">\",\n  gte: \"≥\",\n  lt: \"<\",\n  lte: \"≤\",\n  before: \"before\",\n  after: \"after\",\n  empty: \"is empty\",\n  filled: \"is not empty\",\n};\n\n// Operators that filter on presence alone and carry no value input.\nexport const VALUELESS_FILTER_OPERATORS = new Set<string>([\"empty\", \"filled\"]);\n\nexport function operatorLabel(operator: string): string {\n  return operatorLabels[operator] ?? operator;\n}\n\nexport function getSortDirectionLabel(direction: string): string {\n  return direction === \"desc\" ? \"descending\" : \"ascending\";\n}\n\nexport function nextSort(sorts: TableSort[], column: TableColumn): TableSort[] {\n  if (!column.sortable) {\n    return sorts;\n  }\n\n  const currentSort = sorts.find((sort) => sort.key === column.key);\n  const remainingSorts = sorts.filter((sort) => sort.key !== column.key);\n\n  if (!currentSort) {\n    return [...sorts, { key: column.key, direction: \"asc\" }];\n  }\n\n  if (currentSort.direction === \"asc\") {\n    return [...remainingSorts, { key: column.key, direction: \"desc\" }];\n  }\n\n  return remainingSorts;\n}\n\nexport function getVisiblePages(currentPage: number, lastPage: number): number[] {\n  if (lastPage <= 5) {\n    return Array.from({ length: lastPage }, (_, index) => index + 1);\n  }\n\n  const start = Math.max(1, Math.min(currentPage - 2, lastPage - 4));\n\n  return Array.from({ length: 5 }, (_, index) => start + index);\n}\n\nexport function getColumnGridTemplate(\n  columns: TableColumn[],\n  hasActions: boolean,\n  hasSelection: boolean,\n): string {\n  const tracks: string[] = columns.map((column) =>\n    column.type === \"stack\" ? \"minmax(16rem, 2fr)\" : \"minmax(9rem, 1fr)\",\n  );\n\n  if (hasActions) {\n    tracks.push(\"max-content\");\n  }\n\n  if (hasSelection) {\n    tracks.unshift(\"max-content\");\n  }\n\n  return tracks.join(\" \");\n}\n"],"mappings":"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"}

package/dist/table/types.d.ts

@@ -0,0 +1,67 @@
+import { ControlType, FilterOperator, PaginationType, TableSort } from '../../../generated/types';
+export type { TableSort };
+export type TableColumn = {
+    columns?: TableColumn[];
+    key: string;
+    label: string;
+    type?: "stack" | "text";
+    sortable?: boolean;
+    filter?: {
+        enabled?: boolean;
+        type?: ControlType;
+        operators?: FilterOperator[];
+        defaultOperator?: FilterOperator;
+    };
+    date?: {
+        format?: string | null;
+    };
+    copyable?: boolean;
+    link?: {
+        href?: string | null;
+        external?: boolean;
+    };
+};
+export type TableRow = Record<string, unknown>;
+export type FilterClause = {
+    field: string;
+    operator: FilterOperator;
+    value: string;
+};
+export type TableState = {
+    filters: FilterClause[];
+    sorts: TableSort[];
+    page: number;
+    perPage: number;
+};
+export type TablePagination = {
+    currentPage?: number;
+    hasMore?: boolean;
+    lastPage?: number;
+    mode?: PaginationType;
+    nextPage?: number | null;
+    perPage?: number;
+    total?: number;
+    from?: number | null;
+    to?: number | null;
+};
+export type TableResponse = {
+    data?: TableRow[];
+    pagination?: TablePagination;
+    state?: Partial<TableState>;
+};
+declare module '../../../core/types' {
+    interface ComponentProps {
+        table: {
+            bulkActions?: Array<Record<string, unknown>>;
+            columns?: TableColumn[];
+            data?: TableRow[];
+            endpoint?: string;
+            ref?: string;
+            lazy?: boolean;
+            layout?: string;
+            striped?: boolean;
+            pagination?: Record<string, unknown>;
+            state?: Record<string, unknown>;
+        };
+    }
+}

package/dist/table/use-table-selection.d.ts

@@ -0,0 +1,12 @@
+export declare function useTableSelection(keys: string[]): {
+    selectedKeys: string[];
+    allMatching: boolean;
+    allVisibleSelected: boolean;
+    allSelected: boolean;
+    active: boolean;
+    isSelected: (key: string) => boolean;
+    toggle: (key: string) => void;
+    toggleAll: () => void;
+    selectAllMatching: () => void;
+    clear: () => void;
+};

package/dist/table/use-table-selection.js

@@ -0,0 +1,46 @@
+import { useCallback, useEffect, useState } from "react";
+//#region resources/js/table/use-table-selection.ts
+function useTableSelection(keys) {
+	const [selected, setSelected] = useState(() => /* @__PURE__ */ new Set());
+	const [allMatching, setAllMatching] = useState(false);
+	useEffect(() => {
+		setSelected(/* @__PURE__ */ new Set());
+		setAllMatching(false);
+	}, [keys.join(" ")]);
+	const toggle = useCallback((key) => {
+		setAllMatching(false);
+		setSelected((current) => {
+			const next = new Set(current);
+			if (next.has(key)) next.delete(key);
+			else next.add(key);
+			return next;
+		});
+	}, []);
+	const toggleAll = useCallback(() => {
+		setAllMatching(false);
+		setSelected((current) => current.size === keys.length ? /* @__PURE__ */ new Set() : new Set(keys));
+	}, [keys]);
+	const selectAllMatching = useCallback(() => setAllMatching(true), []);
+	const clear = useCallback(() => {
+		setAllMatching(false);
+		setSelected(/* @__PURE__ */ new Set());
+	}, []);
+	const selectedKeys = keys.filter((key) => selected.has(key));
+	const allVisibleSelected = keys.length > 0 && selectedKeys.length === keys.length;
+	return {
+		selectedKeys,
+		allMatching,
+		allVisibleSelected,
+		allSelected: allMatching || allVisibleSelected,
+		active: allMatching || selectedKeys.length > 0,
+		isSelected: (key) => allMatching || selected.has(key),
+		toggle,
+		toggleAll,
+		selectAllMatching,
+		clear
+	};
+}
+//#endregion
+export { useTableSelection };
+
+//# sourceMappingURL=use-table-selection.js.map

package/dist/table/use-table-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-table-selection.js","names":[],"sources":["../../resources/js/table/use-table-selection.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from \"react\";\n\nexport function useTableSelection(keys: string[]) {\n  const [selected, setSelected] = useState<Set<string>>(() => new Set());\n  const [allMatching, setAllMatching] = useState(false);\n  const signature = keys.join(\" \");\n\n  useEffect(() => {\n    setSelected(new Set());\n    setAllMatching(false);\n  }, [signature]);\n\n  const toggle = useCallback((key: string): void => {\n    setAllMatching(false);\n    setSelected((current) => {\n      const next = new Set(current);\n\n      if (next.has(key)) {\n        next.delete(key);\n      } else {\n        next.add(key);\n      }\n\n      return next;\n    });\n  }, []);\n\n  const toggleAll = useCallback((): void => {\n    setAllMatching(false);\n    setSelected((current) => (current.size === keys.length ? new Set() : new Set(keys)));\n  }, [keys]);\n\n  const selectAllMatching = useCallback((): void => setAllMatching(true), []);\n\n  const clear = useCallback((): void => {\n    setAllMatching(false);\n    setSelected(new Set());\n  }, []);\n\n  const selectedKeys = keys.filter((key) => selected.has(key));\n  const allVisibleSelected = keys.length > 0 && selectedKeys.length === keys.length;\n\n  return {\n    selectedKeys,\n    allMatching,\n    allVisibleSelected,\n    allSelected: allMatching || allVisibleSelected,\n    active: allMatching || selectedKeys.length > 0,\n    isSelected: (key: string): boolean => allMatching || selected.has(key),\n    toggle,\n    toggleAll,\n    selectAllMatching,\n    clear,\n  };\n}\n"],"mappings":";;AAEA,SAAgB,kBAAkB,MAAgB;CAChD,MAAM,CAAC,UAAU,eAAe,+BAA4B,IAAI,IAAI,CAAC;CACrE,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAGpD,gBAAgB;EACd,4BAAY,IAAI,IAAI,CAAC;EACrB,eAAe,KAAK;CACtB,GAAG,CALe,KAAK,KAAK,GAKxB,CAAS,CAAC;CAEd,MAAM,SAAS,aAAa,QAAsB;EAChD,eAAe,KAAK;EACpB,aAAa,YAAY;GACvB,MAAM,OAAO,IAAI,IAAI,OAAO;GAE5B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;QAEf,KAAK,IAAI,GAAG;GAGd,OAAO;EACT,CAAC;CACH,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,kBAAwB;EACxC,eAAe,KAAK;EACpB,aAAa,YAAa,QAAQ,SAAS,KAAK,yBAAS,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,CAAE;CACrF,GAAG,CAAC,IAAI,CAAC;CAET,MAAM,oBAAoB,kBAAwB,eAAe,IAAI,GAAG,CAAC,CAAC;CAE1E,MAAM,QAAQ,kBAAwB;EACpC,eAAe,KAAK;EACpB,4BAAY,IAAI,IAAI,CAAC;CACvB,GAAG,CAAC,CAAC;CAEL,MAAM,eAAe,KAAK,QAAQ,QAAQ,SAAS,IAAI,GAAG,CAAC;CAC3D,MAAM,qBAAqB,KAAK,SAAS,KAAK,aAAa,WAAW,KAAK;CAE3E,OAAO;EACL;EACA;EACA;EACA,aAAa,eAAe;EAC5B,QAAQ,eAAe,aAAa,SAAS;EAC7C,aAAa,QAAyB,eAAe,SAAS,IAAI,GAAG;EACrE;EACA;EACA;EACA;CACF;AACF"}

package/dist/table/use-table.d.ts

@@ -0,0 +1,19 @@
+import { Node } from '../../../core/types';
+import { FilterClause, TableColumn, TableSort, TableState } from './types';
+export declare function useTable(node: Node<"table">): {
+    columns: TableColumn[];
+    rows: import('./types').TableRow[];
+    pagination: import('./types').TablePagination;
+    state: TableState;
+    filters: FilterClause[];
+    addFilter: (clause: FilterClause) => void;
+    updateFilter: (index: number, clause: FilterClause) => void;
+    removeFilter: (index: number) => void;
+    processing: boolean;
+    hasLoaded: boolean;
+    infiniteLoaderRef: import('react').RefObject<HTMLDivElement | null>;
+    sort: (column: TableColumn) => void;
+    clearSort: (sort: TableSort) => void;
+    goToPage: (page: number) => void;
+    loadMore: () => void;
+};