@cube-dev/ui-kit 0.187.1 → 0.188.0

package/dist/components/data/TableBase/column-menu.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { __Menu } from "../../actions/Menu/Menu.js";
 import { normalizeMenuAction } from "./row-menu.js";
 import { Children, cloneElement, isValidElement } from "react";

package/dist/components/data/TableBase/column-styles.js

@@ -0,0 +1,82 @@
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
+import { computeStyles, resolveRecipes } from "@tenphi/tasty";
+
+//#region src/components/data/TableBase/column-styles.ts
+/**
+* The table paints every body cell from its root, through
+* `> Scroller > Table > Body > Row > Cell`: the root's doubled class plus five
+* `[data-element]` attributes, a specificity of (0,7,0). Tasty wraps every state
+* in `:where()`, so that chain is the whole of it, tint branches and the
+* consumer's table-level `cellStyles` included.
+*
+* A column's class is doubled as well, (0,2,0), and would lose every property
+* the table also sets (`color`, `fill`, `padding`…). Six more attribute
+* selectors take it to (0,8,0), so the column wins outright whichever of the
+* two rules was injected first. If the `Cell` chain in `styled.ts` ever grows,
+* this has to grow with it. `DataTable.browser.test.tsx` checks the cascade.
+*/
+const SELF = `&${`[data-column-styles]`.repeat(6)}`;
+/**
+* The wrapper per consumer object, so an object-form `cellStyles` (or a
+* function that returns a shared constant) is serialized once rather than on
+* every cell of every render.
+*/
+const WRAPPED = /* @__PURE__ */ new WeakMap();
+/**
+* Keys tasty reads only from the top level of the object handed to
+* `computeStyles`: the at-rule definitions it registers next to the class.
+* Left inside `ColumnCell`, a `@keyframes` block would never be registered and
+* the cell's `animation` would name nothing, so these stay at the top.
+*/
+const TOP_LEVEL_KEYS = [
+	"@keyframes",
+	"@property",
+	"@font-face",
+	"@counter-style",
+	"@function"
+];
+function wrap(styles) {
+	let wrapped = WRAPPED.get(styles);
+	if (!wrapped) {
+		const cell = {
+			...resolveRecipes(styles),
+			$: SELF
+		};
+		const top = {};
+		for (const key of TOP_LEVEL_KEYS) if (key in cell) {
+			top[key] = cell[key];
+			delete cell[key];
+		}
+		wrapped = {
+			...top,
+			ColumnCell: cell
+		};
+		WRAPPED.set(styles, wrapped);
+	}
+	return wrapped;
+}
+/**
+* A column's `cellStyles`, resolved through tasty into a class for the cell.
+*
+* Tasty keys a class on the CONTENT of the styles, not on the object, so every
+* cell with equal styles shares one class and one set of rules, and a function
+* that returns a handful of distinct objects produces a handful of classes —
+* however many cells, and however many fresh objects, it returns them as. After
+* the first cell, a lookup costs a small serialization and a map hit; the CSS
+* is built once.
+*
+* The styles land on the cell itself, so a bare state key in them (`hovered`,
+* `:hover`, a local `@state`) asks about the cell. That is NOT how `styles.Cell`
+* reads one: a sub-element's bare keys resolve against the table root, so a map
+* copied from the table-level `cellStyles` that keys on `shape=card` or
+* `column-dividers` matches nothing here. `@own(...)` asks about the cell in
+* both places.
+*/
+function columnCellClassName(styles) {
+	if (!styles || Object.keys(styles).length === 0) return void 0;
+	return computeStyles(wrap(styles)).className || void 0;
+}
+
+//#endregion
+export { columnCellClassName };
+//# sourceMappingURL=column-styles.js.map

