@jetbrains/ring-ui-built 8.0.0-beta.4 → 8.0.0-beta.5

package/components/table/default-item-renderer.d.ts

@@ -32,6 +32,12 @@ export interface DefaultItemRendererProps {
      * and track the visibility yourself.
      */
     noItemVirtualization?: boolean;
+    /**
+     * When set to `true`, does not report the item's boundaries to the reorder system.
+     * Useful when you include `DefaultItemRenderer` as a part of a custom row renderer
+     * that registers boundaries itself.
+     */
+    noReorderLayout?: boolean;
 }
 /**
  * Standard component for rendering a table row.
@@ -46,4 +52,4 @@ export interface DefaultItemRendererProps {
  * accessible controls, such as checkboxes or buttons with accessible
  * labels.
  */
-export declare function DefaultItemRenderer<T>({ index, keyboardFocusable, clickable, selected, level, noItemVirtualization, ref: userRef, className, ...restProps }: DefaultItemRendererProps & ComponentPropsWithRef<'tr'>): import("react").JSX.Element | null;
+export declare function DefaultItemRenderer<T>({ index, keyboardFocusable, clickable, selected, level, noItemVirtualization, noReorderLayout, ref: userRef, className, ...restProps }: DefaultItemRendererProps & ComponentPropsWithRef<'tr'>): import("react").JSX.Element | null;

package/components/table/default-item-renderer.js

@@ -1,24 +1,35 @@
 import { c } from 'react/compiler-runtime';
 import { useRef, use } from 'react';
 import classNames from 'classnames';
-import { TablePropsContext, ColumnAnimationContext } from './table-const.js';
+import { TablePropsContext } from './table-const.js';
 import { useComposedRef } from '../global/compose-refs.js';
 import { useItemVirtualization } from './item-virtualization.js';
 import { TableRow, TableCell } from './table-primitives.js';
+import { ReorderAnimationContext } from '../internal/reorder-animation-context.js';
+import { useReorderItemLayout } from './reorder-item-layout.js';
 import { s as styles } from '../_helpers/table.js';
 import { jsx } from 'react/jsx-runtime';
 import 'memoize-one';
+import '../internal/virtualization.js';
 import '../global/intersection-observer-context.js';
-import '../internal/virtual-items.js';
 import '../global/schedule-with-cleanup.js';
