Bump the development-dependencies group across 1 directory with 18 updates (#559)

| Package | From | To |
| --- | --- | --- |
| [@eslint/css](https://github.com/eslint/css) | `0.14.1` | `1.1.0` |
| [@eslint/js](https://github.com/eslint/eslint/tree/HEAD/packages/js) | `9.39.4` | `10.0.1` |
| [@tailwindcss/vite](https://github.com/tailwindlabs/tailwindcss/tree/HEAD/packages/@tailwindcss-vite) | `4.2.2` | `4.2.4` |
| [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) | `25.5.0` | `25.6.0` |
| [eslint](https://github.com/eslint/eslint) | `9.39.4` | `10.2.1` |
| [eslint-plugin-perfectionist](https://github.com/azat-io/eslint-plugin-perfectionist) | `5.7.0` | `5.9.0` |
| [eslint-plugin-react-hooks](https://github.com/facebook/react/tree/HEAD/packages/eslint-plugin-react-hooks) | `7.0.1` | `7.1.1` |
| [eslint-plugin-storybook](https://github.com/storybookjs/storybook/tree/HEAD/code/lib/eslint-plugin) | `10.3.3` | `10.3.5` |
| [globals](https://github.com/sindresorhus/globals) | `17.4.0` | `17.5.0` |
| [jsdom](https://github.com/jsdom/jsdom) | `29.0.1` | `29.0.2` |
| [prettier](https://github.com/prettier/prettier) | `3.8.1` | `3.8.3` |
| [prettier-plugin-tailwindcss](https://github.com/tailwindlabs/prettier-plugin-tailwindcss) | `0.7.2` | `0.7.3` |
| [tailwind-csstree](https://github.com/humanwhocodes/tailwind-csstree) | `0.1.4` | `0.3.1` |
| [typescript](https://github.com/microsoft/TypeScript) | `5.9.3` | `6.0.3` |
| [typescript-eslint](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/typescript-eslint) | `8.57.2` | `8.59.0` |
| [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) | `7.3.2` | `8.0.10` |
| [vitest](https://github.com/vitest-dev/vitest/tree/HEAD/packages/vitest) | `4.1.1` | `4.1.5` |

* make tag input controlled

The React Hooks lint upgrade reports synchronous state updates from effects.
`TagInput` mirrored its `tags` prop into local state and then synchronized
that mirror from an effect whenever the parent changed the value.

Render from the `tags` prop directly and keep only the draft input text in
local state. Add, remove, and Backspace handling now compute the next tag
array from the controlled prop and notify the parent through `onChange`, so
external prop changes still update the rendered tags without a syncing
effect.

* remove deprecated baseUrl

TypeScript 6 reports `baseUrl` as deprecated and blocks compilation unless
the deprecation is explicitly ignored. The project only used `baseUrl` to
make the `@*` path alias point at source files.

Drop `baseUrl` and make the alias target explicit relative to the config
file. This preserves the existing import behavior while avoiding a temporary
compiler deprecation override.

* support Vite 8 manual chunks

Vite 8 now validates `manualChunks` for the Rolldown build path, and the
existing object form is rejected before production assets can be emitted.
The chunk split was still useful for keeping the larger UI dependencies out
of the main bundle.

Convert the chunk configuration to the function form accepted by the newer
bundler. The function matches normalized module IDs for the same dependency
families, preserving the previous chunk names without changing application
runtime behavior.

* fix upgraded Vitest warnings

The upgraded test toolchain surfaced warnings for deprecated path-resolution
plugin wiring, a nested module mock, and JSDOM's missing scroll API. The path
warning came from keeping `vite-tsconfig-paths` after Vite added native
`resolve.tsconfigPaths` support, so the plugin was both noisy and redundant.

Use Vite's native `resolve.tsconfigPaths` support in both Vite and Vitest
config, and remove the now-unused `vite-tsconfig-paths` dependency. Move the
job-search API mock to module scope so Vitest's hoisting behavior is explicit,
and provide a minimal `scrollTo` test shim for code paths that expect browser
scrolling APIs.

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Blake Gentry <blakesgentry@gmail.com>

Author: dependabot[bot]

package-lock.json

@@ -26,47 +26,46 @@
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^5.1.2",
-    "@eslint/css": "^0.14.1",
-    "@eslint/js": "^9.39.2",
+    "@eslint/css": "^1.1.0",
+    "@eslint/js": "^10.0.1",
     "@faker-js/faker": "^10.4.0",
     "@storybook/addon-docs": "^10.3.5",
     "@storybook/addon-links": "^10.3.5",
     "@storybook/addon-onboarding": "^10.3.5",
     "@storybook/addon-themes": "^10.3.5",
     "@storybook/react-vite": "^10.3.5",
     "@tailwindcss/forms": "^0.5.11",
-    "@tailwindcss/vite": "^4.2.2",
+    "@tailwindcss/vite": "^4.2.4",
     "@tanstack/eslint-plugin-query": "^5.100.1",
     "@tanstack/react-query-devtools": "^5.100.1",
     "@tanstack/react-router-devtools": "^1.166.13",
     "@tanstack/router-vite-plugin": "^1.166.38",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@types/eslint__js": "^9.14.0",
-    "@types/node": "^25.5.0",
+    "@types/node": "^25.6.0",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
     "@vitejs/plugin-react-swc": "^4.3.0",
     "concurrently": "^9.2.1",
-    "eslint": "^9.39.2",
+    "eslint": "^10.2.1",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-perfectionist": "^5.7.0",
-    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-perfectionist": "^5.9.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
     "eslint-plugin-react-refresh": "^0.5.2",
-    "eslint-plugin-storybook": "^10.3.3",
+    "eslint-plugin-storybook": "^10.3.5",
     "fishery": "^2.4.0",
-    "globals": "^17.4.0",
-    "jsdom": "^29.0.1",
-    "prettier": "^3.8.1",
-    "prettier-plugin-tailwindcss": "^0.7.2",
+    "globals": "^17.5.0",
+    "jsdom": "^29.0.2",
+    "prettier": "^3.8.3",
+    "prettier-plugin-tailwindcss": "^0.7.3",
     "storybook": "^10.3.5",
-    "tailwind-csstree": "0.1.4",
+    "tailwind-csstree": "0.3.1",
     "tailwindcss": "^4.1.8",
-    "typescript": "^5.9.3",
-    "typescript-eslint": "^8.57.2",
-    "vite": "^7.3.2",
-    "vite-tsconfig-paths": "^6.1.1",
-    "vitest": "^4.1.1"
+    "typescript": "^6.0.3",
+    "typescript-eslint": "^8.59.0",
+    "vite": "^8.0.10",
+    "vitest": "^4.1.5"
   },
   "overrides": {
     "storybook": "$storybook"

package.json

@@ -1,5 +1,5 @@
 import { XMarkIcon } from "@heroicons/react/20/solid";
-import { KeyboardEvent, useEffect, useState } from "react";
+import { KeyboardEvent, useState } from "react";
 
 import { Badge, type BadgeColor } from "./Badge";
 
@@ -28,42 +28,29 @@ const TagInput = ({
   tags = [],
 }: TagInputProps) => {
   const [inputValue, setInputValue] = useState("");
-  const [internalTags, setInternalTags] = useState<string[]>(tags);
-
-  // Update internal tags when external tags change
-  useEffect(() => {
-    setInternalTags(tags);
-  }, [tags]);
 
   const addTag = (tag: string) => {
     const trimmedTag = tag.trim();
-    if (trimmedTag && !internalTags.includes(trimmedTag)) {
-      const newTags = [...internalTags, trimmedTag];
-      setInternalTags(newTags);
+    if (trimmedTag && !tags.includes(trimmedTag)) {
+      const newTags = [...tags, trimmedTag];
       onChange(newTags);
     }
     setInputValue("");
   };
 
   const removeTag = (tagToRemove: string) => {
-    const newTags = internalTags.filter((tag) => tag !== tagToRemove);
-    setInternalTags(newTags);
+    const newTags = tags.filter((tag) => tag !== tagToRemove);
     onChange(newTags);
   };
 
   const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {
     if (e.key === "Enter" && inputValue) {
       e.preventDefault();
       addTag(inputValue);
-    } else if (
-      e.key === "Backspace" &&
-      !inputValue &&
-      internalTags.length > 0
-    ) {
+    } else if (e.key === "Backspace" && !inputValue && tags.length > 0) {
       // Remove the last tag when backspace is pressed and input is empty
-      const newTags = [...internalTags];
+      const newTags = [...tags];
       newTags.pop();
-      setInternalTags(newTags);
       onChange(newTags);
     }
   };
@@ -76,7 +63,7 @@ const TagInput = ({
         } dark:border-slate-600 dark:bg-slate-700`}
         style={{ minHeight: "38px" }}
       >
-        {internalTags.map((tag) => (
+        {tags.map((tag) => (
           <div className="flex items-center" key={tag}>
             <Badge className="flex items-center gap-1" color={badgeColor}>
               <span className="py-0.5">{tag}</span>
@@ -100,7 +87,7 @@ const TagInput = ({
           name={name}
           onChange={(e) => setInputValue(e.target.value)}
           onKeyDown={handleKeyDown}
-          placeholder={internalTags.length === 0 ? placeholder : ""}
+          placeholder={tags.length === 0 ? placeholder : ""}
           type="text"
           value={inputValue}
         />

src/components/TagInput.tsx

@@ -10,6 +10,47 @@ import { beforeEach, describe, expect, it, vi } from "vitest";
 
 import { Filter, FilterTypeId, JobSearch } from "./JobSearch";
 
+vi.mock("./api", () => ({
+  fetchSuggestions: async (
+    filterTypeId: string,
+    query: string,
+    selectedValues: string[],
+  ) => {
+    if (filterTypeId === "kind") {
+      const mockKinds = [
+        "batch",
+        "stream",
+        "scheduled",
+        "one-time",
+        "recurring",
+        "Chaos",
+        "AITrainingBatch",
+        "UtilizeNewModel",
+      ];
+      return mockKinds
+        .filter((kind) => kind.toLowerCase().includes(query.toLowerCase()))
+        .filter((kind) => !selectedValues.includes(kind));
+    } else if (filterTypeId === "queue") {
+      const mockQueues = [
+        "default",
+        "high-priority",
+        "low-priority",
+        "batch",
+        "realtime",
+      ];
+      return mockQueues
+        .filter((queue) => queue.includes(query.toLowerCase()))
+        .filter((queue) => !selectedValues.includes(queue));
+    } else if (filterTypeId === "priority") {
+      const priorities = ["1", "2", "3", "4"];
+      return priorities
+        .filter((priority) => priority.includes(query))
+        .filter((priority) => !selectedValues.includes(priority));
+    }
+    return [];
+  },
+}));
+
 // Add type declarations for test functions
 declare module "vitest" {
   interface Assertion<T> {
@@ -20,46 +61,6 @@ declare module "vitest" {
 describe("JobSearch", () => {
   beforeEach(() => {
     vi.clearAllMocks();
-    vi.mock("./api", () => ({
-      fetchSuggestions: async (
-        filterTypeId: string,
-        query: string,
-        selectedValues: string[],
-      ) => {
-        if (filterTypeId === "kind") {
-          const mockKinds = [
-            "batch",
-            "stream",
-            "scheduled",
-            "one-time",
-            "recurring",
-            "Chaos",
-            "AITrainingBatch",
-            "UtilizeNewModel",
-          ];
-          return mockKinds
-            .filter((kind) => kind.toLowerCase().includes(query.toLowerCase()))
-            .filter((kind) => !selectedValues.includes(kind));
-        } else if (filterTypeId === "queue") {
-          const mockQueues = [
-            "default",
-            "high-priority",
-            "low-priority",
-            "batch",
-            "realtime",
-          ];
-          return mockQueues
-            .filter((queue) => queue.includes(query.toLowerCase()))
-            .filter((queue) => !selectedValues.includes(queue));
-        } else if (filterTypeId === "priority") {
-          const priorities = ["1", "2", "3", "4"];
-          return priorities
-            .filter((priority) => priority.includes(query))
-            .filter((priority) => !selectedValues.includes(priority));
-        }
-        return [];
-      },
-    }));
   });
 
   describe("Basic Rendering & Props", () => {

src/components/job-search/JobSearch.test.tsx

@@ -15,6 +15,13 @@ class ResizeObserverMock {
 
 global.ResizeObserver = ResizeObserverMock;
 
+// JSDOM does not implement scrolling APIs used by router and focus helpers.
+Object.defineProperty(window, "scrollTo", {
+  configurable: true,
+  value: () => {},
+  writable: true,
+});
+
 // Headless UI relies on the Web Animations API for transitions. JSDOM doesn't
 // implement it, and Headless UI will polyfill with warnings (and may behave
 // differently across versions). Provide a minimal stable polyfill.

src/test/setup.ts

@@ -21,9 +21,8 @@
     "noFallthroughCasesInSwitch": true,
 
     // allow importing services by @services:
-    "baseUrl": "./src",
     "paths": {
-      "@*": ["./*"]
+      "@*": ["./src/*"]
     },
     "typeRoots": ["../../node_modules/@heroicons/**/*.d.ts"]
   },

tsconfig.json

@@ -3,7 +3,6 @@ import { tanstackRouter } from "@tanstack/router-plugin/vite";
 import react from "@vitejs/plugin-react-swc";
 import path from "node:path";
 import { defineConfig } from "vite";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 const dagreCjsPath = path.resolve(
   process.cwd(),
@@ -18,12 +17,25 @@ export default defineConfig({
     rollupOptions: {
       input: "src/main.tsx",
       output: {
-        manualChunks: {
+        manualChunks(id) {
           // use vite-bundle-visualizer to find good candidates for manual chunks:
-          dagrejs: ["@dagrejs/dagre"],
-          headlessui: ["@headlessui/react"],
-          "react-dom": ["react-dom"],
-          reactflow: ["@xyflow/react"],
+          const normalizedId = id.replaceAll("\\", "/");
+
+          if (normalizedId.includes("/node_modules/@dagrejs/dagre/")) {
+            return "dagrejs";
+          }
+
+          if (normalizedId.includes("/node_modules/@headlessui/react/")) {
+            return "headlessui";
+          }
+
+          if (normalizedId.includes("/node_modules/react-dom/")) {
+            return "react-dom";
+          }
+
+          if (normalizedId.includes("/node_modules/@xyflow/react/")) {
+            return "reactflow";
+          }
         },
       },
     },
@@ -36,11 +48,11 @@ export default defineConfig({
     tanstackRouter({
       routeFileIgnorePattern: ".(const|schema|test).(ts|tsx)",
     }),
-    tsconfigPaths(),
   ],
   resolve: {
     alias: {
       "@dagrejs/dagre": dagreCjsPath,
     },
+    tsconfigPaths: true,
   },
 });

vite.config.ts

@@ -1,8 +1,9 @@
-import tsconfigPaths from "vite-tsconfig-paths";
 import { defineConfig } from "vitest/config";
 
 export default defineConfig({
-  plugins: [tsconfigPaths()],
+  resolve: {
+    tsconfigPaths: true,
+  },
   test: {
     environment: "jsdom",
     globals: true,