refactor: replace ts-expect-error with ts-ignore

src/axe/testA11y.ts

@@ -22,7 +22,7 @@ import {render} from '@testing-library/react';
  * ```
  */
 
-// @ts-expect-error TS7006
+// @ts-ignore TS7006
 export default async function testA11y(node, axeOptions?) {
   const container = React.isValidElement(node)
     ? render(node, axeOptions).container

src/chromatic/HoverStyle.tsx

@@ -48,17 +48,17 @@ const applyHoverStates = (
 
   const hoverStylesheet = hStylesheet.sheet;
 
-  // @ts-expect-error TS18047
+  // @ts-ignore TS18047
   if (!hoverStylesheet.cssRules || hoverStylesheet.cssRules.length !== 0) {
     return;
   }
 
   const insertUnhoveredRule = (unhoveredSelector: string) => {
     if (unhoveredSelector) {
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       hoverStylesheet.insertRule(
         unhoveredSelector,
-        // @ts-expect-error TS18047
+        // @ts-ignore TS18047
         hoverStylesheet.cssRules.length
       );
     }
@@ -72,7 +72,7 @@ const applyHoverStates = (
       if (conditionText) {
         Array.from((rule as CSSGroupingRule).cssRules).forEach(r => {
           insertUnhoveredRule(
-            // @ts-expect-error TS2345
+            // @ts-ignore TS2345
             generateUnhoveredSelector(
               r as CSSStyleRule,
               hoverContainerId,
@@ -82,7 +82,7 @@ const applyHoverStates = (
         });
       } else {
         insertUnhoveredRule(
-          // @ts-expect-error TS2345
+          // @ts-ignore TS2345
           generateUnhoveredSelector(rule as CSSStyleRule, hoverContainerId)
         );
       }
@@ -103,7 +103,7 @@ const HoverStyle = ({
   const hoverContainerId = 'hover-container';
 
   React.useEffect(() => {
-    // @ts-expect-error TS2345
+    // @ts-ignore TS2345
     applyHoverStates(hoverContainerId, styleheetRef.current);
   }, []);
 

src/chromatic/utils.tsx

@@ -27,7 +27,7 @@ export const generateChromaticStory: any = (
           const storyName = !isNew && storyToHover;
 
           return (
-            // @ts-expect-error TS2322
+            // @ts-ignore TS2322
             <HoverStyle storyName={storyName} key={storyName || i}>
               <HoverStory {...module.default.args} {...HoverStory.args} />
             </HoverStyle>
@@ -37,7 +37,7 @@ export const generateChromaticStory: any = (
   );
 };
 
-// @ts-expect-error TS7006
+// @ts-ignore TS7006
 const mergeStories: any = module => {
   const stories = Object.keys(module)
     .filter(

src/components/accordion/Accordion.chromatic.stories.tsx

@@ -14,7 +14,7 @@ const copy = {
     "Now your family member just needs to open the link and hit 'accept'. If they aren't already on Brainly",
 };
 
-// @ts-expect-error TS7006
+// @ts-ignore TS7006
 const WithTooltip = args => {
   const handleChange = () => null;
 

src/components/accordion/Accordion.tsx

@@ -167,7 +167,7 @@ const Accordion = ({
     const wrapper = wrapperRef.current;
 
     function handleKeyDown(event: KeyboardEvent) {
-      // @ts-expect-error TS7053
+      // @ts-ignore TS7053
       const key = KEY_CODES[event.keyCode];
 
       if (['space', 'enter'].includes(key)) {

src/components/action-list/ActionList.spec.tsx

@@ -18,31 +18,31 @@ describe('ActionList', () => {
     );
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list')).toEqual(true);
   });
 
   it('to-right', () => {
     const actionList = render(<ActionList direction={DIRECTION.TO_RIGHT} />);
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--to-right')).toEqual(true);
   });
 
   it('to-top', () => {
     const actionList = render(<ActionList toTop />);
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--to-top')).toEqual(true);
   });
 
   it('baseline', () => {
     const actionList = render(<ActionList align={ALIGNMENT.BASELINE} />);
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--align-baseline')).toEqual(
       true
     );
@@ -52,7 +52,7 @@ describe('ActionList', () => {
     const actionList = render(<ActionList direction={DIRECTION.CENTERED} />);
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--centered')).toEqual(true);
   });
 
@@ -62,7 +62,7 @@ describe('ActionList', () => {
     );
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--space-between')).toEqual(
       true
     );
@@ -74,7 +74,7 @@ describe('ActionList', () => {
     );
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--space-around')).toEqual(
       true
     );
@@ -86,7 +86,7 @@ describe('ActionList', () => {
     );
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--space-evenly')).toEqual(
       true
     );
@@ -96,7 +96,7 @@ describe('ActionList', () => {
     const actionList = render(<ActionList noWrap />);
     const root = actionList.container.firstElementChild;
 
-    // @ts-expect-error TS18047
+    // @ts-ignore TS18047
     expect(root.classList.contains('sg-actions-list--no-wrap')).toEqual(true);
   });
 });

src/components/action-list/ActionListHole.spec.tsx

@@ -14,7 +14,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole'
       )
@@ -27,7 +27,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--container'
       )
@@ -39,7 +39,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--no-spacing'
       )
@@ -51,7 +51,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--space-bellow'
       )
@@ -63,7 +63,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--no-shrink'
       )
@@ -73,7 +73,7 @@ describe('<ActionListHole />', () => {
     const actionListHole = render(<ActionListHole grow>test</ActionListHole>);
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--grow'
       )
@@ -83,7 +83,7 @@ describe('<ActionListHole />', () => {
     const actionListHole = render(<ActionListHole toEnd>test</ActionListHole>);
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--to-end'
       )
@@ -95,7 +95,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--to-right'
       )
@@ -107,7 +107,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--to-right'
       )
@@ -121,7 +121,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--spaced-small'
       )
@@ -135,7 +135,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--spaced-xsmall'
       )
@@ -147,7 +147,7 @@ describe('<ActionListHole />', () => {
     );
 
     expect(
-      // @ts-expect-error TS18047
+      // @ts-ignore TS18047
       actionListHole.container.firstElementChild.classList.contains(
         'sg-actions-list__hole--equal-width'
       )

src/components/box/Box.chromatic.stories.tsx

@@ -6,7 +6,7 @@ import {
   responsivePropsStoryLabel,
 } from '../../chromatic/utils';
 
-// @ts-expect-error TS7006
+// @ts-ignore TS7006
 export const ResponsiveProps = args => {
   return (
     <div>

src/components/buttons/Button.tsx

@@ -369,7 +369,7 @@ const Button = React.forwardRef(
       ico = <span className={iconClass}>{icon}</span>;
     }
 
-    // @ts-expect-error TS7006
+    // @ts-ignore TS7006
     const onButtonClick = e => {
       if (isLink && isDisabled) {
         return;
@@ -386,7 +386,7 @@ const Button = React.forwardRef(
         className={btnClass}
         href={href}
         disabled={isDisabled}
-        // @ts-expect-error generics while using React.forwardRef
+        // @ts-ignore generics while using React.forwardRef
         ref={ref}
         target={target}
         aria-label={ariaLabel}

src/components/buttons/ButtonLite.tsx

@@ -217,7 +217,7 @@ const ButtonLite = ({
     );
   }
 
-  // @ts-expect-error TS7006
+  // @ts-ignore TS7006
   const onButtonClick = e => {
     if (isLink && isDisabled) {
       return;

src/components/card-interactive/CardCheckbox.tsx

@@ -168,7 +168,7 @@ export const CardCheckboxRoot = React.forwardRef<
     };
 
     const onInputChange = React.useCallback(
-      // @ts-expect-error TS7006
+      // @ts-ignore TS7006
       e => {
         if (!isControlled) {
           setIsChecked(val => !val);
@@ -189,9 +189,9 @@ export const CardCheckboxRoot = React.forwardRef<
       <CardCheckboxContext.Provider
         value={{
           checked: isChecked,
-          // @ts-expect-error TS2322
+          // @ts-ignore TS2322
           indeterminate,
-          // @ts-expect-error TS2322
+          // @ts-ignore TS2322
           disabled,
         }}
       >

src/components/card-interactive/CardRadio.tsx

@@ -153,7 +153,7 @@ const CardRadio = React.forwardRef<HTMLInputElement, CardRadioPropsType>(
       <CardRadioContext.Provider
         value={{
           checked: isChecked,
-          // @ts-expect-error TS2322
+          // @ts-ignore TS2322
           disabled,
         }}
       >

src/components/chip/Chip.tsx

@@ -151,11 +151,11 @@ const Chip = ({
 
   const isControlled = checked !== undefined || isWithinChipGroup;
   const isChecked = isControlled
-    ? // @ts-expect-error TS2345
+    ? // @ts-ignore TS2345
       checked ?? isCheckedWithinGroup(chipGroupContext.groupValue, value)
     : undefined;
 
-  // @ts-expect-error TS7006
+  // @ts-ignore TS7006
   const onInputChange = e => {
     if (isWithinChipGroup) {
       chipGroupContext.onChipChange(e, value);

src/components/chip/ChipGroup.spec.tsx

@@ -8,7 +8,7 @@ import {testA11y} from '../../axe';
 const chips = ['option-a', 'option-b'];
 
 describe('<ChipGroup />', () => {
-  // @ts-expect-error TS7006
+  // @ts-ignore TS7006
   const renderChipGroup = props =>
     render(
       <ChipGroup {...props} name="chipgroup">

src/components/chip/ChipGroup.tsx

@@ -92,7 +92,7 @@ const getGroupValue = (
 ) => {
   if (multiSelect) {
     if (Array.isArray(currentValue)) {
-      // @ts-expect-error TS2345
+      // @ts-ignore TS2345
       return currentValue.includes(toggledValue)
         ? currentValue.filter(v => v !== toggledValue)
         : [...currentValue, toggledValue];
@@ -123,13 +123,13 @@ const ChipGroup = ({
   const [selectedValue, setSelectedValue] = React.useState(value || null);
 
   React.useEffect(() => {
-    // @ts-expect-error TS2345
+    // @ts-ignore TS2345
     setSelectedValue(value);
   }, [value]);
 
-  // @ts-expect-error TS7006
+  // @ts-ignore TS7006
   const setValue = (event, chipValue) => {
-    // @ts-expect-error TS2345
+    // @ts-ignore TS2345
     setSelectedValue(getGroupValue(selectedValue, chipValue, multiSelect));
     if (onChange) onChange(event, chipValue);
   };