@jetbrains/ring-ui-built 7.0.124 → 8.0.0-beta.10

package/components/global/focus-sensor-hoc.js

@@ -1,6 +1,7 @@
 import { Component } from 'react';
 import { createComposedRef } from './compose-refs.js';
 import { jsx } from 'react/jsx-runtime';
+import 'react/compiler-runtime';
 import 'memoize-one';
 
 function focusSensorHOC(ComposedComponent) {

package/components/global/focus-with-temporary-tabindex.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Focuses an element, temporarily adding `tabindex="0"` if necessary.
+ *
+ * If the element does not already have a `tabindex` attribute, one is
+ * added before focusing and automatically removed when the element loses
+ * focus.
+ *
+ * This is useful when implementing roving tabindex patterns on elements
+ * that are not normally focusable.
+ */
+export declare function focusWithTemporaryTabIndex(element: HTMLElement): void;

package/components/global/focus-with-temporary-tabindex.js

@@ -0,0 +1,23 @@
+/**
+ * Focuses an element, temporarily adding `tabindex="0"` if necessary.
+ *
+ * If the element does not already have a `tabindex` attribute, one is
+ * added before focusing and automatically removed when the element loses
+ * focus.
+ *
+ * This is useful when implementing roving tabindex patterns on elements
+ * that are not normally focusable.
+ */
+function focusWithTemporaryTabIndex(element) {
+  if (!element.hasAttribute('tabindex')) {
+    element.tabIndex = 0;
+    function onBlur() {
+      element.removeAttribute('tabindex');
+      element.removeEventListener('blur', onBlur);
+    }
+    element.addEventListener('blur', onBlur);
+  }
+  element.focus();
+}
+
+export { focusWithTemporaryTabIndex };

package/components/global/intersection-observer-context.d.ts

@@ -0,0 +1,46 @@
+import { type RefObject } from 'react';
+/**
+ * Provides access to a shared `IntersectionObserver` instance
+ * via the {@link IntersectionObserverContext} context.
+ *
+ * @see IntersectionObserverContext
+ */
+export interface IntersectionObserverHandle {
+    /**
+     * Starts observing an element.
+     *
+     * Returns a cleanup function that stops observing it.
+     */
+    observe(element: Element, isIntersecting: (isIntersecting: boolean) => void): () => void;
+}
+/**
+ * Multiple components can share a single `IntersectionObserver` instance through this context.
+ *
+ * Usage:
+ *
+ * ```tsx
+ * <IntersectionObserverContext value={useIntersectionObserverHandle()}>
+ *   <YourComponent />
+ * </IntersectionObserverContext>
+ *
+ * function YourComponent() {
+ *   // Contains the current isIntersecting value
+ *   const isIntersecting = useIsIntersecting(elementRef);
+ *
+ *   // Or, to manually work with the IntersectionObserverHandle:
+ *   const handle = use(IntersectionObserverContext);
+ *   useEffect(() => {
+ *     return handle.observe(elementRef.current, isIntersecting => { ... })
+ *   })
+ * }
+ * ```
+ */
+export declare const IntersectionObserverContext: import("react").Context<IntersectionObserverHandle>;
+/**
+ * Creates an IntersectionObserverHandle suitable for {@link IntersectionObserverContext}.
+ */
+export declare function useIntersectionObserverHandle(rootRef?: RefObject<HTMLElement | null>, rootMargin?: number, scrollMargin?: number): IntersectionObserverHandle;
+/**
+ * Returns whether the referenced element is currently intersecting.
+ */
+export declare function useIsIntersecting(elementRef: RefObject<Element | null>): boolean;

package/components/global/intersection-observer-context.js

@@ -0,0 +1,138 @@
+import { c } from 'react/compiler-runtime';
+import { useState, useEffect, use, createContext } from 'react';
+
+/**
+ * @internal
+ */
+const noopIntersectionObserverHandle = {
+  observe: () => () => {}
+};
+/**
+ * Multiple components can share a single `IntersectionObserver` instance through this context.
+ *
+ * Usage:
+ *
+ * ```tsx
+ * <IntersectionObserverContext value={useIntersectionObserverHandle()}>
+ *   <YourComponent />
+ * </IntersectionObserverContext>
+ *
+ * function YourComponent() {
+ *   // Contains the current isIntersecting value
+ *   const isIntersecting = useIsIntersecting(elementRef);
+ *
+ *   // Or, to manually work with the IntersectionObserverHandle:
+ *   const handle = use(IntersectionObserverContext);
+ *   useEffect(() => {
+ *     return handle.observe(elementRef.current, isIntersecting => { ... })
+ *   })
+ * }
+ * ```
+ */
+const IntersectionObserverContext = /*#__PURE__*/createContext(noopIntersectionObserverHandle);
+/**
+ * Creates an IntersectionObserverHandle suitable for {@link IntersectionObserverContext}.
+ */
+function useIntersectionObserverHandle(rootRef, rootMargin, scrollMargin) {
+  const $ = c(6);
+  if ($[0] !== "22e72f21c77e0579b51b95d0c9cf49c7e0027190e5186ad64aa7f2054bb7eb35") {
+    for (let $i = 0; $i < 6; $i += 1) {
+      $[$i] = Symbol.for("react.memo_cache_sentinel");
+    }
+    $[0] = "22e72f21c77e0579b51b95d0c9cf49c7e0027190e5186ad64aa7f2054bb7eb35";
+  }
+  const [handle, setHandle] = useState(noopIntersectionObserverHandle);
+  let t0;
+  let t1;
+  if ($[1] !== rootMargin || $[2] !== rootRef || $[3] !== scrollMargin) {
+    t0 = () => {
+      const root = rootRef?.current;
+      const callbacksByElement = new Map();
+      const observer = new IntersectionObserver(entries => {
+        for (const entry of entries) {
+          const callbacks = callbacksByElement.get(entry.target);
+          callbacks?.forEach(cb => cb(entry.isIntersecting));
+        }
+      }, {
+        root,
+        rootMargin: rootMargin != null ? `${rootMargin}px` : undefined,
+        scrollMargin: scrollMargin != null ? `${scrollMargin}px` : undefined
+      });
+      setHandle({
+        observe(element, onChange) {
+          if (!callbacksByElement.has(element)) {
+            callbacksByElement.set(element, []);
+            observer.observe(element);
+          }
+          callbacksByElement.get(element).push(onChange);
+          return () => {
+            const callbacks_0 = callbacksByElement.get(element);
+            if (!callbacks_0) {
+              return;
+            }
+            const index = callbacks_0.indexOf(onChange);
+            if (index !== -1) {
+              callbacks_0.splice(index, 1);
+            }
+            if (!callbacks_0.length) {
+              callbacksByElement.delete(element);
+              observer.unobserve(element);
+            }
+          };
+        }
+      });
+      return () => {
+        observer.disconnect();
+        setHandle(noopIntersectionObserverHandle);
+      };
+    };
+    t1 = [rootRef, rootMargin, scrollMargin];
+    $[1] = rootMargin;
+    $[2] = rootRef;
+    $[3] = scrollMargin;
+    $[4] = t0;
+    $[5] = t1;
+  } else {
+    t0 = $[4];
+    t1 = $[5];
+  }
+  useEffect(t0, t1);
+  return handle;
+}
+/**
+ * Returns whether the referenced element is currently intersecting.
+ */
+function useIsIntersecting(elementRef) {
+  const $ = c(5);
+  if ($[0] !== "22e72f21c77e0579b51b95d0c9cf49c7e0027190e5186ad64aa7f2054bb7eb35") {
+    for (let $i = 0; $i < 5; $i += 1) {
+      $[$i] = Symbol.for("react.memo_cache_sentinel");
+    }
+    $[0] = "22e72f21c77e0579b51b95d0c9cf49c7e0027190e5186ad64aa7f2054bb7eb35";
+  }
+  const handle = use(IntersectionObserverContext);
+  const [isIntersecting, setIsIntersecting] = useState(false);
+  let t0;
+  let t1;
+  if ($[1] !== elementRef || $[2] !== handle) {
+    t0 = () => {
+      const element = elementRef.current;
+      if (!element) {
+        return;
+      }
+      return handle.observe(element, setIsIntersecting);
+    };
+    t1 = [handle, elementRef];
+    $[1] = elementRef;
+    $[2] = handle;
+    $[3] = t0;
+    $[4] = t1;
+  } else {
+    t0 = $[3];
+    t1 = $[4];
+  }
+  useEffect(t0, t1);
+  return isIntersecting;
+}
+
+export { IntersectionObserverContext, useIntersectionObserverHandle, useIsIntersecting };

package/components/global/is-within-interactive-element.d.ts

@@ -0,0 +1,6 @@
+/**
+ * If this function returns `false`, the event may be interpreted as a click
+ * or tap on a "empty space" rather than on an interactive element such as
+ * a button or a link.
+ */
+export declare function isWithinInteractiveElement(target: EventTarget | null): boolean;

package/components/global/is-within-interactive-element.js

@@ -0,0 +1,11 @@
+const interactiveSelector = ['a', 'button', 'details', 'input', 'label', 'option', 'select', 'summary', 'textarea', '[contenteditable]', '[role="button"]', '[role="checkbox"]', '[role="link"]', '[role="radio"]', '[role="switch"]', '[role="tab"]'].join();
+/**
+ * If this function returns `false`, the event may be interpreted as a click
+ * or tap on a "empty space" rather than on an interactive element such as
+ * a button or a link.
+ */
+function isWithinInteractiveElement(target) {
+  return target instanceof Element && target.closest(interactiveSelector) != null;
+}
+
+export { isWithinInteractiveElement };

package/components/global/is-within-navigable-element.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Returns whether the event target is within an element that is expected to
+ * handle keyboard navigation itself, so container-level keyboard shortcuts
+ * should generally be ignored.
+ */
+export declare function isWithinNavigableElement(target: EventTarget | null): boolean;

package/components/global/is-within-navigable-element.js

@@ -0,0 +1,11 @@
+const navigableSelector = ['input:not([type="button"]):not([type="checkbox"]):not([type="color"]):not([type="file"]):not([type="hidden"]):not([type="image"]):not([type="reset"]):not([type="submit"])', 'textarea', 'select', '[contenteditable]', '[role="combobox"]', '[role="grid"]', '[role="listbox"]', '[role="menu"]', '[role="menubar"]', '[role="radiogroup"]', '[role="searchbox"]', '[role="slider"]', '[role="spinbutton"]', '[role="tablist"]', '[role="textbox"]', '[role="tree"]', '[role="treegrid"]'].join();
+/**
+ * Returns whether the event target is within an element that is expected to
+ * handle keyboard navigation itself, so container-level keyboard shortcuts
+ * should generally be ignored.
+ */
+function isWithinNavigableElement(target) {
+  return target instanceof Element && target.closest(navigableSelector) != null;
+}
+
+export { isWithinNavigableElement };

package/components/global/parse-css-duration.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Parses a CSS duration string (e.g., "500ms", "2s") and returns the duration in milliseconds.
+ * Returns the `defaultVal` if the input string is not a valid CSS duration.
+ */
+export declare function parseCssDuration(duration: string, defaultVal?: number): number;

package/components/global/parse-css-duration.js

@@ -0,0 +1,14 @@
+/**
+ * Parses a CSS duration string (e.g., "500ms", "2s") and returns the duration in milliseconds.
+ * Returns the `defaultVal` if the input string is not a valid CSS duration.
+ */
+function parseCssDuration(duration, defaultVal = 0) {
+  const match = duration.match(/(\d+(\.\d+)?)(s|ms)/);
+  if (!match) return defaultVal;
+  const value = parseFloat(match[1]);
+  const unit = match[3];
+  // eslint-disable-next-line no-magic-numbers
+  return unit === 's' ? value * 1000 : value;
+}
+
+export { parseCssDuration };

package/components/global/rerender-hoc.d.ts

@@ -1,4 +1,4 @@
-import { Component, type PropsWithoutRef } from 'react';
+import { Component, type Ref, type PropsWithoutRef } from 'react';
 export interface RerenderableComponent<P, S> extends Component<P, S> {
     node?: HTMLElement | null;
 }
@@ -7,4 +7,6 @@ export interface RerenderableComponentClass<P, S> {
 }
 export default function rerenderHOC<P extends {}, C extends Component<P, unknown>>(ComposedComponent: {
     new (props: P): C;
-}): import("react").ForwardRefExoticComponent<PropsWithoutRef<P> & import("react").RefAttributes<C>>;
+}): ({ ref, ...props }: PropsWithoutRef<P> & {
+    ref?: Ref<C>;
+}) => import("react").JSX.Element;

