@cube-dev/ui-kit 0.0.0-canary-c325dcb → 0.0.0-canary-162cdb3

package/dist/utils/react/usePopoverSync.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 import { EventBusContext, useEventBus } from "./useEventBus.js";
 import { c } from "react/compiler-runtime";
 import { useContext, useEffect, useEffectEvent, useRef } from "react";

package/dist/utils/react/useQaProps.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 //#region src/utils/react/useQaProps.ts
 /**
 * Processes QA props.

package/dist/utils/react/useScheme.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 import { useSyncExternalStore } from "react";
 
 //#region src/utils/react/useScheme.ts

package/dist/utils/react/useViewportSize.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { useEffect, useState } from "react";
 

package/dist/utils/react/wrapNodeIfPlain.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 import { Fragment, isValidElement } from "react";
 
 //#region src/utils/react/wrapNodeIfPlain.ts

package/dist/utils/selection.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 //#region src/utils/selection.ts
 /**
 * Deduplicate/toggle keys in a selection: if a key appears twice it is

package/dist/utils/styles.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 import { isSelector, mergeStyles } from "@tenphi/tasty";
 
 //#region src/utils/styles.ts

package/dist/utils/tree.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 //#region src/utils/tree.ts
 function toFlatTree(tree, includingFolders) {
 	return tree.reduce((result, node) => {

package/dist/utils/warnings.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 import { isDevEnvOrTest } from "./is-dev-env.js";
 
 //#region src/utils/warnings.ts

package/dist/version.js

@@ -1,6 +1,6 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-c325dcb | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-162cdb3 | Cube Dev Team */
 //#region src/version.ts