package/dist/components/data/TableBase/column-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column-styles.js","names":["computeStyles","resolveRecipes","Styles","COLUMN_STYLES_ATTR","SELF","repeat","WRAPPED","WeakMap","TOP_LEVEL_KEYS","const","wrap","styles","wrapped","get","cell","Record","$","top","key","ColumnCell","set","columnCellClassName","Object","keys","length","undefined","className"],"sources":["../../../../src/components/data/TableBase/column-styles.ts"],"sourcesContent":["import { computeStyles, resolveRecipes } from '@tenphi/tasty';\n\nimport type { Styles } from '@tenphi/tasty';\n\n/**\n * Stamped on a body cell that carries a column's own `cellStyles` class, by\n * `TableView`. The class's rule is anchored on it, see `SELF`.\n */\nconst COLUMN_STYLES_ATTR = 'data-column-styles';\n\n/**\n * The table paints every body cell from its root, through\n * `> Scroller > Table > Body > Row > Cell`: the root's doubled class plus five\n * `[data-element]` attributes, a specificity of (0,7,0). Tasty wraps every state\n * in `:where()`, so that chain is the whole of it, tint branches and the\n * consumer's table-level `cellStyles` included.\n *\n * A column's class is doubled as well, (0,2,0), and would lose every property\n * the table also sets (`color`, `fill`, `padding`…). Six more attribute\n * selectors take it to (0,8,0), so the column wins outright whichever of the\n * two rules was injected first. If the `Cell` chain in `styled.ts` ever grows,\n * this has to grow with it. `DataTable.browser.test.tsx` checks the cascade.\n */\nconst SELF = `&${`[${COLUMN_STYLES_ATTR}]`.repeat(6)}`;\n\n/**\n * The wrapper per consumer object, so an object-form `cellStyles` (or a\n * function that returns a shared constant) is serialized once rather than on\n * every cell of every render.\n */\nconst WRAPPED = new WeakMap<Styles, Styles>();\n\n/**\n * Keys tasty reads only from the top level of the object handed to\n * `computeStyles`: the at-rule definitions it registers next to the class.\n * Left inside `ColumnCell`, a `@keyframes` block would never be registered and\n * the cell's `animation` would name nothing, so these stay at the top.\n */\nconst TOP_LEVEL_KEYS = [\n  '@keyframes',\n  '@property',\n  '@font-face',\n  '@counter-style',\n  '@function',\n] as const;\n\nfunction wrap(styles: Styles): Styles {\n  let wrapped = WRAPPED.get(styles);\n\n  if (!wrapped) {\n    // Recipes resolve only at the top level of a style object, so they are\n    // expanded before the styles move one level down.\n    const cell: Record<string, unknown> = {\n      ...resolveRecipes(styles),\n      $: SELF,\n    };\n    const top: Record<string, unknown> = {};\n\n    for (const key of TOP_LEVEL_KEYS) {\n      if (key in cell) {\n        top[key] = cell[key];\n        delete cell[key];\n      }\n    }\n\n    wrapped = { ...top, ColumnCell: cell } as Styles;\n    WRAPPED.set(styles, wrapped);\n  }\n\n  return wrapped;\n}\n\n/**\n * A column's `cellStyles`, resolved through tasty into a class for the cell.\n *\n * Tasty keys a class on the CONTENT of the styles, not on the object, so every\n * cell with equal styles shares one class and one set of rules, and a function\n * that returns a handful of distinct objects produces a handful of classes —\n * however many cells, and however many fresh objects, it returns them as. After\n * the first cell, a lookup costs a small serialization and a map hit; the CSS\n * is built once.\n *\n * The styles land on the cell itself, so a bare state key in them (`hovered`,\n * `:hover`, a local `@state`) asks about the cell. That is NOT how `styles.Cell`\n * reads one: a sub-element's bare keys resolve against the table root, so a map\n * copied from the table-level `cellStyles` that keys on `shape=card` or\n * `column-dividers` matches nothing here. `@own(...)` asks about the cell in\n * both places.\n */\nexport function columnCellClassName(\n  styles: Styles | null | undefined,\n): string | undefined {\n  if (!styles || Object.keys(styles).length === 0) return undefined;\n\n  return computeStyles(wrap(styles)).className || undefined;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAuBA,MAAMI,OAAO,IAAI,uBAA0BC,OAAO,EAAE;;;;;;AAOpD,MAAMC,0BAAU,IAAIC,SAAyB;;;;;;;AAQ7C,MAAMC,iBAAiB;CACrB;CACA;CACA;CACA;CACA;CACD;AAED,SAASE,KAAKC,QAAwB;CACpC,IAAIC,UAAUN,QAAQO,IAAIF,OAAO;AAEjC,KAAI,CAACC,SAAS;EAGZ,MAAME,OAAgC;GACpC,GAAGb,eAAeU,OAAO;GACzBK,GAAGZ;GACJ;EACD,MAAMa,MAA+B,EAAE;AAEvC,OAAK,MAAMC,OAAOV,eAChB,KAAIU,OAAOJ,MAAM;AACfG,OAAIC,OAAOJ,KAAKI;AAChB,UAAOJ,KAAKI;;AAIhBN,YAAU;GAAE,GAAGK;GAAKE,YAAYL;GAAM;AACtCR,UAAQc,IAAIT,QAAQC,QAAQ;;AAG9B,QAAOA;;;;;;;;;;;;;;;;;;;AAoBT,SAAgBS,oBACdV,QACoB;AACpB,KAAI,CAACA,UAAUW,OAAOC,KAAKZ,OAAO,CAACa,WAAW,EAAG,QAAOC;AAExD,QAAOzB,cAAcU,KAAKC,OAAO,CAAC,CAACe,aAAaD"}

package/dist/components/data/TableBase/column-tint.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { getPaletteConfig } from "../../../tokens/palette-config.js";
 import { hashString } from "../../../tokens/color-theme.js";
 

package/dist/components/data/TableBase/row-menu.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { Children, Fragment, isValidElement } from "react";
 
 //#region src/components/data/TableBase/row-menu.ts

package/dist/components/data/TableBase/styled.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { _Item } from "../../content/Item/Item.js";
 import { Action } from "../../actions/Action/Action.js";
 import { keyframes, tasty } from "@tenphi/tasty";

package/dist/components/data/TableBase/table-tree.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 //#region src/components/data/TableBase/table-tree.ts
 /** Build identity and parent/child indexes without modifying consumer rows. */
 function buildTableTree(rows, getChildren, getKey) {

package/dist/components/data/TableBase/types.d.ts

@@ -244,6 +244,17 @@ interface CubeTableColumn<T = any> {
   compare?: (a: any, b: any, rowA: T, rowB: T) => number;
   /** A returned string is wrapped in a truncating `TextItem`. */
   render?: (value: any, row: T, rowIndex: number, ctx: CubeTableCellContext<T>) => ReactNode;
+  /**
+   * Tasty styles for this column's body cells: tokens (`#surface-text-soft-2`),
+   * units, presets, recipes and state maps all work, and a state key asks about
+   * the cell itself (`@own(pinned=bottom)`). They win over the table's own cell
+   * paint, its column tint and the table-level `cellStyles`.
+   *
+   * The function form runs per cell, so it can vary with `ctx` (the row, its
+   * section, its selection). Cells whose styles are equal share one class, so a
+   * function returning a few distinct objects costs a few classes, not one per
+   * cell.
+   */
   cellStyles?: Styles | ((ctx: CubeTableCellContext<T>) => Styles | undefined);
   cellProps?: (ctx: CubeTableCellContext<T>) => Record<string, any> | undefined;
   /**

package/dist/components/data/TableBase/types.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 //#region src/components/data/TableBase/types.ts
 /**
 * `asc | desc` rather than React Aria's `ascending | descending`: we do not use

package/dist/components/data/TableBase/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["Key","Styles","ReactNode","CubeItemProps","CubeTableSortDirection","CubeTableRowSize","CubeTableAlign","CubeTableRowSection","selectionRowKey","section","rowKey","CubeTableCellRange","fromRowKey","toRowKey","fromColumnKey","toColumnKey","CubeTableTreeRowState","level","parentKey","hasChildren","isExpanded","CubeTableRowExpandInfo","row","T","expanded","CubeTableLayoutProps","isAutoHeight","CubeTableTreeProps","getRowChildren","treeColumnKey","expandedKeys","defaultExpandedKeys","onExpand","keys","info","CubeTableSort","columnKey","direction","CubeTableCellContext","rowIndex","columnIndex","isSelected","isRowFocused","isDropTarget","tree","CubeTableRowContext","isFocused","CubeTableHeaderContext","sort","isSortable","isResizing","width","CubeTableColumnGroupHeader","key","title","CubeTableColumnHeader","icon","rightIcon","prefix","suffix","description","descriptionPlacement","tooltip","actions","autoHideActions","menu","menuTriggerProps","Record","menuProps","onMenuAction","action","theme","render","ctx","align","styles","CubeTableColumnTheme","CubeTableColumnColor","hue","saturation","fill","fillBand","text","CubeTableColumnColorScope","CubeTableColumn","header","isRowHeader","flex","minWidth","maxWidth","isResizable","isReorderable","pin","isHidden","getValue","format","value","compare","a","b","rowA","rowB","cellStyles","cellProps","color","colorScope","disallowSortRemoval","isSearchable","isCopyable","autoHeight","meta","CubeResolvedColumn","Omit","index","ariaColIndex","pinOffset","isPinEdge","isStructural","CubeTableColumnLayout","columns","pinnedStartWidth","pinnedEndWidth","totalWidth","isOverflowing","CubeTableLoadingIndicator","CubeTableSelectionMode","CubeTableSelectAllMode"],"sources":["../../../../src/components/data/TableBase/types.ts"],"sourcesContent":["import type { Key } from '@react-types/shared';\nimport type { Styles } from '@tenphi/tasty';\nimport type { ReactNode } from 'react';\nimport type { CubeItemProps } from '../../content/Item';\n\nexport type CubeTableSortDirection = 'asc' | 'desc';\n/**\n * Named row heights: 28px, 32px and 40px.\n *\n * A subset of the kit's size scale, and the same three steps `size` would give —\n * but `rowSize` moves only the ROWS. `size` also drives the header, so reaching\n * for a denser body through it drags the header down too.\n */\nexport type CubeTableRowSize = 'small' | 'medium' | 'large';\nexport type CubeTableAlign = 'start' | 'center' | 'end';\nexport type CubeTableRowSection = 'body' | 'pinnedTop' | 'pinnedBottom';\n\n/**\n * `asc | desc` rather than React Aria's `ascending | descending`: we do not use\n * `useTableState`, so there is no `SortDescriptor` interop to preserve, and\n * every consumer and server query parameter already speaks `asc|desc`.\n * `aria-sort` is a one-line map in the header cell.\n */\n/**\n * A rectangular block of cells, stored as two opposite corners.\n *\n * Corners rather than a set of keys so the selection survives a re-sort or a\n * page change the way a keyed row selection does: \"the block between these two\n * cells\" is re-resolved against the current order every render.\n */\n/**\n * The key a cell range identifies a row by.\n *\n * Not the consumer's row key: a pinned total is commonly the SAME record at the\n * top and the bottom (`id: 'total'`), and one flat key space collapsed the two\n * into whichever `indexOf` found first — so a range aimed at the footer total\n * resolved against the header one. The section is part of the identity here,\n * and only here; `ctx.rowKey` stays the consumer's own.\n */\nexport function selectionRowKey(\n  section: CubeTableRowSection,\n  rowKey: Key,\n): Key {\n  return section === 'body' ? rowKey : `${section}:${rowKey}`;\n}\n\nexport interface CubeTableCellRange {\n  fromRowKey: Key;\n  toRowKey: Key;\n  fromColumnKey: string;\n  toColumnKey: string;\n}\n\nexport interface CubeTableTreeRowState {\n  /** Zero-based depth in the hierarchy. */\n  level: number;\n  parentKey: Key | null;\n  hasChildren: boolean;\n  isExpanded: boolean;\n}\n\nexport interface CubeTableRowExpandInfo<T = any> {\n  row: T;\n  rowKey: Key;\n  level: number;\n  parentKey: Key | null;\n  expanded: boolean;\n}\n\n/** Shared root sizing contract used by both table adapters. */\nexport interface CubeTableLayoutProps {\n  /**\n   * Shrink-wraps the frame to its rendered rows instead of filling the\n   * available flex pane. This mode disables virtualization because there is no\n   * bounded vertical viewport to virtualize against.\n   *\n   * @default false\n   */\n  isAutoHeight?: boolean;\n}\n\n/** Shared opt-in hierarchy contract used by both table adapters. */\nexport interface CubeTableTreeProps<T = any> {\n  /**\n   * Returns a row's already-loaded children. Supplying this enables tree mode\n   * and makes `data` the top-level row collection.\n   */\n  getRowChildren?: (row: T) => readonly T[] | undefined;\n  /** Column that owns the indentation and disclosure control. */\n  treeColumnKey?: string;\n  /** Controlled expanded row keys. */\n  expandedKeys?: Key[];\n  /** Initially expanded row keys. */\n  defaultExpandedKeys?: Key[];\n  /** Called after a user expands or collapses a row. */\n  onExpand?: (keys: Key[], info: CubeTableRowExpandInfo<T>) => void;\n}\n\nexport interface CubeTableSort {\n  /** `key` of the sorted column. */\n  columnKey: string;\n  direction: CubeTableSortDirection;\n}\n\n/* ── render contexts ─────────────────────────────────────────────────────── */\n\nexport interface CubeTableCellContext<T = any> {\n  row: T;\n  rowKey: Key;\n  rowIndex: number;\n  columnKey: string;\n  columnIndex: number;\n  section: CubeTableRowSection;\n  /** Whether the ROW is selected, matching `isRowFocused` below. */\n  isSelected: boolean;\n  /**\n   * Not yet wired — always absent.\n   *\n   * Optional rather than `boolean`, because there is nowhere honest to compute\n   * them from where this context is built. Focus lives in the DOM, and drop\n   * state comes out of `useDropIndicator`, a hook that can only run inside the\n   * row component — so populating either means moving the `render` / `cellStyles`\n   * call sites into `TableRow`. Declaring them required and passing `false`\n   * would just be a documented lie.\n   */\n  isRowFocused?: boolean;\n  isDropTarget?: boolean;\n  /** Present only when `getRowChildren` enables tree mode. */\n  tree?: CubeTableTreeRowState;\n}\n\nexport interface CubeTableRowContext<T = any> {\n  row: T;\n  rowKey: Key;\n  rowIndex: number;\n  section: CubeTableRowSection;\n  isSelected: boolean;\n  /** Not yet wired — always absent. See `CubeTableCellContext` for why. */\n  isFocused?: boolean;\n  isDropTarget?: boolean;\n  /** Present only when `getRowChildren` enables tree mode. */\n  tree?: CubeTableTreeRowState;\n}\n\nexport interface CubeTableHeaderContext {\n  columnKey: string;\n  columnIndex: number;\n  sort: CubeTableSortDirection | null;\n  isSortable: boolean;\n  isResizing: boolean;\n  width: number | null;\n}\n\n/** Presentational path entry used to build multi-row column headers. */\nexport interface CubeTableColumnGroupHeader {\n  key: string;\n  title?: ReactNode;\n}\n\n/* ── column ──────────────────────────────────────────────────────────────── */\n\n/**\n * Rich header content. Every slot except `menu` maps 1:1 onto the `Item`\n * rendered inside the header `<th>`, so a header gets icon / description /\n * tooltip / suffix / actions for free; `menu` is mounted into that `Item`'s\n * `actions` slot behind a `⋮` trigger.\n */\nexport interface CubeTableColumnHeader {\n  icon?: CubeItemProps['icon'];\n  rightIcon?: CubeItemProps['rightIcon'];\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  description?: ReactNode;\n  descriptionPlacement?: CubeItemProps['descriptionPlacement'];\n  /** `true` = auto tooltip when the label is truncated. */\n  tooltip?: CubeItemProps['tooltip'];\n  actions?: ReactNode;\n  /** Hide `actions` until hover/focus. @default true */\n  autoHideActions?: boolean;\n  /**\n   * A column menu, opened from a `⋮` trigger in the header's actions slot and —\n   * unless the table says otherwise — by right-click or Shift+F10.\n   *\n   * `Menu.Item` children. Opaque: the table mounts the node and reports the\n   * pressed key back through `onColumnMenuAction`, so what a \"pin\" or a \"drill\n   * down\" means stays in the consuming app. The exception is the reserved sort\n   * keys (`sort-asc`, `sort-desc`, `clear-sort`), which the table labels,\n   * disables when redundant, and applies itself before telling the consumer.\n   *\n   * An empty menu renders no trigger at all, rather than one that opens nothing.\n   * Ignored when `header.render` takes the cell over.\n   */\n  menu?: ReactNode;\n  /** Props for the `⋮` trigger. Merged over the table's `columnMenuTriggerProps`. */\n  menuTriggerProps?: Record<string, any>;\n  /** Props for the `Menu`. Merged over the table's `columnMenuProps`. */\n  menuProps?: Record<string, any>;\n  /** Called before the table-level `onColumnMenuAction`. */\n  onMenuAction?: (action: string) => void;\n  theme?: CubeItemProps['theme'];\n  /**\n   * Full takeover of the header cell's content. Overrides `title` and every\n   * slot — including `actions` and `menu`, which are simply not rendered. A\n   * takeover that wants a menu owns the trigger too.\n   */\n  render?: (ctx: CubeTableHeaderContext) => ReactNode;\n  /** Overrides `column.align` for the header only. */\n  align?: CubeTableAlign;\n  styles?: Styles;\n}\n\n/* ── column colour ───────────────────────────────────────────────────────── */\n\n/**\n * A palette theme a column can borrow its tint from.\n *\n * Resolved through the same runtime generator as a custom colour, seeded from the\n * theme's own hue and saturation in `palette-config` — so it tracks a re-seeded\n * palette, and it gets the banding step the palette itself does not define.\n *\n * `special` is absent deliberately: it is a standalone `mode: 'fixed'` theme with\n * no tinted-surface ramp to borrow.\n */\nexport type CubeTableColumnTheme =\n  | 'primary'\n  | 'purple'\n  | 'success'\n  | 'danger'\n  | 'warning'\n  | 'note';\n\n/**\n * How a column is tinted.\n *\n * Every form but the last is *derived*: only a hue and a saturation are kept, and\n * the tone ramp plus an `AA`/`AAA` text floor are re-solved per colour scheme. So\n * a column stays readable in light, dark and high contrast without the caller\n * checking — which is the part hand-picked hex pairs get wrong.\n */\nexport type CubeTableColumnColor =\n  /** A palette theme name. */\n  | CubeTableColumnTheme\n  /** Any colour Glaze parses — hex, `rgb()`, `hsl()`, `okhsl()`, `oklch()`. */\n  | (string & {})\n  /** The seed said directly. `saturation` is 0–100. */\n  | { hue: number; saturation?: number }\n  /**\n   * Full manual control, as tasty colour strings (`'#note-surface'`, `'#purple.10'`).\n   *\n   * Nothing is derived and nothing is contrast-checked — this is the escape\n   * hatch, and readability in every scheme becomes the caller's problem.\n   * `fillBand` defaults to `fill`, which turns banding off for the column.\n   */\n  | { fill: string; fillBand?: string; text?: string };\n\n/**\n * Which parts of a column `color` reaches.\n *\n * @default ['header','body','totals']\n */\nexport type CubeTableColumnColorScope = 'header' | 'body' | 'totals';\n\nexport interface CubeTableColumn<T = any> {\n  /**\n   * Column id. Also the default data path — dot notation is supported\n   * (`'owner.name'`). Anything beyond a path needs `getValue`.\n   */\n  key: string;\n  /** Header label. Shorthand for `header` with no extra slots. */\n  title?: ReactNode;\n  header?: CubeTableColumnHeader;\n  /**\n   * Renders `<th scope=\"row\">` instead of `<td>`, names the row for screen\n   * readers, and hosts the `rowLink` anchor. Defaults to the first\n   * non-structural column when a row link is present.\n   */\n  isRowHeader?: boolean;\n\n  /* sizing */\n  /** Fixed width in px. Mutually exclusive with `flex`. */\n  width?: number;\n  /** Weight for the leftover space. @default 1 when `width` is unset */\n  flex?: number;\n  /** @default 150 */\n  minWidth?: number;\n  maxWidth?: number;\n  /** Inherits the table's `isResizable`. */\n  isResizable?: boolean;\n  /**\n   * Inherits the table's `isColumnReorderable`; `false` pins this column in\n   * place while the others still move around it.\n   */\n  isReorderable?: boolean;\n  /** Stick to the start/end edge during horizontal scroll. */\n  pin?: 'start' | 'end';\n  /** Hide without losing width or order state. */\n  isHidden?: boolean;\n\n  /* value pipeline */\n  /** @default (row) => get(row, key) */\n  getValue?: (row: T, rowIndex: number) => unknown;\n  /** Raw value → display text. Feeds client sort, client search and TSV copy. */\n  format?: (value: any, row: T, rowIndex: number) => string;\n  /** Client-side comparator over raw `getValue` results. */\n  compare?: (a: any, b: any, rowA: T, rowB: T) => number;\n\n  /* rendering */\n  /** A returned string is wrapped in a truncating `TextItem`. */\n  render?: (\n    value: any,\n    row: T,\n    rowIndex: number,\n    ctx: CubeTableCellContext<T>,\n  ) => ReactNode;\n  cellStyles?: Styles | ((ctx: CubeTableCellContext<T>) => Styles | undefined);\n  cellProps?: (ctx: CubeTableCellContext<T>) => Record<string, any> | undefined;\n\n  /**\n   * Tints the column — header, cells and pinned totals — with an adaptive fill\n   * and a text colour solved to stay readable on it in every scheme.\n   *\n   * Row banding survives: the tint carries its own band one tone step away, so\n   * the stripe still reads down the column instead of being painted over.\n   */\n  color?: CubeTableColumnColor;\n  /** Narrows what `color` reaches. @default ['header','body','totals'] */\n  colorScope?: readonly CubeTableColumnColorScope[];\n\n  /* behaviour */\n  align?: CubeTableAlign;\n  /**\n   * Opt IN, per column — a table is not sortable until at least one column says\n   * so, and `sortMode` then defaults to `'client'`.\n   *\n   * (This read `@default true` for a long time, which was never what the code\n   * did: `TableView` requires `isSortable === true` before a header becomes a\n   * control at all.)\n   *\n   * @default false\n   */\n  isSortable?: boolean;\n  /** Two-state cycling (asc ↔ desc), never back to unsorted. @default false */\n  disallowSortRemoval?: boolean;\n  /** Include in the built-in client search. @default true */\n  isSearchable?: boolean;\n  /** Include in TSV copy. @default true */\n  isCopyable?: boolean;\n  /** Wrap text and let the row grow to fit. */\n  autoHeight?: boolean;\n\n  /** Consumer-owned bag. Never reaches the DOM. */\n  meta?: Record<string, unknown>;\n}\n\n/* ── resolved layout (internal, but exported for adapters) ───────────────── */\n\nexport interface CubeResolvedColumn<T = any>\n  // `width`, `minWidth`, `maxWidth`, `flex` and `align` are all resolved here,\n  // so they narrow from optional to definite and must be replaced, not extended.\n  extends Omit<\n    CubeTableColumn<T>,\n    'width' | 'minWidth' | 'maxWidth' | 'flex' | 'align'\n  > {\n  /** Position among the visible leaf columns, 0-based. */\n  index: number;\n  /** `aria-colindex`, 1-based and document-absolute. */\n  ariaColIndex: number;\n  /** Resolved pixel width, or `null` while the container is unmeasured. */\n  width: number | null;\n  minWidth: number;\n  maxWidth: number | null;\n  flex: number | null;\n  align: CubeTableAlign;\n  /** Cumulative sticky offset in px for a pinned column. */\n  pinOffset: number | null;\n  /** `true` for the last pinned-start / first pinned-end column. */\n  isPinEdge: boolean;\n  /** Structural columns (selection, drag handle, row menu) never enter sorting,\n   *  search, copy, or the value pipeline. */\n  isStructural: boolean;\n}\n\nexport interface CubeTableColumnLayout<T = any> {\n  columns: CubeResolvedColumn<T>[];\n  pinnedStartWidth: number;\n  pinnedEndWidth: number;\n  /** Sum of resolved widths, or `null` while unmeasured. */\n  totalWidth: number | null;\n  /** `true` when the columns cannot fit and the table scrolls horizontally. */\n  isOverflowing: boolean;\n}\n\n/**\n * How a refresh over an existing result is presented.\n *\n * - `overlay` — keep the previous rows visible, dimmed, behind a spinner. A\n *   server page or a re-sort never blanks the table.\n * - `skeleton` — discard the previous rows and show placeholders.\n * - `none` — no visuals beyond `aria-busy`; the page owns the indicator.\n */\nexport type CubeTableLoadingIndicator = 'overlay' | 'skeleton' | 'none';\n\nexport type CubeTableSelectionMode = 'none' | 'single' | 'multiple';\n\n/**\n * What the header checkbox acts on.\n *\n * - `page` — the rows on the current page.\n * - `filtered` — every row passing the current search/filter, across pages.\n * - `all` — emits the `'all'` sentinel, meaning \"everything, including rows the\n *   client has not loaded\". The consumer decides what that means for its query.\n */\nexport type CubeTableSelectAllMode = 'page' | 'filtered' | 'all';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAuCA,SAAgBQ,gBACdC,SACAC,QACK;AACL,QAAOD,YAAY,SAASC,SAAS,GAAGD,QAAO,GAAIC"}
+{"version":3,"file":"types.js","names":["Key","Styles","ReactNode","CubeItemProps","CubeTableSortDirection","CubeTableRowSize","CubeTableAlign","CubeTableRowSection","selectionRowKey","section","rowKey","CubeTableCellRange","fromRowKey","toRowKey","fromColumnKey","toColumnKey","CubeTableTreeRowState","level","parentKey","hasChildren","isExpanded","CubeTableRowExpandInfo","row","T","expanded","CubeTableLayoutProps","isAutoHeight","CubeTableTreeProps","getRowChildren","treeColumnKey","expandedKeys","defaultExpandedKeys","onExpand","keys","info","CubeTableSort","columnKey","direction","CubeTableCellContext","rowIndex","columnIndex","isSelected","isRowFocused","isDropTarget","tree","CubeTableRowContext","isFocused","CubeTableHeaderContext","sort","isSortable","isResizing","width","CubeTableColumnGroupHeader","key","title","CubeTableColumnHeader","icon","rightIcon","prefix","suffix","description","descriptionPlacement","tooltip","actions","autoHideActions","menu","menuTriggerProps","Record","menuProps","onMenuAction","action","theme","render","ctx","align","styles","CubeTableColumnTheme","CubeTableColumnColor","hue","saturation","fill","fillBand","text","CubeTableColumnColorScope","CubeTableColumn","header","isRowHeader","flex","minWidth","maxWidth","isResizable","isReorderable","pin","isHidden","getValue","format","value","compare","a","b","rowA","rowB","cellStyles","cellProps","color","colorScope","disallowSortRemoval","isSearchable","isCopyable","autoHeight","meta","CubeResolvedColumn","Omit","index","ariaColIndex","pinOffset","isPinEdge","isStructural","CubeTableColumnLayout","columns","pinnedStartWidth","pinnedEndWidth","totalWidth","isOverflowing","CubeTableLoadingIndicator","CubeTableSelectionMode","CubeTableSelectAllMode"],"sources":["../../../../src/components/data/TableBase/types.ts"],"sourcesContent":["import type { Key } from '@react-types/shared';\nimport type { Styles } from '@tenphi/tasty';\nimport type { ReactNode } from 'react';\nimport type { CubeItemProps } from '../../content/Item';\n\nexport type CubeTableSortDirection = 'asc' | 'desc';\n/**\n * Named row heights: 28px, 32px and 40px.\n *\n * A subset of the kit's size scale, and the same three steps `size` would give —\n * but `rowSize` moves only the ROWS. `size` also drives the header, so reaching\n * for a denser body through it drags the header down too.\n */\nexport type CubeTableRowSize = 'small' | 'medium' | 'large';\nexport type CubeTableAlign = 'start' | 'center' | 'end';\nexport type CubeTableRowSection = 'body' | 'pinnedTop' | 'pinnedBottom';\n\n/**\n * `asc | desc` rather than React Aria's `ascending | descending`: we do not use\n * `useTableState`, so there is no `SortDescriptor` interop to preserve, and\n * every consumer and server query parameter already speaks `asc|desc`.\n * `aria-sort` is a one-line map in the header cell.\n */\n/**\n * A rectangular block of cells, stored as two opposite corners.\n *\n * Corners rather than a set of keys so the selection survives a re-sort or a\n * page change the way a keyed row selection does: \"the block between these two\n * cells\" is re-resolved against the current order every render.\n */\n/**\n * The key a cell range identifies a row by.\n *\n * Not the consumer's row key: a pinned total is commonly the SAME record at the\n * top and the bottom (`id: 'total'`), and one flat key space collapsed the two\n * into whichever `indexOf` found first — so a range aimed at the footer total\n * resolved against the header one. The section is part of the identity here,\n * and only here; `ctx.rowKey` stays the consumer's own.\n */\nexport function selectionRowKey(\n  section: CubeTableRowSection,\n  rowKey: Key,\n): Key {\n  return section === 'body' ? rowKey : `${section}:${rowKey}`;\n}\n\nexport interface CubeTableCellRange {\n  fromRowKey: Key;\n  toRowKey: Key;\n  fromColumnKey: string;\n  toColumnKey: string;\n}\n\nexport interface CubeTableTreeRowState {\n  /** Zero-based depth in the hierarchy. */\n  level: number;\n  parentKey: Key | null;\n  hasChildren: boolean;\n  isExpanded: boolean;\n}\n\nexport interface CubeTableRowExpandInfo<T = any> {\n  row: T;\n  rowKey: Key;\n  level: number;\n  parentKey: Key | null;\n  expanded: boolean;\n}\n\n/** Shared root sizing contract used by both table adapters. */\nexport interface CubeTableLayoutProps {\n  /**\n   * Shrink-wraps the frame to its rendered rows instead of filling the\n   * available flex pane. This mode disables virtualization because there is no\n   * bounded vertical viewport to virtualize against.\n   *\n   * @default false\n   */\n  isAutoHeight?: boolean;\n}\n\n/** Shared opt-in hierarchy contract used by both table adapters. */\nexport interface CubeTableTreeProps<T = any> {\n  /**\n   * Returns a row's already-loaded children. Supplying this enables tree mode\n   * and makes `data` the top-level row collection.\n   */\n  getRowChildren?: (row: T) => readonly T[] | undefined;\n  /** Column that owns the indentation and disclosure control. */\n  treeColumnKey?: string;\n  /** Controlled expanded row keys. */\n  expandedKeys?: Key[];\n  /** Initially expanded row keys. */\n  defaultExpandedKeys?: Key[];\n  /** Called after a user expands or collapses a row. */\n  onExpand?: (keys: Key[], info: CubeTableRowExpandInfo<T>) => void;\n}\n\nexport interface CubeTableSort {\n  /** `key` of the sorted column. */\n  columnKey: string;\n  direction: CubeTableSortDirection;\n}\n\n/* ── render contexts ─────────────────────────────────────────────────────── */\n\nexport interface CubeTableCellContext<T = any> {\n  row: T;\n  rowKey: Key;\n  rowIndex: number;\n  columnKey: string;\n  columnIndex: number;\n  section: CubeTableRowSection;\n  /** Whether the ROW is selected, matching `isRowFocused` below. */\n  isSelected: boolean;\n  /**\n   * Not yet wired — always absent.\n   *\n   * Optional rather than `boolean`, because there is nowhere honest to compute\n   * them from where this context is built. Focus lives in the DOM, and drop\n   * state comes out of `useDropIndicator`, a hook that can only run inside the\n   * row component — so populating either means moving the `render` / `cellStyles`\n   * call sites into `TableRow`. Declaring them required and passing `false`\n   * would just be a documented lie.\n   */\n  isRowFocused?: boolean;\n  isDropTarget?: boolean;\n  /** Present only when `getRowChildren` enables tree mode. */\n  tree?: CubeTableTreeRowState;\n}\n\nexport interface CubeTableRowContext<T = any> {\n  row: T;\n  rowKey: Key;\n  rowIndex: number;\n  section: CubeTableRowSection;\n  isSelected: boolean;\n  /** Not yet wired — always absent. See `CubeTableCellContext` for why. */\n  isFocused?: boolean;\n  isDropTarget?: boolean;\n  /** Present only when `getRowChildren` enables tree mode. */\n  tree?: CubeTableTreeRowState;\n}\n\nexport interface CubeTableHeaderContext {\n  columnKey: string;\n  columnIndex: number;\n  sort: CubeTableSortDirection | null;\n  isSortable: boolean;\n  isResizing: boolean;\n  width: number | null;\n}\n\n/** Presentational path entry used to build multi-row column headers. */\nexport interface CubeTableColumnGroupHeader {\n  key: string;\n  title?: ReactNode;\n}\n\n/* ── column ──────────────────────────────────────────────────────────────── */\n\n/**\n * Rich header content. Every slot except `menu` maps 1:1 onto the `Item`\n * rendered inside the header `<th>`, so a header gets icon / description /\n * tooltip / suffix / actions for free; `menu` is mounted into that `Item`'s\n * `actions` slot behind a `⋮` trigger.\n */\nexport interface CubeTableColumnHeader {\n  icon?: CubeItemProps['icon'];\n  rightIcon?: CubeItemProps['rightIcon'];\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  description?: ReactNode;\n  descriptionPlacement?: CubeItemProps['descriptionPlacement'];\n  /** `true` = auto tooltip when the label is truncated. */\n  tooltip?: CubeItemProps['tooltip'];\n  actions?: ReactNode;\n  /** Hide `actions` until hover/focus. @default true */\n  autoHideActions?: boolean;\n  /**\n   * A column menu, opened from a `⋮` trigger in the header's actions slot and —\n   * unless the table says otherwise — by right-click or Shift+F10.\n   *\n   * `Menu.Item` children. Opaque: the table mounts the node and reports the\n   * pressed key back through `onColumnMenuAction`, so what a \"pin\" or a \"drill\n   * down\" means stays in the consuming app. The exception is the reserved sort\n   * keys (`sort-asc`, `sort-desc`, `clear-sort`), which the table labels,\n   * disables when redundant, and applies itself before telling the consumer.\n   *\n   * An empty menu renders no trigger at all, rather than one that opens nothing.\n   * Ignored when `header.render` takes the cell over.\n   */\n  menu?: ReactNode;\n  /** Props for the `⋮` trigger. Merged over the table's `columnMenuTriggerProps`. */\n  menuTriggerProps?: Record<string, any>;\n  /** Props for the `Menu`. Merged over the table's `columnMenuProps`. */\n  menuProps?: Record<string, any>;\n  /** Called before the table-level `onColumnMenuAction`. */\n  onMenuAction?: (action: string) => void;\n  theme?: CubeItemProps['theme'];\n  /**\n   * Full takeover of the header cell's content. Overrides `title` and every\n   * slot — including `actions` and `menu`, which are simply not rendered. A\n   * takeover that wants a menu owns the trigger too.\n   */\n  render?: (ctx: CubeTableHeaderContext) => ReactNode;\n  /** Overrides `column.align` for the header only. */\n  align?: CubeTableAlign;\n  styles?: Styles;\n}\n\n/* ── column colour ───────────────────────────────────────────────────────── */\n\n/**\n * A palette theme a column can borrow its tint from.\n *\n * Resolved through the same runtime generator as a custom colour, seeded from the\n * theme's own hue and saturation in `palette-config` — so it tracks a re-seeded\n * palette, and it gets the banding step the palette itself does not define.\n *\n * `special` is absent deliberately: it is a standalone `mode: 'fixed'` theme with\n * no tinted-surface ramp to borrow.\n */\nexport type CubeTableColumnTheme =\n  | 'primary'\n  | 'purple'\n  | 'success'\n  | 'danger'\n  | 'warning'\n  | 'note';\n\n/**\n * How a column is tinted.\n *\n * Every form but the last is *derived*: only a hue and a saturation are kept, and\n * the tone ramp plus an `AA`/`AAA` text floor are re-solved per colour scheme. So\n * a column stays readable in light, dark and high contrast without the caller\n * checking — which is the part hand-picked hex pairs get wrong.\n */\nexport type CubeTableColumnColor =\n  /** A palette theme name. */\n  | CubeTableColumnTheme\n  /** Any colour Glaze parses — hex, `rgb()`, `hsl()`, `okhsl()`, `oklch()`. */\n  | (string & {})\n  /** The seed said directly. `saturation` is 0–100. */\n  | { hue: number; saturation?: number }\n  /**\n   * Full manual control, as tasty colour strings (`'#note-surface'`, `'#purple.10'`).\n   *\n   * Nothing is derived and nothing is contrast-checked — this is the escape\n   * hatch, and readability in every scheme becomes the caller's problem.\n   * `fillBand` defaults to `fill`, which turns banding off for the column.\n   */\n  | { fill: string; fillBand?: string; text?: string };\n\n/**\n * Which parts of a column `color` reaches.\n *\n * @default ['header','body','totals']\n */\nexport type CubeTableColumnColorScope = 'header' | 'body' | 'totals';\n\nexport interface CubeTableColumn<T = any> {\n  /**\n   * Column id. Also the default data path — dot notation is supported\n   * (`'owner.name'`). Anything beyond a path needs `getValue`.\n   */\n  key: string;\n  /** Header label. Shorthand for `header` with no extra slots. */\n  title?: ReactNode;\n  header?: CubeTableColumnHeader;\n  /**\n   * Renders `<th scope=\"row\">` instead of `<td>`, names the row for screen\n   * readers, and hosts the `rowLink` anchor. Defaults to the first\n   * non-structural column when a row link is present.\n   */\n  isRowHeader?: boolean;\n\n  /* sizing */\n  /** Fixed width in px. Mutually exclusive with `flex`. */\n  width?: number;\n  /** Weight for the leftover space. @default 1 when `width` is unset */\n  flex?: number;\n  /** @default 150 */\n  minWidth?: number;\n  maxWidth?: number;\n  /** Inherits the table's `isResizable`. */\n  isResizable?: boolean;\n  /**\n   * Inherits the table's `isColumnReorderable`; `false` pins this column in\n   * place while the others still move around it.\n   */\n  isReorderable?: boolean;\n  /** Stick to the start/end edge during horizontal scroll. */\n  pin?: 'start' | 'end';\n  /** Hide without losing width or order state. */\n  isHidden?: boolean;\n\n  /* value pipeline */\n  /** @default (row) => get(row, key) */\n  getValue?: (row: T, rowIndex: number) => unknown;\n  /** Raw value → display text. Feeds client sort, client search and TSV copy. */\n  format?: (value: any, row: T, rowIndex: number) => string;\n  /** Client-side comparator over raw `getValue` results. */\n  compare?: (a: any, b: any, rowA: T, rowB: T) => number;\n\n  /* rendering */\n  /** A returned string is wrapped in a truncating `TextItem`. */\n  render?: (\n    value: any,\n    row: T,\n    rowIndex: number,\n    ctx: CubeTableCellContext<T>,\n  ) => ReactNode;\n  /**\n   * Tasty styles for this column's body cells: tokens (`#surface-text-soft-2`),\n   * units, presets, recipes and state maps all work, and a state key asks about\n   * the cell itself (`@own(pinned=bottom)`). They win over the table's own cell\n   * paint, its column tint and the table-level `cellStyles`.\n   *\n   * The function form runs per cell, so it can vary with `ctx` (the row, its\n   * section, its selection). Cells whose styles are equal share one class, so a\n   * function returning a few distinct objects costs a few classes, not one per\n   * cell.\n   */\n  cellStyles?: Styles | ((ctx: CubeTableCellContext<T>) => Styles | undefined);\n  cellProps?: (ctx: CubeTableCellContext<T>) => Record<string, any> | undefined;\n\n  /**\n   * Tints the column — header, cells and pinned totals — with an adaptive fill\n   * and a text colour solved to stay readable on it in every scheme.\n   *\n   * Row banding survives: the tint carries its own band one tone step away, so\n   * the stripe still reads down the column instead of being painted over.\n   */\n  color?: CubeTableColumnColor;\n  /** Narrows what `color` reaches. @default ['header','body','totals'] */\n  colorScope?: readonly CubeTableColumnColorScope[];\n\n  /* behaviour */\n  align?: CubeTableAlign;\n  /**\n   * Opt IN, per column — a table is not sortable until at least one column says\n   * so, and `sortMode` then defaults to `'client'`.\n   *\n   * (This read `@default true` for a long time, which was never what the code\n   * did: `TableView` requires `isSortable === true` before a header becomes a\n   * control at all.)\n   *\n   * @default false\n   */\n  isSortable?: boolean;\n  /** Two-state cycling (asc ↔ desc), never back to unsorted. @default false */\n  disallowSortRemoval?: boolean;\n  /** Include in the built-in client search. @default true */\n  isSearchable?: boolean;\n  /** Include in TSV copy. @default true */\n  isCopyable?: boolean;\n  /** Wrap text and let the row grow to fit. */\n  autoHeight?: boolean;\n\n  /** Consumer-owned bag. Never reaches the DOM. */\n  meta?: Record<string, unknown>;\n}\n\n/* ── resolved layout (internal, but exported for adapters) ───────────────── */\n\nexport interface CubeResolvedColumn<T = any>\n  // `width`, `minWidth`, `maxWidth`, `flex` and `align` are all resolved here,\n  // so they narrow from optional to definite and must be replaced, not extended.\n  extends Omit<\n    CubeTableColumn<T>,\n    'width' | 'minWidth' | 'maxWidth' | 'flex' | 'align'\n  > {\n  /** Position among the visible leaf columns, 0-based. */\n  index: number;\n  /** `aria-colindex`, 1-based and document-absolute. */\n  ariaColIndex: number;\n  /** Resolved pixel width, or `null` while the container is unmeasured. */\n  width: number | null;\n  minWidth: number;\n  maxWidth: number | null;\n  flex: number | null;\n  align: CubeTableAlign;\n  /** Cumulative sticky offset in px for a pinned column. */\n  pinOffset: number | null;\n  /** `true` for the last pinned-start / first pinned-end column. */\n  isPinEdge: boolean;\n  /** Structural columns (selection, drag handle, row menu) never enter sorting,\n   *  search, copy, or the value pipeline. */\n  isStructural: boolean;\n}\n\nexport interface CubeTableColumnLayout<T = any> {\n  columns: CubeResolvedColumn<T>[];\n  pinnedStartWidth: number;\n  pinnedEndWidth: number;\n  /** Sum of resolved widths, or `null` while unmeasured. */\n  totalWidth: number | null;\n  /** `true` when the columns cannot fit and the table scrolls horizontally. */\n  isOverflowing: boolean;\n}\n\n/**\n * How a refresh over an existing result is presented.\n *\n * - `overlay` — keep the previous rows visible, dimmed, behind a spinner. A\n *   server page or a re-sort never blanks the table.\n * - `skeleton` — discard the previous rows and show placeholders.\n * - `none` — no visuals beyond `aria-busy`; the page owns the indicator.\n */\nexport type CubeTableLoadingIndicator = 'overlay' | 'skeleton' | 'none';\n\nexport type CubeTableSelectionMode = 'none' | 'single' | 'multiple';\n\n/**\n * What the header checkbox acts on.\n *\n * - `page` — the rows on the current page.\n * - `filtered` — every row passing the current search/filter, across pages.\n * - `all` — emits the `'all'` sentinel, meaning \"everything, including rows the\n *   client has not loaded\". The consumer decides what that means for its query.\n */\nexport type CubeTableSelectAllMode = 'page' | 'filtered' | 'all';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAuCA,SAAgBQ,gBACdC,SACAC,QACK;AACL,QAAOD,YAAY,SAASC,SAAS,GAAGD,QAAO,GAAIC"}

package/dist/components/data/TableBase/use-column-order.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { c } from "react-compiler-runtime";
 import { useState } from "react";

package/dist/components/data/TableBase/use-container-width.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 import { useLayoutEffect, useState } from "react";
 

package/dist/components/data/TableBase/use-row-move-animation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 import { useLayoutEffect, useRef } from "react";
 

package/dist/components/data/TableBase/use-scrollability.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 import { useLayoutEffect, useState } from "react";
 

package/dist/components/data/TableBase/use-table-columns.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { c } from "react-compiler-runtime";
 
 //#region src/components/data/TableBase/use-table-columns.ts

package/dist/components/data/TableBase/use-table-search.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useDebouncedValue } from "../../../_internal/hooks/use-debounced-value.js";
 import { getColumnText } from "./use-table-columns.js";

package/dist/components/data/TableBase/use-table-selection.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { RowCollection } from "./RowCollection.js";
 import { useCallback, useMemo, useRef } from "react";

package/dist/components/data/TableBase/use-table-sort.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { getColumnText, getColumnValue } from "./use-table-columns.js";
 import { c } from "react-compiler-runtime";

package/dist/components/data/TableBase/use-table-sorts.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { sortRows } from "./use-table-sort.js";
 import { c } from "react-compiler-runtime";

package/dist/components/data/TableBase/use-table-storage.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useCallback, useRef, useState } from "react";
 
 //#region src/components/data/TableBase/use-table-storage.ts

package/dist/components/data/TableBase/use-table-tree-state.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { c } from "react-compiler-runtime";

package/dist/components/fields/Checkbox/Checkbox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";

package/dist/components/fields/Checkbox/CheckboxGroup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { castNullableArrayValue } from "../../../utils/react/nullableValue.js";

package/dist/components/fields/Checkbox/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { createContext } from "react";
 
 //#region src/components/fields/Checkbox/context.ts

package/dist/components/fields/ColorInput/ColorInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";

package/dist/components/fields/ColorPicker/ColorPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/fields/ColorSwatch/ColorSwatch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { parseColor, toHex } from "../color/color.js";
 import { c } from "react-compiler-runtime";

package/dist/components/fields/ColorSwatchGroup/ColorSwatchGroup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/fields/ComboBox/ComboBox.d.ts

@@ -1,9 +1,9 @@
 
-import { FieldBaseProps } from "../../../shared/form.js";
+import { FieldBaseProps, TextFieldKeyboardProps } from "../../../shared/form.js";
 import "../../../shared/index.js";
 import { _CollectionItem } from "../../CollectionItem.js";
 import { BasePropsWithoutChildren, BaseStyleProps, ColorStyleProps, OuterStyleProps, Styles } from "@tenphi/tasty";
-import React, { ForwardedRef, ReactElement, ReactNode, RefObject } from "react";
+import { ForwardedRef, ReactElement, ReactNode, RefObject } from "react";
 import { Section } from "react-stately";
 import { FocusableRef, Key as Key$1 } from "@react-types/shared";
 
@@ -33,8 +33,13 @@ interface CubeComboBoxProps<T> extends BasePropsWithoutChildren, BaseStyleProps,
   onFocus?: () => void;
   /** Callback fired when focus leaves the component entirely. Does not receive event object. */
   onBlur?: () => void;
-  /** Callback fired when a key is pressed on the input */
-  onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
+  /**
+   * Callback fired when a key is pressed on the input, before the built-in
+   * key handling. Receives React Aria's keyboard event: `e.preventDefault()`
+   * skips the built-in handling for the key, and propagation stops at the
+   * input unless the handler calls `e.continuePropagation()`.
+   */
+  onKeyDown?: TextFieldKeyboardProps['onKeyDown'];
   /** Popover trigger behavior: 'focus', 'input', or 'manual'. Defaults to 'input' */
   popoverTrigger?: PopoverTriggerAction;
   /** Items for the listbox (alternative to children) */

package/dist/components/fields/ComboBox/ComboBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.187.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.188.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
@@ -147,6 +147,7 @@ function useComboBoxKeyboard(t0) {
 	if ($[0] !== allowsCustomValue || $[1] !== effectiveInputValue || $[2] !== hasResults || $[3] !== inputRef || $[4] !== isClearable || $[5] !== isPopoverOpen || $[6] !== listStateRef || $[7] !== onClearValue || $[8] !== onClosePopover || $[9] !== onKeyDown || $[10] !== onOpenPopover || $[11] !== onSelectionChange || $[12] !== onVirtualFocus || $[13] !== setIsFilterActive) {
 		t1 = { onKeyDown: (e) => {
 			onKeyDown?.(e);
+			if (e.isDefaultPrevented()) return;
 			if (e.key === "ArrowDown" || e.key === "ArrowUp") {
 				e.preventDefault();
 				if (!isPopoverOpen) {