package/components/global/rerender-hoc.js

@@ -1,7 +1,7 @@
-import { c } from 'react-compiler-runtime';
-import { forwardRef, Component } from 'react';
+import { Component } from 'react';
 import { createComposedRef } from './compose-refs.js';
 import { jsx } from 'react/jsx-runtime';
+import 'react/compiler-runtime';
 import 'memoize-one';
 
 function rerenderHOC(ComposedComponent) {
@@ -19,28 +19,15 @@ function rerenderHOC(ComposedComponent) {
       });
     }
   }
-  return /*#__PURE__*/forwardRef(function RerendererForwardRef(props, ref) {
-    const $ = c(4);
-    if ($[0] !== "ac36aeaece54c7d00df3e23ff1d0deb675c0bc1bf4659806ffc7c8497029aeb7") {
-      for (let $i = 0; $i < 4; $i += 1) {
-        $[$i] = Symbol.for("react.memo_cache_sentinel");
-      }
-      $[0] = "ac36aeaece54c7d00df3e23ff1d0deb675c0bc1bf4659806ffc7c8497029aeb7";
-    }
-    let t0;
-    if ($[1] !== props || $[2] !== ref) {
-      t0 = /*#__PURE__*/jsx(Rerenderer, {
-        props: props,
-        forwardedRef: ref
-      });
-      $[1] = props;
-      $[2] = ref;
-      $[3] = t0;
-    } else {
-      t0 = $[3];
-    }
-    return t0;
-  });
+  return function RerendererForwardRef({
+    ref,
+    ...props
+  }) {
+    return /*#__PURE__*/jsx(Rerenderer, {
+      props: props,
+      forwardedRef: ref !== null && ref !== void 0 ? ref : null
+    });
+  };
 }
 
 export { rerenderHOC as default };

