chore: Upgrade pnpm to 11

[ysknsid25]

Background & Scope

Addressing #116 #115 requires upgrading pnpm to 11 to use minimumReleaseAge.

However, mixing these into a single branch initially caused a large amount of pnpm 11-triggered diff, unrelated to #116, to creep in.

So the work was split, and this branch chore/upgrade-pnpm-11 (a clean state re-cut from main) focuses only on "upgrading pnpm to 11".

Why does upgrading to pnpm 11 surface problems

.npmrc has shamefully-hoist=true:

shamefully-hoist=true
strict-peer-dependencies=false
engine-strict=true

shamefully-hoist=true is a setting that flattens all dependencies into the root node_modules for npm compatibility (flat hoist). Because of this, on pnpm 10, even dependencies that were actually undeclared (such as @types/node / react) happened to resolve "by accident" via the dependencies of other packages hoisted up to the root.

On pnpm 11 the hoisting structure / resolution paths changed, the resolution that relied on this hoisting broke, and the latent undeclared dependencies were exposed all at once. Furthermore, pnpm 11 has breaking changes such as:

• Blocking build scripts by default for native dependencies and the like (requires allowBuilds)
• Ignoring the pnpm field in package.json (needs to be moved to pnpm-workspace.yaml)
• pnpm itself requires Node 22+

In other words, most of the fixes are correcting dependency hygiene as it should be, namely "properly declaring dependencies that are used but were undeclared" — pnpm 11 simply surfaced them.

Symptom / Cause / Fix list

#	Symptom	Relation to pnpm 11 upgrade	Fixed file	Fix
0	(core) pnpm 10 → 11	—	package.json	Change packageManager from pnpm@10.24.0 to pnpm@11.3.0
1	pnpm/action-setup fails on the CI default Node	pnpm 11 requires Node 22+. action-setup runs before setup-node, installing pnpm with the runner's default Node	.github/actions/environment/action.yml	Add standalone: true to pnpm/action-setup (install pnpm via a Node-independent binary). node-version is already 24
2	@types/node not found	The resolution that relied on shamefully-hoist's hoisting broke on pnpm 11, exposing the undeclared dependency	frameworks/preact/package.json frameworks/solid/package.json frameworks/svelte/package.json	Add @types/node: 24.0.13 to each devDependencies (it was undeclared despite using types:["node"] in tsconfig. core already declared it)
3	react not found	Same as above	packages/core/package.json	For import type { FormEvent } from 'react' in src/types/form/form.react.ts, add react: ^19.2.1 / @types/react: ^19.2.5 to devDependencies and react (optional) to peerDependencies (following the frameworks/react convention)
4	False positive on vue's import/named	A clean install changed resolution paths, so vue's re-exports couldn't be statically resolved, causing a false positive	packages/eslint-config/index.js	Set import/named to off (same approach as already turning import/no-unresolved off. Named imports are verified on the TypeScript side)
5	website prettier diff (24 files)	pnpm 11's hoisting change altered which tailwindcss instance prettier-plugin-tailwindcss resolves, changing class ordering (the lockfile versions themselves are unchanged)	website/src/** (24 files)	Mechanically reformat with pnpm run format (class reordering only, 45±45 lines)
6	"pnpm" field ignored warning	pnpm 11 ignores the pnpm field in package.json	package.json (root) / pnpm-workspace.yaml	Remove root pnpm.patchedDependencies and move it to patchedDependencies in pnpm-workspace.yaml (required for the @qwik.dev/router patch to apply)
7	Native dependency builds are rejected (ERR_PNPM_IGNORED_BUILDS)	pnpm 11 blocks dependency build scripts by default	pnpm-workspace.yaml	Allow @parcel/watcher / deasync / esbuild / sharp / vercel with true under allowBuilds (finalizing the unresolved template pnpm auto-appended during install)

---

Summary by cubic

Upgrade to pnpm@11 and fix dependency declarations exposed by new hoisting. CI/workspace config updated; website files reformatted due to a prettier-plugin-tailwindcss resolution change.

