@cube-dev/ui-kit 0.171.0 → 0.172.0

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

@@ -2,4 +2,5 @@
 import "../../content/Item/index.js";
 import "../../../data/item-themes.js";
 import "../../../index.js";
-import { Styles } from "@tenphi/tasty";
+import { Styles } from "@tenphi/tasty";
+import "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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

@@ -177,7 +177,7 @@ type CubeTableColumnTheme = 'primary' | 'purple' | 'success' | 'danger' | 'warni
  * How a column is tinted.
  *
  * Every form but the last is *derived*: only a hue and a saturation are kept, and
- * the tone ramp plus an `AA`/`AAA` text floor are re-solved per colour schema. So
+ * the tone ramp plus an `AA`/`AAA` text floor are re-solved per colour scheme. So
  * a column stays readable in light, dark and high contrast without the caller
  * checking — which is the part hand-picked hex pairs get wrong.
  */
@@ -189,7 +189,7 @@ type CubeTableColumnColor = /** A palette theme name. */CubeTableColumnTheme /**
  * Full manual control, as tasty colour strings (`'#note-surface'`, `'#purple.10'`).
  *
  * Nothing is derived and nothing is contrast-checked — this is the escape
- * hatch, and readability in every schema becomes the caller's problem.
+ * hatch, and readability in every scheme becomes the caller's problem.
  * `fillBand` defaults to `fill`, which turns banding off for the column.
  */
 | {
@@ -248,7 +248,7 @@ interface CubeTableColumn<T = any> {
   cellProps?: (ctx: CubeTableCellContext<T>) => Record<string, any> | undefined;
   /**
    * Tints the column — header, cells and pinned totals — with an adaptive fill
-   * and a text colour solved to stay readable on it in every schema.
+   * and a text colour solved to stay readable on it in every scheme.
    *
    * Row banding survives: the tint carries its own band one tone step away, so
    * the stripe still reads down the column instead of being painted over.

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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":[],"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 schema. 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 schema 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 schema.\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,SAAgB,gBACd,SACA,QACK;AACL,QAAO,YAAY,SAAS,SAAS,GAAG,QAAQ,GAAG"}
+{"version":3,"file":"types.js","names":[],"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,SAAgB,gBACd,SACA,QACK;AACL,QAAO,YAAY,SAAS,SAAS,GAAG,QAAQ,GAAG"}

package/dist/components/data/TableBase/use-cell-selection.d.ts

@@ -1,3 +1,4 @@
 
 import "./types.js";
+import "react";
 import { Key as Key$1 } from "@react-types/shared";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useMemo, useState } from "react";
 import { useControlledState } from "@react-stately/utils";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useLayoutEffect, useState } from "react";
 
 //#region src/components/data/TableBase/use-container-width.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useLayoutEffect, useRef } from "react";
 
 //#region src/components/data/TableBase/use-row-move-animation.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useLayoutEffect, useState } from "react";
 
 //#region src/components/data/TableBase/use-scrollability.ts

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useMemo } from "react";
 
 //#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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { getColumnText, getColumnValue } from "./use-table-columns.js";
 import { useMemo } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { compareByColumn } from "./use-table-sort.js";
 import { useMemo } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { useMemo } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Text } from "../../content/Text.js";

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":["useFocus","mergeProps","Text","CheckboxGroup"],"sources":["../../../../src/components/fields/Checkbox/Checkbox.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport { IconCheck, IconMinus } from '@tabler/icons-react';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Element,\n  filterBaseProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useContext, useMemo, useRef } from 'react';\nimport {\n  AriaCheckboxProps,\n  useCheckbox,\n  useCheckboxGroupItem,\n  useHover,\n} from 'react-aria';\nimport { useToggleState } from 'react-stately';\n\nimport { Icon } from '../../../icons/Icon';\nimport { FieldBaseProps, ToggleSelectionProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport {\n  castNullableIsSelected,\n  WithNullableSelected,\n} from '../../../utils/react/nullableValue';\nimport { extractStyles } from '../../../utils/styles';\nimport { Text } from '../../content/Text';\nimport {\n  getValidationMods,\n  INLINE_LABEL_STYLES,\n  LABEL_STYLES,\n  resolveValidationProps,\n  useFieldProps,\n  wrapWithField,\n} from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\n\nimport { CheckboxGroup } from './CheckboxGroup';\nimport { CheckboxGroupContext } from './context';\n\nimport type { FocusableRef } from '@react-types/shared';\n\nexport interface CubeCheckboxProps\n  extends BaseProps,\n    ContainerStyleProps,\n    AriaCheckboxProps,\n    ToggleSelectionProps,\n    FieldBaseProps {\n  inputStyles?: Styles;\n  isIndeterminate?: boolean;\n  value?: string;\n}\n\nconst CheckboxWrapperElement = tasty({\n  as: 'label',\n  qa: 'CheckboxWrapper',\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    placeItems: 'center start',\n    placeContent: 'baseline',\n    gap: '1x',\n    flow: 'row',\n    preset: 'default',\n    cursor: '$pointer',\n    width: 'max max-content',\n    color: '#dark-02',\n  },\n});\n\nconst CheckboxElement = tasty({\n  qa: 'Checkbox',\n  styles: {\n    display: 'grid',\n    placeItems: 'center',\n    radius: '.5r',\n    fill: {\n      '': '#surface',\n      'checked | indeterminate': '#primary',\n      'invalid & !checked': '#surface',\n      'invalid & checked': '#danger',\n      'valid & !checked': '#surface',\n      'valid & checked': '#success',\n      disabled: '#dark.12',\n    },\n    // The check / minus icon is always rendered inside the box, so the\n    // default color must be transparent when the checkbox is neither\n    // checked nor indeterminate — otherwise the white stroke shows through\n    // the dark `#surface` fill in dark schemas (it used to be hidden\n    // accidentally by the legacy white-on-white `fill: '#white'`).\n    color: {\n      '': '#clear',\n      'checked | indeterminate': '#white',\n    },\n    border: {\n      '': '#dark.30',\n      invalid: '#danger',\n      valid: '#success',\n      'disabled | ((indeterminate | checked) & !invalid & !valid)': '#clear',\n    },\n    width: '(2x - 2bw)',\n    height: '(2x - 2bw)',\n    outline: {\n      '': '#primary-text.0',\n      focused: '1bw #primary-text',\n    },\n    outlineOffset: 1,\n    transition: 'theme',\n  },\n});\n\nfunction Checkbox(\n  props: WithNullableSelected<CubeCheckboxProps>,\n  ref: FocusableRef,\n) {\n  // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.\n  // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,\n  // but since the checkbox won't move in and out of a group, it should be safe.\n  let groupState = useContext(CheckboxGroupContext);\n\n  props = castNullableIsSelected(props);\n\n  let originalProps = props;\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      isSelected: value ?? false,\n      isIndeterminate: false,\n      onChange: onChange,\n    }),\n    unsafe__isDisabled: !!groupState,\n  });\n\n  let {\n    qa,\n    isIndeterminate = false,\n    isDisabled = false,\n    insideForm,\n    isRequired,\n    children,\n    label,\n    isInvalid,\n    isValid,\n    labelProps,\n    labelStyles,\n    labelPosition,\n    inputStyles,\n    isHidden,\n    form,\n    // Pulled out so it stays off the `<label>` spread below. The Aria hooks read\n    // it from `props` directly; `filterBaseProps` already dropped it at runtime,\n    // but it typed as a DOM `FormEventHandler` there, which it is not.\n    onChange,\n    ...otherProps\n  } = props;\n\n  let styles: Styles = extractStyles(props, CONTAINER_STYLES);\n\n  labelStyles = useMemo(\n    () => ({\n      ...(!groupState ? LABEL_STYLES : INLINE_LABEL_STYLES),\n      ...labelStyles,\n    }),\n    [groupState, labelStyles],\n  );\n\n  let { isFocused, focusProps } = useFocus({ isDisabled }, true);\n  let { hoverProps, isHovered } = useHover({ isDisabled });\n\n  let inputRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n\n  const toggleState = useToggleState(props);\n\n  let { inputProps } = groupState\n    ? useCheckboxGroupItem(\n        {\n          ...props,\n          // Value is optional for standalone checkboxes, but required for CheckboxGroup items;\n          // it's passed explicitly here to avoid typescript error (requires strictNullChecks disabled).\n          value: props.value || '',\n          // Only pass isRequired and the validation state to react-aria if they came from\n          // the props for this individual checkbox, and not from the group via context.\n          isRequired: originalProps.isRequired,\n          isInvalid: resolveValidationProps(originalProps).isInvalid,\n        },\n        groupState,\n        inputRef,\n      )\n    : useCheckbox(\n        {\n          ...props,\n          ...(typeof label === 'string' && label.trim()\n            ? { 'aria-label': label }\n            : {}),\n        },\n        toggleState,\n        inputRef,\n      );\n\n  let markIcon = isIndeterminate ? (\n    <Icon size={12} stroke={3}>\n      <IconMinus />\n    </Icon>\n  ) : (\n    <Icon size={12} stroke={3}>\n      <IconCheck />\n    </Icon>\n  );\n\n  if (groupState) {\n    for (let key of ['isSelected', 'defaultSelected', 'isEmphasized']) {\n      if (originalProps[key] != null) {\n        console.warn(\n          `CubeUIKit: ${key} is unsupported on individual <Checkbox> elements within a <CheckboxGroup>. Please apply these props to the group instead.`,\n        );\n      }\n    }\n    if (props.value == null) {\n      console.warn(\n        'CubeUIKit: A <Checkbox> element within a <CheckboxGroup> requires a `value` property.',\n      );\n    }\n  }\n\n  const mods = {\n    checked: inputProps.checked,\n    indeterminate: isIndeterminate,\n    ...getValidationMods({ isInvalid, isValid }),\n    disabled: isDisabled,\n    hovered: isHovered,\n    focused: isFocused,\n    'side-label': labelPosition === 'side',\n    'inside-form': insideForm,\n  };\n\n  const checkbox = (\n    <>\n      <HiddenInput\n        qa={qa || 'Checkbox'}\n        data-input-type=\"checkbox\"\n        {...mergeProps(inputProps, focusProps)}\n        ref={inputRef}\n      />\n      <CheckboxElement mods={mods} styles={inputStyles}>\n        {markIcon}\n      </CheckboxElement>\n    </>\n  );\n\n  const checkboxField = (\n    <CheckboxWrapperElement isHidden={isHidden} mods={mods}>\n      {checkbox}\n      {children && <Text nowrap>{children}</Text>}\n    </CheckboxWrapperElement>\n  );\n\n  if (!groupState) {\n    return wrapWithField(checkboxField, domRef, props);\n  }\n\n  return (\n    <CheckboxWrapperElement\n      styles={styles}\n      isHidden={isHidden}\n      {...hoverProps}\n      {...filterBaseProps(otherProps)}\n      ref={domRef}\n    >\n      {checkbox}\n      {label ?? children ? (\n        <Element\n          styles={labelStyles}\n          mods={{\n            ...getValidationMods({ isInvalid, isValid }),\n            disabled: isDisabled,\n          }}\n          {...(labelProps ? filterBaseProps(labelProps) : undefined)}\n        >\n          {label ?? children}\n        </Element>\n      ) : null}\n    </CheckboxWrapperElement>\n  );\n}\n\n/**\n * Checkboxes allow users to select multiple items from a list of individual items,\n * or to mark one individual item as selected.\n */\nlet _Checkbox = forwardRef(Checkbox);\n\n(_Checkbox as any).cubeInputType = 'Checkbox';\nlet __Checkbox = Object.assign(\n  _Checkbox as typeof _Checkbox & { Group: typeof CheckboxGroup },\n  { Group: CheckboxGroup },\n);\n\n__Checkbox.displayName = 'Checkbox';\n\nexport { __Checkbox as Checkbox };\nexport type { AriaCheckboxProps };\nexport { useCheckbox };\n"],"mappings":"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"}
+{"version":3,"file":"Checkbox.js","names":["useFocus","mergeProps","Text","CheckboxGroup"],"sources":["../../../../src/components/fields/Checkbox/Checkbox.tsx"],"sourcesContent":["import { useFocusableRef } from '@react-spectrum/utils';\nimport { IconCheck, IconMinus } from '@tabler/icons-react';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  Element,\n  filterBaseProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef, useContext, useMemo, useRef } from 'react';\nimport {\n  AriaCheckboxProps,\n  useCheckbox,\n  useCheckboxGroupItem,\n  useHover,\n} from 'react-aria';\nimport { useToggleState } from 'react-stately';\n\nimport { Icon } from '../../../icons/Icon';\nimport { FieldBaseProps, ToggleSelectionProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport {\n  castNullableIsSelected,\n  WithNullableSelected,\n} from '../../../utils/react/nullableValue';\nimport { extractStyles } from '../../../utils/styles';\nimport { Text } from '../../content/Text';\nimport {\n  getValidationMods,\n  INLINE_LABEL_STYLES,\n  LABEL_STYLES,\n  resolveValidationProps,\n  useFieldProps,\n  wrapWithField,\n} from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\n\nimport { CheckboxGroup } from './CheckboxGroup';\nimport { CheckboxGroupContext } from './context';\n\nimport type { FocusableRef } from '@react-types/shared';\n\nexport interface CubeCheckboxProps\n  extends BaseProps,\n    ContainerStyleProps,\n    AriaCheckboxProps,\n    ToggleSelectionProps,\n    FieldBaseProps {\n  inputStyles?: Styles;\n  isIndeterminate?: boolean;\n  value?: string;\n}\n\nconst CheckboxWrapperElement = tasty({\n  as: 'label',\n  qa: 'CheckboxWrapper',\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    placeItems: 'center start',\n    placeContent: 'baseline',\n    gap: '1x',\n    flow: 'row',\n    preset: 'default',\n    cursor: '$pointer',\n    width: 'max max-content',\n    color: '#dark-02',\n  },\n});\n\nconst CheckboxElement = tasty({\n  qa: 'Checkbox',\n  styles: {\n    display: 'grid',\n    placeItems: 'center',\n    radius: '.5r',\n    fill: {\n      '': '#surface',\n      'checked | indeterminate': '#primary',\n      'invalid & !checked': '#surface',\n      'invalid & checked': '#danger',\n      'valid & !checked': '#surface',\n      'valid & checked': '#success',\n      disabled: '#dark.12',\n    },\n    // The check / minus icon is always rendered inside the box, so the\n    // default color must be transparent when the checkbox is neither\n    // checked nor indeterminate — otherwise the white stroke shows through\n    // the dark `#surface` fill in dark schemes (it used to be hidden\n    // accidentally by the legacy white-on-white `fill: '#white'`).\n    color: {\n      '': '#clear',\n      'checked | indeterminate': '#white',\n    },\n    border: {\n      '': '#dark.30',\n      invalid: '#danger',\n      valid: '#success',\n      'disabled | ((indeterminate | checked) & !invalid & !valid)': '#clear',\n    },\n    width: '(2x - 2bw)',\n    height: '(2x - 2bw)',\n    outline: {\n      '': '#primary-text.0',\n      focused: '1bw #primary-text',\n    },\n    outlineOffset: 1,\n    transition: 'theme',\n  },\n});\n\nfunction Checkbox(\n  props: WithNullableSelected<CubeCheckboxProps>,\n  ref: FocusableRef,\n) {\n  // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.\n  // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,\n  // but since the checkbox won't move in and out of a group, it should be safe.\n  let groupState = useContext(CheckboxGroupContext);\n\n  props = castNullableIsSelected(props);\n\n  let originalProps = props;\n\n  props = useFieldProps(props, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      isSelected: value ?? false,\n      isIndeterminate: false,\n      onChange: onChange,\n    }),\n    unsafe__isDisabled: !!groupState,\n  });\n\n  let {\n    qa,\n    isIndeterminate = false,\n    isDisabled = false,\n    insideForm,\n    isRequired,\n    children,\n    label,\n    isInvalid,\n    isValid,\n    labelProps,\n    labelStyles,\n    labelPosition,\n    inputStyles,\n    isHidden,\n    form,\n    // Pulled out so it stays off the `<label>` spread below. The Aria hooks read\n    // it from `props` directly; `filterBaseProps` already dropped it at runtime,\n    // but it typed as a DOM `FormEventHandler` there, which it is not.\n    onChange,\n    ...otherProps\n  } = props;\n\n  let styles: Styles = extractStyles(props, CONTAINER_STYLES);\n\n  labelStyles = useMemo(\n    () => ({\n      ...(!groupState ? LABEL_STYLES : INLINE_LABEL_STYLES),\n      ...labelStyles,\n    }),\n    [groupState, labelStyles],\n  );\n\n  let { isFocused, focusProps } = useFocus({ isDisabled }, true);\n  let { hoverProps, isHovered } = useHover({ isDisabled });\n\n  let inputRef = useRef(null);\n  let domRef = useFocusableRef(ref, inputRef);\n\n  const toggleState = useToggleState(props);\n\n  let { inputProps } = groupState\n    ? useCheckboxGroupItem(\n        {\n          ...props,\n          // Value is optional for standalone checkboxes, but required for CheckboxGroup items;\n          // it's passed explicitly here to avoid typescript error (requires strictNullChecks disabled).\n          value: props.value || '',\n          // Only pass isRequired and the validation state to react-aria if they came from\n          // the props for this individual checkbox, and not from the group via context.\n          isRequired: originalProps.isRequired,\n          isInvalid: resolveValidationProps(originalProps).isInvalid,\n        },\n        groupState,\n        inputRef,\n      )\n    : useCheckbox(\n        {\n          ...props,\n          ...(typeof label === 'string' && label.trim()\n            ? { 'aria-label': label }\n            : {}),\n        },\n        toggleState,\n        inputRef,\n      );\n\n  let markIcon = isIndeterminate ? (\n    <Icon size={12} stroke={3}>\n      <IconMinus />\n    </Icon>\n  ) : (\n    <Icon size={12} stroke={3}>\n      <IconCheck />\n    </Icon>\n  );\n\n  if (groupState) {\n    for (let key of ['isSelected', 'defaultSelected', 'isEmphasized']) {\n      if (originalProps[key] != null) {\n        console.warn(\n          `CubeUIKit: ${key} is unsupported on individual <Checkbox> elements within a <CheckboxGroup>. Please apply these props to the group instead.`,\n        );\n      }\n    }\n    if (props.value == null) {\n      console.warn(\n        'CubeUIKit: A <Checkbox> element within a <CheckboxGroup> requires a `value` property.',\n      );\n    }\n  }\n\n  const mods = {\n    checked: inputProps.checked,\n    indeterminate: isIndeterminate,\n    ...getValidationMods({ isInvalid, isValid }),\n    disabled: isDisabled,\n    hovered: isHovered,\n    focused: isFocused,\n    'side-label': labelPosition === 'side',\n    'inside-form': insideForm,\n  };\n\n  const checkbox = (\n    <>\n      <HiddenInput\n        qa={qa || 'Checkbox'}\n        data-input-type=\"checkbox\"\n        {...mergeProps(inputProps, focusProps)}\n        ref={inputRef}\n      />\n      <CheckboxElement mods={mods} styles={inputStyles}>\n        {markIcon}\n      </CheckboxElement>\n    </>\n  );\n\n  const checkboxField = (\n    <CheckboxWrapperElement isHidden={isHidden} mods={mods}>\n      {checkbox}\n      {children && <Text nowrap>{children}</Text>}\n    </CheckboxWrapperElement>\n  );\n\n  if (!groupState) {\n    return wrapWithField(checkboxField, domRef, props);\n  }\n\n  return (\n    <CheckboxWrapperElement\n      styles={styles}\n      isHidden={isHidden}\n      {...hoverProps}\n      {...filterBaseProps(otherProps)}\n      ref={domRef}\n    >\n      {checkbox}\n      {label ?? children ? (\n        <Element\n          styles={labelStyles}\n          mods={{\n            ...getValidationMods({ isInvalid, isValid }),\n            disabled: isDisabled,\n          }}\n          {...(labelProps ? filterBaseProps(labelProps) : undefined)}\n        >\n          {label ?? children}\n        </Element>\n      ) : null}\n    </CheckboxWrapperElement>\n  );\n}\n\n/**\n * Checkboxes allow users to select multiple items from a list of individual items,\n * or to mark one individual item as selected.\n */\nlet _Checkbox = forwardRef(Checkbox);\n\n(_Checkbox as any).cubeInputType = 'Checkbox';\nlet __Checkbox = Object.assign(\n  _Checkbox as typeof _Checkbox & { Group: typeof CheckboxGroup },\n  { Group: CheckboxGroup },\n);\n\n__Checkbox.displayName = 'Checkbox';\n\nexport { __Checkbox as Checkbox };\nexport type { AriaCheckboxProps };\nexport { useCheckbox };\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { parseColor, toHex } from "../color/color.js";
 import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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";
@@ -22,7 +22,7 @@ import { useObjectRef } from "@react-aria/utils";
 * Two rings drawn inside the swatch, as React Aria marks selection. Outer ring
 * first: earlier shadows paint over later ones, so this reads as 2bw of
 * `#surface-text` at the edge and 2bw of `#surface` within it. Two tones that
-* flip with the schema stay visible against any color the swatch holds.
+* flip with the scheme stay visible against any color the swatch holds.
 */
 const SELECTED_RING = "inset 0 0 0 2bw #surface-text, inset 0 0 0 4bw #surface";
 /** The swatch edge in px, per size. `Item` takes an exact number. */

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

@@ -1 +1 @@
-{"version":3,"file":"ColorSwatchGroup.js","names":["useFocus","mergeProps"],"sources":["../../../../src/components/fields/ColorSwatchGroup/ColorSwatchGroup.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef, useMemo, useRef, useState } from 'react';\nimport { useRadio, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { useEvent } from '../../../_internal';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport { extractStyles } from '../../../utils/styles';\nimport { getValidationMods, useFieldProps, wrapWithField } from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\nimport { ColorFormat, formatColor, parseColor, toHex } from '../color/color';\nimport { useIsInsideColorPopover } from '../color/context';\nimport { ColorPicker } from '../ColorPicker';\n\nimport type { RadioGroupState } from 'react-stately';\n\n/** A swatch: a color, and optionally a name to announce instead of the color. */\nexport type CubeColorSwatchItem = string | { color: string; label?: string };\n\n/**\n * Two rings drawn inside the swatch, as React Aria marks selection. Outer ring\n * first: earlier shadows paint over later ones, so this reads as 2bw of\n * `#surface-text` at the edge and 2bw of `#surface` within it. Two tones that\n * flip with the schema stay visible against any color the swatch holds.\n */\nconst SELECTED_RING = 'inset 0 0 0 2bw #surface-text, inset 0 0 0 4bw #surface';\n\n/** The swatch edge in px, per size. `Item` takes an exact number. */\nconst SWATCH_PX: Record<string, number> = {\n  small: 16,\n  medium: 20,\n  large: 24,\n};\n\n/**\n * The trailing picker is a button wrapping a swatch, which would otherwise read\n * as a box inside a box. Stripping its chrome leaves just the swatch, so it\n * sits in the row as one of them.\n */\nconst CUSTOM_TRIGGER_STYLES: Styles = {\n  // `size` sets the control's height; the box is pinned here as well so a flex\n  // row cannot let the button size itself to its content instead.\n  width: '$swatch-size $swatch-size',\n  height: '$swatch-size $swatch-size',\n  padding: 0,\n  radius: '1r',\n  border: 0,\n  position: 'relative',\n};\n\n/**\n * The swatch is docked over the whole button rather than placed inside it.\n * `Item` lays its icon out in a grid that reserves room for a label even when\n * there is none, which left the swatch a pixel off centre.\n */\nconst CUSTOM_SWATCH_STYLES: Styles = {\n  position: 'absolute',\n  inset: 0,\n  width: 'auto',\n  height: 'auto',\n  radius: '1r',\n};\n\n/**\n * The ring goes on the swatch, not on the button around it: an inset shadow\n * paints under child content, and the swatch covers the button edge to edge.\n */\nconst CUSTOM_SWATCH_SELECTED_STYLES: Styles = {\n  ...CUSTOM_SWATCH_STYLES,\n  shadow: SELECTED_RING,\n};\n\nconst GroupElement = tasty({\n  qa: 'ColorSwatchGroup',\n  styles: {\n    // Wrapping is the better default: it is a single row wherever there is\n    // room, and folds instead of overflowing where there is not. A fixed\n    // `columns` switches to a grid, sized to the swatches rather than to the\n    // container — `1fr` tracks would stretch them apart.\n    display: {\n      '': 'flex',\n      columns: 'grid',\n    },\n    flow: {\n      '': 'row wrap',\n      columns: 'row',\n    },\n    gap: '.5x',\n    placeItems: {\n      '': 'center start',\n      columns: 'stretch',\n    },\n    width: {\n      '': 'auto',\n      columns: 'max-content',\n    },\n    gridColumns: 'repeat($columns, max-content)',\n\n    // 20px, 16px and 24px — 1x is 8px.\n    '$swatch-size': {\n      '': '2.5x',\n      'size=small': '2x',\n      'size=large': '3x',\n    },\n  },\n});\n\n/**\n * Only the swatches belong to the radiogroup. The custom picker is a button,\n * and inside `role=\"radiogroup\"` it both misreports what the palette holds and\n * hands arrow keys to React Aria's radio walker — pressing one while the picker\n * is focused jumps into a swatch and changes the color. The box is dropped so\n * the swatches remain direct children of the group's own layout.\n */\nconst RadiosElement = tasty({\n  styles: { display: 'contents' },\n});\n\nconst SwatchElement = tasty({\n  as: 'label',\n  qa: 'ColorSwatchOption',\n  styles: {\n    display: 'grid',\n    placeItems: 'stretch',\n    position: 'relative',\n    radius: '1r',\n    cursor: {\n      '': 'pointer',\n      disabled: 'default',\n    },\n    width: '$swatch-size $swatch-size',\n    height: '$swatch-size $swatch-size',\n    fill: '(#color-swatch, #clear)',\n    opacity: {\n      '': 1,\n      disabled: '$disabled-opacity',\n    },\n    // A ring at one border-width's distance, so the color area stays whole —\n    // the inner ring is the surface showing through as the gap. `outline` is\n    // deliberately left to the focus ring.\n    shadow: {\n      '': 'inset 0 0 0 1bw #dark.15',\n      selected: SELECTED_RING,\n    },\n    // A 1bw offset keeps the ring clear of the 4px gap to its neighbours.\n    outline: {\n      '': '2bw #focus.0 / 1bw',\n      focused: '2bw #focus / 1bw',\n    },\n    transition: 'theme',\n  },\n});\n\nexport interface CubeColorSwatchGroupProps\n  extends BaseProps,\n    OuterStyleProps,\n    BlockStyleProps,\n    FieldBaseProps {\n  /** The colors to offer. Duplicates of the same color are dropped. */\n  colors?: CubeColorSwatchItem[];\n  /** The selected color (controlled). */\n  value?: string | null;\n  /** The selected color (uncontrolled). */\n  defaultValue?: string | null;\n  /** Called with the chosen color, written in `format`. */\n  onChange?: (value: string | null) => void;\n  /** Notation the value is written in. */\n  format?: ColorFormat;\n  /** How many swatches per row. Defaults to a single row. */\n  columns?: number;\n  /**\n   * Append a `ColorPicker` for colors outside the set. Ignored inside a color\n   * popover, which is where that picker would otherwise recurse.\n   */\n  allowCustom?: boolean;\n  /** The size of each swatch. */\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  styles?: Styles;\n  /** Styles of an individual swatch. */\n  swatchStyles?: Styles;\n  'aria-label'?: string;\n}\n\ninterface SwatchProps {\n  colorKey: string;\n  label: string;\n  state: RadioGroupState;\n  isDisabled?: boolean;\n  size?: string;\n  styles?: Styles;\n  mods?: Record<string, boolean | undefined>;\n}\n\nfunction Swatch({\n  colorKey,\n  label,\n  state,\n  isDisabled,\n  size,\n  styles,\n  mods,\n}: SwatchProps) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const {\n    inputProps,\n    isSelected,\n    isDisabled: isRadioDisabled,\n  } = useRadio(\n    { value: colorKey, 'aria-label': label, isDisabled },\n    state,\n    inputRef,\n  );\n  // `useRadio` reports selection but not focus, and the swatch is the only\n  // thing a keyboard user can see — without this the ring never appears.\n  const { isFocused, focusProps } = useFocus({ isDisabled }, true);\n\n  return (\n    <SwatchElement\n      data-size={size}\n      mods={{\n        selected: isSelected,\n        disabled: isRadioDisabled,\n        focused: isFocused,\n        ...mods,\n      }}\n      styles={styles}\n      style={{ '--color-swatch-color': colorKey }}\n    >\n      <HiddenInput\n        {...mergeProps(inputProps, focusProps)}\n        ref={inputRef}\n        qa=\"ColorSwatchInput\"\n        mods={{ button: true, disabled: isRadioDisabled }}\n      />\n    </SwatchElement>\n  );\n}\n\n/**\n * A grid of color swatches, one of which can be selected — the palette half of\n * choosing a color, where `ColorPicker` is the freeform half.\n *\n * Swatches are keyed by their canonical hex, so the same color written two ways\n * collapses into one entry. Equivalent colors would otherwise make selection\n * ambiguous.\n */\nexport const ColorSwatchGroup = forwardRef(function ColorSwatchGroup(\n  allProps: CubeColorSwatchGroupProps,\n  ref: ForwardedRef<HTMLElement>,\n) {\n  const props = useFieldProps(allProps, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      value: value as string | null | undefined,\n      onChange,\n    }),\n  });\n\n  const {\n    qa,\n    colors = [],\n    value,\n    defaultValue,\n    onChange,\n    format = 'hex',\n    columns,\n    allowCustom,\n    size = 'medium',\n    isDisabled,\n    isInvalid,\n    isValid,\n    swatchStyles,\n    'aria-label': ariaLabel,\n  } = props;\n\n  const styles = extractStyles(props, [...OUTER_STYLES, ...BLOCK_STYLES]);\n  const isInsidePopover = useIsInsideColorPopover();\n  // A custom picker inside a color popover would open a popover of its own.\n  const showCustom = allowCustom && !isInsidePopover;\n\n  /** Keyed by canonical hex so the same color written two ways is one swatch. */\n  const swatches = useMemo(() => {\n    const seen = new Map<string, { key: string; label: string }>();\n\n    for (const entry of colors) {\n      const raw = typeof entry === 'string' ? entry : entry.color;\n      const parsed = parseColor(raw);\n\n      if (!parsed) continue;\n\n      const key = toHex(parsed);\n\n      if (seen.has(key)) continue;\n\n      seen.set(key, {\n        key,\n        label:\n          (typeof entry === 'string' ? undefined : entry.label) ??\n          formatColor(parsed, format),\n      });\n    }\n\n    return [...seen.values()];\n  }, [colors, format]);\n\n  const [internalValue, setInternalValue] = useState<string | null>(\n    () => defaultValue ?? null,\n  );\n  const currentValue = value !== undefined ? value : internalValue;\n\n  const selectedColor = parseColor((currentValue ?? '').toString());\n  const selectedKey = selectedColor ? toHex(selectedColor) : null;\n  const isCustom =\n    !!selectedKey && !swatches.some((s) => s.key === selectedKey);\n\n  const publish = useEvent((next: string | null) => {\n    if (value === undefined) setInternalValue(next);\n\n    onChange?.(next);\n  });\n\n  const handleChange = useEvent((nextKey: string) => {\n    const parsed = parseColor(nextKey);\n\n    publish(parsed ? formatColor(parsed, format) : null);\n  });\n\n  const state = useRadioGroupState({\n    value: selectedKey ?? null,\n    isDisabled,\n    isReadOnly: props.isReadOnly,\n    onChange: handleChange,\n  });\n\n  // `useFocusableRef` wants the ref of a real focusable control to forward to,\n  // and a group of radios has no single one — `RadioGroup` takes the same\n  // approach for the same reason.\n  const domRef = useObjectRef(ref);\n  const { radioGroupProps, labelProps } = useRadioGroup(\n    {\n      ...props,\n      // Only name the group here when nothing else does: an `aria-label` set\n      // unconditionally would outrank the visible label React Aria wires up.\n      'aria-label': props.label ? undefined : ariaLabel ?? 'Colors',\n      orientation: 'horizontal',\n    },\n    state,\n  );\n\n  const group = (\n    <GroupElement\n      ref={domRef}\n      qa={qa || 'ColorSwatchGroup'}\n      data-size={size}\n      data-input-type=\"colorswatchgroup\"\n      styles={styles}\n      mods={{\n        ...getValidationMods({ isInvalid, isValid }),\n        columns: !!columns,\n      }}\n      style={columns ? { '--columns': String(columns) } : undefined}\n    >\n      <RadiosElement {...radioGroupProps}>\n        {swatches.map((swatch) => (\n          <Swatch\n            key={swatch.key}\n            colorKey={swatch.key}\n            label={swatch.label}\n            state={state}\n            isDisabled={isDisabled}\n            size={size}\n            styles={swatchStyles}\n          />\n        ))}\n      </RadiosElement>\n      {showCustom ? (\n        <ColorPicker\n          aria-label=\"Custom color\"\n          qa=\"ColorSwatchGroupCustom\"\n          format={format}\n          type=\"clear\"\n          size={SWATCH_PX[size] ?? SWATCH_PX.medium}\n          value={isCustom ? currentValue ?? null : null}\n          isDisabled={isDisabled}\n          isReadOnly={props.isReadOnly}\n          triggerStyles={CUSTOM_TRIGGER_STYLES}\n          swatchStyles={\n            isCustom ? CUSTOM_SWATCH_SELECTED_STYLES : CUSTOM_SWATCH_STYLES\n          }\n          onChange={publish}\n        >\n          {null}\n        </ColorPicker>\n      ) : null}\n    </GroupElement>\n  );\n\n  return wrapWithField(group, domRef, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, labelProps),\n  });\n});\n\n(ColorSwatchGroup as any).cubeInputType = 'Picker';\n"],"mappings":"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"}
+{"version":3,"file":"ColorSwatchGroup.js","names":["useFocus","mergeProps"],"sources":["../../../../src/components/fields/ColorSwatchGroup/ColorSwatchGroup.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  BLOCK_STYLES,\n  BlockStyleProps,\n  OUTER_STYLES,\n  OuterStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef, useMemo, useRef, useState } from 'react';\nimport { useRadio, useRadioGroup } from 'react-aria';\nimport { useRadioGroupState } from 'react-stately';\n\nimport { useEvent } from '../../../_internal';\nimport { FieldBaseProps } from '../../../shared';\nimport { mergeProps } from '../../../utils/react';\nimport { useFocus } from '../../../utils/react/interactions';\nimport { extractStyles } from '../../../utils/styles';\nimport { getValidationMods, useFieldProps, wrapWithField } from '../../form';\nimport { HiddenInput } from '../../HiddenInput';\nimport { ColorFormat, formatColor, parseColor, toHex } from '../color/color';\nimport { useIsInsideColorPopover } from '../color/context';\nimport { ColorPicker } from '../ColorPicker';\n\nimport type { RadioGroupState } from 'react-stately';\n\n/** A swatch: a color, and optionally a name to announce instead of the color. */\nexport type CubeColorSwatchItem = string | { color: string; label?: string };\n\n/**\n * Two rings drawn inside the swatch, as React Aria marks selection. Outer ring\n * first: earlier shadows paint over later ones, so this reads as 2bw of\n * `#surface-text` at the edge and 2bw of `#surface` within it. Two tones that\n * flip with the scheme stay visible against any color the swatch holds.\n */\nconst SELECTED_RING = 'inset 0 0 0 2bw #surface-text, inset 0 0 0 4bw #surface';\n\n/** The swatch edge in px, per size. `Item` takes an exact number. */\nconst SWATCH_PX: Record<string, number> = {\n  small: 16,\n  medium: 20,\n  large: 24,\n};\n\n/**\n * The trailing picker is a button wrapping a swatch, which would otherwise read\n * as a box inside a box. Stripping its chrome leaves just the swatch, so it\n * sits in the row as one of them.\n */\nconst CUSTOM_TRIGGER_STYLES: Styles = {\n  // `size` sets the control's height; the box is pinned here as well so a flex\n  // row cannot let the button size itself to its content instead.\n  width: '$swatch-size $swatch-size',\n  height: '$swatch-size $swatch-size',\n  padding: 0,\n  radius: '1r',\n  border: 0,\n  position: 'relative',\n};\n\n/**\n * The swatch is docked over the whole button rather than placed inside it.\n * `Item` lays its icon out in a grid that reserves room for a label even when\n * there is none, which left the swatch a pixel off centre.\n */\nconst CUSTOM_SWATCH_STYLES: Styles = {\n  position: 'absolute',\n  inset: 0,\n  width: 'auto',\n  height: 'auto',\n  radius: '1r',\n};\n\n/**\n * The ring goes on the swatch, not on the button around it: an inset shadow\n * paints under child content, and the swatch covers the button edge to edge.\n */\nconst CUSTOM_SWATCH_SELECTED_STYLES: Styles = {\n  ...CUSTOM_SWATCH_STYLES,\n  shadow: SELECTED_RING,\n};\n\nconst GroupElement = tasty({\n  qa: 'ColorSwatchGroup',\n  styles: {\n    // Wrapping is the better default: it is a single row wherever there is\n    // room, and folds instead of overflowing where there is not. A fixed\n    // `columns` switches to a grid, sized to the swatches rather than to the\n    // container — `1fr` tracks would stretch them apart.\n    display: {\n      '': 'flex',\n      columns: 'grid',\n    },\n    flow: {\n      '': 'row wrap',\n      columns: 'row',\n    },\n    gap: '.5x',\n    placeItems: {\n      '': 'center start',\n      columns: 'stretch',\n    },\n    width: {\n      '': 'auto',\n      columns: 'max-content',\n    },\n    gridColumns: 'repeat($columns, max-content)',\n\n    // 20px, 16px and 24px — 1x is 8px.\n    '$swatch-size': {\n      '': '2.5x',\n      'size=small': '2x',\n      'size=large': '3x',\n    },\n  },\n});\n\n/**\n * Only the swatches belong to the radiogroup. The custom picker is a button,\n * and inside `role=\"radiogroup\"` it both misreports what the palette holds and\n * hands arrow keys to React Aria's radio walker — pressing one while the picker\n * is focused jumps into a swatch and changes the color. The box is dropped so\n * the swatches remain direct children of the group's own layout.\n */\nconst RadiosElement = tasty({\n  styles: { display: 'contents' },\n});\n\nconst SwatchElement = tasty({\n  as: 'label',\n  qa: 'ColorSwatchOption',\n  styles: {\n    display: 'grid',\n    placeItems: 'stretch',\n    position: 'relative',\n    radius: '1r',\n    cursor: {\n      '': 'pointer',\n      disabled: 'default',\n    },\n    width: '$swatch-size $swatch-size',\n    height: '$swatch-size $swatch-size',\n    fill: '(#color-swatch, #clear)',\n    opacity: {\n      '': 1,\n      disabled: '$disabled-opacity',\n    },\n    // A ring at one border-width's distance, so the color area stays whole —\n    // the inner ring is the surface showing through as the gap. `outline` is\n    // deliberately left to the focus ring.\n    shadow: {\n      '': 'inset 0 0 0 1bw #dark.15',\n      selected: SELECTED_RING,\n    },\n    // A 1bw offset keeps the ring clear of the 4px gap to its neighbours.\n    outline: {\n      '': '2bw #focus.0 / 1bw',\n      focused: '2bw #focus / 1bw',\n    },\n    transition: 'theme',\n  },\n});\n\nexport interface CubeColorSwatchGroupProps\n  extends BaseProps,\n    OuterStyleProps,\n    BlockStyleProps,\n    FieldBaseProps {\n  /** The colors to offer. Duplicates of the same color are dropped. */\n  colors?: CubeColorSwatchItem[];\n  /** The selected color (controlled). */\n  value?: string | null;\n  /** The selected color (uncontrolled). */\n  defaultValue?: string | null;\n  /** Called with the chosen color, written in `format`. */\n  onChange?: (value: string | null) => void;\n  /** Notation the value is written in. */\n  format?: ColorFormat;\n  /** How many swatches per row. Defaults to a single row. */\n  columns?: number;\n  /**\n   * Append a `ColorPicker` for colors outside the set. Ignored inside a color\n   * popover, which is where that picker would otherwise recurse.\n   */\n  allowCustom?: boolean;\n  /** The size of each swatch. */\n  size?: 'small' | 'medium' | 'large' | (string & {});\n  styles?: Styles;\n  /** Styles of an individual swatch. */\n  swatchStyles?: Styles;\n  'aria-label'?: string;\n}\n\ninterface SwatchProps {\n  colorKey: string;\n  label: string;\n  state: RadioGroupState;\n  isDisabled?: boolean;\n  size?: string;\n  styles?: Styles;\n  mods?: Record<string, boolean | undefined>;\n}\n\nfunction Swatch({\n  colorKey,\n  label,\n  state,\n  isDisabled,\n  size,\n  styles,\n  mods,\n}: SwatchProps) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const {\n    inputProps,\n    isSelected,\n    isDisabled: isRadioDisabled,\n  } = useRadio(\n    { value: colorKey, 'aria-label': label, isDisabled },\n    state,\n    inputRef,\n  );\n  // `useRadio` reports selection but not focus, and the swatch is the only\n  // thing a keyboard user can see — without this the ring never appears.\n  const { isFocused, focusProps } = useFocus({ isDisabled }, true);\n\n  return (\n    <SwatchElement\n      data-size={size}\n      mods={{\n        selected: isSelected,\n        disabled: isRadioDisabled,\n        focused: isFocused,\n        ...mods,\n      }}\n      styles={styles}\n      style={{ '--color-swatch-color': colorKey }}\n    >\n      <HiddenInput\n        {...mergeProps(inputProps, focusProps)}\n        ref={inputRef}\n        qa=\"ColorSwatchInput\"\n        mods={{ button: true, disabled: isRadioDisabled }}\n      />\n    </SwatchElement>\n  );\n}\n\n/**\n * A grid of color swatches, one of which can be selected — the palette half of\n * choosing a color, where `ColorPicker` is the freeform half.\n *\n * Swatches are keyed by their canonical hex, so the same color written two ways\n * collapses into one entry. Equivalent colors would otherwise make selection\n * ambiguous.\n */\nexport const ColorSwatchGroup = forwardRef(function ColorSwatchGroup(\n  allProps: CubeColorSwatchGroupProps,\n  ref: ForwardedRef<HTMLElement>,\n) {\n  const props = useFieldProps(allProps, {\n    defaultValidationTrigger: 'onChange',\n    valuePropsMapper: ({ value, onChange }) => ({\n      value: value as string | null | undefined,\n      onChange,\n    }),\n  });\n\n  const {\n    qa,\n    colors = [],\n    value,\n    defaultValue,\n    onChange,\n    format = 'hex',\n    columns,\n    allowCustom,\n    size = 'medium',\n    isDisabled,\n    isInvalid,\n    isValid,\n    swatchStyles,\n    'aria-label': ariaLabel,\n  } = props;\n\n  const styles = extractStyles(props, [...OUTER_STYLES, ...BLOCK_STYLES]);\n  const isInsidePopover = useIsInsideColorPopover();\n  // A custom picker inside a color popover would open a popover of its own.\n  const showCustom = allowCustom && !isInsidePopover;\n\n  /** Keyed by canonical hex so the same color written two ways is one swatch. */\n  const swatches = useMemo(() => {\n    const seen = new Map<string, { key: string; label: string }>();\n\n    for (const entry of colors) {\n      const raw = typeof entry === 'string' ? entry : entry.color;\n      const parsed = parseColor(raw);\n\n      if (!parsed) continue;\n\n      const key = toHex(parsed);\n\n      if (seen.has(key)) continue;\n\n      seen.set(key, {\n        key,\n        label:\n          (typeof entry === 'string' ? undefined : entry.label) ??\n          formatColor(parsed, format),\n      });\n    }\n\n    return [...seen.values()];\n  }, [colors, format]);\n\n  const [internalValue, setInternalValue] = useState<string | null>(\n    () => defaultValue ?? null,\n  );\n  const currentValue = value !== undefined ? value : internalValue;\n\n  const selectedColor = parseColor((currentValue ?? '').toString());\n  const selectedKey = selectedColor ? toHex(selectedColor) : null;\n  const isCustom =\n    !!selectedKey && !swatches.some((s) => s.key === selectedKey);\n\n  const publish = useEvent((next: string | null) => {\n    if (value === undefined) setInternalValue(next);\n\n    onChange?.(next);\n  });\n\n  const handleChange = useEvent((nextKey: string) => {\n    const parsed = parseColor(nextKey);\n\n    publish(parsed ? formatColor(parsed, format) : null);\n  });\n\n  const state = useRadioGroupState({\n    value: selectedKey ?? null,\n    isDisabled,\n    isReadOnly: props.isReadOnly,\n    onChange: handleChange,\n  });\n\n  // `useFocusableRef` wants the ref of a real focusable control to forward to,\n  // and a group of radios has no single one — `RadioGroup` takes the same\n  // approach for the same reason.\n  const domRef = useObjectRef(ref);\n  const { radioGroupProps, labelProps } = useRadioGroup(\n    {\n      ...props,\n      // Only name the group here when nothing else does: an `aria-label` set\n      // unconditionally would outrank the visible label React Aria wires up.\n      'aria-label': props.label ? undefined : ariaLabel ?? 'Colors',\n      orientation: 'horizontal',\n    },\n    state,\n  );\n\n  const group = (\n    <GroupElement\n      ref={domRef}\n      qa={qa || 'ColorSwatchGroup'}\n      data-size={size}\n      data-input-type=\"colorswatchgroup\"\n      styles={styles}\n      mods={{\n        ...getValidationMods({ isInvalid, isValid }),\n        columns: !!columns,\n      }}\n      style={columns ? { '--columns': String(columns) } : undefined}\n    >\n      <RadiosElement {...radioGroupProps}>\n        {swatches.map((swatch) => (\n          <Swatch\n            key={swatch.key}\n            colorKey={swatch.key}\n            label={swatch.label}\n            state={state}\n            isDisabled={isDisabled}\n            size={size}\n            styles={swatchStyles}\n          />\n        ))}\n      </RadiosElement>\n      {showCustom ? (\n        <ColorPicker\n          aria-label=\"Custom color\"\n          qa=\"ColorSwatchGroupCustom\"\n          format={format}\n          type=\"clear\"\n          size={SWATCH_PX[size] ?? SWATCH_PX.medium}\n          value={isCustom ? currentValue ?? null : null}\n          isDisabled={isDisabled}\n          isReadOnly={props.isReadOnly}\n          triggerStyles={CUSTOM_TRIGGER_STYLES}\n          swatchStyles={\n            isCustom ? CUSTOM_SWATCH_SELECTED_STYLES : CUSTOM_SWATCH_STYLES\n          }\n          onChange={publish}\n        >\n          {null}\n        </ColorPicker>\n      ) : null}\n    </GroupElement>\n  );\n\n  return wrapWithField(group, domRef, {\n    ...props,\n    labelProps: mergeProps(props.labelProps, labelProps),\n  });\n});\n\n(ColorSwatchGroup as any).cubeInputType = 'Picker';\n"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.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";

package/dist/components/fields/CommandTextArea/CommandTextArea.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/CommandTextArea/caretPosition.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 //#region src/components/fields/CommandTextArea/caretPosition.ts
 const MIRROR_STYLES = [
 	"boxSizing",

package/dist/components/fields/CommandTextArea/useCaretAnchor.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { getCaretRect } from "./caretPosition.js";
 import { useEffect, useLayoutEffect, useRef } from "react";
 

package/dist/components/fields/DatePicker/DateInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";

package/dist/components/fields/DatePicker/DateInputBase.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";

package/dist/components/fields/DatePicker/DatePicker.js

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

package/dist/components/fields/DatePicker/DatePickerButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { CalendarIcon } from "../../../icons/CalendarIcon.js";

package/dist/components/fields/DatePicker/DatePickerElement.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { Space } from "../../layout/Space.js";
 import { tasty } from "@tenphi/tasty";
 

package/dist/components/fields/DatePicker/DatePickerInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { DatePickerSegment } from "./DatePickerSegment.js";
 import { formatSegments } from "./utils.js";

package/dist/components/fields/DatePicker/DatePickerSegment.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 import { useRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/DatePicker/DateRangePicker.js

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

package/dist/components/fields/DatePicker/DateRangeSeparatedPicker.js

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

package/dist/components/fields/DatePicker/MonthPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/DatePicker/PeriodPicker.js

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

package/dist/components/fields/DatePicker/QuarterPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/DatePicker/TimeInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";

package/dist/components/fields/DatePicker/WeekPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/DatePicker/YearPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { _PeriodPicker } from "./PeriodPicker.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/DatePicker/parseDate.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.171.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.172.0 | Cube Dev Team */
 import { parseAbsolute } from "@internationalized/date";
 
 //#region src/components/fields/DatePicker/parseDate.ts