Fix TypeScript errors and update dependencies

- Fix ReactPortal return types in PopupWindow, Tooltip, Modal
- Fix RefObject type compatibility for React 18
- Update extension-dapp dependency to 0.62.19
- Update vanitygen dependency to 1.0.1
- Add eslint-scope resolution for webpack
- Remove unused @ts-expect-error directives
- Update mobile test snapshots

pezkuwi-sdk-ui/packages/react-components/src/AccountSidebar/AddressSection.tsx

@@ -65,8 +65,7 @@ function AddressSection ({ accountIndex, defaultValue, editingName, flags, onCha
       </div>
       <div className='ui--AddressSection__CopyColumn'>
         <div className='ui--AddressMenu-copyaddr'>
-          {/* @ts-expect-error React 18 type compatibility */}
-          <CopyToClipboard
+            <CopyToClipboard
             text={value}
           >
             <span>

pezkuwi-sdk-ui/packages/react-components/src/AccountSidebar/SidebarEditableSection.tsx

@@ -16,7 +16,7 @@ interface Props {
   address: string;
   isBeingEdited: (arg: boolean) => void;
   onUpdateName?: (() => void) | null;
-  sidebarRef: React.RefObject<HTMLDivElement>;
+  sidebarRef: React.RefObject<HTMLDivElement | null>;
 }
 
 function SidebarEditableSection ({ accountIndex, address, isBeingEdited, onUpdateName, sidebarRef }: Props): React.ReactElement<Props> {

pezkuwi-sdk-ui/packages/react-components/src/CopyButton.tsx

@@ -46,7 +46,6 @@ function CopyButton ({ children, className = '', icon = 'copy', label, type, val
 
   return (
     <StyledDiv className={`${className} ui--CopyButton`}>
-      {/* @ts-expect-error React 18 type compatibility */}
       <CopyToClipboard
         onCopy={_onCopy}
         text={value as string}

pezkuwi-sdk-ui/packages/react-components/src/Modal/index.tsx

@@ -24,7 +24,7 @@ interface Props {
   testId?: string;
 }
 
-function ModalBase ({ children, className = '', header, onClose, size = 'medium', testId = 'modal' }: Props): React.ReactElement<Props> {
+function ModalBase ({ children, className = '', header, onClose, size = 'medium', testId = 'modal' }: Props): React.ReactPortal {
   const { themeClassName } = useTheme();
 
   const listenKeyboard = useCallback((event: KeyboardEvent) => {

pezkuwi-sdk-ui/packages/react-components/src/Popup/PopupWindow.tsx

@@ -10,14 +10,14 @@ import { usePopupWindow } from '@pezkuwi/react-hooks/usePopupWindow';
 
 import { styled } from '../styled.js';
 
-function PopupWindow ({ children, className = '', position, triggerRef, windowRef }: Props): React.ReactElement<Props> {
+function PopupWindow ({ children, className = '', position, triggerRef, windowRef }: Props): React.ReactPortal {
   const { pointerStyle, renderCoords: { x, y } } = usePopupWindow(windowRef, triggerRef, position);
 
   return createPortal(
     <StyledDiv
       className={`${className} ${pointerStyle}Pointer ${position}Position`}
       data-testid='popup-window'
-      ref={windowRef}
+      ref={windowRef as React.RefObject<HTMLDivElement>}
       style={
         (x && y && {
           transform: `translate3d(${x}px, ${y}px, 0)`,

pezkuwi-sdk-ui/packages/react-components/src/Popup/types.ts

@@ -17,8 +17,8 @@ export type VerticalPosition = 'top' | 'bottom'
 export interface PopupWindowProps {
   className?: string;
   children?: React.ReactNode;
-  windowRef: React.RefObject<HTMLDivElement>;
-  triggerRef: React.RefObject<HTMLDivElement>;
+  windowRef: React.RefObject<HTMLDivElement | null>;
+  triggerRef: React.RefObject<HTMLDivElement | null>;
   position: HorizontalPosition;
 }
 

pezkuwi-sdk-ui/packages/react-components/src/Sidebar.tsx

@@ -14,7 +14,7 @@ interface Props {
   offset?: number | string;
   onClose?: () => void;
   position: 'left' | 'right';
-  sidebarRef: React.RefObject<HTMLDivElement>;
+  sidebarRef: React.RefObject<HTMLDivElement | null>;
 }
 
 function Sidebar ({ buttons, children, className = '', dataTestId = '', onClose, position, sidebarRef }: Props): React.ReactElement<Props> {
@@ -22,7 +22,7 @@ function Sidebar ({ buttons, children, className = '', dataTestId = '', onClose,
     <StyledDiv
       className={`${className} ui--Sidebar ${position}Position`}
       data-testid={dataTestId}
-      ref={sidebarRef}
+      ref={sidebarRef as React.RefObject<HTMLDivElement>}
     >
       <Button.Group className='ui--Sidebar-buttons'>
         {buttons}

pezkuwi-sdk-ui/packages/react-components/src/Tooltip.tsx

@@ -22,7 +22,7 @@ interface Props {
   trigger: string;
 }
 
-function Tooltip ({ children, className = '', isClickable = false, place, text, trigger }: Props): React.ReactElement<Props> | null {
+function Tooltip ({ children, className = '', isClickable = false, place, text, trigger }: Props): React.ReactPortal {
   const [tooltipContainer] = useState(
     typeof document === 'undefined'
       ? {} as HTMLElement // This hack is required for server side rendering