chore: upgrade Node.js version to 24 across the project

.github/workflows/realease-desktop-app.yml

@@ -48,7 +48,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 22
+          node-version-file: .nvmrc
           cache: pnpm
 
       - name: Install Dependencies

.nvmrc

@@ -1 +1 @@
-v22.22.1
+v24.14.0

AGENTS.md

@@ -35,7 +35,7 @@ Currently, we have below features / modules.
 
 **Languages**
 
-- Node.js 22 - main runtime for most apps
+- Node.js 24 LTS - main runtime for most apps
 - TypeScript 5 - main language for most apps
 - Python 3.12 - partially used for tasks / jobs, that are independent, e.g. `/library`
 - Deno - partially used for tasks / jobs, that shares the codebase, e.g. `/jobs`

apps/backgrounds/package.json

@@ -27,7 +27,7 @@
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4",
-    "@types/node": "^22",
+    "@types/node": "^24",
     "@types/react": "^19",
     "@types/react-dom": "^19",
     "@types/three": "^0.170.0",

apps/blog/package.json

@@ -45,6 +45,6 @@
     ]
   },
   "engines": {
-    "node": ">=18.0"
+    "node": ">=24.0.0"
   }
 }

apps/docs/docusaurus.config.ts

@@ -49,7 +49,11 @@ const config: Config = {
   organizationName: "gridaco",
   projectName: "grida",
   onBrokenLinks: "ignore",
-  onBrokenMarkdownLinks: "warn",
+  markdown: {
+    hooks: {
+      onBrokenMarkdownLinks: "warn",
+    },
+  },
   stylesheets: [require.resolve("katex/dist/katex.min.css")],
   i18n: {
     defaultLocale: "en",

apps/docs/package.json

@@ -53,6 +53,6 @@
     ]
   },
   "engines": {
-    "node": ">=18.0"
+    "node": ">=24.0.0"
   }
 }

apps/docs/scripts/docs-site-gen/copy-docs.js

@@ -11,12 +11,11 @@ const dest = path.join(__dirname, "../../../docs/docs");
  * use fse.copySync() to copy files.
  */
 function copyAll() {
-  fse.copySync(origin, dest, { overwrite: true }, function (err) {
-    if (err) {
-      console.error(err);
-    } else {
-    }
-  });
+  // Mirror `/docs` into the Docusaurus content dir: remove stale files so
+  // deletions in the source tree do not leave duplicate routes (e.g. README
+  // vs index) in the build output.
+  fse.emptyDirSync(dest);
+  fse.copySync(origin, dest, { overwrite: true });
 }
 
 module.exports = copyAll;

apps/viewer/package.json