package/components/global/schedule-with-cleanup.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Schedules a timeout and returns a function that cancels it.
+ *
+ * Useful from React effects.
+ */
+export declare function setTimeoutWithCleanup(callback: () => void, delay?: number): () => void;
+/**
+ * Schedules an animation frame and returns a function that cancels it.
+ *
+ * Useful from React effects.
+ */
+export declare function requestAnimationFrameWithCleanup(callback: () => void): () => void;

package/components/global/schedule-with-cleanup.js

@@ -0,0 +1,36 @@
+/**
+ * Schedules a timeout and returns a function that cancels it.
+ *
+ * Useful from React effects.
+ */
+function setTimeoutWithCleanup(callback, delay = 0) {
+  let timerId = window.setTimeout(() => {
+    callback();
+    timerId = null;
+  }, delay);
+  return () => {
+    if (timerId != null) {
+      window.clearTimeout(timerId);
+      timerId = null;
+    }
+  };
+}
+/**
+ * Schedules an animation frame and returns a function that cancels it.
+ *
+ * Useful from React effects.
+ */
+function requestAnimationFrameWithCleanup(callback) {
+  let rafId = requestAnimationFrame(() => {
+    callback();
+    rafId = null;
+  });
+  return () => {
+    if (rafId != null) {
+      cancelAnimationFrame(rafId);
+      rafId = null;
+    }
+  };
+}
+
+export { requestAnimationFrameWithCleanup, setTimeoutWithCleanup };