• Dependencies

  • Set packageManager to pnpm@11.3.0; moved pnpm.patchedDependencies to patchedDependencies in pnpm-workspace.yaml for @qwik.dev/router.
  • Declared engines.node as >=22 in the root package.json.
  • Added missing dev deps: @types/node to frameworks/{preact,solid,svelte}; react and @types/react to packages/core. Added optional react and @types/react in peerDependencies for packages/core.
  • Allowed native builds via allowBuilds for @parcel/watcher, deasync, esbuild, sharp, vercel.
  • Disabled import/named in packages/eslint-config to avoid false positives with Vue re-exports.
  • CI: set pnpm/action-setup to standalone: true for Node-independent install.
  • Reformatted website files only (class order) after prettier-plugin-tailwindcss resolved a different tailwindcss instance.

• Migration

  • Requires Node 22+ for pnpm 11.
  • Run a clean install: pnpm install.

^{Written for commit 362d5d9. Summary will update on new commits.}

[vercel]

@ysknsid25 is attempting to deploy a commit to the Open Circle Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Walkthrough

This PR modernizes the project's build system and styling. It upgrades pnpm to version 11.3.0 and relocates patch configuration to the workspace level, adds TypeScript node types to framework packages, and extends React compatibility in the core package to support versions 16–19 with React marked as optional. An ESLint rule is disabled, and the website styling is refactored with systematic Tailwind class reordering across components and root utilities while adding minor visual enhancements such as a Navigation background element and repositioned decorative gradients.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'chore: Upgrade pnpm to 11' accurately reflects the main objective of this PR, which is to upgrade pnpm from version 10 to 11 and address the resulting dependency hygiene issues.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description check	✅ Passed	The pull request description clearly explains the pnpm upgrade, surface issues, and lists all symptom/cause/fix pairs with relevant file changes.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[Copilot]

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

This PR standardizes Tailwind/utility class ordering across website components and updates pnpm/workspace tooling configuration (pnpm 11, build allowlist, dependency patching), alongside a small lint config tweak and React peer support in packages/core.

Changes:

• Reordered Tailwind classes in many website components/styles for consistent formatting.
• Updated pnpm setup: bumped pnpm version, added build allowlist, and relocated patchedDependencies.
• Adjusted lint rules and added React (and types) support in packages/core.

Reviewed changes

Copilot reviewed 32 out of 33 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
website/src/styles/root.css	Reorders @apply utilities for consistent class ordering.
website/src/routes/playground/todos/index.tsx	Reorders Tailwind classes in inputs.
website/src/routes/playground/nested/index.tsx	Reorders Tailwind classes in inputs.
website/src/routes/playground/layout.tsx	Reorders layout class string.
website/src/routes/index.tsx	Reorders Tailwind classes across multiple elements.
website/src/routes/blog/index.tsx	Reorders main container class string.
website/src/routes/blog/(posts)/layout.tsx	Reorders Tailwind classes in article layout.
website/src/routes/404.tsx	Reorders main container class string.
website/src/routes/(legal)/layout.tsx	Reorders main container class string.
website/src/hooks/useMDXComponents.tsx	Reorders Tailwind classes in code block toolbar container.
website/src/components/TextLink.tsx	Reorders focus ring related classes.
website/src/components/Spinner.tsx	Reorders border classes in spinner.
website/src/components/SideBar.tsx	Reorders gradient overlay class string.
website/src/components/Radio.tsx	Reorders label Tailwind classes.
website/src/components/Property.tsx	Reorders Tailwind classes in spans/clsx keys.
website/src/components/PostList.tsx	Reorders heading Tailwind classes.
website/src/components/PostCover.tsx	Reorders Tailwind classes and absolute positioning utilities.
website/src/components/Navigation.tsx	Reorders gradient background helper classes.
website/src/components/Header.tsx	Reorders Tailwind classes in header/menu.
website/src/components/DocsLayout.tsx	Reorders responsive padding utilities.
website/src/components/DocSearch.tsx	Reorders Tailwind classes in overlay/list items.
website/src/components/Debugger.tsx	Reorders margin utilities.
website/src/components/Checkbox.tsx	Reorders label Tailwind classes.
website/src/components/ApiList.tsx	Reorders list layout Tailwind classes.
pnpm-workspace.yaml	Adds build allowlist and patchedDependencies entry.
packages/eslint-config/index.js	Disables import/named rule.
packages/core/package.json	Adds React + types, updates peer deps/meta.
package.json	Bumps pnpm version and removes pnpm.patchedDependencies config.
frameworks/svelte/package.json	Adds @types/node.
frameworks/solid/package.json	Adds @types/node.
frameworks/preact/package.json	Adds @types/node.
.github/actions/environment/action.yml	Enables pnpm action standalone mode.