+import '../internal/reorder-handle.js';
+import '@jetbrains/icons/drag-12px';
+import '../icon/icon.js';
+import 'util-deprecate';
+import '../icon/icon.constants.js';
+import '../_helpers/icon-svg.js';
+import '../global/memoize.js';
+import '../global/parse-css-duration.js';
+import '../internal/reorder-layout-context.js';
 
 function DefaultItemRenderer(t0) {
-  const $ = c(39);
-  if ($[0] !== "814543263ebfe37ed20c6e2945771deb8a681b9bdb7c32cb1fc590d5f0122c82") {
-    for (let $i = 0; $i < 39; $i += 1) {
+  const $ = c(47);
+  if ($[0] !== "bc245d0d0a3699b5ab0d750beda2a663dcc05f6d122b039db369f77f976f7ee8") {
+    for (let $i = 0; $i < 47; $i += 1) {
       $[$i] = Symbol.for("react.memo_cache_sentinel");
     }
-    $[0] = "814543263ebfe37ed20c6e2945771deb8a681b9bdb7c32cb1fc590d5f0122c82";
+    $[0] = "bc245d0d0a3699b5ab0d750beda2a663dcc05f6d122b039db369f77f976f7ee8";
   }
   let className;
   let clickable;
@@ -26,6 +37,7 @@ function DefaultItemRenderer(t0) {
   let keyboardFocusable;
   let level;
   let noItemVirtualization;
+  let noReorderLayout;
   let restProps;
   let selected;
   let userRef;
@@ -37,6 +49,7 @@ function DefaultItemRenderer(t0) {
       selected,
       level,
       noItemVirtualization,
+      noReorderLayout,
       ref: userRef,
       className,
       ...restProps
@@ -48,9 +61,10 @@ function DefaultItemRenderer(t0) {
     $[5] = keyboardFocusable;
     $[6] = level;
     $[7] = noItemVirtualization;
-    $[8] = restProps;
-    $[9] = selected;
-    $[10] = userRef;
+    $[8] = noReorderLayout;
+    $[9] = restProps;
+    $[10] = selected;
+    $[11] = userRef;
   } else {
     className = $[2];
     clickable = $[3];
@@ -58,66 +72,102 @@ function DefaultItemRenderer(t0) {
     keyboardFocusable = $[5];
     level = $[6];
     noItemVirtualization = $[7];
-    restProps = $[8];
-    selected = $[9];
-    userRef = $[10];
+    noReorderLayout = $[8];
+    restProps = $[9];
+    selected = $[10];
+    userRef = $[11];
   }
   const localRef = useRef(null);
   const composedRef = useComposedRef(userRef, localRef);
   let t1;
-  if ($[11] !== noItemVirtualization) {
+  if ($[12] !== noItemVirtualization) {
     t1 = (t2, _i, t3) => {
       const [isIntersecting] = t2;
       const [element] = t3;
       return isIntersecting === false && !noItemVirtualization && element?.isConnected && !element.contains(document.activeElement) && !element.previousElementSibling?.contains(document.activeElement) && !element.nextElementSibling?.contains(document.activeElement) ? element.getBoundingClientRect().height : undefined;
     };
-    $[11] = noItemVirtualization;
-    $[12] = t1;
+    $[12] = noItemVirtualization;
+    $[13] = t1;
   } else {
-    t1 = $[12];
+    t1 = $[13];
   }
   const t2 = t1;
   let t3;
-  if ($[13] !== index || $[14] !== t2) {
+  if ($[14] !== index || $[15] !== t2) {
     t3 = {
       index,
       refs: localRef,
       onIntersectionChange: t2
     };
-    $[13] = index;
-    $[14] = t2;
-    $[15] = t3;
+    $[14] = index;
+    $[15] = t2;
+    $[16] = t3;
   } else {
-    t3 = $[15];
+    t3 = $[16];
   }
   useItemVirtualization(t3);
+  let t4;
+  if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = () => {
+      var _r$top, _r$bottom;
+      const r = localRef.current?.getBoundingClientRect();
+      return {
+        start: (_r$top = r?.top) !== null && _r$top !== void 0 ? _r$top : 0,
+        end: (_r$bottom = r?.bottom) !== null && _r$bottom !== void 0 ? _r$bottom : 0
+      };
+    };
+    $[17] = t4;
+  } else {
+    t4 = $[17];
+  }
+  let t5;
+  if ($[18] !== index || $[19] !== noReorderLayout) {
+    t5 = {
+      disabled: noReorderLayout,
+      index,
+      getBounds: t4
+    };
+    $[18] = index;
+    $[19] = noReorderLayout;
+    $[20] = t5;
+  } else {
+    t5 = $[20];
+  }
+  useReorderItemLayout(t5);
   const tableProps = use(TablePropsContext);
   if (!tableProps) {
     return null;
   }
-  const animatedColumn = use(ColumnAnimationContext);
+  const {
+    reorderAnimation
+  } = use(ReorderAnimationContext);
+  const isAnimatedItem = reorderAnimation?.direction === "items" && reorderAnimation.index === index;
+  const animatedColumnIndex = reorderAnimation?.direction === "columns" ? reorderAnimation.index : undefined;
+  const animateClassName = reorderAnimation?.className;
   const {
     data,
     columns
   } = tableProps;
   const item = data[index];
-  const t4 = clickable && styles.clickableRow;
-  const t5 = selected && styles.selectedRow;
-  let t6;
-  if ($[16] !== className || $[17] !== t4 || $[18] !== t5) {
-    t6 = classNames(className, t4, t5);
-    $[16] = className;
-    $[17] = t4;
-    $[18] = t5;
-    $[19] = t6;
+  const t6 = clickable && styles.clickableRow;
+  const t7 = selected && styles.selectedRow;
+  const t8 = isAnimatedItem && animateClassName;
+  let t9;
+  if ($[21] !== className || $[22] !== t6 || $[23] !== t7 || $[24] !== t8) {
+    t9 = classNames(className, t6, t7, t8);
+    $[21] = className;
+    $[22] = t6;
+    $[23] = t7;
+    $[24] = t8;
+    $[25] = t9;
   } else {
-    t6 = $[19];
+    t9 = $[25];
   }
-  let t7;
-  if ($[20] !== animatedColumn || $[21] !== columns || $[22] !== data || $[23] !== index || $[24] !== item || $[25] !== level) {
-    let t8;
-    if ($[27] !== animatedColumn || $[28] !== data || $[29] !== index || $[30] !== item || $[31] !== level) {
-      t8 = (column, columnIndex) => {
+  let t10;
+  if ($[26] !== animateClassName || $[27] !== animatedColumnIndex || $[28] !== columns || $[29] !== data || $[30] !== index || $[31] !== item || $[32] !== level) {
+    let t11;
+    if ($[34] !== animateClassName || $[35] !== animatedColumnIndex || $[36] !== data || $[37] !== index || $[38] !== item || $[39] !== level) {
+      t11 = (column, columnIndex) => {
         var _column$renderCell;
         const {
           key,
@@ -125,52 +175,54 @@ function DefaultItemRenderer(t0) {
           indent
         } = column;
         return /*#__PURE__*/jsx(TableCell, {
-          className: classNames(columnIndex === animatedColumn?.columnIndex && animatedColumn.cellClassName, typeof tdClassName === "function" ? tdClassName(item, index, data) : tdClassName),
+          className: classNames(columnIndex === animatedColumnIndex && animateClassName, typeof tdClassName === "function" ? tdClassName(item, index, data) : tdClassName),
           style: indent && level != null && level > 0 ? {
             paddingInlineStart: `${level * 24}px`
           } : undefined,
           children: (_column$renderCell = column.renderCell?.(item, index, data)) !== null && _column$renderCell !== void 0 ? _column$renderCell : getDefaultCellValue(item, columnIndex, key)
         }, key);
       };
-      $[27] = animatedColumn;
-      $[28] = data;
-      $[29] = index;
-      $[30] = item;
-      $[31] = level;
-      $[32] = t8;
+      $[34] = animateClassName;
+      $[35] = animatedColumnIndex;
+      $[36] = data;
+      $[37] = index;
+      $[38] = item;
+      $[39] = level;
+      $[40] = t11;
     } else {
-      t8 = $[32];
+      t11 = $[40];
     }
-    t7 = columns.map(t8);
-    $[20] = animatedColumn;
-    $[21] = columns;
-    $[22] = data;
-    $[23] = index;
-    $[24] = item;
-    $[25] = level;
-    $[26] = t7;
+    t10 = columns.map(t11);
+    $[26] = animateClassName;
+    $[27] = animatedColumnIndex;
+    $[28] = columns;
+    $[29] = data;
+    $[30] = index;
+    $[31] = item;
+    $[32] = level;
+    $[33] = t10;
   } else {
-    t7 = $[26];
+    t10 = $[33];
   }
-  let t8;
-  if ($[33] !== composedRef || $[34] !== keyboardFocusable || $[35] !== restProps || $[36] !== t6 || $[37] !== t7) {
-    t8 = /*#__PURE__*/jsx(TableRow, {
+  let t11;
+  if ($[41] !== composedRef || $[42] !== keyboardFocusable || $[43] !== restProps || $[44] !== t10 || $[45] !== t9) {
+    t11 = /*#__PURE__*/jsx(TableRow, {
       ref: composedRef,
       keyboardFocusable: keyboardFocusable,
-      className: t6,
+      className: t9,
       ...restProps,
-      children: t7
+      children: t10
     });
-    $[33] = composedRef;
-    $[34] = keyboardFocusable;
-    $[35] = restProps;
-    $[36] = t6;
-    $[37] = t7;
-    $[38] = t8;
+    $[41] = composedRef;
+    $[42] = keyboardFocusable;
+    $[43] = restProps;
+    $[44] = t10;
+    $[45] = t9;
+    $[46] = t11;
   } else {
-    t8 = $[38];
+    t11 = $[46];
   }
-  return t8;
+  return t11;
 }
 function getDefaultCellValue(item, columnIndex, columnKey) {
   if (Array.isArray(item)) {

package/components/table/internal/reorder-animation-context.d.ts

@@ -0,0 +1,21 @@
+import { type RefObject } from 'react';
+import type { Column } from '../table-props';
+import type { ReorderAnimation } from '../reorder-animation';
+export interface ReorderSpec {
+    direction: 'columns' | 'items';
+    fromIndex: number;
+    insertionIndex: number;
+}
+interface ReorderAnimationContextValue {
+    reorderAnimation: ReorderAnimation | null;
+    expectReorder: (reorderSpec: ReorderSpec) => void;
+}
+export declare const ReorderAnimationContext: import("react").Context<ReorderAnimationContextValue>;
+export declare function useReorderAnimationContextValue<T>({ noColumnReorderAnimation, noItemReorderAnimation, tableRef, data, columns, }: {
+    noColumnReorderAnimation: boolean | undefined;
+    noItemReorderAnimation: boolean | undefined;
+    tableRef: RefObject<HTMLTableElement | null>;
+    data: readonly T[];
+    columns: readonly Column<T>[];
+}): ReorderAnimationContextValue;
+export {};

package/components/table/internal/reorder-handle.d.ts

@@ -0,0 +1,9 @@
+import { type ComponentPropsWithRef } from 'react';
+import type { DragState } from '../table-primitives';
+export declare function ReorderHandle<T>({ direction, index, noDragFrame, noHandleTranslate, onUserDrag, ref: userRef, className, onKeyDown, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, onLostPointerCapture, ...restProps }: {
+    direction: 'columns' | 'items';
+    index: number;
+    noDragFrame?: boolean;
+    noHandleTranslate?: boolean;
+    onUserDrag?: (state: DragState) => void;
+} & ComponentPropsWithRef<'button'>): import("react").JSX.Element;

package/components/table/internal/reorder-layout-context.d.ts

@@ -0,0 +1,16 @@
+interface ItemBounds {
+    start: number;
+    end: number;
+}
+export interface InsertionPoint {
+    itemIndex: number;
+    after: boolean;
+}
+interface ReorderLayoutContextValue {
+    registerReorderItem(index: number, getBounds: () => ItemBounds): () => void;
+    getItemBounds(index: number): ItemBounds | undefined;
+    getClosestInsertionPoint(clientOffset: number, canReorder: (insertionIndex: number) => boolean): InsertionPoint | undefined;
+}
+export declare const ReorderLayoutContext: import("react").Context<ReorderLayoutContextValue>;
+export declare function useReorderLayoutContextValue(): ReorderLayoutContextValue;
+export {};

package/components/table/internal/table-header.d.ts

@@ -1,4 +1 @@
-import { type ExpectColumnReorder } from './column-animation';
-export declare function TableHeader<T>({ expectColumnReorder }: {
-    expectColumnReorder: ExpectColumnReorder;
-}): import("react").JSX.Element | null;
+export declare function TableHeader<T>(): import("react").JSX.Element | null;

package/components/table/internal/{virtual-items.d.ts → virtualization.d.ts}

@@ -1,4 +1,5 @@
 import { type RefObject } from 'react';
+import { type IntersectionObserverHandle } from '../../global/intersection-observer-context';
 export type VirtualItem = MaterializedItem | Spacer;
 interface MaterializedItem {
     type: 'materialized';
@@ -12,7 +13,11 @@ interface Spacer {
     key: string;
 }
 type CollapseItemIntoSpacerCallback = (index: number, height: number) => void;
-export declare const CollapseItemIntoSpacerContext: import("react").Context<CollapseItemIntoSpacerCallback>;
+interface VirtualizationContextValue {
+    intersectionObserverHandle: IntersectionObserverHandle;
+    collapseItemIntoSpacer: CollapseItemIntoSpacerCallback;
+}
+export declare const VirtualizationContext: import("react").Context<VirtualizationContextValue>;
 export declare function useVirtualItems<T>({ enabled, data, data: { length }, scrollerRef, tableRef, estimateHeight, lookaheadPx, retentionMarginPx, minScrollAndResizeDeltaPx, }: {
     enabled: boolean;
     data: readonly T[];
@@ -24,8 +29,10 @@ export declare function useVirtualItems<T>({ enabled, data, data: { length }, sc
     minScrollAndResizeDeltaPx: number;
 }): {
     virtualItems: VirtualItem[];
-    intersectionObserverHandle: import("../../global/intersection-observer-context").IntersectionObserverHandle;
-    collapseItemIntoSpacer: CollapseItemIntoSpacerCallback;
+    virtualizationContextValue: {
+        intersectionObserverHandle: IntersectionObserverHandle;
+        collapseItemIntoSpacer: (index: number, height: number) => void;
+    };
 };
 export declare function SpacerRow({ spacer: { from, to, height }, colSpan }: {
     spacer: Spacer;

package/components/table/item-virtualization.d.ts

@@ -13,13 +13,15 @@ export declare function useItemVirtualization({ index, refs, onIntersectionChang
      * When multiple elements are provided, the virtualization callback receives
      * the intersection state of all of them.
      *
-     * If you pass multiple refs, memoize the array (for example with `useMemo()`)
-     * to avoid restarting observation on every render.
+     * If you pass multiple refs, pass a stable array reference to avoid restarting
+     * observation on every render — for example, memoize it with `useMemo()`,
+     * unless you use the React Compiler.
      */
     refs: RefObject<HTMLElement | null> | RefObject<HTMLElement | null>[];
     /**
      * Invoked when the `isIntersecting` state of the observed elements changes.
-     * Consider wrapping a callback to `useCallback()` to avoid restarting observation on every render.
+     * Pass a stable function reference to avoid restarting observation on every render —
+     * for example, wrap it with `useCallback()`, unless you use the React Compiler.
      *
      * @param intersectionStates - Current intersection state of every observed element.
      * Entries are initially `undefined` until the corresponding element

package/components/table/item-virtualization.js

@@ -1,7 +1,7 @@
 import { c } from 'react/compiler-runtime';
 import { use, useEffect } from 'react';
-import { IntersectionObserverContext } from '../global/intersection-observer-context.js';
-import { CollapseItemIntoSpacerContext } from '../internal/virtual-items.js';
+import { VirtualizationContext } from '../internal/virtualization.js';
+import '../global/intersection-observer-context.js';
 import '../global/schedule-with-cleanup.js';
 import '../_helpers/table.js';
 import 'react/jsx-runtime';
@@ -11,22 +11,24 @@ import 'react/jsx-runtime';
  */
 function useItemVirtualization(t0) {
   const $ = c(8);
-  if ($[0] !== "15177a0e107705dc6d84a0fc97d3302da4c04a0058a1b771c145ee537ccae2cf") {
+  if ($[0] !== "28d3fc0a1c743c2e72a27a83caad5b78c5438f38b7abdd065da2a832e4f9fcec") {
     for (let $i = 0; $i < 8; $i += 1) {
       $[$i] = Symbol.for("react.memo_cache_sentinel");
     }
-    $[0] = "15177a0e107705dc6d84a0fc97d3302da4c04a0058a1b771c145ee537ccae2cf";
+    $[0] = "28d3fc0a1c743c2e72a27a83caad5b78c5438f38b7abdd065da2a832e4f9fcec";
   }
   const {
     index,
     refs,
     onIntersectionChange
   } = t0;
-  const handle = use(IntersectionObserverContext);
-  const collapseItemIntoSpacer = use(CollapseItemIntoSpacerContext);
+  const {
+    intersectionObserverHandle,
+    collapseItemIntoSpacer
+  } = use(VirtualizationContext);
   let t1;
   let t2;
-  if ($[1] !== collapseItemIntoSpacer || $[2] !== handle || $[3] !== index || $[4] !== onIntersectionChange || $[5] !== refs) {
+  if ($[1] !== collapseItemIntoSpacer || $[2] !== index || $[3] !== intersectionObserverHandle || $[4] !== onIntersectionChange || $[5] !== refs) {
     t1 = () => {
       const intersectionStates = Array.isArray(refs) ? refs.map(_temp) : [undefined];
       const elements = Array.isArray(refs) ? refs.map(_temp2) : [refs.current];
@@ -35,7 +37,7 @@ function useItemVirtualization(t0) {
         if (!element) {
           return;
         }
-        const cleanup = handle.observe(element, isIntersecting => {
+        const cleanup = intersectionObserverHandle.observe(element, isIntersecting => {
           intersectionStates[elementIndex] = isIntersecting;
           const height = onIntersectionChange(intersectionStates, elementIndex, elements);
           if (height != null) {
@@ -46,10 +48,10 @@ function useItemVirtualization(t0) {
       });
       return () => cleanups.forEach(_temp3);
     };
-    t2 = [collapseItemIntoSpacer, handle, index, onIntersectionChange, refs];
+    t2 = [collapseItemIntoSpacer, intersectionObserverHandle, index, onIntersectionChange, refs];
     $[1] = collapseItemIntoSpacer;
-    $[2] = handle;
-    $[3] = index;
+    $[2] = index;
+    $[3] = intersectionObserverHandle;
     $[4] = onIntersectionChange;
     $[5] = refs;
     $[6] = t1;

package/components/table/reorder-animation.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Information about a column or item currently being animated after reorder.
+ *
+ * Available through {@link useReorderAnimation} to allow custom cell
+ * renderers to animate reordered columns and items consistently with the default
+ * table renderer.
+ */
+export interface ReorderAnimation {
+    /**
+     * What is animated: columns or items (rows).
+     */
+    direction: 'columns' | 'items';
+    /**
+     * Index of the column or item being animated.
+     */
+    index: number;
+    /**
+     * Current animation phase.
+     */
+    phase: 'initial' | 'fade-out';
+    /**
+     * CSS class to apply to the animated row, cell, or another element used to
+     * render the animation on this phase.
+     *
+     * The class sets `background-color` and `transition`. If your custom styles
+     * also define `transition` on the same element, they may conflict with the
+     * animation.
+     */
+    className: string;
+}
+/**
+ * Provides information about the currently animated column or item after reorder.
+ *
+ * Use in a custom cell renderer to animate reordered columns and items
+ * consistently with the default table renderer.
+ */
+export declare function useReorderAnimation(): ReorderAnimation | null;

package/components/table/reorder-animation.js

@@ -0,0 +1,18 @@
+import { use } from 'react';
+import { ReorderAnimationContext } from '../internal/reorder-animation-context.js';
+import 'react/compiler-runtime';
+import '../global/parse-css-duration.js';
+import '../global/schedule-with-cleanup.js';
+import '../_helpers/table.js';
+
+/**
+ * Provides information about the currently animated column or item after reorder.
+ *
+ * Use in a custom cell renderer to animate reordered columns and items
+ * consistently with the default table renderer.
+ */
+function useReorderAnimation() {
+  return use(ReorderAnimationContext).reorderAnimation;
+}
+
+export { useReorderAnimation };

package/components/table/reorder-item-layout.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Registers the physical boundaries of a custom-rendered item with the reorder
+ * system, so that the insertion indicator and insertion point calculation are
+ * correct for items that span multiple rows or have non-standard sizing.
+ *
+ * `DefaultItemRenderer` calls this automatically. Use this hook in a custom item
+ * renderer when the default boundary measurement is insufficient — for example,
+ * when the item spans multiple rows, or when you don't use
+ * the `DefaultItemRenderer` at all.
+ *
+ * If you include `DefaultItemRenderer` inside your custom renderer, set its
+ * `noReorderLayout` prop to `true` to prevent double registration.
+ */
+export declare function useReorderItemLayout({ disabled, index, getBounds, }: {
+    /**
+     * When `true`, the item is not registered. Use to disable without violating
+     * the rules of hooks.
+     */
+    disabled?: boolean;
+    /**
+     * Index of the item in the `data` array.
+     */
+    index: number;
+    /**
+     * Returns the item's top and bottom client coordinates (in pixels, relative
+     * to the viewport).
+     */
+    getBounds: () => {
+        start: number;
+        end: number;
+    };
+}): void;

package/components/table/reorder-item-layout.js

@@ -0,0 +1,57 @@
+import { c } from 'react/compiler-runtime';
+import { use, useEffect } from 'react';
+import { ReorderLayoutContext } from '../internal/reorder-layout-context.js';
+
+/**
+ * Registers the physical boundaries of a custom-rendered item with the reorder
+ * system, so that the insertion indicator and insertion point calculation are
+ * correct for items that span multiple rows or have non-standard sizing.
+ *
+ * `DefaultItemRenderer` calls this automatically. Use this hook in a custom item
+ * renderer when the default boundary measurement is insufficient — for example,
+ * when the item spans multiple rows, or when you don't use
+ * the `DefaultItemRenderer` at all.
+ *
+ * If you include `DefaultItemRenderer` inside your custom renderer, set its
+ * `noReorderLayout` prop to `true` to prevent double registration.
+ */
+function useReorderItemLayout(t0) {
+  const $ = c(7);
+  if ($[0] !== "f6c2f22ac6ea5d08fd2648f9af507c996aa6e89216dff089c71921e1eb0bbd40") {
+    for (let $i = 0; $i < 7; $i += 1) {
+      $[$i] = Symbol.for("react.memo_cache_sentinel");
+    }
+    $[0] = "f6c2f22ac6ea5d08fd2648f9af507c996aa6e89216dff089c71921e1eb0bbd40";
+  }
+  const {
+    disabled,
+    index,
+    getBounds
+  } = t0;
+  const {
+    registerReorderItem
+  } = use(ReorderLayoutContext);
+  let t1;
+  let t2;
+  if ($[1] !== disabled || $[2] !== getBounds || $[3] !== index || $[4] !== registerReorderItem) {
+    t1 = () => {
+      if (disabled) {
+        return;
+      }
+      return registerReorderItem(index, getBounds);
+    };
+    t2 = [index, getBounds, registerReorderItem, disabled];
+    $[1] = disabled;
+    $[2] = getBounds;
+    $[3] = index;
+    $[4] = registerReorderItem;
+    $[5] = t1;
+    $[6] = t2;
+  } else {
+    t1 = $[5];
+    t2 = $[6];
+  }
+  useEffect(t1, t2);
+}
+
+export { useReorderItemLayout };

package/components/table/table-const.d.ts

@@ -4,38 +4,6 @@ import type { TableProps } from './table-props';
  * Cast to `Context<TableProps<T>>` in usage place.
  */
 export declare const TablePropsContext: import("react").Context<TableProps<unknown> | null>;
-/**
- * Information about a column reorder animation.
- *
- * Available through {@link ColumnAnimationContext} to allow custom cell
- * renderers to animate reordered columns consistently with the default
- * table renderer.
- */
-export interface ColumnAnimation {
-    /**
-     * Index of the column being animated.
-     */
-    columnIndex: number;
-    /**
-     * Current animation phase.
-     */
-    phase: 'initial' | 'fade-out';
-    /**
-     * CSS class to apply to the animated cell or another element used to
-     * render the animation.
-     *
-     * The class only defines the `background-color` and `transition`
-     * properties.
-     */
-    cellClassName: string;
-}
-/**
- * Provides information about the currently animated column.
- *
- * Use in a custom cell renderer to animate reordered columns
- * consistently with the default table renderer.
- */
-export declare const ColumnAnimationContext: import("react").Context<ColumnAnimation | null>;
 /**
  * When a row only contains unformatted single-line text, it will be exactly of this height.
  */