@jetbrains/ring-ui-built 7.0.125 → 8.0.0-beta.11

package/components/http/http.js

@@ -26,9 +26,6 @@ const CODE = {
 function isRawBody(params) {
   return params.sendRawBody === true;
 }
-function isAbortError(error) {
-  return error instanceof DOMException && error.name === 'AbortError';
-}
 class HTTP {
   baseUrl = null;
   _requestsMeta = new WeakMap();
@@ -126,28 +123,14 @@ class HTTP {
     const contentType = response.headers.get('content-type');
     const isJson = contentType && contentType.indexOf('application/json') !== -1;
     if (!response.ok) {
-      let resJson;
-      try {
-        resJson = await (isJson ? response.json() : response.text());
-      } catch (error) {
-        if (isAbortError(error)) {
-          throw error;
-        }
-      }
+      const resJson = await (isJson ? response.json() : response.text());
       throw new HTTPError(response, resJson);
     }
-    try {
-      const parsedResponse = await (isJson ? response.json() : {
-        data: await response.text()
-      });
-      this._storeRequestMeta(parsedResponse, response);
-      return parsedResponse;
-    } catch (error) {
-      if (isAbortError(error)) {
-        throw error;
-      }
-      return response;
-    }
+    const parsedResponse = await (isJson ? response.json() : {
+      data: await response.text()
+    });
+    this._storeRequestMeta(parsedResponse, response);
+    return parsedResponse;
   }
   fetch = async (url, params = {}) => {
     const {

package/components/i18n/i18n-context.js

@@ -1,4 +1,4 @@
-import { c } from 'react-compiler-runtime';
+import { c } from 'react/compiler-runtime';
 import * as React from 'react';
 import { useEffect } from 'react';
 import { translate, getTranslations, setTranslations } from './i18n.js';
@@ -10,11 +10,11 @@ const I18nContext = /*#__PURE__*/React.createContext({
 });
 const I18nContextHolder = t0 => {
   const $ = c(9);
-  if ($[0] !== "4fad998682170be27811243d88e42f31c504dd0399035c12efa95d91c74b2a8d") {
+  if ($[0] !== "a2018c2c34e104bb25f29b4f924dc1f30d92611151a999bc264d56ee3cdb5c56") {
     for (let $i = 0; $i < 9; $i += 1) {
       $[$i] = Symbol.for("react.memo_cache_sentinel");
     }
-    $[0] = "4fad998682170be27811243d88e42f31c504dd0399035c12efa95d91c74b2a8d";
+    $[0] = "a2018c2c34e104bb25f29b4f924dc1f30d92611151a999bc264d56ee3cdb5c56";
   }
   const {
     children,
@@ -48,7 +48,7 @@ const I18nContextHolder = t0 => {
   }
   let t4;
   if ($[6] !== children || $[7] !== t3) {
-    t4 = /*#__PURE__*/jsx(I18nContext.Provider, {
+    t4 = /*#__PURE__*/jsx(I18nContext, {
       value: t3,
       children: children
     });

package/components/icon/icon-svg.js

@@ -1,7 +1,6 @@
-import 'react-compiler-runtime';
+import 'react/compiler-runtime';
 import 'react';
 import 'classnames';
-import '../global/configuration.js';
 import '../global/memoize.js';
 export { I as default } from '../_helpers/icon-svg.js';
 import 'react/jsx-runtime';

package/components/icon/icon.d.ts

@@ -19,7 +19,6 @@ export interface IconProps extends HTMLAttributes<HTMLElement> {
      * @deprecated Use icons with appropriate intrinsic sizes instead
      */
     width?: number | undefined;
-    loading?: boolean | null | undefined;
     suppressSizeWarning?: boolean | null | undefined;
 }
 export default class Icon extends PureComponent<IconProps> {

package/components/icon/icon.js

@@ -4,8 +4,7 @@ import deprecate from 'util-deprecate';
 import { Color, Size } from './icon.constants.js';
 import { s as styles, I as IconSVG } from '../_helpers/icon-svg.js';
 import { jsx } from 'react/jsx-runtime';
-import 'react-compiler-runtime';
-import '../global/configuration.js';
+import 'react/compiler-runtime';
 import '../global/memoize.js';
 
 const warnSize = deprecate(() => {}, `\`size\`, \`width\` and \`height\` props are not recommended to use in Ring UI \`Icon\` component. The intrinsic sizes of SVG icon (\`width\` and \`height\` SVG attributes) are used instead.
@@ -55,7 +54,6 @@ class Icon extends PureComponent {
       className,
       size,
       color,
-      loading,
       glyph: Glyph,
       width,
       height,
@@ -65,9 +63,7 @@ class Icon extends PureComponent {
     if (!Glyph) {
       return null;
     }
-    const classes = classNames(styles.icon, color && styles[color], {
-      [styles.loading]: loading
-    }, className);
+    const classes = classNames(styles.icon, color && styles[color], className);
     return /*#__PURE__*/jsx("span", {
       "data-test": "ring-icon",
       ...restProps,

package/components/icon/index.js

@@ -4,7 +4,6 @@ import 'react';
 import 'classnames';
 import 'util-deprecate';
 import '../_helpers/icon-svg.js';
-import 'react-compiler-runtime';
-import '../global/configuration.js';
+import 'react/compiler-runtime';
 import '../global/memoize.js';
 import 'react/jsx-runtime';

package/components/input/input.d.ts

@@ -69,7 +69,7 @@ export declare class Input extends PureComponent<InputProps> {
     stretch(el: HTMLElement | null | undefined): void;
     adapt(): void;
     inputRef: (el: HTMLInputElement | HTMLTextAreaElement | null) => void;
-    composedInputRef: import("memoize-one").MemoizedFn<(...refs: (Ref<HTMLInputElement | HTMLTextAreaElement> | undefined)[]) => (value: T | null) => void>;
+    composedInputRef: import("memoize-one").MemoizedFn<(...refs: (Ref<HTMLInputElement | HTMLTextAreaElement> | undefined)[]) => (value: T | null) => () => void>;
     clear: (e: React.MouseEvent<HTMLButtonElement>) => void;
     handleInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
     handleTextareaChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;

package/components/input/input.js

@@ -13,13 +13,13 @@ export { I as Input, S as Size, I as default } from '../_helpers/input.js';
 import 'react/jsx-runtime';
 import '@jetbrains/icons/chevron-down';
 import '@jetbrains/icons/chevron-12px-down';
-import 'util-deprecate';
 import '../link/clickable-link.js';
 import '../_helpers/button.classes.js';
 import '../icon/icon.constants.js';
+import 'util-deprecate';
 import '../_helpers/icon-svg.js';
-import 'react-compiler-runtime';
-import '../global/configuration.js';
+import 'react/compiler-runtime';
 import '../global/memoize.js';
+import '../global/configuration.js';
 import '../i18n/i18n.js';
 import 'memoize-one';

package/components/internal/reorder-animation-context.js

@@ -0,0 +1,159 @@
+import { c } from 'react/compiler-runtime';
+import { createContext, 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';
+
+/** How long to wait for the data to change after {@link expectReorder} is called. */
+const pendingReorderTimeoutMs = 1000;
+const ReorderAnimationContext = /*#__PURE__*/createContext({
+  reorderAnimation: null,
+  expectReorder: () => {}
+});
+function useReorderAnimationContextValue(t0) {
+  const $ = c(20);
+  if ($[0] !== "669a1fb3f5ac9a1cdad72a7fc204b97d9b35bce2182bb3bb8f0bd0acb524b958") {
+    for (let $i = 0; $i < 20; $i += 1) {
+      $[$i] = Symbol.for("react.memo_cache_sentinel");
+    }
+    $[0] = "669a1fb3f5ac9a1cdad72a7fc204b97d9b35bce2182bb3bb8f0bd0acb524b958";
+  }
+  const {
+    noColumnReorderAnimation,
+    noItemReorderAnimation,
+    tableRef,
+    data,
+    columns
+  } = t0;
+  const [reorderAnimation, setReorderAnimation] = useState(null);
+  const pendingReorderRef = useRef(null);
+  let t1;
+  if ($[1] !== columns || $[2] !== data || $[3] !== noColumnReorderAnimation || $[4] !== noItemReorderAnimation) {
+    t1 = function expectReorder(reorderSpec) {
+      const isColumn = reorderSpec.direction === "columns";
+      if (isColumn && noColumnReorderAnimation || !isColumn && noItemReorderAnimation) {
+        return;
+      }
+      if (pendingReorderRef.current) {
+        window.clearTimeout(pendingReorderRef.current.timerId);
+      }
+      const timerId = window.setTimeout(() => {
+        pendingReorderRef.current = null;
+      }, pendingReorderTimeoutMs);
+      pendingReorderRef.current = {
+        ...reorderSpec,
+        timerId,
+        columns,
+        data
+      };
+    };
+    $[1] = columns;
+    $[2] = data;
+    $[3] = noColumnReorderAnimation;
+    $[4] = noItemReorderAnimation;
+    $[5] = t1;
+  } else {
+    t1 = $[5];
+  }
+  const expectReorder = t1;
+  let t2;
+  let t3;
+  if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => () => {
+      if (pendingReorderRef.current) {
+        window.clearTimeout(pendingReorderRef.current.timerId);
+        pendingReorderRef.current = null;
+      }
+    };
+    t3 = [];
+    $[6] = t2;
+    $[7] = t3;
+  } else {
+    t2 = $[6];
+    t3 = $[7];
+  }
+  useEffect(t2, t3);
+  let t4;
+  let t5;
+  if ($[8] !== columns || $[9] !== data || $[10] !== tableRef) {
+    t4 = () => {
+      const table = tableRef.current;
+      const pendingReorder = pendingReorderRef.current;
+      if (!table || !pendingReorder) {
+        return;
+      }
+      const {
+        direction,
+        data: pendingData,
+        columns: pendingColumns
+      } = pendingReorder;
+      const isColumn_0 = direction === "columns";
+      if (isColumn_0 && columns === pendingColumns || !isColumn_0 && data === pendingData) {
+        return;
+      }
+      pendingReorderRef.current = null;
+      const {
+        fromIndex,
+        insertionIndex
+      } = pendingReorder;
+      const index = fromIndex < insertionIndex ? insertionIndex - 1 : insertionIndex;
+      return requestAnimationFrameWithCleanup(() => setReorderAnimation(prev => prev == null ? {
+        direction,
+        index,
+        phase: "initial",
+        className: styles.reorderAnimationInitial
+      } : prev));
+    };
+    t5 = [data, columns, tableRef];
+    $[8] = columns;
+    $[9] = data;
+    $[10] = tableRef;
+    $[11] = t4;
+    $[12] = t5;
+  } else {
+    t4 = $[11];
+    t5 = $[12];
+  }
+  useEffect(t4, t5);
+  let t6;
+  let t7;
+  if ($[13] !== reorderAnimation || $[14] !== tableRef) {
+    t6 = () => {
+      if (reorderAnimation?.phase === "initial") {
+        return requestAnimationFrameWithCleanup(() => setReorderAnimation(prev_0 => prev_0 === reorderAnimation ? {
+          ...prev_0,
+          phase: "fade-out",
+          className: styles.reorderAnimationFadeOut
+        } : prev_0));
+      }
+      if (reorderAnimation?.phase === "fade-out") {
+        const fadeOutMs = parseCssDuration(window.getComputedStyle(tableRef.current).getPropertyValue("--reorder-animation-fade-out-duration"));
+        return setTimeoutWithCleanup(() => setReorderAnimation(prev_1 => prev_1 === reorderAnimation ? null : prev_1), fadeOutMs);
+      }
+    };
+    t7 = [reorderAnimation, tableRef];
+    $[13] = reorderAnimation;
+    $[14] = tableRef;
+    $[15] = t6;
+    $[16] = t7;
+  } else {
+    t6 = $[15];
+    t7 = $[16];
+  }
+  useEffect(t6, t7);
+  let t8;
+  if ($[17] !== expectReorder || $[18] !== reorderAnimation) {
+    t8 = {
+      reorderAnimation,
+      expectReorder
+    };
+    $[17] = expectReorder;
+    $[18] = reorderAnimation;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+  return t8;
+}
+
+export { ReorderAnimationContext, useReorderAnimationContextValue };