package/components/{table/selection.d.ts → global/table-selection.d.ts}

@@ -4,7 +4,7 @@
 export interface SelectionItem {
     id: string | number;
 }
-export interface TableSelectionConfig<T extends object> {
+export interface TableSelectionConfig<T> {
     data?: readonly T[] | undefined;
     selected?: Set<T> | undefined;
     focused?: T | null | undefined;
@@ -17,7 +17,7 @@ export interface CloneWithConfig<T> {
     selected?: Set<T> | readonly T[] | null | undefined;
     focused?: T | null | undefined;
 }
-export default class Selection<T extends object> {
+export default class TableSelection<T> {
     protected _rawData: readonly T[];
     protected _getChildren: (item: T) => readonly T[];
     protected _data: Set<T>;
@@ -28,19 +28,19 @@ export default class Selection<T extends object> {
     constructor({ data, selected, focused, getKey, getChildren, isItemSelectable, }?: TableSelectionConfig<T>);
     protected _buildData(data: readonly T[] | null | undefined): Set<T>;
     protected _buildSelected(data: Set<T>, selected: Set<T>): Set<T>;
-    cloneWith({ data, selected, focused }: CloneWithConfig<T>): Selection<T>;
-    focus(value: T | null | undefined): Selection<T>;
-    moveUp(): Selection<T> | undefined;
-    moveDown(): Selection<T> | undefined;
-    moveStart(): Selection<T> | undefined;
-    moveEnd(): Selection<T> | undefined;
-    select(value?: T | null): Selection<T>;
-    deselect(value?: T | null): Selection<T>;
-    toggleSelection(value?: T | null): Selection<T>;
-    selectAll(): Selection<T>;
-    resetFocus(): Selection<T>;
-    resetSelection(): Selection<T>;
-    reset(): Selection<T>;
+    cloneWith({ data, selected, focused }: CloneWithConfig<T>): TableSelection<T>;
+    focus(value: T | null | undefined): TableSelection<T>;
+    moveUp(): TableSelection<T> | undefined;
+    moveDown(): TableSelection<T> | undefined;
+    moveStart(): TableSelection<T> | undefined;
+    moveEnd(): TableSelection<T> | undefined;
+    select(value?: T | null): TableSelection<T>;
+    deselect(value?: T | null): TableSelection<T>;
+    toggleSelection(value?: T | null): TableSelection<T>;
+    selectAll(): TableSelection<T>;
+    resetFocus(): TableSelection<T>;
+    resetSelection(): TableSelection<T>;
+    reset(): TableSelection<T>;
     isFocused(value: T | null): boolean;
     isSelected(value: T | null): boolean;
     getFocused(): T | null;

package/components/{table/selection.js → global/table-selection.js}

@@ -1,7 +1,7 @@
 /**
  * @deprecated SelectionItem is deprecated. Use your own item type and provide a `getKey` function instead if there is no `id` identifier in your item type.
  */
-let Selection$1 = class Selection {
+class TableSelection {
   _rawData;
   _getChildren;
   _data;
@@ -15,11 +15,11 @@ let Selection$1 = class Selection {
     focused = null,
     getKey = item => {
       // Default behavior stays backward compatible: use item's "id" if present
-      if ('id' in item) {
+      if (item && typeof item === 'object' && 'id' in item) {
         return item.id;
       }
       // If there's no id provided on item and no getKey supplied, fail fast with a clear message
-      throw new Error('Selection: getKey is required when items have no "id" property');
+      throw new Error('TableSelection: getKey is required when items have no "id" property');
     },
     getChildren = () => [],
     isItemSelectable = () => true
@@ -185,6 +185,6 @@ let Selection$1 = class Selection {
     }
     return new Set();
   }
-};
+}
 
-export { Selection$1 as default };
+export { TableSelection as default };

package/components/global/theme.d.ts

@@ -1,4 +1,4 @@
-import { type HTMLAttributes, type ReactElement, type FunctionComponent } from 'react';
+import { type HTMLAttributes, type Ref, type ReactElement, type FunctionComponent } from 'react';
 declare enum Theme {
     AUTO = "auto",
     LIGHT = "light",
@@ -18,11 +18,12 @@ export interface WithThemeClassesProps {
 export declare function WithThemeClasses({ theme, children }: WithThemeClassesProps): ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export declare function applyTheme(theme: Theme.DARK | Theme.LIGHT, container: HTMLElement): void;
 type WrapperType = FunctionComponent<HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
-export interface ThemeProviderProps extends HTMLAttributes<HTMLDivElement> {
+export interface ThemeProviderProps extends HTMLAttributes<HTMLElement> {
+    ref?: Ref<HTMLElement>;
     theme?: Theme;
     passToPopups?: boolean;
     WrapperComponent?: WrapperType;
     target?: HTMLElement;
 }
-export declare const ThemeProvider: import("react").ForwardRefExoticComponent<ThemeProviderProps & import("react").RefAttributes<HTMLElement>>;
+export declare function ThemeProvider({ ref, ...props }: ThemeProviderProps): import("react").JSX.Element;
 export default Theme;

package/components/global/theme.js

@@ -1,4 +1,4 @@
-import 'react-compiler-runtime';
+import 'react/compiler-runtime';
 import 'react';
 import 'classnames';
 export { G as GLOBAL_DARK_CLASS_NAME, b as ThemeContext, a as ThemeProvider, W as WithThemeClasses, c as applyTheme, T as default, u as useTheme, e as useThemeClasses } from '../_helpers/theme.js';

package/components/global/variables.interface.d.ts

@@ -19,11 +19,9 @@ export interface RingCSSProperties {
     '--ring-popup-border-color'?: Property.BorderColor;
     '--ring-popup-shadow-color'?: Property.Color;
     '--ring-message-shadow-color'?: Property.Color;
-    '--ring-pinned-shadow-color'?: Property.Color;
     '--ring-button-danger-hover-color'?: Property.Color;
     '--ring-button-primary-border-color'?: Property.Color;
     '--ring-search-color'?: Property.Color;
-    '--ring-hint-color'?: Property.Color;
     '--ring-link-color'?: Property.Color;
     '--ring-link-hover-color'?: Property.Color;
     '--ring-error-color'?: Property.Color;
@@ -49,8 +47,6 @@ export interface RingCSSProperties {
     '--ring-disabled-background-color'?: Property.BackgroundColor;
     '--ring-disabled-selected-background-color'?: Property.BackgroundColor;
     '--ring-button-danger-active-color'?: Property.BackgroundColor;
-    '--ring-button-loader-background'?: Property.BackgroundColor;
-    '--ring-button-primary-background-color'?: Property.BackgroundColor;
     '--ring-code-background-color'?: Property.BackgroundColor;
     '--ring-code-color'?: Property.Color;
     '--ring-code-comment-color'?: Property.Color;

package/components/header/header-icon.js

@@ -5,15 +5,15 @@ import { s as styles } from '../_helpers/header.js';
 import { jsx } from 'react/jsx-runtime';
 import '@jetbrains/icons/chevron-down';
 import '@jetbrains/icons/chevron-12px-down';
-import 'util-deprecate';
 import '../icon/icon.js';
+import 'util-deprecate';
 import '../icon/icon.constants.js';
 import '../_helpers/icon-svg.js';
-import 'react-compiler-runtime';
-import '../global/configuration.js';
+import 'react/compiler-runtime';
 import '../global/memoize.js';
 import '../link/clickable-link.js';
 import '../global/controls-height.js';
+import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 
 class HeaderIcon extends Component {

package/components/header/header.js

@@ -10,21 +10,20 @@ export { default as Profile } from './profile.js';
 export { default as SmartProfile } from './smart-profile.js';
 export { default as Services } from './services.js';
 export { default as SmartServices } from './smart-services.js';
-import 'react-compiler-runtime';
+import 'react/compiler-runtime';
 import '../icon/icon.js';
 import 'util-deprecate';
 import '../icon/icon.constants.js';
 import '../_helpers/icon-svg.js';
-import '../global/configuration.js';
 import '../global/memoize.js';
 import '../button/button.js';
 import '@jetbrains/icons/chevron-down';
 import '@jetbrains/icons/chevron-12px-down';
 import '../link/clickable-link.js';
 import '../global/controls-height.js';
+import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../avatar/avatar.js';
-import 'core-js/modules/es.array.includes.js';
 import '../global/url.js';
 import '../global/dom.js';
 import '../avatar/fallback-avatar.js';
@@ -33,6 +32,7 @@ import '../avatar/avatar-size.js';
 import '../_helpers/avatar-info.js';
 import '../dropdown-menu/dropdown-menu.js';
 import '../list/list.js';
+import 'core-js/modules/es.array.includes.js';
 import 'react-virtualized/dist/es/List';
 import 'react-virtualized/dist/es/AutoSizer';
 import 'react-virtualized/dist/es/WindowScroller';

package/components/header/links.js

@@ -1,4 +1,4 @@
-import { c } from 'react-compiler-runtime';
+import { c } from 'react/compiler-runtime';
 import classNames from 'classnames';
 import ScrollableSection from '../scrollable-section/scrollable-section.js';
 import { s as styles } from '../_helpers/header.js';

package/components/header/logo.js

@@ -6,8 +6,7 @@ import { jsx } from 'react/jsx-runtime';
 import { Size } from '../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';
 
 class Logo extends PureComponent {

package/components/header/profile.js

@@ -9,25 +9,25 @@ import { isTruthy } from '../global/typescript-utils.js';
 import { s as styles } from '../_helpers/header.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Size } from '../avatar/avatar-size.js';
-import 'core-js/modules/es.array.includes.js';
-import 'util-deprecate';
 import '../global/url.js';
 import '../global/dom.js';
-import '../global/memoize.js';
 import '../avatar/fallback-avatar.js';
-import 'react-compiler-runtime';
+import 'react/compiler-runtime';
 import '../global/get-uid.js';
 import '../_helpers/avatar-info.js';
 import '@jetbrains/icons/chevron-down';
 import '@jetbrains/icons/chevron-12px-down';
 import '../icon/icon.js';
+import 'util-deprecate';
 import '../icon/icon.constants.js';
 import '../_helpers/icon-svg.js';
-import '../global/configuration.js';
+import '../global/memoize.js';
 import '../link/clickable-link.js';
 import '../global/controls-height.js';
+import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../list/list.js';
+import 'core-js/modules/es.array.includes.js';
 import 'react-virtualized/dist/es/List';
 import 'react-virtualized/dist/es/AutoSizer';
 import 'react-virtualized/dist/es/WindowScroller';