-const VERSION = "0.0.0-canary-c325dcb";
+const VERSION = "0.0.0-canary-162cdb3";
 const TASTY_VERSION = "3.9.9";
 if (typeof window !== "undefined") {
 	const version = VERSION;

package/docs/components/data/ItemTable.md

@@ -700,7 +700,7 @@ They do compose if you need it — set `isReorderable` as well and a row that re
 <ItemTable isResizable storageKey="deployments" data={rows} columns={columns} />
 ```
 
-It is built on React Aria's `useMove` — the same hook behind `Board`'s widgets — so the handle takes **keyboard** input for free: focus it and use the arrow keys, or Home/End to jump to the column's minimum and maximum. Widths clamp to each column's `minWidth` / `maxWidth`, and a column opts out with `isResizable: false`.
+It is built on React Aria's `useMove` — the same hook behind `ResizablePanel` — so the handle takes **keyboard** input for free: focus it and use the arrow keys, or Home/End to jump to the column's minimum and maximum. Widths clamp to each column's `minWidth` / `maxWidth`, and a column opts out with `isResizable: false`.
 
 `onColumnResize` fires once the gesture ends rather than on every pixel, and `columnWidths` is in the default `persist` list, so pairing `isResizable` with `storageKey` makes a resized table come back the way the user left it.
 

package/docs/components/navigation/Tabs.md

@@ -850,9 +850,15 @@ Tabs work seamlessly inside Layout components. When placed in a `Layout` or `Lay
 - Tab panels use `display: contents`, allowing children to participate in parent flex layout
 - Nested Layout components with `flexGrow: 1` (default) stretch to fill remaining space
 
-### Inside a Board (spring-loaded switching)
+### Inside a board (spring-loaded switching)
 
-When `Tabs` is rendered inside a [`Board`](../layout/Board.md), tab switching becomes spring-loaded automatically: while a Board widget is being dragged, hovering a tab header for a moment opens that tab, so a widget can be dropped into it or moved between tabs. This requires no configuration - `Tabs` detects the active Board drag and, for its duration, keeps panels mounted so the tab a widget is dragged out of (and the board owning the in-flight gesture) is not unmounted mid-drag. Spring-loading works with mouse and pen; touch drags capture the pointer and do not trigger it. Outside a `Board` this behavior is inert.
+A board of draggable widgets (Cube Cloud owns one) can wrap the subtree it renders in `BoardDragActiveProvider` and pass whether a widget drag is in flight. `Tabs` inside it then switch spring-loaded: while a widget is being dragged, hovering a tab header for a moment opens that tab, so a widget can be dropped into it or moved between tabs. For the drag's duration `Tabs` also keeps visited panels mounted, so the tab a widget is dragged out of (and the board owning the in-flight gesture) is not unmounted mid-drag. Spring-loading listens for native pointer enter on the tab headers, so the board's drag must not capture the pointer (React Aria's `useMove` does not) and the dragged element must be `pointer-events: none`. It works with mouse and pen; touch drags capture the pointer and do not trigger it. Outside a `BoardDragActiveProvider`, or while it reports no drag, this behavior is inert.
+
+```tsx
+<BoardDragActiveProvider isActive={dragState != null}>
+  <Tabs>…</Tabs>
+</BoardDragActiveProvider>
+```
 
 ## Accessibility
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.0.0-canary-c325dcb",
+  "version": "0.0.0-canary-162cdb3",
   "type": "module",
   "description": "UIKit for Cube Projects",
   "repository": {

package/dist/components/layout/Board/Board.d.ts

@@ -1,253 +0,0 @@
-
-import { CollisionMode, LayoutConstraint, LayoutItem, ResizeHandleAxis } from "./grid-core/types.js";
-import { BoardSelectionMode } from "./use-board-selection.js";
-import { BoardLayoutChangeInfo } from "./use-board-layout.js";
-import { BoardResizeGripPlacement, CubeBoardWidgetProps } from "./Widget.js";
-import { AllBaseProps, ContainerStyleProps } from "@tenphi/tasty";
-import { ReactNode } from "react";
-
-//#region src/components/layout/Board/Board.d.ts
-type BoardCompactType = 'vertical' | 'horizontal' | 'free' | null;
-/**
- * Payload passed to the drag/resize lifecycle callbacks. `layout` is the board's
- * current layout at the moment the callback fires, `item` is the affected item
- * (falls back to `oldItem` if the item just left this board via a cross-board
- * transfer), `oldItem` is that item as it was when the gesture started, and
- * `placeholder` is the current drop-slot preview (if any).
- *
- * The plural fields describe the whole gesture: a group drag moves every
- * selected widget at once, so `items`/`oldItems`/`placeholders` list them all,
- * grabbed widget first. An ordinary drag or a resize produces exactly one entry,
- * so `items[0] === item` and `placeholders[0] === placeholder` always hold.
- */
-interface BoardInteractionInfo {
-  layout: LayoutItem[];
-  item: LayoutItem;
-  oldItem: LayoutItem;
-  placeholder: LayoutItem | null;
-  /** Every item in this gesture, grabbed first. */
-  items: LayoutItem[];
-  /** Those items as they were when the gesture started, same order. */
-  oldItems: LayoutItem[];
-  /** Every drop-slot preview. Empty exactly when `placeholder` is `null`. */
-  placeholders: LayoutItem[];
-}
-/** Visibility of the internal grid-line overlay. */
-type BoardGridLines = boolean | 'drag' | 'any-drag';
-/**
- * The subset of `Board.Widget` props a `Board` can set as defaults for every
- * widget it hosts (via `widgetProps`). Excludes `id`/`children`, which are
- * per-widget. Per-widget `Board.Widget` props override these.
- */
-type CubeBoardWidgetDefaults = Omit<CubeBoardWidgetProps, 'id' | 'children'>;
-interface CubeBoardProps extends Omit<AllBaseProps, 'children' | 'onDragStart' | 'onDrag' | 'onResize'>, Omit<ContainerStyleProps, 'margin'> {
-  /** Stable board id (used for cross-board drag). Auto-generated if omitted. */
-  id?: string;
-  /** Controlled layout. */
-  layout?: LayoutItem[];
-  /** Initial layout for uncontrolled usage. */
-  defaultLayout?: LayoutItem[];
-  onLayoutChange?: (layout: LayoutItem[], info: BoardLayoutChangeInfo) => void;
-  /** Called when a drag gesture starts. */
-  onDragStart?: (info: BoardInteractionInfo) => void;
-  /** Called on every step of a drag gesture. */
-  onDrag?: (info: BoardInteractionInfo) => void;
-  /** Called when a drag gesture ends (after the layout is committed). */
-  onDragStop?: (info: BoardInteractionInfo) => void;
-  /** Called when a resize gesture starts. */
-  onResizeStart?: (info: BoardInteractionInfo) => void;
-  /** Called on every step of a resize gesture. */
-  onResize?: (info: BoardInteractionInfo) => void;
-  /** Called when a resize gesture ends (after the layout is committed). */
-  onResizeStop?: (info: BoardInteractionInfo) => void;
-  /** Number of columns. @default 12 */
-  cols?: number;
-  /**
-   * Render exactly this many rows, whatever the content needs — a fixed
-   * `cols × rows` matrix rather than a grid that hugs its widgets. Implies a
-   * `maxRows` of the same value, so the grid's own bounds constraint keeps every
-   * drag and resize inside the matrix. Pair with `rowHeight="stretch"` for a
-   * matrix that fills the box it is given.
-   */
-  rows?: number;
-  /**
-   * Row height in pixels, or `'stretch'` to divide the board's own measured
-   * height into its rows. `'stretch'` is what makes a fixed `rows × cols` matrix
-   * fill its container: the board fills the height it is given and each cell
-   * takes an equal share of it, so resizing the container resizes the cells
-   * instead of adding or removing them.
-   *
-   * Requires {@link rows}. Without a declared row count there is no matrix to
-   * fill, and dividing by the content extent instead would resize every cell
-   * whenever a widget landed on a new row — so the mode does not engage and the
-   * board keeps its ordinary content-hugging behaviour at the default height.
-   * @default 100
-   */
-  rowHeight?: number | 'stretch';
-  /** [horizontal, vertical] margin between widgets in pixels. @default [8, 8] */
-  margin?: [number, number];
-  /**
-   * [horizontal, vertical] padding inside the board. Defaults to `margin`, or
-   * to `[0, 0]` for an aligned nested board (`isAligned`) so its grid lines up
-   * with the ancestor board's.
-   */
-  containerPadding?: [number, number];
-  /** Maximum number of rows. @default Infinity */
-  maxRows?: number;
-  /**
-   * Empty grid rows kept below the content. The board renders this many rows
-   * taller than its widgets need, so there is always somewhere to start a
-   * marquee and somewhere to drop a widget past the end — a board that hugs its
-   * content has neither once the grid is full. Clamped by `maxRows`.
-   * @default 0
-   */
-  extraRows?: number;
-  /**
-   * Compaction behavior. `'vertical'` / `'horizontal'` reflow widgets to remove
-   * gaps; `'free'` places each widget exactly where dropped and never pushes its
-   * neighbours (pair with `allowOverlap` to let widgets stack, otherwise moving
-   * onto an occupied cell is blocked); `null` disables compaction but still
-   * resolves collisions the legacy react-grid-layout way. @default 'vertical'
-   */
-  compact?: BoardCompactType;
-  /** Allow widgets to overlap. @default false */
-  allowOverlap?: boolean;
-  /** Block movement into occupied cells instead of pushing. @default false */
-  preventCollision?: boolean;
-  /**
-   * How to resolve a drop the grid would otherwise refuse. Only applies where a
-   * collision blocks a move - `compact="free"` (which prevents collisions) or an
-   * explicit `preventCollision` - and never under `allowOverlap`. `'revert'`
-   * snaps the widget back, `'downscale'` shrinks it into the free space at the
-   * drop cell. Within this board, `'swap'` trades places with one widget - the one
-   * the drop covers most - which takes the cell the drag began at (falling back to
-   * `'downscale'`, then `'revert'`). For a widget arriving from another board there
-   * is no slot to trade back, so `'swap'` behaves as `'downscale'`: the widget
-   * downscales into the room to its right/below, and an occupied anchor holds the
-   * cell the preview last found (the nearest fitting one, if the widget arrived
-   * over an occupied cell) rather than cancelling the transfer. No mode ever
-   * grows a widget, an
-   * in-board swap never displaces more than one widget, and a drop that spans two
-   * widgets trades with one of them rather than blinking away mid-drag.
-   *
-   * Applies to single-widget drags. Arrow keys honour it too, but never resize
-   * anything: each press is a gesture of its own, so a press that shrank a widget
-   * would have nothing to restore from. A multi-widget selection still only moves
-   * where it fits outright, and a resize is still blocked by a collision.
-   * @default 'revert'
-   */
-  collisionMode?: CollisionMode;
-  /** Enable dragging for all widgets. @default true */
-  isDraggable?: boolean;
-  /** Enable resizing for all widgets. @default true */
-  isResizable?: boolean;
-  /** Whether this board accepts widgets dropped from other boards. @default true */
-  isDroppable?: boolean;
-  /** Which resize handles to show. @default ['se'] */
-  resizeHandles?: ResizeHandleAxis[];
-  /**
-   * Where the corner resize grips sit: `'inside'` tucks them into the widget
-   * box, `'corner'` centres each one on the widget's corner so it lines up with a
-   * control centred on the opposite corner. Only affects corner handles. Can be
-   * overridden per widget on `Board.Widget`.
-   * @default 'inside'
-   */
-  resizeGripPlacement?: BoardResizeGripPlacement;
-  /**
-   * CSS selector for elements that must not start a pointer drag.
-   *
-   * Defaults to {@link BOARD_SELECTION_CANCEL} — the same set `selectionCancel`
-   * uses — because a control inside a widget has to keep its own press whether
-   * or not the board happens to support selection. Pass a selector of your own
-   * to narrow or widen it, or `''` to let a drag start from anywhere.
-   *
-   * Does not affect keyboard moves — those only run when the widget host itself
-   * is focused. Can be overridden per widget on `Board.Widget`.
-   */
-  dragCancel?: string;
-  /**
-   * CSS selector for the only elements from which a pointer drag may start.
-   * Can be overridden per widget on `Board.Widget`.
-   */
-  dragHandle?: string;
-  /**
-   * Show grid lines behind the widgets. `true` always shows them, `false` never,
-   * `'drag'` only while *this* board is part of the active gesture - it owns the
-   * drag (as its source or as the board the widget is currently over), or one of
-   * its own widgets is being resized. `'any-drag'` widens that to any drag
-   * anywhere under a shared `Board.Provider`, so every board advertises itself as
-   * a place the widget could land.
-   * @default false
-   */
-  showGridLines?: BoardGridLines;
-  /**
-   * Align this board's grid with an ancestor `Board`'s layout. Only takes
-   * effect when the board is nested inside another `Board`'s widget. When set,
-   * every cell matches the parent's cell size exactly: the board inherits the
-   * parent's column pitch (deriving its own column count from its measured
-   * width) and uses the parent's row height verbatim. It never shrinks rows to
-   * fit; pair it with an `isAutoHeight` container so the widget grows to fit its
-   * rows at that height. @default false
-   */
-  isAligned?: boolean;
-  /**
-   * Whether widgets can be selected, and how many at a time. `'multiple'` also
-   * enables the marquee and rigid group movement: dragging any selected widget
-   * moves the whole selection. @default 'none'
-   */
-  selectionMode?: BoardSelectionMode;
-  /** Controlled selection. Keys are layout item ids (`LayoutItem.i`). */
-  selectedKeys?: string[];
-  /** Initial selection for uncontrolled usage. */
-  defaultSelectedKeys?: string[];
-  /**
-   * Called when the selection changes. Keys are deduped and returned in the
-   * board's layout order, never in click order.
-   */
-  onSelectionChange?: (keys: string[]) => void;
-  /**
-   * CSS selector for descendants whose clicks must never change the selection
-   * (form controls, buttons, links). Mirrors `dragCancel`; can be overridden per
-   * widget. Pass `''` to disable the guard entirely.
-   * @default BOARD_SELECTION_CANCEL
-   */
-  selectionCancel?: string;
-  /**
-   * Draw a rubber-band (marquee) selection when a drag starts on empty board
-   * space. Only meaningful with `selectionMode="multiple"`.
-   * @default selectionMode === 'multiple'
-   */
-  allowMarqueeSelection?: boolean;
-  /**
-   * Called when the user presses <kbd>Delete</kbd>/<kbd>Backspace</kbd> with a
-   * non-empty selection, and focus is inside the board but not in an editable
-   * field. Board never mutates the layout itself — removing the widgets is the
-   * consumer's job. Board only handles these keys when this handler is set.
-   */
-  onWidgetsDelete?: (keys: string[]) => void;
-  /** Grid/item layout constraints. */
-  constraints?: LayoutConstraint[];
-  /**
-   * Explicit container width in pixels. When provided, disables automatic width
-   * measurement (useful for SSR and tests).
-   */
-  width?: number;
-  /**
-   * Default props applied to every widget this board hosts. Per-widget
-   * `Board.Widget` props override these. Use it to add a card border to every
-   * widget (`widgetProps={{ isCard: true }}`) or set shared sizing/`styles`
-   * defaults without repeating them on each `Board.Widget`.
-   */
-  widgetProps?: Partial<CubeBoardWidgetDefaults>;
-  children?: ReactNode;
-}
-/**
- * Descendants whose clicks never change the selection. A widget is a large
- * surface the user also clicks to *work with*, so anything interactive inside it
- * must keep its click. `[data-no-select]` is the escape hatch for an app's own
- * custom controls.
- */
-declare const BOARD_SELECTION_CANCEL: string;
-//#endregion
-export { BOARD_SELECTION_CANCEL, BoardCompactType, BoardGridLines, BoardInteractionInfo, CubeBoardProps };
-//# sourceMappingURL=Board.d.ts.map