chore: upgrade to eslint-config-availity v16 and TypeScript 6

eslint.config.js

@@ -1,9 +1,11 @@
 import browser from 'eslint-config-availity/browser';
+import { withVitest } from 'eslint-config-availity/test-runners';
 import storybook from 'eslint-plugin-storybook';
 
 export default [
   ...browser,
   ...storybook.configs['flat/recommended'],
+  ...withVitest,
   {
     rules: {
       'import/extensions': 'off',
@@ -18,16 +20,6 @@ export default [
       'unicorn/no-lonely-if': 'off',
       'unicorn/no-array-for-each': 'off',
       'no-restricted-exports': 'off',
-      'jest/no-deprecated-functions': 'off',
-      'jest/no-conditional-expect': 'off',
-      'jest/no-commented-out-tests': 'off',
-    },
-  },
-  {
-    languageOptions: {
-      globals: {
-        vi: 'readonly',
-      },
     },
   },
   {

package.json

@@ -79,8 +79,9 @@
     "@types/node": "^22.20.2",
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
+    "@vitest/eslint-plugin": "^1.0.0",
     "availity-uikit": "^4.7.2",
-    "eslint-config-availity": "^14.0.0",
+    "eslint-config-availity": "^16.0.0",
     "eslint-plugin-storybook": "9.1.20",
     "husky": "^9.1.7",
     "is-ci": "^3.0.1",
@@ -103,8 +104,11 @@
     "@testing-library/jest-dom": "^6.9.1",
     "@types/prop-types": "^15.7.15",
     "@vitest/coverage-v8": "^5.0.0",
+    "eslint": "^9.0.0",
+    "eslint-node-test": "^0.4.0",
+    "eslint-plugin-jest": "^29.0.0",
     "jsdom": "^30.0.1",
-    "typescript": "5.9.3",
+    "typescript": "6.x",
     "vite": "^8.3.0",
     "vitest": "^5.0.0"
   },

packages/change-password/src/ChangePasswordForm.jsx

@@ -90,41 +90,39 @@ const ChangePasswordForm = ({
                 {success}
               </Alert>
 
-              {
-                showCurrentPassword ? (
-                  <div className="password-with-icon">
-                    <Field
-                      name="currentPassword"
-                      data-testid="current-password-input"
-                      label="Current Password"
-                      maxLength={maxLength}
-                      placeholder="Input your current password"
-                      type={currentPasswordVisible ? 'text' : 'password'}
-                      {...currentPasswordProps}
-                    />
-                    <Icon
-                      name={`eye${currentPasswordVisible ? '' : '-off'}`}
-                      data-testid="current-password-icon"
-                      id="current-password-eye"
-                      role="button"
-                      label="password-visibility"
-                      onMouseDown={(e) => {
-                        currentPasswordIconRef?.current?.focus();
-                        e.preventDefault();
+              {showCurrentPassword ? (
+                <div className="password-with-icon">
+                  <Field
+                    name="currentPassword"
+                    data-testid="current-password-input"
+                    label="Current Password"
+                    maxLength={maxLength}
+                    placeholder="Input your current password"
+                    type={currentPasswordVisible ? 'text' : 'password'}
+                    {...currentPasswordProps}
+                  />
+                  <Icon
+                    name={`eye${currentPasswordVisible ? '' : '-off'}`}
+                    data-testid="current-password-icon"
+                    id="current-password-eye"
+                    role="button"
+                    label="password-visibility"
+                    onMouseDown={(e) => {
+                      currentPasswordIconRef?.current?.focus();
+                      e.preventDefault();
+                      setCurrentPasswordVisible(!currentPasswordVisible);
+                    }}
+                    onKeyDown={(e) => {
+                      if (e.key === 'Enter' || e.key === ' ') {
                         setCurrentPasswordVisible(!currentPasswordVisible);
-                      }}
-                      onKeyDown={(e) => {
-                        if (e.keyCode === 13 || e.keyCode === 32) {
-                          setCurrentPasswordVisible(!currentPasswordVisible);
-                        }
-                      }}
-                      tabIndex={0}
-                      aria-label={currentPasswordVisible ? 'Hide Password' : 'Show Password'}
-                      ref={currentPasswordIconRef}
-                    />
-                  </div>
-                ) : null
-              }
+                      }
+                    }}
+                    tabIndex={0}
+                    aria-label={currentPasswordVisible ? 'Hide Password' : 'Show Password'}
+                    ref={currentPasswordIconRef}
+                  />
+                </div>
+              ) : null}
 
               <div className="password-with-icon">
                 <Field
@@ -149,7 +147,7 @@ const ChangePasswordForm = ({
                     setNewPasswordVisible(!newPasswordVisible);
                   }}
                   onKeyDown={(e) => {
-                    if (e.keyCode === 13 || e.keyCode === 32) {
+                    if (e.key === 'Enter' || e.key === ' ') {
                       setNewPasswordVisible(!newPasswordVisible);
                     }
                   }}
@@ -182,7 +180,7 @@ const ChangePasswordForm = ({
                     setConfirmNewPasswordVisible(!confirmNewPasswordVisible);
                   }}
                   onKeyDown={(e) => {
-                    if (e.keyCode === 13 || e.keyCode === 32) {
+                    if (e.key === 'Enter' || e.key === ' ') {
                       setConfirmNewPasswordVisible(!confirmNewPasswordVisible);
                     }
                   }}

packages/feedback/src/FeedbackButton.jsx

@@ -14,7 +14,7 @@ const FeedbackButton = ({ onClick, icon, active, children, iconSize = '', ...res
     onClick={() => {
       onClick(icon);
     }}
-    onKeyDown={({ keyCode }) => keyCode === 13 && onClick(icon)}
+    onKeyDown={({ key }) => key === 'Enter' && onClick(icon)}
     {...rest}
   >
     <Icon data-testid="feedback-icon" name={icon} size={iconSize} style={iconStyles} />

packages/feedback/src/FeedbackForm.jsx

@@ -9,6 +9,7 @@ import * as yup from 'yup';
 import SmileField from './SmileField.jsx';
 
 yup.addMethod(yup.string, 'isRequired', function format(isRequired, msg) {
+  // eslint-disable-next-line unicorn/no-this-outside-of-class
   return this.test({
     name: 'dateRange',
     exclusive: true,

packages/feedback/src/SmileField.jsx

@@ -31,10 +31,10 @@ const SmileField = ({ name, options = defaultOptions, onChange, autoFocusFeedbac
     <FeedbackButton
       autoFocus={i === 0 && autoFocusFeedbackButton}
       onKeyDown={(e) => {
-        if (e.shiftKey && e.keyCode === 9 && i === 0 && !modal) {
+        if (e.shiftKey && e.key === 'Tab' && i === 0 && !modal) {
           onClose();
         }
-        if (e.keyCode === 13) {
+        if (e.key === 'Enter') {
           setFieldValue(name, option);
           if (onChange) {
             onChange(option);

packages/feedback/src/SupportForm.jsx

@@ -78,6 +78,7 @@ function orgSelectTest(msg) {
     name: yup.string().isRequired(true, ORG_VALIDATION_MESSAGE),
   });
 
+  // eslint-disable-next-line unicorn/no-this-outside-of-class
   return this.test({
     name: 'orgSelectTest',
     exclusive: true,
@@ -128,7 +129,7 @@ const SupportForm = ({ setSupportIsActive, setBlocking, feedbackToggle }) => (
           onClick={() => setSupportIsActive(false)}
           color="secondary"
           type="button"
-          onKeyDown={({ keyCode }) => keyCode === 13 && setSupportIsActive(false)}
+          onKeyDown={({ key }) => key === 'Enter' && setSupportIsActive(false)}
         >
           Close
         </Button>

packages/form-upload/src/Upload.jsx

@@ -121,7 +121,6 @@ const Upload = ({
   );
 
   useEffect(() => {
-    // eslint-disable-next-line unicorn/consistent-function-scoping
     async function checkValidFormAndCallFileDelivery() {
       if (Object.keys(errors).length === 0) {
         // deliver all on submit

packages/form-upload/src/UploadProgressBar.jsx

@@ -40,11 +40,11 @@ const UploadProgressBar = ({ upload, ...rest }) => {
     return () => {
       mountedRef.current = false;
       const progressIdx = upload.onProgress.indexOf(onProgress);
-      if (progressIdx > -1) upload.onProgress.splice(progressIdx, 1);
+      if (progressIdx !== -1) upload.onProgress.splice(progressIdx, 1);
       const successIdx = upload.onSuccess.indexOf(onSuccess);
-      if (successIdx > -1) upload.onSuccess.splice(successIdx, 1);
+      if (successIdx !== -1) upload.onSuccess.splice(successIdx, 1);
       const errorIdx = upload.onError.indexOf(onError);
-      if (errorIdx > -1) upload.onError.splice(errorIdx, 1);
+      if (errorIdx !== -1) upload.onError.splice(errorIdx, 1);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [upload]);

packages/form/tsconfig.json

@@ -3,7 +3,8 @@
   "include": ["."],
   "compilerOptions": {
     "allowJs": true,
-    "outDir": "dist"
+    "outDir": "dist",
+    "rootDir": "../.."
   },
   "exclude": ["dist", "build", "node_modules"]
 }

packages/spaces/src/Spaces.jsx

@@ -1,4 +1,3 @@
-/* eslint-disable unicorn/prefer-spread */
 import React, { createContext, useContext, useReducer } from 'react';
 import PropTypes from 'prop-types';
 import { avWebQLApi } from '@availity/api-axios';
@@ -22,10 +21,9 @@ export const getAllSpaces = async ({ query, clientId, variables, operationName,
   const requestBody = {
     query,
     variables,
+    operationName: operationName || parseOperationName(query) || 'PuiBootstrapSpacesAnonymousOperation',
   };
 
-  requestBody.operationName = operationName || parseOperationName(query) || 'PuiBootstrapSpacesAnonymousOperation';
-
   const {
     data: {
       data: { configurationPagination },
@@ -173,7 +171,16 @@ const DEFAULT_SPACE_IDS = [];
 const DEFAULT_PAYER_IDS = [];
 const DEFAULT_SPACES = [];
 
-const Spaces = ({ query = DEFAULT_QUERY, variables = DEFAULT_VARIABLES, clientId, spaceIds = DEFAULT_SPACE_IDS, payerIds = DEFAULT_PAYER_IDS, children, spaces: spacesFromProps = DEFAULT_SPACES, operationName = 'PuiBootstrapSpacesAnonymousOperation' }) => {
+const Spaces = ({
+  query = DEFAULT_QUERY,
+  variables = DEFAULT_VARIABLES,
+  clientId,
+  spaceIds = DEFAULT_SPACE_IDS,
+  payerIds = DEFAULT_PAYER_IDS,
+  children,
+  spaces: spacesFromProps = DEFAULT_SPACES,
+  operationName = 'PuiBootstrapSpacesAnonymousOperation',
+}) => {
   const [{ previousSpacesMap, previousSpacesByConfigMap, previousSpacesByPayerMap, loading, error }, dispatch] =
     useReducer(spacesReducer, INITIAL_STATE); // TODO: react-query. Don't expose cache time options to users