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

package/components/input/input.js

@@ -18,7 +18,7 @@ import '../link/clickable-link.js';
 import '../_helpers/button.classes.js';
 import '../icon/icon.constants.js';
 import '../_helpers/icon-svg.js';
-import 'react-compiler-runtime';
+import 'react/compiler-runtime';
 import '../global/memoize.js';
 import '../global/configuration.js';
 import '../i18n/i18n.js';

package/components/internal/column-animation.js

@@ -0,0 +1,133 @@
+import { c } from 'react/compiler-runtime';
+import { useState, useRef, useEffect } from 'react';
+import { parseCssDuration } from '../global/parse-css-duration.js';
+import { requestAnimationFrameWithCleanup, setTimeoutWithCleanup } from '../global/schedule-with-cleanup.js';
+import { s as styles } from '../_helpers/table.js';
+
+const reorderExpectationTimeout = 1000;
+function useColumnAnimation(t0) {
+  const $ = c(17);
+  if ($[0] !== "3136e2b54bc66931abc9531e502b09d39738e25670fb1469ab6b7e91fc803e97") {
+    for (let $i = 0; $i < 17; $i += 1) {
+      $[$i] = Symbol.for("react.memo_cache_sentinel");
+    }
+    $[0] = "3136e2b54bc66931abc9531e502b09d39738e25670fb1469ab6b7e91fc803e97";
+  }
+  const {
+    disabled,
+    tableRef,
+    columns
+  } = t0;
+  const [columnAnimation, setColumnAnimation] = useState(null);
+  const pendingColumnReorder = useRef(null);
+  let t1;
+  if ($[1] !== columns || $[2] !== disabled) {
+    t1 = reorderSpec => {
+      if (disabled) {
+        return;
+      }
+      const timerId = window.setTimeout(() => {
+        pendingColumnReorder.current = null;
+      }, reorderExpectationTimeout);
+      pendingColumnReorder.current = {
+        ...reorderSpec,
+        timerId,
+        columns
+      };
+    };
+    $[1] = columns;
+    $[2] = disabled;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  const expectColumnReorder = t1;
+  let t2;
+  let t3;
+  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => () => {
+      if (pendingColumnReorder.current) {
+        window.clearTimeout(pendingColumnReorder.current.timerId);
+        pendingColumnReorder.current = null;
+      }
+    };
+    t3 = [];
+    $[4] = t2;
+    $[5] = t3;
+  } else {
+    t2 = $[4];
+    t3 = $[5];
+  }
+  useEffect(t2, t3);
+  let t4;
+  let t5;
+  if ($[6] !== columns || $[7] !== tableRef) {
+    t4 = () => {
+      const table = tableRef.current;
+      if (!table || !pendingColumnReorder.current || columns === pendingColumnReorder.current.columns) {
+        return;
+      }
+      const {
+        fromIndex,
+        insertionIndex
+      } = pendingColumnReorder.current;
+      pendingColumnReorder.current = null;
+      const columnIndex = fromIndex < insertionIndex ? insertionIndex - 1 : insertionIndex;
+      return requestAnimationFrameWithCleanup(() => setColumnAnimation(prev => prev == null ? {
+        columnIndex,
+        phase: "initial",
+        cellClassName: styles.animatedColumnInitial
+      } : prev));
+    };
+    t5 = [columns, tableRef];
+    $[6] = columns;
+    $[7] = tableRef;
+    $[8] = t4;
+    $[9] = t5;
+  } else {
+    t4 = $[8];
+    t5 = $[9];
+  }
+  useEffect(t4, t5);
+  let t6;
+  let t7;
+  if ($[10] !== columnAnimation || $[11] !== tableRef) {
+    t6 = () => {
+      if (columnAnimation?.phase === "initial") {
+        return requestAnimationFrameWithCleanup(() => setColumnAnimation(prev_0 => prev_0 === columnAnimation ? {
+          ...prev_0,
+          phase: "fade-out",
+          cellClassName: styles.animatedColumnFadeOut
+        } : prev_0));
+      }
+      if (columnAnimation?.phase === "fade-out") {
+        const fadeOutMs = parseCssDuration(window.getComputedStyle(tableRef.current).getPropertyValue("--animated-column-fade-out-duration"));
+        return setTimeoutWithCleanup(() => setColumnAnimation(prev_1 => prev_1 === columnAnimation ? null : prev_1), fadeOutMs);
+      }
+    };
+    t7 = [columnAnimation, tableRef];
+    $[10] = columnAnimation;
+    $[11] = tableRef;
+    $[12] = t6;
+    $[13] = t7;
+  } else {
+    t6 = $[12];
+    t7 = $[13];
+  }
+  useEffect(t6, t7);
+  let t8;
+  if ($[14] !== columnAnimation || $[15] !== expectColumnReorder) {
+    t8 = {
+      columnAnimation,
+      expectColumnReorder
+    };
+    $[14] = columnAnimation;
+    $[15] = expectColumnReorder;
+    $[16] = t8;
+  } else {
+    t8 = $[16];
+  }
+  return t8;
+}
+
+export { useColumnAnimation };