@cube-dev/ui-kit 0.181.0 → 0.183.0

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

@@ -1 +1 @@
-{"version":3,"file":"TableRow.js","names":["mergeProps"],"sources":["../../../../src/components/data/TableBase/TableRow.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useDraggableItem, useDropIndicator, useTreeItem } from 'react-aria';\n\nimport { mergeProps, mergeRefs } from '../../../utils/react';\n\nimport type { Key, Node } from '@react-types/shared';\nimport type { ReactNode, Ref } from 'react';\nimport type {\n  DraggableCollectionState,\n  DroppableCollectionState,\n  TreeState,\n} from 'react-stately';\nimport type { TableTreeNode } from './table-tree';\n\nexport interface TableRowTreeProps<T = any> {\n  state: TreeState<TableTreeNode<T>>;\n  node: Node<TableTreeNode<T>>;\n  entry: TableTreeNode<T>;\n  isVirtualized: boolean;\n}\n\nexport interface TableRowProps<T = any> {\n  rowKey: Key;\n  /** Everything the renderer already computed: mods, ARIA, handlers. */\n  rowProps: Record<string, any>;\n  height?: number;\n  /** Set on the virtualized path so the virtualizer can measure the row. */\n  measureRef?: Ref<HTMLTableRowElement>;\n  /** Internal React Aria row ref in tree mode. */\n  rowRef?: Ref<HTMLTableRowElement>;\n  index?: number;\n  dragState?: DraggableCollectionState;\n  dropState?: DroppableCollectionState;\n  tree?: TableRowTreeProps<T>;\n  children:\n    | ReactNode\n    | ((treeItemAria: ReturnType<typeof useTreeItem> | undefined) => ReactNode);\n}\n\nfunction Row(\n  props: TableRowProps & {\n    extra?: Record<string, any>;\n    rowRef?: Ref<HTMLTableRowElement>;\n  },\n) {\n  const { rowProps, height, measureRef, rowRef, index, extra, children } =\n    props;\n\n  return (\n    <tr\n      {...rowProps}\n      {...extra}\n      ref={mergeRefs(measureRef, rowRef)}\n      data-index={index}\n      style={height != null ? { height } : undefined}\n    >\n      {typeof children === 'function' ? children(undefined) : children}\n    </tr>\n  );\n}\n\n/**\n * A row inside a collection that accepts drags.\n *\n * Split from the plain row so the drag hooks can be called unconditionally —\n * they are hooks, and whether a table is draggable is a prop.\n */\nfunction DraggableRow(props: TableRowProps) {\n  const { rowKey, dragState, dropState } = props;\n\n  const dragResult = useDraggableItem(\n    { key: rowKey },\n    dragState as DraggableCollectionState,\n  );\n\n  /**\n   * Whether a drop would land *on* this row.\n   *\n   * `useDropIndicator` rather than asking `dropState.isDropTarget` directly:\n   * the state object's identity never changes as the pointer moves, so a plain\n   * read is computed once and never updates. The hook subscribes, which is what\n   * makes the highlight follow the cursor.\n   */\n  const onRef = useRef<HTMLDivElement>(null);\n  const { isDropTarget: isOnTarget } = useDropIndicator(\n    { target: { type: 'item', key: rowKey, dropPosition: 'on' } },\n    dropState as DroppableCollectionState,\n    onRef,\n  );\n\n  return (\n    <Row\n      {...props}\n      extra={{\n        ...mergeProps(props.rowProps, dragResult.dragProps),\n        'data-draggable': '',\n        'data-dragging': dragResult.isDragging ? '' : undefined,\n        'data-drop-target': isOnTarget ? '' : undefined,\n      }}\n    />\n  );\n}\n\nfunction TreeRow<T>(props: TableRowProps<T>) {\n  const { tree } = props;\n  const rowRef = useRef<HTMLTableRowElement>(null);\n  const treeItemAria = useTreeItem(\n    {\n      node: tree!.node,\n      hasChildItems: tree!.entry.children.length > 0,\n      isVirtualized: tree!.isVirtualized,\n    },\n    tree!.state,\n    rowRef,\n  );\n\n  const rowProps = mergeProps(treeItemAria.rowProps, props.rowProps);\n\n  // Table geometry and ItemTable selection are separate from React Aria's\n  // internal focus-only selection manager, so the renderer's values win.\n  if (props.rowProps['aria-rowindex'] !== undefined) {\n    rowProps['aria-rowindex'] = props.rowProps['aria-rowindex'];\n  }\n  if (props.rowProps['aria-selected'] !== undefined) {\n    rowProps['aria-selected'] = props.rowProps['aria-selected'];\n  }\n  rowProps['aria-level'] = tree!.entry.level + 1;\n  rowProps['aria-posinset'] = tree!.entry.siblingIndex + 1;\n  rowProps['aria-setsize'] = tree!.entry.siblingCount;\n\n  const children =\n    typeof props.children === 'function'\n      ? props.children(treeItemAria)\n      : props.children;\n  const next = { ...props, rowProps, rowRef, children };\n\n  return props.dragState && props.dropState ? (\n    <DraggableRow {...next} />\n  ) : (\n    <Row {...next} />\n  );\n}\n\nexport function TableRow<T>(props: TableRowProps<T>) {\n  if (props.tree) return <TreeRow {...props} />;\n\n  return props.dragState && props.dropState ? (\n    <DraggableRow {...props} />\n  ) : (\n    <Row {...props} />\n  );\n}\n\nexport interface TableRowDropIndicatorProps {\n  rowKey: Key;\n  dropPosition: 'before' | 'after';\n  dropState: DroppableCollectionState;\n  columnCount: number;\n}\n\n/**\n * The line showing where a dragged row would land.\n *\n * Its own `<tr>`, because a native table cannot hold an arbitrary element\n * between two rows — the same shape `ListBox` uses with `<li>`. It renders\n * nothing at all unless a drag is in flight, so the table's normal structure is\n * untouched the rest of the time.\n */\nexport function TableRowDropIndicator(props: TableRowDropIndicatorProps) {\n  const { rowKey, dropPosition, dropState, columnCount } = props;\n  const ref = useRef<HTMLDivElement>(null);\n  const { dropIndicatorProps, isHidden, isDropTarget } = useDropIndicator(\n    { target: { type: 'item', key: rowKey, dropPosition } },\n    dropState,\n    ref,\n  );\n\n  if (isHidden) return null;\n\n  return (\n    <tr data-element=\"DropIndicatorRow\">\n      <td data-element=\"DropIndicatorCell\" colSpan={Math.max(columnCount, 1)}>\n        <div\n          {...dropIndicatorProps}\n          ref={ref}\n          data-element=\"DropIndicator\"\n          data-drop-target={isDropTarget ? '' : undefined}\n        />\n      </td>\n    </tr>\n  );\n}\n"],"mappings":";;;;;;;;AAuCA,SAAS,IACP,OAIA;CACA,MAAM,EAAE,UAAU,QAAQ,YAAY,QAAQ,OAAO,OAAO,aAC1D;AAEF,QACE,oBAAC;EACC,GAAI;EACJ,GAAI;EACJ,KAAK,UAAU,YAAY,OAAO;EAClC,cAAY;EACZ,OAAO,UAAU,OAAO,EAAE,QAAQ,GAAG;YAEpC,OAAO,aAAa,aAAa,SAAS,OAAU,GAAG;GACrD;;;;;;;;AAUT,SAAS,aAAa,OAAsB;CAC1C,MAAM,EAAE,QAAQ,WAAW,cAAc;CAEzC,MAAM,aAAa,iBACjB,EAAE,KAAK,QAAQ,EACf,UACD;;;;;;;;;CAUD,MAAM,QAAQ,OAAuB,KAAK;CAC1C,MAAM,EAAE,cAAc,eAAe,iBACnC,EAAE,QAAQ;EAAE,MAAM;EAAQ,KAAK;EAAQ,cAAc;EAAM,EAAE,EAC7D,WACA,MACD;AAED,QACE,oBAAC;EACC,GAAI;EACJ,OAAO;GACL,GAAGA,aAAW,MAAM,UAAU,WAAW,UAAU;GACnD,kBAAkB;GAClB,iBAAiB,WAAW,aAAa,KAAK;GAC9C,oBAAoB,aAAa,KAAK;GACvC;GACD;;AAIN,SAAS,QAAW,OAAyB;CAC3C,MAAM,EAAE,SAAS;CACjB,MAAM,SAAS,OAA4B,KAAK;CAChD,MAAM,eAAe,YACnB;EACE,MAAM,KAAM;EACZ,eAAe,KAAM,MAAM,SAAS,SAAS;EAC7C,eAAe,KAAM;EACtB,EACD,KAAM,OACN,OACD;CAED,MAAM,WAAWA,aAAW,aAAa,UAAU,MAAM,SAAS;AAIlE,KAAI,MAAM,SAAS,qBAAqB,OACtC,UAAS,mBAAmB,MAAM,SAAS;AAE7C,KAAI,MAAM,SAAS,qBAAqB,OACtC,UAAS,mBAAmB,MAAM,SAAS;AAE7C,UAAS,gBAAgB,KAAM,MAAM,QAAQ;AAC7C,UAAS,mBAAmB,KAAM,MAAM,eAAe;AACvD,UAAS,kBAAkB,KAAM,MAAM;CAEvC,MAAM,WACJ,OAAO,MAAM,aAAa,aACtB,MAAM,SAAS,aAAa,GAC5B,MAAM;CACZ,MAAM,OAAO;EAAE,GAAG;EAAO;EAAU;EAAQ;EAAU;AAErD,QAAO,MAAM,aAAa,MAAM,YAC9B,oBAAC,gBAAa,GAAI,OAAQ,GAE1B,oBAAC,OAAI,GAAI,OAAQ;;AAIrB,SAAgB,SAAY,OAAyB;AACnD,KAAI,MAAM,KAAM,QAAO,oBAAC,WAAQ,GAAI,QAAS;AAE7C,QAAO,MAAM,aAAa,MAAM,YAC9B,oBAAC,gBAAa,GAAI,QAAS,GAE3B,oBAAC,OAAI,GAAI,QAAS;;;;;;;;;;AAmBtB,SAAgB,sBAAsB,OAAmC;CACvE,MAAM,EAAE,QAAQ,cAAc,WAAW,gBAAgB;CACzD,MAAM,MAAM,OAAuB,KAAK;CACxC,MAAM,EAAE,oBAAoB,UAAU,iBAAiB,iBACrD,EAAE,QAAQ;EAAE,MAAM;EAAQ,KAAK;EAAQ;EAAc,EAAE,EACvD,WACA,IACD;AAED,KAAI,SAAU,QAAO;AAErB,QACE,oBAAC;EAAG,gBAAa;YACf,oBAAC;GAAG,gBAAa;GAAoB,SAAS,KAAK,IAAI,aAAa,EAAE;aACpE,oBAAC;IACC,GAAI;IACC;IACL,gBAAa;IACb,oBAAkB,eAAe,KAAK;KACtC;IACC;GACF"}
+{"version":3,"file":"TableRow.js","names":["useRef","useDraggableItem","useDropIndicator","useTreeItem","mergeProps","mergeRefs","Key","Node","ReactNode","Ref","DraggableCollectionState","DroppableCollectionState","TreeState","TableTreeNode","TableRowTreeProps","state","T","node","entry","isVirtualized","TableRowProps","rowKey","rowProps","Record","height","measureRef","HTMLTableRowElement","rowRef","index","dragState","dropState","tree","children","treeItemAria","ReturnType","Row","props","$","_c","extra","t0","t1","undefined","t2","t3","DraggableRow","key","dragResult","onRef","target","type","dropPosition","isDropTarget","isOnTarget","dragProps","isDragging","t4","t5","t6","TreeRow","length","hasChildItems","level","siblingCount","siblingIndex","next","TableRow","TableRowDropIndicatorProps","columnCount","TableRowDropIndicator","ref","dropIndicatorProps","isHidden","Math","max"],"sources":["../../../../src/components/data/TableBase/TableRow.tsx"],"sourcesContent":["import { useRef } from 'react';\nimport { useDraggableItem, useDropIndicator, useTreeItem } from 'react-aria';\n\nimport { mergeProps, mergeRefs } from '../../../utils/react';\n\nimport type { Key, Node } from '@react-types/shared';\nimport type { ReactNode, Ref } from 'react';\nimport type {\n  DraggableCollectionState,\n  DroppableCollectionState,\n  TreeState,\n} from 'react-stately';\nimport type { TableTreeNode } from './table-tree';\n\nexport interface TableRowTreeProps<T = any> {\n  state: TreeState<TableTreeNode<T>>;\n  node: Node<TableTreeNode<T>>;\n  entry: TableTreeNode<T>;\n  isVirtualized: boolean;\n}\n\nexport interface TableRowProps<T = any> {\n  rowKey: Key;\n  /** Everything the renderer already computed: mods, ARIA, handlers. */\n  rowProps: Record<string, any>;\n  height?: number;\n  /** Set on the virtualized path so the virtualizer can measure the row. */\n  measureRef?: Ref<HTMLTableRowElement>;\n  /** Internal React Aria row ref in tree mode. */\n  rowRef?: Ref<HTMLTableRowElement>;\n  index?: number;\n  dragState?: DraggableCollectionState;\n  dropState?: DroppableCollectionState;\n  tree?: TableRowTreeProps<T>;\n  children:\n    | ReactNode\n    | ((treeItemAria: ReturnType<typeof useTreeItem> | undefined) => ReactNode);\n}\n\nfunction Row(\n  props: TableRowProps & {\n    extra?: Record<string, any>;\n    rowRef?: Ref<HTMLTableRowElement>;\n  },\n) {\n  const { rowProps, height, measureRef, rowRef, index, extra, children } =\n    props;\n\n  return (\n    <tr\n      {...rowProps}\n      {...extra}\n      ref={mergeRefs(measureRef, rowRef)}\n      data-index={index}\n      style={height != null ? { height } : undefined}\n    >\n      {typeof children === 'function' ? children(undefined) : children}\n    </tr>\n  );\n}\n\n/**\n * A row inside a collection that accepts drags.\n *\n * Split from the plain row so the drag hooks can be called unconditionally —\n * they are hooks, and whether a table is draggable is a prop.\n */\nfunction DraggableRow(props: TableRowProps) {\n  const { rowKey, dragState, dropState } = props;\n\n  const dragResult = useDraggableItem(\n    { key: rowKey },\n    dragState as DraggableCollectionState,\n  );\n\n  /**\n   * Whether a drop would land *on* this row.\n   *\n   * `useDropIndicator` rather than asking `dropState.isDropTarget` directly:\n   * the state object's identity never changes as the pointer moves, so a plain\n   * read is computed once and never updates. The hook subscribes, which is what\n   * makes the highlight follow the cursor.\n   */\n  const onRef = useRef<HTMLDivElement>(null);\n  const { isDropTarget: isOnTarget } = useDropIndicator(\n    { target: { type: 'item', key: rowKey, dropPosition: 'on' } },\n    dropState as DroppableCollectionState,\n    onRef,\n  );\n\n  return (\n    <Row\n      {...props}\n      extra={{\n        ...mergeProps(props.rowProps, dragResult.dragProps),\n        'data-draggable': '',\n        'data-dragging': dragResult.isDragging ? '' : undefined,\n        'data-drop-target': isOnTarget ? '' : undefined,\n      }}\n    />\n  );\n}\n\nfunction TreeRow<T>(props: TableRowProps<T>) {\n  const { tree } = props;\n  const rowRef = useRef<HTMLTableRowElement>(null);\n  const treeItemAria = useTreeItem(\n    {\n      node: tree!.node,\n      hasChildItems: tree!.entry.children.length > 0,\n      isVirtualized: tree!.isVirtualized,\n    },\n    tree!.state,\n    rowRef,\n  );\n\n  const rowProps = mergeProps(treeItemAria.rowProps, props.rowProps);\n\n  // Table geometry and ItemTable selection are separate from React Aria's\n  // internal focus-only selection manager, so the renderer's values win.\n  if (props.rowProps['aria-rowindex'] !== undefined) {\n    rowProps['aria-rowindex'] = props.rowProps['aria-rowindex'];\n  }\n  if (props.rowProps['aria-selected'] !== undefined) {\n    rowProps['aria-selected'] = props.rowProps['aria-selected'];\n  }\n  rowProps['aria-level'] = tree!.entry.level + 1;\n  rowProps['aria-posinset'] = tree!.entry.siblingIndex + 1;\n  rowProps['aria-setsize'] = tree!.entry.siblingCount;\n\n  const children =\n    typeof props.children === 'function'\n      ? props.children(treeItemAria)\n      : props.children;\n  const next = { ...props, rowProps, rowRef, children };\n\n  return props.dragState && props.dropState ? (\n    <DraggableRow {...next} />\n  ) : (\n    <Row {...next} />\n  );\n}\n\nexport function TableRow<T>(props: TableRowProps<T>) {\n  if (props.tree) return <TreeRow {...props} />;\n\n  return props.dragState && props.dropState ? (\n    <DraggableRow {...props} />\n  ) : (\n    <Row {...props} />\n  );\n}\n\nexport interface TableRowDropIndicatorProps {\n  rowKey: Key;\n  dropPosition: 'before' | 'after';\n  dropState: DroppableCollectionState;\n  columnCount: number;\n}\n\n/**\n * The line showing where a dragged row would land.\n *\n * Its own `<tr>`, because a native table cannot hold an arbitrary element\n * between two rows — the same shape `ListBox` uses with `<li>`. It renders\n * nothing at all unless a drag is in flight, so the table's normal structure is\n * untouched the rest of the time.\n */\nexport function TableRowDropIndicator(props: TableRowDropIndicatorProps) {\n  const { rowKey, dropPosition, dropState, columnCount } = props;\n  const ref = useRef<HTMLDivElement>(null);\n  const { dropIndicatorProps, isHidden, isDropTarget } = useDropIndicator(\n    { target: { type: 'item', key: rowKey, dropPosition } },\n    dropState,\n    ref,\n  );\n\n  if (isHidden) return null;\n\n  return (\n    <tr data-element=\"DropIndicatorRow\">\n      <td data-element=\"DropIndicatorCell\" colSpan={Math.max(columnCount, 1)}>\n        <div\n          {...dropIndicatorProps}\n          ref={ref}\n          data-element=\"DropIndicator\"\n          data-drop-target={isDropTarget ? '' : undefined}\n        />\n      </td>\n    </tr>\n  );\n}\n"],"mappings":";;;;;;;;;AAuCA,SAAAmC,IAAAC,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CAME,MAAA,EAAAhB,UAAAE,QAAAC,YAAAE,QAAAC,OAAAW,OAAAP,aACEI;CAAM,IAAAI;AAAA,KAAAH,EAAA,OAAAZ,cAAAY,EAAA,OAAAV,QAAA;AAMCa,OAAAnC,UAAUoB,YAAYE,OAAO;AAAAU,IAAA,KAAAZ;AAAAY,IAAA,KAAAV;AAAAU,IAAA,KAAAG;OAAAA,MAAAH,EAAA;CAAA,IAAAI;AAAA,KAAAJ,EAAA,OAAAb,QAAA;AAE3BiB,OAAAjB,UAAU,OAAV,EAAAA,QAAuC,GAAvCkB;AAAuCL,IAAA,KAAAb;AAAAa,IAAA,KAAAI;OAAAA,MAAAJ,EAAA;CAAA,IAAAM;AAAA,KAAAN,EAAA,OAAAL,UAAA;AAE7CW,OAAA,OAAOX,aAAa,aAAaA,SAASU,OAAqB,GAA/DV;AAA+DK,IAAA,KAAAL;AAAAK,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAAA,IAAAO;AAAA,KAAAP,EAAA,OAAAE,SAAAF,EAAA,OAAAT,SAAAS,EAAA,OAAAf,YAAAe,EAAA,QAAAG,MAAAH,EAAA,QAAAI,MAAAJ,EAAA,QAAAM,IAAA;AAPlEC,OAAA,oBAAA;GAQK,GAPCtB;GAAQ,GACRiB;GACC,KAAAC;GACOZ,cAAAA;GACL,OAAAa;aAENE;IACE;AAAAN,IAAA,KAAAE;AAAAF,IAAA,KAAAT;AAAAS,IAAA,KAAAf;AAAAe,IAAA,MAAAG;AAAAH,IAAA,MAAAI;AAAAJ,IAAA,MAAAM;AAAAN,IAAA,MAAAO;OAAAA,MAAAP,EAAA;AAAA,QARLO;;;;;;;;AAkBJ,SAAAC,aAAAT,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CACE,MAAA,EAAAjB,QAAAQ,WAAAC,cAAyCM;CAAM,IAAAI;AAAA,KAAAH,EAAA,OAAAhB,QAAA;AAG7CmB,OAAA,EAAAM,KAAOzB,QAAQ;AAAAgB,IAAA,KAAAhB;AAAAgB,IAAA,KAAAG;OAAAA,MAAAH,EAAA;CADjB,MAAAU,aAAmB9C,iBACjBuC,IACAX,UACD;CAUD,MAAAmB,QAAchD,OAAuB,KAAK;CAAC,IAAAyC;AAAA,KAAAJ,EAAA,OAAAhB,QAAA;AAEzCoB,OAAA,EAAAQ,QAAU;GAAAC,MAAQ;GAAMJ,KAAOzB;GAAM8B,cAAgB;GAAK,EAAG;AAAAd,IAAA,KAAAhB;AAAAgB,IAAA,KAAAI;OAAAA,MAAAJ,EAAA;CAD/D,MAAA,EAAAe,cAAAC,eAAqCnD,iBACnCuC,IACAX,WACAkB,MACD;CAAC,IAAAL;AAAA,KAAAN,EAAA,OAAAU,WAAAO,aAAAjB,EAAA,OAAAD,MAAAd,UAAA;AAMOqB,OAAAvC,aAAWgC,MAAKd,UAAWyB,WAAUO,UAAW;AAAAjB,IAAA,KAAAU,WAAAO;AAAAjB,IAAA,KAAAD,MAAAd;AAAAe,IAAA,KAAAM;OAAAA,MAAAN,EAAA;CAElC,MAAAO,KAAAG,WAAUQ,aAAV,KAAAb;CACG,MAAAc,KAAAH,aAAA,KAAAX;CAA2B,IAAAe;AAAA,KAAApB,EAAA,OAAAM,MAAAN,EAAA,OAAAO,MAAAP,EAAA,OAAAmB,IAAA;AAJ1CC,OAAA;GAAA,GACFd;GAAgD,kBACjC;GAAE,iBACHC;GAAsC,oBACnCY;GACrB;AAAAnB,IAAA,KAAAM;AAAAN,IAAA,KAAAO;AAAAP,IAAA,KAAAmB;AAAAnB,IAAA,MAAAoB;OAAAA,MAAApB,EAAA;CAAA,IAAAqB;AAAA,KAAArB,EAAA,QAAAD,SAAAC,EAAA,QAAAoB,IAAA;AAPHC,OAAA,oBAAC;GAAG,GACEtB;GACG,OAAAqB;IAMP;AAAApB,IAAA,MAAAD;AAAAC,IAAA,MAAAoB;AAAApB,IAAA,MAAAqB;OAAAA,MAAArB,EAAA;AAAA,QARFqB;;AAYJ,SAAAC,QAAAvB,OAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CACE,MAAA,EAAAP,SAAiBK;CACjB,MAAAT,SAAe3B,OAA4B,KAAK;CAI7B,MAAAwC,KAAAT,KAAIb,MAAOc,SAAS4B,SAAU;CAAC,IAAAnB;AAAA,KAAAJ,EAAA,OAAAG,MAAAH,EAAA,OAAAN,KAAAZ,iBAAAkB,EAAA,OAAAN,KAAAd,MAAA;AAFhDwB,OAAA;GAAAxB,MACQc,KAAId;GAAM4C,eACDrB;GAA+BrB,eAC/BY,KAAIZ;GACpB;AAAAkB,IAAA,KAAAG;AAAAH,IAAA,KAAAN,KAAAZ;AAAAkB,IAAA,KAAAN,KAAAd;AAAAoB,IAAA,KAAAI;OAAAA,MAAAJ,EAAA;CALH,MAAAJ,eAAqB9B,YACnBsC,IAKAV,KAAIhB,OACJY,OACD;CAAC,IAAAL;AAAA,KAAAe,EAAA,OAAAD,MAAAd,YAAAe,EAAA,OAAAN,KAAAb,MAAA4C,SAAAzB,EAAA,OAAAN,KAAAb,MAAA6C,gBAAA1B,EAAA,OAAAN,KAAAb,MAAA8C,gBAAA3B,EAAA,OAAAJ,aAAAX,UAAA;AAEFA,aAAiBlB,aAAW6B,aAAYX,UAAWc,MAAKd,SAAU;AAIlE,MAAIc,MAAKd,SAAU,qBAAqBoB,OACtCpB,UAAS,mBAAmBc,MAAKd,SAAU;AAE7C,MAAIc,MAAKd,SAAU,qBAAqBoB,OACtCpB,UAAS,mBAAmBc,MAAKd,SAAU;AAE7CA,WAAS,gBAAgBS,KAAIb,MAAO4C,QAAS;AAC7CxC,WAAS,mBAAmBS,KAAIb,MAAO8C,eAAgB;AACvD1C,WAAS,kBAAkBS,KAAIb,MAAO6C;AAAd1B,IAAA,KAAAD,MAAAd;AAAAe,IAAA,KAAAN,KAAAb,MAAA4C;AAAAzB,IAAA,KAAAN,KAAAb,MAAA6C;AAAA1B,IAAA,KAAAN,KAAAb,MAAA8C;AAAA3B,IAAA,KAAAJ,aAAAX;AAAAe,IAAA,KAAAf;OAAAA,YAAAe,EAAA;CAAA,IAAAM;AAAA,KAAAN,EAAA,QAAAD,MAAAJ,YAAAK,EAAA,QAAAJ,cAAA;AAGtBU,OAAA,OAAOP,MAAKJ,aAAc,aACtBI,MAAKJ,SAAUC,aACD,GAAdG,MAAKJ;AAASK,IAAA,MAAAD,MAAAJ;AAAAK,IAAA,MAAAJ;AAAAI,IAAA,MAAAM;OAAAA,MAAAN,EAAA;CAHpB,MAAAL,WACEW;CAEmB,IAAAC;AAAA,KAAAP,EAAA,QAAAL,YAAAK,EAAA,QAAAD,SAAAC,EAAA,QAAAf,UAAA;AACRsB,OAAA;GAAA,GAAKR;GAAKd;GAAAK;GAAAK;GAA8B;AAAAK,IAAA,MAAAL;AAAAK,IAAA,MAAAD;AAAAC,IAAA,MAAAf;AAAAe,IAAA,MAAAO;OAAAA,MAAAP,EAAA;CAArD,MAAA4B,OAAarB;CAAyC,IAAAY;AAAA,KAAAnB,EAAA,QAAA4B,QAAA5B,EAAA,QAAAD,MAAAP,aAAAQ,EAAA,QAAAD,MAAAN,WAAA;AAE/C0B,OAAApB,MAAKP,aAAcO,MAAKN,YAC7B,oBAAC,gBAAY,GAAKmC,OAGnB,GADC,oBAAC,OAAG,GAAKA,OACV;AAAA5B,IAAA,MAAA4B;AAAA5B,IAAA,MAAAD,MAAAP;AAAAQ,IAAA,MAAAD,MAAAN;AAAAO,IAAA,MAAAmB;OAAAA,MAAAnB,EAAA;AAAA,QAJMmB;;AAOT,SAAOU,SAAA9B,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;AACL,KAAIF,MAAKL,MAAK;EAAA,IAAAS;AAAA,MAAAH,EAAA,OAAAD,OAAA;AAASI,QAAA,oBAAC,WAAO,GAAKJ,QAAS;AAAAC,KAAA,KAAAD;AAAAC,KAAA,KAAAG;QAAAA,MAAAH,EAAA;AAAA,SAAtBG;;CAAuB,IAAAA;AAAA,KAAAH,EAAA,OAAAD,OAAA;AAEvCI,OAAAJ,MAAKP,aAAcO,MAAKN,YAC7B,oBAAC,gBAAY,GAAKM,QAGnB,GADC,oBAAC,OAAG,GAAKA,QACV;AAAAC,IAAA,KAAAD;AAAAC,IAAA,KAAAG;OAAAA,MAAAH,EAAA;AAAA,QAJMG;;;;;;;;;;AAsBT,SAAO6B,sBAAAjC,OAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACL,MAAA,EAAAjB,QAAA8B,cAAArB,WAAAsC,gBAAyDhC;CACzD,MAAAkC,MAAYtE,OAAuB,KAAK;CAAC,IAAAwC;AAAA,KAAAH,EAAA,OAAAc,gBAAAd,EAAA,OAAAhB,QAAA;AAEvCmB,OAAA,EAAAS,QAAU;GAAAC,MAAQ;GAAMJ,KAAOzB;GAAM8B;GAAe,EAAG;AAAAd,IAAA,KAAAc;AAAAd,IAAA,KAAAhB;AAAAgB,IAAA,KAAAG;OAAAA,MAAAH,EAAA;CADzD,MAAA,EAAAkC,oBAAAC,UAAApB,iBAAuDlD,iBACrDsC,IACAV,WACAwC,IACD;AAED,KAAIE,SAAQ,QAAS;CAI6B,MAAA/B,KAAAgC,KAAIC,IAAKN,aAAa,EAAE;CAKhD,MAAAzB,KAAAS,eAAA,KAAAV;CAA6B,IAAAE;AAAA,KAAAP,EAAA,OAAAkC,sBAAAlC,EAAA,OAAAM,IAAA;AAJjDC,OAAA,oBAAA;GAKE,GAJI2B;GACCD;GACQ,gBAAA;GACK,oBAAA3B;IAClB;AAAAN,IAAA,KAAAkC;AAAAlC,IAAA,KAAAM;AAAAN,IAAA,KAAAO;OAAAA,MAAAP,EAAA;CAAA,IAAAmB;AAAA,KAAAnB,EAAA,OAAAI,MAAAJ,EAAA,OAAAO,IAAA;AAPNY,OAAA,oBAAA;GAAiB,gBAAA;aACf,oBAAA;IAAiB,gBAAA;IAA6B,SAAAf;cAC5CG;KAOJ;IAAK;AAAAP,IAAA,KAAAI;AAAAJ,IAAA,KAAAO;AAAAP,IAAA,KAAAmB;OAAAA,MAAAnB,EAAA;AAAA,QATLmB"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.181.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
@@ -34,6 +34,7 @@ import { useRowMoveAnimation } from "./use-row-move-animation.js";
 import { useScrollability } from "./use-scrollability.js";
 import { getColumnText, getColumnValue } from "./use-table-columns.js";
 import { ROW_NUMBER_COLUMN_KEY, SELECTION_COLUMN_KEY } from "./use-table-selection.js";
+import { c } from "react-compiler-runtime";
 import { Fragment, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { VisuallyHidden, useTree } from "react-aria";
@@ -70,7 +71,8 @@ const ARIA_SORT = {
 * theme's own hash, so two tables sharing a colour share one injection and
 * neither can evict the other's.
 */
-function ColumnTintRegistrar({ config }) {
+function ColumnTintRegistrar(t0) {
+	const { config } = t0;
 	useColorTheme(config);
 	return null;
 }
@@ -109,93 +111,130 @@ function pinStyle(column) {
 * component so their DOM and keyboard behaviour remain exactly as before.
 */
 function TreeGridTable(props) {
+	const $ = c(16);
 	const { tree, tableProps, style, children } = props;
 	const ref = useRef(null);
 	const pendingFocusKey = useRef(null);
 	const { gridProps } = useTree(tree.ariaProps, tree.state, ref);
-	useEffect(() => {
-		const key = pendingFocusKey.current;
-		if (key == null) return;
-		const activeElement = document.activeElement;
-		if (activeElement && activeElement !== document.body && !ref.current?.contains(activeElement)) {
-			pendingFocusKey.current = null;
-			return;
-		}
-		const target = Array.from(ref.current?.querySelectorAll("tbody tr[data-element=\"Row\"][data-key]") ?? []).find((element) => element.dataset.key === String(key));
-		if (target) {
-			pendingFocusKey.current = null;
-			target.focus();
-		}
-	});
-	const handleBlurCapture = (event) => {
-		const pendingKey = pendingFocusKey.current;
-		const nextTarget = event.relatedTarget;
-		if (pendingKey != null && nextTarget instanceof Element) {
-			if (nextTarget.closest("tbody tr[data-element=\"Row\"][data-key]")?.dataset.key !== String(pendingKey)) pendingFocusKey.current = null;
-		}
-		gridProps.onBlurCapture?.(event);
-	};
-	const handleKeyDownCapture = (event) => {
-		const row = event.target.closest("tbody tr[data-element=\"Row\"][data-key]");
-		if (!row || event.target !== row) {
-			gridProps.onKeyDownCapture?.(event);
-			return;
-		}
-		const currentKey = pendingFocusKey.current ?? row.dataset.key;
-		const index = tree.entries.findIndex((entry) => String(entry.key) === String(currentKey));
-		const entry = tree.entries[index];
-		if (!entry) return;
-		const focusEntry = (next) => {
-			if (!next) return false;
-			tree.state.selectionManager.setFocusedKey(next.key);
-			const target = Array.from(ref.current?.querySelectorAll("tbody tr[data-element=\"Row\"][data-key]") ?? []).find((element) => element.dataset.key === String(next.key));
+	let t0;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t0 = () => {
+			const key = pendingFocusKey.current;
+			if (key == null) return;
+			const activeElement = document.activeElement;
+			if (activeElement && activeElement !== document.body && !ref.current?.contains(activeElement)) {
+				pendingFocusKey.current = null;
+				return;
+			}
+			const target = Array.from(ref.current?.querySelectorAll("tbody tr[data-element=\"Row\"][data-key]") ?? []).find((element) => element.dataset.key === String(key));
 			if (target) {
 				pendingFocusKey.current = null;
 				target.focus();
-			} else pendingFocusKey.current = next.key;
-			return true;
+			}
 		};
-		const hasChildren = entry.children.length > 0;
-		const isExpanded = tree.state.expandedKeys.has(entry.key);
-		let handled = false;
-		if (event.key === "ArrowRight" && hasChildren) if (isExpanded) handled = focusEntry(entry.children[0]);
-		else {
-			tree.state.toggleKey(entry.key);
-			handled = true;
-		}
-		else if (event.key === "ArrowLeft") {
-			if (hasChildren && isExpanded) {
-				tree.state.toggleKey(entry.key);
+		$[0] = t0;
+	} else t0 = $[0];
+	useEffect(t0);
+	let t1;
+	if ($[1] !== gridProps) {
+		t1 = (event) => {
+			const pendingKey = pendingFocusKey.current;
+			const nextTarget = event.relatedTarget;
+			if (pendingKey != null && nextTarget instanceof Element) {
+				if (nextTarget.closest("tbody tr[data-element=\"Row\"][data-key]")?.dataset.key !== String(pendingKey)) pendingFocusKey.current = null;
+			}
+			gridProps.onBlurCapture?.(event);
+		};
+		$[1] = gridProps;
+		$[2] = t1;
+	} else t1 = $[2];
+	const handleBlurCapture = t1;
+	let t2;
+	if ($[3] !== gridProps || $[4] !== tree.entries || $[5] !== tree.state) {
+		t2 = (event_0) => {
+			const row = event_0.target.closest("tbody tr[data-element=\"Row\"][data-key]");
+			if (!row || event_0.target !== row) {
+				gridProps.onKeyDownCapture?.(event_0);
+				return;
+			}
+			const currentKey = pendingFocusKey.current ?? row.dataset.key;
+			const index = tree.entries.findIndex((entry) => String(entry.key) === String(currentKey));
+			const entry_0 = tree.entries[index];
+			if (!entry_0) return;
+			const focusEntry = (next) => {
+				if (!next) return false;
+				tree.state.selectionManager.setFocusedKey(next.key);
+				const target_0 = Array.from(ref.current?.querySelectorAll("tbody tr[data-element=\"Row\"][data-key]") ?? []).find((element_0) => element_0.dataset.key === String(next.key));
+				if (target_0) {
+					pendingFocusKey.current = null;
+					target_0.focus();
+				} else pendingFocusKey.current = next.key;
+				return true;
+			};
+			const hasChildren = entry_0.children.length > 0;
+			const isExpanded = tree.state.expandedKeys.has(entry_0.key);
+			let handled = false;
+			if (event_0.key === "ArrowRight" && hasChildren) if (isExpanded) handled = focusEntry(entry_0.children[0]);
+			else {
+				tree.state.toggleKey(entry_0.key);
 				handled = true;
-			} else if (entry.parentKey != null) handled = focusEntry(tree.entries.find((candidate) => candidate.key === entry.parentKey));
-		} else if (event.key === "ArrowDown") handled = focusEntry(tree.entries[index + 1]);
-		else if (event.key === "ArrowUp") handled = focusEntry(tree.entries[index - 1]);
-		if (handled) {
-			event.preventDefault();
-			event.stopPropagation();
-			return;
-		}
-		if (pendingFocusKey.current != null && [
-			"ArrowDown",
-			"ArrowUp",
-			"ArrowRight",
-			"ArrowLeft"
-		].includes(event.key)) {
-			event.preventDefault();
-			event.stopPropagation();
-			return;
-		}
-		gridProps.onKeyDownCapture?.(event);
-	};
-	return /* @__PURE__ */ jsx("table", {
-		...mergeProps$1(gridProps, tableProps),
-		ref,
-		role: "treegrid",
-		style,
-		onBlurCapture: handleBlurCapture,
-		onKeyDownCapture: handleKeyDownCapture,
-		children
-	});
+			}
+			else if (event_0.key === "ArrowLeft") {
+				if (hasChildren && isExpanded) {
+					tree.state.toggleKey(entry_0.key);
+					handled = true;
+				} else if (entry_0.parentKey != null) handled = focusEntry(tree.entries.find((candidate) => candidate.key === entry_0.parentKey));
+			} else if (event_0.key === "ArrowDown") handled = focusEntry(tree.entries[index + 1]);
+			else if (event_0.key === "ArrowUp") handled = focusEntry(tree.entries[index - 1]);
+			if (handled) {
+				event_0.preventDefault();
+				event_0.stopPropagation();
+				return;
+			}
+			if (pendingFocusKey.current != null && [
+				"ArrowDown",
+				"ArrowUp",
+				"ArrowRight",
+				"ArrowLeft"
+			].includes(event_0.key)) {
+				event_0.preventDefault();
+				event_0.stopPropagation();
+				return;
+			}
+			gridProps.onKeyDownCapture?.(event_0);
+		};
+		$[3] = gridProps;
+		$[4] = tree.entries;
+		$[5] = tree.state;
+		$[6] = t2;
+	} else t2 = $[6];
+	const handleKeyDownCapture = t2;
+	let t3;
+	if ($[7] !== gridProps || $[8] !== tableProps) {
+		t3 = mergeProps$1(gridProps, tableProps);
+		$[7] = gridProps;
+		$[8] = tableProps;
+		$[9] = t3;
+	} else t3 = $[9];
+	let t4;
+	if ($[10] !== children || $[11] !== handleBlurCapture || $[12] !== handleKeyDownCapture || $[13] !== style || $[14] !== t3) {
+		t4 = /* @__PURE__ */ jsx("table", {
+			...t3,
+			ref,
+			role: "treegrid",
+			style,
+			onBlurCapture: handleBlurCapture,
+			onKeyDownCapture: handleKeyDownCapture,
+			children
+		});
+		$[10] = children;
+		$[11] = handleBlurCapture;
+		$[12] = handleKeyDownCapture;
+		$[13] = style;
+		$[14] = t3;
+		$[15] = t4;
+	} else t4 = $[15];
+	return t4;
 }
 /**
 * The one place table DOM exists. Both `ItemTable` and `DataTable` resolve their