@cube-dev/ui-kit 0.145.4 → 0.146.1

package/dist/components/form/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","names":[],"sources":["../../../src/components/form/Label.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport { useProviderProps } from '../../provider';\nimport {\n  LabelPosition,\n  NecessityIndicator,\n  ValidationState,\n} from '../../shared/index';\nimport { extractStyles } from '../../utils/styles';\n\nconst REQUIRED_ICON = (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    version=\"1.1\"\n    x=\"0px\"\n    y=\"0px\"\n    viewBox=\"0 0 100 125\"\n    style={{\n      // @ts-ignore\n      enableBackground: 'new 0 0 100 100',\n      width: '.8em',\n      height: '.8em',\n      transform: 'rotate(-5deg)',\n    }}\n  >\n    <switch>\n      <g>\n        <polygon\n          fill=\"currentColor\"\n          points=\"97.5,47.5 90.5,26.1 61.3,35.6 61.3,4.8 38.7,4.8 38.7,35.6 9.5,26.1 2.5,47.5 31.8,57 13.7,82 31.9,95.2     50,70.3 68.1,95.2 86.3,82 68.2,57\"\n        />\n      </g>\n    </switch>\n  </svg>\n);\n\nconst INTL_MESSAGES = {\n  '(required)': '(required)',\n  '(optional)': '(optional)',\n};\n\nexport const INLINE_LABEL_STYLES: Styles = {\n  preset: 't3',\n  color: {\n    '': '#dark-02',\n    invalid: '#danger-text',\n  },\n} as const;\n\nexport const LABEL_STYLES: Styles = {\n  display: 'block',\n  preset: {\n    '': 't3m',\n    'size=small': 't4',\n  },\n  color: {\n    '': '#dark',\n    invalid: '#danger-text',\n  },\n  width: {\n    '': 'initial',\n    side: '($label-width, initial)',\n    split: 'initial',\n  },\n};\n\nconst LabelElement = tasty({\n  as: 'label',\n  qa: 'Label',\n  styles: LABEL_STYLES,\n});\n\nexport interface CubeLabelProps extends BaseProps, ContainerStyleProps {\n  labelPosition?: LabelPosition;\n  necessityIndicator?: NecessityIndicator;\n  isRequired?: boolean;\n  includeNecessityIndicatorInAccessibilityName?: boolean;\n  htmlFor?: string;\n  for?: string;\n  validationState?: ValidationState;\n  size?: 'medium' | 'small';\n}\n\nfunction Label(props: CubeLabelProps, ref) {\n  props = useProviderProps<CubeLabelProps>(props);\n\n  let {\n    as,\n    qa,\n    children,\n    labelPosition = 'top',\n    isRequired,\n    necessityIndicator = isRequired != null ? 'icon' : null,\n    includeNecessityIndicatorInAccessibilityName = false,\n    htmlFor,\n    isDisabled,\n    validationState,\n    size = 'medium',\n    for: labelFor,\n    ...otherProps\n  } = props;\n\n  let domRef = useObjectRef(ref);\n\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  let formatMessage = (message) => INTL_MESSAGES[message];\n  let necessityLabel = isRequired\n    ? formatMessage('(required)')\n    : formatMessage('(optional)');\n  let icon = (\n    <span\n      aria-label={\n        includeNecessityIndicatorInAccessibilityName\n          ? formatMessage('(required)')\n          : undefined\n      }\n    >\n      {REQUIRED_ICON}\n    </span>\n  );\n\n  return (\n    <LabelElement\n      {...filterBaseProps(otherProps)}\n      ref={domRef}\n      styles={styles}\n      htmlFor={labelFor || htmlFor}\n      data-size={size}\n      mods={{\n        side: labelPosition === 'side',\n        disabled: isDisabled,\n        invalid: validationState === 'invalid',\n        valid: validationState === 'valid',\n      }}\n    >\n      {typeof children !== 'string' ? (\n        children\n      ) : (\n        <>\n          {children}\n          {(necessityIndicator === 'label' ||\n            (necessityIndicator === 'icon' && isRequired)) &&\n            ' \\u200b'}\n          {/* necessityLabel is hidden to screen readers if the field is required because\n           * aria-required is set on the field in that case. That will already be announced,\n           * so no need to duplicate it here. If optional, we do want it to be announced here. */}\n          {necessityIndicator === 'label' && (\n            <span\n              aria-hidden={\n                !includeNecessityIndicatorInAccessibilityName\n                  ? isRequired\n                  : undefined\n              }\n            >\n              {necessityLabel}\n            </span>\n          )}\n          {necessityIndicator === 'icon' && isRequired && icon}\n        </>\n      )}\n    </LabelElement>\n  );\n}\n\nlet _Label = forwardRef(Label);\n\n_Label.displayName = 'Label';\n\nexport { _Label as Label };\n"],"mappings":";;;;;;;;;AAmBA,MAAM,gBACJ,oBAAC;CACC,OAAM;CACN,SAAQ;CACR,GAAE;CACF,GAAE;CACF,SAAQ;CACR,OAAO;EAEL,kBAAkB;EAClB,OAAO;EACP,QAAQ;EACR,WAAW;EACZ;WAED,oBAAC,sBACC,oBAAC,iBACC,oBAAC;EACC,MAAK;EACL,QAAO;GACP,GACA,GACG;EACL;AAGR,MAAM,gBAAgB;CACpB,cAAc;CACd,cAAc;CACf;AAED,MAAa,sBAA8B;CACzC,QAAQ;CACR,OAAO;EACL,IAAI;EACJ,SAAS;EACV;CACF;AAED,MAAa,eAAuB;CAClC,SAAS;CACT,QAAQ;EACN,IAAI;EACJ,cAAc;EACf;CACD,OAAO;EACL,IAAI;EACJ,SAAS;EACV;CACD,OAAO;EACL,IAAI;EACJ,MAAM;EACN,OAAO;EACR;CACF;AAED,MAAM,eAAe,MAAM;CACzB,IAAI;CACJ,IAAI;CACJ,QAAQ;CACT,CAAC;AAaF,SAAS,MAAM,OAAuB,KAAK;AACzC,SAAQ,iBAAiC,MAAM;CAE/C,IAAI,EACF,IACA,IACA,UACA,gBAAgB,OAChB,YACA,qBAAqB,cAAc,OAAO,SAAS,MACnD,+CAA+C,OAC/C,SACA,YACA,iBACA,OAAO,UACP,KAAK,UACL,GAAG,eACD;CAEJ,IAAI,SAAS,aAAa,IAAI;CAE9B,MAAM,SAAS,cAAc,YAAY,iBAAiB;CAE1D,IAAI,iBAAiB,YAAY,cAAc;CAC/C,IAAI,iBAAiB,aACjB,cAAc,aAAa,GAC3B,cAAc,aAAa;CAC/B,IAAI,OACF,oBAAC;EACC,cACE,+CACI,cAAc,aAAa,GAC3B;YAGL;GACI;AAGT,QACE,oBAAC;EACC,GAAI,gBAAgB,WAAW;EAC/B,KAAK;EACG;EACR,SAAS,YAAY;EACrB,aAAW;EACX,MAAM;GACJ,MAAM,kBAAkB;GACxB,UAAU;GACV,SAAS,oBAAoB;GAC7B,OAAO,oBAAoB;GAC5B;YAEA,OAAO,aAAa,WACnB,WAEA;GACG;IACC,uBAAuB,WACtB,uBAAuB,UAAU,eAClC;GAID,uBAAuB,WACtB,oBAAC;IACC,eACE,CAAC,+CACG,aACA;cAGL;KACI;GAER,uBAAuB,UAAU,cAAc;MAC/C;GAEQ;;AAInB,IAAI,SAAS,WAAW,MAAM;AAE9B,OAAO,cAAc"}
+{"version":3,"file":"Label.js","names":[],"sources":["../../../src/components/form/Label.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport { useI18n } from '../../i18n';\nimport { useProviderProps } from '../../provider';\nimport {\n  LabelPosition,\n  NecessityIndicator,\n  ValidationState,\n} from '../../shared/index';\nimport { extractStyles } from '../../utils/styles';\n\nconst REQUIRED_ICON = (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    version=\"1.1\"\n    x=\"0px\"\n    y=\"0px\"\n    viewBox=\"0 0 100 125\"\n    style={{\n      // @ts-ignore\n      enableBackground: 'new 0 0 100 100',\n      width: '.8em',\n      height: '.8em',\n      transform: 'rotate(-5deg)',\n    }}\n  >\n    <switch>\n      <g>\n        <polygon\n          fill=\"currentColor\"\n          points=\"97.5,47.5 90.5,26.1 61.3,35.6 61.3,4.8 38.7,4.8 38.7,35.6 9.5,26.1 2.5,47.5 31.8,57 13.7,82 31.9,95.2     50,70.3 68.1,95.2 86.3,82 68.2,57\"\n        />\n      </g>\n    </switch>\n  </svg>\n);\n\nexport const INLINE_LABEL_STYLES: Styles = {\n  preset: 't3',\n  color: {\n    '': '#dark-02',\n    invalid: '#danger-text',\n  },\n} as const;\n\nexport const LABEL_STYLES: Styles = {\n  display: 'block',\n  preset: {\n    '': 't3m',\n    'size=small': 't4',\n  },\n  color: {\n    '': '#dark',\n    invalid: '#danger-text',\n  },\n  width: {\n    '': 'initial',\n    side: '($label-width, initial)',\n    split: 'initial',\n  },\n};\n\nconst LabelElement = tasty({\n  as: 'label',\n  qa: 'Label',\n  styles: LABEL_STYLES,\n});\n\nexport interface CubeLabelProps extends BaseProps, ContainerStyleProps {\n  labelPosition?: LabelPosition;\n  necessityIndicator?: NecessityIndicator;\n  isRequired?: boolean;\n  includeNecessityIndicatorInAccessibilityName?: boolean;\n  htmlFor?: string;\n  for?: string;\n  validationState?: ValidationState;\n  size?: 'medium' | 'small';\n}\n\nfunction Label(props: CubeLabelProps, ref) {\n  props = useProviderProps<CubeLabelProps>(props);\n\n  const { t } = useI18n();\n\n  let {\n    as,\n    qa,\n    children,\n    labelPosition = 'top',\n    isRequired,\n    necessityIndicator = isRequired != null ? 'icon' : null,\n    includeNecessityIndicatorInAccessibilityName = false,\n    htmlFor,\n    isDisabled,\n    validationState,\n    size = 'medium',\n    for: labelFor,\n    ...otherProps\n  } = props;\n\n  let domRef = useObjectRef(ref);\n\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  let requiredLabel = t('form.required', '(required)');\n  let necessityLabel = isRequired\n    ? requiredLabel\n    : t('form.optional', '(optional)');\n  let icon = (\n    <span\n      aria-label={\n        includeNecessityIndicatorInAccessibilityName ? requiredLabel : undefined\n      }\n    >\n      {REQUIRED_ICON}\n    </span>\n  );\n\n  return (\n    <LabelElement\n      {...filterBaseProps(otherProps)}\n      ref={domRef}\n      styles={styles}\n      htmlFor={labelFor || htmlFor}\n      data-size={size}\n      mods={{\n        side: labelPosition === 'side',\n        disabled: isDisabled,\n        invalid: validationState === 'invalid',\n        valid: validationState === 'valid',\n      }}\n    >\n      {typeof children !== 'string' ? (\n        children\n      ) : (\n        <>\n          {children}\n          {(necessityIndicator === 'label' ||\n            (necessityIndicator === 'icon' && isRequired)) &&\n            ' \\u200b'}\n          {/* necessityLabel is hidden to screen readers if the field is required because\n           * aria-required is set on the field in that case. That will already be announced,\n           * so no need to duplicate it here. If optional, we do want it to be announced here. */}\n          {necessityIndicator === 'label' && (\n            <span\n              aria-hidden={\n                !includeNecessityIndicatorInAccessibilityName\n                  ? isRequired\n                  : undefined\n              }\n            >\n              {necessityLabel}\n            </span>\n          )}\n          {necessityIndicator === 'icon' && isRequired && icon}\n        </>\n      )}\n    </LabelElement>\n  );\n}\n\nlet _Label = forwardRef(Label);\n\n_Label.displayName = 'Label';\n\nexport { _Label as Label };\n"],"mappings":";;;;;;;;;;AAoBA,MAAM,gBACJ,oBAAC;CACC,OAAM;CACN,SAAQ;CACR,GAAE;CACF,GAAE;CACF,SAAQ;CACR,OAAO;EAEL,kBAAkB;EAClB,OAAO;EACP,QAAQ;EACR,WAAW;EACZ;WAED,oBAAC,sBACC,oBAAC,iBACC,oBAAC;EACC,MAAK;EACL,QAAO;GACP,GACA,GACG;EACL;AAGR,MAAa,sBAA8B;CACzC,QAAQ;CACR,OAAO;EACL,IAAI;EACJ,SAAS;EACV;CACF;AAED,MAAa,eAAuB;CAClC,SAAS;CACT,QAAQ;EACN,IAAI;EACJ,cAAc;EACf;CACD,OAAO;EACL,IAAI;EACJ,SAAS;EACV;CACD,OAAO;EACL,IAAI;EACJ,MAAM;EACN,OAAO;EACR;CACF;AAED,MAAM,eAAe,MAAM;CACzB,IAAI;CACJ,IAAI;CACJ,QAAQ;CACT,CAAC;AAaF,SAAS,MAAM,OAAuB,KAAK;AACzC,SAAQ,iBAAiC,MAAM;CAE/C,MAAM,EAAE,MAAM,SAAS;CAEvB,IAAI,EACF,IACA,IACA,UACA,gBAAgB,OAChB,YACA,qBAAqB,cAAc,OAAO,SAAS,MACnD,+CAA+C,OAC/C,SACA,YACA,iBACA,OAAO,UACP,KAAK,UACL,GAAG,eACD;CAEJ,IAAI,SAAS,aAAa,IAAI;CAE9B,MAAM,SAAS,cAAc,YAAY,iBAAiB;CAE1D,IAAI,gBAAgB,EAAE,iBAAiB,aAAa;CACpD,IAAI,iBAAiB,aACjB,gBACA,EAAE,iBAAiB,aAAa;CACpC,IAAI,OACF,oBAAC;EACC,cACE,+CAA+C,gBAAgB;YAGhE;GACI;AAGT,QACE,oBAAC;EACC,GAAI,gBAAgB,WAAW;EAC/B,KAAK;EACG;EACR,SAAS,YAAY;EACrB,aAAW;EACX,MAAM;GACJ,MAAM,kBAAkB;GACxB,UAAU;GACV,SAAS,oBAAoB;GAC7B,OAAO,oBAAoB;GAC5B;YAEA,OAAO,aAAa,WACnB,WAEA;GACG;IACC,uBAAuB,WACtB,uBAAuB,UAAU,eAClC;GAID,uBAAuB,WACtB,oBAAC;IACC,eACE,CAAC,+CACG,aACA;cAGL;KACI;GAER,uBAAuB,UAAU,cAAc;MAC/C;GAEQ;;AAInB,IAAI,SAAS,WAAW,MAAM;AAE9B,OAAO,cAAc"}

package/dist/components/form/wrapper.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps } from "../../utils/react/mergeProps.js";
 import { FieldWrapper } from "./FieldWrapper/FieldWrapper.js";
 import { jsx } from "react/jsx-runtime";

package/dist/components/helpers/DisplayTransition/DisplayTransition.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { useCallback, useLayoutEffect, useRef, useState } from "react";
 
 //#region src/components/helpers/DisplayTransition/DisplayTransition.tsx

package/dist/components/helpers/IconSwitch/IconSwitch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { DisplayTransition } from "../DisplayTransition/DisplayTransition.js";
 import { tasty } from "@tenphi/tasty";
 import { isValidElement, useCallback, useLayoutEffect, useRef, useState } from "react";

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

