fix: lint for react-ui

packages/react-ui/.storybook/preview.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { setFilter } from '@skbkontur/react-props2attrs';
 import { findAmongParents } from '@skbkontur/react-sorge/lib';
 import { MINIMAL_VIEWPORTS } from '@storybook/addon-viewport';
-import { Meta } from '@storybook/react';
+import type { Meta } from '@storybook/react';
 
 import { isTestEnv } from '../lib/currentEnvironment';
 import { ThemeContext } from '../lib/theming/ThemeContext';

packages/react-ui/components/Autocomplete/Autocomplete.styles.ts

@@ -1,5 +1,5 @@
 import { css, memoizeStyle } from '../../lib/theming/Emotion';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 export const styles = memoizeStyle({
   root(t: Theme) {

packages/react-ui/components/Autocomplete/Autocomplete.tsx

@@ -1,32 +1,37 @@
-import React, { AriaAttributes, KeyboardEvent } from 'react';
+import type { AriaAttributes, KeyboardEvent } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 
 import { MenuMessage } from '../../internal/MenuMessage';
 import { locale } from '../../lib/locale/decorators';
 import { getRandomID, isNullable } from '../../lib/utils';
 import { ThemeContext } from '../../lib/theming/ThemeContext';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 import { cx } from '../../lib/theming/Emotion';
 import { isKeyArrowDown, isKeyArrowUp, isKeyEnter, isKeyEscape } from '../../lib/events/keyboard/identifiers';
-import { Input, InputProps } from '../Input';
+import type { InputProps } from '../Input';
+import { Input } from '../Input';
 import { Menu } from '../../internal/Menu';
 import { MenuItem } from '../MenuItem';
 import { RenderLayer } from '../../internal/RenderLayer';
 import { createPropsGetter } from '../../lib/createPropsGetter';
-import { Nullable, Override } from '../../typings/utility-types';
+import type { Nullable, Override } from '../../typings/utility-types';
 import { fixClickFocusIE } from '../../lib/events/fixClickFocusIE';
-import { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import { CommonWrapper } from '../../internal/CommonWrapper';
 import { MobilePopup } from '../../internal/MobilePopup';
 import { responsiveLayout } from '../ResponsiveLayout/decorator';
-import { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';
+import type { TSetRootNode } from '../../lib/rootNode';
+import { getRootNode, rootNode } from '../../lib/rootNode';
 import { getDOMRect } from '../../lib/dom/getDOMRect';
-import { SizeProp } from '../../lib/types/props';
+import type { SizeProp } from '../../lib/types/props';
 import { Popup } from '../../internal/Popup';
 import { getMenuPositions } from '../../lib/getMenuPositions';
 import { ZIndex } from '../../internal/ZIndex';
 
 import { styles } from './Autocomplete.styles';
-import { AutocompleteLocale, AutocompleteLocaleHelper } from './locale';
+import type { AutocompleteLocale } from './locale';
+import { AutocompleteLocaleHelper } from './locale';
 import { getAutocompleteTheme } from './getAutocompleteTheme';
 
 function match(pattern: string, items: string[]) {

packages/react-ui/components/Autocomplete/__stories__/Autocomplete.stories.tsx

@@ -3,8 +3,8 @@ import { flatten } from 'lodash';
 
 import { Gapped } from '../../Gapped';
 import { Autocomplete } from '../Autocomplete';
-import { Meta, Story } from '../../../typings/stories';
-import { AutocompleteProps } from '..';
+import type { Meta, Story } from '../../../typings/stories';
+import type { AutocompleteProps } from '..';
 import { LangCodes, LocaleContext } from '../../../lib/locale';
 
 export default {

packages/react-ui/components/Autocomplete/__tests__/Autocomplete-test.tsx

@@ -5,7 +5,8 @@ import userEvent from '@testing-library/user-event';
 import { mount } from 'enzyme';
 
 import { InputDataTids } from '../../../components/Input';
-import { Autocomplete, AutocompleteProps, AutocompleteIds, AutocompleteDataTids } from '../Autocomplete';
+import type { AutocompleteProps } from '../Autocomplete';
+import { Autocomplete, AutocompleteIds, AutocompleteDataTids } from '../Autocomplete';
 import { delay, clickOutside } from '../../../lib/utils';
 
 describe('<Autocomplete />', () => {

packages/react-ui/components/Autocomplete/getAutocompleteTheme.ts

@@ -1,5 +1,5 @@
 import { ThemeFactory } from '../../lib/theming/ThemeFactory';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 export const getAutocompleteTheme = (theme: Theme): Theme => {
   return ThemeFactory.create(

packages/react-ui/components/Autocomplete/locale/index.ts

@@ -2,7 +2,7 @@ import { LocaleHelper } from '../../../lib/locale/LocaleHelper';
 
 import { componentsLocales as en_GB } from './locales/en';
 import { componentsLocales as ru_RU } from './locales/ru';
-import { AutocompleteLocale } from './types';
+import type { AutocompleteLocale } from './types';
 
 export * from './types';
 

packages/react-ui/components/Autocomplete/locale/locales/en.ts

@@ -1,4 +1,4 @@
-import { AutocompleteLocale } from '../types';
+import type { AutocompleteLocale } from '../types';
 
 export const componentsLocales: AutocompleteLocale = {
   enterValue: 'Start typing',

packages/react-ui/components/Autocomplete/locale/locales/ru.ts

@@ -1,4 +1,4 @@
-import { AutocompleteLocale } from '../types';
+import type { AutocompleteLocale } from '../types';
 
 export const componentsLocales: AutocompleteLocale = {
   enterValue: 'Начните вводить значение',

packages/react-ui/components/Button/Button.styles.ts

@@ -1,5 +1,5 @@
 import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 import { resetButton, resetText } from '../../lib/styles/Mixins';
 
 import {

packages/react-ui/components/Button/Button.tsx

@@ -1,23 +1,27 @@
-import React, { HTMLAttributes } from 'react';
+import type { HTMLAttributes } from 'react';
+import React from 'react';
 import { globalObject } from '@skbkontur/global-object';
 
-import { ButtonLinkAllowedValues } from '../../lib/types/button-link';
+import type { ButtonLinkAllowedValues } from '../../lib/types/button-link';
 import { isKonturIcon, isReactUIComponent } from '../../lib/utils';
 import { isIE11, isEdge, isSafari } from '../../lib/client';
 import { keyListener } from '../../lib/events/keyListener';
-import { Theme, ThemeIn } from '../../lib/theming/Theme';
+import type { Theme, ThemeIn } from '../../lib/theming/Theme';
 import { ThemeContext } from '../../lib/theming/ThemeContext';
-import { CommonWrapper, CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';
+import { CommonWrapper } from '../../internal/CommonWrapper';
 import { cx } from '../../lib/theming/Emotion';
-import { rootNode, TSetRootNode } from '../../lib/rootNode';
+import type { TSetRootNode } from '../../lib/rootNode';
+import { rootNode } from '../../lib/rootNode';
 import { ThemeFactory } from '../../lib/theming/ThemeFactory';
 import { createPropsGetter } from '../../lib/createPropsGetter';
 import { Link } from '../Link';
-import { SizeProp } from '../../lib/types/props';
-import { PolymorphicPropsWithoutRef } from '../../lib/types/polymorphic-component';
+import type { SizeProp } from '../../lib/types/props';
+import type { PolymorphicPropsWithoutRef } from '../../lib/types/polymorphic-component';
 
 import { styles, activeStyles, globalClasses } from './Button.styles';
-import { ButtonIcon, ButtonIconProps, getButtonIconSizes } from './ButtonIcon';
+import type { ButtonIconProps } from './ButtonIcon';
+import { ButtonIcon, getButtonIconSizes } from './ButtonIcon';
 import { useButtonArrow } from './ButtonArrow';
 import { getInnerLinkTheme } from './getInnerLinkTheme';
 import { LoadingButtonIcon } from './LoadingButtonIcon';
@@ -290,7 +294,6 @@ export class Button<C extends ButtonLinkAllowedValues = typeof BUTTON_DEFAULT_CO
     const isFocused = this.state.focusedByTab || visuallyFocused;
     const isLink = use === 'link';
 
-    // eslint-disable-next-line react-hooks/rules-of-hooks
     const [rootClassNameWithArrow, arrowNode] = useButtonArrow(
       { ...this.props, isFocused: Boolean(isFocused) },
       this.theme,

packages/react-ui/components/Button/ButtonArrow.tsx

@@ -2,11 +2,12 @@ import React, { useContext } from 'react';
 
 import { cx } from '../../lib/theming/Emotion';
 import { ThemeContext } from '../../lib/theming/ThemeContext';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 import { ArrowRightIcon } from './ArrowRightIcon';
 import { ArrowLeftIcon } from './ArrowLeftIcon';
-import { Button, ButtonInnerProps } from './Button';
+import type { ButtonInnerProps } from './Button';
+import { Button } from './Button';
 import { globalClasses, styles } from './Button.styles';
 
 type ButtonArrowProps = Pick<

packages/react-ui/components/Button/ButtonIcon.styles.ts

@@ -1,6 +1,6 @@
 import { ZERO_WIDTH_SPACE_CSS } from '../../lib/chars';
 import { css, memoizeStyle } from '../../lib/theming/Emotion';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 export const styles = memoizeStyle({
   icon() {

packages/react-ui/components/Button/ButtonIcon.tsx

@@ -1,12 +1,12 @@
 import React, { useContext } from 'react';
 
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 import { isKonturIcon } from '../../lib/utils';
 import { cx } from '../../lib/theming/Emotion';
 import { ThemeContext } from '../../lib/theming/ThemeContext';
-import { SizeProp } from '../../lib/types/props';
+import type { SizeProp } from '../../lib/types/props';
 
-import { ButtonInnerProps } from './Button';
+import type { ButtonInnerProps } from './Button';
 import { styles } from './ButtonIcon.styles';
 import { LoadingButtonIcon } from './LoadingButtonIcon';
 

packages/react-ui/components/Button/LoadingButtonIcon.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { IconSizeAliases } from '../../internal/icons2022/iconConstants';
+import type { IconSizeAliases } from '../../internal/icons2022/iconConstants';
 import { LoadingIcon } from '../../internal/icons2022/LoadingIcon';
 
 import { ButtonDataTids } from './Button';

packages/react-ui/components/Button/__stories__/Button.stories.tsx

@@ -1,4 +1,5 @@
-import React, { ReactElement } from 'react';
+import type { ReactElement } from 'react';
+import React from 'react';
 import ArchivePack from '@skbkontur/react-icons/ArchivePack';
 import OkIcon from '@skbkontur/react-icons/Ok';
 import SearchIcon from '@skbkontur/react-icons/Search';
@@ -13,10 +14,11 @@ import {
 import { DARK_THEME } from '../../../lib/theming/themes/DarkTheme';
 import { ThemeContext } from '../../../lib/theming/ThemeContext';
 import { ThemeFactory } from '../../../lib/theming/ThemeFactory';
-import { Story } from '../../../typings/stories';
+import type { Story } from '../../../typings/stories';
 import { Gapped } from '../../Gapped';
 import { ComponentTable } from '../../../internal/ComponentTable';
-import { Button, ButtonProps } from '../Button';
+import type { ButtonProps } from '../Button';
+import { Button } from '../Button';
 
 export default {
   title: 'Button',

packages/react-ui/components/Button/__tests__/Button-test.tsx

@@ -4,7 +4,8 @@ import React, { useState } from 'react';
 
 import { ThemeContext } from '../../../lib/theming/ThemeContext';
 import { LIGHT_THEME } from '../../../lib/theming/themes/LightTheme';
-import { Button, ButtonDataTids, ButtonType } from '../Button';
+import type { ButtonType } from '../Button';
+import { Button, ButtonDataTids } from '../Button';
 
 describe('Button', () => {
   it('has id attribute', () => {

packages/react-ui/components/Button/getInnerLinkTheme.ts

@@ -1,5 +1,5 @@
 import { ThemeFactory } from '../../lib/theming/ThemeFactory';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 export const getInnerLinkTheme = (theme: Theme): Theme => {
   return ThemeFactory.create(

packages/react-ui/components/Calendar/Calendar.styles.ts

@@ -1,5 +1,5 @@
 import { css, memoizeStyle } from '../../lib/theming/Emotion';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 export const styles = memoizeStyle({
   root(t: Theme) {

packages/react-ui/components/Calendar/Calendar.tsx

@@ -2,16 +2,19 @@ import React from 'react';
 import normalizeWheel from 'normalize-wheel';
 import throttle from 'lodash.throttle';
 import shallowEqual from 'shallowequal';
-import { globalObject, SafeTimer } from '@skbkontur/global-object';
+import type { SafeTimer } from '@skbkontur/global-object';
+import { globalObject } from '@skbkontur/global-object';
 
 import { isInstanceOf } from '../../lib/isInstanceOf';
 import { InternalDate } from '../../lib/date/InternalDate';
-import { rootNode, TSetRootNode } from '../../lib/rootNode';
+import type { TSetRootNode } from '../../lib/rootNode';
+import { rootNode } from '../../lib/rootNode';
 import { cx } from '../../lib/theming/Emotion';
-import { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';
+import type { CommonProps } from '../../internal/CommonWrapper';
+import { CommonWrapper } from '../../internal/CommonWrapper';
 import { MAX_DATE, MAX_MONTH, MAX_YEAR, MIN_DATE, MIN_MONTH, MIN_YEAR } from '../../lib/date/constants';
-import { Nullable, Range } from '../../typings/utility-types';
-import { Theme } from '../../lib/theming/Theme';
+import type { Nullable, Range } from '../../typings/utility-types';
+import type { Theme } from '../../lib/theming/Theme';
 import { ThemeContext } from '../../lib/theming/ThemeContext';
 import { animation } from '../../lib/animation';
 import { isMobile } from '../../lib/client';
@@ -23,10 +26,13 @@ import { MonthViewModel } from './MonthViewModel';
 import * as CalendarScrollEvents from './CalendarScrollEvents';
 import { Month } from './Month';
 import { styles } from './Calendar.styles';
-import { CalendarDateShape, create, isGreater, isLess } from './CalendarDateShape';
+import type { CalendarDateShape } from './CalendarDateShape';
+import { create, isGreater, isLess } from './CalendarDateShape';
 import * as CalendarUtils from './CalendarUtils';
-import { CalendarContext, CalendarContextProps } from './CalendarContext';
-import { CalendarDay, CalendarDayProps } from './CalendarDay';
+import type { CalendarContextProps } from './CalendarContext';
+import { CalendarContext } from './CalendarContext';
+import type { CalendarDayProps } from './CalendarDay';
+import { CalendarDay } from './CalendarDay';
 
 export interface CalendarProps extends CommonProps {
   /**

packages/react-ui/components/Calendar/CalendarContext.ts

@@ -1,7 +1,7 @@
 import { createContext } from 'react';
 
-import { CalendarDateShape } from './CalendarDateShape';
-import { CalendarProps } from './Calendar';
+import type { CalendarDateShape } from './CalendarDateShape';
+import type { CalendarProps } from './Calendar';
 
 export interface CalendarContextProps {
   renderDay?: CalendarProps['renderDay'];

packages/react-ui/components/Calendar/CalendarDateShape.ts

@@ -1,4 +1,4 @@
-import { Nullable } from '../../typings/utility-types';
+import type { Nullable } from '../../typings/utility-types';
 
 export interface CalendarDateShape {
   year: number;

packages/react-ui/components/Calendar/CalendarDay.tsx

@@ -1,4 +1,5 @@
-import React, { PropsWithChildren, useContext, memo } from 'react';
+import type { PropsWithChildren } from 'react';
+import React, { useContext, memo } from 'react';
 
 import { useLocaleForControl } from '../../lib/locale/useLocaleForControl';
 import { ThemeContext } from '../../lib/theming/ThemeContext';

packages/react-ui/components/Calendar/CalendarUtils.ts

@@ -1,10 +1,11 @@
-import { Nullable } from '../../typings/utility-types';
-import { Theme } from '../../lib/theming/Theme';
+import type { Nullable } from '../../typings/utility-types';
+import type { Theme } from '../../lib/theming/Theme';
 
 import { themeConfig } from './config';
 import { MonthViewModel } from './MonthViewModel';
-import { CalendarState } from './Calendar';
-import { CalendarDateShape, isGreater, isLess } from './CalendarDateShape';
+import type { CalendarState } from './Calendar';
+import type { CalendarDateShape } from './CalendarDateShape';
+import { isGreater, isLess } from './CalendarDateShape';
 
 export const calculateScrollPosition = (
   months: MonthViewModel[],

packages/react-ui/components/Calendar/DayCellView.styles.ts

@@ -1,5 +1,5 @@
 import { css, memoizeStyle } from '../../lib/theming/Emotion';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 import { resetButton } from '../../lib/styles/Mixins';
 
 export const styles = memoizeStyle({

packages/react-ui/components/Calendar/DayCellView.tsx

@@ -5,9 +5,10 @@ import { InternalDateTransformer } from '../../lib/date/InternalDateTransformer'
 
 import { styles } from './DayCellView.styles';
 import { CalendarContext } from './CalendarContext';
-import { DayCellViewModel } from './DayCellViewModel';
+import type { DayCellViewModel } from './DayCellViewModel';
 import * as CDS from './CalendarDateShape';
-import { CalendarDay, CalendarDayProps } from './CalendarDay';
+import type { CalendarDayProps } from './CalendarDay';
+import { CalendarDay } from './CalendarDay';
 
 export interface DayCellViewProps {
   date: DayCellViewModel;

packages/react-ui/components/Calendar/Month.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 
 import { ThemeContext } from '../../lib/theming/ThemeContext';
-import { Theme } from '../../lib/theming/Theme';
-import { DateSelect } from '../../internal/DateSelect';
+import type { Theme } from '../../lib/theming/Theme';
+import type { DateSelect } from '../../internal/DateSelect';
 
-import { MonthViewModel } from './MonthViewModel';
-import { DayCellViewModel } from './DayCellViewModel';
+import type { MonthViewModel } from './MonthViewModel';
+import type { DayCellViewModel } from './DayCellViewModel';
 import { MonthView } from './MonthView';
 import { DayCellView } from './DayCellView';
 import * as CalendarScrollEvents from './CalendarScrollEvents';

packages/react-ui/components/Calendar/MonthView.styles.ts

@@ -1,5 +1,5 @@
 import { css, memoizeStyle } from '../../lib/theming/Emotion';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 export const styles = memoizeStyle({
   headerMonth(t: Theme) {

packages/react-ui/components/Calendar/MonthView.tsx

@@ -4,7 +4,7 @@ import { ThemeContext } from '../../lib/theming/ThemeContext';
 import * as ColorFunctions from '../../lib/styles/ColorFunctions';
 import { cx } from '../../lib/theming/Emotion';
 import { useResponsiveLayout } from '../../components/ResponsiveLayout';
-import { Nullable } from '../..//typings/utility-types';
+import type { Nullable } from '../..//typings/utility-types';
 import { DateSelect } from '../../internal/DateSelect';
 
 import { styles } from './MonthView.styles';

packages/react-ui/components/Calendar/MonthViewModel.ts

@@ -1,5 +1,5 @@
 import { memo } from '../../lib/memo';
-import { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme';
 
 import { getMonthInHumanFormat } from './CalendarUtils';
 import { themeConfig } from './config';