diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index 33588f4c09..9541b67bdf 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -22,7 +22,7 @@ jobs:
       - name: Lint
         # Continue on error so, we can see lint issues but not fail the build, we should fix them incrementally
         continue-on-error: true
-        run: yarn run lint
+        run: yarn biome ci --reporter=github
       - name: Prettier
         run: yarn run prettier:ci
       - name: Stylelint
diff --git a/biome.json b/biome.json
index f846b7c68f..32e25f0ee7 100644
--- a/biome.json
+++ b/biome.json
@@ -7,7 +7,7 @@
     "defaultBranch": "main"
   },
   "files": {
-    "ignore": [".next", "mockServiceWorker.js", "*-props.json"]
+    "ignore": [".next", "mockServiceWorker.js", "*-props.json", ".tmp"]
   },
   "organizeImports": {
     "enabled": true
@@ -45,8 +45,8 @@
           "level": "error",
           "fix": "safe"
         },
-        "noNonNullAssertion": "warn",
-        "noParameterAssign": "warn"
+        "noParameterAssign": "warn",
+        "noNonNullAssertion": "warn"
       },
       "nursery": {
         "noUselessStringConcat": { "level": "error", "fix": "safe" }
@@ -60,10 +60,26 @@
         "noAutofocus": "off",
         "noNoninteractiveElementToInteractiveRole": "off",
         "noNoninteractiveTabindex": "off",
-        "noSvgWithoutTitle": "off"
+        "noSvgWithoutTitle": "off",
+        "useAriaPropsForRole": "warn"
       },
       "correctness": {
-        "useExhaustiveDependencies": "warn",
+        "useExhaustiveDependencies": {
+          "level": "warn",
+          "options": {
+            "hooks": [
+              {
+                "name": "useIsomorphicLayoutEffect",
+                "closureIndex": 0,
+                "dependenciesIndex": 1
+              },
+              {
+                "name": "useControlled",
+                "stableResult": [1]
+              }
+            ]
+          }
+        },
         "noSwitchDeclarations": {
           "level": "error",
           "fix": "safe"
@@ -74,7 +90,8 @@
         "noGlobalIsNan": {
           "level": "error",
           "fix": "safe"
-        }
+        },
+        "noExplicitAny": "warn"
       }
     }
   },
@@ -100,6 +117,9 @@
           },
           "complexity": {
             "noForEach": "off"
+          },
+          "suspicious": {
+            "noImplicitAnyLet": "off"
           }
         }
       }
@@ -130,6 +150,29 @@
           }
         }
       }
+    },
+    {
+      "include": [
+        "packages/*/stories/*-layout/**",
+        "site/src/examples/*-layout/**"
+      ],
+      "linter": {
+        "rules": {
+          "suspicious": {
+            "noArrayIndexKey": "off"
+          }
+        }
+      }
+    },
+    {
+      "include": ["site/src/examples/**", "packages/*/stories/**"],
+      "linter": {
+        "rules": {
+          "suspicious": {
+            "noShadowRestrictedNames": "off"
+          }
+        }
+      }
     }
   ]
 }