Files not reviewed (1)

• pnpm-lock.yaml: Language not supported

Comments suppressed due to low confidence (1)

packages/core/package.json:105

• This package declares compatibility with React 16–19, but its devDependency on @types/react@^19 can influence generated .d.ts output (via the dts bundling step) toward React 19 type shapes. That can create type incompatibilities for consumers on older React/@types versions even if the runtime works. Consider aligning the type-generation baseline with the lowest supported major (or adding @types/react as an optional peer dependency with a compatible range and ensuring emitted types don’t rely on React-19-only typings).

  "peerDependenciesMeta": {

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[coderabbitai]

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@package.json`:
- Line 14: Add a top-level "engines" constraint to package.json to require
Node.js >=22 to match pnpm@11; update the package.json root object (near the
existing "packageManager" field) to include an "engines" property with "node":
">=22" so the workspace enforces the Node version for contributors and CI.

In `@pnpm-workspace.yaml`:
- Around line 7-12: The allowBuilds block currently lists bare package names
(allowBuilds, '`@parcel/watcher`', deasync, esbuild, sharp, vercel) which permits
lifecycle scripts for any future versions; update each entry to the exact
version-resolved key from pnpm-lock.yaml (e.g., include the version suffix such
as `@2.5.1`, `@0.1.30`, `@0.25.11`, `@0.33.5` or `@0.34.4`, `@29.4.0` as appropriate) so
pnpm 11 will only allow builds for those reviewed package versions, keeping the
keys quoted where necessary.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 7b9e64ba-fe04-4909-95d9-8bc2d7987264

📥 Commits

Reviewing files that changed from the base of the PR and between a212800 and 3b07082.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (32)

• .github/actions/environment/action.yml
• frameworks/preact/package.json
• frameworks/solid/package.json
• frameworks/svelte/package.json
• package.json
• packages/core/package.json
• packages/eslint-config/index.js
• pnpm-workspace.yaml
• website/src/components/ApiList.tsx
• website/src/components/Checkbox.tsx
• website/src/components/Debugger.tsx
• website/src/components/DocSearch.tsx
• website/src/components/DocsLayout.tsx
• website/src/components/Header.tsx
• website/src/components/Navigation.tsx
• website/src/components/PostCover.tsx
• website/src/components/PostList.tsx
• website/src/components/Property.tsx
• website/src/components/Radio.tsx
• website/src/components/SideBar.tsx
• website/src/components/Spinner.tsx
• website/src/components/TextLink.tsx
• website/src/hooks/useMDXComponents.tsx
• website/src/routes/(legal)/layout.tsx
• website/src/routes/404.tsx
• website/src/routes/blog/(posts)/layout.tsx
• website/src/routes/blog/index.tsx
• website/src/routes/index.tsx
• website/src/routes/playground/layout.tsx
• website/src/routes/playground/nested/index.tsx
• website/src/routes/playground/todos/index.tsx
• website/src/styles/root.css

[cubic-dev-ai]

1 issue found across 33 files

<sub>Reply with feedback, questions, or to request a fix.

Re-trigger cubic</sub>