refactor: isolationDeclarations types (#7096)

* refactor: isolationDeclarations types Прописал типы для поддержки isolationDeclarations * feat: enable isolatedModules
VKCOM · Jun 28, 2024 · 8d31a09 · 8d31a09
1 parent 3984ff5
commit 8d31a09
Show file tree

Hide file tree

Showing 293 changed files with 935 additions and 518 deletions.
diff --git a/packages/vkui/src/components/Accordion/Accordion.tsx b/packages/vkui/src/components/Accordion/Accordion.tsx
@@ -31,7 +31,10 @@ export interface AccordionProps extends HasChildren {
   disabled?: boolean;
 }
 
-export const Accordion = ({
+export const Accordion: React.FC<AccordionProps> & {
+  Summary: typeof AccordionSummary;
+  Content: typeof AccordionContent;
+} = ({
   id,
   expanded: expandedProp,
   defaultExpanded = false,

diff --git a/packages/vkui/src/components/Accordion/AccordionContent.tsx b/packages/vkui/src/components/Accordion/AccordionContent.tsx
@@ -23,13 +23,13 @@ export interface AccordionContentProps
     HasRef<HTMLDivElement>,
     React.HTMLAttributes<HTMLDivElement> {}
 
-export const AccordionContent = ({
+export const AccordionContent: React.FC<AccordionContentProps> = ({
   getRootRef,
   getRef,
   className,
   children,
   ...restProps
-}: AccordionContentProps) => {
+}) => {
   const { expanded, labelId, contentId } = React.useContext(AccordionContext);
 
   const inRef = useExternRef(getRef);

diff --git a/packages/vkui/src/components/Accordion/AccordionContext.tsx b/packages/vkui/src/components/Accordion/AccordionContext.tsx
@@ -8,9 +8,10 @@ export interface AccordionContextProps {
   onChange: (e: boolean) => void;
 }
 
-export const AccordionContext = React.createContext<AccordionContextProps>({
-  labelId: '',
-  contentId: '',
-  expanded: false,
-  onChange: noop,
-});
+export const AccordionContext: React.Context<AccordionContextProps> =
+  React.createContext<AccordionContextProps>({
+    labelId: '',
+    contentId: '',
+    expanded: false,
+    onChange: noop,
+  });
diff --git a/packages/vkui/src/components/Accordion/AccordionSummary.tsx b/packages/vkui/src/components/Accordion/AccordionSummary.tsx
@@ -20,7 +20,7 @@ export interface AccordionSummaryProps extends Omit<SimpleCellProps, 'expandable
   iconPosition?: 'before' | 'after';
 }
 
-export const AccordionSummary = ({
+export const AccordionSummary: React.FC<AccordionSummaryProps> = ({
   after,
   before,
   ExpandIcon = Icon24ChevronDown,

diff --git a/packages/vkui/src/components/ActionSheet/ActionSheet.tsx b/packages/vkui/src/components/ActionSheet/ActionSheet.tsx
@@ -50,7 +50,7 @@ export const ActionSheet = ({
   mode: modeProp,
   onClose,
   ...restProps
-}: ActionSheetProps) => {
+}: ActionSheetProps): React.ReactNode => {
   const platform = usePlatform();
   const [closingBy, setClosingBy] = React.useState<undefined | CloseInitiators>(undefined);
   const onCloseWithOther = () => setClosingBy('other');

diff --git a/packages/vkui/src/components/ActionSheet/ActionSheetContext.ts b/packages/vkui/src/components/ActionSheet/ActionSheetContext.ts
@@ -14,4 +14,6 @@ export type ActionSheetContextType<T extends Element = Element> = {
   mode?: 'sheet' | 'menu';
 };
 
-export const ActionSheetContext = React.createContext<ActionSheetContextType<any>>({});
+export const ActionSheetContext: React.Context<ActionSheetContextType<any>> = React.createContext(
+  {},
+);
diff --git a/packages/vkui/src/components/ActionSheet/ActionSheetDefaultIosCloseItem.tsx b/packages/vkui/src/components/ActionSheet/ActionSheetDefaultIosCloseItem.tsx
@@ -1,6 +1,6 @@
 import { ActionSheetItem, ActionSheetItemProps } from '../ActionSheetItem/ActionSheetItem';
 
-export const ActionSheetDefaultIosCloseItem = (props: ActionSheetItemProps) => {
+export const ActionSheetDefaultIosCloseItem = (props: ActionSheetItemProps): React.ReactNode => {
   return (
     <ActionSheetItem mode="cancel" isCancelItem {...props}>
       Отмена

diff --git a/packages/vkui/src/components/ActionSheet/ActionSheetDropdownMenu.tsx b/packages/vkui/src/components/ActionSheet/ActionSheetDropdownMenu.tsx
@@ -29,7 +29,7 @@ export const ActionSheetDropdownMenu = ({
   onAnimationStart,
   onAnimationEnd,
   ...restProps
-}: SharedDropdownProps) => {
+}: SharedDropdownProps): React.ReactNode => {
   const { document } = useDOM();
   const platform = usePlatform();
   const { sizeY } = useAdaptivityWithJSMediaQueries();

diff --git a/packages/vkui/src/components/ActionSheet/ActionSheetDropdownSheet.tsx b/packages/vkui/src/components/ActionSheet/ActionSheetDropdownSheet.tsx
@@ -20,7 +20,7 @@ export const ActionSheetDropdownSheet = ({
   toggleRef,
   className,
   ...restProps
-}: SharedDropdownProps) => {
+}: SharedDropdownProps): React.ReactNode => {
   const { sizeY } = useAdaptivityWithJSMediaQueries();
   const platform = usePlatform();
 

diff --git a/packages/vkui/src/components/ActionSheetItem/ActionSheetItem.tsx b/packages/vkui/src/components/ActionSheetItem/ActionSheetItem.tsx
@@ -72,7 +72,7 @@ export const ActionSheetItem = ({
   className,
   isCancelItem,
   ...restProps
-}: ActionSheetItemProps) => {
+}: ActionSheetItemProps): React.ReactNode => {
   const platform = usePlatform();
   const { onItemClick = () => noop, mode: actionSheetMode } =
     React.useContext<ActionSheetContextType<HTMLElement>>(ActionSheetContext);

diff --git a/packages/vkui/src/components/ActionSheetItem/subcomponents/Radio/Radio.tsx b/packages/vkui/src/components/ActionSheetItem/subcomponents/Radio/Radio.tsx
@@ -27,7 +27,7 @@ export const Radio = ({
   className,
   style,
   ...restProps
-}: ActionSheetItemCheckedProps) => {
+}: ActionSheetItemCheckedProps): React.ReactNode => {
   return (
     <RootComponent getRootRef={getRootRef} className={className} style={style}>
       <VisuallyHidden

diff --git a/packages/vkui/src/components/AdaptiveIconRenderer/AdaptiveIconRenderer.tsx b/packages/vkui/src/components/AdaptiveIconRenderer/AdaptiveIconRenderer.tsx
@@ -10,7 +10,10 @@ export interface AdaptiveIconRendererProps {
  * @since 5.4.0
  * @see https://vkcom.github.io/VKUI/#/AdaptiveIconRenderer
  */
-export const AdaptiveIconRenderer = ({ IconCompact, IconRegular }: AdaptiveIconRendererProps) => {
+export const AdaptiveIconRenderer = ({
+  IconCompact,
+  IconRegular,
+}: AdaptiveIconRendererProps): React.ReactNode => {
   const { sizeY } = useAdaptivityConditionalRender();
 
   return (

diff --git a/packages/vkui/src/components/AdaptivityProvider/AdaptivityContext.tsx b/packages/vkui/src/components/AdaptivityProvider/AdaptivityContext.tsx
@@ -25,4 +25,5 @@ export interface AdaptivityProps extends SizeProps {
   hasHover?: boolean;
 }
 
-export const AdaptivityContext = React.createContext<AdaptivityProps>({});
+export const AdaptivityContext: React.Context<AdaptivityProps> =
+  React.createContext<AdaptivityProps>({});
diff --git a/packages/vkui/src/components/AdaptivityProvider/AdaptivityProvider.tsx b/packages/vkui/src/components/AdaptivityProvider/AdaptivityProvider.tsx
@@ -16,7 +16,7 @@ export const AdaptivityProvider = ({
   hasPointer,
   hasHover,
   children,
-}: AdaptivityProviderProps) => {
+}: AdaptivityProviderProps): React.ReactNode => {
   const adaptivity = React.useMemo(() => {
     const nextProps: AdaptivityProps = {
       viewWidth,

diff --git a/packages/vkui/src/components/Alert/Alert.tsx b/packages/vkui/src/components/Alert/Alert.tsx
@@ -80,7 +80,7 @@ export const Alert = ({
   dismissButtonTestId,
   getRootRef,
   ...restProps
-}: AlertProps) => {
+}: AlertProps): React.ReactNode => {
   const generatedId = React.useId();
 
   const headerId = `vkui-alert-${generatedId}-header`;

diff --git a/packages/vkui/src/components/Alert/AlertAction.tsx b/packages/vkui/src/components/Alert/AlertAction.tsx
@@ -50,7 +50,7 @@ const AlertActionBase = ({ mode, ...restProps }: AlertActionProps) => {
   );
 };
 
-export const AlertAction = (props: AlertActionProps) => {
+export const AlertAction = (props: AlertActionProps): React.ReactNode => {
   const platform = usePlatform();
 
   if (platform === 'ios') {

diff --git a/packages/vkui/src/components/Alert/AlertActions.tsx b/packages/vkui/src/components/Alert/AlertActions.tsx
@@ -27,7 +27,7 @@ export const AlertActions = ({
   onItemClick,
   actionsAlign,
   actionsLayout,
-}: AlertActionsProps) => {
+}: AlertActionsProps): React.ReactNode => {
   const platform = usePlatform();
 
   const direction: AlertProps['actionsLayout'] =

diff --git a/packages/vkui/src/components/Alert/AlertTypography.tsx b/packages/vkui/src/components/Alert/AlertTypography.tsx
@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { usePlatform } from '../../hooks/usePlatform';
 import { HasChildren } from '../../types';
 import { Caption } from '../Typography/Caption/Caption';
@@ -9,7 +10,7 @@ import styles from './Alert.module.css';
 interface AlertTypography extends HasChildren {
   id: string;
 }
-export const AlertHeader = (props: AlertTypography) => {
+export const AlertHeader = (props: AlertTypography): React.ReactNode => {
   const platform = usePlatform();
 
   switch (platform) {
@@ -19,7 +20,7 @@ export const AlertHeader = (props: AlertTypography) => {
       return <Title className={styles['Alert__header']} weight="2" level="2" {...props} />;
   }
 };
-export const AlertText = (props: AlertTypography) => {
+export const AlertText = (props: AlertTypography): React.ReactNode => {
   const platform = usePlatform();
 
   switch (platform) {

diff --git a/packages/vkui/src/components/AppRoot/AppRoot.tsx b/packages/vkui/src/components/AppRoot/AppRoot.tsx
@@ -88,7 +88,7 @@ export const AppRoot = ({
   layout,
   userSelectMode,
   ...props
-}: AppRootProps) => {
+}: AppRootProps): React.ReactNode => {
   const { hasPointer, sizeX = 'none', sizeY = 'none' } = useAdaptivity();
   const tokensClassName = useTokensClassName();
 

diff --git a/packages/vkui/src/components/AppRoot/AppRootContext.ts b/packages/vkui/src/components/AppRoot/AppRootContext.ts
@@ -24,6 +24,5 @@ export const DEFAULT_APP_ROOT_CONTEXT_VALUE: AppRootContextInterface = {
   disablePortal: false,
 };
 
-export const AppRootContext = React.createContext<AppRootContextInterface>(
-  DEFAULT_APP_ROOT_CONTEXT_VALUE,
-);
+export const AppRootContext: React.Context<AppRootContextInterface> =
+  React.createContext<AppRootContextInterface>(DEFAULT_APP_ROOT_CONTEXT_VALUE);
diff --git a/packages/vkui/src/components/AppRoot/AppRootPortal.tsx b/packages/vkui/src/components/AppRoot/AppRootPortal.tsx
@@ -15,7 +15,7 @@ export interface AppRootPortalProps extends HasChildren {
   usePortal?: boolean | HTMLElement | React.RefObject<HTMLElement> | null;
 }
 
-export const AppRootPortal = ({ children, usePortal }: AppRootPortalProps) => {
+export const AppRootPortal = ({ children, usePortal }: AppRootPortalProps): React.ReactNode => {
   const { portalRoot, mode, disablePortal } = React.useContext(AppRootContext);
   const appearance = useAppearance();
 

diff --git a/packages/vkui/src/components/AppRoot/ScrollContext.tsx b/packages/vkui/src/components/AppRoot/ScrollContext.tsx
@@ -34,21 +34,22 @@ export interface ScrollContextInterface {
   beforeScrollLockFnSetRef?: React.RefObject<Set<() => void>>;
 }
 
-export const ScrollContext = React.createContext<ScrollContextInterface>({
-  getScroll: () => ({ x: 0, y: 0 }),
-  scrollTo: noop,
-  isScrollLock: false,
-  enableScrollLock: noop,
-  disableScrollLock: noop,
-});
+export const ScrollContext: React.Context<ScrollContextInterface> =
+  React.createContext<ScrollContextInterface>({
+    getScroll: () => ({ x: 0, y: 0 }),
+    scrollTo: noop,
+    isScrollLock: false,
+    enableScrollLock: noop,
+    disableScrollLock: noop,
+  });
 
-export const useScroll = () => React.useContext(ScrollContext);
+export const useScroll = (): ScrollContextInterface => React.useContext(ScrollContext);
 
 export interface ScrollControllerProps extends HasChildren {
   elRef: React.RefObject<HTMLElement>;
 }
 
-export const GlobalScrollController = ({ children }: ScrollControllerProps) => {
+export const GlobalScrollController = ({ children }: ScrollControllerProps): React.ReactNode => {
   const { window, document } = useDOM();
   const [isScrollLock, setScrollLock] = React.useState(false);
   const beforeScrollLockFnSetRef = React.useRef<Set<() => void>>(new Set());
@@ -117,7 +118,10 @@ export const GlobalScrollController = ({ children }: ScrollControllerProps) => {
   return <ScrollContext.Provider value={scrollController}>{children}</ScrollContext.Provider>;
 };
 
-export const ElementScrollController = ({ elRef, children }: ScrollControllerProps) => {
+export const ElementScrollController = ({
+  elRef,
+  children,
+}: ScrollControllerProps): React.ReactNode => {
   const [isScrollLock, setScrollLock] = React.useState(false);
   const beforeScrollLockFnSetRef = React.useRef<Set<() => void>>(new Set());
 
@@ -199,7 +203,10 @@ export const ElementScrollController = ({ elRef, children }: ScrollControllerPro
  * @param effect функция, которая может возвращать функцию очистки
  * @param deps effect обновится только при изменении значений в списке.
  */
-export const useScrollLockEffect = (effect: React.EffectCallback, deps: React.DependencyList) => {
+export const useScrollLockEffect = (
+  effect: React.EffectCallback,
+  deps: React.DependencyList,
+): void => {
   const destructorRef = React.useRef<ReturnType<React.EffectCallback>>(noop);
   const { isScrollLock, beforeScrollLockFnSetRef } = useScroll();
 
@@ -232,7 +239,7 @@ export const useScrollLockEffect = (effect: React.EffectCallback, deps: React.De
   }, [isScrollLock]);
 };
 
-export const useScrollLock = (enabled = true) => {
+export const useScrollLock = (enabled = true): void => {
   const { enableScrollLock, disableScrollLock, isScrollLock } = useScroll();
   useIsomorphicLayoutEffect(() => {
     if (enabled && !isScrollLock) {

diff --git a/packages/vkui/src/components/AppRoot/helpers.ts b/packages/vkui/src/components/AppRoot/helpers.ts
@@ -45,19 +45,20 @@ export function getClassNamesByMode({
   return [baseClassNames, stylesClassNames];
 }
 
-export const getParentElement = (el: HTMLElement | null) => (el ? el.parentElement : null);
+export const getParentElement = (el: HTMLElement | null): HTMLElement | null =>
+  el ? el.parentElement : null;
 
 export const extractPortalRootByProp = (
   portalRootProp: HTMLElement | React.RefObject<HTMLElement>,
-) => (isRefObject(portalRootProp) ? portalRootProp.current : portalRootProp);
+): HTMLElement | null => (isRefObject(portalRootProp) ? portalRootProp.current : portalRootProp);
 
 export const CUSTOM_PROPERTY_INSET_PREFIX = `--vkui_internal--safe_area_inset_`;
 
 export const setSafeAreaInsets = (
   safeAreaInsets: SafeAreaInsets | undefined,
   rootContainer: HTMLElement,
   portalContainer?: HTMLElement,
-) => {
+): (() => void) => {
   if (!safeAreaInsets) {
     return () => void 0;
   }

diff --git a/packages/vkui/src/components/AppearanceProvider/AppearanceProvider.tsx b/packages/vkui/src/components/AppearanceProvider/AppearanceProvider.tsx
@@ -12,7 +12,10 @@ export interface AppearanceProviderProps {
 /**
  * @see https://vkcom.github.io/VKUI/#/AppearanceProvider
  */
-export const AppearanceProvider = ({ value, children }: AppearanceProviderProps) => {
+export const AppearanceProvider = ({
+  value,
+  children,
+}: AppearanceProviderProps): React.ReactNode => {
   return (
     <ConfigProviderOverride appearance={value}>
       <IconAppearanceProvider value={value}>

diff --git a/packages/vkui/src/components/Avatar/Avatar.tsx b/packages/vkui/src/components/Avatar/Avatar.tsx
@@ -75,7 +75,12 @@ export interface AvatarProps extends Omit<ImageBaseProps, 'widthSize' | 'heightS
 /**
  * @see https://vkcom.github.io/VKUI/#/Avatar
  */
-export const Avatar = ({
+export const Avatar: React.FC<AvatarProps> & {
+  Badge: typeof AvatarBadge;
+  BadgeWithPreset: typeof AvatarBadgeWithPreset;
+  Overlay: typeof ImageBase.Overlay;
+  getInitialsFontSize: typeof getInitialsFontSize;
+} = ({
   size = AVATAR_DEFAULT_SIZE,
   className,
   gradientColor,

diff --git a/packages/vkui/src/components/Avatar/AvatarBadge/AvatarBadge.tsx b/packages/vkui/src/components/Avatar/AvatarBadge/AvatarBadge.tsx
@@ -5,7 +5,10 @@ import styles from './AvatarBadge.module.css';
 
 export type AvatarBadgeProps = ImageBaseBadgeProps;
 
-export const AvatarBadge = ({ className, ...restProps }: AvatarBadgeProps) => {
+export const AvatarBadge: React.FC<AvatarBadgeProps> = ({
+  className,
+  ...restProps
+}: AvatarBadgeProps) => {
   const { size } = React.useContext(ImageBaseContext);
   return (
     <ImageBase.Badge

diff --git a/packages/vkui/src/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.tsx b/packages/vkui/src/components/Avatar/AvatarBadge/AvatarBadgeWithPreset.tsx
@@ -19,7 +19,7 @@ export interface AvatarBadgeWithPresetProps
   preset?: 'online' | 'online-mobile';
 }
 
-export const AvatarBadgeWithPreset = ({
+export const AvatarBadgeWithPreset: React.FC<AvatarBadgeWithPresetProps> = ({
   preset = 'online',
   className,
   ...restProps

diff --git a/packages/vkui/src/components/Avatar/AvatarBadge/icons.tsx b/packages/vkui/src/components/Avatar/AvatarBadge/icons.tsx
@@ -8,7 +8,7 @@ export const Icon12Circle = ({
   width = 12,
   height = 12,
   ...restProps
-}: React.ComponentProps<typeof Icon12CircleLib>) => {
+}: React.ComponentProps<typeof Icon12CircleLib>): React.ReactNode => {
   return (
     <Icon12CircleLib {...restProps} width={width >= 24 ? 15 : 12} height={height >= 24 ? 15 : 12} />
   );
@@ -18,7 +18,7 @@ export const Icon12OnlineMobile = ({
   width = 8,
   height = 12,
   ...restProps
-}: React.ComponentProps<typeof Icon12OnlineMobileLib>) => {
+}: React.ComponentProps<typeof Icon12OnlineMobileLib>): React.ReactNode => {
   return (
     <Icon12OnlineMobileLib
       {...restProps}

diff --git a/packages/vkui/src/components/Badge/Badge.tsx b/packages/vkui/src/components/Badge/Badge.tsx
@@ -17,7 +17,7 @@ export interface BadgeProps extends RootComponentProps<HTMLSpanElement> {
  *
  * TODO [>=7]: переименовать в Dot
  */
-export const Badge = ({ mode = 'new', children, ...restProps }: BadgeProps) => (
+export const Badge = ({ mode = 'new', children, ...restProps }: BadgeProps): React.ReactNode => (
   <RootComponent
     Component="span"
     baseClassName={classNames(styles['Badge'], stylesMode[mode])}

diff --git a/packages/vkui/src/components/Banner/Banner.tsx b/packages/vkui/src/components/Banner/Banner.tsx
@@ -97,7 +97,7 @@ export const Banner = ({
   onDismiss,
   dismissLabel = 'Скрыть',
   ...restProps
-}: BannerProps) => {
+}: BannerProps): React.ReactNode => {
   const platform = usePlatform();
 
   const HeaderTypography = size === 'm' ? Title : Headline;