diff --git a/docs/components/QAContainer.tsx b/docs/components/QAContainer.tsx
index 4bfe9845aa..499b34e843 100644
--- a/docs/components/QAContainer.tsx
+++ b/docs/components/QAContainer.tsx
@@ -66,8 +66,8 @@ const DensityBlock = ({
 
   return (
     <BackgroundBlock background={mode === "light" ? "white" : undefined}>
-      {DensityValues.map((d, i) => (
-        <ChosenSaltProvider mode={mode} density={d} key={i}>
+      {DensityValues.map((d) => (
+        <ChosenSaltProvider mode={mode} density={d} key={d}>
           <div className="background-item-wrapper">{children}</div>
         </ChosenSaltProvider>
       ))}
@@ -125,8 +125,8 @@ export const QAContainer = ({
           ))}
         </>
       ) : (
-        DensityValues.map((d, i) => (
-          <Fragment key={i}>
+        DensityValues.map((d) => (
+          <Fragment key={d}>
             <ChosenSaltProvider
               mode="light"
               density={d}
diff --git a/docs/public/mockServiceWorker.js b/docs/public/mockServiceWorker.js
index 87e0f31b81..2838108530 100644
--- a/docs/public/mockServiceWorker.js
+++ b/docs/public/mockServiceWorker.js
@@ -1,6 +1,3 @@
-/* eslint-disable */
-/* tslint:disable */
-
 /**
  * Mock Service Worker (1.2.1).
  * @see https://github.com/mswjs/msw
diff --git a/package.json b/package.json
index 3d8eeda957..611ad71c44 100644
--- a/package.json
+++ b/package.json
@@ -29,10 +29,10 @@
     "test": "vitest",
     "test:components": "cypress run --component --browser chrome --headless",
     "test:components:local": "cypress open --component --browser electron",
-    "lint": "biome check .",
-    "lint:fix": "biome check . --fix",
     "prettier": "prettier --write .",
     "prettier:ci": "prettier --check .",
+    "lint": "biome check",
+    "lint:fix": "biome check --fix",
     "lint:style": "yarn lint:style:core && yarn lint:style:icon && yarn lint:style:lab && yarn lint:style:ag-theme",
     "lint:style:core": "yarn stylelint -f verbose \"packages/core/src/**/*.css\"",
     "lint:style:icon": "yarn stylelint -f verbose \"packages/icons/src/**/*.css\"",
diff --git a/packages/ag-grid-theme/src/examples/InfiniteScroll.tsx b/packages/ag-grid-theme/src/examples/InfiniteScroll.tsx
index 06eaa2b174..c00af8b7b3 100644
--- a/packages/ag-grid-theme/src/examples/InfiniteScroll.tsx
+++ b/packages/ag-grid-theme/src/examples/InfiniteScroll.tsx
@@ -26,9 +26,9 @@ const InfiniteScroll = (props: AgGridReactProps) => {
 
   useEffect(() => {
     if (isGridReady) {
-      api!.sizeColumnsToFit();
+      api?.sizeColumnsToFit();
 
-      api!.setGridOption("datasource", {
+      api?.setGridOption("datasource", {
         getRows: ({ startRow, endRow, successCallback }) => {
           setTimeout(() => {
             successCallback(
@@ -39,7 +39,7 @@ const InfiniteScroll = (props: AgGridReactProps) => {
         },
       });
     }
-  }, [isGridReady]);
+  }, [isGridReady, api]);
 
   return (
     <div {...containerProps}>
diff --git a/packages/ag-grid-theme/src/examples/MasterDetail.tsx b/packages/ag-grid-theme/src/examples/MasterDetail.tsx
index 772e95bbce..07c001f664 100644
--- a/packages/ag-grid-theme/src/examples/MasterDetail.tsx
+++ b/packages/ag-grid-theme/src/examples/MasterDetail.tsx
@@ -35,7 +35,9 @@ const MasterDetail = (props: AgGridReactProps) => {
         detailCellRenderer={detailCellRenderer}
         detailCellRendererParams={{
           detailGridOptions: { columnDefs },
-          getDetailRowData: (params: any) => params.successCallback(rowData),
+          getDetailRowData: (params: {
+            successCallback: (data: typeof rowData) => void;
+          }) => params.successCallback(rowData),
         }}
         masterDetail={true}
         detailRowHeight={300}
diff --git a/packages/ag-grid-theme/src/examples/Pagination.tsx b/packages/ag-grid-theme/src/examples/Pagination.tsx
index 0266510cea..d3733be797 100644
--- a/packages/ag-grid-theme/src/examples/Pagination.tsx
+++ b/packages/ag-grid-theme/src/examples/Pagination.tsx
@@ -11,7 +11,7 @@ const generateData = (states: typeof dataGridExampleData) =>
       for (let i = 0; i < 20; i++) {
         data.push({ ...row, name: `${row.name} ${i}` });
       }
-      return [...result, ...data];
+      return result.concat(data);
     },
     [] as typeof dataGridExampleData,
   );
diff --git a/packages/ag-grid-theme/src/examples/RangeSelection.tsx b/packages/ag-grid-theme/src/examples/RangeSelection.tsx
index 9f69b29860..291c670103 100644
--- a/packages/ag-grid-theme/src/examples/RangeSelection.tsx
+++ b/packages/ag-grid-theme/src/examples/RangeSelection.tsx
@@ -16,7 +16,7 @@ export const RangeSelection = (props: AgGridReactProps) => {
         columnEnd: "population",
       });
     }
-  }, [isGridReady]);
+  }, [isGridReady, api]);
 
   return (
     <div {...containerProps}>
diff --git a/packages/ag-grid-theme/src/examples/SortAndFilter.tsx b/packages/ag-grid-theme/src/examples/SortAndFilter.tsx
index 56b69c6813..36cf1938e6 100644
--- a/packages/ag-grid-theme/src/examples/SortAndFilter.tsx
+++ b/packages/ag-grid-theme/src/examples/SortAndFilter.tsx
@@ -48,7 +48,7 @@ const SortAndFilter = (props: AgGridReactProps) => {
     }
 
     void setFilter();
-  }, [isGridReady]);
+  }, [isGridReady, api]);
 
   return (
     <div {...containerProps}>
diff --git a/packages/core/src/__tests__/__e2e__/aria-announcer/useAriaAnnounce.cy.tsx b/packages/core/src/__tests__/__e2e__/aria-announcer/useAriaAnnounce.cy.tsx
index 6f7616b6e8..4ad68bad32 100644
--- a/packages/core/src/__tests__/__e2e__/aria-announcer/useAriaAnnounce.cy.tsx
+++ b/packages/core/src/__tests__/__e2e__/aria-announcer/useAriaAnnounce.cy.tsx
@@ -19,7 +19,7 @@ interface SimpleTestContentProps {
   announcement?: string;
   delay?: number;
   debounce?: number;
-  getAnnouncement?: Function;
+  getAnnouncement?: () => string;
 }
 
 const SimpleTestContent = ({
@@ -36,14 +36,16 @@ const SimpleTestContent = ({
     <>
       <button
         onClick={() => {
-          announce(getMessageToAnnounce());
+          const message = getMessageToAnnounce();
+          if (message != null) announce(message);
         }}
       >
         {BUTTON_TEXT}
       </button>
       <button
         onClick={() => {
-          announce(getMessageToAnnounce(), delay);
+          const message = getMessageToAnnounce();
+          if (message != null) announce(message, delay);
         }}
       >
         {BUTTON_TEXT_WAIT}
diff --git a/packages/core/src/__tests__/__e2e__/declarations.d.ts b/packages/core/src/__tests__/__e2e__/declarations.d.ts
index cbfbd10d0a..d27b29cf94 100644
--- a/packages/core/src/__tests__/__e2e__/declarations.d.ts
+++ b/packages/core/src/__tests__/__e2e__/declarations.d.ts
@@ -1,4 +1,5 @@
 declare module "*.png" {
+  // biome-ignore lint/suspicious/noExplicitAny: any is simpler here
   const content: any;
   export default content;
 }
diff --git a/packages/core/src/__tests__/unit/utils/getRefFromChildren.spec.tsx b/packages/core/src/__tests__/unit/utils/getRefFromChildren.spec.tsx
index 0ed4d82410..ff9d41f3ab 100644
--- a/packages/core/src/__tests__/unit/utils/getRefFromChildren.spec.tsx
+++ b/packages/core/src/__tests__/unit/utils/getRefFromChildren.spec.tsx
@@ -1,5 +1,4 @@
 import { getRefFromChildren } from "@salt-ds/core";
-import { ReactNode } from "react";
 import { describe, expect, it } from "vitest";
 
 describe("getRefFromChildren", () => {
@@ -8,6 +7,7 @@ describe("getRefFromChildren", () => {
     expect(getRefFromChildren(undefined)).toBeNull();
     expect(getRefFromChildren("string")).toBeNull();
     expect(getRefFromChildren(123)).toBeNull();
+    // biome-ignore lint/complexity/noUselessFragments: test file
     expect(getRefFromChildren(<></>)).toBeNull();
     expect(getRefFromChildren([])).toBeNull();
   });
diff --git a/packages/core/src/avatar/Avatar.tsx b/packages/core/src/avatar/Avatar.tsx
index 35d7ba62a2..824dcf59e1 100644
--- a/packages/core/src/avatar/Avatar.tsx
+++ b/packages/core/src/avatar/Avatar.tsx
@@ -66,7 +66,7 @@ export const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(
     window: targetWindow,
   });
 
-  let children;
+  let children: ReactNode;
 
   const style = {
     ...styleProp,
diff --git a/packages/core/src/combo-box/ComboBox.tsx b/packages/core/src/combo-box/ComboBox.tsx
index 50af70bff6..39c5282803 100644
--- a/packages/core/src/combo-box/ComboBox.tsx
+++ b/packages/core/src/combo-box/ComboBox.tsx
@@ -26,7 +26,10 @@ import {
 } from "react";
 import { Button } from "../button";
 import { useFormFieldProps } from "../form-field-context";
-import { ListControlContext } from "../list-control/ListControlContext";
+import {
+  ListControlContext,
+  type OptionValue,
+} from "../list-control/ListControlContext";
 import { defaultValueToString } from "../list-control/ListControlState";
 import { OptionList } from "../option/OptionList";
 import { PillInput, type PillInputProps } from "../pill-input";
@@ -207,6 +210,8 @@ export const ComboBox = forwardRef(function ComboBox<Item>(
   };
 
   const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {
+    onKeyDown?.(event);
+
     if (readOnly) {
       return;
     }
@@ -220,7 +225,8 @@ export const ComboBox = forwardRef(function ComboBox<Item>(
 
     const activeOption = activeState ?? getFirstOption()?.data;
 
-    let newActive;
+    let newActive: { data: OptionValue<Item>; element: HTMLElement } | null =
+      null;
     switch (event.key) {
       case "ArrowDown":
         newActive = getOptionAfter(activeOption) ?? getLastOption();
@@ -278,8 +284,6 @@ export const ComboBox = forwardRef(function ComboBox<Item>(
       event.preventDefault();
       setActive(newActive.data);
     }
-
-    onKeyDown?.(event);
   };
 
   const handleFocus = (event: FocusEvent<HTMLInputElement>) => {
@@ -338,6 +342,7 @@ export const ComboBox = forwardRef(function ComboBox<Item>(
     inputRef.current?.focus();
   };
 
+  // biome-ignore lint/correctness/useExhaustiveDependencies: We only want this to run when the list's openState or the displayed options change.
   useEffect(() => {
     // We check the active index because the active item may have been removed
     const activeIndex = activeState ? getIndexOfOption(activeState) : -1;
@@ -378,7 +383,6 @@ export const ComboBox = forwardRef(function ComboBox<Item>(
     }
 
     setActive(newActive?.data);
-    /* eslint-disable-next-line react-hooks/exhaustive-deps -- We only want this to run when the list's openState or the displayed options change */
   }, [openState, children]);
 
   const buttonId = useId();
diff --git a/packages/core/src/combo-box/useComboBox.tsx b/packages/core/src/combo-box/useComboBox.ts
similarity index 98%
rename from packages/core/src/combo-box/useComboBox.tsx
rename to packages/core/src/combo-box/useComboBox.ts
index 2e52dab2ee..533865d4a7 100644
--- a/packages/core/src/combo-box/useComboBox.tsx
+++ b/packages/core/src/combo-box/useComboBox.ts
@@ -84,7 +84,7 @@ export function useComboBox<Item>(props: UseComboBoxProps<Item>) {
       return;
     }
 
-    let newSelected;
+    let newSelected: Item[];
 
     if (selectedState.includes(itemToRemove)) {
       newSelected = selectedState.filter((item) => item !== itemToRemove);
diff --git a/packages/core/src/drawer/Drawer.tsx b/packages/core/src/drawer/Drawer.tsx
index 10800d5fb5..67da5483c8 100644
--- a/packages/core/src/drawer/Drawer.tsx
+++ b/packages/core/src/drawer/Drawer.tsx
@@ -105,7 +105,7 @@ export const Drawer = forwardRef<HTMLDivElement, DrawerProps>(
         }, 300); // var(--salt-duration-perceptible)
         return () => clearTimeout(animate);
       }
-    }, [open, showComponent, setShowComponent]);
+    }, [open, showComponent]);
 
     return (
       <ConditionalScrimWrapper condition={showComponent && !disableScrim}>
diff --git a/packages/core/src/dropdown/Dropdown.tsx b/packages/core/src/dropdown/Dropdown.tsx
index 98a4f211a5..b8a737347b 100644
--- a/packages/core/src/dropdown/Dropdown.tsx
+++ b/packages/core/src/dropdown/Dropdown.tsx
@@ -23,7 +23,10 @@ import {
   useRef,
 } from "react";
 import { useFormFieldProps } from "../form-field-context";
-import { ListControlContext } from "../list-control/ListControlContext";
+import {
+  ListControlContext,
+  type OptionValue,
+} from "../list-control/ListControlContext";
 import {
   type ListControlProps,
   defaultValueToString,
@@ -265,6 +268,8 @@ export const Dropdown = forwardRef(function Dropdown<Item>(
   };
 
   const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {
+    onKeyDown?.(event);
+
     if (readOnly) {
       return;
     }
@@ -289,7 +294,8 @@ export const Dropdown = forwardRef(function Dropdown<Item>(
 
     const activeOption = activeState ?? getFirstOption().data;
 
-    let newActive;
+    let newActive: { data: OptionValue<Item>; element: HTMLElement } | null =
+      null;
     switch (event.key) {
       case "ArrowDown":
         newActive = getOptionAfter(activeOption) ?? getLastOption();
@@ -339,8 +345,6 @@ export const Dropdown = forwardRef(function Dropdown<Item>(
       setActive(newActive.data);
       setFocusVisibleState(true);
     }
-
-    onKeyDown?.(event);
   };
 
   const handleFocus = (event: FocusEvent<HTMLButtonElement>) => {
@@ -361,6 +365,7 @@ export const Dropdown = forwardRef(function Dropdown<Item>(
     buttonRef.current?.focus();
   };
 
+  // biome-ignore lint/correctness/useExhaustiveDependencies: We only want this to run when the list's openState or the displayed options change.
   useEffect(() => {
     // We check the active index because the active item may have been removed
     const activeIndex = activeState ? getIndexOfOption(activeState) : -1;
@@ -399,7 +404,6 @@ export const Dropdown = forwardRef(function Dropdown<Item>(
     }
 
     setActive(newActive?.data);
-    /* eslint-disable-next-line react-hooks/exhaustive-deps -- We only want this to run when the list's openState or the displayed options change */
   }, [openState, children]);
 
   const listId = useId();
diff --git a/packages/core/src/interactable-card/InteractableCard.tsx b/packages/core/src/interactable-card/InteractableCard.tsx
index ffa6cee755..48dcef490e 100644
--- a/packages/core/src/interactable-card/InteractableCard.tsx
+++ b/packages/core/src/interactable-card/InteractableCard.tsx
@@ -111,7 +111,7 @@ export const InteractableCard = forwardRef<
     onClick?.(event);
   };
 
-  let tabIndex;
+  let tabIndex: number;
 
   if (interactableCardGroup) {
     if (disabled) {
diff --git a/packages/core/src/interactable-card/InteractableCardGroup.tsx b/packages/core/src/interactable-card/InteractableCardGroup.tsx
index 8a3321c4fb..1ad3932f05 100644
--- a/packages/core/src/interactable-card/InteractableCardGroup.tsx
+++ b/packages/core/src/interactable-card/InteractableCardGroup.tsx
@@ -86,6 +86,7 @@ export const InteractableCardGroup = forwardRef<
 
   const [elements, setElements] = useState<HTMLElement[]>([]);
 
+  // biome-ignore lint/correctness/useExhaustiveDependencies: queries the dom when children changes.
   useEffect(() => {
     const childElements: HTMLElement[] = Array.from(
       groupRef.current?.querySelectorAll(
@@ -116,7 +117,7 @@ export const InteractableCardGroup = forwardRef<
         }
       }
     },
-    [onChange, value, setValue, multiSelect],
+    [onChange, value, multiSelect],
   );
 
   const isSelected = useCallback(
diff --git a/packages/core/src/interactable-card/useInteractableCard.ts b/packages/core/src/interactable-card/useInteractableCard.ts
index a1596f3587..f92238bfed 100644
--- a/packages/core/src/interactable-card/useInteractableCard.ts
+++ b/packages/core/src/interactable-card/useInteractableCard.ts
@@ -44,7 +44,7 @@ export const useInteractableCard = <T extends Element>({
     const t = setTimeout(() => {
       // This key state check is to stop continual visual state change when using Enter Key, which the browser treats as both key and click events on a Button-like component
       // This key state check also fixes Firefox Button where Space key is pressed but button fails to be in active state
-      if (keyIsDown !== enter && keyIsDown !== space) {
+      if (keyIsDown !== enter && keyIsDown !== space && active) {
         setActive(false);
       }
     }, 0);
diff --git a/packages/core/src/list-box/ListBox.tsx b/packages/core/src/list-box/ListBox.tsx
index 04fc5a4f97..6d7ff01f27 100644
--- a/packages/core/src/list-box/ListBox.tsx
+++ b/packages/core/src/list-box/ListBox.tsx
@@ -11,7 +11,10 @@ import {
   forwardRef,
   useRef,
 } from "react";
-import { ListControlContext } from "../list-control/ListControlContext";
+import {
+  ListControlContext,
+  type OptionValue,
+} from "../list-control/ListControlContext";
 import {
   type ListControlProps,
   defaultValueToString,
@@ -123,6 +126,8 @@ export const ListBox = forwardRef(function ListBox<Item>(
   };
 
   const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {
+    onKeyDown?.(event);
+
     if (
       event.key.length === 1 &&
       !event.ctrlKey &&
@@ -136,7 +141,8 @@ export const ListBox = forwardRef(function ListBox<Item>(
 
     const activeOption = activeState ?? getFirstOption().data;
 
-    let newActive;
+    let newActive: { data: OptionValue<Item>; element: HTMLElement } | null =
+      null;
     switch (event.key) {
       case "ArrowDown":
         newActive = getOptionAfter(activeOption) ?? getLastOption();
@@ -181,8 +187,6 @@ export const ListBox = forwardRef(function ListBox<Item>(
       setActive(newActive.data);
       setFocusVisibleState(true);
     }
-
-    onKeyDown?.(event);
   };
 
   const wasMouseDown = useRef(false);
diff --git a/packages/core/src/list-control/ListControlState.ts b/packages/core/src/list-control/ListControlState.ts
index 5d7cbd6086..96ab47bc25 100644
--- a/packages/core/src/list-control/ListControlState.ts
+++ b/packages/core/src/list-control/ListControlState.ts
@@ -80,7 +80,7 @@ export function useListControl<Item>(props: ListControlProps<Item>) {
       setFocusedState(false);
       setFocusVisibleState(false);
     }
-  }, [disabled, focusedState, setFocusedState]);
+  }, [disabled, focusedState]);
 
   const [activeState, setActiveState] = useState<OptionValue<Item> | undefined>(
     undefined,
diff --git a/packages/core/src/menu/MenuBase.tsx b/packages/core/src/menu/MenuBase.tsx
index 1441b9de3f..263af21e9d 100644
--- a/packages/core/src/menu/MenuBase.tsx
+++ b/packages/core/src/menu/MenuBase.tsx
@@ -82,7 +82,7 @@ export function MenuBase(props: MenuBaseProps) {
       setOpenState(newOpen);
       onOpenChange?.(newOpen);
     },
-    [setOpenState, onOpenChange],
+    [onOpenChange],
   );
 
   const [activeIndex, setActiveIndex] = useState<number | null>(null);
@@ -117,7 +117,7 @@ export function MenuBase(props: MenuBaseProps) {
     if (getVirtualElement) {
       refs.setPositionReference(getVirtualElement());
     }
-  }, [getVirtualElement]);
+  }, [getVirtualElement, refs]);
 
   const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(
     [
diff --git a/packages/core/src/pagination/Pagination.tsx b/packages/core/src/pagination/Pagination.tsx
index 845c8da83e..1c8510905b 100644
--- a/packages/core/src/pagination/Pagination.tsx
+++ b/packages/core/src/pagination/Pagination.tsx
@@ -72,7 +72,7 @@ export const Pagination = forwardRef<HTMLElement, PaginationProps>(
         setPageState(page);
         onPageChangeProp?.(event, page);
       },
-      [onPageChangeProp, setPageState],
+      [onPageChangeProp],
     );
 
     const contextValue: PaginationContext = useMemo(
diff --git a/packages/core/src/pill-input/useTruncatePills.ts b/packages/core/src/pill-input/useTruncatePills.ts
index 0902370bfc..3965f9f07d 100644
--- a/packages/core/src/pill-input/useTruncatePills.ts
+++ b/packages/core/src/pill-input/useTruncatePills.ts
@@ -79,7 +79,10 @@ export function useTruncatePills({
     });
   }, [pills, setVisibleItems, enable, targetWindow]);
 
-  useIsomorphicLayoutEffect(updateOverflow, [updateOverflow, pills]);
+  useIsomorphicLayoutEffect(() => {
+    updateOverflow();
+  }, [updateOverflow]);
+
   useResizeObserver({
     ref: pillListRef,
     onResize: updateOverflow,
diff --git a/packages/core/src/toggle-button-group/ToggleButtonGroup.tsx b/packages/core/src/toggle-button-group/ToggleButtonGroup.tsx
index 19ada12ab5..ae4a95f57b 100644
--- a/packages/core/src/toggle-button-group/ToggleButtonGroup.tsx
+++ b/packages/core/src/toggle-button-group/ToggleButtonGroup.tsx
@@ -88,7 +88,7 @@ export const ToggleButtonGroup = forwardRef<
         onChange?.(event);
       }
     },
-    [onChange, value, setValue],
+    [onChange, value],
   );
 
   const isSelected = useCallback(
@@ -98,9 +98,9 @@ export const ToggleButtonGroup = forwardRef<
     [value],
   );
 
-  const focus = (id: Value) => {
+  const focus = useCallback((id: Value) => {
     setFocused(id);
-  };
+  }, []);
 
   const isFocused = useCallback(
     (id: Value) => {
@@ -118,7 +118,7 @@ export const ToggleButtonGroup = forwardRef<
       disabled,
       orientation,
     }),
-    [select, isSelected, isFocused, disabled, orientation],
+    [select, isSelected, isFocused, disabled, orientation, focus],
   );
 
   const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {
diff --git a/packages/core/src/utils/debounce.ts b/packages/core/src/utils/debounce.ts
index 988817cbb9..d6541e8092 100644
--- a/packages/core/src/utils/debounce.ts
+++ b/packages/core/src/utils/debounce.ts
@@ -2,7 +2,6 @@ export interface Cancelable {
   clear(): void;
 }
 
-// biome-ignore lint/suspicious/noExplicitAny: any is simpler here
 export function debounce<T extends (...args: any[]) => any>(
   func: T,
   // Corresponds to 10 frames at 60 Hz.
diff --git a/packages/core/src/utils/getRefFromChildren.ts b/packages/core/src/utils/getRefFromChildren.ts
index 8f9c1e2e8a..a03df0833f 100644
--- a/packages/core/src/utils/getRefFromChildren.ts
+++ b/packages/core/src/utils/getRefFromChildren.ts
@@ -5,6 +5,8 @@ export function getRefFromChildren(child: ReactNode) {
     return null;
   }
 
-  // @ts-expect-error - ref is not defined on ReactNode
-  return child.props.propertyIsEnumerable("ref") ? child.props.ref : child.ref;
+  return Object.prototype.propertyIsEnumerable.call(child.props, "ref")
+    ? child.props.ref
+    : // @ts-expect-error - ref is not defined on ReactNode
+      child.ref;
 }
diff --git a/packages/core/src/utils/inferElementType.ts b/packages/core/src/utils/inferElementType.ts
index f12050ee84..b9e6286818 100644
--- a/packages/core/src/utils/inferElementType.ts
+++ b/packages/core/src/utils/inferElementType.ts
@@ -2,7 +2,6 @@ import type { AnchorHTMLAttributes, DetailedHTMLProps } from "react";
 
 export type inferElementType<T> = T extends keyof JSX.IntrinsicElements
   ? JSX.IntrinsicElements[T] extends DetailedHTMLProps<
-      // biome-ignore lint/suspicious/noExplicitAny: any is simpler here
       AnchorHTMLAttributes<any>,
       infer Elem
     >
diff --git a/packages/core/src/utils/useControlled.ts b/packages/core/src/utils/useControlled.ts
index 9d9bbf7243..747ced0206 100644
--- a/packages/core/src/utils/useControlled.ts
+++ b/packages/core/src/utils/useControlled.ts
@@ -61,9 +61,9 @@ export function useControlled<S>({
       }
     }
     return undefined;
-    /* eslint-disable-next-line react-hooks/exhaustive-deps */
   }, [state, name, controlled]);
 
+  // biome-ignore lint/correctness/useExhaustiveDependencies: uses JSON.stringify to compare defaultProp
   useEffect(() => {
     if (process.env.NODE_ENV !== "production") {
       if (!isControlled && defaultValue !== defaultProp) {
@@ -76,7 +76,6 @@ export function useControlled<S>({
       }
     }
     return undefined;
-    /* eslint-disable-next-line react-hooks/exhaustive-deps */
   }, [JSON.stringify(defaultProp, ignoreReactElements)]);
 
   const setValueIfUncontrolled: Dispatch<SetStateAction<S>> = useCallback(
@@ -85,7 +84,7 @@ export function useControlled<S>({
         setValue(newValue);
       }
     },
-    [isControlled],
+    [],
   );
 
   return [value, setValueIfUncontrolled, isControlled];
diff --git a/packages/core/src/utils/useFloatingUI/useFloatingUI.tsx b/packages/core/src/utils/useFloatingUI/useFloatingUI.tsx
index 3d5be8998e..2c2e5f2888 100644
--- a/packages/core/src/utils/useFloatingUI/useFloatingUI.tsx
+++ b/packages/core/src/utils/useFloatingUI/useFloatingUI.tsx
@@ -60,10 +60,8 @@ const DefaultFloatingComponent = forwardRef<
     top,
     left,
     position,
-    /* eslint-disable @typescript-eslint/no-unused-vars */
     width,
     height,
-    /* eslint-enable @typescript-eslint/no-unused-vars */
     focusManagerProps,
     ...rest
   } = props;
diff --git a/packages/core/src/utils/useId.ts b/packages/core/src/utils/useId.ts
index a48abf7198..452fd7ea28 100644
--- a/packages/core/src/utils/useId.ts
+++ b/packages/core/src/utils/useId.ts
@@ -2,7 +2,6 @@ import * as React from "react";
 
 // Workaround for https://github.com/webpack/webpack/issues/14814#issuecomment-1536757985
 // Without `toString()`, downstream library using webpack to re-bundle will error
-// biome-ignore lint/suspicious/noExplicitAny: see comment above
 const maybeReactUseId: undefined | (() => string) = (React as any)[
   "useId".toString()
 ];
diff --git a/packages/core/src/utils/usePrevious.ts b/packages/core/src/utils/usePrevious.ts
index 212d05eb87..3a1d163d02 100644
--- a/packages/core/src/utils/usePrevious.ts
+++ b/packages/core/src/utils/usePrevious.ts
@@ -9,6 +9,6 @@ export function usePrevious<T>(
 
   useEffect(() => {
     ref.current = value;
-  }, deps); // eslint-disable-line react-hooks/exhaustive-deps
+  }, deps);
   return ref.current;
 }
diff --git a/packages/core/src/utils/useResponsiveProp.ts b/packages/core/src/utils/useResponsiveProp.ts
index 08503cefbe..ab696b0c29 100644
--- a/packages/core/src/utils/useResponsiveProp.ts
+++ b/packages/core/src/utils/useResponsiveProp.ts
@@ -24,7 +24,7 @@ export const getCurrentBreakpoint = (
       if (breakpointWidth < width && breakpointWidth > accWidth) {
         return [breakpoint, breakpointWidth];
       }
-      return [...acc];
+      return acc;
     },
     breakpointList[0] as [keyof Breakpoints, number],
   );
@@ -50,7 +50,6 @@ export const useOrderedBreakpoints = () => {
 
 const isObject = <T>(
   value: T,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
 ): value is Record<string | number | symbol, any> => {
   const type = typeof value;
   return value !== null && (type === "object" || type === "function");
diff --git a/packages/core/src/utils/useValueEffect.ts b/packages/core/src/utils/useValueEffect.ts
index 576b967969..02b60b6153 100644
--- a/packages/core/src/utils/useValueEffect.ts
+++ b/packages/core/src/utils/useValueEffect.ts
@@ -14,7 +14,6 @@ import { type Dispatch, type MutableRefObject, useRef, useState } from "react";
 import { useIsomorphicLayoutEffect } from "../index";
 import { useEventCallback } from "./useEventCallback";
 
-// biome-ignore lint/suspicious/noExplicitAny: third-party code
 type SetValueAction<S> = (prev: S) => Generator<any, void, unknown>;
 
 // This hook works like `useState`, but when setting the value, you pass a generator function
diff --git a/packages/core/stories/banner/banner.stories.tsx b/packages/core/stories/banner/banner.stories.tsx
index 71ba1ed2c5..23affd683c 100644
--- a/packages/core/stories/banner/banner.stories.tsx
+++ b/packages/core/stories/banner/banner.stories.tsx
@@ -4,7 +4,6 @@ import {
   BannerContent,
   type BannerProps,
   Button,
-  FlexItem,
   FlowLayout,
   Link,
   StackLayout,
@@ -175,8 +174,8 @@ export const StatusesPrimary: StoryFn<typeof Banner> = (props) => {
 
   return (
     <StackLayout style={{ width: 500 }}>
-      {statuses.map((example, i) => (
-        <Banner status={example.status} {...restProps} key={i}>
+      {statuses.map((example) => (
+        <Banner status={example.status} {...restProps} key={example.status}>
           <BannerContent>{example.content}</BannerContent>
         </Banner>
       ))}
@@ -257,8 +256,8 @@ export const MultipleLines = (props: BannerProps) => {
 export const MultipleBanners: StoryFn<typeof Banner> = () => {
   return (
     <StackLayout gap={3} style={{ width: 800 }}>
-      {statuses.map((example, i) => (
-        <Banner status={example.status} key={i}>
+      {statuses.map((example) => (
+        <Banner status={example.status} key={example.status}>
           <BannerContent>{example.content}</BannerContent>
         </Banner>
       ))}
diff --git a/packages/core/stories/grid-layout/grid-layout.stories.tsx b/packages/core/stories/grid-layout/grid-layout.stories.tsx
index ac55beafa9..d18579d028 100644
--- a/packages/core/stories/grid-layout/grid-layout.stories.tsx
+++ b/packages/core/stories/grid-layout/grid-layout.stories.tsx
@@ -82,10 +82,10 @@ const footerLinks: Record<string, string[]> = {
 };
 
 const footerColumns = Object.keys(footerLinks).map((header, index) => (
-  <div key={index} className="footer-column">
+  <div key={header} className="footer-column">
     <p>{header}</p>
-    {footerLinks[header].map((link: string, i: number) => (
-      <p key={i}>{link}</p>
+    {footerLinks[header].map((link: string) => (
+      <p key={link}>{link}</p>
     ))}
   </div>
 ));
diff --git a/packages/core/stories/status-indicator/status-indicator.stories.tsx b/packages/core/stories/status-indicator/status-indicator.stories.tsx
index 7bc0ef5a01..f322d49459 100644
--- a/packages/core/stories/status-indicator/status-indicator.stories.tsx
+++ b/packages/core/stories/status-indicator/status-indicator.stories.tsx
@@ -1,7 +1,7 @@
 import {
   FlowLayout,
   StatusIndicator,
-  VALIDATION_NAMED_STATUS as status,
+  VALIDATION_NAMED_STATUS,
 } from "@salt-ds/core";
 import type { Meta, StoryFn } from "@storybook/react";
 
@@ -23,8 +23,8 @@ const AllStatusIndicatorsStory: StoryFn<typeof StatusIndicator> = (args) => {
 
   return (
     <FlowLayout>
-      {status.map((status, index) => (
-        <StatusIndicator status={status} key={index} size={size} />
+      {VALIDATION_NAMED_STATUS.map((status) => (
+        <StatusIndicator status={status} key={status} size={size} />
       ))}
     </FlowLayout>
   );
@@ -37,4 +37,4 @@ const Template: StoryFn<typeof StatusIndicator> = (args) => {
 };
 
 export const Default = Template.bind({});
-Default.args = { status: status[3] };
+Default.args = { status: VALIDATION_NAMED_STATUS[3] };
diff --git a/packages/core/stories/text/text-playground.stories.tsx b/packages/core/stories/text/text-playground.stories.tsx
index bc4a976c41..ed692a0b2e 100644
--- a/packages/core/stories/text/text-playground.stories.tsx
+++ b/packages/core/stories/text/text-playground.stories.tsx
@@ -57,8 +57,7 @@ const BaseComponent: StoryFn<typeof Text> = (args) => {
 
   return (
     <div>
-      {/* We're using dangerouslySetInnerHTML here so we can edit the text within the storybook. Don't do this at home! :) */}
-      {/* @ts-ignore */}
+      {/* biome-ignore lint/security/noDangerouslySetInnerHtml: We're using dangerouslySetInnerHTML here so we can edit the text within the storybook. Don't do this at home! :) */}
       <Text dangerouslySetInnerHTML={{ __html: children }} {...rest} />
     </div>
   );
diff --git a/packages/data-grid/src/NumericColumn.tsx b/packages/data-grid/src/NumericColumn.tsx
index f7e226cba7..ce61104847 100644
--- a/packages/data-grid/src/NumericColumn.tsx
+++ b/packages/data-grid/src/NumericColumn.tsx
@@ -25,7 +25,7 @@ export interface NumericColumnProps<T> extends GridColumnProps<T> {
   precision: number;
 }
 
-function isNumber(value: any): value is number {
+function isNumber(value: unknown): value is number {
   return typeof value === "number" && Number.isFinite(value);
 }
 
diff --git a/packages/data-grid/src/internal/Cursor.tsx b/packages/data-grid/src/internal/Cursor.tsx
index d780ad4a17..69da03948d 100644
--- a/packages/data-grid/src/internal/Cursor.tsx
+++ b/packages/data-grid/src/internal/Cursor.tsx
@@ -6,10 +6,8 @@ import cursorCss from "./Cursor.css";
 
 const withBaseName = makePrefixer("saltGridCursor");
 
-export type CursorProps = {};
-
 // This is probably obsolete. Cursor is rendered using cell borders now.
-export function Cursor(props: CursorProps) {
+export function Cursor() {
   const targetWindow = useWindow();
   useComponentCssInjection({
     testId: "salt-cursor",
diff --git a/packages/data-grid/src/internal/gridHooks.tsx b/packages/data-grid/src/internal/gridHooks.tsx
index 229b3a6346..a1166072f6 100644
--- a/packages/data-grid/src/internal/gridHooks.tsx
+++ b/packages/data-grid/src/internal/gridHooks.tsx
@@ -88,7 +88,7 @@ export function useSumRangeWidth<T>(
 }
 
 // Range memoization using Rng.equals comparator.
-function useMemoRng(fn: () => NumberRange, deps: any[]) {
+function useMemoRng(fn: () => NumberRange, deps: unknown[]) {
   const prevRef = useRef<NumberRange>(NumberRange.empty);
   const range = useMemo(fn, deps);
   if (!NumberRange.equals(prevRef.current, range)) {
diff --git a/packages/data-grid/stories/grid-cellCustomization.stories.tsx b/packages/data-grid/stories/grid-cellCustomization.stories.tsx
index 33901ab555..8329458ddf 100644
--- a/packages/data-grid/stories/grid-cellCustomization.stories.tsx
+++ b/packages/data-grid/stories/grid-cellCustomization.stories.tsx
@@ -55,7 +55,7 @@ const PercentageCellValue = (props: GridCellValueProps<CurrencyPairRow>) => {
   );
 };
 
-const CellCustomizationTemplate: StoryFn<{}> = () => {
+const CellCustomizationTemplate: StoryFn = () => {
   const rowData: CurrencyPairRow[] = useMemo(() => {
     const currencies = ["AUD", "USD", "SGD", "GBP", "HKD", "NZD", "EUR"];
     const result: CurrencyPairRow[] = [];
diff --git a/packages/data-grid/stories/grid-cellValidation.stories.tsx b/packages/data-grid/stories/grid-cellValidation.stories.tsx
index 3a0c26a4dc..6e19616baa 100644
--- a/packages/data-grid/stories/grid-cellValidation.stories.tsx
+++ b/packages/data-grid/stories/grid-cellValidation.stories.tsx
@@ -109,7 +109,7 @@ const useExampleDataSource = () => {
         return x;
       });
     },
-    [setRows],
+    [],
   );
 
   return { rows, setValue };
diff --git a/packages/data-grid/stories/grid-columnGroups.stories.tsx b/packages/data-grid/stories/grid-columnGroups.stories.tsx
index d6a8e732b0..fb9b52053c 100644
--- a/packages/data-grid/stories/grid-columnGroups.stories.tsx
+++ b/packages/data-grid/stories/grid-columnGroups.stories.tsx
@@ -9,7 +9,7 @@ export default {
   argTypes: {},
 };
 
-const ColumnGroupsTemplate: StoryFn<{}> = () => {
+const ColumnGroupsTemplate: StoryFn = () => {
   return (
     <Grid
       rowData={rowData}
diff --git a/packages/data-grid/stories/grid-cssVariables.stories.tsx b/packages/data-grid/stories/grid-cssVariables.stories.tsx
index 5603048945..6204056699 100644
--- a/packages/data-grid/stories/grid-cssVariables.stories.tsx
+++ b/packages/data-grid/stories/grid-cssVariables.stories.tsx
@@ -40,7 +40,7 @@ interface GridCssVar {
 
 const cssVarKeyGetter: RowKeyGetter<GridCssVar> = (row: GridCssVar) => row.name;
 
-const CssVariablesTemplate: StoryFn<{}> = () => {
+const CssVariablesTemplate: StoryFn = () => {
   const [separators, setSeparators] = useState(false);
   const [pinnedSeparators, setPinnedSeparators] = useState(true);
   const [variant, setVariant] = useState<Variant>("primary");
@@ -234,9 +234,9 @@ const CssVariablesTemplate: StoryFn<{}> = () => {
 
   const onUndo = () => {
     const nextChanges = [...changes];
-    const change = nextChanges.pop()!;
+    const change = nextChanges.pop();
     setChanges(nextChanges);
-    change();
+    change?.();
   };
 
   const onReset = () => {
diff --git a/packages/data-grid/stories/grid-editableCells.stories.tsx b/packages/data-grid/stories/grid-editableCells.stories.tsx
index 0090a714c4..0232591986 100644
--- a/packages/data-grid/stories/grid-editableCells.stories.tsx
+++ b/packages/data-grid/stories/grid-editableCells.stories.tsx
@@ -57,7 +57,7 @@ const useExampleDataSource = () => {
         return x;
       });
     },
-    [setRows],
+    [],
   );
 
   const setPrice = useCallback(
@@ -68,7 +68,7 @@ const useExampleDataSource = () => {
         return x;
       });
     },
-    [setRows],
+    [],
   );
 
   const setAmount = useCallback(
@@ -79,7 +79,7 @@ const useExampleDataSource = () => {
         return x;
       });
     },
-    [setRows],
+    [],
   );
 
   const setDiscount = useCallback(
@@ -90,13 +90,13 @@ const useExampleDataSource = () => {
         return x;
       });
     },
-    [setRows],
+    [],
   );
 
   return { rows, setAmount, setName, setDiscount, setPrice };
 };
 
-const EditableCellsTemplate: StoryFn<{}> = () => {
+const EditableCellsTemplate: StoryFn = () => {
   const { setPrice, setDiscount, rows, setAmount, setName } =
     useExampleDataSource();
 
diff --git a/packages/data-grid/stories/grid-headerCustomization.stories.tsx b/packages/data-grid/stories/grid-headerCustomization.stories.tsx
index 8bdddae652..db566031f5 100644
--- a/packages/data-grid/stories/grid-headerCustomization.stories.tsx
+++ b/packages/data-grid/stories/grid-headerCustomization.stories.tsx
@@ -175,7 +175,7 @@ const SummaryCellValue = (props: GridCellValueProps<ExampleRow>) => {
  * An example of how to use the `headerValueComponent` property of columns and
  * column groups.
  * */
-const HeaderCustomizationTemplate: StoryFn<{}> = () => {
+const HeaderCustomizationTemplate: StoryFn = () => {
   const rowData: ExampleRow[] = useMemo(() => {
     const names = [
       "Espresso",
diff --git a/packages/data-grid/stories/grid-pagination.stories.tsx b/packages/data-grid/stories/grid-pagination.stories.tsx
index 72fa8e0293..2cb57f6e6c 100644
--- a/packages/data-grid/stories/grid-pagination.stories.tsx
+++ b/packages/data-grid/stories/grid-pagination.stories.tsx
@@ -13,7 +13,7 @@ export default {
 
 const dummyInvestors = createDummyInvestors();
 
-const GridPaginationTemplate: StoryFn<{}> = (props) => {
+const GridPaginationTemplate: StoryFn = (props) => {
   const [page, setPage] = useState<number>(1);
   const pageSize = 7;
   const pageCount = Math.ceil(dummyInvestors.length / pageSize);
@@ -26,7 +26,7 @@ const GridPaginationTemplate: StoryFn<{}> = (props) => {
     const start = (page - 1) * pageSize;
     const end = Math.min(start + pageSize, dummyInvestors.length);
     return dummyInvestors.slice(start, end);
-  }, [pageSize, page]);
+  }, [page]);
 
   return (
     <FlexLayout direction={"column"} align={"end"}>
diff --git a/packages/data-grid/stories/grid-rowSelectionControlled.stories.tsx b/packages/data-grid/stories/grid-rowSelectionControlled.stories.tsx
index d561d6cd5e..98db1adfa6 100644
--- a/packages/data-grid/stories/grid-rowSelectionControlled.stories.tsx
+++ b/packages/data-grid/stories/grid-rowSelectionControlled.stories.tsx
@@ -16,7 +16,7 @@ export default {
   argTypes: {},
 };
 
-const RowSelectionControlledTemplate: StoryFn<{}> = () => {
+const RowSelectionControlledTemplate: StoryFn = () => {
   const [selection, setSelection] = useState<number[]>([]);
 
   const onRowSelected = (rowIndices: number[]) => {
diff --git a/packages/data-grid/stories/grid-rowSelectionModes.stories.tsx b/packages/data-grid/stories/grid-rowSelectionModes.stories.tsx
index 2d2cd2cfe1..a1ce437c5b 100644
--- a/packages/data-grid/stories/grid-rowSelectionModes.stories.tsx
+++ b/packages/data-grid/stories/grid-rowSelectionModes.stories.tsx
@@ -23,7 +23,7 @@ export default {
   argTypes: {},
 };
 
-const RowSelectionModesTemplate: StoryFn<{}> = () => {
+const RowSelectionModesTemplate: StoryFn = () => {
   const [rowSelectionMode, setRowSelectionMode] =
     useState<GridRowSelectionMode>("multi");
 
diff --git a/packages/data-grid/stories/grid-serverSideData.stories.tsx b/packages/data-grid/stories/grid-serverSideData.stories.tsx
index 9b86dfc2e2..cfee0d2923 100644
--- a/packages/data-grid/stories/grid-serverSideData.stories.tsx
+++ b/packages/data-grid/stories/grid-serverSideData.stories.tsx
@@ -49,7 +49,7 @@ const useInvestors = () => {
 };
 
 const queryClient = new QueryClient();
-const ServerSideDataTemplate: StoryFn<{}> = (props) => {
+const ServerSideDataTemplate: StoryFn = (props) => {
   const { fetchNextPage, data } = useInvestors();
   const rowData = data?.pages.flat() ?? [];
   const lastRow = rowData.length + 1;
@@ -59,7 +59,7 @@ const ServerSideDataTemplate: StoryFn<{}> = (props) => {
         void fetchNextPage();
       }
     },
-    [lastRow],
+    [lastRow, fetchNextPage],
   );
   return (
     <Grid
diff --git a/packages/data-grid/stories/grid-variants.stories.tsx b/packages/data-grid/stories/grid-variants.stories.tsx
index 07d8017858..18aaa7d338 100644
--- a/packages/data-grid/stories/grid-variants.stories.tsx
+++ b/packages/data-grid/stories/grid-variants.stories.tsx
@@ -26,7 +26,7 @@ export default {
 
 type Variant = "primary" | "secondary" | "zebra";
 
-const GridVariantsTemplate: StoryFn<{}> = () => {
+const GridVariantsTemplate: StoryFn = () => {
   const [separators, setSeparators] = useState(false);
   const [uhd, setUhd] = useState(false);
   const [variant, setVariant] = useState<Variant>("primary");
diff --git a/packages/data-grid/stories/grid.stories.tsx b/packages/data-grid/stories/grid.stories.tsx
index 45afa2335f..6ec39cbfe2 100644
--- a/packages/data-grid/stories/grid.stories.tsx
+++ b/packages/data-grid/stories/grid.stories.tsx
@@ -55,7 +55,7 @@ const onLocationChange = (row: Investor, rowIndex: number, value: string) => {
   dummyInvestors[rowIndex].location = value;
 };
 
-const GridStoryTemplate: StoryFn<GridProps> = (props) => {
+const GridStoryTemplate: StoryFn<GridProps> = () => {
   return (
     <Grid
       rowData={dummyInvestors}
@@ -117,7 +117,7 @@ const GridStoryTemplate: StoryFn<GridProps> = (props) => {
   );
 };
 
-const SingleRowSelectionTemplate: StoryFn<GridProps> = (props) => {
+const SingleRowSelectionTemplate: StoryFn<GridProps> = () => {
   return (
     <Grid
       rowData={dummyInvestors}
@@ -229,7 +229,7 @@ const SmallTemplate: StoryFn<GridProps> = () => {
   );
 };
 
-const PinnedColumnsTemplate: StoryFn<GridProps> = (props) => {
+const PinnedColumnsTemplate: StoryFn<GridProps> = () => {
   const [columnSeparators, setColumnSeparators] = useState<boolean>(false);
   const [pinnedSeparators, setPinnedSeparators] = useState<boolean>(true);
 
@@ -342,7 +342,7 @@ const dummyData = [...new Array(40).keys()].map((i) => {
 const rowIdGetter = (row: any) => row.id;
 
 const LotsOfColumnsTemplate: StoryFn<GridProps> = (props) => {
-  const { style, ...rest } = props;
+  const { style } = props;
   return (
     <Grid
       style={style}
@@ -385,7 +385,7 @@ dummyColumnNames.forEach((name) => {
   group.columns.push(name);
 });
 
-const LotsOfColumnGroupsTemplate: StoryFn<GridProps> = (props) => {
+const LotsOfColumnGroupsTemplate: StoryFn<GridProps> = () => {
   return (
     <Grid
       rowData={dummyData}
@@ -440,6 +440,7 @@ const CustomHeader = (props: GridHeaderValueProps<any>) => {
   };
 
   return (
+    // biome-ignore lint/a11y/useKeyWithClickEvents: not used
     <div onClick={onClick} className="customHeader">
       <FavoriteIcon />
       <div className="customHeaderText">{column.info.props.name}</div>
@@ -456,7 +457,7 @@ const CustomHeader = (props: GridHeaderValueProps<any>) => {
 
 const customHeadersColumnNames = dummyColumnNames.slice(0, 10);
 
-const CustomHeadersTemplate: StoryFn<GridProps> = (props) => {
+const CustomHeadersTemplate: StoryFn<GridProps> = () => {
   const [sortBy, setSortBy] = useState<string>("A");
   const [sortDesc, setSortDesc] = useState<boolean>(false);
 
@@ -480,7 +481,7 @@ const CustomHeadersTemplate: StoryFn<GridProps> = (props) => {
         setSortDesc(false);
       }
     },
-    [sortBy, setSortBy, sortDesc, setSortDesc],
+    [sortBy],
   );
 
   const contextValue: CustomHeadersStoryContext = useMemo(() => {
@@ -577,6 +578,7 @@ const CustomCell = (props: GridCellValueProps<TreeRowData>) => {
   };
 
   return (
+    // biome-ignore lint/a11y/useKeyWithClickEvents: not used
     <div className="customTreeCell" onClick={onClick}>
       <div style={style} />
       {row.data.children.length > 0 ? (
@@ -609,7 +611,7 @@ for (let i = 0; i < 10; i++) {
   }
 }
 
-const CustomCellsTemplate: StoryFn<GridProps> = (props) => {
+const CustomCellsTemplate: StoryFn<GridProps> = () => {
   const [data, setData] = useState(dummyTreeData);
 
   const dataById = useMemo(() => {
@@ -629,7 +631,7 @@ const CustomCellsTemplate: StoryFn<GridProps> = (props) => {
       dataById.get(rowKey)!.expanded = expand;
       setData([...data]);
     },
-    [dataById, setData],
+    [dataById, data],
   );
 
   const visibleRows = useMemo(() => {
@@ -678,7 +680,7 @@ const CustomCellsTemplate: StoryFn<GridProps> = (props) => {
   );
 };
 
-const ColumnDragAndDropTemplate: StoryFn<GridProps> = (props) => {
+const ColumnDragAndDropTemplate: StoryFn<GridProps> = () => {
   const [columnIds, setColumnIds] = useState<string[]>([
     "name",
     "location",
diff --git a/packages/icons/stories/icon.qa.stories.tsx b/packages/icons/stories/icon.qa.stories.tsx
index f6a7a42a58..c72f9c3c51 100644
--- a/packages/icons/stories/icon.qa.stories.tsx
+++ b/packages/icons/stories/icon.qa.stories.tsx
@@ -34,8 +34,8 @@ export const AllIcons: StoryFn = () => {
             padding: "12px 0",
           }}
         >
-          {allIcons.map((IconComponent, i) => (
-            <IconComponent key={i} size={size} />
+          {allIcons.map((IconComponent) => (
+            <IconComponent key={IconComponent.displayName} size={size} />
           ))}
         </div>
       ))}
diff --git a/packages/lab/src/__tests__/__e2e__/combo-box-deprecated/ComboBox.accessibility.cy.tsx b/packages/lab/src/__tests__/__e2e__/combo-box-deprecated/ComboBox.accessibility.cy.tsx
index ea8e66d37c..818f637cf3 100644
--- a/packages/lab/src/__tests__/__e2e__/combo-box-deprecated/ComboBox.accessibility.cy.tsx
+++ b/packages/lab/src/__tests__/__e2e__/combo-box-deprecated/ComboBox.accessibility.cy.tsx
@@ -16,7 +16,9 @@ describe("A combo box", () => {
     const testId = "my-input";
 
     cy.mount(
-      <Default InputProps={{ inputProps: { "data-testid": testId } as any }} />,
+      <Default
+        InputProps={{ inputProps: { "data-testid": testId } as never }}
+      />,
     );
 
     cy.findByTestId(testId).should("have.attr", "role", "combobox");
@@ -120,7 +122,7 @@ describe("A multi-select combo box", () => {
     cy.mount(
       <MultiSelect
         InputProps={{
-          InputProps: { inputProps: { "data-testid": testId } as any },
+          InputProps: { inputProps: { "data-testid": testId } as never },
         }}
       />,
     );
diff --git a/packages/lab/src/__tests__/__e2e__/combo-box/ComboBox.accessibility.cy.tsx b/packages/lab/src/__tests__/__e2e__/combo-box/ComboBox.accessibility.cy.tsx
index 085012b0a7..76f75cee32 100644
--- a/packages/lab/src/__tests__/__e2e__/combo-box/ComboBox.accessibility.cy.tsx
+++ b/packages/lab/src/__tests__/__e2e__/combo-box/ComboBox.accessibility.cy.tsx
@@ -16,7 +16,9 @@ describe("A combo box", () => {
     const testId = "my-input";
 
     cy.mount(
-      <Default InputProps={{ inputProps: { "data-testid": testId } as any }} />,
+      <Default
+        InputProps={{ inputProps: { "data-testid": testId } as never }}
+      />,
     );
 
     cy.findByTestId(testId).should("have.attr", "role", "combobox");
diff --git a/packages/lab/src/__tests__/__e2e__/list-next/ListNext.cy.tsx b/packages/lab/src/__tests__/__e2e__/list-next/ListNext.cy.tsx
index 4b4025aa29..40e0694b3e 100644
--- a/packages/lab/src/__tests__/__e2e__/list-next/ListNext.cy.tsx
+++ b/packages/lab/src/__tests__/__e2e__/list-next/ListNext.cy.tsx
@@ -14,9 +14,9 @@ describe("GIVEN a list", () => {
       return (
         <ListNext {...props}>
           {props.children ||
-            ITEMS.map((item, index) => {
+            ITEMS.map((item) => {
               return (
-                <ListItemNext value={item.value} key={index}>
+                <ListItemNext value={item.value} key={item.label}>
                   {item.label}
                 </ListItemNext>
               );
diff --git a/packages/lab/src/__tests__/__e2e__/list/List.keyboardNavigation.cy.tsx b/packages/lab/src/__tests__/__e2e__/list/List.keyboardNavigation.cy.tsx
index 0794f61252..d80cc60d9a 100644
--- a/packages/lab/src/__tests__/__e2e__/list/List.keyboardNavigation.cy.tsx
+++ b/packages/lab/src/__tests__/__e2e__/list/List.keyboardNavigation.cy.tsx
@@ -500,8 +500,8 @@ const ITEMS_PER_PAGE = 2;
       cy.mount(
         isDeclarative ? (
           <List {...listProps} displayedItemCount={ITEMS_PER_PAGE}>
-            {FancyItems.map((x, i) => (
-              <ListItem key={`item-${i}`}>{x}</ListItem>
+            {FancyItems.map((x) => (
+              <ListItem key={x}>{x}</ListItem>
             ))}
           </List>
         ) : (
@@ -671,8 +671,8 @@ const ITEMS_PER_PAGE = 2;
             displayedItemCount={ITEMS_PER_PAGE}
             id="list"
           >
-            {FancyItems.map((x, i) => (
-              <ListItem key={`item-${i}`}>{x}</ListItem>
+            {FancyItems.map((x) => (
+              <ListItem key={x}>{x}</ListItem>
             ))}
           </List>
         ) : (
diff --git a/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx b/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx
index 5e0910bb33..2f9bf62827 100644
--- a/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx
+++ b/packages/lab/src/__tests__/__e2e__/skip-link/SkipLink.cy.tsx
@@ -6,7 +6,7 @@ import { checkAccessibility } from "../../../../../../cypress/tests/checkAccessi
 const composedStories = composeStories(skipLinkStories);
 const { Default, MultipleLinks } = composedStories;
 
-export const NoTargetRef = () => {
+const NoTargetRef = () => {
   return (
     <>
       <div>
diff --git a/packages/lab/src/calendar/useCalendar.ts b/packages/lab/src/calendar/useCalendar.ts
index 7355ae86ad..4a8ee823c1 100644
--- a/packages/lab/src/calendar/useCalendar.ts
+++ b/packages/lab/src/calendar/useCalendar.ts
@@ -27,8 +27,8 @@ interface BaseUseCalendarProps {
     event: SyntheticEvent,
     visibleMonth: DateValue,
   ) => void;
-  isDayUnselectable?: (date: DateValue) => string | false | void;
-  isDayHighlighted?: (date: DateValue) => string | false | void;
+  isDayUnselectable?: (date: DateValue) => string | false | undefined;
+  isDayHighlighted?: (date: DateValue) => string | false | undefined;
   isDayDisabled?: (date: DateValue) => boolean;
   visibleMonth?: DateValue;
   hideOutOfRangeDates?: boolean;
diff --git a/packages/lab/src/calendar/useSelection.ts b/packages/lab/src/calendar/useSelection.ts
index 971a9775a2..b68bc29762 100644
--- a/packages/lab/src/calendar/useSelection.ts
+++ b/packages/lab/src/calendar/useSelection.ts
@@ -78,7 +78,7 @@ export type useSelectionCalendarProps =
   | UseOffsetSelectionCalendarProps;
 
 function addOrRemoveFromArray(
-  array: AllSelectionValueType | null = [],
+  array: AllSelectionValueType | null,
   item: DateValue,
 ) {
   if (Array.isArray(array)) {
@@ -103,8 +103,7 @@ export function isRangeOrOffsetSelectionWithStartDate(
 ): selectionValue is RangeSelectionValueType | OffsetSelectionValueType {
   return (
     isRangeOrOffsetSelectionValue(selectionValue) &&
-    // biome-ignore lint/suspicious/noPrototypeBuiltins: will replace with hasOwn when we update min browser
-    selectionValue?.hasOwnProperty("startDate")
+    Object.prototype.hasOwnProperty.call(selectionValue, "startDate")
   );
 }
 
@@ -154,7 +153,10 @@ export function useSelectionCalendar(props: useSelectionCalendarProps) {
           props.onSelectedDateChange?.(event, newSelectedDate);
           break;
         case "multiselect": {
-          const newDates = addOrRemoveFromArray(selectedDate, newSelectedDate);
+          const newDates = addOrRemoveFromArray(
+            selectedDate ?? [],
+            newSelectedDate,
+          );
           setSelectedDateState(newDates);
           props.onSelectedDateChange?.(event, newDates);
           break;
diff --git a/packages/lab/src/cascading-menu/CascadingMenuList.tsx b/packages/lab/src/cascading-menu/CascadingMenuList.tsx
index 4b3671ca08..e4e5fa96b6 100644
--- a/packages/lab/src/cascading-menu/CascadingMenuList.tsx
+++ b/packages/lab/src/cascading-menu/CascadingMenuList.tsx
@@ -241,7 +241,7 @@ export const CascadingMenuList = forwardRef<
                 isInteracted={isInteracted}
                 isNavigatingWithKeyboard={isNavigatingWithKeyboard}
                 itemToString={itemToString}
-                key={idx}
+                key={menuItem.id}
                 onItemClick={onItemClick}
                 onMouseMove={() => handleMouseMove(idx)}
                 sourceItem={menuItem}
diff --git a/packages/lab/src/cascading-menu/internal/stateUtils.ts b/packages/lab/src/cascading-menu/internal/stateUtils.ts
index 275284361b..e7006f5596 100644
--- a/packages/lab/src/cascading-menu/internal/stateUtils.ts
+++ b/packages/lab/src/cascading-menu/internal/stateUtils.ts
@@ -37,6 +37,7 @@ export function deriveFlatStateFromTree(
           level + 1,
           generatedChildId,
         );
+        // biome-ignore lint/performance/noAccumulatingSpread: reduce on object
         return { ...menuStructure, ...innerState };
       }
       return menuStructure;
diff --git a/packages/lab/src/cascading-menu/internal/useStateReducer.ts b/packages/lab/src/cascading-menu/internal/useStateReducer.ts
index 272f548347..710dd2703c 100644
--- a/packages/lab/src/cascading-menu/internal/useStateReducer.ts
+++ b/packages/lab/src/cascading-menu/internal/useStateReducer.ts
@@ -37,7 +37,7 @@ function menuPositionReducer(state: state, action: menuAction, level: number) {
 }
 
 export function useStateReducer(
-  menusDataById: flattenedMenuState = {},
+  menusDataById: flattenedMenuState,
   isNavigatingWithKeyboard: boolean,
 ) {
   return useCallback(
diff --git a/packages/lab/src/combo-box-deprecated/internal/getAnnouncement.ts b/packages/lab/src/combo-box-deprecated/internal/getAnnouncement.ts
index 2b177a9327..4149363066 100644
--- a/packages/lab/src/combo-box-deprecated/internal/getAnnouncement.ts
+++ b/packages/lab/src/combo-box-deprecated/internal/getAnnouncement.ts
@@ -1,8 +1,8 @@
 export function getAnnouncement(
-  itemCount = 0,
+  itemCount: number | undefined,
   firstItem: string | null,
 ): string {
-  return itemCount === 0
+  return itemCount === 0 || itemCount === undefined
     ? "no results"
     : `${itemCount} ${itemCount > 1 ? "results" : "result"}${
         firstItem ? `, ${firstItem}` : ""
diff --git a/packages/lab/src/combo-box-deprecated/internal/useComboBox.ts b/packages/lab/src/combo-box-deprecated/internal/useComboBox.ts
index b662ca71ff..86e9cf64c4 100644
--- a/packages/lab/src/combo-box-deprecated/internal/useComboBox.ts
+++ b/packages/lab/src/combo-box-deprecated/internal/useComboBox.ts
@@ -144,7 +144,7 @@ export const useComboBox = <Item>(props: UseComboBoxProps<Item>) => {
 
   const reconcileInput = useCallback(() => {
     setInputValue(selectedItem == null ? "" : itemToString(selectedItem));
-  }, [selectedItem, itemToString, setInputValue]);
+  }, [selectedItem, itemToString]);
 
   const selectInputValue = (event: ChangeEvent) => {
     const nextIndex = inputValue ? labels.indexOf(inputValue.trim()) : -1;
@@ -169,7 +169,9 @@ export const useComboBox = <Item>(props: UseComboBoxProps<Item>) => {
   });
 
   // Reconcile input when the function is updated - most likely to be a selectItem change
-  useEffect(reconcileInput, [reconcileInput]);
+  useEffect(() => {
+    reconcileInput();
+  }, [reconcileInput]);
 
   // Reset highlight when list closes
   useEffect(() => {
@@ -177,7 +179,7 @@ export const useComboBox = <Item>(props: UseComboBoxProps<Item>) => {
       setHighlightedIndex(undefined);
       setQuickSelection(false);
     }
-  }, [isListOpen, setHighlightedIndex, quickSelection]);
+  }, [isListOpen, setHighlightedIndex]);
 
   const initHighlightedIndex = () => {
     setHighlightedIndex(selectedItem ? source.indexOf(selectedItem) : -1);
diff --git a/packages/lab/src/combo-box-deprecated/internal/useMultiSelectComboBox.ts b/packages/lab/src/combo-box-deprecated/internal/useMultiSelectComboBox.ts
index 6cb1eee96b..e11190ea4c 100644
--- a/packages/lab/src/combo-box-deprecated/internal/useMultiSelectComboBox.ts
+++ b/packages/lab/src/combo-box-deprecated/internal/useMultiSelectComboBox.ts
@@ -262,7 +262,7 @@ export const useMultiSelectComboBox = <Item>(
       setHighlightedListIndex(undefined);
       setQuickSelection(false);
     }
-  }, [isListOpen, setHighlightedListIndex, setQuickSelection]);
+  }, [isListOpen, setHighlightedListIndex]);
 
   const previousSelectedItems = usePrevious(selectedItems);
 
@@ -279,12 +279,7 @@ export const useMultiSelectComboBox = <Item>(
     if (!selectedItems.length) {
       setHighlightedListIndex(undefined);
     }
-  }, [
-    selectedItems,
-    previousSelectedItems,
-    setInputValue,
-    setHighlightedListIndex,
-  ]);
+  }, [selectedItems, previousSelectedItems, setHighlightedListIndex]);
 
   // Remove highlight from list if a pill is highlighted
   useEffect(() => {
@@ -295,7 +290,7 @@ export const useMultiSelectComboBox = <Item>(
       setHighlightedListIndex(undefined);
       setQuickSelection(false);
     }
-  }, [inputState.highlightedIndex, setHighlightedListIndex, setQuickSelection]);
+  }, [inputState.highlightedIndex, setHighlightedListIndex]);
 
   const highlightedIndex = listState?.highlightedIndex;
 
diff --git a/packages/lab/src/combo-box/useCombobox.ts b/packages/lab/src/combo-box/useCombobox.ts
index 74b79fd436..87e550514a 100644
--- a/packages/lab/src/combo-box/useCombobox.ts
+++ b/packages/lab/src/combo-box/useCombobox.ts
@@ -162,7 +162,7 @@ export const useCombobox = <
       setValue(value);
       setFilterPattern(value === "" ? undefined : value);
     },
-    [setFilterPattern, setValue],
+    [setFilterPattern],
   );
 
   const reconcileInput = useCallback(
@@ -192,13 +192,7 @@ export const useCombobox = <
       reconcileInput(selected);
       onSelectionChange?.(evt, collectionItemsToItem(selected ?? null));
     },
-    [
-      collectionItemsToItem,
-      isMultiSelect,
-      onSelectionChange,
-      reconcileInput,
-      setIsOpen,
-    ],
+    [collectionItemsToItem, isMultiSelect, onSelectionChange, reconcileInput],
   );
 
   const handleSelectionChange = useCallback<
@@ -306,7 +300,7 @@ export const useCombobox = <
       }
       onOpenChange?.(open);
     },
-    [onOpenChange, setIsOpen],
+    [onOpenChange],
   );
 
   const { onClick: listHandlersOnClick } = listHookListHandlers;
@@ -356,7 +350,7 @@ export const useCombobox = <
 
       inputOnChange?.(evt, newValue);
     },
-    [allowFreeText, inputOnChange, setFilterPattern, setIsOpen, setValue],
+    [allowFreeText, inputOnChange, setFilterPattern, onSelectionChange],
   );
 
   const { onFocus: listOnFocus } = listControlProps;
@@ -460,7 +454,7 @@ export const useCombobox = <
     if (indexPositions.length === 0) {
       setIsOpen(false);
     }
-  }, [highlightSelectedItem, indexPositions.length, setIsOpen]);
+  }, [highlightSelectedItem, indexPositions.length]);
 
   // const activeDescendant: string | undefined = selectionChanged
   //   ? ""
diff --git a/packages/lab/src/common-hooks/itemToString.ts b/packages/lab/src/common-hooks/itemToString.ts
index b4dbad2520..69449adbe1 100644
--- a/packages/lab/src/common-hooks/itemToString.ts
+++ b/packages/lab/src/common-hooks/itemToString.ts
@@ -1,4 +1,3 @@
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type ItemToStringFunction = (item: any) => string;
 
 const isPlainObject = (obj: unknown) =>
diff --git a/packages/lab/src/common-hooks/use-drag-drop.js b/packages/lab/src/common-hooks/use-drag-drop.js
index 30142b321c..1c170e7706 100644
--- a/packages/lab/src/common-hooks/use-drag-drop.js
+++ b/packages/lab/src/common-hooks/use-drag-drop.js
@@ -36,7 +36,7 @@ export const useDragDrop = ({
   const measuredDropTargets = useRef([]);
 
   const displaceItem = useCallback(
-    (item = null, size, displaceEnd) => {
+    (item, size, displaceEnd) => {
       if (item) {
         const { START, END } = dimensions(orientation);
         const pos = displaceEnd ? END : START;
diff --git a/packages/lab/src/common-hooks/use-hierarchical-drag-drop.js b/packages/lab/src/common-hooks/use-hierarchical-drag-drop.js
index 07572c21fe..13e360becb 100644
--- a/packages/lab/src/common-hooks/use-hierarchical-drag-drop.js
+++ b/packages/lab/src/common-hooks/use-hierarchical-drag-drop.js
@@ -36,7 +36,7 @@ export const useDragDrop = ({
   const measuredDropTargets = useRef([]);
 
   const displaceItem = useCallback(
-    (item = null, size, displaceEnd) => {
+    (item, size, displaceEnd) => {
       if (item) {
         const { START, END } = dimensions(orientation);
         const pos = displaceEnd ? END : START;
diff --git a/packages/lab/src/common-hooks/useAutoSizer.ts b/packages/lab/src/common-hooks/useAutoSizer.ts
index cfda458e97..bc9b5455ca 100644
--- a/packages/lab/src/common-hooks/useAutoSizer.ts
+++ b/packages/lab/src/common-hooks/useAutoSizer.ts
@@ -51,7 +51,7 @@ export function useAutoSizer<Element extends HTMLElement>(
         }
       };
     }
-  }, [handleResize, responsive]);
+  }, [handleResize, responsive, ref]);
 
   return size;
 }
diff --git a/packages/lab/src/common-hooks/useImperativeScrollingAPI.ts b/packages/lab/src/common-hooks/useImperativeScrollingAPI.ts
index 4f8686990d..0b1d49451b 100644
--- a/packages/lab/src/common-hooks/useImperativeScrollingAPI.ts
+++ b/packages/lab/src/common-hooks/useImperativeScrollingAPI.ts
@@ -20,9 +20,9 @@ export interface ScrollingAPIHook<Item> {
 }
 
 const noScrolling: ScrollingAPI<unknown> = {
-  scrollToIndex: (itemIndex: number) => undefined,
-  scrollToItem: (item) => undefined,
-  scrollTo: (scrollOffset: number) => undefined,
+  scrollToIndex: () => undefined,
+  scrollToItem: () => undefined,
+  scrollTo: () => undefined,
 };
 
 export const useImperativeScrollingAPI = <Item>({
@@ -51,7 +51,12 @@ export const useImperativeScrollingAPI = <Item>({
         }
       },
     }),
-    [collectionHook.data, collectionHook.toCollectionItem, scrollIntoView],
+    [
+      collectionHook.data,
+      collectionHook.toCollectionItem,
+      scrollIntoView,
+      scrollableRef,
+    ],
   );
 
   useImperativeHandle(
@@ -62,6 +67,6 @@ export const useImperativeScrollingAPI = <Item>({
       }
       return noScrolling;
     },
-    [scrollHandles],
+    [scrollHandles, scrollableRef],
   );
 };
diff --git a/packages/lab/src/common-hooks/useKeyboardNavigation.ts b/packages/lab/src/common-hooks/useKeyboardNavigation.ts
index abb61097db..93a87dc137 100644
--- a/packages/lab/src/common-hooks/useKeyboardNavigation.ts
+++ b/packages/lab/src/common-hooks/useKeyboardNavigation.ts
@@ -102,7 +102,7 @@ const pageDown = (
     containerEl.scrollTo(0, newScrollTop);
     // Might need to do this in a timeout, in case virtualized content has rendered
     let nextIdx = index;
-    let nextRect;
+    let nextRect: DOMRect;
     do {
       nextIdx += 1;
       nextRect = getItemRect(indexPositions[nextIdx]);
@@ -127,7 +127,7 @@ const pageUp = async (
       // we need to allow them to be rendered.
       requestAnimationFrame(() => {
         let nextIdx = index;
-        let nextRect;
+        let nextRect: DOMRect;
         do {
           nextIdx -= 1;
           nextRect = getItemRect(indexPositions[nextIdx]);
@@ -174,7 +174,7 @@ export const useKeyboardNavigation = <
         lastFocus.current = idx;
       }
     },
-    [onHighlight, setHighlightedIdx],
+    [onHighlight],
   );
 
   const nextPageItemIdx = useCallback(
@@ -240,58 +240,58 @@ export const useKeyboardNavigation = <
   // does this belong here or should it be a method passed in?
   const keyboardNavigation = useRef(false);
   const ignoreFocus = useRef<boolean>(false);
-  const setIgnoreFocus = (value: boolean) => (ignoreFocus.current = value);
+  const setIgnoreFocus = useCallback(
+    (value: boolean) => (ignoreFocus.current = value),
+    [],
+  );
 
-  const handleFocus = useCallback(
-    (e: FocusEvent) => {
-      // Ignore focus if mouse has been used
-      if (ignoreFocus.current) {
-        ignoreFocus.current = false;
-      } else {
-        // If mouse wan't used, then keyboard must have been
-        keyboardNavigation.current = true;
-        if (indexPositions.length === 0) {
-          setHighlightedIndex(LIST_FOCUS_VISIBLE);
-        } else if (highlightedIndex !== -1) {
-          // We need to force a render here. We're not changing the highlightedIdx, but we want to
-          // make sure we render with the correct focusVisible value. We don't store focusVisible
-          // in state, as there are places where we would double render, as highlightedIdx also changes.
-          forceRender({});
-        } else if (restoreLastFocus) {
-          if (lastFocus.current !== -1) {
-            setHighlightedIndex(lastFocus.current);
-          } else {
-            const selectedItemIdx = getIndexOfSelectedItem(
-              indexPositions,
-              selected,
-            );
-            if (selectedItemIdx !== -1) {
-              setHighlightedIndex(selectedItemIdx);
-            } else {
-              setHighlightedIndex(0);
-            }
-          }
-        } else if (hasSelection(selected)) {
+  const handleFocus = useCallback(() => {
+    // Ignore focus if mouse has been used
+    if (ignoreFocus.current) {
+      ignoreFocus.current = false;
+    } else {
+      // If mouse wan't used, then keyboard must have been
+      keyboardNavigation.current = true;
+      if (indexPositions.length === 0) {
+        setHighlightedIndex(LIST_FOCUS_VISIBLE);
+      } else if (highlightedIndex !== -1) {
+        // We need to force a render here. We're not changing the highlightedIdx, but we want to
+        // make sure we render with the correct focusVisible value. We don't store focusVisible
+        // in state, as there are places where we would double render, as highlightedIdx also changes.
+        forceRender({});
+      } else if (restoreLastFocus) {
+        if (lastFocus.current !== -1) {
+          setHighlightedIndex(lastFocus.current);
+        } else {
           const selectedItemIdx = getIndexOfSelectedItem(
             indexPositions,
             selected,
           );
-          setHighlightedIndex(selectedItemIdx);
-        } else if (disableHighlightOnFocus !== true) {
-          setHighlightedIndex(nextFocusableItemIdx());
+          if (selectedItemIdx !== -1) {
+            setHighlightedIndex(selectedItemIdx);
+          } else {
+            setHighlightedIndex(0);
+          }
         }
+      } else if (hasSelection(selected)) {
+        const selectedItemIdx = getIndexOfSelectedItem(
+          indexPositions,
+          selected,
+        );
+        setHighlightedIndex(selectedItemIdx);
+      } else if (disableHighlightOnFocus !== true) {
+        setHighlightedIndex(nextFocusableItemIdx());
       }
-    },
-    [
-      disableHighlightOnFocus,
-      highlightedIndex,
-      indexPositions,
-      nextFocusableItemIdx,
-      restoreLastFocus,
-      selected,
-      setHighlightedIndex,
-    ],
-  );
+    }
+  }, [
+    disableHighlightOnFocus,
+    highlightedIndex,
+    indexPositions,
+    nextFocusableItemIdx,
+    restoreLastFocus,
+    selected,
+    setHighlightedIndex,
+  ]);
 
   const navigateChildItems = useCallback(
     async (e: KeyboardEvent) => {
@@ -368,8 +368,8 @@ export const useKeyboardNavigation = <
     handleFocus,
     handleKeyDown,
     restoreLastFocus,
-    setHighlightedIdx,
     setHighlightedIndex,
+    setIgnoreFocus,
   ]);
 
   return {
diff --git a/packages/lab/src/common-hooks/useKeyboardNavigationPanel.ts b/packages/lab/src/common-hooks/useKeyboardNavigationPanel.ts
index 7d2f6ad510..ca29821ea3 100644
--- a/packages/lab/src/common-hooks/useKeyboardNavigationPanel.ts
+++ b/packages/lab/src/common-hooks/useKeyboardNavigationPanel.ts
@@ -1,7 +1,6 @@
 import { useControlled } from "@salt-ds/core";
 import { type KeyboardEvent, useCallback, useMemo, useRef } from "react";
 import type { CollectionItem } from "./collectionTypes";
-import { Tab } from "./keyUtils";
 import type { NavigationHookResult, NavigationProps } from "./navigationTypes";
 
 type NavigationDirection = "FWD" | "BWD";
@@ -61,7 +60,7 @@ export const useKeyboardNavigationPanel = ({
         targetEl?.focus();
       }
     },
-    [focusOnHighlight, indexPositions, onHighlight, setHighlightedIdx],
+    [focusOnHighlight, indexPositions, onHighlight],
   );
 
   const nextFocusableItemIdx = useCallback(
@@ -95,7 +94,10 @@ export const useKeyboardNavigationPanel = ({
   // does this belong here or should it be a method passed in?
   const keyboardNavigation = useRef(true);
   const ignoreFocus = useRef<boolean>(false);
-  const setIgnoreFocus = (value: boolean) => (ignoreFocus.current = value);
+  const setIgnoreFocus = useCallback(
+    (value: boolean) => (ignoreFocus.current = value),
+    [],
+  );
 
   const handleFocus = useCallback(() => {
     if (ignoreFocus.current) {
@@ -106,7 +108,7 @@ export const useKeyboardNavigationPanel = ({
   }, [nextFocusableItemIdx, setHighlightedIndex]);
 
   const navigateChildItems = useCallback(
-    (e: React.KeyboardEvent) => {
+    (e: KeyboardEvent) => {
       const direction: NavigationDirection = e.shiftKey ? "BWD" : "FWD";
       const nextIdx = nextFocusableItemIdx(direction, highlightedIdx);
       console.log(`nextFocusableItem from ${highlightedIdx} is ${nextIdx}`);
@@ -164,7 +166,7 @@ export const useKeyboardNavigationPanel = ({
         setHighlightedIndex(-1);
       },
     }),
-    [handleFocus, handleKeyDown, setHighlightedIndex],
+    [handleFocus, handleKeyDown, setHighlightedIndex, setIgnoreFocus],
   );
 
   return {
diff --git a/packages/lab/src/common-hooks/useSelection.ts b/packages/lab/src/common-hooks/useSelection.ts
index 8cbe3164b4..26d5eb20cc 100644
--- a/packages/lab/src/common-hooks/useSelection.ts
+++ b/packages/lab/src/common-hooks/useSelection.ts
@@ -192,7 +192,6 @@ export const useSelection = <
       selectRange,
       selectDeselectable,
       selectDefault,
-      setSelected,
       onSelectionChange,
     ],
   );
diff --git a/packages/lab/src/common-hooks/useViewportTracking.ts b/packages/lab/src/common-hooks/useViewportTracking.ts
index f90729d9af..2474c7db3b 100644
--- a/packages/lab/src/common-hooks/useViewportTracking.ts
+++ b/packages/lab/src/common-hooks/useViewportTracking.ts
@@ -70,15 +70,18 @@ export const useViewportTracking = <Item>({
     contentHeight: 0,
   });
 
-  const scrollTo = useCallback((scrollPos: number) => {
-    scrolling.current = true;
-    if (containerRef.current) {
-      containerRef.current.scrollTop = scrollPos;
-    }
-    setTimeout(() => {
-      scrolling.current = false;
-    });
-  }, []);
+  const scrollTo = useCallback(
+    (scrollPos: number) => {
+      scrolling.current = true;
+      if (containerRef.current) {
+        containerRef.current.scrollTop = scrollPos;
+      }
+      setTimeout(() => {
+        scrolling.current = false;
+      });
+    },
+    [containerRef],
+  );
 
   const scrollToStart = useCallback(() => scrollTo(0), [scrollTo]);
 
diff --git a/packages/lab/src/date-input/DateInput.tsx b/packages/lab/src/date-input/DateInput.tsx
index ab28867d02..2fc193690a 100644
--- a/packages/lab/src/date-input/DateInput.tsx
+++ b/packages/lab/src/date-input/DateInput.tsx
@@ -246,7 +246,7 @@ export const DateInput = forwardRef<
     } else {
       setStartDateStringValue(dateFormatter(selectedDate));
     }
-  }, [selectedDate, dateFormatter, selectionVariant]);
+  }, [selectedDate, dateFormatter]);
 
   const isRequired = formFieldRequired
     ? ["required", "asterisk"].includes(formFieldRequired)
diff --git a/packages/lab/src/date-picker/DatePickerPanel.tsx b/packages/lab/src/date-picker/DatePickerPanel.tsx
index f9d690457b..54e80892b9 100644
--- a/packages/lab/src/date-picker/DatePickerPanel.tsx
+++ b/packages/lab/src/date-picker/DatePickerPanel.tsx
@@ -144,7 +144,7 @@ export const DatePickerPanel = forwardRef<
     } else {
       setStartVisibleMonth(selectedDate);
     }
-  }, [selectedDate]);
+  }, [selectedDate, setEndVisibleMonth, setStartVisibleMonth]);
 
   const firstCalendarProps: CalendarProps = isRangePicker
     ? {
diff --git a/packages/lab/src/dropdown/useClickAway.ts b/packages/lab/src/dropdown/useClickAway.ts
index e44cca4a4a..a45fb98440 100644
--- a/packages/lab/src/dropdown/useClickAway.ts
+++ b/packages/lab/src/dropdown/useClickAway.ts
@@ -49,5 +49,5 @@ export const useClickAway: ClickawayHook = ({
         document.body.removeEventListener("keydown", escapeKeyHandler, true);
       }
     };
-  }, [isOpen, onClose]);
+  }, [isOpen, onClose, popperRef, rootRef]);
 };
diff --git a/packages/lab/src/dropdown/useDropdown.ts b/packages/lab/src/dropdown/useDropdown.ts
index 07b204af00..5101b10ac0 100644
--- a/packages/lab/src/dropdown/useDropdown.ts
+++ b/packages/lab/src/dropdown/useDropdown.ts
@@ -67,7 +67,7 @@ export const useDropdown = <
       }
       onSelectionChange?.(evt, selected);
     },
-    [isMultiSelect, onOpenChange, onSelectionChange, setIsOpen],
+    [isMultiSelect, onOpenChange, onSelectionChange],
   );
 
   const handleSelect = useCallback<SelectHandler<Item>>(
@@ -78,7 +78,7 @@ export const useDropdown = <
       }
       onSelect?.(evt, selected);
     },
-    [isMultiSelect, onOpenChange, onSelect, setIsOpen],
+    [isMultiSelect, onOpenChange, onSelect],
   );
 
   const listHook = useList<Item, Selection>({
@@ -104,7 +104,7 @@ export const useDropdown = <
       setIsOpen(open);
       onOpenChange?.(open);
     },
-    [onOpenChange, setIsOpen],
+    [onOpenChange],
   );
 
   const triggerLabel = useMemo(() => {
diff --git a/packages/lab/src/dropdown/useDropdownBase.ts b/packages/lab/src/dropdown/useDropdownBase.ts
index f61ee8fdb4..faf9a6bf63 100644
--- a/packages/lab/src/dropdown/useDropdownBase.ts
+++ b/packages/lab/src/dropdown/useDropdownBase.ts
@@ -19,7 +19,6 @@ export const useDropdownBase = ({
   onOpenChange,
   onKeyDown: onKeyDownProp,
   openOnFocus,
-  popupComponent: { props: componentProps },
   popupWidth: popupWidthProp,
   rootRef,
   width,
@@ -49,12 +48,12 @@ export const useDropdownBase = ({
   const showDropdown = useCallback(() => {
     setIsOpen(true);
     onOpenChange?.(true);
-  }, [onOpenChange, setIsOpen]);
+  }, [onOpenChange]);
 
   const hideDropdown = useCallback(() => {
     setIsOpen(false);
     onOpenChange?.(false);
-  }, [onOpenChange, setIsOpen]);
+  }, [onOpenChange]);
 
   useClickAway({
     popperRef,
@@ -76,7 +75,7 @@ export const useDropdownBase = ({
         }, 1000);
       }
     }
-  }, [disabled, onOpenChange, openOnFocus, setFormFieldFocused, setIsOpen]);
+  }, [disabled, onOpenChange, openOnFocus, setFormFieldFocused]);
 
   const handleTriggerBlur = useCallback(() => {
     setFormFieldFocused?.(false);
@@ -95,7 +94,7 @@ export const useDropdownBase = ({
         onOpenChange?.(newIsOpen);
       }
     },
-    [isOpen, setIsOpen, onOpenChange],
+    [isOpen, onOpenChange],
   );
 
   const handleKeydown = useCallback(
@@ -132,7 +131,7 @@ export const useDropdownBase = ({
     return [labelledBy, labelledByProp].filter((x) => !!x).join(" ");
   };
 
-  // TODO do we use aria-popup - valid values are menu, disloag, grid, tree, listbox
+  // TODO do we use aria-popup - valid values are menu, dialog, grid, tree, listbox
   const triggerProps = {
     ...restA11yProps,
     "aria-expanded": isOpen,
diff --git a/packages/lab/src/editable-label/EditableLabel.tsx b/packages/lab/src/editable-label/EditableLabel.tsx
index 36d9293278..76a5adba89 100644
--- a/packages/lab/src/editable-label/EditableLabel.tsx
+++ b/packages/lab/src/editable-label/EditableLabel.tsx
@@ -79,13 +79,13 @@ export const EditableLabel = forwardRef(function EditableLabel(
         inputRef.current.focus();
       }
     }
-  }, [editing, inputRef]);
+  }, [editing]);
 
   const enterEditMode = useCallback(() => {
     setEditing(true);
     // ignoreBlur.current = false;
     onEnterEditMode?.();
-  }, [onEnterEditMode, setEditing]);
+  }, [onEnterEditMode]);
 
   const exitEditMode = ({
     cancelEdit = false,
diff --git a/packages/lab/src/focus-manager/FocusManager.tsx b/packages/lab/src/focus-manager/FocusManager.tsx
index 7f3fb5e243..9ad94632bc 100644
--- a/packages/lab/src/focus-manager/FocusManager.tsx
+++ b/packages/lab/src/focus-manager/FocusManager.tsx
@@ -173,7 +173,7 @@ export function FocusManager(props: FocusManagerProps): JSX.Element {
 
   useIsomorphicLayoutEffect(() => {
     if (active && !disableAutoFocus) {
-      let nodeToFocus;
+      let nodeToFocus: HTMLElement | null | undefined;
 
       if (autoFocusRef?.current) {
         nodeToFocus = autoFocusRef.current;
diff --git a/packages/lab/src/input-legacy/InputLegacy.tsx b/packages/lab/src/input-legacy/InputLegacy.tsx
index 61e6a1e3d6..8a2d397ecc 100644
--- a/packages/lab/src/input-legacy/InputLegacy.tsx
+++ b/packages/lab/src/input-legacy/InputLegacy.tsx
@@ -105,15 +105,13 @@ export interface InputLegacyProps
 }
 
 function mergeA11yProps(
-  a11yProps: Partial<
-    ReturnType<typeof useFormFieldLegacyProps>["a11yProps"]
-  > = {},
-  inputProps: InputLegacyProps["inputProps"] = {},
+  a11yProps: Partial<ReturnType<typeof useFormFieldLegacyProps>["a11yProps"]>,
+  inputProps: InputLegacyProps["inputProps"],
   misplacedAriaProps: AriaAttributes,
 ) {
   const ariaLabelledBy = clsx(
-    a11yProps["aria-labelledby"],
-    inputProps["aria-labelledby"],
+    a11yProps?.["aria-labelledby"],
+    inputProps?.["aria-labelledby"],
   );
 
   return {
diff --git a/packages/lab/src/list-deprecated/itemToString.ts b/packages/lab/src/list-deprecated/itemToString.ts
index e99d4938c3..5a3c30845f 100644
--- a/packages/lab/src/list-deprecated/itemToString.ts
+++ b/packages/lab/src/list-deprecated/itemToString.ts
@@ -1,6 +1,5 @@
 import { isPlainObject } from "./internal/helpers";
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export type ItemToStringFunction = (item: any) => string;
 
 export function itemToString(item: any) {
diff --git a/packages/lab/src/list-deprecated/useList.ts b/packages/lab/src/list-deprecated/useList.ts
index 8e57190324..088c196327 100644
--- a/packages/lab/src/list-deprecated/useList.ts
+++ b/packages/lab/src/list-deprecated/useList.ts
@@ -180,7 +180,7 @@ export function useList<Item, Variant extends ListSelectionVariant>(
       item: Item,
     ) => {
       const isSelected = item === selectedItem;
-      let nextItem;
+      let nextItem: Item | null;
 
       if (isSelected && !isDeselectable) {
         return;
@@ -204,13 +204,7 @@ export function useList<Item, Variant extends ListSelectionVariant>(
         );
       }
     },
-    [
-      isDeselectable,
-      onChange,
-      selectedItem,
-      setHighlightedIndex,
-      setSelectedItem,
-    ],
+    [isDeselectable, onChange, selectedItem],
   );
 
   const handleMultiSelect = useCallback(
@@ -226,7 +220,7 @@ export function useList<Item, Variant extends ListSelectionVariant>(
         nextItems = nextItems.concat([item]).sort(indexComparator);
         setHighlightedIndex(index);
       } else {
-        nextItems = nextItems.filter((selected: any) => selected !== item);
+        nextItems = nextItems.filter((selected) => selected !== item);
       }
 
       setSelectedItem(
@@ -242,13 +236,7 @@ export function useList<Item, Variant extends ListSelectionVariant>(
         );
       }
     },
-    [
-      indexComparator,
-      onChange,
-      selectedItem,
-      setHighlightedIndex,
-      setSelectedItem,
-    ],
+    [indexComparator, onChange, selectedItem],
   );
 
   const handleRangeSelect = useCallback(
@@ -294,7 +282,7 @@ export function useList<Item, Variant extends ListSelectionVariant>(
         );
       }
     },
-    [getItemIndex, onChange, selectedItem, setSelectedItem, source],
+    [getItemIndex, onChange, selectedItem, source],
   );
 
   const handleExtendedSelect = useCallback(
@@ -331,13 +319,7 @@ export function useList<Item, Variant extends ListSelectionVariant>(
         }
       }
     },
-    [
-      handleMultiSelect,
-      handleRangeSelect,
-      onChange,
-      selectedItem,
-      setSelectedItem,
-    ],
+    [handleMultiSelect, handleRangeSelect, onChange, selectedItem],
   );
 
   const handleSelect = useCallback(
diff --git a/packages/lab/src/list-next/useList.ts b/packages/lab/src/list-next/useList.ts
index 589ab98702..58b467cae2 100644
--- a/packages/lab/src/list-next/useList.ts
+++ b/packages/lab/src/list-next/useList.ts
@@ -96,7 +96,7 @@ export const useList = ({
       setActiveDescendant(element.id);
       updateScroll(element);
     },
-    [setHighlightedItem, updateScroll],
+    [updateScroll],
   );
 
   const selectItem = useCallback(
@@ -107,7 +107,7 @@ export const useList = ({
         updateHighlighted(element);
       }
     },
-    [setSelectedItem, updateHighlighted],
+    [updateHighlighted],
   );
 
   // Effect to move the cursor when items change controlled.
@@ -190,12 +190,9 @@ export const useList = ({
     [selectedItem],
   );
 
-  const highlight = useCallback(
-    (event: SyntheticEvent<HTMLLIElement>) => {
-      setHighlightedItem(event.currentTarget.dataset.value);
-    },
-    [setHighlightedItem],
-  );
+  const highlight = useCallback((event: SyntheticEvent<HTMLLIElement>) => {
+    setHighlightedItem(event.currentTarget.dataset.value);
+  }, []);
 
   const isHighlighted = useCallback(
     (value: string) => highlightedItem === value,
diff --git a/packages/lab/src/list/List.tsx b/packages/lab/src/list/List.tsx
index 02234e2905..79400a8bf2 100644
--- a/packages/lab/src/list/List.tsx
+++ b/packages/lab/src/list/List.tsx
@@ -274,9 +274,9 @@ export const List = forwardRef(function List<
     const listItems: ReactElement[] = [];
     while (idx.value < end) {
       const item = items[idx.value];
-      if (item.header) {
+      if (item.header && item.label != null) {
         listItems.push(
-          createHeader(idx, item.id, item.label!, item.expanded === false),
+          createHeader(idx, item.id, item.label, item.expanded === false),
         );
       } else if (item.childNodes) {
         addGroup(listItems, items, idx);
diff --git a/packages/lab/src/list/useVirtualization.ts b/packages/lab/src/list/useVirtualization.ts
index 7bbca64140..c6c4f68e2d 100644
--- a/packages/lab/src/list/useVirtualization.ts
+++ b/packages/lab/src/list/useVirtualization.ts
@@ -86,7 +86,7 @@ export const useVirtualization = <Item>({
         updateRows(0, viewport.rowCount);
       }
     }
-  }, [data, itemGapSize, keys, updateRows]);
+  }, [data, itemGapSize, updateRows, viewportRef]);
 
   const handleVerticalScroll = useCallback(
     (e: UIEvent<HTMLElement>) => {
diff --git a/packages/lab/src/query-input/internal/CategoryList.tsx b/packages/lab/src/query-input/internal/CategoryList.tsx
index 8bfb1e57c4..4d49625868 100644
--- a/packages/lab/src/query-input/internal/CategoryList.tsx
+++ b/packages/lab/src/query-input/internal/CategoryList.tsx
@@ -51,7 +51,7 @@ export function CategoryList(props: CategoryListProps) {
         });
       }
     }, 0);
-  }, [categories, setMeasuredCategories, setContextValue]);
+  }, [categories]);
 
   const onSelect: SelectHandler<QueryInputCategory> = useCallback(
     (_, item) => {
@@ -65,9 +65,9 @@ export function CategoryList(props: CategoryListProps) {
   if (isMeasuring) {
     return (
       <div ref={measureRef} className={withBaseName("categoryWidthMeasure")}>
-        {categories.map((c, i) => {
+        {categories.map((c) => {
           return (
-            <div key={i} className={withBaseName("category")}>
+            <div key={c.name} className={withBaseName("category")}>
               {c.name}
             </div>
           );
diff --git a/packages/lab/src/query-input/internal/QueryInputBody.tsx b/packages/lab/src/query-input/internal/QueryInputBody.tsx
index e5d111c04a..991197cdc0 100644
--- a/packages/lab/src/query-input/internal/QueryInputBody.tsx
+++ b/packages/lab/src/query-input/internal/QueryInputBody.tsx
@@ -90,8 +90,10 @@ export const QueryInputBody = forwardRef<HTMLDivElement, QueryInputBodyProps>(
           disabled={disabled}
           className={withBaseName("input")}
           selectedItems={selectedItems}
-          itemToString={itemToString as any}
-          stringToItem={stringToItem as any}
+          // @ts-ignore
+          itemToString={itemToString}
+          // @ts-ignore
+          stringToItem={stringToItem}
           onInputFocus={onInputFocus}
           onInputBlur={onInputBlur}
           value={inputValue}
@@ -99,7 +101,8 @@ export const QueryInputBody = forwardRef<HTMLDivElement, QueryInputBodyProps>(
           onInputChange={onInputChange}
           expanded={isFocused}
           onClear={onInputClear}
-          onChange={onSelectedItemsChange as any}
+          // @ts-ignore
+          onChange={onSelectedItemsChange}
           onKeyDown={onKeyDown}
         />
         <div className={withBaseName("separator")} />
diff --git a/packages/lab/src/query-input/useQueryInput.ts b/packages/lab/src/query-input/useQueryInput.ts
index 6966d70aa0..f802970554 100644
--- a/packages/lab/src/query-input/useQueryInput.ts
+++ b/packages/lab/src/query-input/useQueryInput.ts
@@ -306,37 +306,48 @@ export function useQueryInput(
         setHighlightedValueIndex(0);
         return;
       case "End":
-        setHighlightedValueIndex(selectedCategory!.values.length);
+        if (selectedCategory != null) {
+          setHighlightedValueIndex(selectedCategory.values.length);
+        }
         return;
       case "ArrowUp":
         setHighlightedValueIndex((i) => Math.max(0, i - 1));
         return;
       case "ArrowDown":
-        setHighlightedValueIndex((i) =>
-          Math.min(selectedCategory!.values.length, i + 1),
-        );
+        setHighlightedValueIndex((i) => {
+          if (selectedCategory != null) {
+            return Math.min(selectedCategory.values.length, i + 1);
+          }
+          return i;
+        });
         return;
       case "PageUp":
         setHighlightedValueIndex((i) => Math.max(0, i - displayedItemCount));
         return;
       case "PageDown":
-        setHighlightedValueIndex((i) =>
-          Math.min(selectedCategory!.values.length, i + displayedItemCount),
-        );
+        setHighlightedValueIndex((i) => {
+          if (selectedCategory != null) {
+            return Math.min(
+              selectedCategory.values.length,
+              i + displayedItemCount,
+            );
+          }
+          return i;
+        });
         return;
       case "Enter":
-        if (highlightedValueIndex === 0) {
+        if (highlightedValueIndex === 0 || selectedCategory == null) {
           setSelectedCategory(null);
         } else {
-          const value = selectedCategory!.values[highlightedValueIndex - 1];
+          const value = selectedCategory.values[highlightedValueIndex - 1];
           const newItems = selectedItems.filter(
             (item) =>
               !(
-                item.category === selectedCategory!.name && item.value === value
+                item.category === selectedCategory.name && item.value === value
               ),
           );
           if (newItems.length === selectedItems.length) {
-            newItems.push({ category: selectedCategory!.name, value });
+            newItems.push({ category: selectedCategory.name, value });
           }
           onSelectedItemsChange(newItems);
         }
diff --git a/packages/lab/src/responsive/useDynamicCollapse.ts b/packages/lab/src/responsive/useDynamicCollapse.ts
index 00fea33bf3..f6b37e90eb 100644
--- a/packages/lab/src/responsive/useDynamicCollapse.ts
+++ b/packages/lab/src/responsive/useDynamicCollapse.ts
@@ -20,7 +20,7 @@ const UNCOLLAPSED_DYNAMIC_ITEMS =
   '[data-collapsible="dynamic"]:not([data-collapsed="true"]):not([data-collapsing="true"])';
 
 const hasUncollapsedDynamicItems = (containerRef: ElementRef) =>
-  containerRef.current!.querySelector(UNCOLLAPSED_DYNAMIC_ITEMS) !== null;
+  containerRef.current?.querySelector(UNCOLLAPSED_DYNAMIC_ITEMS) !== null;
 
 const thereAreCollapsibleItemsAndTheyAreAllCollapsed = (
   items: OverflowItem[],
@@ -34,8 +34,6 @@ const nextItemToCollapse = (listItems: OverflowItem[]): OverflowItem =>
 
 export const useDynamicCollapse = ({
   collectionHook,
-  innerContainerSize = 0,
-  label = "Toolbar",
   overflowItemsRef: managedItemsRef,
   overflowContainerRef: ref,
   orientation,
diff --git a/packages/lab/src/responsive/useInstantCollapse.ts b/packages/lab/src/responsive/useInstantCollapse.ts
index eda42b14aa..80e1f43000 100644
--- a/packages/lab/src/responsive/useInstantCollapse.ts
+++ b/packages/lab/src/responsive/useInstantCollapse.ts
@@ -49,7 +49,7 @@ const uncollapseItems = (items: OverflowItem[], containerSize: number) => {
   const result: OverflowItem[] = [];
   while (collapsed.length) {
     const item = collapsed.pop() as OverflowItem;
-    const itemDiff = item.fullSize! - item.size;
+    const itemDiff = (item.fullSize ?? 0) - item.size;
     if (diff >= itemDiff) {
       result.push({
         ...item,
@@ -69,7 +69,6 @@ export const useInstantCollapse = ({
   collectionHook,
   hasOverflowedItems,
   innerContainerSize = 0,
-  label = "Toolbar",
   overflowContainerRef: ref,
   overflowItemsRef,
   orientation,
diff --git a/packages/lab/src/responsive/useOverflow.ts b/packages/lab/src/responsive/useOverflow.ts
index a63193b6ae..20fd0e5cb7 100644
--- a/packages/lab/src/responsive/useOverflow.ts
+++ b/packages/lab/src/responsive/useOverflow.ts
@@ -169,7 +169,7 @@ export const useOverflow = ({
       }
       return [overflowCount, reinstatedItems];
     },
-    [],
+    [overflowItemsRef],
   );
 
   const resetMeasurements = useCallback(
diff --git a/packages/lab/src/responsive/useOverflowCollectionItems.ts b/packages/lab/src/responsive/useOverflowCollectionItems.ts
index dd52869126..90cefdfa06 100644
--- a/packages/lab/src/responsive/useOverflowCollectionItems.ts
+++ b/packages/lab/src/responsive/useOverflowCollectionItems.ts
@@ -52,7 +52,7 @@ const getItemsIdentity = (
   source?: OverflowSource[],
   children?: ReactNode,
 ): string => {
-  let identity;
+  let identity: string;
   if (Array.isArray(defaultSource)) {
     identity = defaultSourceIdentity(defaultSource);
   } else if (Array.isArray(source)) {
@@ -185,7 +185,6 @@ export const useOverflowCollectionItems: OverflowCollectionHook = ({
       measureManagedItems(true);
     }
     previousIdentityRef.current = identity;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [identity]);
 
   return {
diff --git a/packages/lab/src/responsive/useReclaimSpace.ts b/packages/lab/src/responsive/useReclaimSpace.ts
index 7c3acb8e16..ca0eac7f61 100644
--- a/packages/lab/src/responsive/useReclaimSpace.ts
+++ b/packages/lab/src/responsive/useReclaimSpace.ts
@@ -8,7 +8,6 @@ import type {
 import {
   getOverflowIndicator,
   measureContainerOverflow,
-  popNextItemByPriority,
 } from "./overflowUtils";
 
 const getPriority = (item: OverflowItem) => item.priority;
@@ -39,7 +38,7 @@ const canReleaseReclaimedSpace = (size: number, items: OverflowItem[]) => {
   const overflowedItem = findNextOverflowedItem(items);
   if (claimant && overflowedItem) {
     const renderedSize = items.reduce(addAllVisible, 0);
-    const { size: indicatorSize } = getOverflowIndicator(items)!;
+    const { size: indicatorSize } = getOverflowIndicator(items) ?? { size: 0 };
     const { size: overflowedSize } = overflowedItem;
     // TODO we can discount the indicator size ONLY IF overflowed item is only overflowed item
     const reclaimableSpace = getReclaimableSpace(claimant);
@@ -65,24 +64,6 @@ export const useReclaimSpace = ({
   overflowContainerRef: ref,
   orientation,
 }: OverflowHookProps): OverflowHookResult => {
-  const getAllOverflowedItems = useCallback(
-    (visibleContentSize: number, containerSize: number) => {
-      const newlyOverflowedItems = [];
-      const { current: managedItems } = managedItemsRef;
-      const visibleItems = managedItems.slice();
-      while (visibleContentSize > containerSize) {
-        const overflowedItem = popNextItemByPriority(visibleItems);
-        if (overflowedItem === null) {
-          break;
-        }
-        visibleContentSize -= overflowedItem.size;
-        newlyOverflowedItems.push(overflowedItem);
-      }
-      return newlyOverflowedItems;
-    },
-    [],
-  );
-
   const releaseReclaimedSpace = useCallback(() => {
     const { current: managedItems } = managedItemsRef;
 
@@ -102,7 +83,8 @@ export const useReclaimSpace = ({
         },
       });
     }
-  }, []);
+  }, [managedItemsRef, collectionHook.dispatch]);
+
   const handleResize = useCallback(
     (size: number, containerHasGrown?: boolean) => {
       const { isOverflowing: willOverflow } = measureContainerOverflow(
@@ -134,7 +116,13 @@ export const useReclaimSpace = ({
         }
       }
     },
-    [],
+    [
+      ref,
+      managedItemsRef,
+      releaseReclaimedSpace,
+      collectionHook.dispatch,
+      orientation,
+    ],
   );
 
   return {
diff --git a/packages/lab/src/responsive/useResizeObserver.ts b/packages/lab/src/responsive/useResizeObserver.ts
index 418f5569dc..4e59ce407b 100644
--- a/packages/lab/src/responsive/useResizeObserver.ts
+++ b/packages/lab/src/responsive/useResizeObserver.ts
@@ -1,4 +1,3 @@
-/* eslint-disable no-restricted-syntax */
 import { useIsomorphicLayoutEffect } from "@salt-ds/core";
 import { type RefObject, useCallback, useRef } from "react";
 export const WidthHeight = ["height", "width"];
@@ -111,10 +110,9 @@ export function useResizeObserver(
       // before fonts are ready and attempt to update entry
       observedMap.set(target, { measurements: {} as measurements<number> });
       cleanedUp = false;
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-      const { fonts } = document as any;
+
+      const { fonts } = document;
       if (fonts) {
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
         await fonts.ready;
       }
       if (!cleanedUp && resizeObserver) {
diff --git a/packages/lab/src/responsive/useWidth.ts b/packages/lab/src/responsive/useWidth.ts
index 3a086bcd65..27179aac91 100644
--- a/packages/lab/src/responsive/useWidth.ts
+++ b/packages/lab/src/responsive/useWidth.ts
@@ -26,7 +26,7 @@ export function useWidth<Element extends HTMLElement>(
       return undefined;
     }
     handleResize(ref.current.getBoundingClientRect());
-  }, [handleResize, responsive]);
+  }, [handleResize]);
 
   return [ref, width] as [RefObject<Element>, number];
 }
diff --git a/packages/lab/src/slider/internal/SliderMarkLabels.tsx b/packages/lab/src/slider/internal/SliderMarkLabels.tsx
index 44f39bb48e..d6d4fe7f0e 100644
--- a/packages/lab/src/slider/internal/SliderMarkLabels.tsx
+++ b/packages/lab/src/slider/internal/SliderMarkLabels.tsx
@@ -41,7 +41,11 @@ export function SliderMarkLabels(props: SliderMarkLabelsProps) {
     <div className={withBaseName()} style={style}>
       {marks.map((mark, i) => {
         return (
-          <div key={i} className={withBaseName("label")} style={labelStyles[i]}>
+          <div
+            key={isLabeledMark(mark) ? mark.value : mark}
+            className={withBaseName("label")}
+            style={labelStyles[i]}
+          >
             {isLabeledMark(mark) ? mark.label : `${mark}`}
           </div>
         );
diff --git a/packages/lab/src/slider/internal/SliderRail.tsx b/packages/lab/src/slider/internal/SliderRail.tsx
index 741ac3ca0e..b91e165242 100644
--- a/packages/lab/src/slider/internal/SliderRail.tsx
+++ b/packages/lab/src/slider/internal/SliderRail.tsx
@@ -4,11 +4,9 @@ import { useComponentCssInjection } from "@salt-ds/styles";
 import { useWindow } from "@salt-ds/window";
 import sliderCss from "../Slider.css";
 
-export type SliderRailProps = {};
-
 const withBaseName = makePrefixer("saltSliderRail");
 
-export function SliderRail(props: SliderRailProps) {
+export function SliderRail() {
   const targetWindow = useWindow();
   useComponentCssInjection({
     testId: "salt-slider",
diff --git a/packages/lab/src/slider/internal/SliderRailMarks.tsx b/packages/lab/src/slider/internal/SliderRailMarks.tsx
index 66308051a3..bb19d63a4c 100644
--- a/packages/lab/src/slider/internal/SliderRailMarks.tsx
+++ b/packages/lab/src/slider/internal/SliderRailMarks.tsx
@@ -2,7 +2,7 @@ import { makePrefixer } from "@salt-ds/core";
 import { clsx } from "clsx";
 import { type ReactNode, useMemo } from "react";
 import { createHandleStyles, createSliderRailMarksStyle } from "./styles";
-import { isMarkAtMax } from "./utils";
+import { isLabeledMark, isMarkAtMax } from "./utils";
 
 import { useComponentCssInjection } from "@salt-ds/styles";
 import { useWindow } from "@salt-ds/window";
@@ -48,7 +48,7 @@ export function SliderRailMarks(props: SliderRailMarksProps) {
       {marks.map((mark, i) => {
         return (
           <div
-            key={`Mark${i}`}
+            key={isLabeledMark(mark) ? mark.value : mark}
             className={clsx(withBaseName("mark"), {
               [withBaseName("max")]: isMarkAtMax(max, mark),
             })}
diff --git a/packages/lab/src/slider/internal/useSliderMouseDown.ts b/packages/lab/src/slider/internal/useSliderMouseDown.ts
index 45ba52fde1..9c3e7283a9 100644
--- a/packages/lab/src/slider/internal/useSliderMouseDown.ts
+++ b/packages/lab/src/slider/internal/useSliderMouseDown.ts
@@ -95,31 +95,34 @@ export function useSliderMouseDown(
     }
   }, []);
 
-  const onMouseUp = useCallback((event: MouseEvent) => {
+  const onMouseUp = useCallback(() => {
     document.removeEventListener("mouseup", onMouseUp);
     document.removeEventListener("mousemove", onMouseMove);
     mouseContext.current.handleIndex = undefined;
-  }, []);
+  }, [onMouseMove]);
 
-  return useCallback((event: ReactMouseEvent) => {
-    const { value, setValue, onChange } = mouseContext.current;
-    document.addEventListener("mouseup", onMouseUp);
-    document.addEventListener("mousemove", onMouseMove);
+  return useCallback(
+    (event: ReactMouseEvent) => {
+      const { value, setValue, onChange } = mouseContext.current;
+      document.addEventListener("mouseup", onMouseUp);
+      document.addEventListener("mousemove", onMouseMove);
 
-    const { clientX } = event;
-    const clickValue = valueFromClientX(mouseContext.current, clientX);
+      const { clientX } = event;
+      const clickValue = valueFromClientX(mouseContext.current, clientX);
 
-    const handleIndex = getNearestHandle(value, clickValue);
-    mouseContext.current.handleIndex = handleIndex;
-    const newValue = updateValueItem(value, handleIndex, clickValue);
+      const handleIndex = getNearestHandle(value, clickValue);
+      mouseContext.current.handleIndex = handleIndex;
+      const newValue = updateValueItem(value, handleIndex, clickValue);
 
-    if (newValue !== value) {
-      setValue(newValue);
-      if (onChange) {
-        onChange(newValue);
+      if (newValue !== value) {
+        setValue(newValue);
+        if (onChange) {
+          onChange(newValue);
+        }
       }
-    }
 
-    event.preventDefault();
-  }, []);
+      event.preventDefault();
+    },
+    [onMouseMove, onMouseUp],
+  );
 }
diff --git a/packages/lab/src/stepper-input/internal/useInterval.ts b/packages/lab/src/stepper-input/internal/useInterval.ts
index eacbeaeb2f..353b087c01 100644
--- a/packages/lab/src/stepper-input/internal/useInterval.ts
+++ b/packages/lab/src/stepper-input/internal/useInterval.ts
@@ -1,6 +1,6 @@
 import { useEffect, useRef } from "react";
 
-type IntervalFunction = () => unknown | void;
+type IntervalFunction = () => void;
 
 // https://gist.github.com/iamBevan/171cce94431b8c95206086252ce0c6c7
 function useInterval(callback: IntervalFunction, delay: number | null) {
diff --git a/packages/lab/src/stepper-input/internal/useSpinner.ts b/packages/lab/src/stepper-input/internal/useSpinner.ts
index a02e2e8dcc..5e8f86c9eb 100644
--- a/packages/lab/src/stepper-input/internal/useSpinner.ts
+++ b/packages/lab/src/stepper-input/internal/useSpinner.ts
@@ -7,13 +7,13 @@ const INTERVAL_DELAY = 300;
 function useSpinner(activationFn: () => void, isAtLimit: boolean) {
   const [buttonDown, setButtonDown] = useState(false);
 
-  const cancelInterval = () => setButtonDown(false);
-
   useEffect(() => {
     if (isAtLimit) setButtonDown(false);
   }, [isAtLimit]);
 
   useEffect(() => {
+    const cancelInterval = () => setButtonDown(false);
+
     window.addEventListener("keyup", cancelInterval);
     window.addEventListener("mouseup", cancelInterval);
     return () => {
diff --git a/packages/lab/src/tabs-next/TabstripNext.tsx b/packages/lab/src/tabs-next/TabstripNext.tsx
index 44d0e8d8f4..f7a65f1be0 100644
--- a/packages/lab/src/tabs-next/TabstripNext.tsx
+++ b/packages/lab/src/tabs-next/TabstripNext.tsx
@@ -84,7 +84,7 @@ export const TabstripNext = forwardRef<HTMLDivElement, TabstripNextProps>(
           onChange?.(event, { value: newValue });
         }
       },
-      [onChange, value, setValue],
+      [onChange, value],
     );
 
     const isActive = useCallback(
diff --git a/packages/lab/src/tabs/Tabstrip.tsx b/packages/lab/src/tabs/Tabstrip.tsx
index ec90af265a..d2030c3eed 100644
--- a/packages/lab/src/tabs/Tabstrip.tsx
+++ b/packages/lab/src/tabs/Tabstrip.tsx
@@ -305,6 +305,10 @@ export const Tabstrip = forwardRef(function Tabstrip(
     }
   }, [children]);
 
+  /*
+   * biome-ignore lint/correctness/useExhaustiveDependencies: We only want the effect to run when value changes, not every time focusedTabIndex changes.
+   * It doesn't matter if focusedTabIndex is stale in between calls - it will be correct when value changes.
+   */
   useIsomorphicLayoutEffect(() => {
     if (
       activeTabIndex !== null &&
@@ -313,10 +317,6 @@ export const Tabstrip = forwardRef(function Tabstrip(
     ) {
       tabstripHook.focusTab(activeTabIndex);
     }
-
-    // We only want the effect to run when value changes, not every time focusedTabIndex changes.
-    // It doesn't matter if focusedTabIndex is stale in between calls - it will be correct when
-    // value changes.
   }, [activeTabIndex]);
 
   const renderContent = () => {
diff --git a/packages/lab/src/tabs/drag-drop/drag-utils.ts b/packages/lab/src/tabs/drag-drop/drag-utils.ts
index 782d57487f..9c62315410 100644
--- a/packages/lab/src/tabs/drag-drop/drag-utils.ts
+++ b/packages/lab/src/tabs/drag-drop/drag-utils.ts
@@ -155,20 +155,20 @@ export const measureDropTargets = (
     const dimension = orientation === "horizontal" ? "width" : "height";
     const [start, size] = measureElementSizeAndPosition(element, dimension);
 
-    dragThresholds.push(
-      (previousThreshold = {
-        currentIndex: index,
-        dataIndex: Number.parseInt(element.dataset.index ?? "-1"),
-        index,
-        isDraggedElement: element === draggedItem,
-        isOverflowIndicator: element.dataset.overflowIndicator === "true",
-        element: element as HTMLElement,
-        start,
-        end: start + size,
-        size,
-        mid: start + size / 2,
-      }),
-    );
+    previousThreshold = {
+      currentIndex: index,
+      dataIndex: Number.parseInt(element.dataset.index ?? "-1"),
+      index,
+      isDraggedElement: element === draggedItem,
+      isOverflowIndicator: element.dataset.overflowIndicator === "true",
+      element: element as HTMLElement,
+      start,
+      end: start + size,
+      size,
+      mid: start + size / 2,
+    };
+
+    dragThresholds.push(previousThreshold);
   }
   return dragThresholds;
 };
diff --git a/packages/lab/src/tabs/drag-drop/useDragDropNaturalMovement.tsx b/packages/lab/src/tabs/drag-drop/useDragDropNaturalMovement.tsx
index 521133dd26..e009c953c3 100644
--- a/packages/lab/src/tabs/drag-drop/useDragDropNaturalMovement.tsx
+++ b/packages/lab/src/tabs/drag-drop/useDragDropNaturalMovement.tsx
@@ -81,7 +81,8 @@ export const useDragDropNaturalMovement: DragDropHook = ({
           ) {
             if (nextDropTarget.isOverflowIndicator) {
               // Does this belong in here or can we abstract it out
-              setShowOverflow((overflowMenuShowingRef.current = true));
+              overflowMenuShowingRef.current = true;
+              setShowOverflow(true);
             } else {
               const newDropTargets = moveDragItem(dropTargets, nextDropTarget);
               const draggedItem = getDraggedItem(newDropTargets);
@@ -101,7 +102,8 @@ export const useDragDropNaturalMovement: DragDropHook = ({
                 displaceLastItem(displacedItem, draggedItem.size, true);
               }
               measuredDropTargets.current = newDropTargets;
-              setShowOverflow((overflowMenuShowingRef.current = false));
+              overflowMenuShowingRef.current = false;
+              setShowOverflow(false);
             }
 
             dropTarget.current = nextDropTarget;
@@ -205,7 +207,6 @@ export const useDragDropNaturalMovement: DragDropHook = ({
       dragMouseUpHandler,
       itemQuery,
       orientation,
-      setIsDragging,
     ],
   );
 
diff --git a/packages/lab/src/tabs/drag-drop/useDragSpacers.ts b/packages/lab/src/tabs/drag-drop/useDragSpacers.ts
index 68fe61b7de..35df1b61ca 100644
--- a/packages/lab/src/tabs/drag-drop/useDragSpacers.ts
+++ b/packages/lab/src/tabs/drag-drop/useDragSpacers.ts
@@ -16,19 +16,22 @@ export const useDragSpacers = () => {
   const clearSpacers = useCallback(
     () =>
       spacers.forEach((spacer) => spacer.parentElement?.removeChild(spacer)),
-    [],
+    [spacers],
   );
 
-  const animateTransition = useCallback((size: number) => {
-    const [spacer1, spacer2] = spacers;
-    animationFrame.current = requestAnimationFrame(() => {
-      transitioning.current = true;
-      spacer1.style.cssText = "width: 0px";
-      spacer2.style.cssText = `width: ${size}px`;
-      spacers[0] = spacer2;
-      spacers[1] = spacer1;
-    });
-  }, []);
+  const animateTransition = useCallback(
+    (size: number) => {
+      const [spacer1, spacer2] = spacers;
+      animationFrame.current = requestAnimationFrame(() => {
+        transitioning.current = true;
+        spacer1.style.cssText = "width: 0px";
+        spacer2.style.cssText = `width: ${size}px`;
+        spacers[0] = spacer2;
+        spacers[1] = spacer1;
+      });
+    },
+    [spacers],
+  );
 
   const cancelAnyPendingAnimation = useCallback(() => {
     if (animationFrame.current) {
@@ -39,7 +42,7 @@ export const useDragSpacers = () => {
 
   const displaceItem = useCallback(
     (
-      item: MeasuredDropTarget | null = null,
+      item: MeasuredDropTarget | null,
       size: number,
       useTransition = false,
       direction?: Direction,
@@ -71,7 +74,7 @@ export const useDragSpacers = () => {
         }
       }
     },
-    [],
+    [animateTransition, cancelAnyPendingAnimation, clearSpacers, spacers],
   );
   const displaceLastItem = useCallback(
     (item: MeasuredDropTarget, size: number, useTransition = false) => {
@@ -107,7 +110,7 @@ export const useDragSpacers = () => {
         );
       }
     },
-    [],
+    [animateTransition, cancelAnyPendingAnimation, clearSpacers, spacers],
   );
 
   return {
diff --git a/packages/lab/src/tabs/useEditableItem.ts b/packages/lab/src/tabs/useEditableItem.ts
index d574139d50..3f5fa50314 100644
--- a/packages/lab/src/tabs/useEditableItem.ts
+++ b/packages/lab/src/tabs/useEditableItem.ts
@@ -44,7 +44,7 @@ export const useEditableItem = ({
   const onEnterEditMode = useCallback(() => {
     setEditing(true);
     onEnterEditModeProp?.();
-  }, [onEnterEditModeProp, setEditing]);
+  }, [onEnterEditModeProp]);
 
   const onExitEditMode = (
     originalValue: string,
diff --git a/packages/lab/src/tabs/useItemsWithIds.tsx b/packages/lab/src/tabs/useItemsWithIds.tsx
index 71899fc7a0..12afbe3e02 100644
--- a/packages/lab/src/tabs/useItemsWithIds.tsx
+++ b/packages/lab/src/tabs/useItemsWithIds.tsx
@@ -60,10 +60,7 @@ export const useItemsWithIds = (
     return normalizeItems(children);
   }, [normalizeItems, children]);
 
-  const itemById = useCallback(
-    (id: string) => sourceMap[id],
-    [sourceWithIds, sourceMap],
-  );
+  const itemById = useCallback((id: string) => sourceMap[id], [sourceMap]);
 
   return [sourceWithIds, itemById];
 };
diff --git a/packages/lab/src/tabs/useKeyboardNavigation.ts b/packages/lab/src/tabs/useKeyboardNavigation.ts
index ee6edb8658..08a2e49914 100644
--- a/packages/lab/src/tabs/useKeyboardNavigation.ts
+++ b/packages/lab/src/tabs/useKeyboardNavigation.ts
@@ -122,12 +122,10 @@ export const useKeyboardNavigation = ({
     name: "UseKeyboardNavigation",
   });
 
-  const setHighlightedIdx = useCallback(
-    (value: number) => {
-      _setHighlightedIdx((focusedRef.current = value));
-    },
-    [_setHighlightedIdx],
-  );
+  const setHighlightedIdx = useCallback((value: number) => {
+    focusedRef.current = value;
+    _setHighlightedIdx(value);
+  }, []);
 
   const keyboardNavigation = useRef(false);
 
@@ -263,19 +261,16 @@ export const useKeyboardNavigation = ({
     setHighlightedIdx(tabIndex);
   };
 
-  const handleFocus = useCallback(
-    (evt: FocusEvent) => {
-      if (!hasFocus) {
-        setHasFocus(true);
-        if (!mouseClickPending.current) {
-          keyboardNavigation.current = true;
-        } else {
-          mouseClickPending.current = false;
-        }
+  const handleFocus = () => {
+    if (!hasFocus) {
+      setHasFocus(true);
+      if (!mouseClickPending.current) {
+        keyboardNavigation.current = true;
+      } else {
+        mouseClickPending.current = false;
       }
-    },
-    [hasFocus],
-  );
+    }
+  };
 
   const handleContainerMouseDown = useCallback(
     (evt: MouseEvent) => {
diff --git a/packages/lab/src/tabs/useSelection.ts b/packages/lab/src/tabs/useSelection.ts
index 925bd27bd1..8b8f4098d7 100644
--- a/packages/lab/src/tabs/useSelection.ts
+++ b/packages/lab/src/tabs/useSelection.ts
@@ -41,7 +41,7 @@ export const useSelection = ({
       setSelected(tabIndex);
       onSelectionChange?.(tabIndex);
     },
-    [onSelectionChange, setSelected],
+    [onSelectionChange],
   );
 
   const handleKeyDown = useCallback(
diff --git a/packages/lab/src/tabs/useTabs.ts b/packages/lab/src/tabs/useTabs.ts
index 3d7fe27643..6d4685154f 100644
--- a/packages/lab/src/tabs/useTabs.ts
+++ b/packages/lab/src/tabs/useTabs.ts
@@ -41,7 +41,7 @@ export const useTabs = ({
       setActiveTabIndex(tabIndex);
       onActiveChange?.(tabIndex);
     },
-    [onActiveChange, setActiveTabIndex],
+    [onActiveChange],
   );
 
   return {
diff --git a/packages/lab/src/tabs/useTabstrip.ts b/packages/lab/src/tabs/useTabstrip.ts
index 8b6dfe2cd8..e0cc4a4d85 100644
--- a/packages/lab/src/tabs/useTabstrip.ts
+++ b/packages/lab/src/tabs/useTabstrip.ts
@@ -213,8 +213,9 @@ export const useTabstrip = ({
   const addTab = useCallback(
     // The -1 is to account for the AddTab button - we shouldn't assume this
     (indexPosition: number = collectionHook.data.length - 1) => {
-      const tabId =
-        (pendingNewTab.current = `${idRoot}-${collectionHook.data.length}`);
+      const tabId = `${idRoot}-${collectionHook.data.length}`;
+      pendingNewTab.current = tabId;
+
       const overflowIndicator = collectionHook.data.find(
         (i) => i.isOverflowIndicator,
       );
diff --git a/packages/lab/src/tokenized-input-next/internal/useWidth.ts b/packages/lab/src/tokenized-input-next/internal/useWidth.ts
index 0a099c7df0..9263ea00a9 100644
--- a/packages/lab/src/tokenized-input-next/internal/useWidth.ts
+++ b/packages/lab/src/tokenized-input-next/internal/useWidth.ts
@@ -22,7 +22,7 @@ export const getWidth = (node: HTMLElement | null) => {
   const margin =
     safeParseFloat(style.marginLeft) + safeParseFloat(style.marginRight);
 
-  let dimension;
+  let dimension: DOMRect;
 
   if (style.display === "none") {
     const nodeDisplay = node.style.display;
@@ -42,12 +42,13 @@ export const getWidth = (node: HTMLElement | null) => {
  */
 export const useWidth = (
   density: Density,
+  // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
 ): [(newNode: any) => void, number] => {
   const [node, setNode] = useState<HTMLElement | null>(null);
   const [width, setWidth] = useState<number>(0);
 
   useIsomorphicLayoutEffect(() => {
-    if (node !== null) {
+    if (node !== null && density) {
       setWidth(getWidth(node));
     }
   }, [node, density]);
diff --git a/packages/lab/src/tokenized-input-next/useTokenizedInputNext.tsx b/packages/lab/src/tokenized-input-next/useTokenizedInputNext.tsx
index 45760d0ff6..6f42251a02 100644
--- a/packages/lab/src/tokenized-input-next/useTokenizedInputNext.tsx
+++ b/packages/lab/src/tokenized-input-next/useTokenizedInputNext.tsx
@@ -276,7 +276,7 @@ export function useTokenizedInputNext<Item>(
         );
       }
     },
-    [isSelectionControlled, setSelectedItems, onChange, selectedItems],
+    [isSelectionControlled, onChange, selectedItems],
   );
 
   const updateExpanded = (event: SyntheticEvent, newExpanded: boolean) => {
@@ -413,15 +413,12 @@ export function useTokenizedInputNext<Item>(
     }
   };
 
-  const handleRemoveItem = useCallback(
-    (event: SyntheticEvent, itemIndex?: number) => {
-      focusInput();
-      if (itemIndex !== undefined && !readOnly && !readOnlyProp) {
-        removeItems(event, [itemIndex]);
-      }
-    },
-    [focusInput, removeItems],
-  );
+  const handleRemoveItem = (event: SyntheticEvent, itemIndex?: number) => {
+    focusInput();
+    if (itemIndex !== undefined && !readOnly && !readOnlyProp) {
+      removeItems(event, [itemIndex]);
+    }
+  };
 
   const handleClear = (event: ChangeEvent<HTMLTextAreaElement>) => {
     updateSelectedItems(event, []);
@@ -604,7 +601,7 @@ export function useTokenizedInputNext<Item>(
     if (isCtrlModifier(event)) {
       handleCtrlModifierKeyDown(event);
     } else {
-      let handler;
+      let handler: KeyboardEventHandler<HTMLTextAreaElement> | undefined;
       if (highlightedIndex == null) {
         handler = inputKeyDownHandlers[event.key];
         setActiveIndices([]);
diff --git a/packages/lab/src/tokenized-input/internal/isPlainObject.ts b/packages/lab/src/tokenized-input/internal/isPlainObject.ts
index 70fb32ea23..1e092eead6 100644
--- a/packages/lab/src/tokenized-input/internal/isPlainObject.ts
+++ b/packages/lab/src/tokenized-input/internal/isPlainObject.ts
@@ -1,4 +1,6 @@
+// biome-ignore lint/suspicious/noExplicitAny: this is a valid use case for `any`
 export type PlainObject = { [name: string]: any };
 
+// biome-ignore lint/suspicious/noExplicitAny: this is a valid use case for `any`
 export const isPlainObject = (obj: any): obj is PlainObject =>
   Object.prototype.toString.call(obj) === "[object Object]";
diff --git a/packages/lab/src/tokenized-input/internal/useWidth.ts b/packages/lab/src/tokenized-input/internal/useWidth.ts
index 364412a667..10520e9b2d 100644
--- a/packages/lab/src/tokenized-input/internal/useWidth.ts
+++ b/packages/lab/src/tokenized-input/internal/useWidth.ts
@@ -12,7 +12,7 @@ export const getWidth = (node: HTMLElement | null) => {
   const margin =
     safeParseFloat(style.marginLeft) + safeParseFloat(style.marginRight);
 
-  let dimension;
+  let dimension: DOMRect;
 
   if (style.display === "none") {
     const nodeDisplay = node.style.display;
@@ -32,12 +32,13 @@ export const getWidth = (node: HTMLElement | null) => {
  */
 export const useWidth = (
   density: Density,
+  // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
 ): [(newNode: any) => void, number] => {
   const [node, setNode] = useState<HTMLElement | null>(null);
   const [width, setWidth] = useState<number>(0);
 
   useIsomorphicLayoutEffect(() => {
-    if (node !== null) {
+    if (node !== null && density) {
       setWidth(getWidth(node));
     }
   }, [node, density]);
diff --git a/packages/lab/src/tokenized-input/useTokenizedInput.tsx b/packages/lab/src/tokenized-input/useTokenizedInput.tsx
index 94117dad9e..930a9e42f9 100644
--- a/packages/lab/src/tokenized-input/useTokenizedInput.tsx
+++ b/packages/lab/src/tokenized-input/useTokenizedInput.tsx
@@ -249,7 +249,7 @@ export function useTokenizedInput<Item>(
         onChange(typeof action === "function" ? action(selectedItems) : action);
       }
     },
-    [isSelectionControlled, setSelectedItems, onChange, selectedItems],
+    [isSelectionControlled, onChange, selectedItems],
   );
 
   const updateExpanded = (newExpanded: boolean) => {
diff --git a/packages/lab/src/toolbar/Toolbar.tsx b/packages/lab/src/toolbar/Toolbar.tsx
index d8f3ea951f..9c14bdcffe 100644
--- a/packages/lab/src/toolbar/Toolbar.tsx
+++ b/packages/lab/src/toolbar/Toolbar.tsx
@@ -92,7 +92,7 @@ export const Toolbar = forwardRef<HTMLDivElement, ToolbarProps>(
             ),
           );
           if (i < arr.length - 1) {
-            items.push(<OverflowSeparator key={`separator-${i}`} />);
+            items.push(<OverflowSeparator key={`separator-${id}`} />);
           }
         } else {
           items.push(
diff --git a/packages/lab/src/tree/Tree.tsx b/packages/lab/src/tree/Tree.tsx
index 1eb317621c..763312c8c5 100644
--- a/packages/lab/src/tree/Tree.tsx
+++ b/packages/lab/src/tree/Tree.tsx
@@ -216,7 +216,9 @@ export const Tree = forwardRef(function Tree<
     onMouseEnter: (evt: MouseEvent) => {
       // if (!isScrolling.current) {
       const idx = closestListItemIndex(evt.target as HTMLElement);
-      highlightItemAtIndex(idx!);
+      if (idx) {
+        highlightItemAtIndex(idx);
+      }
       // onMouseEnterListItem && onMouseEnterListItem(evt, idx);
       // }
     },
@@ -298,7 +300,7 @@ export const Tree = forwardRef(function Tree<
       >
         {item.expanded ? (
           <ul className={withBaseName("child-nodes")} role="group">
-            {renderItems(items, idx, item.level! + 1)}
+            {renderItems(items, idx, (item.level ?? 0) + 1)}
           </ul>
         ) : null}
       </TreeNode>,
@@ -313,11 +315,11 @@ export const Tree = forwardRef(function Tree<
     const listItems: ReactElement[] = [];
     while (idx.value < items.length) {
       const item = items[idx.value];
-      if (item.level! < level) {
+      if (item.level !== undefined && item.level < level) {
         break;
       }
-      if (item.childNodes) {
-        addGroupNode(listItems, items, idx, item.id!, item.label!);
+      if (item.childNodes && item.id && item.label) {
+        addGroupNode(listItems, items, idx, item.id, item.label);
       } else {
         addLeafNode(listItems, item, idx);
       }
diff --git a/packages/lab/src/tree/use-tree-keyboard-navigation.ts b/packages/lab/src/tree/use-tree-keyboard-navigation.ts
index 76fa208b04..b8732cc12c 100644
--- a/packages/lab/src/tree/use-tree-keyboard-navigation.ts
+++ b/packages/lab/src/tree/use-tree-keyboard-navigation.ts
@@ -3,21 +3,23 @@ import type { CollectionHookResult, CollectionItem } from "../common-hooks";
 import { ArrowLeft } from "../common-hooks/keyUtils";
 
 export const getNodeParentPath = ({ id }: CollectionItem<any>) => {
-  let pos = id!.lastIndexOf("-");
+  let pos = id.lastIndexOf("-");
   if (pos !== -1) {
     // using the built-in hierarchical id scheme
     // rootId-n-n.n
-    const path = id!.slice(pos + 1);
+    const path = id.slice(pos + 1);
     const steps = path.split(".");
     if (steps.length === 1) {
       return null;
     }
     steps.pop();
-    return `${id!.slice(0, pos)}-${steps.join(".")}`;
+    return `${id.slice(0, pos)}-${steps.join(".")}`;
   }
-  if ((pos = id!.lastIndexOf("/")) !== -1) {
+
+  pos = id.lastIndexOf("/");
+  if (pos !== -1) {
     // using a path scheme step/step/step
-    return id!.slice(0, pos);
+    return id.slice(0, pos);
   }
 };
 
diff --git a/packages/lab/src/tree/useTree.ts b/packages/lab/src/tree/useTree.ts
index a719c85f6e..efdf873f91 100644
--- a/packages/lab/src/tree/useTree.ts
+++ b/packages/lab/src/tree/useTree.ts
@@ -23,7 +23,6 @@ export const useTree = <Item, Selection extends SelectionStrategy = "default">({
   contentRef = containerRef,
   defaultSelected,
   disabled,
-  groupSelection,
   onSelect,
   onSelectionChange,
   onToggle,
@@ -95,7 +94,6 @@ TreeHookProps<Item, Selection>): TreeHookResult<Item, Selection> => {
       }
     },
     [
-      collapsibleHook.onClick,
       collapsibleHook.onKeyDown,
       keyboardHook.listProps,
       selectionHook.listHandlers,
@@ -105,7 +103,7 @@ TreeHookProps<Item, Selection>): TreeHookResult<Item, Selection> => {
 
   // This is only appropriate whan we are directly controlling a List,
   // not when a control is manipulating the list
-  const { isScrolling, scrollIntoView } = useViewportTracking({
+  const { isScrolling } = useViewportTracking({
     containerRef,
     contentRef,
     highlightedIdx,
diff --git a/packages/lab/src/utils/useLayoutEffectOnce.ts b/packages/lab/src/utils/useLayoutEffectOnce.ts
index 2a78fe526a..5c90256f94 100644
--- a/packages/lab/src/utils/useLayoutEffectOnce.ts
+++ b/packages/lab/src/utils/useLayoutEffectOnce.ts
@@ -6,11 +6,11 @@ export const useLayoutEffectOnce = (
   dependencies: DependencyList,
 ): void => {
   const hasRun = useRef(false);
+  // biome-ignore lint/correctness/useExhaustiveDependencies: dependencies are forwarded to the hook
   useIsomorphicLayoutEffect(() => {
     if (condition && !hasRun.current) {
       hasRun.current = true;
       callback();
     }
-    /* eslint-disable-next-line react-hooks/exhaustive-deps */
   }, dependencies);
 };
diff --git a/packages/lab/src/utils/useLayoutEffectSkipFirst.ts b/packages/lab/src/utils/useLayoutEffectSkipFirst.ts
index 7c4de3a829..19d0422d7c 100644
--- a/packages/lab/src/utils/useLayoutEffectSkipFirst.ts
+++ b/packages/lab/src/utils/useLayoutEffectSkipFirst.ts
@@ -6,12 +6,12 @@ export const useLayoutEffectSkipFirst = (
   dependencies: DependencyList,
 ): void => {
   const goodToGo = useRef(false);
+  // biome-ignore lint/correctness/useExhaustiveDependencies: dependencies are forwarded to the hook
   useIsomorphicLayoutEffect(() => {
     if (goodToGo.current) {
       callback();
     } else {
       goodToGo.current = true;
     }
-    /* eslint-disable-next-line react-hooks/exhaustive-deps */
   }, dependencies);
 };
diff --git a/packages/lab/src/utils/useOverflowDetection.ts b/packages/lab/src/utils/useOverflowDetection.ts
index 96b923a76b..7e51d71c2d 100644
--- a/packages/lab/src/utils/useOverflowDetection.ts
+++ b/packages/lab/src/utils/useOverflowDetection.ts
@@ -29,7 +29,7 @@ export function useOverflowDetection<Element extends HTMLElement>(
 
       setOverflowed(current.offsetWidth < current.scrollWidth);
     }),
-    [targetRef, isOverflowed],
+    [isOverflowed],
   );
 
   // check on resizing
@@ -42,7 +42,7 @@ export function useOverflowDetection<Element extends HTMLElement>(
       handleResize.clear();
       win.removeEventListener("resize", handleResize);
     };
-  }, [targetRef, handleResize]);
+  }, [handleResize]);
 
   // We don't put handleResize in the dependency array as it's been handled by the `useLayoutEffect` above
   useIsomorphicLayoutEffect(handleResize, dependencies);
diff --git a/packages/lab/src/window/ElectronWindow.tsx b/packages/lab/src/window/ElectronWindow.tsx
index 5b9629c054..69f16c32a0 100644
--- a/packages/lab/src/window/ElectronWindow.tsx
+++ b/packages/lab/src/window/ElectronWindow.tsx
@@ -26,7 +26,6 @@ const Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(
   });
 
   const [mountNode, setMountNode] = useState<Element | null>(null);
-  const [windowRef, setWindowRef] = useState<Window | null>(null);
   const windowRoot = useRef<HTMLDivElement>(null);
 
   const forkedRef = useForkRef(forwardedRef, windowRoot);
@@ -41,12 +40,12 @@ const Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(
     });
     const bodyElement = (win as Window).document.body;
     setMountNode(bodyElement);
-    setWindowRef(win);
   }
 
   const parentWindow = useWindowParentContext();
 
   const closeWindow = useCallback(() => {
+    // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
     const { ipcRenderer } = global as any;
     if (ipcRenderer) {
       ipcRenderer.send("window-close", { id: id });
@@ -59,6 +58,7 @@ const Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(
     setTimeout(() => {
       if (windowRoot.current) {
         const { scrollHeight: height, scrollWidth: width } = windowRoot.current;
+        // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
         const { ipcRenderer } = global as any;
         if (ipcRenderer) {
           ipcRenderer.send("window-size", {
@@ -74,6 +74,7 @@ const Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(
   // The timeout is required to allow the window time to be moved into position and scaled
   // before being shown to the user,
   useEffect(() => {
+    // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
     const { ipcRenderer } = global as any;
     if (ipcRenderer) {
       setTimeout(() => {
@@ -84,12 +85,13 @@ const Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(
     return () => {
       closeWindow();
     };
-  }, [closeWindow, windowRef, id]);
+  }, [closeWindow, id]);
 
   // The timeout is required to give the Dialog component time to report the correct height
   // otherwise the window will be smaller than expected
   useIsomorphicLayoutEffect(() => {
     setTimeout(() => {
+      // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
       const { ipcRenderer } = global as any;
       if (ipcRenderer) {
         ipcRenderer.send("window-position", {
@@ -100,7 +102,7 @@ const Window = forwardRef<HTMLDivElement, WindowProps>(function ElectronWindow(
         });
       }
     }, 90);
-  }, [style]);
+  }, [style, id, parentWindow.id]);
 
   return mountNode
     ? ReactDOM.createPortal(
diff --git a/packages/lab/stories/app-header/app-header.stories.tsx b/packages/lab/stories/app-header/app-header.stories.tsx
index 2fb8dc245a..84c78df0cd 100644
--- a/packages/lab/stories/app-header/app-header.stories.tsx
+++ b/packages/lab/stories/app-header/app-header.stories.tsx
@@ -72,8 +72,8 @@ export const Default: StoryFn<typeof AppHeader> = () => {
           data-priority={2}
           onActiveChange={handleTabSelection}
         >
-          {tabs.map((label, i) => (
-            <Tab label={label} key={i} />
+          {tabs.map((label) => (
+            <Tab label={label} key={label} />
           ))}
         </Tabstrip>
         <Tooltray
@@ -105,7 +105,7 @@ export const Default: StoryFn<typeof AppHeader> = () => {
       {tabs.map((label, idx) => (
         <div
           aria-hidden={selectedTab !== idx}
-          key={idx}
+          key={label}
           style={{ borderBottom: `solid 10px ${colours[idx]}` }}
         />
       ))}
diff --git a/packages/lab/stories/breadcrumbs/breadcrumbs.stories.tsx b/packages/lab/stories/breadcrumbs/breadcrumbs.stories.tsx
index 6b56777744..66d88bd620 100644
--- a/packages/lab/stories/breadcrumbs/breadcrumbs.stories.tsx
+++ b/packages/lab/stories/breadcrumbs/breadcrumbs.stories.tsx
@@ -7,11 +7,7 @@ export default {
   component: "Bread",
 };
 
-type BasicBreadcrumbsStoryProps = {};
-
-const BasicBreadcrumbsTemplate: StoryFn<BasicBreadcrumbsStoryProps> = (
-  props,
-) => {
+const BasicBreadcrumbsTemplate: StoryFn = () => {
   return (
     <Breadcrumbs>
       <Breadcrumb href="#">Root Level Entity</Breadcrumb>
@@ -23,11 +19,7 @@ const BasicBreadcrumbsTemplate: StoryFn<BasicBreadcrumbsStoryProps> = (
 
 export const Basic = BasicBreadcrumbsTemplate.bind({});
 
-type BreadcrumbsWrappingStoryProps = {};
-
-const BreadcrumbsWrappingTemplate: StoryFn<BreadcrumbsWrappingStoryProps> = (
-  props,
-) => {
+const BreadcrumbsWrappingTemplate: StoryFn = () => {
   return (
     <Breadcrumbs data-testid="breadcrumbs-example" style={{ width: 250 }} wrap>
       <Breadcrumb href="#">Root Level Entity</Breadcrumb>
@@ -39,9 +31,7 @@ const BreadcrumbsWrappingTemplate: StoryFn<BreadcrumbsWrappingStoryProps> = (
 
 export const WithWrap = BreadcrumbsWrappingTemplate.bind({});
 
-type IconDescriptorsStoryProps = {};
-
-const IconDescriptorsStory: StoryFn<IconDescriptorsStoryProps> = (props) => (
+const IconDescriptorsStory: StoryFn = () => (
   <Breadcrumbs data-testid="breadcrumbs-example">
     <Breadcrumb href="#" overflowLabel="Home" Icon={HomeIcon} />
     <Breadcrumb href="#" overflowLabel="Level 2 Entity" Icon={TreeIcon}>
@@ -55,11 +45,7 @@ const IconDescriptorsStory: StoryFn<IconDescriptorsStoryProps> = (props) => (
 
 export const IconDescriptors = IconDescriptorsStory.bind({});
 
-type MaximumItemWidthAndTruncationStoryProps = {};
-
-const MaximumItemWidthAndTruncationStory: StoryFn<
-  MaximumItemWidthAndTruncationStoryProps
-> = (props) => {
+const MaximumItemWidthAndTruncationStory: StoryFn = () => {
   return (
     <Breadcrumbs data-testid="breadcrumbs-example" itemsMaxWidth={60}>
       <Breadcrumb href="#">Root Level Entity</Breadcrumb>
@@ -72,11 +58,7 @@ const MaximumItemWidthAndTruncationStory: StoryFn<
 export const MaximumItemWidthAndTruncation =
   MaximumItemWidthAndTruncationStory.bind({});
 
-type WithoutCurrentLevelStoryProps = {};
-
-const WithoutCurrentLevelStory: StoryFn<WithoutCurrentLevelStoryProps> = (
-  props,
-) => {
+const WithoutCurrentLevelStory: StoryFn = () => {
   return (
     <Breadcrumbs data-testid="breadcrumbs-example" hideCurrentLevel>
       <Breadcrumb href="#">Root Level Entity</Breadcrumb>
@@ -88,9 +70,7 @@ const WithoutCurrentLevelStory: StoryFn<WithoutCurrentLevelStoryProps> = (
 
 export const WithoutCurrentLevel = WithoutCurrentLevelStory.bind({});
 
-type WithOverflowMenuStoryProps = {};
-
-const WithOverflowMenuStory: StoryFn<WithOverflowMenuStoryProps> = (props) => {
+const WithOverflowMenuStory: StoryFn = () => {
   return (
     <Breadcrumbs data-testid="breadcrumbs-example" maxItems={2}>
       <Breadcrumb
@@ -131,11 +111,7 @@ const WithOverflowMenuStory: StoryFn<WithOverflowMenuStoryProps> = (props) => {
 
 export const WithOverflowMenu = WithOverflowMenuStory.bind({});
 
-type OverflowAtFirstPositionStoryProps = {};
-
-const OverflowAtFirstPositionStory: StoryFn<
-  OverflowAtFirstPositionStoryProps
-> = (props) => {
+const OverflowAtFirstPositionStory: StoryFn = () => {
   return (
     <Breadcrumbs
       data-testid="breadcrumbs-example"
diff --git a/packages/lab/stories/color-chooser/color-chooser.stories.tsx b/packages/lab/stories/color-chooser/color-chooser.stories.tsx
index ee1f2067e1..67f99f2e4d 100644
--- a/packages/lab/stories/color-chooser/color-chooser.stories.tsx
+++ b/packages/lab/stories/color-chooser/color-chooser.stories.tsx
@@ -20,12 +20,9 @@ export default {
 export const Default: StoryFn<typeof ColorChooser> = () => {
   const defaultColor = Color.makeColorFromHex("#D65513");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(defaultColor);
   };
@@ -45,12 +42,9 @@ export const Default: StoryFn<typeof ColorChooser> = () => {
 export const WithAlphaDisabled: StoryFn<typeof ColorChooser> = () => {
   const defaultColor = Color.makeColorFromHex("#D1F4C9");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(defaultColor);
   };
@@ -71,12 +65,9 @@ export const WithAlphaDisabled: StoryFn<typeof ColorChooser> = () => {
 export const WithDefaultAlpha: StoryFn<typeof ColorChooser> = () => {
   const defaultColor = Color.makeColorFromHex("#8224B1");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(undefined);
   };
@@ -97,12 +88,9 @@ export const WithDefaultAlpha: StoryFn<typeof ColorChooser> = () => {
 
 export const WithNullDefaultColor: StoryFn<typeof ColorChooser> = () => {
   const [selectedColor, setSelectedColor] = useState<Color | undefined>();
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(undefined);
   };
@@ -116,12 +104,9 @@ export const WithNullDefaultColor: StoryFn<typeof ColorChooser> = () => {
 export const WithCustomColors: StoryFn<typeof ColorChooser> = () => {
   const defaultColor = Color.makeColorFromHex("#C9AAF0");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(undefined);
   };
@@ -142,12 +127,9 @@ export const WithCustomColors: StoryFn<typeof ColorChooser> = () => {
 export const ReadOnly: StoryFn<typeof ColorChooser> = () => {
   const defaultColor = Color.makeColorFromHex("#C9AAF0");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(undefined);
   };
@@ -170,12 +152,9 @@ export const ColorPickerAsDefaultTabIfSelectedColorIsNotInTheSwatchesLibrary: St
 > = () => {
   const defaultColor = Color.makeColorFromHex("#8644B1");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(defaultColor);
   };
@@ -193,12 +172,9 @@ export const ColorPickerAsDefaultTabIfSelectedColorIsNotInTheSwatchesLibrary: St
 export const JustSwatches: StoryFn<typeof ColorChooser> = () => {
   const defaultColor = Color.makeColorFromHex("#D65513");
   const [selectedColor, setSelectedColor] = useState(defaultColor);
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(defaultColor);
   };
@@ -220,12 +196,9 @@ export const JustColorPicker: StoryFn<typeof ColorChooser> = () => {
   const [selectedColor, setSelectedColor] = useState<Color | undefined>(
     defaultColor,
   );
-  const onSelect = useCallback(
-    (color?: Color) => {
-      setSelectedColor(color);
-    },
-    [setSelectedColor],
-  );
+  const onSelect = useCallback((color?: Color) => {
+    setSelectedColor(color);
+  }, []);
   const onClear = () => {
     setSelectedColor(defaultColor);
   };
diff --git a/packages/lab/stories/components/AdjustableFlexbox.tsx b/packages/lab/stories/components/AdjustableFlexbox.tsx
index 1a3947422b..f90f753c0f 100644
--- a/packages/lab/stories/components/AdjustableFlexbox.tsx
+++ b/packages/lab/stories/components/AdjustableFlexbox.tsx
@@ -44,11 +44,13 @@ export const AdjustableFlexbox = ({
   const handleKeyDown: InputProps["onKeyDown"] = (e) => {
     if (e.key === "ArrowUp") {
       const amt = e.shiftKey ? 10 : 1;
-      setWidth((widthRef.current = widthRef.current + amt));
+      widthRef.current = widthRef.current + amt;
+      setWidth(widthRef.current);
       e.preventDefault();
     } else if (e.key === "ArrowDown") {
       const amt = e.shiftKey ? 10 : 1;
-      setWidth((widthRef.current = widthRef.current - amt));
+      widthRef.current = widthRef.current - amt;
+      setWidth(widthRef.current);
       e.preventDefault();
     }
   };
diff --git a/packages/lab/stories/components/QueryResultTable.tsx b/packages/lab/stories/components/QueryResultTable.tsx
index 4039f4aef5..bc9097afcb 100644
--- a/packages/lab/stories/components/QueryResultTable.tsx
+++ b/packages/lab/stories/components/QueryResultTable.tsx
@@ -36,9 +36,9 @@ export const QueryResultTable = (props: QueryResultTableProps) => {
           </tr>
         </thead>
         <tbody>
-          {rows.map((row, i) => {
+          {rows.map((row) => {
             return (
-              <tr key={i}>
+              <tr key={row.name}>
                 <td className={withBaseName("name")}>{row.name}</td>
                 <td className={withBaseName("role")}>{row.role}</td>
                 <td className={withBaseName("location")}>{row.location}</td>
diff --git a/packages/lab/stories/contact-details/contact-details.qa.stories.tsx b/packages/lab/stories/contact-details/contact-details.qa.stories.tsx
index 8227b06624..d71da89b86 100644
--- a/packages/lab/stories/contact-details/contact-details.qa.stories.tsx
+++ b/packages/lab/stories/contact-details/contact-details.qa.stories.tsx
@@ -91,13 +91,12 @@ const getComponent = (props: { variant?: string; className?: string }) => {
         <ContactTertiaryInfo text={tertiary} />
 
         <ContactMetadata>
-          {metadata.map((item: any) => {
+          {metadata.map((item) => {
             return (
               <ContactMetadataItem
                 key={Math.random()}
                 value={item.value}
                 label={item.label}
-                icon={item.icon}
               />
             );
           })}
@@ -105,7 +104,7 @@ const getComponent = (props: { variant?: string; className?: string }) => {
 
         {!!actions && (
           <ContactActions>
-            {actions.map((item: any) => {
+            {actions.map((item) => {
               return (
                 <ContactAction
                   key={Math.random()}
diff --git a/packages/lab/stories/content-status/content-status.stories.tsx b/packages/lab/stories/content-status/content-status.stories.tsx
index dcfb0e8b91..c8547c1e36 100644
--- a/packages/lab/stories/content-status/content-status.stories.tsx
+++ b/packages/lab/stories/content-status/content-status.stories.tsx
@@ -101,8 +101,8 @@ const RealContent = (props: { messages: string[] }) => {
 
   return (
     <>
-      {messages.map((m, i) => (
-        <p key={i}>{m}</p>
+      {messages.map((m) => (
+        <p key={m}>{m}</p>
       ))}
     </>
   );
diff --git a/packages/lab/stories/deck-layout/deck-layout.stories.tsx b/packages/lab/stories/deck-layout/deck-layout.stories.tsx
index 4e1a5f1b64..72b45f4cc0 100644
--- a/packages/lab/stories/deck-layout/deck-layout.stories.tsx
+++ b/packages/lab/stories/deck-layout/deck-layout.stories.tsx
@@ -77,8 +77,8 @@ const WithTabStrip: StoryFn<typeof DeckLayout> = (args) => {
   return (
     <div>
       <Tabstrip onActiveChange={setActiveTabIndex}>
-        {tabs.map((label, i) => (
-          <Tab label={label} key={i} />
+        {tabs.map((label) => (
+          <Tab label={label} key={label} />
         ))}
       </Tabstrip>
       <DeckLayout
diff --git a/packages/lab/stories/list-next/list.stories.tsx b/packages/lab/stories/list-next/list.stories.tsx
index 7c53b70cdd..3cac6a3c77 100644
--- a/packages/lab/stories/list-next/list.stories.tsx
+++ b/packages/lab/stories/list-next/list.stories.tsx
@@ -25,7 +25,7 @@ const getListItems = ({ disabledItems = [] }: { disabledItems?: number[] }) =>
   usStateExampleData.map((item, index) => {
     return (
       <ListItemNext
-        key={index}
+        key={item}
         disabled={disabledItems.includes(index)}
         id={`controlled-list-item-${index}`}
         value={item}
@@ -190,7 +190,7 @@ export const Controlled: StoryFn<ListNextProps> = ({ onChange, ...rest }) => {
         {usStateExampleData.map((item, index) => {
           return (
             <ListItemNext
-              key={index}
+              key={item}
               onClick={() => handleClick(index)}
               onMouseMove={() => setHighlightedIndex(index)}
               value={item}
diff --git a/packages/lab/stories/list/list.data.js b/packages/lab/stories/list/list.data.js
index 40f17b493c..bc7303cb05 100644
--- a/packages/lab/stories/list/list.data.js
+++ b/packages/lab/stories/list/list.data.js
@@ -184,9 +184,10 @@ export const groupByInitialLetter = (list, groupMode = "headers-only") => {
       if (groupMode === "headers-only") {
         items.push({ label: label[0], header });
       } else {
+        items = [];
         result.push({
           label: label[0],
-          childNodes: (items = []),
+          childNodes: items,
         });
       }
       char = label[0];
diff --git a/packages/lab/stories/menu-button/menu-button.stories.tsx b/packages/lab/stories/menu-button/menu-button.stories.tsx
index 028e0e9c89..c579e0d7c3 100644
--- a/packages/lab/stories/menu-button/menu-button.stories.tsx
+++ b/packages/lab/stories/menu-button/menu-button.stories.tsx
@@ -24,9 +24,7 @@ const makeMenuItems = (levels: number, count: number): MenuDescriptor[] => {
 
 const initialSource = { menuItems: makeMenuItems(3, 3) };
 
-type PrimaryStoryProps = {};
-
-const PrimaryStory: StoryFn<PrimaryStoryProps> = (props) => {
+const PrimaryStory: StoryFn = () => {
   return (
     <MenuButton
       CascadingMenuProps={{ initialSource }}
@@ -40,9 +38,7 @@ const PrimaryStory: StoryFn<PrimaryStoryProps> = (props) => {
 
 export const Primary = PrimaryStory.bind({});
 
-type SecondaryStoryProps = {};
-
-const SecondaryStory: StoryFn<SecondaryStoryProps> = (props) => {
+const SecondaryStory: StoryFn = () => {
   return (
     <MenuButton
       CascadingMenuProps={{ initialSource }}
@@ -55,9 +51,7 @@ const SecondaryStory: StoryFn<SecondaryStoryProps> = (props) => {
 
 export const Secondary = SecondaryStory.bind({});
 
-type HideCaretStoryProps = {};
-
-const HideCaretStory: StoryFn<HideCaretStoryProps> = (props) => (
+const HideCaretStory: StoryFn = () => (
   <MenuButton
     CascadingMenuProps={{ initialSource }}
     data-testid="menu-button-example"
diff --git a/packages/lab/stories/stepped-tracker/stepped-tracker.stories.tsx b/packages/lab/stories/stepped-tracker/stepped-tracker.stories.tsx
index 28b2a1adf3..e47cb89529 100644
--- a/packages/lab/stories/stepped-tracker/stepped-tracker.stories.tsx
+++ b/packages/lab/stories/stepped-tracker/stepped-tracker.stories.tsx
@@ -198,8 +198,8 @@ export const AutoProgress: StoryFn<typeof SteppedTracker> = () => {
       style={{ width: "100%", minWidth: 600, maxWidth: 800, margin: "auto" }}
     >
       <SteppedTracker activeStep={activeStep}>
-        {steps.map(({ label, state }, key) => (
-          <TrackerStep state={state} key={key}>
+        {steps.map(({ label, state }) => (
+          <TrackerStep state={state} key={label}>
             <StepLabel>{label}</StepLabel>
           </TrackerStep>
         ))}
@@ -278,8 +278,8 @@ export const NonSequentialProgress: StoryFn<typeof SteppedTracker> = () => {
       style={{ width: "100%", minWidth: 600, maxWidth: 800, margin: "auto" }}
     >
       <SteppedTracker activeStep={activeStep}>
-        {steps.map(({ label, state }, key) => (
-          <TrackerStep state={state} key={key}>
+        {steps.map(({ label, state }) => (
+          <TrackerStep state={state} key={label}>
             <StepLabel>{label}</StepLabel>
           </TrackerStep>
         ))}
diff --git a/packages/lab/stories/tabstrip/tabstrip.stories.tsx b/packages/lab/stories/tabstrip/tabstrip.stories.tsx
index 040705c7bd..01953ceaaf 100644
--- a/packages/lab/stories/tabstrip/tabstrip.stories.tsx
+++ b/packages/lab/stories/tabstrip/tabstrip.stories.tsx
@@ -35,6 +35,7 @@ const getTabColours = (tabs: string[] | TabDescriptor[]): colourMap => {
   );
   return tabStrings.reduce(
     (map: colourMap, tab: string, i: number) => ({
+      // biome-ignore lint/performance/noAccumulatingSpread: reduce on object
       ...map,
       [tab]: _colours[i],
     }),
diff --git a/packages/lab/stories/tokenized-input-next/tokenized-input-next.stories.tsx b/packages/lab/stories/tokenized-input-next/tokenized-input-next.stories.tsx
index 44c1cc1049..c05678986f 100644
--- a/packages/lab/stories/tokenized-input-next/tokenized-input-next.stories.tsx
+++ b/packages/lab/stories/tokenized-input-next/tokenized-input-next.stories.tsx
@@ -67,7 +67,7 @@ export const Controlled: StoryFn<typeof TokenizedInputNext> = () => {
     if (buttonsRef.current) {
       setOffsetHeight(buttonsRef.current.getBoundingClientRect().height);
     }
-  }, [buttonsRef]);
+  }, []);
 
   const handleAddRandomOption = () => {
     setSelectedItems((prevSelectedItems) =>
diff --git a/packages/lab/stories/tokenized-input/tokenized-input.stories.tsx b/packages/lab/stories/tokenized-input/tokenized-input.stories.tsx
index 8d9f990ca8..81c5d0ee80 100644
--- a/packages/lab/stories/tokenized-input/tokenized-input.stories.tsx
+++ b/packages/lab/stories/tokenized-input/tokenized-input.stories.tsx
@@ -67,7 +67,7 @@ export const Controlled: StoryFn<typeof TokenizedInput> = () => {
     if (buttonsRef.current) {
       setOffsetHeight(buttonsRef.current.getBoundingClientRect().height);
     }
-  }, [buttonsRef]);
+  }, []);
 
   const handleAddRandomOption = () => {
     setSelectedItems((prevSelectedItems) =>
diff --git a/packages/styles/src/use-style-injection/useStyleInjection.ts b/packages/styles/src/use-style-injection/useStyleInjection.ts
index bd96e73652..72eabd3fc7 100644
--- a/packages/styles/src/use-style-injection/useStyleInjection.ts
+++ b/packages/styles/src/use-style-injection/useStyleInjection.ts
@@ -2,10 +2,10 @@ import * as React from "react";
 import { useStyleInjection } from "../style-injection-provider";
 import { useInsertionPoint } from "./InsertionPointProvider";
 
-/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any -- Workaround for https://github.com/webpack/webpack/issues/14814#issuecomment-1536757985 */
+/* Workaround for https://github.com/webpack/webpack/issues/14814#issuecomment-1536757985 */
 const maybeUseInsertionEffect: typeof React.useLayoutEffect =
+  // biome-ignore lint/suspicious/noExplicitAny: see comment above
   (React as any)["useInsertionEffect".toString()] ?? React.useLayoutEffect;
-/* eslint-enable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */
 
 export interface UseComponentCssInjection {
   testId?: string;
diff --git a/site/cssGen.js b/site/cssGen.js
index 9b1cd0049a..16167359dd 100644
--- a/site/cssGen.js
+++ b/site/cssGen.js
@@ -23,12 +23,13 @@ function getCssVariablesFromDir(dirPath) {
     ) {
       // Process CSS files
       const cssContent = fs.readFileSync(filePath, "utf8");
-      let match;
+      let match = cssVariableRegex.exec(cssContent);
 
-      while ((match = cssVariableRegex.exec(cssContent)) !== null) {
+      while (match !== null) {
         const variableName = match[1];
         const variableValue = match[2].trim();
         cssVariables[variableName] = variableValue;
+        match = cssVariableRegex.exec(cssContent);
       }
     }
   });
diff --git a/site/src/components/app-header/AppHeader.tsx b/site/src/components/app-header/AppHeader.tsx
index 862d54191a..a008c8f9c8 100644
--- a/site/src/components/app-header/AppHeader.tsx
+++ b/site/src/components/app-header/AppHeader.tsx
@@ -32,7 +32,7 @@ const createDrawerMenu = (menu: TabsMenu): SidebarItem[] =>
       data: { link: item.link },
     } as SidebarItem;
 
-    return [...result, parsedItem];
+    return result.concat(parsedItem);
   }, [] as SidebarItem[]);
 
 const actions: TabsMenu = [
diff --git a/site/src/components/app-header/Search.tsx b/site/src/components/app-header/Search.tsx
index 0e37f1c410..07bc22d904 100644
--- a/site/src/components/app-header/Search.tsx
+++ b/site/src/components/app-header/Search.tsx
@@ -33,6 +33,7 @@ function SearchResult({
         <Text>{result.title}</Text>
         {result.content && (
           <Text styleAs="label" color="secondary">
+            {/* biome-ignore lint/security/noDangerouslySetInnerHtml: result.content is HTML we want to show */}
             <span dangerouslySetInnerHTML={{ __html: result.content }} />
           </Text>
         )}
diff --git a/site/src/components/components/ExamplesListView.tsx b/site/src/components/components/ExamplesListView.tsx
index 97175ed567..105c2f0695 100644
--- a/site/src/components/components/ExamplesListView.tsx
+++ b/site/src/components/components/ExamplesListView.tsx
@@ -1,10 +1,4 @@
-import {
-  Dropdown,
-  FormField,
-  FormFieldLabel,
-  ListBox,
-  Option,
-} from "@salt-ds/core";
+import { Dropdown, ListBox, Option } from "@salt-ds/core";
 import {
   Children,
   type FC,
@@ -45,7 +39,7 @@ const ExamplesListView: FC<ExamplesListViewProps> = ({ examples }) => {
     const exampleInHash = examplesList.find(
       (example) => exampleNameToHash(example) === hash,
     );
-    setSelectedItem((old) => {
+    setSelectedItem(() => {
       if (exampleInHash) {
         return [exampleInHash];
       }
diff --git a/site/src/components/keyboard-controls/KeyboardControl.tsx b/site/src/components/keyboard-controls/KeyboardControl.tsx
index 1e557b031a..b9242e6120 100644
--- a/site/src/components/keyboard-controls/KeyboardControl.tsx
+++ b/site/src/components/keyboard-controls/KeyboardControl.tsx
@@ -20,7 +20,7 @@ export interface KeyboardControlProps {
   className?: string;
 }
 
-const keyOrComboSeparator = /\s*([\+\/]|or)\s*/i;
+const keyOrComboSeparator = /\s*([+\/]|or)\s*/i;
 
 function splitCombo(keyOrCombo: string): string[] {
   return keyOrCombo.split(keyOrComboSeparator);
@@ -32,9 +32,9 @@ const Keys: FC<{ keyOrCombos: string }> = ({ keyOrCombos }) => {
       {splitCombo(keyOrCombos).map((keyOrSeparator, index) => {
         // Odd indexes will be the "+" or "/" separators
         if (index % 2 === 1) {
-          return <Fragment key={index}> {keyOrSeparator} </Fragment>;
+          return <Fragment key={keyOrSeparator}> {keyOrSeparator} </Fragment>;
         }
-        return <kbd key={index}>{keyOrSeparator}</kbd>;
+        return <kbd key={keyOrSeparator}>{keyOrSeparator}</kbd>;
       })}
     </>
   );
diff --git a/site/src/components/roadmap/Roadmap.tsx b/site/src/components/roadmap/Roadmap.tsx
index a132785894..aa0af2746d 100644
--- a/site/src/components/roadmap/Roadmap.tsx
+++ b/site/src/components/roadmap/Roadmap.tsx
@@ -90,6 +90,7 @@ export const Roadmap = ({ endpoint }: RoadmapProps) => {
     };
   }, [endpoint]);
 
+  // biome-ignore lint/suspicious/noExplicitAny: any is simpler here.
   const mapRoadmapData = (responseItem: any): RoadmapData => {
     const data: RoadmapData = {
       id: responseItem.id,
diff --git a/site/src/examples/ag-grid-theme/Pagination.tsx b/site/src/examples/ag-grid-theme/Pagination.tsx
index c3011f2899..68eea19760 100644
--- a/site/src/examples/ag-grid-theme/Pagination.tsx
+++ b/site/src/examples/ag-grid-theme/Pagination.tsx
@@ -11,7 +11,7 @@ const generateData = (states: typeof defaultData) =>
       for (let i = 0; i < 20; i++) {
         data.push({ ...row, name: `${row.name} ${i}` });
       }
-      return [...result, ...data];
+      return result.concat(data);
     },
     [] as typeof defaultData,
   );
diff --git a/site/src/examples/list/exampleData.tsx b/site/src/examples/list/exampleData.tsx
index 2d4d66bb1e..81b7aa8b7a 100644
--- a/site/src/examples/list/exampleData.tsx
+++ b/site/src/examples/list/exampleData.tsx
@@ -8,7 +8,7 @@ export const getListItems = ({
   usStateExampleData.map((item, index) => {
     return (
       <ListItemNext
-        key={index}
+        key={item}
         disabled={disabledItems.includes(index)}
         id={`controlled-list-item-${index}`}
         value={item}
diff --git a/site/src/examples/stepped-tracker/NonSequentialProgress.tsx b/site/src/examples/stepped-tracker/NonSequentialProgress.tsx
index 50bf519e5e..8b17a03072 100644
--- a/site/src/examples/stepped-tracker/NonSequentialProgress.tsx
+++ b/site/src/examples/stepped-tracker/NonSequentialProgress.tsx
@@ -62,7 +62,7 @@ export const NonSequentialProgress = (): ReactElement => {
     >
       <SteppedTracker activeStep={activeStep}>
         {steps.map(({ label, state }, key) => (
-          <TrackerStep state={state} key={key}>
+          <TrackerStep state={state} key={label}>
             <StepLabel>{label}</StepLabel>
           </TrackerStep>
         ))}
diff --git a/site/src/examples/stepped-tracker/StepProgression.tsx b/site/src/examples/stepped-tracker/StepProgression.tsx
index 4bd532e975..10b101fb23 100644
--- a/site/src/examples/stepped-tracker/StepProgression.tsx
+++ b/site/src/examples/stepped-tracker/StepProgression.tsx
@@ -63,8 +63,8 @@ export const StepProgression = (): ReactElement => {
       style={{ width: "100%", minWidth: 600, maxWidth: 800, margin: "auto" }}
     >
       <SteppedTracker activeStep={activeStep}>
-        {steps.map(({ label, state }, key) => (
-          <TrackerStep state={state} key={key}>
+        {steps.map(({ label, state }) => (
+          <TrackerStep state={state} key={label}>
             <StepLabel>{label}</StepLabel>
           </TrackerStep>
         ))}
diff --git a/site/src/pages/[...route].tsx b/site/src/pages/[...route].tsx
index fff9cba6bb..3f183e0c6d 100755
--- a/site/src/pages/[...route].tsx
+++ b/site/src/pages/[...route].tsx
@@ -5,14 +5,14 @@ import {
   middlewarePresets,
 } from "@jpmorganchase/mosaic-site-middleware";
 import type { GetServerSidePropsContext, GetServerSidePropsResult } from "next";
-import React from "react";
+import type { ComponentPropsWithoutRef } from "react";
 
 import type { MyAppProps, MyMiddlewareProps } from "../types/mosaic";
 
 /**
  * Extend props passed to MyApp by adding your own middleware ('withMyExampleMiddleware') functions.
  *
- const middlewareRunner = createMiddlewareRunner<ExampleMiddlewareProps, ExampleMiddlewareOptions>({}, 
+ const middlewareRunner = createMiddlewareRunner<ExampleMiddlewareProps, ExampleMiddlewareOptions>({},
    [
      ...middlewarePresets,
      [withMyExampleMiddleware, { someProp: 20000 }]
@@ -32,11 +32,11 @@ export async function getServerSideProps(
 }
 
 /** MyApp will be passed MyAppProps which is created by combining the result of all props created by Middleware */
-const MyApp = (
-  props: JSX.IntrinsicAttributes & {
-    [x: string]: any;
-    components?: {} | undefined;
-    type: any;
-  },
-) => <Body {...props} />;
+const MyApp = ({
+  component,
+  type,
+  ...props
+}: ComponentPropsWithoutRef<typeof Body>) => (
+  <Body component={component} type={type} {...props} />
+);
 export default MyApp;
diff --git a/site/src/pages/index.tsx b/site/src/pages/index.tsx
index 83b0f6b470..ae2ff10b46 100644
--- a/site/src/pages/index.tsx
+++ b/site/src/pages/index.tsx
@@ -17,8 +17,8 @@ const HomepageHeader = () => {
       <header className={styles.heroBanner}>
         <div className={styles.content}>
           <h1 className={styles.heroTitle}>Welcome to Salt</h1>
-          {splitTagline.map((tagline, index) => (
-            <p key={index}>{tagline}</p>
+          {splitTagline.map((tagline) => (
+            <p key={tagline}>{tagline}</p>
           ))}
           <Link href="./getting-started" className={styles.heroLink}>
             Start using Salt
@@ -172,12 +172,12 @@ const Homepage = (): JSX.Element => {
       <HomepageHeader />
       <Features heading="What to expect" listItems={features} />
       <div className={styles.cardContainer}>
-        {cards.map((card, index) => {
+        {cards.map((card) => {
           const { icon, title, description, url, footerText, keylineColor } =
             card;
           return (
             <Card
-              key={index}
+              key={title}
               icon={icon}
               title={title}
               description={description}
diff --git a/site/src/utils/useOnScreen.ts b/site/src/utils/useOnScreen.ts
index 83185bff56..431b620dc4 100644
--- a/site/src/utils/useOnScreen.ts
+++ b/site/src/utils/useOnScreen.ts
@@ -20,7 +20,7 @@ const useOnScreen = <T extends Element>(
     return () => {
       observer.disconnect();
     };
-  }, []);
+  }, [rootMargin, ref]);
   return isIntersecting;
 };
 
diff --git a/tooling/css-variable-docgen-components/src/CharacteristicUsageRow.tsx b/tooling/css-variable-docgen-components/src/CharacteristicUsageRow.tsx
index 2d6beae085..8f5489eab3 100644
--- a/tooling/css-variable-docgen-components/src/CharacteristicUsageRow.tsx
+++ b/tooling/css-variable-docgen-components/src/CharacteristicUsageRow.tsx
@@ -79,7 +79,7 @@ export const CharacteristicUsageRow = (props: CharacteristicUsageRowProps) => {
       </td>
       <td>
         {tokens?.map((token, i) => (
-          <TokenInfo token={token} key={`${token}-${i}`} />
+          <TokenInfo token={token} key={token} />
         ))}
       </td>
     </tr>
diff --git a/tooling/css-variable-docgen-plugin/src/index.ts b/tooling/css-variable-docgen-plugin/src/index.ts
index 89dc5a6417..4264e2fee4 100644
--- a/tooling/css-variable-docgen-plugin/src/index.ts
+++ b/tooling/css-variable-docgen-plugin/src/index.ts
@@ -164,7 +164,6 @@ export function cssVariableDocgen(options: Options = {}): Plugin {
           if (
             ts.isImportDeclaration(node) &&
             // @ts-ignore
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
             node.moduleSpecifier.text.endsWith(".css?inline")
           ) {
             cssImports.push(