@@ -83,8 +83,9 @@ interface CubeBoardProps extends Omit<AllBaseProps, 'children' | 'onDragStart' |
   resizeHandles?: ResizeHandleAxis[];
   /**
    * CSS selector for elements that must not start a pointer drag (e.g. form
-   * controls inside a widget: `"input,textarea,button,a,.no-drag"`). Keyboard
-   * moves are unaffected. Can be overridden per widget on `Board.Widget`.
+   * controls inside a widget: `"input,textarea,button,a,.no-drag"`). 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;
   /**

package/dist/components/layout/Board/Board.js

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

package/dist/components/layout/Board/Board.js.map

@@ -1 +1 @@
-{"version":3,"file":"Board.js","names":[],"sources":["../../../../src/components/layout/Board/Board.tsx"],"sourcesContent":["import { useResizeObserver } from '@react-aria/utils';\nimport {\n  AllBaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  mergeStyles,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  forwardRef,\n  ReactNode,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  useSyncExternalStore,\n} from 'react';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { useCombinedRefs } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n\nimport {\n  BoardEntry,\n  BoardGridLinesContext,\n  BoardMetrics,\n  BoardMetricsContext,\n  useBoardGridLines,\n  useBoardHost,\n  useBoardMetrics,\n  useBoardRegistry,\n} from './board-context';\nimport { BoardProvider } from './BoardProvider';\nimport {\n  applySizeConstraints,\n  bottom,\n  calcGridColWidth,\n  calcGridItemPosition,\n  calcWH,\n  cloneLayout,\n  Compactor,\n  CompactType,\n  correctBounds,\n  defaultConstraints,\n  getAllCollisions,\n  getCompactor,\n  getLayoutItem,\n  LayoutConstraint,\n  LayoutItem,\n  modifyLayout,\n  Position,\n  PositionParams,\n  ResizeHandleAxis,\n} from './grid-core';\nimport { useBoardLayout } from './use-board-layout';\nimport { ResizePhase, WidgetHost } from './WidgetHost';\n\nimport type { CubeBoardWidgetProps } from './Widget';\n\nconst BoardElement = tasty({\n  qa: 'Board',\n  styles: {\n    position: 'relative',\n    display: 'block',\n    width: '100%',\n    flexGrow: 1,\n    minHeight: '0',\n    fill: '#surface',\n    boxSizing: 'border-box',\n  },\n});\n\nconst ContentLayer = tasty({\n  styles: {\n    position: 'absolute',\n    inset: 0,\n  },\n});\n\nconst PlaceholderElement = tasty({\n  qa: 'BoardPlaceholder',\n  styles: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    fill: '#purple.10',\n    radius: '1cr',\n    border: '#purple.40',\n    zIndex: 2,\n    pointerEvents: 'none',\n    transition: 'inset 80ms linear, width 80ms linear, height 80ms linear',\n    boxSizing: 'border-box',\n  },\n});\n\n// Grid overlay drawn behind the widgets. Each snap cell is painted as a faint\n// block (column stripes intersected with a row-band alpha mask); the margin gaps\n// between cells stay transparent. The element is positioned as an explicit\n// rectangle inset by the board's resolved padding and sized to the grid content\n// so the padding reads as a symmetric frame on every edge. Its size, position\n// and gradients come from the board's position params via inline `style`. The\n// fill uses the `#border` token (via its CSS var) so it adapts to the scheme.\nconst GridOverlayElement = tasty({\n  qa: 'BoardGridOverlay',\n  styles: {\n    position: 'absolute',\n    zIndex: 0,\n    pointerEvents: 'none',\n    boxSizing: 'border-box',\n    opacity: '.5',\n  },\n});\n\nexport type BoardCompactType = 'vertical' | 'horizontal' | 'free' | null;\n\n/**\n * Payload passed to the drag/resize lifecycle callbacks. `layout` is the board's\n * current layout at the moment the callback fires, `item` is the affected item\n * (falls back to `oldItem` if the item just left this board via a cross-board\n * transfer), `oldItem` is that item as it was when the gesture started, and\n * `placeholder` is the current drop-slot preview (if any).\n */\nexport interface BoardInteractionInfo {\n  layout: LayoutItem[];\n  item: LayoutItem;\n  oldItem: LayoutItem;\n  placeholder: LayoutItem | null;\n}\n\n/** Visibility of the internal grid-line overlay. */\nexport type BoardGridLines = boolean | 'drag';\n\n/**\n * The subset of `Board.Widget` props a `Board` can set as defaults for every\n * widget it hosts (via `widgetProps`). Excludes `id`/`children`, which are\n * per-widget. Per-widget `Board.Widget` props override these.\n */\nexport type CubeBoardWidgetDefaults = Omit<\n  CubeBoardWidgetProps,\n  'id' | 'children'\n>;\n\nexport interface CubeBoardProps\n  extends Omit<\n      AllBaseProps,\n      'children' | 'onDragStart' | 'onDrag' | 'onResize'\n    >,\n    Omit<ContainerStyleProps, 'margin'> {\n  /** Stable board id (used for cross-board drag). Auto-generated if omitted. */\n  id?: string;\n  /** Controlled layout. */\n  layout?: LayoutItem[];\n  /** Initial layout for uncontrolled usage. */\n  defaultLayout?: LayoutItem[];\n  onLayoutChange?: (layout: LayoutItem[]) => void;\n  /** Called when a drag gesture starts. */\n  onDragStart?: (info: BoardInteractionInfo) => void;\n  /** Called on every step of a drag gesture. */\n  onDrag?: (info: BoardInteractionInfo) => void;\n  /** Called when a drag gesture ends (after the layout is committed). */\n  onDragStop?: (info: BoardInteractionInfo) => void;\n  /** Called when a resize gesture starts. */\n  onResizeStart?: (info: BoardInteractionInfo) => void;\n  /** Called on every step of a resize gesture. */\n  onResize?: (info: BoardInteractionInfo) => void;\n  /** Called when a resize gesture ends (after the layout is committed). */\n  onResizeStop?: (info: BoardInteractionInfo) => void;\n  /** Number of columns. @default 12 */\n  cols?: number;\n  /** Row height in pixels. @default 100 */\n  rowHeight?: number;\n  /** [horizontal, vertical] margin between widgets in pixels. @default [8, 8] */\n  margin?: [number, number];\n  /**\n   * [horizontal, vertical] padding inside the board. Defaults to `margin`, or\n   * to `[0, 0]` for an aligned nested board (`isAligned`) so its grid lines up\n   * with the ancestor board's.\n   */\n  containerPadding?: [number, number];\n  /** Maximum number of rows. @default Infinity */\n  maxRows?: number;\n  /**\n   * Compaction behavior. `'vertical'` / `'horizontal'` reflow widgets to remove\n   * gaps; `'free'` places each widget exactly where dropped and never pushes its\n   * neighbours (pair with `allowOverlap` to let widgets stack, otherwise moving\n   * onto an occupied cell is blocked); `null` disables compaction but still\n   * resolves collisions the legacy react-grid-layout way. @default 'vertical'\n   */\n  compact?: BoardCompactType;\n  /** Allow widgets to overlap. @default false */\n  allowOverlap?: boolean;\n  /** Block movement into occupied cells instead of pushing. @default false */\n  preventCollision?: boolean;\n  /** Enable dragging for all widgets. @default true */\n  isDraggable?: boolean;\n  /** Enable resizing for all widgets. @default true */\n  isResizable?: boolean;\n  /** Whether this board accepts widgets dropped from other boards. @default true */\n  isDroppable?: boolean;\n  /** Which resize handles to show. @default ['se'] */\n  resizeHandles?: ResizeHandleAxis[];\n  /**\n   * CSS selector for elements that must not start a pointer drag (e.g. form\n   * controls inside a widget: `\"input,textarea,button,a,.no-drag\"`). Keyboard\n   * moves are unaffected. Can be overridden per widget on `Board.Widget`.\n   */\n  dragCancel?: string;\n  /**\n   * CSS selector for the only elements from which a pointer drag may start.\n   * Can be overridden per widget on `Board.Widget`.\n   */\n  dragHandle?: string;\n  /**\n   * Show grid lines behind the widgets. `true` always shows them, `'drag'`\n   * shows them only while a widget is being dragged or resized, `false` never.\n   * @default false\n   */\n  showGridLines?: BoardGridLines;\n  /**\n   * Align this board's grid with an ancestor `Board`'s layout. Only takes\n   * effect when the board is nested inside another `Board`'s widget. When set,\n   * every cell matches the parent's cell size exactly: the board inherits the\n   * parent's column pitch (deriving its own column count from its measured\n   * width) and uses the parent's row height verbatim. It never shrinks rows to\n   * fit; pair it with an `isAutoHeight` container so the widget grows to fit its\n   * rows at that height. @default false\n   */\n  isAligned?: boolean;\n  /** Grid/item layout constraints. */\n  constraints?: LayoutConstraint[];\n  /**\n   * Explicit container width in pixels. When provided, disables automatic width\n   * measurement (useful for SSR and tests).\n   */\n  width?: number;\n  /**\n   * Default props applied to every widget this board hosts. Per-widget\n   * `Board.Widget` props override these. Use it to add a card border to every\n   * widget (`widgetProps={{ isCard: true }}`) or set shared sizing/`styles`\n   * defaults without repeating them on each `Board.Widget`.\n   */\n  widgetProps?: Partial<CubeBoardWidgetDefaults>;\n  children?: ReactNode;\n}\n\nfunction compactTypeToCore(compact: BoardCompactType): CompactType {\n  if (compact === 'free') return null;\n  return compact;\n}\n\nfunction BoardInner(\n  props: CubeBoardProps,\n  ref: React.ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    id: providedId,\n    layout: controlledLayout,\n    defaultLayout,\n    onLayoutChange,\n    onDragStart,\n    onDrag,\n    onDragStop,\n    onResizeStart,\n    onResize: onResizeProp,\n    onResizeStop,\n    cols = 12,\n    rowHeight = 100,\n    margin = [8, 8],\n    containerPadding,\n    maxRows = Infinity,\n    compact = 'vertical',\n    allowOverlap = false,\n    preventCollision = false,\n    isDraggable = true,\n    isResizable = true,\n    isDroppable = true,\n    resizeHandles = ['se'],\n    dragCancel,\n    dragHandle,\n    showGridLines,\n    isAligned = false,\n    constraints,\n    width: providedWidth,\n    widgetProps,\n    children,\n    ...otherProps\n  } = props;\n\n  const registry = useBoardRegistry()!;\n  const parentMetrics = useBoardMetrics();\n  const host = useBoardHost();\n  const inheritedGridLines = useBoardGridLines();\n  const aligned = isAligned && !!parentMetrics;\n  // `widgetProps` may carry container style props directly (e.g. `fill`,\n  // `padding`, `radius`) alongside an explicit `styles` object, mirroring\n  // `Board.Widget`. Extract them into a single style map here so those defaults\n  // actually reach every widget - forwarding only `widgetProps.styles` would\n  // drop the direct props. A direct prop wins over the same key in `styles`.\n  const widgetPropsStyles = useMemo<Styles | undefined>(() => {\n    if (!widgetProps) return undefined;\n    const extracted = extractStyles(widgetProps, CONTAINER_STYLES);\n    return Object.keys(extracted).length > 0 ? extracted : undefined;\n  }, [widgetProps]);\n  // A nested board with no explicit `showGridLines` inherits the ancestor's:\n  // when the ancestor has grid lines enabled, show them here while dragging.\n  const effectiveShowGridLines: BoardGridLines =\n    showGridLines ?? (inheritedGridLines ? 'drag' : false);\n  const generatedId = useId();\n  const boardId = providedId ?? generatedId;\n\n  const containerRef = useCombinedRefs(ref);\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const [measuredWidth, setMeasuredWidth] = useState<number>(0);\n  // Rendered height is only needed for aligned nested boards (to fit rows into\n  // the space the container grants). It never drives the board's own height, so\n  // measuring it cannot create a feedback loop.\n  const [measuredHeight, setMeasuredHeight] = useState<number>(0);\n  const width = providedWidth ?? measuredWidth;\n\n  const onResizeContainer = useEvent(() => {\n    const el = containerRef.current;\n    if (!el) return;\n    // A hidden container (e.g. the board inside an inactive tab after a\n    // spring-loaded tab switch) reports 0. Keep the last non-zero measurement so\n    // the board stays \"ready\" and keeps its widget hosts mounted while briefly\n    // hidden. Otherwise the board would render nothing, unmounting the widget\n    // that owns an in-flight drag gesture and stranding the drag (React Aria's\n    // `useMove` tears down its listeners on unmount, so the drop never fires).\n    const nextWidth = el.offsetWidth;\n    const nextHeight = el.offsetHeight;\n    if (nextWidth > 0) setMeasuredWidth(nextWidth);\n    if (nextHeight > 0) setMeasuredHeight(nextHeight);\n  });\n  useResizeObserver({ ref: containerRef, onResize: onResizeContainer });\n  useEffect(() => {\n    if (providedWidth == null) {\n      onResizeContainer();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [providedWidth]);\n\n  const {\n    layout,\n    layoutRef,\n    placeholder,\n    placeholderRef,\n    setPlaceholder,\n    applyLayout,\n  } = useBoardLayout({\n    layout: controlledLayout,\n    defaultLayout,\n    onLayoutChange,\n  });\n\n  // Re-render when any widget's registered content/config changes.\n  useSyncExternalStore(registry.store.subscribe, registry.store.getVersion);\n\n  // In aligned mode the board inherits the parent's gap so widget edges line up\n  // with the surrounding layout; otherwise it uses its own `margin`.\n  const effectiveMargin: readonly [number, number] = aligned\n    ? parentMetrics!.margin\n    : margin;\n  // The board keeps its own padding (it sits inside the container's chrome);\n  // when unspecified it defaults to the effective gap. An aligned nested board\n  // is the exception: its grid origin must sit flush on the container widget's\n  // edge (which already coincides with the parent's column-0 origin) so its\n  // columns line up with the ancestor board's. Inheriting the gap there would\n  // inset every column by one margin and break the alignment, so it defaults\n  // to zero padding instead.\n  const resolvedPadding: readonly [number, number] =\n    containerPadding ?? (aligned ? [0, 0] : effectiveMargin);\n\n  const rows = Math.max(\n    bottom(layout),\n    placeholder ? placeholder.y + placeholder.h : 0,\n  );\n\n  // Derive the aligned column count so each column keeps the parent's pixel\n  // pitch: as the container widget is resized, columns are added/removed rather\n  // than stretched. `containerWidth` is then back-solved so `calcGridColWidth`\n  // returns exactly the parent's column width.\n  const parentColWidth = aligned ? parentMetrics!.colWidth : 0;\n  // `width` is `offsetWidth` (an integer the browser rounds), while\n  // `parentColWidth` is fractional. A container sized to exactly N parent\n  // columns can therefore measure a fraction of a pixel short, so a bare\n  // `Math.floor` would drop the last column and leave its space unused. Add a\n  // small pixel tolerance to absorb that rounding; it only rounds up when the\n  // width is within ~2px of a full column, so it can't invent a column that\n  // genuinely doesn't fit.\n  const ALIGN_WIDTH_TOLERANCE = 2;\n  const alignedCols =\n    aligned && width > 0\n      ? Math.max(\n          1,\n          Math.floor(\n            (width -\n              resolvedPadding[0] * 2 +\n              effectiveMargin[0] +\n              ALIGN_WIDTH_TOLERANCE) /\n              (parentColWidth + effectiveMargin[0]),\n          ),\n        )\n      : cols;\n  const effectiveCols = aligned ? alignedCols : cols;\n  const effectiveContainerWidth = aligned\n    ? parentColWidth * effectiveCols +\n      effectiveMargin[0] * Math.max(0, effectiveCols - 1) +\n      resolvedPadding[0] * 2\n    : width;\n\n  // An aligned board uses the parent's row height verbatim, so every cell is\n  // exactly the parent's cell size (width already matches via the inherited\n  // column pitch). It never shrinks rows to fit; pair it with an `isAutoHeight`\n  // container so the widget grows to fit the rows at this height instead.\n  const effectiveRowHeight = aligned ? parentMetrics!.rowHeight : rowHeight;\n\n  const positionParams = useMemo<PositionParams>(\n    () => ({\n      margin: effectiveMargin,\n      containerPadding: resolvedPadding,\n      containerWidth: effectiveContainerWidth,\n      cols: effectiveCols,\n      rowHeight: effectiveRowHeight,\n      maxRows,\n    }),\n    [\n      effectiveMargin[0],\n      effectiveMargin[1],\n      resolvedPadding[0],\n      resolvedPadding[1],\n      effectiveContainerWidth,\n      effectiveCols,\n      effectiveRowHeight,\n      maxRows,\n    ],\n  );\n\n  // 'free' means no compaction (nothing is pushed up/left or recompacted) AND a\n  // dragged widget never pushes or swaps its neighbours: it is placed exactly\n  // where dropped. Without `allowOverlap` a move onto an occupied cell is\n  // blocked (the widget stays at its last free spot); with `allowOverlap`\n  // widgets may stack. The explicit `preventCollision` prop still applies to the\n  // compacting modes (`vertical` / `horizontal`) and to the legacy `null` mode.\n  const compactor = useMemo<Compactor>(\n    () =>\n      getCompactor(\n        compactTypeToCore(compact),\n        allowOverlap,\n        compact === 'free' ? !allowOverlap : preventCollision,\n      ),\n    [compact, allowOverlap, preventCollision],\n  );\n\n  const resolvedConstraints = constraints ?? defaultConstraints;\n\n  const computedHeight =\n    rows > 0\n      ? rows * effectiveRowHeight +\n        Math.max(0, rows - 1) * effectiveMargin[1] +\n        resolvedPadding[1] * 2\n      : effectiveRowHeight;\n  // An aligned board fills the height the container grants it, so it reports its\n  // measured height; otherwise it reports the height its content needs.\n  const containerHeight =\n    aligned && measuredHeight > 0 ? measuredHeight : computedHeight;\n\n  // Live refs so the stable registry entry always reads current values.\n  const liveRef = useRef({\n    positionParams,\n    compactor,\n    constraints: resolvedConstraints,\n    maxRows,\n    containerHeight,\n    isDroppable,\n  });\n  liveRef.current = {\n    positionParams,\n    compactor,\n    constraints: resolvedConstraints,\n    maxRows,\n    containerHeight,\n    isDroppable,\n  };\n\n  const applyLayoutEvent = useEvent(applyLayout);\n  const setPlaceholderEvent = useEvent(setPlaceholder);\n\n  const entryRef = useRef<BoardEntry | null>(null);\n  if (!entryRef.current) {\n    entryRef.current = {\n      id: boardId,\n      getContentRect: () => contentRef.current?.getBoundingClientRect() ?? null,\n      getContentNode: () => contentRef.current,\n      getPositionParams: () => liveRef.current.positionParams,\n      getConstraints: () => liveRef.current.constraints,\n      getCompactor: () => liveRef.current.compactor,\n      getMaxRows: () => liveRef.current.maxRows,\n      getContainerHeight: () => liveRef.current.containerHeight,\n      getLayout: () => layoutRef.current,\n      applyLayout: (next, commit) => applyLayoutEvent(next, commit),\n      setPlaceholder: (item) => setPlaceholderEvent(item),\n      isDroppable: () => liveRef.current.isDroppable,\n    };\n  }\n\n  useEffect(() => {\n    const entry = entryRef.current!;\n    // Keep the entry's id in sync with the (possibly changed) board id before\n    // registering. The previous effect's cleanup has already removed the old id,\n    // so registering here keys the entry under the current id.\n    entry.id = boardId;\n    return registry.registerBoard(entry);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [boardId]);\n\n  // When the aligned column count changes (the container was resized), reflow\n  // the layout to the new width: clamp items back into bounds and recompact so\n  // nothing overflows the narrower/wider grid.\n  const recompactForCols = useEvent((nextCols: number) => {\n    const corrected = correctBounds(cloneLayout(layoutRef.current), {\n      cols: nextCols,\n    });\n    const compacted = [\n      ...liveRef.current.compactor.compact(corrected, nextCols),\n    ];\n    applyLayoutEvent(compacted, true);\n  });\n  // `null` until the first *measured* aligned column count is established. This\n  // avoids treating the initial zero-width -> measured-width transition as a\n  // column-count change: a board that measures its own width (no explicit\n  // `width` prop) renders first with `width === 0`, so `effectiveCols` falls\n  // back to `cols` and only becomes the derived aligned count once measured.\n  // Seeding the baseline on that first measured value (without committing)\n  // prevents an unsolicited reflow + `onLayoutChange` before the user interacts.\n  const prevAlignedColsRef = useRef<number | null>(null);\n  useEffect(() => {\n    if (!aligned) {\n      // Re-entering aligned mode should re-seed from the next measured value.\n      prevAlignedColsRef.current = null;\n      return;\n    }\n    // Wait for a real width measurement; the fallback-`cols` value that stands\n    // in before measurement is not a meaningful aligned column count.\n    if (width <= 0) return;\n    if (prevAlignedColsRef.current === null) {\n      prevAlignedColsRef.current = effectiveCols;\n      return;\n    }\n    if (prevAlignedColsRef.current === effectiveCols) return;\n    prevAlignedColsRef.current = effectiveCols;\n    recompactForCols(effectiveCols);\n  }, [aligned, width, effectiveCols, recompactForCols]);\n\n  // Natural height this board wants: its rows at the (parent) row height. When\n  // the container is shorter than this, an `isAutoHeight` host grows to fit it\n  // (aligned boards no longer shrink their rows).\n  const naturalHeight =\n    rows > 0\n      ? rows * effectiveRowHeight +\n        Math.max(0, rows - 1) * effectiveMargin[1] +\n        resolvedPadding[1] * 2\n      : effectiveRowHeight;\n\n  // Report this aligned board's height deficit to an auto-sizing host so the\n  // host can both grow to fit and pin its resize floor. The value is signed:\n  // positive when the board is squeezed (needs more height), negative when the\n  // container is taller than needed (so the floor can be lowered). The host\n  // never shrinks the widget on its own - it only grows and clamps resizing.\n  const requestHeightDeficit = host?.requestHeightDeficit;\n  useEffect(() => {\n    if (!aligned || !host?.isAutoHeight || !requestHeightDeficit) return;\n    if (measuredHeight <= 0) return;\n    requestHeightDeficit(naturalHeight - measuredHeight);\n  }, [\n    aligned,\n    host?.isAutoHeight,\n    requestHeightDeficit,\n    naturalHeight,\n    measuredHeight,\n  ]);\n\n  // In-board resize orchestration.\n  const resizeStateRef = useRef<{\n    id: string;\n    axis: ResizeHandleAxis;\n    item: LayoutItem;\n    origin: Position;\n    accX: number;\n    accY: number;\n  } | null>(null);\n\n  // Minimum rows each auto-height widget currently needs to fit its content.\n  // Read during resize so a widget can never be dragged shorter than its\n  // content, and used to grow the item when the content needs more room.\n  const autoHeightMinRowsRef = useRef<Record<string, number>>({});\n\n  const handleResize = useEvent(\n    (\n      id: string,\n      axis: ResizeHandleAxis,\n      phase: ResizePhase,\n      dx: number,\n      dy: number,\n    ) => {\n      const pp = liveRef.current.positionParams;\n\n      if (phase === 'start') {\n        const rawItem = getLayoutItem(layoutRef.current, id);\n        if (!rawItem) return;\n        // Layout-item min/max and constraints win; otherwise fall back to the\n        // ones declared on the owning `Board.Widget` (and then the board-level\n        // `widgetProps` defaults) so `applySizeConstraints` (via `minMaxSize`)\n        // picks them up.\n        const reg = registry.store.get(id);\n        const item: LayoutItem = {\n          ...rawItem,\n          minW: rawItem.minW ?? reg?.minW ?? widgetProps?.minW,\n          maxW: rawItem.maxW ?? reg?.maxW ?? widgetProps?.maxW,\n          minH: rawItem.minH ?? reg?.minH ?? widgetProps?.minH,\n          maxH: rawItem.maxH ?? reg?.maxH ?? widgetProps?.maxH,\n          constraints:\n            rawItem.constraints ?? reg?.constraints ?? widgetProps?.constraints,\n        };\n        resizeStateRef.current = {\n          id,\n          axis,\n          item: { ...item },\n          origin: calcGridItemPosition(pp, item.x, item.y, item.w, item.h),\n          accX: 0,\n          accY: 0,\n        };\n        setPlaceholder({ ...item });\n        onResizeStart?.({\n          layout: layoutRef.current,\n          item: { ...item },\n          oldItem: { ...item },\n          placeholder: { ...item },\n        });\n        return;\n      }\n\n      const rs = resizeStateRef.current;\n      if (!rs) return;\n\n      if (phase === 'end') {\n        const finalLayout = [...layoutRef.current];\n        applyLayout(finalLayout, true);\n        setPlaceholder(null);\n        onResizeStop?.({\n          layout: finalLayout,\n          item: getLayoutItem(finalLayout, id) ?? rs.item,\n          oldItem: rs.item,\n          placeholder: null,\n        });\n        resizeStateRef.current = null;\n        return;\n      }\n\n      rs.accX += dx;\n      rs.accY += dy;\n\n      const { origin, item, axis: handle } = rs;\n      let newW = origin.width;\n      let newH = origin.height;\n      if (handle.includes('e')) newW = origin.width + rs.accX;\n      if (handle.includes('w')) newW = origin.width - rs.accX;\n      if (handle.includes('s')) newH = origin.height + rs.accY;\n      if (handle.includes('n')) newH = origin.height - rs.accY;\n      newW = Math.max(newW, 8);\n      newH = Math.max(newH, 8);\n\n      const raw = calcWH(pp, newW, newH, item.x, item.y, handle);\n      const constrained = applySizeConstraints(\n        liveRef.current.constraints,\n        item,\n        raw.w,\n        raw.h,\n        handle,\n        {\n          cols: pp.cols,\n          maxRows: liveRef.current.maxRows,\n          containerWidth: pp.containerWidth,\n          containerHeight: liveRef.current.containerHeight,\n          rowHeight: pp.rowHeight,\n          margin: pp.margin,\n          layout: layoutRef.current,\n        },\n      );\n\n      // An auto-height widget cannot be resized shorter than the content it\n      // hosts (a nested board) currently needs, so pin its height to the floor.\n      const floorRows = autoHeightMinRowsRef.current[id] ?? 0;\n      const finalW = constrained.w;\n      const finalH = Math.max(constrained.h, floorRows);\n\n      let x = item.x;\n      let y = item.y;\n      if (handle.includes('w')) x = item.x + item.w - finalW;\n      if (handle.includes('n')) y = item.y + item.h - finalH;\n      x = Math.max(0, x);\n      y = Math.max(0, y);\n\n      let newItem: LayoutItem = {\n        ...item,\n        x,\n        y,\n        w: finalW,\n        h: finalH,\n      };\n\n      // Collision-blocking modes (`free` without `allowOverlap`, or an explicit\n      // `preventCollision`) run a no-op/gap-filling compactor that never\n      // resolves overlaps, so a resize must be blocked here the same way the\n      // drag path blocks a move (`moveElement` reverts on collision). Without\n      // this, growing or moving an edge via a resize handle could push the box\n      // onto an occupied cell. When the new box overlaps a neighbour, revert to\n      // the last committed box for this widget so the gesture stalls at the\n      // last valid size/position instead of overlapping.\n      const compactor = liveRef.current.compactor;\n      if (compactor.preventCollision && !compactor.allowOverlap) {\n        const collides = getAllCollisions(layoutRef.current, newItem).some(\n          (other) => other.i !== id,\n        );\n        if (collides) {\n          const lastValid = getLayoutItem(layoutRef.current, id);\n          if (lastValid) newItem = { ...lastValid };\n        }\n      }\n\n      const working = modifyLayout(layoutRef.current, newItem);\n      const compacted = [...compactor.compact(working, pp.cols)];\n      applyLayout(compacted, false);\n      const nextPlaceholder = getLayoutItem(compacted, id) ?? newItem;\n      setPlaceholder(nextPlaceholder);\n      onResizeProp?.({\n        layout: compacted,\n        item: getLayoutItem(compacted, id) ?? newItem,\n        oldItem: rs.item,\n        placeholder: nextPlaceholder,\n      });\n    },\n  );\n\n  // Record an auto-height widget's needed rows. Grow the item when its content\n  // needs more height (only ever increases); the stored value is also the\n  // resize floor enforced in `handleResize`.\n  const handleAutoHeight = useEvent((id: string, neededRows: number) => {\n    autoHeightMinRowsRef.current[id] = neededRows;\n    const current = getLayoutItem(layoutRef.current, id);\n    if (!current || neededRows <= current.h) return;\n    // While a drag or resize gesture is in flight the layout is transient - the\n    // registry (drag) and `handleResize` write uncommitted previews and commit\n    // only on drop / release. Growing an auto-height widget here with\n    // `commit: true` would fire `onLayoutChange` mid-gesture and persist the\n    // in-flight positions of the widget being moved. Skip the grow-commit; the\n    // floor ref is already updated above (so `handleResize` still respects it),\n    // and the deficit effect re-fires once the gesture settles.\n    if (registry.dragState || resizeStateRef.current) return;\n    const pp = liveRef.current.positionParams;\n    const working = modifyLayout(layoutRef.current, {\n      ...current,\n      h: neededRows,\n    });\n    const compacted = [...liveRef.current.compactor.compact(working, pp.cols)];\n    applyLayout(compacted, true);\n  });\n\n  // The dragged item captured at gesture start, so drag callbacks can report the\n  // original position throughout (and after a cross-board transfer removes the\n  // item from this board's layout).\n  const dragOldItemRef = useRef<LayoutItem | null>(null);\n\n  const handleDragLifecycle = useEvent((id: string, phase: ResizePhase) => {\n    const currentLayout = layoutRef.current;\n    const liveItem = getLayoutItem(currentLayout, id);\n\n    if (phase === 'start') {\n      dragOldItemRef.current = liveItem ? { ...liveItem } : null;\n    }\n    const oldItem = dragOldItemRef.current ?? liveItem;\n    if (!oldItem) return;\n    const item = liveItem ?? oldItem;\n\n    const info: BoardInteractionInfo = {\n      layout: currentLayout,\n      item,\n      oldItem,\n      // Read the live ref, not render-time state: the registry calls\n      // `setPlaceholder` synchronously right before this fires, and that only\n      // schedules a re-render, so `placeholder` state still holds the previous\n      // value (or a stale preview after the drop clears it to `null`).\n      placeholder: placeholderRef.current,\n    };\n    if (phase === 'start') onDragStart?.(info);\n    else if (phase === 'move') onDrag?.(info);\n    else {\n      onDragStop?.(info);\n      dragOldItemRef.current = null;\n    }\n  });\n\n  const styles: Styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  const dragState = registry.dragState;\n  const ready = width > 0;\n\n  // Gate widget position transitions off until the widgets have been painted at\n  // their initial positions once. Without this, the first render animates every\n  // widget sliding in from its default spot (0, 0). We render one frame with the\n  // gate closed (no `inset` transition), let the browser paint, then lift it so\n  // later reflows animate. A double rAF waits past the first committed paint;\n  // re-arm whenever the board (re)becomes ready so a board that hides and\n  // remeasures (e.g. inside a tab) re-settles too.\n  const [settled, setSettled] = useState(false);\n  useEffect(() => {\n    if (!ready) {\n      setSettled(false);\n      return;\n    }\n    let id1 = 0;\n    let id2 = 0;\n    id1 = requestAnimationFrame(() => {\n      id2 = requestAnimationFrame(() => setSettled(true));\n    });\n    return () => {\n      cancelAnimationFrame(id1);\n      if (id2) cancelAnimationFrame(id2);\n    };\n  }, [ready]);\n\n  // When the widget that hosts this nested board is the one being dragged, its\n  // whole content (including this board) floats as a single unit, so its own\n  // grid lines add nothing but clutter. Suppress them for that drag.\n  const hostWidgetIsDragging =\n    !!dragState && dragState.nestedBoardIds.has(boardId);\n\n  const placeholderStyle = placeholder\n    ? (() => {\n        const pos = calcGridItemPosition(\n          positionParams,\n          placeholder.x,\n          placeholder.y,\n          placeholder.w,\n          placeholder.h,\n        );\n        return {\n          left: `${pos.left}px`,\n          top: `${pos.top}px`,\n          width: `${pos.width}px`,\n          height: `${pos.height}px`,\n        };\n      })()\n    : null;\n\n  const showPlaceholder = placeholder && placeholderStyle;\n\n  const gridLinesVisible =\n    !hostWidgetIsDragging &&\n    (effectiveShowGridLines === true ||\n      (effectiveShowGridLines === 'drag' && (!!dragState || !!placeholder)));\n  const gridOverlayStyle = gridLinesVisible\n    ? (() => {\n        const colWidth = calcGridColWidth(positionParams);\n        const rowHeightPx = positionParams.rowHeight;\n        // A grid with margins has real gaps between cells, so any line-based\n        // overlay either misses a cell edge (single line at the cell pitch) or\n        // shows a double line in every gap (a line at both edges). Instead,\n        // paint each snap cell as a faint block sized exactly `colWidth` x\n        // `rowHeightPx` with the margin gaps left transparent: the blocks line\n        // up 1:1 with the drop-zone placeholder and there are no lines to\n        // double. Column stripes form the background; a row-band alpha mask\n        // intersects them into cells.\n        const pitchX = colWidth + effectiveMargin[0];\n        const pitchY = rowHeightPx + effectiveMargin[1];\n        // Position the overlay as an explicit rectangle inset by the board's\n        // resolved padding and sized to exactly cover the grid content (cols x\n        // rows). This makes the padding a symmetric frame on all four edges (the\n        // previous `inset: 0` + top-left-anchored repeat left the padding\n        // unvisualized on the right/bottom and inside any extra min-height) and\n        // lets the cell pattern tile from the overlay's own origin.\n        const padX = resolvedPadding[0];\n        const padY = resolvedPadding[1];\n        const gridWidth = Math.max(0, effectiveContainerWidth - padX * 2);\n        const gridHeight =\n          rows > 0 ? rows * rowHeightPx + (rows - 1) * effectiveMargin[1] : 0;\n        const fill = 'var(--border-color)';\n        const columns = `repeating-linear-gradient(to right, ${fill} 0, ${fill} ${colWidth}px, transparent ${colWidth}px, transparent ${pitchX}px)`;\n        const rowsGrad = `repeating-linear-gradient(to bottom, #000 0, #000 ${rowHeightPx}px, transparent ${rowHeightPx}px, transparent ${pitchY}px)`;\n        return {\n          left: `${padX}px`,\n          top: `${padY}px`,\n          width: `${gridWidth}px`,\n          height: `${gridHeight}px`,\n          backgroundImage: columns,\n          backgroundPosition: '0 0',\n          backgroundRepeat: 'repeat',\n          maskImage: rowsGrad,\n          WebkitMaskImage: rowsGrad,\n          maskPosition: '0 0',\n          WebkitMaskPosition: '0 0',\n          maskRepeat: 'repeat',\n          WebkitMaskRepeat: 'repeat',\n        };\n      })()\n    : null;\n\n  // Metrics this board exposes to any aligned boards nested inside its widgets.\n  const boardMetrics = useMemo<BoardMetrics>(\n    () => ({\n      colWidth: calcGridColWidth(positionParams),\n      rowHeight: positionParams.rowHeight,\n      margin: positionParams.margin,\n      containerPadding: positionParams.containerPadding,\n    }),\n    [positionParams],\n  );\n\n  return (\n    <BoardMetricsContext.Provider value={boardMetrics}>\n      <BoardGridLinesContext.Provider\n        value={\n          effectiveShowGridLines === true || effectiveShowGridLines === 'drag'\n        }\n      >\n        <BoardElement\n          {...filterBaseProps(otherProps, { eventProps: true })}\n          ref={containerRef}\n          styles={styles}\n          // Non-aligned: use min-height (not a fixed height) so the board\n          // auto-sizes to its content by default but can still grow to fill a\n          // taller parent. Widgets are absolutely positioned, so growing never\n          // shifts them, and the content layer (inset: 0) always covers the full\n          // board -> the whole board is droppable. Aligned: omit the inline height\n          // so the board fills (and is bounded by) the space the container grants,\n          // which is what drives the reduced row height.\n          style={aligned ? undefined : { minHeight: `${containerHeight}px` }}\n          mods={{\n            dragging: !!dragState,\n            'drop-target': dragState?.currentBoardId === boardId,\n          }}\n        >\n          <ContentLayer ref={contentRef}>\n            {ready && gridOverlayStyle ? (\n              <GridOverlayElement aria-hidden=\"true\" style={gridOverlayStyle} />\n            ) : null}\n            {ready\n              ? layout.map((item) => {\n                  const registration = registry.store.get(item.i);\n                  const widgetDraggable =\n                    isDraggable &&\n                    (registration?.isDraggable ?? widgetProps?.isDraggable) !==\n                      false &&\n                    item.isDraggable !== false &&\n                    !item.static;\n                  const widgetResizable =\n                    isResizable &&\n                    (registration?.isResizable ?? widgetProps?.isResizable) !==\n                      false &&\n                    item.isResizable !== false &&\n                    !item.static;\n                  const handles =\n                    item.resizeHandles ??\n                    registration?.resizeHandles ??\n                    widgetProps?.resizeHandles ??\n                    resizeHandles;\n                  const widgetDragCancel =\n                    registration?.dragCancel ??\n                    widgetProps?.dragCancel ??\n                    dragCancel;\n                  const widgetDragHandle =\n                    registration?.dragHandle ??\n                    widgetProps?.dragHandle ??\n                    dragHandle;\n                  // Per-widget `isCard`/`styles` override the board-level\n                  // `widgetProps` defaults; `isCard` defaults to `false`\n                  // (borderless - widgets are always filled and rounded).\n                  const widgetIsCard =\n                    registration?.isCard ?? widgetProps?.isCard ?? false;\n                  // Per-widget `isAutoHeight`/`qa` fall back to the board-level\n                  // `widgetProps` defaults (mirroring the other widget props).\n                  const widgetIsAutoHeight =\n                    registration?.isAutoHeight ??\n                    widgetProps?.isAutoHeight ??\n                    false;\n                  const widgetQa = registration?.qa ?? widgetProps?.qa;\n                  // Merge board-level `widgetProps` styles (its `styles` object\n                  // plus direct style props) with the per-widget styles so\n                  // shared defaults survive when a widget sets even a single\n                  // style prop; per-widget styles win on conflicts. Only merge\n                  // when both exist to preserve reference stability (and avoid\n                  // churn) in the common single-source case.\n                  const widgetStyles =\n                    registration?.styles && widgetPropsStyles\n                      ? mergeStyles(widgetPropsStyles, registration.styles)\n                      : registration?.styles ?? widgetPropsStyles;\n\n                  return (\n                    <WidgetHost\n                      key={item.i}\n                      boardId={boardId}\n                      item={item}\n                      positionParams={positionParams}\n                      registration={registration}\n                      isCard={widgetIsCard}\n                      styles={widgetStyles as Styles}\n                      isDraggable={widgetDraggable}\n                      isResizable={widgetResizable}\n                      resizeHandles={handles}\n                      isAutoHeight={widgetIsAutoHeight}\n                      qa={widgetQa}\n                      dragCancel={widgetDragCancel}\n                      dragHandle={widgetDragHandle}\n                      registry={registry}\n                      dragState={dragState}\n                      settled={settled}\n                      onResize={handleResize}\n                      onAutoHeight={handleAutoHeight}\n                      onDragLifecycle={handleDragLifecycle}\n                    />\n                  );\n                })\n              : null}\n            {showPlaceholder ? (\n              <PlaceholderElement\n                aria-hidden=\"true\"\n                style={placeholderStyle!}\n              />\n            ) : null}\n          </ContentLayer>\n          {children}\n        </BoardElement>\n      </BoardGridLinesContext.Provider>\n    </BoardMetricsContext.Provider>\n  );\n}\n\nconst BoardInnerForwarded = forwardRef(BoardInner);\n\n/**\n * A draggable and resizable widget grid. Widgets are declared with\n * `Board.Widget` and positioned via a `layout`. Wrap multiple boards in a\n * `BoardProvider` to enable dragging widgets between them.\n */\nexport const Board = forwardRef(function Board(\n  props: CubeBoardProps,\n  ref: React.ForwardedRef<HTMLDivElement>,\n) {\n  const existingRegistry = useBoardRegistry();\n\n  if (existingRegistry) {\n    return <BoardInnerForwarded {...props} ref={ref} />;\n  }\n\n  return (\n    <BoardProvider>\n      <BoardInnerForwarded {...props} ref={ref} />\n    </BoardProvider>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"Board.js","names":[],"sources":["../../../../src/components/layout/Board/Board.tsx"],"sourcesContent":["import { useResizeObserver } from '@react-aria/utils';\nimport {\n  AllBaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  mergeStyles,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  forwardRef,\n  ReactNode,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  useSyncExternalStore,\n} from 'react';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { useCombinedRefs } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n\nimport {\n  BoardEntry,\n  BoardGridLinesContext,\n  BoardMetrics,\n  BoardMetricsContext,\n  useBoardGridLines,\n  useBoardHost,\n  useBoardMetrics,\n  useBoardRegistry,\n} from './board-context';\nimport { BoardProvider } from './BoardProvider';\nimport {\n  applySizeConstraints,\n  bottom,\n  calcGridColWidth,\n  calcGridItemPosition,\n  calcWH,\n  cloneLayout,\n  Compactor,\n  CompactType,\n  correctBounds,\n  defaultConstraints,\n  getAllCollisions,\n  getCompactor,\n  getLayoutItem,\n  LayoutConstraint,\n  LayoutItem,\n  modifyLayout,\n  Position,\n  PositionParams,\n  ResizeHandleAxis,\n} from './grid-core';\nimport { useBoardLayout } from './use-board-layout';\nimport { ResizePhase, WidgetHost } from './WidgetHost';\n\nimport type { CubeBoardWidgetProps } from './Widget';\n\nconst BoardElement = tasty({\n  qa: 'Board',\n  styles: {\n    position: 'relative',\n    display: 'block',\n    width: '100%',\n    flexGrow: 1,\n    minHeight: '0',\n    fill: '#surface',\n    boxSizing: 'border-box',\n  },\n});\n\nconst ContentLayer = tasty({\n  styles: {\n    position: 'absolute',\n    inset: 0,\n  },\n});\n\nconst PlaceholderElement = tasty({\n  qa: 'BoardPlaceholder',\n  styles: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    fill: '#purple.10',\n    radius: '1cr',\n    border: '#purple.40',\n    zIndex: 2,\n    pointerEvents: 'none',\n    transition: 'inset 80ms linear, width 80ms linear, height 80ms linear',\n    boxSizing: 'border-box',\n  },\n});\n\n// Grid overlay drawn behind the widgets. Each snap cell is painted as a faint\n// block (column stripes intersected with a row-band alpha mask); the margin gaps\n// between cells stay transparent. The element is positioned as an explicit\n// rectangle inset by the board's resolved padding and sized to the grid content\n// so the padding reads as a symmetric frame on every edge. Its size, position\n// and gradients come from the board's position params via inline `style`. The\n// fill uses the `#border` token (via its CSS var) so it adapts to the scheme.\nconst GridOverlayElement = tasty({\n  qa: 'BoardGridOverlay',\n  styles: {\n    position: 'absolute',\n    zIndex: 0,\n    pointerEvents: 'none',\n    boxSizing: 'border-box',\n    opacity: '.5',\n  },\n});\n\nexport type BoardCompactType = 'vertical' | 'horizontal' | 'free' | null;\n\n/**\n * Payload passed to the drag/resize lifecycle callbacks. `layout` is the board's\n * current layout at the moment the callback fires, `item` is the affected item\n * (falls back to `oldItem` if the item just left this board via a cross-board\n * transfer), `oldItem` is that item as it was when the gesture started, and\n * `placeholder` is the current drop-slot preview (if any).\n */\nexport interface BoardInteractionInfo {\n  layout: LayoutItem[];\n  item: LayoutItem;\n  oldItem: LayoutItem;\n  placeholder: LayoutItem | null;\n}\n\n/** Visibility of the internal grid-line overlay. */\nexport type BoardGridLines = boolean | 'drag';\n\n/**\n * The subset of `Board.Widget` props a `Board` can set as defaults for every\n * widget it hosts (via `widgetProps`). Excludes `id`/`children`, which are\n * per-widget. Per-widget `Board.Widget` props override these.\n */\nexport type CubeBoardWidgetDefaults = Omit<\n  CubeBoardWidgetProps,\n  'id' | 'children'\n>;\n\nexport interface CubeBoardProps\n  extends Omit<\n      AllBaseProps,\n      'children' | 'onDragStart' | 'onDrag' | 'onResize'\n    >,\n    Omit<ContainerStyleProps, 'margin'> {\n  /** Stable board id (used for cross-board drag). Auto-generated if omitted. */\n  id?: string;\n  /** Controlled layout. */\n  layout?: LayoutItem[];\n  /** Initial layout for uncontrolled usage. */\n  defaultLayout?: LayoutItem[];\n  onLayoutChange?: (layout: LayoutItem[]) => void;\n  /** Called when a drag gesture starts. */\n  onDragStart?: (info: BoardInteractionInfo) => void;\n  /** Called on every step of a drag gesture. */\n  onDrag?: (info: BoardInteractionInfo) => void;\n  /** Called when a drag gesture ends (after the layout is committed). */\n  onDragStop?: (info: BoardInteractionInfo) => void;\n  /** Called when a resize gesture starts. */\n  onResizeStart?: (info: BoardInteractionInfo) => void;\n  /** Called on every step of a resize gesture. */\n  onResize?: (info: BoardInteractionInfo) => void;\n  /** Called when a resize gesture ends (after the layout is committed). */\n  onResizeStop?: (info: BoardInteractionInfo) => void;\n  /** Number of columns. @default 12 */\n  cols?: number;\n  /** Row height in pixels. @default 100 */\n  rowHeight?: number;\n  /** [horizontal, vertical] margin between widgets in pixels. @default [8, 8] */\n  margin?: [number, number];\n  /**\n   * [horizontal, vertical] padding inside the board. Defaults to `margin`, or\n   * to `[0, 0]` for an aligned nested board (`isAligned`) so its grid lines up\n   * with the ancestor board's.\n   */\n  containerPadding?: [number, number];\n  /** Maximum number of rows. @default Infinity */\n  maxRows?: number;\n  /**\n   * Compaction behavior. `'vertical'` / `'horizontal'` reflow widgets to remove\n   * gaps; `'free'` places each widget exactly where dropped and never pushes its\n   * neighbours (pair with `allowOverlap` to let widgets stack, otherwise moving\n   * onto an occupied cell is blocked); `null` disables compaction but still\n   * resolves collisions the legacy react-grid-layout way. @default 'vertical'\n   */\n  compact?: BoardCompactType;\n  /** Allow widgets to overlap. @default false */\n  allowOverlap?: boolean;\n  /** Block movement into occupied cells instead of pushing. @default false */\n  preventCollision?: boolean;\n  /** Enable dragging for all widgets. @default true */\n  isDraggable?: boolean;\n  /** Enable resizing for all widgets. @default true */\n  isResizable?: boolean;\n  /** Whether this board accepts widgets dropped from other boards. @default true */\n  isDroppable?: boolean;\n  /** Which resize handles to show. @default ['se'] */\n  resizeHandles?: ResizeHandleAxis[];\n  /**\n   * CSS selector for elements that must not start a pointer drag (e.g. form\n   * controls inside a widget: `\"input,textarea,button,a,.no-drag\"`). Does not\n   * affect keyboard moves — those only run when the widget host itself is\n   * focused. Can be overridden per widget on `Board.Widget`.\n   */\n  dragCancel?: string;\n  /**\n   * CSS selector for the only elements from which a pointer drag may start.\n   * Can be overridden per widget on `Board.Widget`.\n   */\n  dragHandle?: string;\n  /**\n   * Show grid lines behind the widgets. `true` always shows them, `'drag'`\n   * shows them only while a widget is being dragged or resized, `false` never.\n   * @default false\n   */\n  showGridLines?: BoardGridLines;\n  /**\n   * Align this board's grid with an ancestor `Board`'s layout. Only takes\n   * effect when the board is nested inside another `Board`'s widget. When set,\n   * every cell matches the parent's cell size exactly: the board inherits the\n   * parent's column pitch (deriving its own column count from its measured\n   * width) and uses the parent's row height verbatim. It never shrinks rows to\n   * fit; pair it with an `isAutoHeight` container so the widget grows to fit its\n   * rows at that height. @default false\n   */\n  isAligned?: boolean;\n  /** Grid/item layout constraints. */\n  constraints?: LayoutConstraint[];\n  /**\n   * Explicit container width in pixels. When provided, disables automatic width\n   * measurement (useful for SSR and tests).\n   */\n  width?: number;\n  /**\n   * Default props applied to every widget this board hosts. Per-widget\n   * `Board.Widget` props override these. Use it to add a card border to every\n   * widget (`widgetProps={{ isCard: true }}`) or set shared sizing/`styles`\n   * defaults without repeating them on each `Board.Widget`.\n   */\n  widgetProps?: Partial<CubeBoardWidgetDefaults>;\n  children?: ReactNode;\n}\n\nfunction compactTypeToCore(compact: BoardCompactType): CompactType {\n  if (compact === 'free') return null;\n  return compact;\n}\n\nfunction BoardInner(\n  props: CubeBoardProps,\n  ref: React.ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    id: providedId,\n    layout: controlledLayout,\n    defaultLayout,\n    onLayoutChange,\n    onDragStart,\n    onDrag,\n    onDragStop,\n    onResizeStart,\n    onResize: onResizeProp,\n    onResizeStop,\n    cols = 12,\n    rowHeight = 100,\n    margin = [8, 8],\n    containerPadding,\n    maxRows = Infinity,\n    compact = 'vertical',\n    allowOverlap = false,\n    preventCollision = false,\n    isDraggable = true,\n    isResizable = true,\n    isDroppable = true,\n    resizeHandles = ['se'],\n    dragCancel,\n    dragHandle,\n    showGridLines,\n    isAligned = false,\n    constraints,\n    width: providedWidth,\n    widgetProps,\n    children,\n    ...otherProps\n  } = props;\n\n  const registry = useBoardRegistry()!;\n  const parentMetrics = useBoardMetrics();\n  const host = useBoardHost();\n  const inheritedGridLines = useBoardGridLines();\n  const aligned = isAligned && !!parentMetrics;\n  // `widgetProps` may carry container style props directly (e.g. `fill`,\n  // `padding`, `radius`) alongside an explicit `styles` object, mirroring\n  // `Board.Widget`. Extract them into a single style map here so those defaults\n  // actually reach every widget - forwarding only `widgetProps.styles` would\n  // drop the direct props. A direct prop wins over the same key in `styles`.\n  const widgetPropsStyles = useMemo<Styles | undefined>(() => {\n    if (!widgetProps) return undefined;\n    const extracted = extractStyles(widgetProps, CONTAINER_STYLES);\n    return Object.keys(extracted).length > 0 ? extracted : undefined;\n  }, [widgetProps]);\n  // A nested board with no explicit `showGridLines` inherits the ancestor's:\n  // when the ancestor has grid lines enabled, show them here while dragging.\n  const effectiveShowGridLines: BoardGridLines =\n    showGridLines ?? (inheritedGridLines ? 'drag' : false);\n  const generatedId = useId();\n  const boardId = providedId ?? generatedId;\n\n  const containerRef = useCombinedRefs(ref);\n  const contentRef = useRef<HTMLDivElement | null>(null);\n  const [measuredWidth, setMeasuredWidth] = useState<number>(0);\n  // Rendered height is only needed for aligned nested boards (to fit rows into\n  // the space the container grants). It never drives the board's own height, so\n  // measuring it cannot create a feedback loop.\n  const [measuredHeight, setMeasuredHeight] = useState<number>(0);\n  const width = providedWidth ?? measuredWidth;\n\n  const onResizeContainer = useEvent(() => {\n    const el = containerRef.current;\n    if (!el) return;\n    // A hidden container (e.g. the board inside an inactive tab after a\n    // spring-loaded tab switch) reports 0. Keep the last non-zero measurement so\n    // the board stays \"ready\" and keeps its widget hosts mounted while briefly\n    // hidden. Otherwise the board would render nothing, unmounting the widget\n    // that owns an in-flight drag gesture and stranding the drag (React Aria's\n    // `useMove` tears down its listeners on unmount, so the drop never fires).\n    const nextWidth = el.offsetWidth;\n    const nextHeight = el.offsetHeight;\n    if (nextWidth > 0) setMeasuredWidth(nextWidth);\n    if (nextHeight > 0) setMeasuredHeight(nextHeight);\n  });\n  useResizeObserver({ ref: containerRef, onResize: onResizeContainer });\n  useEffect(() => {\n    if (providedWidth == null) {\n      onResizeContainer();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [providedWidth]);\n\n  const {\n    layout,\n    layoutRef,\n    placeholder,\n    placeholderRef,\n    setPlaceholder,\n    applyLayout,\n  } = useBoardLayout({\n    layout: controlledLayout,\n    defaultLayout,\n    onLayoutChange,\n  });\n\n  // Re-render when any widget's registered content/config changes.\n  useSyncExternalStore(registry.store.subscribe, registry.store.getVersion);\n\n  // In aligned mode the board inherits the parent's gap so widget edges line up\n  // with the surrounding layout; otherwise it uses its own `margin`.\n  const effectiveMargin: readonly [number, number] = aligned\n    ? parentMetrics!.margin\n    : margin;\n  // The board keeps its own padding (it sits inside the container's chrome);\n  // when unspecified it defaults to the effective gap. An aligned nested board\n  // is the exception: its grid origin must sit flush on the container widget's\n  // edge (which already coincides with the parent's column-0 origin) so its\n  // columns line up with the ancestor board's. Inheriting the gap there would\n  // inset every column by one margin and break the alignment, so it defaults\n  // to zero padding instead.\n  const resolvedPadding: readonly [number, number] =\n    containerPadding ?? (aligned ? [0, 0] : effectiveMargin);\n\n  const rows = Math.max(\n    bottom(layout),\n    placeholder ? placeholder.y + placeholder.h : 0,\n  );\n\n  // Derive the aligned column count so each column keeps the parent's pixel\n  // pitch: as the container widget is resized, columns are added/removed rather\n  // than stretched. `containerWidth` is then back-solved so `calcGridColWidth`\n  // returns exactly the parent's column width.\n  const parentColWidth = aligned ? parentMetrics!.colWidth : 0;\n  // `width` is `offsetWidth` (an integer the browser rounds), while\n  // `parentColWidth` is fractional. A container sized to exactly N parent\n  // columns can therefore measure a fraction of a pixel short, so a bare\n  // `Math.floor` would drop the last column and leave its space unused. Add a\n  // small pixel tolerance to absorb that rounding; it only rounds up when the\n  // width is within ~2px of a full column, so it can't invent a column that\n  // genuinely doesn't fit.\n  const ALIGN_WIDTH_TOLERANCE = 2;\n  const alignedCols =\n    aligned && width > 0\n      ? Math.max(\n          1,\n          Math.floor(\n            (width -\n              resolvedPadding[0] * 2 +\n              effectiveMargin[0] +\n              ALIGN_WIDTH_TOLERANCE) /\n              (parentColWidth + effectiveMargin[0]),\n          ),\n        )\n      : cols;\n  const effectiveCols = aligned ? alignedCols : cols;\n  const effectiveContainerWidth = aligned\n    ? parentColWidth * effectiveCols +\n      effectiveMargin[0] * Math.max(0, effectiveCols - 1) +\n      resolvedPadding[0] * 2\n    : width;\n\n  // An aligned board uses the parent's row height verbatim, so every cell is\n  // exactly the parent's cell size (width already matches via the inherited\n  // column pitch). It never shrinks rows to fit; pair it with an `isAutoHeight`\n  // container so the widget grows to fit the rows at this height instead.\n  const effectiveRowHeight = aligned ? parentMetrics!.rowHeight : rowHeight;\n\n  const positionParams = useMemo<PositionParams>(\n    () => ({\n      margin: effectiveMargin,\n      containerPadding: resolvedPadding,\n      containerWidth: effectiveContainerWidth,\n      cols: effectiveCols,\n      rowHeight: effectiveRowHeight,\n      maxRows,\n    }),\n    [\n      effectiveMargin[0],\n      effectiveMargin[1],\n      resolvedPadding[0],\n      resolvedPadding[1],\n      effectiveContainerWidth,\n      effectiveCols,\n      effectiveRowHeight,\n      maxRows,\n    ],\n  );\n\n  // 'free' means no compaction (nothing is pushed up/left or recompacted) AND a\n  // dragged widget never pushes or swaps its neighbours: it is placed exactly\n  // where dropped. Without `allowOverlap` a move onto an occupied cell is\n  // blocked (the widget stays at its last free spot); with `allowOverlap`\n  // widgets may stack. The explicit `preventCollision` prop still applies to the\n  // compacting modes (`vertical` / `horizontal`) and to the legacy `null` mode.\n  const compactor = useMemo<Compactor>(\n    () =>\n      getCompactor(\n        compactTypeToCore(compact),\n        allowOverlap,\n        compact === 'free' ? !allowOverlap : preventCollision,\n      ),\n    [compact, allowOverlap, preventCollision],\n  );\n\n  const resolvedConstraints = constraints ?? defaultConstraints;\n\n  const computedHeight =\n    rows > 0\n      ? rows * effectiveRowHeight +\n        Math.max(0, rows - 1) * effectiveMargin[1] +\n        resolvedPadding[1] * 2\n      : effectiveRowHeight;\n  // An aligned board fills the height the container grants it, so it reports its\n  // measured height; otherwise it reports the height its content needs.\n  const containerHeight =\n    aligned && measuredHeight > 0 ? measuredHeight : computedHeight;\n\n  // Live refs so the stable registry entry always reads current values.\n  const liveRef = useRef({\n    positionParams,\n    compactor,\n    constraints: resolvedConstraints,\n    maxRows,\n    containerHeight,\n    isDroppable,\n  });\n  liveRef.current = {\n    positionParams,\n    compactor,\n    constraints: resolvedConstraints,\n    maxRows,\n    containerHeight,\n    isDroppable,\n  };\n\n  const applyLayoutEvent = useEvent(applyLayout);\n  const setPlaceholderEvent = useEvent(setPlaceholder);\n\n  const entryRef = useRef<BoardEntry | null>(null);\n  if (!entryRef.current) {\n    entryRef.current = {\n      id: boardId,\n      getContentRect: () => contentRef.current?.getBoundingClientRect() ?? null,\n      getContentNode: () => contentRef.current,\n      getPositionParams: () => liveRef.current.positionParams,\n      getConstraints: () => liveRef.current.constraints,\n      getCompactor: () => liveRef.current.compactor,\n      getMaxRows: () => liveRef.current.maxRows,\n      getContainerHeight: () => liveRef.current.containerHeight,\n      getLayout: () => layoutRef.current,\n      applyLayout: (next, commit) => applyLayoutEvent(next, commit),\n      setPlaceholder: (item) => setPlaceholderEvent(item),\n      isDroppable: () => liveRef.current.isDroppable,\n    };\n  }\n\n  useEffect(() => {\n    const entry = entryRef.current!;\n    // Keep the entry's id in sync with the (possibly changed) board id before\n    // registering. The previous effect's cleanup has already removed the old id,\n    // so registering here keys the entry under the current id.\n    entry.id = boardId;\n    return registry.registerBoard(entry);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [boardId]);\n\n  // When the aligned column count changes (the container was resized), reflow\n  // the layout to the new width: clamp items back into bounds and recompact so\n  // nothing overflows the narrower/wider grid.\n  const recompactForCols = useEvent((nextCols: number) => {\n    const corrected = correctBounds(cloneLayout(layoutRef.current), {\n      cols: nextCols,\n    });\n    const compacted = [\n      ...liveRef.current.compactor.compact(corrected, nextCols),\n    ];\n    applyLayoutEvent(compacted, true);\n  });\n  // `null` until the first *measured* aligned column count is established. This\n  // avoids treating the initial zero-width -> measured-width transition as a\n  // column-count change: a board that measures its own width (no explicit\n  // `width` prop) renders first with `width === 0`, so `effectiveCols` falls\n  // back to `cols` and only becomes the derived aligned count once measured.\n  // Seeding the baseline on that first measured value (without committing)\n  // prevents an unsolicited reflow + `onLayoutChange` before the user interacts.\n  const prevAlignedColsRef = useRef<number | null>(null);\n  useEffect(() => {\n    if (!aligned) {\n      // Re-entering aligned mode should re-seed from the next measured value.\n      prevAlignedColsRef.current = null;\n      return;\n    }\n    // Wait for a real width measurement; the fallback-`cols` value that stands\n    // in before measurement is not a meaningful aligned column count.\n    if (width <= 0) return;\n    if (prevAlignedColsRef.current === null) {\n      prevAlignedColsRef.current = effectiveCols;\n      return;\n    }\n    if (prevAlignedColsRef.current === effectiveCols) return;\n    prevAlignedColsRef.current = effectiveCols;\n    recompactForCols(effectiveCols);\n  }, [aligned, width, effectiveCols, recompactForCols]);\n\n  // Natural height this board wants: its rows at the (parent) row height. When\n  // the container is shorter than this, an `isAutoHeight` host grows to fit it\n  // (aligned boards no longer shrink their rows).\n  const naturalHeight =\n    rows > 0\n      ? rows * effectiveRowHeight +\n        Math.max(0, rows - 1) * effectiveMargin[1] +\n        resolvedPadding[1] * 2\n      : effectiveRowHeight;\n\n  // Report this aligned board's height deficit to an auto-sizing host so the\n  // host can both grow to fit and pin its resize floor. The value is signed:\n  // positive when the board is squeezed (needs more height), negative when the\n  // container is taller than needed (so the floor can be lowered). The host\n  // never shrinks the widget on its own - it only grows and clamps resizing.\n  const requestHeightDeficit = host?.requestHeightDeficit;\n  useEffect(() => {\n    if (!aligned || !host?.isAutoHeight || !requestHeightDeficit) return;\n    if (measuredHeight <= 0) return;\n    requestHeightDeficit(naturalHeight - measuredHeight);\n  }, [\n    aligned,\n    host?.isAutoHeight,\n    requestHeightDeficit,\n    naturalHeight,\n    measuredHeight,\n  ]);\n\n  // In-board resize orchestration.\n  const resizeStateRef = useRef<{\n    id: string;\n    axis: ResizeHandleAxis;\n    item: LayoutItem;\n    origin: Position;\n    accX: number;\n    accY: number;\n  } | null>(null);\n\n  // Minimum rows each auto-height widget currently needs to fit its content.\n  // Read during resize so a widget can never be dragged shorter than its\n  // content, and used to grow the item when the content needs more room.\n  const autoHeightMinRowsRef = useRef<Record<string, number>>({});\n\n  const handleResize = useEvent(\n    (\n      id: string,\n      axis: ResizeHandleAxis,\n      phase: ResizePhase,\n      dx: number,\n      dy: number,\n    ) => {\n      const pp = liveRef.current.positionParams;\n\n      if (phase === 'start') {\n        const rawItem = getLayoutItem(layoutRef.current, id);\n        if (!rawItem) return;\n        // Layout-item min/max and constraints win; otherwise fall back to the\n        // ones declared on the owning `Board.Widget` (and then the board-level\n        // `widgetProps` defaults) so `applySizeConstraints` (via `minMaxSize`)\n        // picks them up.\n        const reg = registry.store.get(id);\n        const item: LayoutItem = {\n          ...rawItem,\n          minW: rawItem.minW ?? reg?.minW ?? widgetProps?.minW,\n          maxW: rawItem.maxW ?? reg?.maxW ?? widgetProps?.maxW,\n          minH: rawItem.minH ?? reg?.minH ?? widgetProps?.minH,\n          maxH: rawItem.maxH ?? reg?.maxH ?? widgetProps?.maxH,\n          constraints:\n            rawItem.constraints ?? reg?.constraints ?? widgetProps?.constraints,\n        };\n        resizeStateRef.current = {\n          id,\n          axis,\n          item: { ...item },\n          origin: calcGridItemPosition(pp, item.x, item.y, item.w, item.h),\n          accX: 0,\n          accY: 0,\n        };\n        setPlaceholder({ ...item });\n        onResizeStart?.({\n          layout: layoutRef.current,\n          item: { ...item },\n          oldItem: { ...item },\n          placeholder: { ...item },\n        });\n        return;\n      }\n\n      const rs = resizeStateRef.current;\n      if (!rs) return;\n\n      if (phase === 'end') {\n        const finalLayout = [...layoutRef.current];\n        applyLayout(finalLayout, true);\n        setPlaceholder(null);\n        onResizeStop?.({\n          layout: finalLayout,\n          item: getLayoutItem(finalLayout, id) ?? rs.item,\n          oldItem: rs.item,\n          placeholder: null,\n        });\n        resizeStateRef.current = null;\n        return;\n      }\n\n      rs.accX += dx;\n      rs.accY += dy;\n\n      const { origin, item, axis: handle } = rs;\n      let newW = origin.width;\n      let newH = origin.height;\n      if (handle.includes('e')) newW = origin.width + rs.accX;\n      if (handle.includes('w')) newW = origin.width - rs.accX;\n      if (handle.includes('s')) newH = origin.height + rs.accY;\n      if (handle.includes('n')) newH = origin.height - rs.accY;\n      newW = Math.max(newW, 8);\n      newH = Math.max(newH, 8);\n\n      const raw = calcWH(pp, newW, newH, item.x, item.y, handle);\n      const constrained = applySizeConstraints(\n        liveRef.current.constraints,\n        item,\n        raw.w,\n        raw.h,\n        handle,\n        {\n          cols: pp.cols,\n          maxRows: liveRef.current.maxRows,\n          containerWidth: pp.containerWidth,\n          containerHeight: liveRef.current.containerHeight,\n          rowHeight: pp.rowHeight,\n          margin: pp.margin,\n          layout: layoutRef.current,\n        },\n      );\n\n      // An auto-height widget cannot be resized shorter than the content it\n      // hosts (a nested board) currently needs, so pin its height to the floor.\n      const floorRows = autoHeightMinRowsRef.current[id] ?? 0;\n      const finalW = constrained.w;\n      const finalH = Math.max(constrained.h, floorRows);\n\n      let x = item.x;\n      let y = item.y;\n      if (handle.includes('w')) x = item.x + item.w - finalW;\n      if (handle.includes('n')) y = item.y + item.h - finalH;\n      x = Math.max(0, x);\n      y = Math.max(0, y);\n\n      let newItem: LayoutItem = {\n        ...item,\n        x,\n        y,\n        w: finalW,\n        h: finalH,\n      };\n\n      // Collision-blocking modes (`free` without `allowOverlap`, or an explicit\n      // `preventCollision`) run a no-op/gap-filling compactor that never\n      // resolves overlaps, so a resize must be blocked here the same way the\n      // drag path blocks a move (`moveElement` reverts on collision). Without\n      // this, growing or moving an edge via a resize handle could push the box\n      // onto an occupied cell. When the new box overlaps a neighbour, revert to\n      // the last committed box for this widget so the gesture stalls at the\n      // last valid size/position instead of overlapping.\n      const compactor = liveRef.current.compactor;\n      if (compactor.preventCollision && !compactor.allowOverlap) {\n        const collides = getAllCollisions(layoutRef.current, newItem).some(\n          (other) => other.i !== id,\n        );\n        if (collides) {\n          const lastValid = getLayoutItem(layoutRef.current, id);\n          if (lastValid) newItem = { ...lastValid };\n        }\n      }\n\n      const working = modifyLayout(layoutRef.current, newItem);\n      const compacted = [...compactor.compact(working, pp.cols)];\n      applyLayout(compacted, false);\n      const nextPlaceholder = getLayoutItem(compacted, id) ?? newItem;\n      setPlaceholder(nextPlaceholder);\n      onResizeProp?.({\n        layout: compacted,\n        item: getLayoutItem(compacted, id) ?? newItem,\n        oldItem: rs.item,\n        placeholder: nextPlaceholder,\n      });\n    },\n  );\n\n  // Record an auto-height widget's needed rows. Grow the item when its content\n  // needs more height (only ever increases); the stored value is also the\n  // resize floor enforced in `handleResize`.\n  const handleAutoHeight = useEvent((id: string, neededRows: number) => {\n    autoHeightMinRowsRef.current[id] = neededRows;\n    const current = getLayoutItem(layoutRef.current, id);\n    if (!current || neededRows <= current.h) return;\n    // While a drag or resize gesture is in flight the layout is transient - the\n    // registry (drag) and `handleResize` write uncommitted previews and commit\n    // only on drop / release. Growing an auto-height widget here with\n    // `commit: true` would fire `onLayoutChange` mid-gesture and persist the\n    // in-flight positions of the widget being moved. Skip the grow-commit; the\n    // floor ref is already updated above (so `handleResize` still respects it),\n    // and the deficit effect re-fires once the gesture settles.\n    if (registry.dragState || resizeStateRef.current) return;\n    const pp = liveRef.current.positionParams;\n    const working = modifyLayout(layoutRef.current, {\n      ...current,\n      h: neededRows,\n    });\n    const compacted = [...liveRef.current.compactor.compact(working, pp.cols)];\n    applyLayout(compacted, true);\n  });\n\n  // The dragged item captured at gesture start, so drag callbacks can report the\n  // original position throughout (and after a cross-board transfer removes the\n  // item from this board's layout).\n  const dragOldItemRef = useRef<LayoutItem | null>(null);\n\n  const handleDragLifecycle = useEvent((id: string, phase: ResizePhase) => {\n    const currentLayout = layoutRef.current;\n    const liveItem = getLayoutItem(currentLayout, id);\n\n    if (phase === 'start') {\n      dragOldItemRef.current = liveItem ? { ...liveItem } : null;\n    }\n    const oldItem = dragOldItemRef.current ?? liveItem;\n    if (!oldItem) return;\n    const item = liveItem ?? oldItem;\n\n    const info: BoardInteractionInfo = {\n      layout: currentLayout,\n      item,\n      oldItem,\n      // Read the live ref, not render-time state: the registry calls\n      // `setPlaceholder` synchronously right before this fires, and that only\n      // schedules a re-render, so `placeholder` state still holds the previous\n      // value (or a stale preview after the drop clears it to `null`).\n      placeholder: placeholderRef.current,\n    };\n    if (phase === 'start') onDragStart?.(info);\n    else if (phase === 'move') onDrag?.(info);\n    else {\n      onDragStop?.(info);\n      dragOldItemRef.current = null;\n    }\n  });\n\n  const styles: Styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  const dragState = registry.dragState;\n  const ready = width > 0;\n\n  // Gate widget position transitions off until the widgets have been painted at\n  // their initial positions once. Without this, the first render animates every\n  // widget sliding in from its default spot (0, 0). We render one frame with the\n  // gate closed (no `inset` transition), let the browser paint, then lift it so\n  // later reflows animate. A double rAF waits past the first committed paint;\n  // re-arm whenever the board (re)becomes ready so a board that hides and\n  // remeasures (e.g. inside a tab) re-settles too.\n  const [settled, setSettled] = useState(false);\n  useEffect(() => {\n    if (!ready) {\n      setSettled(false);\n      return;\n    }\n    let id1 = 0;\n    let id2 = 0;\n    id1 = requestAnimationFrame(() => {\n      id2 = requestAnimationFrame(() => setSettled(true));\n    });\n    return () => {\n      cancelAnimationFrame(id1);\n      if (id2) cancelAnimationFrame(id2);\n    };\n  }, [ready]);\n\n  // When the widget that hosts this nested board is the one being dragged, its\n  // whole content (including this board) floats as a single unit, so its own\n  // grid lines add nothing but clutter. Suppress them for that drag.\n  const hostWidgetIsDragging =\n    !!dragState && dragState.nestedBoardIds.has(boardId);\n\n  const placeholderStyle = placeholder\n    ? (() => {\n        const pos = calcGridItemPosition(\n          positionParams,\n          placeholder.x,\n          placeholder.y,\n          placeholder.w,\n          placeholder.h,\n        );\n        return {\n          left: `${pos.left}px`,\n          top: `${pos.top}px`,\n          width: `${pos.width}px`,\n          height: `${pos.height}px`,\n        };\n      })()\n    : null;\n\n  const showPlaceholder = placeholder && placeholderStyle;\n\n  const gridLinesVisible =\n    !hostWidgetIsDragging &&\n    (effectiveShowGridLines === true ||\n      (effectiveShowGridLines === 'drag' && (!!dragState || !!placeholder)));\n  const gridOverlayStyle = gridLinesVisible\n    ? (() => {\n        const colWidth = calcGridColWidth(positionParams);\n        const rowHeightPx = positionParams.rowHeight;\n        // A grid with margins has real gaps between cells, so any line-based\n        // overlay either misses a cell edge (single line at the cell pitch) or\n        // shows a double line in every gap (a line at both edges). Instead,\n        // paint each snap cell as a faint block sized exactly `colWidth` x\n        // `rowHeightPx` with the margin gaps left transparent: the blocks line\n        // up 1:1 with the drop-zone placeholder and there are no lines to\n        // double. Column stripes form the background; a row-band alpha mask\n        // intersects them into cells.\n        const pitchX = colWidth + effectiveMargin[0];\n        const pitchY = rowHeightPx + effectiveMargin[1];\n        // Position the overlay as an explicit rectangle inset by the board's\n        // resolved padding and sized to exactly cover the grid content (cols x\n        // rows). This makes the padding a symmetric frame on all four edges (the\n        // previous `inset: 0` + top-left-anchored repeat left the padding\n        // unvisualized on the right/bottom and inside any extra min-height) and\n        // lets the cell pattern tile from the overlay's own origin.\n        const padX = resolvedPadding[0];\n        const padY = resolvedPadding[1];\n        const gridWidth = Math.max(0, effectiveContainerWidth - padX * 2);\n        const gridHeight =\n          rows > 0 ? rows * rowHeightPx + (rows - 1) * effectiveMargin[1] : 0;\n        const fill = 'var(--border-color)';\n        const columns = `repeating-linear-gradient(to right, ${fill} 0, ${fill} ${colWidth}px, transparent ${colWidth}px, transparent ${pitchX}px)`;\n        const rowsGrad = `repeating-linear-gradient(to bottom, #000 0, #000 ${rowHeightPx}px, transparent ${rowHeightPx}px, transparent ${pitchY}px)`;\n        return {\n          left: `${padX}px`,\n          top: `${padY}px`,\n          width: `${gridWidth}px`,\n          height: `${gridHeight}px`,\n          backgroundImage: columns,\n          backgroundPosition: '0 0',\n          backgroundRepeat: 'repeat',\n          maskImage: rowsGrad,\n          WebkitMaskImage: rowsGrad,\n          maskPosition: '0 0',\n          WebkitMaskPosition: '0 0',\n          maskRepeat: 'repeat',\n          WebkitMaskRepeat: 'repeat',\n        };\n      })()\n    : null;\n\n  // Metrics this board exposes to any aligned boards nested inside its widgets.\n  const boardMetrics = useMemo<BoardMetrics>(\n    () => ({\n      colWidth: calcGridColWidth(positionParams),\n      rowHeight: positionParams.rowHeight,\n      margin: positionParams.margin,\n      containerPadding: positionParams.containerPadding,\n    }),\n    [positionParams],\n  );\n\n  return (\n    <BoardMetricsContext.Provider value={boardMetrics}>\n      <BoardGridLinesContext.Provider\n        value={\n          effectiveShowGridLines === true || effectiveShowGridLines === 'drag'\n        }\n      >\n        <BoardElement\n          {...filterBaseProps(otherProps, { eventProps: true })}\n          ref={containerRef}\n          styles={styles}\n          // Non-aligned: use min-height (not a fixed height) so the board\n          // auto-sizes to its content by default but can still grow to fill a\n          // taller parent. Widgets are absolutely positioned, so growing never\n          // shifts them, and the content layer (inset: 0) always covers the full\n          // board -> the whole board is droppable. Aligned: omit the inline height\n          // so the board fills (and is bounded by) the space the container grants,\n          // which is what drives the reduced row height.\n          style={aligned ? undefined : { minHeight: `${containerHeight}px` }}\n          mods={{\n            dragging: !!dragState,\n            'drop-target': dragState?.currentBoardId === boardId,\n          }}\n        >\n          <ContentLayer ref={contentRef}>\n            {ready && gridOverlayStyle ? (\n              <GridOverlayElement aria-hidden=\"true\" style={gridOverlayStyle} />\n            ) : null}\n            {ready\n              ? layout.map((item) => {\n                  const registration = registry.store.get(item.i);\n                  const widgetDraggable =\n                    isDraggable &&\n                    (registration?.isDraggable ?? widgetProps?.isDraggable) !==\n                      false &&\n                    item.isDraggable !== false &&\n                    !item.static;\n                  const widgetResizable =\n                    isResizable &&\n                    (registration?.isResizable ?? widgetProps?.isResizable) !==\n                      false &&\n                    item.isResizable !== false &&\n                    !item.static;\n                  const handles =\n                    item.resizeHandles ??\n                    registration?.resizeHandles ??\n                    widgetProps?.resizeHandles ??\n                    resizeHandles;\n                  const widgetDragCancel =\n                    registration?.dragCancel ??\n                    widgetProps?.dragCancel ??\n                    dragCancel;\n                  const widgetDragHandle =\n                    registration?.dragHandle ??\n                    widgetProps?.dragHandle ??\n                    dragHandle;\n                  // Per-widget `isCard`/`styles` override the board-level\n                  // `widgetProps` defaults; `isCard` defaults to `false`\n                  // (borderless - widgets are always filled and rounded).\n                  const widgetIsCard =\n                    registration?.isCard ?? widgetProps?.isCard ?? false;\n                  // Per-widget `isAutoHeight`/`qa` fall back to the board-level\n                  // `widgetProps` defaults (mirroring the other widget props).\n                  const widgetIsAutoHeight =\n                    registration?.isAutoHeight ??\n                    widgetProps?.isAutoHeight ??\n                    false;\n                  const widgetQa = registration?.qa ?? widgetProps?.qa;\n                  // Merge board-level `widgetProps` styles (its `styles` object\n                  // plus direct style props) with the per-widget styles so\n                  // shared defaults survive when a widget sets even a single\n                  // style prop; per-widget styles win on conflicts. Only merge\n                  // when both exist to preserve reference stability (and avoid\n                  // churn) in the common single-source case.\n                  const widgetStyles =\n                    registration?.styles && widgetPropsStyles\n                      ? mergeStyles(widgetPropsStyles, registration.styles)\n                      : registration?.styles ?? widgetPropsStyles;\n\n                  return (\n                    <WidgetHost\n                      key={item.i}\n                      boardId={boardId}\n                      item={item}\n                      positionParams={positionParams}\n                      registration={registration}\n                      isCard={widgetIsCard}\n                      styles={widgetStyles as Styles}\n                      isDraggable={widgetDraggable}\n                      isResizable={widgetResizable}\n                      resizeHandles={handles}\n                      isAutoHeight={widgetIsAutoHeight}\n                      qa={widgetQa}\n                      dragCancel={widgetDragCancel}\n                      dragHandle={widgetDragHandle}\n                      registry={registry}\n                      dragState={dragState}\n                      settled={settled}\n                      onResize={handleResize}\n                      onAutoHeight={handleAutoHeight}\n                      onDragLifecycle={handleDragLifecycle}\n                    />\n                  );\n                })\n              : null}\n            {showPlaceholder ? (\n              <PlaceholderElement\n                aria-hidden=\"true\"\n                style={placeholderStyle!}\n              />\n            ) : null}\n          </ContentLayer>\n          {children}\n        </BoardElement>\n      </BoardGridLinesContext.Provider>\n    </BoardMetricsContext.Provider>\n  );\n}\n\nconst BoardInnerForwarded = forwardRef(BoardInner);\n\n/**\n * A draggable and resizable widget grid. Widgets are declared with\n * `Board.Widget` and positioned via a `layout`. Wrap multiple boards in a\n * `BoardProvider` to enable dragging widgets between them.\n */\nexport const Board = forwardRef(function Board(\n  props: CubeBoardProps,\n  ref: React.ForwardedRef<HTMLDivElement>,\n) {\n  const existingRegistry = useBoardRegistry();\n\n  if (existingRegistry) {\n    return <BoardInnerForwarded {...props} ref={ref} />;\n  }\n\n  return (\n    <BoardProvider>\n      <BoardInnerForwarded {...props} ref={ref} />\n    </BoardProvider>\n  );\n});\n"],"mappings":"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"}

