@jetbrains/ring-ui 7.0.61 → 7.0.63

package/components/error-message/error-message.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .errorMessage {
   display: flex;

package/components/error-message/error-message.d.ts

@@ -1,5 +1,5 @@
-import { Component, ReactNode } from 'react';
-import { IconType } from '../icon/icon';
+import { Component, type ReactNode } from 'react';
+import { type IconType } from '../icon/icon';
 export interface ErrorMessageProps {
     children?: ReactNode;
     icon?: string | IconType | null | undefined;

package/components/error-message/error-message.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Component } from 'react';
 import classNames from 'classnames';
 import Icon from '../icon/icon';
-import { Size } from '../icon/icon__constants';
+import { Size } from '../icon/icon.constants';
 import dataTests from '../global/data-tests';
 import styles from './error-message.css';
 /**
@@ -12,6 +12,6 @@ export default class ErrorMessage extends Component {
     render() {
         const { className, icon, code, message, description, children, 'data-test': dataTest } = this.props;
         const classes = classNames(styles.errorMessage, className);
-        return (_jsxs("div", { className: classes, "data-test": dataTests('ring-error-message', dataTest), children: [icon && _jsx(Icon, { className: styles.icon, glyph: icon, size: Size.Size64, suppressSizeWarning: true }), _jsxs("div", { className: styles.content, children: [_jsxs("div", { className: styles.title, "data-test": "ring-error-message-title", children: [code && `${code}:`, " ", message] }), description && _jsx("div", { className: styles.description, children: description }), children] })] }));
+        return (_jsxs("div", { className: classes, "data-test": dataTests('ring-error-message', dataTest), children: [icon && _jsx(Icon, { className: styles.icon, glyph: icon, size: Size.Size64, suppressSizeWarning: true }), _jsxs("div", { className: styles.content, children: [_jsxs("div", { className: styles.title, "data-test": 'ring-error-message-title', children: [code && `${code}:`, " ", message] }), description && _jsx("div", { className: styles.description, children: description }), children] })] }));
     }
 }

package/components/error-page/error-page.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 /*
   Using a pseudo-element rather than the element itself to prevent
@@ -15,10 +15,10 @@
   width: 100%;
   height: 100%;
 
-  content: "";
+  content: '';
 }
 
 .enabled::before {
   opacity: 0.06;
-  background: url("error-page.gif");
+  background: url('error-page.gif');
 }

package/components/footer/footer.css

@@ -1,7 +1,7 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .footer {
-  composes: font from "../global/global.css";
+  composes: font from '../global/global.css';
 
   position: relative;
 

package/components/footer/footer.d.ts

@@ -1,7 +1,7 @@
 /**
  * @name Footer
  */
-import { HTMLAttributeAnchorTarget, ReactElement } from 'react';
+import { type HTMLAttributeAnchorTarget, type ReactElement } from 'react';
 /**
  * Return copyright string
  * @param year {int}

package/components/footer/footer.js

@@ -62,6 +62,6 @@ const Footer = memo(function Footer({ floating, className, left, center, right }
     const classes = classNames(styles.footer, className, {
         [styles.footerFloating]: floating,
     });
-    return (_jsx("footer", { className: classes, "data-test": "ring-footer", children: [content(left, 'left'), content(center, 'center'), content(right, 'right')] }));
+    return (_jsx("footer", { className: classes, "data-test": 'ring-footer', children: [content(left, 'left'), content(center, 'center'), content(right, 'right')] }));
 });
 export default Footer;

package/components/form/form.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 /**
  * @name Form
@@ -94,7 +94,7 @@
   display: block;
   clear: both;
 
-  content: "";
+  content: '';
 }
 
 :global(.ring-form__group_united) {
@@ -165,7 +165,7 @@
 
   height: calc(var(--ring-unit) * 3);
 
-  content: "";
+  content: '';
   vertical-align: middle;
 }
 

package/components/global/compose-refs.d.ts

@@ -0,0 +1,2 @@
+import { type Ref } from 'react';
+export declare function createComposedRef<T>(): import("memoize-one").MemoizedFn<(...refs: (Ref<T> | undefined)[]) => (value: T | null) => void>;

package/components/global/compose-refs.js

@@ -0,0 +1,14 @@
+import memoizeOne from 'memoize-one';
+function composeRefs(...refs) {
+    return (value) => refs.forEach(ref => {
+        if (typeof ref === 'function') {
+            ref(value);
+        }
+        else if (ref) {
+            ref.current = value;
+        }
+    });
+}
+export function createComposedRef() {
+    return memoizeOne((composeRefs));
+}

package/components/global/composeRefs.d.ts

@@ -1,2 +1,6 @@
-import { Ref } from 'react';
-export declare function createComposedRef<T>(): import("memoize-one").MemoizedFn<(...refs: (Ref<T> | undefined)[]) => (value: T | null) => void>;
+import { createComposedRef as _createComposedRef } from './compose-refs';
+/**
+ * @deprecated Use createComposedRef from './compose-refs' instead
+ */
+declare const createComposedRef: typeof _createComposedRef;
+export { createComposedRef };

package/components/global/composeRefs.js

@@ -1,14 +1,7 @@
-import memoizeOne from 'memoize-one';
-function composeRefs(...refs) {
-    return (value) => refs.forEach(ref => {
-        if (typeof ref === 'function') {
-            ref(value);
-        }
-        else if (ref != null) {
-            ref.current = value;
-        }
-    });
-}
-export function createComposedRef() {
-    return memoizeOne((composeRefs));
-}
+/* eslint-disable unicorn/filename-case */
+import { createComposedRef as _createComposedRef } from './compose-refs';
+/**
+ * @deprecated Use createComposedRef from './compose-refs' instead
+ */
+const createComposedRef = _createComposedRef;
+export { createComposedRef };

package/components/global/create-stateful-context.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 type Update<T> = (value: T) => void;
 export interface ProviderProps {
     children: ReactNode;

package/components/global/dom.d.ts

@@ -1,7 +1,7 @@
 /**
  * @name DOM
  */
-import { SyntheticEvent } from 'react';
+import { type SyntheticEvent } from 'react';
 import type { PropertiesHyphen } from 'csstype';
 export declare const getStyles: ((elt: Element, pseudoElt?: string | null) => CSSStyleDeclaration) & typeof getComputedStyle;
 export declare function isMounted(node: Node | Range | null | undefined): boolean;

package/components/global/dom.js

@@ -10,13 +10,11 @@ export function isMounted(node) {
 }
 const rectStub = { top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 };
 export function getRect(node) {
-    if (node instanceof Range || (node != null && isMounted(node))) {
+    if (node instanceof Range || (node && isMounted(node))) {
         const { top, right, bottom, left, width, height } = node.getBoundingClientRect();
         return { top, right, bottom, left, width, height };
     }
-    else {
-        return Object.assign({}, rectStub);
-    }
+    return Object.assign({}, rectStub);
 }
 export function getPixelRatio() {
     return 'devicePixelRatio' in window ? window.devicePixelRatio : 1;

package/components/global/focus-sensor-hoc.d.ts

@@ -1,4 +1,4 @@
-import { ComponentClass, Ref } from 'react';
+import { type ComponentClass, type Ref } from 'react';
 export interface FocusSensorOuterProps<T extends HTMLElement> {
     focused?: boolean | undefined;
     autofocus?: boolean | undefined;

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

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Component } from 'react';
-import { createComposedRef } from './composeRefs';
+import { createComposedRef } from './compose-refs';
 export default function focusSensorHOC(ComposedComponent) {
     class FocusSensor extends Component {
         state = {
@@ -9,7 +9,7 @@ export default function focusSensorHOC(ComposedComponent) {
         componentDidMount() {
             const { props: { autofocus, scrollOnTableFocus }, node, } = this;
             node?.setAttribute('tabindex', '0');
-            if (node != null) {
+            if (node) {
                 node.style.outline = 'none';
             }
             document.addEventListener('focus', this.onFocusCapture, true);

package/components/global/fuzzy-highlight.d.ts

@@ -1,8 +1,8 @@
 /** https://github.com/bevacqua/fuzzysearch + highlighting with Markdown */
-type Match = {
+interface Match {
     from: number;
     to: number;
-};
+}
 export default function fuzzyHighlight(needle: string, haystack: string, caseSensitive?: boolean): {
     matched: boolean;
     matches: Match[];

package/components/global/get-event-key.d.ts

@@ -1,2 +1,2 @@
-import * as React from 'react';
+import type * as React from 'react';
 export default function getEventKey(nativeEvent: KeyboardEvent | React.KeyboardEvent): string;

package/components/global/global.css

@@ -5,7 +5,7 @@
     display: block;
     clear: both;
 
-    content: "";
+    content: '';
   }
 }
 
@@ -48,7 +48,7 @@
 /* To be used at large sizes */
 /* As close as possible to Helvetica Neue Thin (to replace Gotham) */
 .thin-font {
-  font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   font-size: var(--ring-font-size);
   font-weight: 100; /* Renders Helvetica Neue UltraLight on OS X  */
 }

package/components/global/memoize.js

@@ -5,7 +5,7 @@ export default function memoize(fn) {
         const key = arg ?? '__singleValue__';
         const cache = key instanceof Object ? objectCache : primitiveCache;
         const cached = cache.get(key);
-        if (cached != null) {
+        if (cached !== undefined) {
             return cached;
         }
         const value = fn(arg);

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

@@ -1,4 +1,4 @@
-import { Component, PropsWithoutRef } from 'react';
+import { Component, type PropsWithoutRef } from 'react';
 export interface RerenderableComponent<P, S> extends Component<P, S> {
     node?: HTMLElement | null;
 }

package/components/global/rerender-hoc.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Component, forwardRef } from 'react';
-import { createComposedRef } from './composeRefs';
+import { createComposedRef } from './compose-refs';
 export default function rerenderHOC(ComposedComponent) {
     class Rerenderer extends Component {
         state = this.props.props;
         composedRef = createComposedRef();
         render() {
             const ref = this.composedRef(this.props.forwardedRef);
-            return (_jsx(ComposedComponent, { ...this.state, ref: instance => ref(instance != null ? { ...instance, rerender: this.setState.bind(this) } : null) }));
+            return (_jsx(ComposedComponent, { ...this.state, ref: instance => ref(instance ? { ...instance, rerender: this.setState.bind(this) } : null) }));
         }
     }
     return forwardRef(function RerendererForwardRef(props, ref) {

package/components/global/theme.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes, ReactElement, FunctionComponent } from 'react';
+import { type HTMLAttributes, type ReactElement, type FunctionComponent } from 'react';
 declare enum Theme {
     AUTO = "auto",
     LIGHT = "light",

package/components/global/theme.js

@@ -59,12 +59,12 @@ export const ThemeProvider = forwardRef(function ThemeProvider({ theme = Theme.A
     const id = useMemo(() => getUID('popups-with-theme-'), []);
     const themeValue = useMemo(() => ({ theme: resolvedTheme }), [resolvedTheme]);
     useEffect(() => {
-        if (target != null) {
+        if (target) {
             applyTheme(resolvedTheme, target);
         }
     }, [resolvedTheme, target]);
     const themeClasses = useThemeClasses(theme);
     const parentTarget = useContext(PopupTargetContext);
-    return (_jsx(ThemeContext.Provider, { value: themeValue, children: _jsx(WrapperComponent, { ref: ref, className: target != null ? undefined : classNames(className, themeClasses), ...restProps, children: passToPopups ? (_jsx(PopupTarget, { id: id, children: popupTarget => (_jsxs(_Fragment, { children: [children, createPortal(_jsx("div", { className: themeClasses, children: popupTarget }), (parentTarget && getPopupContainer(parentTarget)) || document.body)] })) })) : (children) }) }));
+    return (_jsx(ThemeContext.Provider, { value: themeValue, children: _jsx(WrapperComponent, { ref: ref, className: target ? undefined : classNames(className, themeClasses), ...restProps, children: passToPopups ? (_jsx(PopupTarget, { id: id, children: popupTarget => (_jsxs(_Fragment, { children: [children, createPortal(_jsx("div", { className: themeClasses, children: popupTarget }), (parentTarget && getPopupContainer(parentTarget)) || document.body)] })) })) : (children) }) }));
 });
 export default Theme;

package/components/global/url.js

@@ -89,7 +89,7 @@ export function joinBaseURLAndPath(baseUrl, path) {
  * @return {AuthResponse} object with query parameters map
  */
 export function parseQueryString(queryString) {
-    if (queryString == null) {
+    if (!queryString) {
         return {};
     }
     const queryParameterPairRE = /([^&;=]+)=?([^&;]*)/g;
@@ -100,7 +100,7 @@ export function parseQueryString(queryString) {
         return decodeURIComponent(s.replace(/\+/g, ' '));
     }
     let matchedQueryPair;
-    while ((matchedQueryPair = queryParameterPairRE.exec(queryString)) != null) {
+    while (queryString && (matchedQueryPair = queryParameterPairRE.exec(queryString))) {
         urlParams[decode(matchedQueryPair[FIRST_PAIR_ELEMENT])] = decode(matchedQueryPair[SECOND_PAIR_ELEMENT]);
     }
     return urlParams;
@@ -122,7 +122,7 @@ export function encodeURL(url, params) {
     let k;
     let i = 0;
     for (k in params) {
-        if (params.hasOwnProperty(k) && params[k] != null) {
+        if (Object.prototype.hasOwnProperty.call(params, k) && params[k] !== null && params[k] !== undefined) {
             res +=
                 (i++ === 0 ? firstSeparator : '&') +
                     customEncodeURIComponent(k) +

package/components/global/use-event-callback.js

@@ -6,7 +6,7 @@ export default function useEventCallback(fn) {
     });
     return useCallback((...args) => {
         const { current } = ref;
-        if (current == null) {
+        if (current === null || current === undefined) {
             throw new Error('callback created in useEventCallback can only be called from event handlers');
         }
         return current(...args);

package/components/global/variables.css

@@ -116,10 +116,12 @@
   --ring-link-hover-color: rgb(var(--ring-link-hover-components)); /* #2E55A3 */
   --ring-error-components: 204, 54, 69;
   --ring-error-color: rgb(var(--ring-error-components)); /* #CC3645 */
-  --ring-warning-components: 184, 85, 22;
-  --ring-warning-color: rgb(var(--ring-warning-components)); /* #B85516 */ /* Prefer using warning icon + regular text color */
+  --ring-warning-components: 182, 84, 22;
+  --ring-warning-color: rgb(var(--ring-warning-components)); /* #B65416 */ /* Prefer using warning icon + regular text color */
   --ring-success-components: 31, 117, 54;
   --ring-success-color: rgb(var(--ring-success-components)); /* #1F7536 */ /* Prefer using success icon + regular text color */
+  --ring-purple-text-components: 131, 77, 240;
+  --ring-purple-text-color: rgb(var(--ring-purple-text-components)); /* #834DF0 */
   --ring-text-components: 39, 40, 46;
   --ring-text-color: rgb(var(--ring-text-components)); /* #27282E */
   --ring-active-text-color: var(--ring-text-color);
@@ -238,7 +240,7 @@
   --ring-ease: 0.3s ease-out;
   --ring-fast-ease: 0.15s ease-out;
   --ring-font-family: system-ui, Arial, sans-serif;
-  --ring-font-family-monospace: Menlo, "Bitstream Vera Sans Mono", "Ubuntu Mono", Consolas, "Courier New", Courier,
+  --ring-font-family-monospace: Menlo, 'Bitstream Vera Sans Mono', 'Ubuntu Mono', Consolas, 'Courier New', Courier,
     monospace;
   --ring-font-weight-medium: 500;
   --ring-font-weight-bold: 600;

package/components/global/variables_dark.css

@@ -41,8 +41,8 @@
   --ring-main-error-color: rgb(var(--ring-main-error-components)); /* #BD5757 */
   --ring-main-error-hover-components: 156, 78, 78;
   --ring-main-error-hover-color: rgb(var(--ring-main-error-hover-components)); /* #9C4E4E */
-  --ring-main-warning-components: 224, 136, 85;
-  --ring-main-warning-color: rgb(var(--ring-main-warning-components)); /* #E08855 */
+  --ring-main-warning-components: 224, 137, 87;
+  --ring-main-warning-color: rgb(var(--ring-main-warning-components)); /* #E08957 */
   --ring-main-warning-hover-components: 199, 125, 85;
   --ring-main-warning-hover-color: rgb(var(--ring-main-warning-hover-components)); /* #C77D55 */
   --ring-main-purple-components: 149, 90, 224;
@@ -103,10 +103,12 @@
   --ring-link-hover-color: rgb(var(--ring-link-hover-components)); /* #6B9BFA */
   --ring-error-components: 227, 119, 116;
   --ring-error-color: rgb(var(--ring-error-components)); /* #E37774 */
-  --ring-warning-components: 224, 136, 85;
-  --ring-warning-color: rgb(var(--ring-warning-components)); /* #E08855 */ /* Prefer using warning icon + regular text color */
+  --ring-warning-components: 224, 137, 87;
+  --ring-warning-color: rgb(var(--ring-warning-components)); /* #E08957 */ /* Prefer using warning icon + regular text color */
   --ring-success-components: 95, 173, 101;
   --ring-success-color: rgb(var(--ring-success-components)); /* #5FAD65 */ /* Prefer using success icon + regular text color */
+  --ring-purple-text-components: 181, 137, 236;
+  --ring-purple-text-color: rgb(var(--ring-purple-text-components)); /* #B589EC */
   --ring-text-components: 255, 255, 255;
   --ring-text-color: rgb(var(--ring-text-components)); /* #FFFFFF */
   --ring-active-text-components: 255, 255, 255;
@@ -175,8 +177,8 @@
   --ring-warning-container-light-color: rgb(var(--ring-warning-container-light-components)); /* #352A27 */
   --ring-highlight-container-light-components: 49, 42, 35;
   --ring-highlight-container-light-color: rgb(var(--ring-highlight-container-light-components)); /* #312A23 */
-  --ring-grey-container-light-components: 57, 59, 64;
-  --ring-grey-container-light-color: rgb(var(--ring-grey-container-light-components)); /* #393B40 */
+  --ring-grey-container-light-components: 43, 45, 48;
+  --ring-grey-container-light-color: rgb(var(--ring-grey-container-light-components)); /* #2B2D30 */
   --ring-purple-container-light-components: 43, 37, 49;
   --ring-purple-container-light-color: rgb(var(--ring-purple-container-light-components)); /* #2B2531 */
   --ring-highlight-fill-components: 214, 174, 88;

package/components/grid/col.d.ts

@@ -1,4 +1,4 @@
-import { Component, ReactNode } from 'react';
+import { Component, type ReactNode } from 'react';
 export interface ColProps {
     children?: ReactNode;
     xs?: boolean | number | null | undefined;

package/components/grid/col.js

@@ -28,6 +28,6 @@ export default class Col extends Component {
         const classes = classNames(styles.col, className, getClassNames(restProps), {
             [styles.reverse]: reverse,
         });
-        return (_jsx("div", { className: classes, "data-test": "ring-grid-column", children: children }));
+        return (_jsx("div", { className: classes, "data-test": 'ring-grid-column', children: children }));
     }
 }

package/components/grid/grid.css

@@ -1,7 +1,7 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
-@value breakpoint-small, breakpoint-middle, breakpoint-large  from "../global/global.css";
-@value large-screen-media, middle-screen-media, small-screen-media from "../global/global.css";
+@value breakpoint-small, breakpoint-middle, breakpoint-large  from '../global/global.css';
+@value large-screen-media, middle-screen-media, small-screen-media from '../global/global.css';
 
 .container-fluid,
 .container,
@@ -773,7 +773,7 @@
   }
 
   .col-lg-5 {
-    flex-basis: var(--ring-grid-width-5);;
+    flex-basis: var(--ring-grid-width-5);
 
     max-width: var(--ring-grid-width-5);
   }

package/components/grid/grid.d.ts

@@ -1,4 +1,4 @@
-import { Component, HTMLAttributes } from 'react';
+import { Component, type HTMLAttributes } from 'react';
 /**
  * @name Grid
  */

package/components/grid/grid.js

@@ -9,7 +9,7 @@ export class Grid extends Component {
     render() {
         const { children, className, ...restProps } = this.props;
         const classes = classNames(styles['container-fluid'], className);
-        return (_jsx("div", { "data-test": "ring-grid", ...restProps, className: classes, children: children }));
+        return (_jsx("div", { "data-test": 'ring-grid', ...restProps, className: classes, children: children }));
     }
 }
 export { default as Row } from './row';

package/components/grid/row.d.ts

@@ -1,4 +1,4 @@
-import { Component, ReactNode } from 'react';
+import { Component, type ReactNode } from 'react';
 type ModifierType = 'xs' | 'sm' | 'md' | 'lg';
 export interface RowProps {
     children?: ReactNode;

package/components/grid/row.js

@@ -34,6 +34,6 @@ export default class Row extends Component {
         const classes = classNames(className, styles.row, getModifierClassNames(restProps), {
             [styles.reverse]: reverse,
         });
-        return (_jsx("div", { className: classes, "data-test": "ring-grid-row", children: children }));
+        return (_jsx("div", { className: classes, "data-test": 'ring-grid-row', children: children }));
     }
 }

package/components/group/group.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .group {
   & > *:not(:last-child) {

package/components/group/group.d.ts

@@ -1,4 +1,4 @@
-import { Component, HTMLAttributes } from 'react';
+import { Component, type HTMLAttributes } from 'react';
 /**
  * @name Group
  */

package/components/group/group.js

@@ -9,6 +9,6 @@ export default class Group extends Component {
     render() {
         const { children, className, ...restProps } = this.props;
         const classes = classNames(styles.group, className);
-        return (_jsx("span", { "data-test": "ring-group", ...restProps, className: classes, children: children }));
+        return (_jsx("span", { "data-test": 'ring-group', ...restProps, className: classes, children: children }));
     }
 }

package/components/header/header-icon.d.ts

@@ -1,6 +1,6 @@
 import { Component } from 'react';
-import { ButtonAttrs } from '../button/button';
-import { IconType } from '../icon/icon';
+import { type ButtonAttrs } from '../button/button';
+import { type IconType } from '../icon';
 export interface HeaderIconSpecificProps {
     icon: string | IconType;
     rotatable?: boolean | null | undefined;

package/components/header/header.css

@@ -1,6 +1,6 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
-@value link, active from "../link/link.css";
+@value link, active from '../link/link.css';
 
 :root,
 :host {
@@ -206,7 +206,7 @@ html:global(.ring-ui-theme-dark) .headerVertical {
 }
 
 .anchorClassName {
-  composes: resetButton from "../global/global.css";
+  composes: resetButton from '../global/global.css';
 
   display: flex;
   align-items: center;
@@ -230,7 +230,7 @@ html:global(.ring-ui-theme-dark) .headerVertical {
     width: var(--ring-unit);
     height: var(--ring-unit);
 
-    content: "";
+    content: '';
 
     border: 1px solid var(--ring-white-text-color);
     border-radius: 50%;

package/components/header/header.d.ts

@@ -1,4 +1,4 @@
-import { Component, HTMLAttributes } from 'react';
+import { Component, type HTMLAttributes } from 'react';
 import Theme from '../global/theme';
 interface HeaderProps extends HTMLAttributes<HTMLElement> {
     spaced: boolean;

package/components/header/links.d.ts

@@ -1,2 +1,2 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 export default function Links({ className, ...restProps }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;

package/components/header/logo.d.ts

@@ -1,5 +1,5 @@
 import { PureComponent } from 'react';
-import { IconAttrs, Size } from '../icon/icon';
+import { type IconAttrs, Size } from '../icon/icon';
 export default class Logo extends PureComponent<IconAttrs> {
     static defaultProps: {
         size: Size;

package/components/header/profile.d.ts

@@ -1,10 +1,10 @@
-import { ComponentType, HTMLAttributes, PureComponent, ReactNode } from 'react';
+import { type ComponentType, type HTMLAttributes, PureComponent, type ReactNode } from 'react';
 import * as React from 'react';
 import { Size } from '../avatar/avatar';
-import { PopupMenuAttrs } from '../popup-menu/popup-menu';
-import { ListDataItem } from '../list/consts';
-import { AuthUser } from '../auth/auth';
-import { ClickableLinkProps } from '../link/clickableLink';
+import { type PopupMenuAttrs } from '../popup-menu/popup-menu';
+import { type ListDataItem } from '../list/consts';
+import { type AuthUser } from '../auth/auth';
+import { type ClickableLinkProps } from '../link/clickable-link';
 export interface ProfileTranslations {
     applyChangedUser?: string | null | undefined;
     login?: string | null | undefined;

package/components/header/profile.js

@@ -14,7 +14,7 @@ export default class Profile extends PureComponent {
         closeOnSelect: true,
         renderPopupItems: items => items,
         size: Size.Size32,
-        renderGuest: ({ loading, onLogin, className, translations }) => (_jsx(I18nContext.Consumer, { children: ({ translate }) => (_jsx("div", { className: classNames(styles.profileEmpty, className), children: _jsx(Button, { primary: true, "data-test": "ring-header-login-button", disabled: loading, loader: loading, onClick: onLogin, children: translations?.login ?? translate('login') }) })) })),
+        renderGuest: ({ loading, onLogin, className, translations }) => (_jsx(I18nContext.Consumer, { children: ({ translate }) => (_jsx("div", { className: classNames(styles.profileEmpty, className), children: _jsx(Button, { primary: true, "data-test": 'ring-header-login-button', disabled: loading, loader: loading, onClick: onLogin, children: translations?.login ?? translate('login') }) })) })),
     };
     static contextType = I18nContext;
     static Size = Size;
@@ -30,7 +30,7 @@ export default class Profile extends PureComponent {
         const avatarWrapper = classNames(styles.avatarWrapper, {
             [styles.hasUpdates]: hasUpdates,
         });
-        const anchor = (_jsxs("button", { type: "button", className: styles.anchorClassName, children: [_jsx("span", { className: avatarWrapper, children: _jsx(Avatar, { url: user.profile && user.profile.avatar && user.profile.avatar.url, size: size, round: round, username: user.name }) }), showName && _jsx("span", { children: user.name })] }));
+        const anchor = (_jsxs("button", { type: 'button', className: styles.anchorClassName, children: [_jsx("span", { className: avatarWrapper, children: _jsx(Avatar, { url: user.profile && user.profile.avatar && user.profile.avatar.url, size: size, round: round, username: user.name }) }), showName && _jsx("span", { children: user.name })] }));
         const items = [
             showApplyChangedUser && {
                 rgItemType,
@@ -63,7 +63,7 @@ export default class Profile extends PureComponent {
                 onClick: onLogout,
             },
         ].filter(isTruthy);
-        return (_jsx(DropdownMenu, { ...props, onShow: onShow, onHide: onHide, title: user.name, anchor: anchor, data: renderPopupItems(items), "data-test": "ring-profile", className: classNames(styles.profile, className), activeClassName: activeClassName, menuProps: {
+        return (_jsx(DropdownMenu, { ...props, onShow: onShow, onHide: onHide, title: user.name, anchor: anchor, data: renderPopupItems(items), "data-test": 'ring-profile', className: classNames(styles.profile, className), activeClassName: activeClassName, menuProps: {
                 closeOnSelect,
                 left: -2,
                 top: -8,

package/components/header/services-link.d.ts

@@ -1,5 +1,5 @@
 import { PureComponent } from 'react';
-import { LinkProps } from '../link/link';
+import { type LinkProps } from '../link/link';
 export interface Service {
     id: string;
     applicationName?: string | null | undefined;