downshift 9.4.0-alpha.1 → 9.4.0

package/dist/hooks/useSelect/utils/propTypes.d.ts

@@ -1,38 +1 @@
-import PropTypes from 'prop-types';
-export declare const propTypes: {
-    items: PropTypes.Validator<any[]>;
-    isItemDisabled: PropTypes.Requireable<(...args: any[]) => any>;
-    getA11yStatusMessage: PropTypes.Requireable<(...args: any[]) => any>;
-    highlightedIndex: PropTypes.Requireable<number>;
-    defaultHighlightedIndex: PropTypes.Requireable<number>;
-    initialHighlightedIndex: PropTypes.Requireable<number>;
-    isOpen: PropTypes.Requireable<boolean>;
-    defaultIsOpen: PropTypes.Requireable<boolean>;
-    initialIsOpen: PropTypes.Requireable<boolean>;
-    selectedItem: PropTypes.Requireable<any>;
-    initialSelectedItem: PropTypes.Requireable<any>;
-    defaultSelectedItem: PropTypes.Requireable<any>;
-    id: PropTypes.Requireable<string>;
-    labelId: PropTypes.Requireable<string>;
-    menuId: PropTypes.Requireable<string>;
-    getItemId: PropTypes.Requireable<(...args: any[]) => any>;
-    toggleButtonId: PropTypes.Requireable<string>;
-    onSelectedItemChange: PropTypes.Requireable<(...args: any[]) => any>;
-    onHighlightedIndexChange: PropTypes.Requireable<(...args: any[]) => any>;
-    onStateChange: PropTypes.Requireable<(...args: any[]) => any>;
-    onIsOpenChange: PropTypes.Requireable<(...args: any[]) => any>;
-    scrollIntoView: PropTypes.Requireable<(...args: any[]) => any>;
-    environment: PropTypes.Requireable<PropTypes.InferProps<{
-        addEventListener: PropTypes.Validator<(...args: any[]) => any>;
-        removeEventListener: PropTypes.Validator<(...args: any[]) => any>;
-        document: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
-            createElement: PropTypes.Validator<(...args: any[]) => any>;
-            getElementById: PropTypes.Validator<(...args: any[]) => any>;
-            activeElement: PropTypes.Validator<any>;
-            body: PropTypes.Validator<any>;
-        }>>>;
-        Node: PropTypes.Validator<(...args: any[]) => any>;
-    }>>;
-    itemToKey: PropTypes.Requireable<(...args: any[]) => any>;
-    stateReducer: PropTypes.Requireable<(...args: any[]) => any>;
-};
+export declare const propTypes: any;

package/dist/hooks/useTagGroup/__tests__/utils/renderTagGroup.d.ts

@@ -1,64 +1,2 @@
-import * as React from 'react';
 import { UseTagGroupProps } from '../../index.types';
-export declare function renderTagGroup(props?: Partial<UseTagGroupProps<string>>): {
-    getTags: () => HTMLElement[];
-    getTagGroup: () => HTMLElement;
-    clickOnTag: (index: number) => Promise<void>;
-    clickOnRemoveTag: (index: number) => Promise<void>;
-    getTagsRemoves: () => HTMLElement[];
-    user: import("@testing-library/user-event").UserEvent;
-    container: HTMLElement;
-    baseElement: HTMLElement;
-    debug: (baseElement?: ReactDOMClient.Container | any | Array<ReactDOMClient.Container | any> | undefined, maxLength?: number | undefined, options?: import("node_modules/pretty-format/build").OptionsReceived | undefined) => void;
-    rerender: (ui: React.ReactNode) => void;
-    unmount: () => void;
-    asFragment: () => DocumentFragment;
-    getByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement;
-    getAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
-    queryByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement | null;
-    queryAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
-    findByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
-    getAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    queryByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
-    queryAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    findByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement;
-    getAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
-    queryByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement | null;
-    queryAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
-    findByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
-    getAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    queryByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
-    queryAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    findByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
-    getAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    queryByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
-    queryAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    findByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
-    getAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    queryByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
-    queryAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    findByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement;
-    getAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement[];
-    queryByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement | null;
-    queryAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement[];
-    findByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-    getByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
-    getAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    queryByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
-    queryAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-    findByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
-    findAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
-};
+export declare function renderTagGroup(props?: Partial<UseTagGroupProps<string>>): any;