@@ -23,7 +23,7 @@
   "devDependencies": {
     "@eslint/eslintrc": "^3",
     "@tailwindcss/postcss": "^4",
-    "@types/node": "^22",
+    "@types/node": "^24",
     "@types/react": "^19",
     "@types/react-dom": "^19",
     "eslint": "^9",

crates/grida-canvas-wasm/package.json

@@ -29,7 +29,7 @@
     "typecheck": "tsc --noEmit"
   },
   "devDependencies": {
-    "@types/node": "^22",
+    "@types/node": "^24",
     "@webgpu/types": "^0.1.61",
     "serve": "^14.2.4",
     "typescript": "^5"

docs/@designto-code/flags/--empty-content.md

@@ -15,5 +15,5 @@ stage:
 
 ## See also
 
-- [`--dynamic-item`](./--dynamic-item/README.md)
-- [`--dynamic-content`](./--dynamic-container/README.md)
+- [`--dynamic-item`](./--dynamic-item.md)
+- [`--dynamic-container`](./--dynamic-container.md)

docs/@designto-code/flags/--hash.md

@@ -33,4 +33,4 @@ Now vector 1 & 2 will use the same svg data, based on vector 2's svg data (since
 
 ## See also
 
-- [`--id`](./--id/README.md)
+- [`--id`](./--id.md)

docs/@designto-code/flags/--id.md

@@ -22,4 +22,4 @@ by specifing the id flag, you can take advantage in below scenarios.
 
 ## See also
 
-- [`--hash`](./--hash/README.md)
+- [`--hash`](./--hash.md)

docs/@designto-code/flags/--ignore.md

@@ -17,6 +17,6 @@ As a design choice, for example, a designer can add a boxshadow & radius to the
 
 e.g.
 
-- `--ignore=*` - same as [`//@ignore`](../@ignore/README.md)
+- `--ignore=*` - same as `//@ignore` (see [flags index](./index.md))
 - `--ignore=effects`
 - `--ignore=border-radius`

docs/@designto-code/flags/--overflow.md

@@ -15,4 +15,4 @@ stage:
 
 ## See also
 
-[`--scroll`](./--scroll/README.md)
+[`--scroll`](./--scroll.md)

docs/@designto-code/flags/--scroll.md

@@ -2,4 +2,4 @@
 
 ## See also
 
-[`--overflow`](./--overflow/README.md)
+[`--overflow`](./--overflow.md)

docs/@designto-code/index.md

@@ -1,3 +1,19 @@
+---
+format: md
+---
+
+# This directory is copied from [gridaco/designto-code](https://github.com/gridaco/designto-code)
+
+> Documentations landingpage (for github)
+
+For entry, goto [grida.co/docs](https://grida.co/docs/)
+
+## Workflows (**Important!**)
+
+this directory will be copied to gridaco/grida.co by github actions. If you are interacting with this directory under gridaco/grida.co, your changes will be lost.
+
+---
+
 > developer docs for understanding / contributing / developing design-to-code.
 
 ## Widgets

docs/support/index.mdx

@@ -1,3 +1,11 @@
 # Support
 
 for issuing new support ticket, visit https://grida.co/contact
+
+---
+
+This is not a community support directory.
+
+This is a temporary directory for contents that should be listed under support.grida.co or grida.co/support, not grida.co/docs/support.
+
+**WILL BE ARCHIVED AND REMOVED.**

docs/tags.yml

@@ -180,3 +180,63 @@ compositing:
   label: Compositing
   permalink: /compositing
   description: Layers, surfaces, tiles, and GPU composition.
+
+feat-2d:
+  label: 2D features
+  permalink: /feat-2d
+  description: Working-group notes on the 2D canvas engine and related systems.
+
+htmlcss:
+  label: HTML & CSS
+  permalink: /htmlcss
+  description: HTML/CSS alignment, design-to-code mapping, and web styling topics.
+
+lod:
+  label: LOD
+  permalink: /lod
+  description: Level-of-detail strategies for scene content and rendering.
+
+frame-budget:
+  label: Frame budget
+  permalink: /frame-budget
+  description: Per-frame time budgets, scheduling, and cost awareness in the render loop.
+
+benchmarking:
+  label: Benchmarking
+  permalink: /benchmarking
+  description: Performance measurement, profiling, and WASM or engine benchmarks.
+
+tray:
+  label: Tray
+  permalink: /tray
+  description: Tray-related UX and rendering surfaces (working group).
+
+scene-graph:
+  label: Scene graph
+  permalink: /scene-graph
+  description: Scene tree structure, traversal, and graph-level concerns.
+
+format:
+  label: Format
+  permalink: /format
+  description: File and interchange formats (Grida IR, SVG, HTML, Markdown, etc.).
+
+html:
+  label: HTML
+  permalink: /html
+  description: HTML import, mapping, and web document structure in Grida formats.
+
+markdown:
+  label: Markdown
+  permalink: /markdown
+  description: Markdown interchange and documentation-as-format topics.
+
+paint:
+  label: Paint
+  permalink: /paint
+  description: Paint records, display lists, and rasterization-oriented paint pipelines.
+
+data-layout:
+  label: Data layout
+  permalink: /data-layout
+  description: Memory layout, SoA/AoS, and property storage models (e.g. engine research).

docs/wg/feat-2d/wasm-load-scene-optimization.md

@@ -219,7 +219,7 @@ enum. To eliminate this cost, the split must happen **upstream** — at scene
 graph construction time — so that geometry-relevant data is never stored
 inside the monolithic `Node` enum in the first place.
 
-See [docs/wg/research/chromium/node-data-layout.md](../../research/chromium/node-data-layout.md)
+See [docs/wg/research/chromium/node-data-layout.md](../research/chromium/node-data-layout.md)
 for research on Chromium's property tree architecture, which solves
 exactly this problem by storing properties in separate flat arrays indexed
 by integer IDs.
@@ -257,5 +257,5 @@ Replace `Node` enum with entity-component storage (e.g., archetype-based).
 **Recommendation: Option A** (split at SceneGraph) as the incremental path,
 with Option B as the long-term goal once the split maps stabilize.
 
-See [docs/wg/research/chromium/node-data-layout.md](../../research/chromium/node-data-layout.md)
+See [docs/wg/research/chromium/node-data-layout.md](../research/chromium/node-data-layout.md)
 for the full analysis including ECS tradeoffs and mutation considerations.

editor/package.json

@@ -234,7 +234,7 @@
     "@types/mime-types": "^2.1.4",
     "@types/ms": "^2.1.0",
     "@types/negotiator": "^0.6.3",
-    "@types/node": "^22",
+    "@types/node": "^24",
     "@types/papaparse": "^5.3.14",
     "@types/react": "19.2.8",
     "@types/react-dom": "19.2.3",

package.json

@@ -18,7 +18,7 @@
   },
   "devDependencies": {
     "@changesets/cli": "^2.29.4",
-    "@types/node": "^22",
+    "@types/node": "^24",
     "oxfmt": "^0.44.0",
     "tsup": "^8.5.0",
     "tsx": "^4",
@@ -28,7 +28,7 @@
   },
   "resolutions": {},
   "engines": {
-    "node": ">=22.0.0",
+    "node": ">=24.0.0",
     "pnpm": ">=10.0.0"
   },
   "packageManager": "pnpm@10.24.0",

packages/grida-canvas-transparency-grid/package.json

@@ -44,7 +44,7 @@
     "color-parse": "^2.0.2"
   },
   "devDependencies": {
-    "@types/node": "^22",
+    "@types/node": "^24",
     "@types/react": "^19",
     "@webgpu/types": "^0.1.60",
     "react": "^19.0.0"

packages/grida-fonts/package.json

@@ -54,6 +54,6 @@
     "typecheck": "tsc --noEmit"
   },
   "devDependencies": {
-    "@types/node": "^22"
+    "@types/node": "^24"
   }
 }