@krak-stack/registry 0.1.21 → 0.1.22

package/dist/components/ui/data-table.d.ts

@@ -1,20 +1,9 @@
 import { type ReactNode } from "react";
 import { type PaginationMessages } from "./pagination.js";
-import { type QueryType } from "../../lib/query.js";
+import type { QueryType } from "../../lib/query.js";
 type RowData = object;
-export type DataTableSorting = readonly {
-    id: string;
-    desc: boolean;
-}[];
-export type DataTablePaginationState = {
-    pageIndex: number;
-    pageSize: number;
-};
 export type DataTableView = "table" | "gallery";
-export interface DataTablePublicState {
-    globalFilter: string;
-    sorting: DataTableSorting;
-    pagination: DataTablePaginationState;
+export interface DataTableUiState {
     columnVisibility: Record<string, boolean>;
     columnSizing: Record<string, number>;
     rowSelection: Record<string, boolean>;
@@ -22,6 +11,7 @@ export interface DataTablePublicState {
     collapsedGroups: Record<string, boolean>;
     view: DataTableView;
 }
+export type DataTablePublicState = QueryType & DataTableUiState;
 export interface DataTableValueGetterParams<TData extends RowData> {
     data: TData;
     rowId: string;
@@ -241,11 +231,9 @@ export interface DataTableProps<TData extends RowData> {
     rowData: readonly TData[];
     columnDefs: readonly DataTableColDef<TData>[];
     getRowId?: (row: TData) => string;
-    state?: Partial<DataTablePublicState>;
+    state?: DataTablePublicState;
     initialState?: Partial<DataTablePublicState>;
     onStateChange?: (state: DataTablePublicState) => void;
-    query?: QueryType;
-    onQueryChange?: (query: QueryType) => void;
     status?: DataTableStatus;
     features?: DataTableFeatures<TData>;
     onRowClicked?: (row: TData) => void;
@@ -276,9 +264,8 @@ export declare const normalizeDataTableColumns: <TData extends RowData>(columnDe
 export declare const getDataTableWidth: <TData extends RowData>(columns: readonly DataTableColumn<TData>[], utilityColumns?: number) => number;
 export declare const buildDataTableRows: <TData extends RowData>(rowData: readonly TData[], columns: readonly DataTableColumn<TData>[], getRowId?: (row: TData) => string) => DataTableModelRow<TData>[];
 export declare const filterDataTableRows: <TData extends RowData>(rows: readonly DataTableModelRow<TData>[], columns: readonly DataTableColumn<TData>[], globalFilter: string) => DataTableModelRow<TData>[];
-export declare const sortDataTableRows: <TData extends RowData>(rows: readonly DataTableModelRow<TData>[], columns: readonly DataTableColumn<TData>[], sorting: DataTableSorting) => DataTableModelRow<TData>[];
-export declare const paginateDataTableRows: <TData extends RowData>(rows: readonly DataTableModelRow<TData>[], pagination: DataTablePaginationState) => DataTableModelRow<TData>[];
-export declare const mergeDataTableState: (state: DataTablePublicState, controlledState?: Partial<DataTablePublicState>) => DataTablePublicState;
+export declare const sortDataTableRows: <TData extends RowData>(rows: readonly DataTableModelRow<TData>[], columns: readonly DataTableColumn<TData>[], sorting: NonNullable<QueryType["sort"]>) => DataTableModelRow<TData>[];
+export declare const paginateDataTableRows: <TData extends RowData>(rows: readonly DataTableModelRow<TData>[], pagination: Pick<QueryType, "page" | "pageSize">) => DataTableModelRow<TData>[];
 export declare const reorderDataTableRows: <TData extends RowData>(rows: readonly DataTableModelRow<TData>[], sourceRowId: string, targetRowId: string) => TData[];
 type GroupSection<TData extends RowData> = {
     key: string;

package/dist/components/ui/data-table.js

@@ -1,6 +1,6 @@
 // ../../src/components/ui/data-table.tsx
 import { useAtom, useAtomSet } from "@effect/atom-react";
-import { Schema as Schema2 } from "effect";
+import { Schema } from "effect";
 import { Atom } from "effect/unstable/reactivity";
 import {
   ArrowDown,
@@ -1804,123 +1804,6 @@ function VirtualizedCombobox(props) {
   });
 }
 
-// ../../src/lib/query.ts
-import {
-  Effect,
-  Option,
-  Schema,
-  SchemaIssue,
-  SchemaTransformation
-} from "effect";
-var parseSortParam = (sort) => {
-  const id = sort.startsWith("-") ? sort.slice(1) : sort;
-  if (!id || id.includes(",") || id.includes(":")) {
-    return null;
-  }
-  return { id, direction: sort.startsWith("-") ? "desc" : "asc" };
-};
-var SortDirection = Schema.Union([
-  Schema.Literal("asc"),
-  Schema.Literal("desc")
-]).pipe(Schema.annotate({
-  identifier: "SortDirection",
-  title: "Sort Direction",
-  description: "Sort direction for list query results.",
-  examples: ["asc", "desc"]
-}));
-var SortParam = Schema.Struct({
-  id: Schema.NonEmptyString,
-  direction: SortDirection
-}).pipe(Schema.annotate({
-  identifier: "SortParam",
-  title: "Sort Parameter",
-  description: "Decoded sort parameter with a field id and direction.",
-  examples: [{ id: "publicName", direction: "asc" }]
-}));
-var SortParamFromString = Schema.String.pipe(Schema.decodeTo(SortParam, SchemaTransformation.transformOrFail({
-  decode: (sort) => {
-    const sortParam = parseSortParam(sort);
-    if (!sortParam) {
-      return Effect.fail(new SchemaIssue.InvalidValue(Option.some(sort), {
-        message: 'Expected sort in the format "field" or "-field"'
-      }));
-    }
-    return Effect.succeed(sortParam);
-  },
-  encode: (sort) => Effect.succeed(sort.direction === "desc" ? `-${sort.id}` : sort.id)
-})), Schema.annotate({
-  identifier: "SortParamFromString",
-  title: "Sort Parameter From String",
-  description: 'URL encoded single sort parameter where descending fields are prefixed with "-".',
-  examples: [{ id: "publicName", direction: "asc" }]
-}));
-var SortParamsFromString = Schema.String.pipe(Schema.decodeTo(Schema.Array(SortParam), SchemaTransformation.transformOrFail({
-  decode: (sort) => {
-    const parts = sort.split(",");
-    const sortParams = [];
-    for (const part of parts) {
-      const sortParam = parseSortParam(part);
-      if (!sortParam) {
-        return Effect.fail(new SchemaIssue.InvalidValue(Option.some(sort), {
-          message: 'Expected sort in the format "field,-otherField"'
-        }));
-      }
-      sortParams.push(sortParam);
-    }
-    return Effect.succeed(sortParams);
-  },
-  encode: (sort) => Effect.succeed(sort.map((part) => Schema.encodeSync(SortParamFromString)(part)).join(","))
-})), Schema.annotate({
-  identifier: "SortParamsFromString",
-  title: "Sort Parameters From String",
-  description: 'URL encoded sort parameters where descending fields are prefixed with "-" and multiple fields are comma-separated.',
-  examples: [
-    [
-      { id: "name", direction: "desc" },
-      { id: "age", direction: "asc" }
-    ]
-  ]
-}));
-var SortParamSearch = SortParamsFromString.pipe(Schema.decodeTo(Schema.String, SchemaTransformation.transform({
-  decode: (sort) => Schema.encodeSync(SortParamsFromString)(sort),
-  encode: (sort) => Schema.decodeUnknownSync(SortParamsFromString)(sort)
-})), Schema.annotate({
-  identifier: "SortParamSearch",
-  title: "Sort Search Parameter",
-  description: 'Search parameter sort value normalized to the compact "-field,otherField" URL format.',
-  examples: ["-name,age"]
-}));
-var Query = Schema.Struct({
-  page: Schema.Int.check(Schema.isGreaterThanOrEqualTo(0)).pipe(Schema.withDecodingDefaultKey(Effect.succeed(0))),
-  pageSize: Schema.Int.check(Schema.isBetween({ minimum: 1, maximum: 100 })).pipe(Schema.withDecodingDefaultKey(Effect.succeed(10))),
-  globalFilter: Schema.optional(Schema.String),
-  sort: Schema.optional(SortParamSearch)
-}).annotate({
-  identifier: "Query",
-  title: "Query",
-  description: "Zero-based page request parameters with optional filtering and sorting for list endpoints.",
-  examples: [
-    {
-      page: 0,
-      pageSize: 10,
-      globalFilter: "housing",
-      sort: "-publicName,createdAt"
-    }
-  ]
-});
-var QueryStandard = Schema.toStandardSchemaV1(Query);
-var PaginationMeta = Schema.Struct({
-  page: Schema.Int,
-  pageSize: Schema.Int,
-  total: Schema.Int,
-  pageCount: Schema.Int
-}).pipe(Schema.annotate({
-  identifier: "PaginationMeta",
-  title: "Pagination Metadata",
-  description: "Pagination metadata returned with a paginated list response.",
-  examples: [{ page: 0, pageSize: 10, total: 125, pageCount: 13 }]
-}));
-
 // ../../src/components/ui/data-table.tsx
 import { jsx as jsx17, jsxs as jsxs9, Fragment } from "react/jsx-runtime";
 var messages3 = {
@@ -1991,9 +1874,8 @@ var DEFAULT_MIN_WIDTH = 96;
 var DEFAULT_WIDTH = 208;
 var DEFAULT_MAX_WIDTH = 640;
 var DEFAULT_STATE = {
-  globalFilter: "",
-  sorting: [],
-  pagination: { pageIndex: 0, pageSize: 10 },
+  page: 0,
+  pageSize: 10,
   columnVisibility: {},
   columnSizing: {},
   rowSelection: {},
@@ -2056,9 +1938,9 @@ var sortDataTableRows = (rows, columns, sorting) => {
         continue;
       const leftValue = left.row.values.get(sort.id);
       const rightValue = right.row.values.get(sort.id);
-      const comparison = column.colDef.comparator ? column.colDef.comparator(leftValue, rightValue, left.row.data, right.row.data) : Object.is(leftValue, rightValue) ? 0 : leftValue === null || leftValue === undefined ? 1 : rightValue === null || rightValue === undefined ? -1 : Schema2.is(Schema2.Number)(leftValue) && Schema2.is(Schema2.Number)(rightValue) ? leftValue - rightValue : String(leftValue).localeCompare(String(rightValue), undefined, { numeric: true, sensitivity: "base" });
+      const comparison = column.colDef.comparator ? column.colDef.comparator(leftValue, rightValue, left.row.data, right.row.data) : Object.is(leftValue, rightValue) ? 0 : leftValue === null || leftValue === undefined ? 1 : rightValue === null || rightValue === undefined ? -1 : Schema.is(Schema.Number)(leftValue) && Schema.is(Schema.Number)(rightValue) ? leftValue - rightValue : String(leftValue).localeCompare(String(rightValue), undefined, { numeric: true, sensitivity: "base" });
       if (comparison !== 0)
-        return sort.desc ? -comparison : comparison;
+        return sort.direction === "desc" ? -comparison : comparison;
     }
     return left.stableIndex - right.stableIndex;
   }).map(({ row }) => row);
@@ -2066,22 +1948,11 @@ var sortDataTableRows = (rows, columns, sorting) => {
 var paginateDataTableRows = (rows, pagination) => {
   const pageSize = Math.max(1, pagination.pageSize);
   const lastPageIndex = Math.max(0, Math.ceil(rows.length / pageSize) - 1);
-  const pageIndex = Math.min(lastPageIndex, Math.max(0, pagination.pageIndex));
+  const pageIndex = Math.min(lastPageIndex, Math.max(0, pagination.page));
   const start = pageIndex * pageSize;
   return rows.slice(start, start + pageSize);
 };
-var mergeDataTableState = (state, controlledState = {}) => ({
-  globalFilter: controlledState.globalFilter ?? state.globalFilter,
-  sorting: controlledState.sorting ?? state.sorting,
-  pagination: controlledState.pagination ?? state.pagination,
-  columnVisibility: controlledState.columnVisibility ?? state.columnVisibility,
-  columnSizing: controlledState.columnSizing ?? state.columnSizing,
-  rowSelection: controlledState.rowSelection ?? state.rowSelection,
-  grouping: controlledState.grouping ?? state.grouping,
-  collapsedGroups: controlledState.collapsedGroups ?? state.collapsedGroups,
-  view: controlledState.view ?? state.view
-});
-var sameDataTableState = (left, right) => left.globalFilter === right.globalFilter && left.sorting === right.sorting && left.pagination === right.pagination && left.columnVisibility === right.columnVisibility && left.columnSizing === right.columnSizing && left.rowSelection === right.rowSelection && left.grouping === right.grouping && left.collapsedGroups === right.collapsedGroups && left.view === right.view;
+var sameDataTableState = (left, right) => left.page === right.page && left.pageSize === right.pageSize && left.globalFilter === right.globalFilter && left.sort === right.sort && left.columnVisibility === right.columnVisibility && left.columnSizing === right.columnSizing && left.rowSelection === right.rowSelection && left.grouping === right.grouping && left.collapsedGroups === right.collapsedGroups && left.view === right.view;
 var reorderDataTableRows = (rows, sourceRowId, targetRowId) => {
   const sourceIndex = rows.findIndex((row) => row.id === sourceRowId);
   const targetIndex = rows.findIndex((row) => row.id === targetRowId);
@@ -2136,7 +2007,6 @@ var resolveConfig = (props) => {
   }
   return {
     getRowId,
-    onQueryChange: props.onQueryChange,
     onStateChange: props.onStateChange,
     status: props.status ?? {},
     features,
@@ -2144,36 +2014,13 @@ var resolveConfig = (props) => {
     labels: dataTableMessages(props.messages)
   };
 };
-var dataTableStateFromQuery = (query) => query ? {
-  globalFilter: query.globalFilter ?? "",
-  sorting: query.sort ? Schema2.decodeSync(SortParamsFromString)(query.sort).map(({ id, direction }) => ({
-    id,
-    desc: direction === "desc"
-  })) : [],
-  pagination: { pageIndex: query.page, pageSize: query.pageSize }
-} : {};
-var queryFromDataTableState = (state) => ({
-  page: state.pagination.pageIndex,
-  pageSize: state.pagination.pageSize,
-  globalFilter: state.globalFilter || undefined,
-  sort: state.sorting.length ? Schema2.encodeSync(SortParamsFromString)(state.sorting.map(({ id, desc }) => ({
-    id,
-    direction: desc ? "desc" : "asc"
-  }))) : undefined
-});
-var sameQuery = (left, right) => left.page === right.page && left.pageSize === right.pageSize && left.globalFilter === right.globalFilter && left.sort === right.sort;
-var controlledStateFromProps = (query, state) => ({
-  ...dataTableStateFromQuery(query),
-  ...state
-});
 var initialPublicState = (props) => {
   const grouping = props.features?.grouping;
   const groupingInitial = grouping && grouping.initial ? grouping.initial : [];
-  return {
+  return props.state ?? {
     ...DEFAULT_STATE,
     grouping: groupingInitial,
-    ...props.initialState,
-    ...controlledStateFromProps(props.query, props.state)
+    ...props.initialState
   };
 };
 var buildDataTableModel = (store) => {
@@ -2183,9 +2030,9 @@ var buildDataTableModel = (store) => {
   const rows = buildDataTableRows(store.rowData, columns, rowId);
   const pagination = store.config.features.pagination ?? { mode: "client" };
   const server = pagination !== false && pagination.mode === "server";
-  const filteredRows = server ? [...rows] : filterDataTableRows(rows, columns, store.state.globalFilter);
-  const sortedRows = server ? filteredRows : sortDataTableRows(filteredRows, columns, store.state.sorting);
-  const pageRows = pagination === false || server ? sortedRows : paginateDataTableRows(sortedRows, store.state.pagination);
+  const filteredRows = server ? [...rows] : filterDataTableRows(rows, columns, store.state.globalFilter ?? "");
+  const sortedRows = server ? filteredRows : sortDataTableRows(filteredRows, columns, store.state.sort ?? []);
+  const pageRows = pagination === false || server ? sortedRows : paginateDataTableRows(sortedRows, store.state);
   const totalRows = server ? pagination.rowCount : sortedRows.length;
   return {
     columns,
@@ -2194,7 +2041,7 @@ var buildDataTableModel = (store) => {
     filteredRows,
     sortedRows,
     pageRows,
-    pageCount: Math.max(1, Math.ceil(totalRows / Math.max(1, store.state.pagination.pageSize))),
+    pageCount: Math.max(1, Math.ceil(totalRows / Math.max(1, store.state.pageSize))),
     totalRows
   };
 };
@@ -2202,13 +2049,8 @@ var useTableAtom = (tableAtom) => useAtom(tableAtom);
 var changeState = (setStore, update) => {
   setStore((store) => {
     const proposed = update(store.state);
-    const previousQuery = queryFromDataTableState(store.state);
-    const nextQuery = queryFromDataTableState(proposed);
-    if (!sameQuery(previousQuery, nextQuery)) {
-      store.config.onQueryChange?.(nextQuery);
-    }
     store.config.onStateChange?.(proposed);
-    const state = mergeDataTableState(proposed, store.controlledState);
+    const state = store.controlledState ?? proposed;
     if (sameDataTableState(state, store.state))
       return store;
     const next = { ...store, state };
@@ -2253,7 +2095,7 @@ var getActiveGrouping = (store) => {
 };
 var canReorderRows = (store) => {
   const pagination = store.config.features.pagination;
-  return !!store.config.features.reordering && !getActiveGrouping(store).length && !store.state.globalFilter && !store.state.sorting.length && !(pagination && pagination.mode === "server");
+  return !!store.config.features.reordering && !getActiveGrouping(store).length && !store.state.globalFilter && !store.state.sort?.length && !(pagination && pagination.mode === "server");
 };
 var canMoveRowsToGroups = (store) => getActiveGrouping(store).some((field) => !!field.onMoveToGroup);
 var canDragRows = (store) => getActiveGrouping(store).length ? canMoveRowsToGroups(store) : canReorderRows(store);
@@ -2276,11 +2118,11 @@ var renderCell = (row, column) => {
   return column.colDef.valueFormatter?.(params) ?? (value === null || value === undefined ? null : String(value));
 };
 var nodeText = (node) => {
-  if (Schema2.is(Schema2.String)(node) || Schema2.is(Schema2.Number)(node))
+  if (Schema.is(Schema.String)(node) || Schema.is(Schema.Number)(node))
     return String(node);
   if (!isValidElement(node))
     return "";
-  if (Schema2.is(Schema2.String)(node.props.title))
+  if (Schema.is(Schema.String)(node.props.title))
     return node.props.title;
   return nodeText(node.props.children);
 };
@@ -2427,18 +2269,18 @@ var DataTableToolbar = ({
             onChange: (event) => update((state) => ({
               ...state,
               globalFilter: event.target.value,
-              pagination: { ...state.pagination, pageIndex: 0 }
+              page: 0
             })),
             placeholder: labels2.filter,
-            value: store.state.globalFilter
+            value: store.state.globalFilter ?? ""
           }),
           store.state.globalFilter ? /* @__PURE__ */ jsx17(Button, {
             "aria-label": labels2.filter,
             className: "absolute top-1/2 right-1 size-7 -translate-y-1/2",
             onClick: () => update((state) => ({
               ...state,
-              globalFilter: "",
-              pagination: { ...state.pagination, pageIndex: 0 }
+              globalFilter: undefined,
+              page: 0
             })),
             size: "icon",
             variant: "ghost",
@@ -2597,18 +2439,18 @@ var SortMenu = ({
   const columns = deriveModel(store).columns.filter(({ colDef }) => colDef.sortable !== false);
   if (!columns.length)
     return null;
-  const current = store.state.sorting[0];
-  const sort = (id, desc) => changeState(setStore, (state) => ({
+  const current = store.state.sort?.[0];
+  const sort = (id, direction) => changeState(setStore, (state) => ({
     ...state,
-    sorting: [{ id, desc }],
-    pagination: { ...state.pagination, pageIndex: 0 }
+    sort: [{ id, direction }],
+    page: 0
   }));
   return /* @__PURE__ */ jsxs9(MenubarMenu, {
     children: [
       /* @__PURE__ */ jsxs9(MenubarTrigger, {
         "aria-label": store.config.labels.sortBy,
         children: [
-          current ? current.desc ? /* @__PURE__ */ jsx17(ArrowDown, {}) : /* @__PURE__ */ jsx17(ArrowUp, {}) : /* @__PURE__ */ jsx17(ChevronsUpDown2, {}),
+          current ? current.direction === "desc" ? /* @__PURE__ */ jsx17(ArrowDown, {}) : /* @__PURE__ */ jsx17(ArrowUp, {}) : /* @__PURE__ */ jsx17(ChevronsUpDown2, {}),
           /* @__PURE__ */ jsx17("span", {
             className: "hidden sm:inline",
             children: store.config.labels.sortBy
@@ -2619,19 +2461,19 @@ var SortMenu = ({
         align: "end",
         className: "w-52",
         children: columns.map((column) => {
-          const sortState = store.state.sorting.find(({ id }) => id === column.id);
+          const sortState = store.state.sort?.find(({ id }) => id === column.id);
           return /* @__PURE__ */ jsxs9(MenubarSub, {
             children: [
               /* @__PURE__ */ jsxs9(MenubarSubTrigger, {
                 children: [
-                  sortState ? sortState.desc ? /* @__PURE__ */ jsx17(ArrowDown, {}) : /* @__PURE__ */ jsx17(ArrowUp, {}) : null,
+                  sortState ? sortState.direction === "desc" ? /* @__PURE__ */ jsx17(ArrowDown, {}) : /* @__PURE__ */ jsx17(ArrowUp, {}) : null,
                   columnLabel(column)
                 ]
               }),
               /* @__PURE__ */ jsxs9(MenubarSubContent, {
                 children: [
                   /* @__PURE__ */ jsxs9(MenubarItem, {
-                    onClick: () => sort(column.id, false),
+                    onClick: () => sort(column.id, "asc"),
                     children: [
                       /* @__PURE__ */ jsx17(ArrowUp, {}),
                       " ",
@@ -2639,7 +2481,7 @@ var SortMenu = ({
                     ]
                   }),
                   /* @__PURE__ */ jsxs9(MenubarItem, {
-                    onClick: () => sort(column.id, true),
+                    onClick: () => sort(column.id, "desc"),
                     children: [
                       /* @__PURE__ */ jsx17(ArrowDown, {}),
                       " ",
@@ -2652,7 +2494,7 @@ var SortMenu = ({
                       /* @__PURE__ */ jsxs9(MenubarItem, {
                         onClick: () => changeState(setStore, (state) => ({
                           ...state,
-                          sorting: state.sorting.filter(({ id }) => id !== column.id)
+                          sort: state.sort?.filter(({ id }) => id !== column.id)
                         })),
                         children: [
                           /* @__PURE__ */ jsx17(X2, {}),
@@ -3143,12 +2985,12 @@ var ColumnHeaderMenu = ({
     return null;
   const sortingEnabled = store.config.features.sorting !== false && column.colDef.sortable !== false;
   const hidingEnabled = store.config.features.columnVisibility !== false && column.colDef.hideable !== false;
-  const sort = store.state.sorting.find(({ id }) => id === column.id);
+  const sort = store.state.sort?.find(({ id }) => id === column.id);
   const update = (next) => changeState(setStore, next);
-  const setSort = (desc) => update((state) => ({
+  const setSort = (direction) => update((state) => ({
     ...state,
-    sorting: [{ id: column.id, desc }],
-    pagination: { ...state.pagination, pageIndex: 0 }
+    sort: [{ id: column.id, direction }],
+    page: 0
   }));
   const label = columnLabel(column);
   if (!sortingEnabled && !hidingEnabled) {
@@ -3170,7 +3012,7 @@ var ColumnHeaderMenu = ({
               className: "truncate",
               children: column.colDef.headerName
             }),
-            sort ? sort.desc ? /* @__PURE__ */ jsx17(ArrowDown, {}) : /* @__PURE__ */ jsx17(ArrowUp, {}) : sortingEnabled ? /* @__PURE__ */ jsx17(ChevronsUpDown2, {}) : null
+            sort ? sort.direction === "desc" ? /* @__PURE__ */ jsx17(ArrowDown, {}) : /* @__PURE__ */ jsx17(ArrowUp, {}) : sortingEnabled ? /* @__PURE__ */ jsx17(ChevronsUpDown2, {}) : null
           ]
         })
       }),
@@ -3182,7 +3024,7 @@ var ColumnHeaderMenu = ({
             sortingEnabled ? /* @__PURE__ */ jsxs9(Fragment, {
               children: [
                 /* @__PURE__ */ jsxs9(DropdownMenuItem, {
-                  onClick: () => setSort(false),
+                  onClick: () => setSort("asc"),
                   children: [
                     /* @__PURE__ */ jsx17(ArrowUp, {}),
                     " ",
@@ -3190,7 +3032,7 @@ var ColumnHeaderMenu = ({
                   ]
                 }),
                 /* @__PURE__ */ jsxs9(DropdownMenuItem, {
-                  onClick: () => setSort(true),
+                  onClick: () => setSort("desc"),
                   children: [
                     /* @__PURE__ */ jsx17(ArrowDown, {}),
                     " ",
@@ -3200,7 +3042,7 @@ var ColumnHeaderMenu = ({
                 sort ? /* @__PURE__ */ jsxs9(DropdownMenuItem, {
                   onClick: () => update((state) => ({
                     ...state,
-                    sorting: state.sorting.filter(({ id }) => id !== column.id)
+                    sort: state.sort?.filter(({ id }) => id !== column.id)
                   })),
                   children: [
                     /* @__PURE__ */ jsx17(X2, {}),
@@ -3505,29 +3347,29 @@ var DataTablePagination = ({
   const pagination = store.config.features.pagination ?? { mode: "client" };
   const clientGrouping = pagination !== false && pagination.mode === "client" && getActiveGrouping(store).length > 0;
   const paginationVisible = pagination !== false && !clientGrouping;
-  const pageIndex = store.state.pagination.pageIndex;
+  const pageIndex = store.state.page;
   const maxPageIndex = model.pageCount - 1;
   useLayoutEffect(() => {
     if (paginationVisible && pageIndex > maxPageIndex) {
       changeState(setStore, (state) => ({
         ...state,
-        pagination: { ...state.pagination, pageIndex: maxPageIndex }
+        page: maxPageIndex
       }));
     }
   }, [maxPageIndex, pageIndex, paginationVisible, setStore]);
   if (!paginationVisible)
     return null;
   const selected = model.rows.filter((row) => store.state.rowSelection[row.id]).length;
-  const setPagination = (next) => changeState(setStore, (state) => ({ ...state, pagination: next }));
+  const setPagination = (next) => changeState(setStore, (state) => ({ ...state, ...next }));
   return /* @__PURE__ */ jsx17("div", {
     className: "pt-4",
     children: /* @__PURE__ */ jsx17(Pagination, {
       messages: store.config.labels,
-      onPageChange: (pageIndex2) => setPagination({ ...store.state.pagination, pageIndex: pageIndex2 }),
-      onPageSizeChange: (pageSize) => setPagination({ pageIndex: 0, pageSize }),
-      page: Math.min(store.state.pagination.pageIndex, model.pageCount - 1),
+      onPageChange: (page) => setPagination({ page, pageSize: store.state.pageSize }),
+      onPageSizeChange: (pageSize) => setPagination({ page: 0, pageSize }),
+      page: Math.min(store.state.page, model.pageCount - 1),
       pageCount: model.pageCount,
-      pageSize: store.state.pagination.pageSize,
+      pageSize: store.state.pageSize,
       pageSizes: pagination.pageSizes,
       selectedRows: selected,
       totalRows: model.totalRows
@@ -3543,7 +3385,7 @@ var DataTable = (props) => {
       columnDefs: props.columnDefs,
       config: validatedConfig,
       state: initialPublicState(props),
-      controlledState: controlledStateFromProps(props.query, props.state)
+      controlledState: props.state
     };
     atomRef.current = Atom.make({
       ...initial,
@@ -3558,22 +3400,20 @@ var DataTable = (props) => {
       const selection = features.selection;
       const config = {
         getRowId: selection && selection.getRowId || props.getRowId || undefined,
-        onQueryChange: props.onQueryChange,
         onStateChange: props.onStateChange,
         status: props.status ?? {},
         features,
         onRowClicked: props.onRowClicked,
         labels: dataTableMessages(props.messages)
       };
-      const controlledState = controlledStateFromProps(props.query, props.state);
-      const state = mergeDataTableState(store.state, controlledState);
+      const state = props.state ?? store.state;
       const modelChanged = store.rowData !== props.rowData || store.columnDefs !== props.columnDefs || !sameDataTableState(store.state, state) || store.config.getRowId !== config.getRowId || store.config.features.pagination !== config.features.pagination;
       const next = {
         ...store,
         rowData: props.rowData,
         columnDefs: props.columnDefs,
         config,
-        controlledState,
+        controlledState: props.state,
         state
       };
       return modelChanged ? { ...next, model: buildDataTableModel(next) } : next;
@@ -3584,9 +3424,7 @@ var DataTable = (props) => {
     props.getRowId,
     props.messages,
     props.onRowClicked,
-    props.onQueryChange,
     props.onStateChange,
-    props.query,
     props.rowData,
     props.state,
     props.status,
@@ -3690,7 +3528,7 @@ var DataTableListSummary = ({
   visibleCount = 3
 }) => {
   const labels2 = dataTableMessages();
-  const normalized = items.map((item) => Schema2.is(Schema2.String)(item) ? { label: item } : item);
+  const normalized = items.map((item) => Schema.is(Schema.String)(item) ? { label: item } : item);
   if (!normalized.length)
     return /* @__PURE__ */ jsx17("span", {
       className: "text-muted-foreground",
@@ -3789,7 +3627,6 @@ export {
   getDataTableSelectableRows,
   getDataTableWidth,
   groupDataTableRows,
-  mergeDataTableState,
   normalizeDataTableColumns,
   paginateDataTableRows,
   reorderDataTableRows,

package/dist/lib/query.d.ts

@@ -25,12 +25,13 @@ export declare const Query: Schema.Struct<{
     readonly page: Schema.withDecodingDefaultKey<Schema.Int, never>;
     readonly pageSize: Schema.withDecodingDefaultKey<Schema.Int, never>;
     readonly globalFilter: Schema.optional<Schema.String>;
-    readonly sort: Schema.optional<Schema.decodeTo<Schema.String, Schema.decodeTo<Schema.$Array<Schema.Struct<{
+    readonly sort: Schema.optional<Schema.decodeTo<Schema.$Array<Schema.Struct<{
         readonly id: Schema.NonEmptyString;
         readonly direction: Schema.Union<readonly [Schema.Literal<"asc">, Schema.Literal<"desc">]>;
-    }>>, Schema.String, never, never>, never, never>>;
+    }>>, Schema.String, never, never>>;
 }>;
 export type QueryType = typeof Query.Type;
+export type QueryEncoded = typeof Query.Encoded;
 export declare const QueryStandard: ReturnType<typeof Schema.toStandardSchemaV1<typeof Query>>;
 export declare const PaginationMeta: Schema.Struct<{
     readonly page: Schema.Int;

package/dist/lib/query.js

@@ -75,20 +75,11 @@ var SortParamsFromString = Schema.String.pipe(Schema.decodeTo(Schema.Array(SortP
     ]
   ]
 }));
-var SortParamSearch = SortParamsFromString.pipe(Schema.decodeTo(Schema.String, SchemaTransformation.transform({
-  decode: (sort) => Schema.encodeSync(SortParamsFromString)(sort),
-  encode: (sort) => Schema.decodeUnknownSync(SortParamsFromString)(sort)
-})), Schema.annotate({
-  identifier: "SortParamSearch",
-  title: "Sort Search Parameter",
-  description: 'Search parameter sort value normalized to the compact "-field,otherField" URL format.',
-  examples: ["-name,age"]
-}));
 var Query = Schema.Struct({
   page: Schema.Int.check(Schema.isGreaterThanOrEqualTo(0)).pipe(Schema.withDecodingDefaultKey(Effect.succeed(0))),
   pageSize: Schema.Int.check(Schema.isBetween({ minimum: 1, maximum: 100 })).pipe(Schema.withDecodingDefaultKey(Effect.succeed(10))),
   globalFilter: Schema.optional(Schema.String),
-  sort: Schema.optional(SortParamSearch)
+  sort: Schema.optional(SortParamsFromString)
 }).annotate({
   identifier: "Query",
   title: "Query",
@@ -98,7 +89,10 @@ var Query = Schema.Struct({
       page: 0,
       pageSize: 10,
       globalFilter: "housing",
-      sort: "-publicName,createdAt"
+      sort: [
+        { id: "publicName", direction: "desc" },
+        { id: "createdAt", direction: "asc" }
+      ]
     }
   ]
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@krak-stack/registry",
-  "version": "0.1.21",
+  "version": "0.1.22",
   "description": "Tree-shakable KrakStack components and Effect services.",
   "license": "MIT",
   "repository": {