package/dist/hooks/useTagGroup/__tests__/utils/renderUseTagGroup.d.ts

@@ -1,2 +1,2 @@
-import { UseTagGroupProps, UseTagGroupReturnValue } from '../../index.types';
-export declare function renderUseTagGroup(initialProps?: Partial<UseTagGroupProps<string>>): import("@testing-library/react").RenderHookResult<UseTagGroupReturnValue<string>, Partial<UseTagGroupProps<string>>>;
+import { UseTagGroupProps } from '../../index.types';
+export declare function renderUseTagGroup(initialProps?: Partial<UseTagGroupProps<string>>): any;

package/dist/hooks/useTagGroup/index.types.d.ts

@@ -1,4 +1,4 @@
-import { Environment } from '../../downshift.types';
+import { AnyRef, Environment } from '../../downshift.types';
 export interface UseTagGroupState<Item> {
     activeIndex: number;
     items: Item[];
@@ -52,12 +52,12 @@ export interface UseTagGroupReturnValue<Item> {
 export interface GetTagPropsOptions extends React.HTMLProps<HTMLElement> {
     index: number;
     refKey?: string;
-    ref?: React.Ref<any>;
+    ref?: AnyRef;
 }
 export interface GetTagPropsReturnValue {
     'aria-describedby': string;
     id: string;
-    ref?: React.Ref<any>;
+    ref?: AnyRef;
     role: 'option';
     onPress?: (event: React.BaseSyntheticEvent) => void;
     onClick?: React.MouseEventHandler;
@@ -75,11 +75,11 @@ export interface GetTagRemovePropsReturnValue {
 }
 export interface GetTagGroupPropsOptions extends React.HTMLProps<HTMLElement> {
     refKey?: string;
-    ref?: React.Ref<any>;
+    ref?: AnyRef;
 }
 export interface GetTagGroupPropsReturnValue {
     id: string;
-    ref?: React.Ref<any>;
+    ref?: AnyRef;
     role: 'listbox';
     'aria-live': 'polite';
     'aria-atomic': 'false';

package/dist/hooks/utils/dropdownDefaultProps.d.ts

@@ -1,13 +1,12 @@
-import { scrollIntoView } from '../../utils';
 export declare const dropdownDefaultProps: {
     itemToString(item: unknown): string;
     itemToKey(item: unknown): unknown;
     isItemDisabled(_item: unknown): boolean;
-    stateReducer: <S, A>(_state: S, actionAndChanges: (A & {
+    stateReducer: <S, A>(_state: S, actionAndChanges: A & {
         props: any;
-    }) & {
+    } & {
         changes: Partial<S>;
     }) => Partial<S>;
-    scrollIntoView: typeof scrollIntoView;
+    scrollIntoView: any;
     environment: (Window & typeof globalThis) | undefined;
 };

package/dist/hooks/utils/isDropdownStateEqual.d.ts

@@ -10,7 +10,7 @@ type DropdownState<Item> = {
  *
  * @param prevState The previous dropdown state.
  * @param newState The new dropdown state.
- * @returns Wheather the states are deeply equal.
+ * @returns Whether the states are deeply equal.
  */
 export declare function isDropdownStateEqual<Item>(prevState: DropdownState<Item>, newState: DropdownState<Item>): boolean;
 export {};

package/dist/hooks/utils/useMouseAndTouchTracker.d.ts

@@ -6,10 +6,10 @@ import { Environment } from '../../downshift.types';
  * @param environment The environment to add the event listeners to, for instance window.
  * @param handleBlur The function that is called if mouseDown or touchEnd occured outside the downshiftElements.
  * @param downshiftRefs The refs for the elements that should not trigger a blur action from mouseDown or touchEnd.
- * @returns The mouse and touch events information.
+ * @returns A ref holding the mouse and touch events information. Read `.current` only inside event handlers/effects.
  */
-export declare function useMouseAndTouchTracker(environment: Environment | undefined, handleBlur: () => void, downshiftRefs: React.RefObject<HTMLElement>[]): {
+export declare function useMouseAndTouchTracker(environment: Environment | undefined, handleBlur: () => void, downshiftRefs: React.RefObject<HTMLElement>[]): React.MutableRefObject<{
     isMouseDown: boolean;
     isTouchMove: boolean;
     isTouchEnd: boolean;
-};
+}>;

package/dist/hooks/utils/useScrollIntoView.d.ts

@@ -1,11 +1,12 @@
+import * as React from 'react';
 /**
  * Utility hook that scrolls an item from a menu into view.
  * @param scrollIntoView The function that does the scroll.
  * @param highlightedIndex The index of the item that should be scrolled.
  * @param isOpen If the menu is open or not.
- * @param menuElement The menu element.
- * @param itemElements The object containing item elements.
+ * @param menuRef The ref to the menu element.
+ * @param itemsRef The ref to the object containing item elements.
  * @param getItemId The function to get the item id from index.
  * @returns Function that when called prevents the scroll.
  */
-export declare function useScrollIntoView(scrollIntoView: (node: HTMLElement, menuNode: HTMLElement) => void, highlightedIndex: number, isOpen: boolean, menuElement: HTMLElement | null, itemElements: Record<string, HTMLElement>, getItemId: (index: number) => string): () => void;
+export declare function useScrollIntoView(scrollIntoView: (node: HTMLElement, menuNode: HTMLElement) => void, highlightedIndex: number, isOpen: boolean, menuRef: React.MutableRefObject<HTMLElement | null>, itemsRef: React.MutableRefObject<Record<string, HTMLElement>>, getItemId: (index: number) => string): () => void;

package/dist/utils/getHighlightedIndex.d.ts

@@ -8,4 +8,4 @@
  * @param circular If the search reaches the end, if it can search again starting from the other end.
  * @returns The next highlightedIndex.
  */
-export declare function getHighlightedIndex<Item>(start: number, offset: number, items: Item[], isItemDisabled: (item: Item, index: number) => boolean, circular?: boolean): number;
+export declare function getHighlightedIndex<Item>(start: number, offset: number, items: Item[], isItemDisabled: (item: Item, index: number) => boolean, circular?: boolean): any;

package/dist/utils/getNonDisabledIndex.d.ts

@@ -8,4 +8,4 @@
  * @param circular If the search reaches the end, if it can search again starting from the other end.
  * @returns The next non-disabled index.
  */
-export declare function getNonDisabledIndex<Item>(start: number, backwards: boolean, items: Item[], isItemDisabled: (item: Item, index: number) => boolean, circular?: boolean): number;
+export declare function getNonDisabledIndex<Item>(start: number, backwards: boolean, items: Item[], isItemDisabled: (item: Item, index: number) => boolean, circular?: boolean): any;

package/dist/utils/index.d.ts

@@ -1,4 +1,5 @@
 export { generateId, setIdCounter, resetIdCounter } from './generateId';
+export { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
 export { useLatestRef } from './useLatestRef';
 export { handleRefs } from './handleRefs';
 export { callAllEventHandlers } from './callAllEventHandlers';

package/dist/utils/useIsomorphicLayoutEffect.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const useIsomorphicLayoutEffect: typeof React.useEffect;

package/dist/utils/useLatestRef.d.ts

@@ -1,2 +1,2 @@
 import * as React from 'react';
-export declare function useLatestRef<T>(val: T): React.MutableRefObject<T>;
+export declare function useLatestRef<T>(value: T): React.MutableRefObject<T>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "downshift",
-  "version": "9.4.0-alpha.1",
+  "version": "9.4.0",
   "description": "🏎 A set of primitives to build simple, flexible, WAI-ARIA compliant React autocomplete, combobox or select dropdown components.",
   "main": "dist/downshift.cjs.cjs",
   "react-native": "dist/downshift.native.cjs.cjs",
@@ -24,24 +24,31 @@
     "test:flow:coverage": "flow-coverage-report",
     "test:build": "jest --config other/misc-tests/jest.config.js",
     "// FIXME: test:build": "jest --projects other/misc-tests other/react-native",
-    "test:cypress:dev": "npm-run-all --parallel --race docs:dev cy:open",
-    "pretest:cypress": "npm run docs:build --silent",
-    "test:cypress": "start-server-and-test docs:serve http://localhost:6006 cy:run",
-    "cy:run": "cypress run",
-    "cy:open": "cypress open",
+    "test:e2e:dev": "playwright test --ui",
+    "pretest:e2e": "npm run docs:build --silent",
+    "test:e2e": "playwright test",
+    "pw:run": "playwright test",
+    "pw:open": "playwright test --ui",
     "build-and-test": "npm run build -s && npm run test:build -s",
     "docs:build": "docusaurus build",
     "docs:dev": "docusaurus start",
     "docs:serve": "docusaurus serve --port 6006",
     "docs:clear": "docusaurus clear",
     "setup": "npm install && npm run validate",
-    "validate": "kcd-scripts validate lint,build-and-test,test:cover,test:ts,test:ssr,test:cypress"
+    "validate": "kcd-scripts validate lint,build-and-test,test:cover,test:ts,test:ssr,test:e2e"
   },
   "husky": {
     "hooks": {
-      "pre-commit": "unset ELECTRON_RUN_AS_NODE && kcd-scripts pre-commit"
+      "pre-commit": "kcd-scripts pre-commit"
     }
   },
+  "lint-staged": {
+    "*.+(js|jsx|json|yml|yaml|css|less|scss|ts|tsx|md|gql|graphql|mdx|vue)": [
+      "kcd-scripts format",
+      "kcd-scripts lint",
+      "kcd-scripts test --findRelatedTests --passWithNoTests"
+    ]
+  },
   "files": [
     "dist",
     "typings",
@@ -89,15 +96,14 @@
   },
   "devDependencies": {
     "@babel/helpers": "^7.28.6",
-    "@babel/plugin-proposal-private-methods": "^7.18.6",
-    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "@docusaurus/core": "3.3.2",
-    "@docusaurus/module-type-aliases": "3.3.2",
-    "@docusaurus/preset-classic": "3.3.2",
+    "@docusaurus/babel": "3.10.1",
+    "@docusaurus/core": "3.10.1",
+    "@docusaurus/module-type-aliases": "3.10.1",
+    "@docusaurus/preset-classic": "3.10.1",
     "@mdx-js/react": "^3.0.1",
+    "@playwright/test": "^1.60.0",
     "@rollup/plugin-babel": "^6.1.0",
     "@rollup/plugin-commonjs": "^29.0.0",
-    "@testing-library/cypress": "^10.1.0",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/preact": "^3.2.4",
@@ -114,10 +120,9 @@
     "buble": "^0.20.0",
     "cpy-cli": "^6.0.0",
     "cross-env": "^10.1.0",
-    "cypress": "15.9.0",
     "eslint": "^8.57.0",
-    "eslint-plugin-cypress": "^3.6.0",
     "eslint-plugin-react": "7.37.5",
+    "eslint-plugin-react-hooks": "^7.1.1",
     "flow-bin": "^0.299.0",
     "flow-coverage-report": "^0.8.0",
     "get-pkg-repo": "5.0.0",
@@ -127,6 +132,7 @@
     "preact": "^10.28.2",
     "prism-react-renderer": "^2.4.1",
     "react": "^18.3.1",
+    "react-compiler-runtime": "^1.0.0",
     "react-dom": "^18.3.1",
     "react-is": "^18.3.1",
     "react-native": "^0.76.0",
@@ -135,13 +141,17 @@
     "start-server-and-test": "^2.1.3",
     "typescript": "^5.9.3"
   },
+  "overrides": {
+    "eslint-plugin-react-hooks": "^7.1.1"
+  },
   "eslintConfig": {
     "parserOptions": {
       "ecmaVersion": 2023,
       "project": [
         "./tsconfig.json",
         "./docusaurus/tsconfig.json",
-        "./test/tsconfig.json"
+        "./test/tsconfig.json",
+        "./e2e/tsconfig.json"
       ],
       "sourceType": "module"
     },
@@ -167,6 +177,7 @@
     },
     "extends": "./node_modules/kcd-scripts/eslint.js",
     "rules": {
+      "react-hooks/refs": "error",
       "react/jsx-indent": "off",
       "react/prop-types": "off",
       "max-lines-per-function": "off",
@@ -181,11 +192,16 @@
     "overrides": [
       {
         "files": [
-          "cypress/**/*.js"
+          "e2e/**/*.ts"
         ],
         "rules": {
           "testing-library/prefer-screen-queries": "off",
-          "testing-library/await-async-query": "off"
+          "import/no-extraneous-dependencies": [
+            "error",
+            {
+              "devDependencies": true
+            }
+          ]
         }
       }
     ]
@@ -196,7 +212,10 @@
     "dist",
     ".docusaurus",
     "build",
-    "test"
+    "test",
+    "typings",
+    "playwright-report",
+    "test-results"
   ],
   "repository": {
     "type": "git",