package/dist/components/layout/Board/BoardProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { BoardDragActiveContext, BoardRegistryContext } from "./board-context.js";
 import { useBoardRegistry } from "./use-board-registry.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/layout/Board/BoardResponsive.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { getCompactor } from "./grid-core/compactors.js";

package/dist/components/layout/Board/Widget.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useBoardRegistry } from "./board-context.js";

package/dist/components/layout/Board/WidgetHost.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { BoardHostContext } from "./board-context.js";
@@ -347,6 +347,10 @@ function WidgetHost(props) {
 		...moveProps.onTouchStart && { onTouchStart: (e) => {
 			if (shouldGateDrag(e.target)) return;
 			moveProps.onTouchStart(e);
+		} },
+		...moveProps.onKeyDown && { onKeyDown: (e) => {
+			if (e.target !== e.currentTarget) return;
+			moveProps.onKeyDown(e);
 		} }
 	};
 	const handleResize = (axis, phase, dx, dy) => {

package/dist/components/layout/Board/WidgetHost.js.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetHost.js","names":["mergeProps"],"sources":["../../../../src/components/layout/Board/WidgetHost.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport { CSSProperties, useMemo, useRef, useState } from 'react';\nimport { useFocusRing, useFocusWithin, useHover, useMove } from 'react-aria';\nimport { createPortal } from 'react-dom';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { mergeProps } from '../../../utils/react';\n\nimport {\n  BoardDragState,\n  BoardHost,\n  BoardHostContext,\n  BoardRegistryContextValue,\n  ViewportRect,\n} from './board-context';\nimport { WidgetRegistration } from './board-store';\nimport {\n  calcGridColWidth,\n  calcGridItemPosition,\n  LayoutItem,\n  PositionParams,\n  ResizeHandleAxis,\n} from './grid-core';\n\nexport type ResizePhase = 'start' | 'move' | 'end';\n\n/**\n * Slack (px) absorbed when converting an auto-height widget's content height to\n * whole rows, so sub-pixel measurement/rounding noise never bumps an extra row.\n */\nconst AUTO_HEIGHT_TOLERANCE = 4;\n\nconst WidgetElement = tasty({\n  qa: 'BoardWidget',\n  styles: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    // Widgets always carry a `#surface-2` fill and rounded corners. The `card`\n    // modifier (board-level `widgetProps.isCard` or per-widget `isCard`) adds a\n    // border on top; a non-card widget is borderless so nested boards can align\n    // their columns flush with the parent grid.\n    fill: '#surface-2',\n    radius: '1cr',\n    border: {\n      '': false,\n      card: true,\n    },\n    shadow: {\n      '': false,\n      'hovered & !card & (draggable | resizing)': '0 0 0 1bw #border',\n      // `$dialog-shadow` uses Glaze `#shadow-lg`, which adapts to dark / high-contrast schemes.\n      'drag | resizing': '$dialog-shadow',\n    },\n    outline: {\n      '': '1bw #primary-text.0',\n      'focus-visible': '1bw #primary-text',\n    },\n    outlineOffset: '1bw',\n    zIndex: {\n      '': 1,\n      'drag | resizing': 10,\n    },\n    // The pointer-drag ghost (the clone that floats in the overlay) is slightly\n    // translucent so the user can see through it to whatever it hovers over -\n    // e.g. a Tabs header underneath - and land a precise drop / tab switch. The\n    // in-place host (keyboard drags, which never float) stays fully opaque.\n    opacity: {\n      '': 1,\n      floating: 0.8,\n    },\n    // Reflowing widgets animate their position and size. The actively\n    // dragged/resized element - and the floating overlay clone - must track the\n    // pointer with no lag, so they drop geometry from the list. Geometry is also\n    // dropped until the board reports `settled`: on init widgets jump to their\n    // first measured positions, and without this gate they would slide/grow in\n    // from their default box. The board lifts the gate after the first\n    // positioned paint so subsequent reflows animate normally.\n    transition: {\n      '': 'theme, shadow, opacity',\n      settled: 'theme, shadow, opacity, inset, width, height',\n      'drag | floating | resizing': 'theme, shadow, opacity',\n    },\n    boxSizing: 'border-box',\n    userSelect: {\n      '': 'auto',\n      'drag | resizing': 'none',\n    },\n    cursor: {\n      '': 'auto',\n      draggable: 'grab',\n      drag: 'grabbing',\n    },\n    touchAction: 'none',\n    overflow: 'hidden',\n  },\n});\n\nconst HandleElement = tasty({\n  qa: 'BoardResizeHandle',\n  styles: {\n    position: 'absolute',\n    zIndex: 20,\n    fill: '#clear',\n    // Overhang: how far the hit-zone extends beyond the widget edge.\n    '--handle-size': '24px',\n    '--handle-overhang': '-8px',\n    '--handle-inset': '8px',\n    width: {\n      '': '$handle-size',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': 'auto',\n    },\n    height: {\n      '': '$handle-size',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': 'auto',\n    },\n    top: {\n      '': 'auto',\n      '[data-axis=\"n\"] | [data-axis=\"ne\"] | [data-axis=\"nw\"]':\n        '$handle-overhang',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': '$handle-inset',\n    },\n    bottom: {\n      '': 'auto',\n      '[data-axis=\"s\"] | [data-axis=\"se\"] | [data-axis=\"sw\"]':\n        '$handle-overhang',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': '$handle-inset',\n    },\n    left: {\n      '': 'auto',\n      '[data-axis=\"w\"] | [data-axis=\"nw\"] | [data-axis=\"sw\"]':\n        '$handle-overhang',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '$handle-inset',\n    },\n    right: {\n      '': 'auto',\n      '[data-axis=\"e\"] | [data-axis=\"ne\"] | [data-axis=\"se\"]':\n        '$handle-overhang',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '$handle-inset',\n    },\n    cursor: {\n      '': 'default',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': 'ns-resize',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': 'ew-resize',\n      '[data-axis=\"ne\"] | [data-axis=\"sw\"]': 'nesw-resize',\n      '[data-axis=\"nw\"] | [data-axis=\"se\"]': 'nwse-resize',\n    },\n    touchAction: 'none',\n  },\n});\n\nconst GripElement = tasty({\n  qa: 'BoardResizeGrip',\n  styles: {\n    position: 'absolute',\n    width: '10px',\n    height: '10px',\n    boxSizing: 'border-box',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      revealed: 1,\n    },\n    transition: 'opacity 120ms ease-in-out',\n    borderTop: {\n      '': '0',\n      '[data-axis=\"ne\"] | [data-axis=\"nw\"]': '2px solid #dark.40',\n    },\n    borderBottom: {\n      '': '0',\n      '[data-axis=\"se\"] | [data-axis=\"sw\"]': '2px solid #dark.40',\n    },\n    borderLeft: {\n      '': '0',\n      '[data-axis=\"nw\"] | [data-axis=\"sw\"]': '2px solid #dark.40',\n    },\n    borderRight: {\n      '': '0',\n      '[data-axis=\"ne\"] | [data-axis=\"se\"]': '2px solid #dark.40',\n    },\n    radius: {\n      '': '0',\n      '[data-axis=\"se\"]': '0 0 4px 0',\n      '[data-axis=\"sw\"]': '0 0 0 4px',\n      '[data-axis=\"ne\"]': '0 4px 0 0',\n      '[data-axis=\"nw\"]': '4px 0 0 0',\n    },\n    top: {\n      '': 'auto',\n      '[data-axis=\"ne\"] | [data-axis=\"nw\"]': '4px',\n    },\n    bottom: {\n      '': 'auto',\n      '[data-axis=\"se\"] | [data-axis=\"sw\"]': '4px',\n    },\n    left: {\n      '': 'auto',\n      '[data-axis=\"nw\"] | [data-axis=\"sw\"]': '4px',\n    },\n    right: {\n      '': 'auto',\n      '[data-axis=\"ne\"] | [data-axis=\"se\"]': '4px',\n    },\n  },\n});\n\n// Edge axes (n/s/e/w) get a dotted grip affordance, revealed on\n// hover/focus/resize. The dots line up along the edge (a vertical column for the\n// e/w handles, a horizontal row for n/s), matching the design-system pane grip\n// (see `Layout.Pane`). Purely visual - the interaction still lives on the\n// transparent `HandleElement` hit-zone above.\nconst EdgeGripElement = tasty({\n  qa: 'BoardResizeEdgeGrip',\n  styles: {\n    position: 'absolute',\n    display: 'grid',\n    gap: '2bw',\n    boxSizing: 'border-box',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      revealed: 1,\n    },\n    transition: 'opacity 120ms ease-in-out',\n    // A column of 5 dots for the vertical edges (e/w), a row of 5 for n/s.\n    gridColumns: {\n      '': '3px',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '3px 3px 3px 3px 3px',\n    },\n    gridRows: {\n      '': '3px 3px 3px 3px 3px',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '3px',\n    },\n    // Anchor to the relevant edge and center along it.\n    top: {\n      '': '50%',\n      '[data-axis=\"n\"]': '3px',\n      '[data-axis=\"s\"]': 'auto',\n    },\n    bottom: {\n      '': 'auto',\n      '[data-axis=\"s\"]': '3px',\n    },\n    left: {\n      '': 'auto',\n      '[data-axis=\"w\"]': '3px',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '50%',\n    },\n    right: {\n      '': 'auto',\n      '[data-axis=\"e\"]': '3px',\n    },\n    transform: {\n      '': 'translate(0, 0)',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': 'translate(0, -50%)',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': 'translate(-50%, 0)',\n    },\n\n    Dot: {\n      width: '3px',\n      height: '3px',\n      radius: 'round',\n      fill: {\n        '': '#dark-03',\n        resizing: '#dark-02',\n      },\n    },\n  },\n});\n\n/** Corner axes get a visible grip affordance on hover/focus/resize. */\nfunction isCornerAxis(axis: ResizeHandleAxis): boolean {\n  return axis.length === 2;\n}\n\n/** Edge axes (n/s/e/w) get a dotted grip affordance. */\nfunction isEdgeAxis(axis: ResizeHandleAxis): boolean {\n  return axis.length === 1;\n}\n\ninterface ResizeHandleProps {\n  axis: ResizeHandleAxis;\n  onResize: (\n    axis: ResizeHandleAxis,\n    phase: ResizePhase,\n    dx: number,\n    dy: number,\n  ) => void;\n}\n\nfunction ResizeHandle({ axis, onResize }: ResizeHandleProps) {\n  const { moveProps } = useMove({\n    onMoveStart() {\n      onResize(axis, 'start', 0, 0);\n    },\n    onMove(e) {\n      onResize(axis, 'move', e.deltaX, e.deltaY);\n    },\n    onMoveEnd() {\n      onResize(axis, 'end', 0, 0);\n    },\n  });\n\n  const stopProps = {\n    onPointerDown: (e: React.PointerEvent) => e.stopPropagation(),\n    onMouseDown: (e: React.MouseEvent) => e.stopPropagation(),\n    onTouchStart: (e: React.TouchEvent) => e.stopPropagation(),\n  };\n\n  return (\n    <HandleElement\n      data-axis={axis}\n      {...mergeProps(stopProps, moveProps)}\n      aria-hidden=\"true\"\n    />\n  );\n}\n\nexport interface WidgetHostProps {\n  boardId: string;\n  item: LayoutItem;\n  positionParams: PositionParams;\n  registration: WidgetRegistration | undefined;\n  /**\n   * Whether this widget renders with card chrome (fill/border/radius). Resolved\n   * by the owning `Board` from the per-widget `isCard` and the board-level\n   * `widgetProps.isCard` default.\n   */\n  isCard: boolean;\n  /**\n   * Resolved style overrides for the rendered widget element (per-widget\n   * `styles` falling back to the board-level `widgetProps.styles`).\n   */\n  styles?: Styles;\n  isDraggable: boolean;\n  isResizable: boolean;\n  resizeHandles: ResizeHandleAxis[];\n  /**\n   * Whether this widget grows to fit its content. Resolved by the owning\n   * `Board` from the per-widget `isAutoHeight` and the board-level\n   * `widgetProps.isAutoHeight` default.\n   */\n  isAutoHeight: boolean;\n  /**\n   * Test id / accessible name for the rendered widget element. Resolved by the\n   * owning `Board` from the per-widget `qa` and the board-level `widgetProps.qa`\n   * default; falls back to the layout id.\n   */\n  qa?: string;\n  /**\n   * CSS selector for elements that must not start a pointer drag (e.g. form\n   * controls inside the widget). A pointer-down whose target matches this\n   * selector never begins a drag.\n   */\n  dragCancel?: string;\n  /**\n   * CSS selector for the only elements from which a pointer drag may start. A\n   * pointer-down outside a matching element never begins a drag.\n   */\n  dragHandle?: string;\n  /**\n   * Whether the owning board has settled its widgets' initial positions. While\n   * false, the widget does not animate `inset` (left/top) so the first\n   * positioned paint isn't seen as a transition. Lifted after the board's first\n   * measured render.\n   */\n  settled?: boolean;\n  registry: BoardRegistryContextValue;\n  dragState: BoardDragState | null;\n  onResize: (\n    id: string,\n    axis: ResizeHandleAxis,\n    phase: ResizePhase,\n    dx: number,\n    dy: number,\n  ) => void;\n  /**\n   * Report the minimum number of rows this widget needs to fit its content\n   * (typically a nested board). The owning board grows the item to this height\n   * when it is taller than the current one, and treats it as the resize floor\n   * so the widget cannot be dragged shorter than its content requires.\n   */\n  onAutoHeight: (id: string, neededRows: number) => void;\n  /**\n   * Notify the owning board of a drag gesture's lifecycle so it can emit the\n   * public drag callbacks. Fires after the registry has updated drag state.\n   */\n  onDragLifecycle?: (id: string, phase: ResizePhase) => void;\n}\n\n/**\n * The positioned, interactive wrapper a board renders for each layout item it\n * owns. Content is pulled from the shared store (by id), so any board can host\n * any widget. Dragging uses React Aria `useMove`; during a drag the widget\n * renders into the shared overlay portal so it can float outside its board.\n */\nexport function WidgetHost(props: WidgetHostProps) {\n  const {\n    boardId,\n    item,\n    positionParams,\n    registration,\n    isCard,\n    styles: widgetStyles,\n    isDraggable,\n    isResizable,\n    resizeHandles,\n    isAutoHeight,\n    qa,\n    dragCancel,\n    dragHandle,\n    registry,\n    dragState,\n    settled,\n    onResize,\n    onAutoHeight,\n    onDragLifecycle,\n  } = props;\n\n  const hostRef = useRef<HTMLDivElement | null>(null);\n  const isActiveDrag = dragState?.itemId === item.i;\n\n  // Translate a nested board's reported height deficit (signed px: positive when\n  // it is squeezed, negative when it has slack) into the absolute number of rows\n  // this widget needs, and report it to the owning board. The widget's chrome\n  // cancels out: the needed pixel height is the widget's current pixel height\n  // plus the deficit. A small tolerance keeps sub-pixel rounding from bumping an\n  // extra row. Skipped during a drag (the widget is floating in the overlay).\n  const requestHeightDeficit = useEvent((deficitPx: number) => {\n    if (!isAutoHeight || isActiveDrag) return;\n    const step = positionParams.rowHeight + positionParams.margin[1];\n    if (step <= 0) return;\n    const current = calcGridItemPosition(\n      positionParams,\n      item.x,\n      item.y,\n      item.w,\n      item.h,\n    );\n    const neededPx = current.height + deficitPx;\n    const neededRows = Math.max(\n      1,\n      Math.ceil(\n        (neededPx + positionParams.margin[1] - AUTO_HEIGHT_TOLERANCE) / step,\n      ),\n    );\n    onAutoHeight(item.i, neededRows);\n  });\n\n  const hostValue = useMemo<BoardHost>(\n    () => ({ isAutoHeight, requestHeightDeficit }),\n    [isAutoHeight, requestHeightDeficit],\n  );\n  // Keyboard drags stay in place: moving the focused element into the overlay\n  // portal would unmount it and stop arrow-key move events.\n  const useOverlay = isActiveDrag && dragState?.pointerType !== 'keyboard';\n\n  const [isResizing, setIsResizing] = useState(false);\n  const [isFocusWithin, setIsFocusWithin] = useState(false);\n  const { hoverProps, isHovered } = useHover({ isDisabled: isActiveDrag });\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithinChange: setIsFocusWithin,\n  });\n\n  // Reveal the resize grips when the widget is interacted with (but not while it\n  // is being dragged, where the widget floats in the overlay).\n  const gripsRevealed =\n    isResizable &&\n    !item.static &&\n    !isActiveDrag &&\n    (isHovered || isFocusWithin || isResizing);\n\n  const { moveProps } = useMove({\n    onMoveStart(e) {\n      if (!isDraggable) return;\n      const rect = hostRef.current?.getBoundingClientRect();\n      const pos = calcGridItemPosition(\n        positionParams,\n        item.x,\n        item.y,\n        item.w,\n        item.h,\n      );\n      const vr: ViewportRect = rect\n        ? {\n            left: rect.left,\n            top: rect.top,\n            width: rect.width,\n            height: rect.height,\n          }\n        : {\n            left: pos.left,\n            top: pos.top,\n            width: pos.width,\n            height: pos.height,\n          };\n      registry.onDragStart(boardId, item.i, vr, e.pointerType, hostRef.current);\n      onDragLifecycle?.(item.i, 'start');\n    },\n    onMove(e) {\n      if (!isDraggable) return;\n      if (e.pointerType === 'keyboard') {\n        // Amplify arrow-key steps to a full grid cell so items actually move.\n        const colWidth = calcGridColWidth(positionParams);\n        const stepX = colWidth + positionParams.margin[0];\n        const stepY = positionParams.rowHeight + positionParams.margin[1];\n        registry.onDragMove(\n          Math.sign(e.deltaX) * stepX,\n          Math.sign(e.deltaY) * stepY,\n          e.pointerType,\n        );\n        onDragLifecycle?.(item.i, 'move');\n        return;\n      }\n      registry.onDragMove(e.deltaX, e.deltaY, e.pointerType);\n      onDragLifecycle?.(item.i, 'move');\n    },\n    onMoveEnd() {\n      if (!isDraggable) return;\n      registry.onDragEnd();\n      onDragLifecycle?.(item.i, 'end');\n    },\n  });\n\n  const a11yProps = {\n    tabIndex: isDraggable ? 0 : undefined,\n    'aria-roledescription': isDraggable ? 'Draggable widget' : undefined,\n    'aria-label': qa ?? item.i,\n  };\n\n  // When this widget is draggable it owns its gesture, so stop the pointer-down\n  // from bubbling to an ancestor widget host (e.g. a container widget hosting a\n  // nested board / Tabs). Otherwise the ancestor's `useMove` would start a\n  // second drag from the same press and the whole parent widget would move too.\n  // Non-draggable widgets let the event bubble so their container stays grabbable\n  // through their content.\n  const stopBubbleProps = isDraggable\n    ? {\n        onPointerDown: (e: React.PointerEvent) => e.stopPropagation(),\n        onMouseDown: (e: React.MouseEvent) => e.stopPropagation(),\n        onTouchStart: (e: React.TouchEvent) => e.stopPropagation(),\n      }\n    : {};\n\n  // Gate a pointer drag by `dragHandle` / `dragCancel` selectors. Returns true\n  // when the press must NOT start a drag (outside a `dragHandle`, or matching\n  // `dragCancel`).\n  const shouldGateDrag = (target: EventTarget | null) => {\n    if (!(target instanceof Element)) return false;\n    if (dragHandle && !target.closest(dragHandle)) return true;\n    return !!(dragCancel && target.closest(dragCancel));\n  };\n\n  // The gate wraps `useMove`'s own pointer-down handlers rather than a separate\n  // capture-phase listener. When a press is gated we simply do not forward it to\n  // `useMove`, so the drag never begins. This is deliberate: `useMove`'s\n  // pointer-down handler calls both `stopPropagation()` and `preventDefault()`.\n  // Calling it (or pre-empting it with a capture-phase `stopPropagation()`)\n  // would break the very controls `dragCancel` is meant to protect - a\n  // `preventDefault()` on pointer-down cancels a native `<input>`'s focus, and a\n  // capture-phase `stopPropagation()` swallows a `<button>`'s own press events.\n  // Skipping `useMove` entirely leaves the target's default behavior and its own\n  // handlers fully intact. Keyboard moves go through `onKeyDown` and are never\n  // gated.\n  //\n  // A non-draggable widget must not carry `moveProps` at all: `useMove`'s\n  // pointer-down handler calls `preventDefault()`, which cancels native text\n  // selection inside the widget. Read-only boards (`isDraggable={false}`) still\n  // need selectable content, so we drop the handlers entirely instead of relying\n  // on the early-returns inside the `onMove*` callbacks.\n  const gatedMoveProps = !isDraggable\n    ? {}\n    : {\n        ...moveProps,\n        ...(moveProps.onPointerDown && {\n          onPointerDown: (e: React.PointerEvent<HTMLDivElement>) => {\n            if (shouldGateDrag(e.target)) return;\n            hostRef.current?.focus({ preventScroll: true });\n            moveProps.onPointerDown!(e);\n          },\n        }),\n        ...(moveProps.onMouseDown && {\n          onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => {\n            if (shouldGateDrag(e.target)) return;\n            hostRef.current?.focus({ preventScroll: true });\n            moveProps.onMouseDown!(e);\n          },\n        }),\n        ...(moveProps.onTouchStart && {\n          onTouchStart: (e: React.TouchEvent<HTMLDivElement>) => {\n            if (shouldGateDrag(e.target)) return;\n            moveProps.onTouchStart!(e);\n          },\n        }),\n      };\n\n  const handleResize = (\n    axis: ResizeHandleAxis,\n    phase: ResizePhase,\n    dx: number,\n    dy: number,\n  ) => {\n    if (phase === 'start') setIsResizing(true);\n    else if (phase === 'end') setIsResizing(false);\n    onResize(item.i, axis, phase, dx, dy);\n  };\n\n  const mods = {\n    drag: isActiveDrag,\n    draggable: isDraggable && !isActiveDrag,\n    static: !!item.static,\n    resizing: isResizing,\n    card: isCard,\n    hovered: isHovered,\n    'focus-visible': isFocusVisible,\n  };\n\n  const content = (\n    <BoardHostContext.Provider value={hostValue}>\n      {registration?.content}\n      {isResizable && !item.static ? (\n        <>\n          {resizeHandles.map((axis) => (\n            <ResizeHandle key={axis} axis={axis} onResize={handleResize} />\n          ))}\n          {resizeHandles.filter(isCornerAxis).map((axis) => (\n            <GripElement\n              key={`grip-${axis}`}\n              data-axis={axis}\n              mods={{ revealed: gripsRevealed }}\n              aria-hidden=\"true\"\n            />\n          ))}\n          {resizeHandles.filter(isEdgeAxis).map((axis) => (\n            <EdgeGripElement\n              key={`edge-grip-${axis}`}\n              data-axis={axis}\n              mods={{ revealed: gripsRevealed, resizing: isResizing }}\n              aria-hidden=\"true\"\n            >\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n            </EdgeGripElement>\n          ))}\n        </>\n      ) : null}\n    </BoardHostContext.Provider>\n  );\n\n  const pos = calcGridItemPosition(\n    positionParams,\n    item.x,\n    item.y,\n    item.w,\n    item.h,\n  );\n\n  // While dragging with a pointer, the widget's visual floats in the shared\n  // overlay so it is never clipped by an ancestor's `overflow: hidden`. The\n  // gesture-owning element (the one carrying `moveProps`) must NOT be the node\n  // that moves into the overlay: React Aria's `useMove` binds its pointer\n  // move/end listeners relative to the node that received `onPointerDown`, and\n  // relocating that node into the portal tears it down and mounts a fresh one\n  // (inside a `pointerEvents: 'none'` layer), which can drop the in-flight\n  // gesture. Instead we keep a stable, always-mounted in-grid host that owns the\n  // gesture for its whole lifetime, and portal a separate, non-interactive\n  // visual clone into the overlay.\n  const overlayNode = registry.overlayRef.current;\n  const floatInOverlay = useOverlay && !!overlayNode && !!dragState;\n\n  const hostStyle: CSSProperties = {\n    left: `${pos.left}px`,\n    top: `${pos.top}px`,\n    width: `${pos.width}px`,\n    height: `${pos.height}px`,\n    // Kept mounted but hidden while its clone floats, so the gesture stays live\n    // on this node (the pointer listeners never get torn down).\n    ...(floatInOverlay ? { opacity: 0, pointerEvents: 'none' } : null),\n  };\n\n  // The floating clone carries the \"drag\" affordance (raised shadow/z-index);\n  // keep the hidden host flat. Keyboard drags (which never float) still\n  // highlight the in-grid host, so only suppress `drag` when floating.\n  const hostMods = { ...mods, drag: isActiveDrag && !floatInOverlay, settled };\n\n  // The host is always rendered first, with a stable element shape, so React\n  // reuses the same DOM node across the drag transition (never remounts it).\n  const host = (\n    <WidgetElement\n      ref={hostRef}\n      // Marks this element as a board widget host so the registry can find the\n      // container widget a nested board lives in (used to keep a drag anchored to\n      // a nested board while the anchor is still over its host - e.g. the Tabs\n      // header above a nested board - instead of reflowing the ancestor board).\n      data-board-widget-host=\"\"\n      {...mergeProps(\n        gatedMoveProps,\n        stopBubbleProps,\n        hoverProps,\n        focusProps,\n        focusWithinProps,\n        a11yProps,\n        { style: hostStyle },\n      )}\n      qa={qa}\n      mods={hostMods}\n      styles={widgetStyles as Styles}\n    >\n      {floatInOverlay ? null : content}\n    </WidgetElement>\n  );\n\n  const overlayClone = floatInOverlay\n    ? createPortal(\n        <WidgetElement\n          style={{\n            position: 'absolute',\n            left: `${dragState!.rect.left}px`,\n            top: `${dragState!.rect.top}px`,\n            width: `${dragState!.rect.width}px`,\n            height: `${dragState!.rect.height}px`,\n            pointerEvents: 'none',\n          }}\n          mods={{ ...mods, drag: true, floating: true }}\n          styles={widgetStyles as Styles}\n          aria-hidden=\"true\"\n        >\n          {content}\n        </WidgetElement>,\n        overlayNode!,\n      )\n    : null;\n\n  return (\n    <>\n      {host}\n      {overlayClone}\n    </>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"WidgetHost.js","names":["mergeProps"],"sources":["../../../../src/components/layout/Board/WidgetHost.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport { CSSProperties, useMemo, useRef, useState } from 'react';\nimport { useFocusRing, useFocusWithin, useHover, useMove } from 'react-aria';\nimport { createPortal } from 'react-dom';\n\nimport { useEvent } from '../../../_internal/hooks';\nimport { mergeProps } from '../../../utils/react';\n\nimport {\n  BoardDragState,\n  BoardHost,\n  BoardHostContext,\n  BoardRegistryContextValue,\n  ViewportRect,\n} from './board-context';\nimport { WidgetRegistration } from './board-store';\nimport {\n  calcGridColWidth,\n  calcGridItemPosition,\n  LayoutItem,\n  PositionParams,\n  ResizeHandleAxis,\n} from './grid-core';\n\nexport type ResizePhase = 'start' | 'move' | 'end';\n\n/**\n * Slack (px) absorbed when converting an auto-height widget's content height to\n * whole rows, so sub-pixel measurement/rounding noise never bumps an extra row.\n */\nconst AUTO_HEIGHT_TOLERANCE = 4;\n\nconst WidgetElement = tasty({\n  qa: 'BoardWidget',\n  styles: {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    // Widgets always carry a `#surface-2` fill and rounded corners. The `card`\n    // modifier (board-level `widgetProps.isCard` or per-widget `isCard`) adds a\n    // border on top; a non-card widget is borderless so nested boards can align\n    // their columns flush with the parent grid.\n    fill: '#surface-2',\n    radius: '1cr',\n    border: {\n      '': false,\n      card: true,\n    },\n    shadow: {\n      '': false,\n      'hovered & !card & (draggable | resizing)': '0 0 0 1bw #border',\n      // `$dialog-shadow` uses Glaze `#shadow-lg`, which adapts to dark / high-contrast schemes.\n      'drag | resizing': '$dialog-shadow',\n    },\n    outline: {\n      '': '1bw #primary-text.0',\n      'focus-visible': '1bw #primary-text',\n    },\n    outlineOffset: '1bw',\n    zIndex: {\n      '': 1,\n      'drag | resizing': 10,\n    },\n    // The pointer-drag ghost (the clone that floats in the overlay) is slightly\n    // translucent so the user can see through it to whatever it hovers over -\n    // e.g. a Tabs header underneath - and land a precise drop / tab switch. The\n    // in-place host (keyboard drags, which never float) stays fully opaque.\n    opacity: {\n      '': 1,\n      floating: 0.8,\n    },\n    // Reflowing widgets animate their position and size. The actively\n    // dragged/resized element - and the floating overlay clone - must track the\n    // pointer with no lag, so they drop geometry from the list. Geometry is also\n    // dropped until the board reports `settled`: on init widgets jump to their\n    // first measured positions, and without this gate they would slide/grow in\n    // from their default box. The board lifts the gate after the first\n    // positioned paint so subsequent reflows animate normally.\n    transition: {\n      '': 'theme, shadow, opacity',\n      settled: 'theme, shadow, opacity, inset, width, height',\n      'drag | floating | resizing': 'theme, shadow, opacity',\n    },\n    boxSizing: 'border-box',\n    userSelect: {\n      '': 'auto',\n      'drag | resizing': 'none',\n    },\n    cursor: {\n      '': 'auto',\n      draggable: 'grab',\n      drag: 'grabbing',\n    },\n    touchAction: 'none',\n    overflow: 'hidden',\n  },\n});\n\nconst HandleElement = tasty({\n  qa: 'BoardResizeHandle',\n  styles: {\n    position: 'absolute',\n    zIndex: 20,\n    fill: '#clear',\n    // Overhang: how far the hit-zone extends beyond the widget edge.\n    '--handle-size': '24px',\n    '--handle-overhang': '-8px',\n    '--handle-inset': '8px',\n    width: {\n      '': '$handle-size',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': 'auto',\n    },\n    height: {\n      '': '$handle-size',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': 'auto',\n    },\n    top: {\n      '': 'auto',\n      '[data-axis=\"n\"] | [data-axis=\"ne\"] | [data-axis=\"nw\"]':\n        '$handle-overhang',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': '$handle-inset',\n    },\n    bottom: {\n      '': 'auto',\n      '[data-axis=\"s\"] | [data-axis=\"se\"] | [data-axis=\"sw\"]':\n        '$handle-overhang',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': '$handle-inset',\n    },\n    left: {\n      '': 'auto',\n      '[data-axis=\"w\"] | [data-axis=\"nw\"] | [data-axis=\"sw\"]':\n        '$handle-overhang',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '$handle-inset',\n    },\n    right: {\n      '': 'auto',\n      '[data-axis=\"e\"] | [data-axis=\"ne\"] | [data-axis=\"se\"]':\n        '$handle-overhang',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '$handle-inset',\n    },\n    cursor: {\n      '': 'default',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': 'ns-resize',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': 'ew-resize',\n      '[data-axis=\"ne\"] | [data-axis=\"sw\"]': 'nesw-resize',\n      '[data-axis=\"nw\"] | [data-axis=\"se\"]': 'nwse-resize',\n    },\n    touchAction: 'none',\n  },\n});\n\nconst GripElement = tasty({\n  qa: 'BoardResizeGrip',\n  styles: {\n    position: 'absolute',\n    width: '10px',\n    height: '10px',\n    boxSizing: 'border-box',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      revealed: 1,\n    },\n    transition: 'opacity 120ms ease-in-out',\n    borderTop: {\n      '': '0',\n      '[data-axis=\"ne\"] | [data-axis=\"nw\"]': '2px solid #dark.40',\n    },\n    borderBottom: {\n      '': '0',\n      '[data-axis=\"se\"] | [data-axis=\"sw\"]': '2px solid #dark.40',\n    },\n    borderLeft: {\n      '': '0',\n      '[data-axis=\"nw\"] | [data-axis=\"sw\"]': '2px solid #dark.40',\n    },\n    borderRight: {\n      '': '0',\n      '[data-axis=\"ne\"] | [data-axis=\"se\"]': '2px solid #dark.40',\n    },\n    radius: {\n      '': '0',\n      '[data-axis=\"se\"]': '0 0 4px 0',\n      '[data-axis=\"sw\"]': '0 0 0 4px',\n      '[data-axis=\"ne\"]': '0 4px 0 0',\n      '[data-axis=\"nw\"]': '4px 0 0 0',\n    },\n    top: {\n      '': 'auto',\n      '[data-axis=\"ne\"] | [data-axis=\"nw\"]': '4px',\n    },\n    bottom: {\n      '': 'auto',\n      '[data-axis=\"se\"] | [data-axis=\"sw\"]': '4px',\n    },\n    left: {\n      '': 'auto',\n      '[data-axis=\"nw\"] | [data-axis=\"sw\"]': '4px',\n    },\n    right: {\n      '': 'auto',\n      '[data-axis=\"ne\"] | [data-axis=\"se\"]': '4px',\n    },\n  },\n});\n\n// Edge axes (n/s/e/w) get a dotted grip affordance, revealed on\n// hover/focus/resize. The dots line up along the edge (a vertical column for the\n// e/w handles, a horizontal row for n/s), matching the design-system pane grip\n// (see `Layout.Pane`). Purely visual - the interaction still lives on the\n// transparent `HandleElement` hit-zone above.\nconst EdgeGripElement = tasty({\n  qa: 'BoardResizeEdgeGrip',\n  styles: {\n    position: 'absolute',\n    display: 'grid',\n    gap: '2bw',\n    boxSizing: 'border-box',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      revealed: 1,\n    },\n    transition: 'opacity 120ms ease-in-out',\n    // A column of 5 dots for the vertical edges (e/w), a row of 5 for n/s.\n    gridColumns: {\n      '': '3px',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '3px 3px 3px 3px 3px',\n    },\n    gridRows: {\n      '': '3px 3px 3px 3px 3px',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '3px',\n    },\n    // Anchor to the relevant edge and center along it.\n    top: {\n      '': '50%',\n      '[data-axis=\"n\"]': '3px',\n      '[data-axis=\"s\"]': 'auto',\n    },\n    bottom: {\n      '': 'auto',\n      '[data-axis=\"s\"]': '3px',\n    },\n    left: {\n      '': 'auto',\n      '[data-axis=\"w\"]': '3px',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': '50%',\n    },\n    right: {\n      '': 'auto',\n      '[data-axis=\"e\"]': '3px',\n    },\n    transform: {\n      '': 'translate(0, 0)',\n      '[data-axis=\"e\"] | [data-axis=\"w\"]': 'translate(0, -50%)',\n      '[data-axis=\"n\"] | [data-axis=\"s\"]': 'translate(-50%, 0)',\n    },\n\n    Dot: {\n      width: '3px',\n      height: '3px',\n      radius: 'round',\n      fill: {\n        '': '#dark-03',\n        resizing: '#dark-02',\n      },\n    },\n  },\n});\n\n/** Corner axes get a visible grip affordance on hover/focus/resize. */\nfunction isCornerAxis(axis: ResizeHandleAxis): boolean {\n  return axis.length === 2;\n}\n\n/** Edge axes (n/s/e/w) get a dotted grip affordance. */\nfunction isEdgeAxis(axis: ResizeHandleAxis): boolean {\n  return axis.length === 1;\n}\n\ninterface ResizeHandleProps {\n  axis: ResizeHandleAxis;\n  onResize: (\n    axis: ResizeHandleAxis,\n    phase: ResizePhase,\n    dx: number,\n    dy: number,\n  ) => void;\n}\n\nfunction ResizeHandle({ axis, onResize }: ResizeHandleProps) {\n  const { moveProps } = useMove({\n    onMoveStart() {\n      onResize(axis, 'start', 0, 0);\n    },\n    onMove(e) {\n      onResize(axis, 'move', e.deltaX, e.deltaY);\n    },\n    onMoveEnd() {\n      onResize(axis, 'end', 0, 0);\n    },\n  });\n\n  const stopProps = {\n    onPointerDown: (e: React.PointerEvent) => e.stopPropagation(),\n    onMouseDown: (e: React.MouseEvent) => e.stopPropagation(),\n    onTouchStart: (e: React.TouchEvent) => e.stopPropagation(),\n  };\n\n  return (\n    <HandleElement\n      data-axis={axis}\n      {...mergeProps(stopProps, moveProps)}\n      aria-hidden=\"true\"\n    />\n  );\n}\n\nexport interface WidgetHostProps {\n  boardId: string;\n  item: LayoutItem;\n  positionParams: PositionParams;\n  registration: WidgetRegistration | undefined;\n  /**\n   * Whether this widget renders with card chrome (fill/border/radius). Resolved\n   * by the owning `Board` from the per-widget `isCard` and the board-level\n   * `widgetProps.isCard` default.\n   */\n  isCard: boolean;\n  /**\n   * Resolved style overrides for the rendered widget element (per-widget\n   * `styles` falling back to the board-level `widgetProps.styles`).\n   */\n  styles?: Styles;\n  isDraggable: boolean;\n  isResizable: boolean;\n  resizeHandles: ResizeHandleAxis[];\n  /**\n   * Whether this widget grows to fit its content. Resolved by the owning\n   * `Board` from the per-widget `isAutoHeight` and the board-level\n   * `widgetProps.isAutoHeight` default.\n   */\n  isAutoHeight: boolean;\n  /**\n   * Test id / accessible name for the rendered widget element. Resolved by the\n   * owning `Board` from the per-widget `qa` and the board-level `widgetProps.qa`\n   * default; falls back to the layout id.\n   */\n  qa?: string;\n  /**\n   * CSS selector for elements that must not start a pointer drag (e.g. form\n   * controls inside the widget). A pointer-down whose target matches this\n   * selector never begins a drag.\n   */\n  dragCancel?: string;\n  /**\n   * CSS selector for the only elements from which a pointer drag may start. A\n   * pointer-down outside a matching element never begins a drag.\n   */\n  dragHandle?: string;\n  /**\n   * Whether the owning board has settled its widgets' initial positions. While\n   * false, the widget does not animate `inset` (left/top) so the first\n   * positioned paint isn't seen as a transition. Lifted after the board's first\n   * measured render.\n   */\n  settled?: boolean;\n  registry: BoardRegistryContextValue;\n  dragState: BoardDragState | null;\n  onResize: (\n    id: string,\n    axis: ResizeHandleAxis,\n    phase: ResizePhase,\n    dx: number,\n    dy: number,\n  ) => void;\n  /**\n   * Report the minimum number of rows this widget needs to fit its content\n   * (typically a nested board). The owning board grows the item to this height\n   * when it is taller than the current one, and treats it as the resize floor\n   * so the widget cannot be dragged shorter than its content requires.\n   */\n  onAutoHeight: (id: string, neededRows: number) => void;\n  /**\n   * Notify the owning board of a drag gesture's lifecycle so it can emit the\n   * public drag callbacks. Fires after the registry has updated drag state.\n   */\n  onDragLifecycle?: (id: string, phase: ResizePhase) => void;\n}\n\n/**\n * The positioned, interactive wrapper a board renders for each layout item it\n * owns. Content is pulled from the shared store (by id), so any board can host\n * any widget. Dragging uses React Aria `useMove`; during a drag the widget\n * renders into the shared overlay portal so it can float outside its board.\n */\nexport function WidgetHost(props: WidgetHostProps) {\n  const {\n    boardId,\n    item,\n    positionParams,\n    registration,\n    isCard,\n    styles: widgetStyles,\n    isDraggable,\n    isResizable,\n    resizeHandles,\n    isAutoHeight,\n    qa,\n    dragCancel,\n    dragHandle,\n    registry,\n    dragState,\n    settled,\n    onResize,\n    onAutoHeight,\n    onDragLifecycle,\n  } = props;\n\n  const hostRef = useRef<HTMLDivElement | null>(null);\n  const isActiveDrag = dragState?.itemId === item.i;\n\n  // Translate a nested board's reported height deficit (signed px: positive when\n  // it is squeezed, negative when it has slack) into the absolute number of rows\n  // this widget needs, and report it to the owning board. The widget's chrome\n  // cancels out: the needed pixel height is the widget's current pixel height\n  // plus the deficit. A small tolerance keeps sub-pixel rounding from bumping an\n  // extra row. Skipped during a drag (the widget is floating in the overlay).\n  const requestHeightDeficit = useEvent((deficitPx: number) => {\n    if (!isAutoHeight || isActiveDrag) return;\n    const step = positionParams.rowHeight + positionParams.margin[1];\n    if (step <= 0) return;\n    const current = calcGridItemPosition(\n      positionParams,\n      item.x,\n      item.y,\n      item.w,\n      item.h,\n    );\n    const neededPx = current.height + deficitPx;\n    const neededRows = Math.max(\n      1,\n      Math.ceil(\n        (neededPx + positionParams.margin[1] - AUTO_HEIGHT_TOLERANCE) / step,\n      ),\n    );\n    onAutoHeight(item.i, neededRows);\n  });\n\n  const hostValue = useMemo<BoardHost>(\n    () => ({ isAutoHeight, requestHeightDeficit }),\n    [isAutoHeight, requestHeightDeficit],\n  );\n  // Keyboard drags stay in place: moving the focused element into the overlay\n  // portal would unmount it and stop arrow-key move events.\n  const useOverlay = isActiveDrag && dragState?.pointerType !== 'keyboard';\n\n  const [isResizing, setIsResizing] = useState(false);\n  const [isFocusWithin, setIsFocusWithin] = useState(false);\n  const { hoverProps, isHovered } = useHover({ isDisabled: isActiveDrag });\n  const { focusProps, isFocusVisible } = useFocusRing();\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithinChange: setIsFocusWithin,\n  });\n\n  // Reveal the resize grips when the widget is interacted with (but not while it\n  // is being dragged, where the widget floats in the overlay).\n  const gripsRevealed =\n    isResizable &&\n    !item.static &&\n    !isActiveDrag &&\n    (isHovered || isFocusWithin || isResizing);\n\n  const { moveProps } = useMove({\n    onMoveStart(e) {\n      if (!isDraggable) return;\n      const rect = hostRef.current?.getBoundingClientRect();\n      const pos = calcGridItemPosition(\n        positionParams,\n        item.x,\n        item.y,\n        item.w,\n        item.h,\n      );\n      const vr: ViewportRect = rect\n        ? {\n            left: rect.left,\n            top: rect.top,\n            width: rect.width,\n            height: rect.height,\n          }\n        : {\n            left: pos.left,\n            top: pos.top,\n            width: pos.width,\n            height: pos.height,\n          };\n      registry.onDragStart(boardId, item.i, vr, e.pointerType, hostRef.current);\n      onDragLifecycle?.(item.i, 'start');\n    },\n    onMove(e) {\n      if (!isDraggable) return;\n      if (e.pointerType === 'keyboard') {\n        // Amplify arrow-key steps to a full grid cell so items actually move.\n        const colWidth = calcGridColWidth(positionParams);\n        const stepX = colWidth + positionParams.margin[0];\n        const stepY = positionParams.rowHeight + positionParams.margin[1];\n        registry.onDragMove(\n          Math.sign(e.deltaX) * stepX,\n          Math.sign(e.deltaY) * stepY,\n          e.pointerType,\n        );\n        onDragLifecycle?.(item.i, 'move');\n        return;\n      }\n      registry.onDragMove(e.deltaX, e.deltaY, e.pointerType);\n      onDragLifecycle?.(item.i, 'move');\n    },\n    onMoveEnd() {\n      if (!isDraggable) return;\n      registry.onDragEnd();\n      onDragLifecycle?.(item.i, 'end');\n    },\n  });\n\n  const a11yProps = {\n    tabIndex: isDraggable ? 0 : undefined,\n    'aria-roledescription': isDraggable ? 'Draggable widget' : undefined,\n    'aria-label': qa ?? item.i,\n  };\n\n  // When this widget is draggable it owns its gesture, so stop the pointer-down\n  // from bubbling to an ancestor widget host (e.g. a container widget hosting a\n  // nested board / Tabs). Otherwise the ancestor's `useMove` would start a\n  // second drag from the same press and the whole parent widget would move too.\n  // Non-draggable widgets let the event bubble so their container stays grabbable\n  // through their content.\n  const stopBubbleProps = isDraggable\n    ? {\n        onPointerDown: (e: React.PointerEvent) => e.stopPropagation(),\n        onMouseDown: (e: React.MouseEvent) => e.stopPropagation(),\n        onTouchStart: (e: React.TouchEvent) => e.stopPropagation(),\n      }\n    : {};\n\n  // Gate a pointer drag by `dragHandle` / `dragCancel` selectors. Returns true\n  // when the press must NOT start a drag (outside a `dragHandle`, or matching\n  // `dragCancel`).\n  const shouldGateDrag = (target: EventTarget | null) => {\n    if (!(target instanceof Element)) return false;\n    if (dragHandle && !target.closest(dragHandle)) return true;\n    return !!(dragCancel && target.closest(dragCancel));\n  };\n\n  // The gate wraps `useMove`'s own pointer-down handlers rather than a separate\n  // capture-phase listener. When a press is gated we simply do not forward it to\n  // `useMove`, so the drag never begins. This is deliberate: `useMove`'s\n  // pointer-down handler calls both `stopPropagation()` and `preventDefault()`.\n  // Calling it (or pre-empting it with a capture-phase `stopPropagation()`)\n  // would break the very controls `dragCancel` is meant to protect - a\n  // `preventDefault()` on pointer-down cancels a native `<input>`'s focus, and a\n  // capture-phase `stopPropagation()` swallows a `<button>`'s own press events.\n  // Skipping `useMove` entirely leaves the target's default behavior and its own\n  // handlers fully intact.\n  //\n  // Keyboard moves also go through `useMove` (`onKeyDown`). Arrow keys must only\n  // move the widget when the host itself is focused — not when focus is inside a\n  // nested input, textarea, or other descendant (those events bubble to the host\n  // and would otherwise steal caret / list navigation).\n  //\n  // A non-draggable widget must not carry `moveProps` at all: `useMove`'s\n  // pointer-down handler calls `preventDefault()`, which cancels native text\n  // selection inside the widget. Read-only boards (`isDraggable={false}`) still\n  // need selectable content, so we drop the handlers entirely instead of relying\n  // on the early-returns inside the `onMove*` callbacks.\n  const gatedMoveProps = !isDraggable\n    ? {}\n    : {\n        ...moveProps,\n        ...(moveProps.onPointerDown && {\n          onPointerDown: (e: React.PointerEvent<HTMLDivElement>) => {\n            if (shouldGateDrag(e.target)) return;\n            hostRef.current?.focus({ preventScroll: true });\n            moveProps.onPointerDown!(e);\n          },\n        }),\n        ...(moveProps.onMouseDown && {\n          onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => {\n            if (shouldGateDrag(e.target)) return;\n            hostRef.current?.focus({ preventScroll: true });\n            moveProps.onMouseDown!(e);\n          },\n        }),\n        ...(moveProps.onTouchStart && {\n          onTouchStart: (e: React.TouchEvent<HTMLDivElement>) => {\n            if (shouldGateDrag(e.target)) return;\n            moveProps.onTouchStart!(e);\n          },\n        }),\n        ...(moveProps.onKeyDown && {\n          onKeyDown: (e: React.KeyboardEvent<HTMLDivElement>) => {\n            if (e.target !== e.currentTarget) return;\n            moveProps.onKeyDown!(e);\n          },\n        }),\n      };\n\n  const handleResize = (\n    axis: ResizeHandleAxis,\n    phase: ResizePhase,\n    dx: number,\n    dy: number,\n  ) => {\n    if (phase === 'start') setIsResizing(true);\n    else if (phase === 'end') setIsResizing(false);\n    onResize(item.i, axis, phase, dx, dy);\n  };\n\n  const mods = {\n    drag: isActiveDrag,\n    draggable: isDraggable && !isActiveDrag,\n    static: !!item.static,\n    resizing: isResizing,\n    card: isCard,\n    hovered: isHovered,\n    'focus-visible': isFocusVisible,\n  };\n\n  const content = (\n    <BoardHostContext.Provider value={hostValue}>\n      {registration?.content}\n      {isResizable && !item.static ? (\n        <>\n          {resizeHandles.map((axis) => (\n            <ResizeHandle key={axis} axis={axis} onResize={handleResize} />\n          ))}\n          {resizeHandles.filter(isCornerAxis).map((axis) => (\n            <GripElement\n              key={`grip-${axis}`}\n              data-axis={axis}\n              mods={{ revealed: gripsRevealed }}\n              aria-hidden=\"true\"\n            />\n          ))}\n          {resizeHandles.filter(isEdgeAxis).map((axis) => (\n            <EdgeGripElement\n              key={`edge-grip-${axis}`}\n              data-axis={axis}\n              mods={{ revealed: gripsRevealed, resizing: isResizing }}\n              aria-hidden=\"true\"\n            >\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n              <div data-element=\"Dot\" />\n            </EdgeGripElement>\n          ))}\n        </>\n      ) : null}\n    </BoardHostContext.Provider>\n  );\n\n  const pos = calcGridItemPosition(\n    positionParams,\n    item.x,\n    item.y,\n    item.w,\n    item.h,\n  );\n\n  // While dragging with a pointer, the widget's visual floats in the shared\n  // overlay so it is never clipped by an ancestor's `overflow: hidden`. The\n  // gesture-owning element (the one carrying `moveProps`) must NOT be the node\n  // that moves into the overlay: React Aria's `useMove` binds its pointer\n  // move/end listeners relative to the node that received `onPointerDown`, and\n  // relocating that node into the portal tears it down and mounts a fresh one\n  // (inside a `pointerEvents: 'none'` layer), which can drop the in-flight\n  // gesture. Instead we keep a stable, always-mounted in-grid host that owns the\n  // gesture for its whole lifetime, and portal a separate, non-interactive\n  // visual clone into the overlay.\n  const overlayNode = registry.overlayRef.current;\n  const floatInOverlay = useOverlay && !!overlayNode && !!dragState;\n\n  const hostStyle: CSSProperties = {\n    left: `${pos.left}px`,\n    top: `${pos.top}px`,\n    width: `${pos.width}px`,\n    height: `${pos.height}px`,\n    // Kept mounted but hidden while its clone floats, so the gesture stays live\n    // on this node (the pointer listeners never get torn down).\n    ...(floatInOverlay ? { opacity: 0, pointerEvents: 'none' } : null),\n  };\n\n  // The floating clone carries the \"drag\" affordance (raised shadow/z-index);\n  // keep the hidden host flat. Keyboard drags (which never float) still\n  // highlight the in-grid host, so only suppress `drag` when floating.\n  const hostMods = { ...mods, drag: isActiveDrag && !floatInOverlay, settled };\n\n  // The host is always rendered first, with a stable element shape, so React\n  // reuses the same DOM node across the drag transition (never remounts it).\n  const host = (\n    <WidgetElement\n      ref={hostRef}\n      // Marks this element as a board widget host so the registry can find the\n      // container widget a nested board lives in (used to keep a drag anchored to\n      // a nested board while the anchor is still over its host - e.g. the Tabs\n      // header above a nested board - instead of reflowing the ancestor board).\n      data-board-widget-host=\"\"\n      {...mergeProps(\n        gatedMoveProps,\n        stopBubbleProps,\n        hoverProps,\n        focusProps,\n        focusWithinProps,\n        a11yProps,\n        { style: hostStyle },\n      )}\n      qa={qa}\n      mods={hostMods}\n      styles={widgetStyles as Styles}\n    >\n      {floatInOverlay ? null : content}\n    </WidgetElement>\n  );\n\n  const overlayClone = floatInOverlay\n    ? createPortal(\n        <WidgetElement\n          style={{\n            position: 'absolute',\n            left: `${dragState!.rect.left}px`,\n            top: `${dragState!.rect.top}px`,\n            width: `${dragState!.rect.width}px`,\n            height: `${dragState!.rect.height}px`,\n            pointerEvents: 'none',\n          }}\n          mods={{ ...mods, drag: true, floating: true }}\n          styles={widgetStyles as Styles}\n          aria-hidden=\"true\"\n        >\n          {content}\n        </WidgetElement>,\n        overlayNode!,\n      )\n    : null;\n\n  return (\n    <>\n      {host}\n      {overlayClone}\n    </>\n  );\n}\n"],"mappings":"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"}

package/dist/components/layout/Board/board-context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/layout/Board/board-context.tsx

package/dist/components/layout/Board/board-store.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 //#region src/components/layout/Board/board-store.ts
 /**
 * A tiny external store mapping widget id -> registration.

package/dist/components/layout/Board/grid-core/calculate.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 //#region src/components/layout/Board/grid-core/calculate.ts
 /** Calculate the width of a single grid column in pixels. */
 function calcGridColWidth(positionParams) {

package/dist/components/layout/Board/grid-core/collision.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 //#region src/components/layout/Board/grid-core/collision.ts
 /**
 * Check if two layout items collide (overlap).

package/dist/components/layout/Board/grid-core/compactors.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 import { collides, getFirstCollision } from "./collision.js";
 import { sortLayoutItemsByColRow, sortLayoutItemsByRowCol } from "./sort.js";
 import { bottom, cloneLayout, cloneLayoutItem, getStatics } from "./layout.js";

package/dist/components/layout/Board/grid-core/constraints.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.1 | Cube Dev Team */
 //#region src/components/layout/Board/grid-core/constraints.ts
 function clamp(value, min, max) {
 	return Math.max(min, Math.min(max, value));