Fix typescript and eslint errors

Kubit · Kubit · commit 1ddd0de2f369 · 2024-11-05T10:22:15.000+01:00
diff --git a/src/components/actionBottomSheet/actionBottomSheetControlled.tsx b/src/components/actionBottomSheet/actionBottomSheetControlled.tsx
@@ -85,7 +85,7 @@ const ActionBottomSheetControlledComponent = React.forwardRef(
     ref: React.ForwardedRef<HTMLDivElement> | undefined | null
   ): JSX.Element => {
     const uniqueTitleId = useId('actionSheet-title');
-    const titleId = title?.id ?? title?.content ? uniqueTitleId : undefined;
+    const titleId = (title?.id ?? title?.content) ? uniqueTitleId : undefined;
     const styles = useStyles<ActionBottomSheetVariantStylesType>(
       STYLES_NAME.ACTION_BOTTOM_SHEET,
       props.variant,
diff --git a/src/components/drawer/drawerStandAlone.tsx b/src/components/drawer/drawerStandAlone.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import * as React from 'react';
 
 import { ElementOrIcon } from '@/components/elementOrIcon';
@@ -53,7 +54,7 @@ const DrawerStandAloneComponent = (
         <DrawerTitleContentFooterContainerStyled blocked={blocked} styles={props.styles}>
           <DrawerTitleStyled
             data-drawer-title
-            as={Text}
+            as={Text as any}
             component={titleComponent as unknown as TextComponentType}
             customTypography={props.styles.title}
             id={titleIdFinal}
@@ -78,7 +79,7 @@ const DrawerStandAloneComponent = (
           {props.footer?.content && (props.styles.footer?.variant || props.footer.variant) && (
             <DrawerFooterStyled
               data-drawer-footer
-              as={Footer}
+              as={Footer as any}
               customFooterStyles={props.styles}
               variant={props.styles.footer?.variant}
               {...props.footer}
diff --git a/src/components/index.ts b/src/components/index.ts
@@ -85,11 +85,6 @@ export * from './tableV2';
 export * from './dataTable';
 export * from './video';
 export * from './progressBar';
-export * from './inputDigitPassword';
-export * from './statusCard';
-export * from './selectorBox';
-export * from './banner';
-export * from './navBar';
 export * from './virtualKeyboard';
 
 /**
@@ -115,15 +110,6 @@ export * from './headerStructure';
 export * from './footer';
 export * from './portal';
 export * from './textCount';
-export * from './accordionSideMenu';
-export * from './secondaryTabs';
-export * from './wizardFooter';
-export * from './quickCardHighlights';
-export * from './wizard';
-export * from './crossellModule';
-export * from './commercialCard';
 export * from './operativeLayout';
 export * from './emptyState';
 export * from './loadingState';
-export * from './cardSelector';
-export * from './cardInformative';
diff --git a/src/components/inputCurrency/__tests__/inputCurrency.test.tsx b/src/components/inputCurrency/__tests__/inputCurrency.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 
 import { axe } from 'jest-axe';
 
-import { InputContentPosition, InputState } from '@/components/input/types';
+import { FormatNumber, InputContentPosition, InputState } from '@/components/input/types';
 import { renderProvider } from '@/tests/renderProvider/renderProvider.utility';
 import { POSITIONS } from '@/types/positions';
 
@@ -28,7 +28,7 @@ const format = {
   style: 'decimal',
   maximumFractionDigits: 3,
   minimumFractionDigits: 1,
-};
+} as FormatNumber;
 
 describe('New Input Currency Component', () => {
   test('Should render InputCurrency component', async () => {
diff --git a/src/components/mediaButton/stories/mediaButton.stories.tsx b/src/components/mediaButton/stories/mediaButton.stories.tsx
@@ -88,4 +88,4 @@ export const MediabuttonWithCtv: Story = {
       },
     },
   },
-};
+};
diff --git a/src/components/navigationCard/navigationCardStandAlone.tsx b/src/components/navigationCard/navigationCardStandAlone.tsx
@@ -36,7 +36,8 @@ const NavigationCardStandaloneComponent = (
   return (
     // Can not be spread -> styled component breaks
     <NavigationCardStyled
-      ref={ref as React.ForwardedRef<HTMLButtonElement>}
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      ref={ref as any}
       aria-disabled={props['aria-disabled']}
       as={props.url ? props.component : 'button'}
       className={props.className}
diff --git a/src/components/navigationRow/stories/navigationRow.stories.tsx b/src/components/navigationRow/stories/navigationRow.stories.tsx
@@ -28,7 +28,7 @@ const commonArgs: INavigationRow = {
   text: { content: 'Text' },
   description: { content: 'Lorem ipsum dolor sit amet lorem' },
   arrowIcon: { icon: ICONS.ICON_PLACEHOLDER },
-  decorativeElement: <ElementOrIcon icon={ICONS.ICON_PLACEHOLDER} altText="decorativeElement" />,
+  decorativeElement: <ElementOrIcon altText="decorativeElement" icon={ICONS.ICON_PLACEHOLDER} />,
 };
 
 export const NavigationRow: Story = {
diff --git a/src/components/pillV2/pill.tsx b/src/components/pillV2/pill.tsx
@@ -9,7 +9,7 @@ import { getPillState } from './utils';
 
 const PillComponent = (
   { variant, size, ctv, selected = false, disabled = false, ...props }: IPill,
-  ref: React.ForwardedRef<HTMLDivElement>
+  ref: React.ForwardedRef<HTMLButtonElement>
 ) => {
   const variantStyles = useStylesV2<PillVariantPropsStylesType>({
     styleName: STYLES_NAME.PILL_V2,
diff --git a/src/components/pillV2/pillStandAlone.tsx b/src/components/pillV2/pillStandAlone.tsx
@@ -18,7 +18,7 @@ import { IPillStandAlone, PillType } from './types';
 
 const PillStandAloneComponent = (
   { dataTestId = 'pill', type = PillType.BUTTON, ...props }: IPillStandAlone,
-  ref: React.ForwardedRef<HTMLDivElement> | undefined | null
+  ref: React.ForwardedRef<HTMLButtonElement> | undefined | null
 ): JSX.Element => {
   const id = useId('pill');
   const pillContentId = `${id}-content`;
diff --git a/src/components/table/stories/mockCustomizable.tsx b/src/components/table/stories/mockCustomizable.tsx
@@ -41,7 +41,7 @@ export const mockCustomizableTable = {
             <div>{value.surname}</div>
           </div>
         ) : (
-          value.name.value ?? value.name
+          (value.name.value ?? value.name)
         ),
     },
     {
diff --git a/src/components/toggle/components/toggleThreePosition.tsx b/src/components/toggle/components/toggleThreePosition.tsx
@@ -37,8 +37,8 @@ const ToggleThreePositionComponent = (
     position === POSITIONS.CENTER
       ? inputValues.centerInputValue
       : position === POSITIONS.RIGHT
-        ? inputValues.rightInputValue ?? props.onIcon?.altText
-        : inputValues.leftInputValue ?? props.offIcon?.altText;
+        ? (inputValues.rightInputValue ?? props.onIcon?.altText)
+        : (inputValues.leftInputValue ?? props.offIcon?.altText);
 
   const buildTextOrIcon = (position: POSITIONS) => {
     return (
@@ -153,7 +153,7 @@ const ToggleThreePositionComponent = (
       hasThreePositions={props.hasThreePositions}
       id={props.id}
       styles={props.styles}
-      tabIndex={!props.disabled ? props.tabIndex ?? 0 : undefined}
+      tabIndex={!props.disabled ? (props.tabIndex ?? 0) : undefined}
       togglePosition={props.togglePosition}
       onKeyDown={e => {
         e.persist();
diff --git a/src/components/toggle/components/toggleTwoPositions.tsx b/src/components/toggle/components/toggleTwoPositions.tsx
@@ -55,7 +55,7 @@ const ToggleTwoPositionComponent = (
       id={props.id}
       role={ROLES.SWITCH}
       styles={props.styles}
-      tabIndex={!props.disabled ? props.tabIndex ?? 0 : undefined}
+      tabIndex={!props.disabled ? (props.tabIndex ?? 0) : undefined}
       togglePosition={props.togglePosition}
       onClick={e => {
         e.persist();
diff --git a/src/components/tooltip/stories/tooltip.stories.tsx b/src/components/tooltip/stories/tooltip.stories.tsx
@@ -1,5 +1,4 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import React from 'react';
 
 import { ICONS } from '@/assets';
 import { STYLES_NAME } from '@/constants';
diff --git a/src/components/tooltip/utils/tooltip.utils.ts b/src/components/tooltip/utils/tooltip.utils.ts
@@ -1,6 +1,3 @@
-import { PopoverComponentType } from '@/components/popover';
-import { DeviceBreakpointsType } from '@/types';
-
 // build descriptive id for aria-describedby or aria-labelledby
 export const getAriaDescriptorsBy = ({
   title,
diff --git a/src/constants/keyboardKeys.ts b/src/constants/keyboardKeys.ts
@@ -67,8 +67,8 @@ const ARROW_DOWN = {
 
 const DELETE = {
   key: 'Delete',
-  which: 8 || 46,
-  keyCode: 8 || 46,
+  which: 46,
+  keyCode: 46,
   code: 'ArrowDecimal',
 };
 
diff --git a/src/designSystem/kubit/components/styles.ts b/src/designSystem/kubit/components/styles.ts
@@ -90,21 +90,6 @@ export * from './tableCaption/styles';
 export * from './tableDivider/styles';
 export * from './tableV2/styles';
 export * from './dataTable/styles';
-
-export * from './cardSelector/styles';
 export * from './video/styles';
 export * from './virtualKeyboard/styles';
-export * from './wizard/styles';
-export * from './statusCard/styles';
-export * from './secondaryTabs/styles';
-export * from './selectorBox/styles';
-export * from './cardInformative/styles';
-export * from './commercialCard/styles';
-export * from './crossellModule/styles';
-export * from './banner/styles';
-export * from './wizardFooter/styles';
-export * from './quickCardHighlights/styles';
 export * from './progressBar/styles';
-export * from './navBar/styles';
-export * from './accordionSideMenu/styles';
-export * from './inputDigitPassword/styles';
diff --git a/src/designSystem/kubit/components/variants.ts b/src/designSystem/kubit/components/variants.ts
@@ -90,20 +90,6 @@ export * from './tableCaption/variants';
 export * from './tableDivider/variants';
 export * from './tableV2/variants';
 export * from './dataTable/variants';
-export * from './inputDigitPassword/variants';
-export * from './cardSelector/variants';
 export * from './video/variants';
 export * from './virtualKeyboard/variants';
-export * from './wizard/variants';
-export * from './statusCard/variants';
-export * from './secondaryTabs/variants';
-export * from './selectorBox/variants';
-export * from './cardInformative/variants';
-export * from './commercialCard/variants';
-export * from './crossellModule/variants';
-export * from './banner/variants';
-export * from './wizardFooter/variants';
-export * from './quickCardHighlights/variants';
 export * from './progressBar/variants';
-export * from './accordionSideMenu/variants';
-export * from './navBar/variants';
diff --git a/src/hooks/useInput/__tests__/useInput.test.ts b/src/hooks/useInput/__tests__/useInput.test.ts
@@ -1,14 +1,15 @@
 import { act, renderHook } from '@testing-library/react-hooks';
 import React, { ChangeEvent } from 'react';
 
+import { FormatNumber } from '@/components';
 import * as validationsProvider from '@/provider/validations/validationsProvider';
 
 import { useInput } from '../useInput';
 
 describe('useInput Hook', () => {
   it('useInput - on internal change should call parent onChange', () => {
     const onChange = jest.fn();
-    const formatNumber = { style: 'decimal' };
+    const formatNumber = { style: 'decimal' } as FormatNumber;
     const ref = React.createRef<HTMLInputElement | undefined>();
     const currentValue = '123234';
     const regex = new RegExp('^[0-9]*$');
@@ -43,7 +44,7 @@ describe('useInput Hook', () => {
   });
   it('useInput - on internal blur should call parent onBlur', () => {
     const onBlur = jest.fn();
-    const formatNumber = { style: 'decimal' };
+    const formatNumber = { style: 'decimal' } as FormatNumber;
     const { result } = renderHook(() => useInput({ onBlur, formatNumber }));
 
     act(() => {
diff --git a/src/storybook/components/icons/icons.tsx b/src/storybook/components/icons/icons.tsx
@@ -10,6 +10,7 @@ import { IconNameStyled, IconsDataStyled, IconsInputStyled, IconsStyled } from '
 export const Icons = (): JSX.Element => {
   const [searchValue, setSearchValue] = React.useState('');
 
+  // eslint-disable-next-line n/no-unsupported-features/node-builtins
   const theme = localStorage.getItem('themeSelected') || 'kubit';
   const themeObject = themesObject[theme]['ICONS'];
 
diff --git a/src/types/styled.d.ts b/src/types/styled.d.ts
@@ -17,6 +17,5 @@ export interface CustomTheme {
 }
 
 declare module 'styled-components' {
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
   export interface DefaultTheme extends CustomTheme {}
 }
diff --git a/tsconfig.tsbuildinfo b/tsconfig.tsbuildinfo

-Original file line number
+Diff line change
       },
     },
   },
 -};
 +};
Original file line number	Diff line number	Diff line change
`@@ -41,7 +41,7 @@ export const mockCustomizableTable = {`
`41`	`41`	`<div>{value.surname}</div>`
`42`	`42`	`</div>`
`43`	`43`	`) : (`
`44`		`- value.name.value ?? value.name`
	`44`	`+ (value.name.value ?? value.name)`
`45`	`45`	`),`
`46`	`46`	`},`
`47`	`47`	`{`