Zod 4 #4074
Zod 4 #4074
Conversation
✅ Deploy Preview for guileless-rolypoly-866f8a ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Important Review skippedReview was skipped as selected files did not have any reviewable changes. 💤 Files selected but had no reviewable changes (1)
You can disable this status message by setting the WalkthroughThis update introduces a new monorepo structure using pnpm workspaces, modernizes the build and test pipelines, and adds a comprehensive documentation system for the Zod library. Legacy files, Deno support, and older configurations are removed. Extensive new benchmarking, documentation content, and utility scripts are added, with a focus on Zod v4 and improved developer experience. Changes
Sequence Diagram(s)sequenceDiagram
participant Dev as Developer
participant Repo as Monorepo
participant Docs as Docs System
participant CI as CI/CD
participant Bench as Benchmarks
Dev->>Repo: Adds/updates code, docs, benchmarks
Repo->>CI: Triggers on push/PR (pnpm, Vitest, Biome)
CI->>Repo: Reports status (test, lint, build)
Dev->>Docs: Writes/updates MDX docs, React components
Dev->>Bench: Adds new benchmarks (Zod v3/v4, others)
Bench->>Repo: Runs performance comparisons
Docs->>Repo: Generates static docs (Next.js, MDX)
Poem
✨ Finishing Touches🧪 Generate Unit Tests
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
packages/docs/content/v4/index.mdx
Outdated
| z.prettifyError(myError); | ||
| ``` | ||
|
|
||
| The returns the following pretty-printable multi-line string: |
There was a problem hiding this comment.
| The returns the following pretty-printable multi-line string: | |
| This returns the following pretty-printable multi-line string: |
* v4 release updates * Tweak
There was a problem hiding this comment.
Actionable comments posted: 21
♻️ Duplicate comments (7)
.github/workflows/release.yml (2)
31-31: 🛠️ Refactor suggestionPSA: lock your install. For CI reproducibility, prefer:
- pnpm install + pnpm install --frozen-lockfileThis ensures your lockfile is honored.
33-38: 🛠️ Refactor suggestionPro-tip: build before you publish. Without a build step, you risk pushing uncompiled code. Consider:
- - id: publish + - name: Build package + run: | + pnpm run build + - id: publish.github/workflows/release-beta.yaml (1)
1-1: Header typo. The comment says# .github/release.ymlbut this file isrelease-beta.yaml. Let’s update it for clarity.packages/docs/content/basics.mdx (2)
83-86:⚠️ Potential issueFix catch variable misuse. You catch as
errbut test againsterror, causing a ReferenceError. Update like so:-catch(err){ - if(error instanceof z.ZodError){ +catch(err){ + if(err instanceof z.ZodError){
5-8: 🧹 Nitpick (assertive)Consistent import style. Standardize all imports to use single quotes and include semicolons. For example:
-import { Callout } from "fumadocs-ui/components/callout" +import { Callout } from 'fumadocs-ui/components/callout';packages/docs/content/index.mdx (2)
18-19:⚠️ Potential issueFix Tailwind important modifier syntax. Replace
my-0!with!my-0on these<img>tags so Tailwind applies it correctly. For example:- className="block dark:hidden mx-auto my-0! h-full" + className="block dark:hidden mx-auto !my-0 h-full"
25-37:⚠️ Potential issueFix badge image classes. All badges use
m-0!, which should be!m-0. Update each like so:- className="h-[20px] m-0!" + className="h-[20px] !m-0"
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
📒 Files selected for processing (8)
.github/workflows/release-beta.yaml(1 hunks).github/workflows/release.yml(3 hunks)packages/bench/tsconfig.bench.json(1 hunks)packages/docs/app/layout.tsx(1 hunks)packages/docs/content/basics.mdx(1 hunks)packages/docs/content/index.mdx(1 hunks)packages/docs/content/library-authors.mdx(1 hunks)packages/docs/content/meta.json(1 hunks)
🧰 Additional context used
🪛 YAMLlint (1.37.1)
.github/workflows/release-beta.yaml
[warning] 4-4: truthy value should be one of [false, true]
(truthy)
[warning] 7-7: too few spaces before comment: expected 2
(comments)
[error] 19-19: trailing spaces
(trailing-spaces)
[error] 24-24: trailing spaces
(trailing-spaces)
[error] 30-30: trailing spaces
(trailing-spaces)
[warning] 34-34: comment not indented like content
(comments-indentation)
.github/workflows/release.yml
[error] 22-22: trailing spaces
(trailing-spaces)
[error] 52-52: trailing spaces
(trailing-spaces)
🪛 LanguageTool
packages/docs/content/basics.mdx
[uncategorized] ~58-~58: The hyphen in strongly-typed is redundant.
Context: ... an input. If it's valid, Zod returns a strongly-typed deep clone of the input. ```ts Play...
(ADVERB_LY_HYPHEN_FIX)
packages/docs/content/library-authors.mdx
[style] ~16-~16: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ...rform black-box validation, you may not need to integrate with Zod specifically. Instea...
(REP_NEED_TO_VB)
[uncategorized] ~16-~16: A comma may be missing after the conjunctive/linking adverb ‘Instead’.
Context: ...eed to integrate with Zod specifically. Instead look into [Standard Schema](https://sta...
(SENT_START_CONJUNCTIVE_LINKING_ADVERB_COMMA)
[uncategorized] ~87-~87: The preposition “in” seems more likely in this position than the preposition “on”.
Context: ...property. This property is only defined on Zod 4 schemas. ```ts import type * as ...
(AI_EN_LECTOR_REPLACEMENT_PREPOSITION_ON_IN)
[grammar] ~163-~163: Two determiners in a row. Choose either “the” or “a”.
Context: ...mas? Accepting user-defined schemas is the a fundamental operation for any library b...
(DT_DT)
🔇 Additional comments (5)
packages/bench/tsconfig.bench.json (2)
2-3: Looks solid—base config extension 🎉
Extending from../.configs/tsconfig.base.jsonkeeps everything consistent across packages.
8-9: Great call: skipping lib checks for speed ⚡️
Turning offskipDefaultLibCheckandskipLibCheckwill speed up your bench compile times without compromising your own types. Nice!.github/workflows/release.yml (2)
7-7: Nice catch on branch rename. Updating the trigger frommastertomainaligns with our primary branch—LGTM!
38-38: FYI: dry-run is enabled. Thedry-run: trueflag will only simulate a publish. Is that intentional? Remove it when you’re ready for a real release.packages/docs/content/meta.json (1)
1-23: Looks solid! The JSON structure cleanly organizes your docs into clear sections and page entries. No issues spotted here.
| "noEmit": true, | ||
| "extendedDiagnostics": true, | ||
| "traceResolution": true, |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Heads-up: super verbose diagnostics 🚀
Enabling extendedDiagnostics and traceResolution is awesome for deep debugging, but can be noisy in CI. Consider toggling these only when troubleshooting benchmarks to keep your logs lean.
🤖 Prompt for AI Agents
In packages/bench/tsconfig.bench.json around lines 4 to 6, the settings
"extendedDiagnostics" and "traceResolution" are enabled, which produce very
verbose output that can clutter CI logs. Modify the configuration to enable
these options conditionally, such as through environment variables or separate
debug configurations, so they are only active during troubleshooting and not in
regular CI runs.
| "noEmit": true, | ||
| "extendedDiagnostics": true, | ||
| "traceResolution": true, | ||
| "customConditions": [], |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Nit: drop empty customConditions? 🤔
If you’re not using conditional exports here, you can safely omit this field—TypeScript defaults to all conditions.
🤖 Prompt for AI Agents
In packages/bench/tsconfig.bench.json at line 7, remove the empty
"customConditions" array since it is not being used and TypeScript defaults to
all conditions. Simply delete the line containing "customConditions": [] to
clean up the configuration.
| @@ -19,37 +19,25 @@ jobs: | |||
| - uses: actions/checkout@v4 | |||
| with: | |||
| fetch-depth: 0 | |||
|
|
|||
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Heads up: trailing whitespace. These blank lines have stray spaces that can trigger YAML lint errors. Please delete the extra spaces.
Also applies to: 52-52
🧰 Tools
🪛 YAMLlint (1.37.1)
[error] 22-22: trailing spaces
(trailing-spaces)
🤖 Prompt for AI Agents
In .github/workflows/release.yml at lines 22 and 52, remove any trailing
whitespace characters at the end of these blank lines to prevent YAML lint
errors. Ensure these lines contain no spaces or tabs after the last visible
character or are completely empty.
.github/workflows/release.yml
Outdated
| push: | ||
| branches: | ||
| - "master" | ||
| - main | ||
| paths: | ||
| - package.json |
There was a problem hiding this comment.
Critical: broaden the trigger paths. Right now only the root package.json fires a release. Bumps in packages/zod/package.json won’t trigger it. You might want:
on:
push:
branches:
- main
- paths:
- - package.json
+ paths:
+ - package.json
+ - packages/zod/package.json📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| push: | |
| branches: | |
| - "master" | |
| - main | |
| paths: | |
| - package.json | |
| on: | |
| push: | |
| branches: | |
| - main | |
| paths: | |
| - package.json | |
| - packages/zod/package.json |
🤖 Prompt for AI Agents
In .github/workflows/release.yml around lines 5 to 9, the workflow trigger is
limited to changes only in the root package.json file, which prevents releases
from triggering on changes in other package.json files like
packages/zod/package.json. To fix this, update the paths under the push trigger
to include all package.json files in the repository, for example by using a
pattern like '**/package.json' to broaden the trigger scope.
| - uses: actions/checkout@v4 | ||
| with: | ||
| fetch-depth: 0 | ||
|
|
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Trailing spaces alert. Those blank lines carry extra spaces—please strip them to keep YAML lint happy.
Also applies to: 24-24, 30-30
🧰 Tools
🪛 YAMLlint (1.37.1)
[error] 19-19: trailing spaces
(trailing-spaces)
🤖 Prompt for AI Agents
In .github/workflows/release-beta.yaml at lines 19, 24, and 30, there are
trailing spaces on blank lines that cause YAML lint errors. Remove all trailing
spaces from these blank lines to ensure the YAML file passes linting checks.
| } | ||
| ``` | ||
|
|
||
| To differentiate between Zod 3 and Zod 4 schemas at runtime, check for the `"_zod"` property. This property is only defined on Zod 4 schemas. |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Preposition tweak. Change “on Zod 4 schemas” to “in Zod 4 schemas” for more natural wording.
🧰 Tools
🪛 LanguageTool
[uncategorized] ~87-~87: The preposition “in” seems more likely in this position than the preposition “on”.
Context: ...property. This property is only defined on Zod 4 schemas. ```ts import type * as ...
(AI_EN_LECTOR_REPLACEMENT_PREPOSITION_ON_IN)
🤖 Prompt for AI Agents
In packages/docs/content/library-authors.mdx at line 87, change the preposition
in the sentence from "on Zod 4 schemas" to "in Zod 4 schemas" to improve the
naturalness of the wording.
| title: For library authors | ||
| --- | ||
|
|
||
| import { Callout } from "fumadocs-ui/components/callout" |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Remove unused import. The Callout component is never used—drop this import to keep things tidy.
🤖 Prompt for AI Agents
In packages/docs/content/library-authors.mdx at line 5, the import statement for
the Callout component is unused. Remove the entire line importing Callout from
"fumadocs-ui/components/callout" to clean up the code and avoid unnecessary
imports.
| <br/> | ||
|
|
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Replace <br/> with Tailwind spacing. Instead of stacked <br/>, consider a <div className="my-12" /> or similar margin utility for robust spacing.
Also applies to: 72-72
🤖 Prompt for AI Agents
In packages/docs/content/index.mdx around lines 52 to 53 and line 72, replace
the <br/> tags used for spacing with Tailwind CSS margin utilities. Remove the
<br/> elements and instead wrap the content or insert a <div> with an
appropriate margin class like className="my-12" to create consistent and
maintainable vertical spacing.
| import { Accordion, Accordions } from 'fumadocs-ui/components/accordion'; | ||
| import { Tabs } from 'fumadocs-ui/components/tabs'; |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Remove unused imports. Accordion, Accordions, and Tabs are imported but not used—let’s drop them.
🤖 Prompt for AI Agents
In packages/docs/content/index.mdx around lines 6 to 7, the imports for
Accordion, Accordions, and Tabs are not used anywhere in the file. Remove these
unused imports from the import statements to clean up the code and avoid
unnecessary dependencies.
packages/docs/content/index.mdx
Outdated
| <div className="mt-5 font-gray-100 mx-auto text-center pt-12"> | ||
| <span className=""> | ||
| Zod 4 is now stable! <a rel="noopener noreferrer" href="/v4" alt="zod 4 release notes">Click here</a> to read the release notes. | ||
| </span> |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Accessibility: replace alt on <a>. Anchors don’t support alt—use aria-label or title instead.
🤖 Prompt for AI Agents
In packages/docs/content/index.mdx around lines 66 to 69, the anchor tag
incorrectly uses an alt attribute, which is not valid for anchors. Replace the
alt attribute with an aria-label or title attribute to improve accessibility,
ensuring the descriptive text is preserved for screen readers and tooltips.
There was a problem hiding this comment.
Actionable comments posted: 4
♻️ Duplicate comments (13)
packages/docs/content/packages/mini.mdx (2)
13-13: Simplify wording – drop “exact”
Per previous feedback, “exact same” can be trimmed to “same” for a snappier sentence.- It implements the exact same functionality as `zod`, but using a *functional*, *tree-shakable* API. + It implements the same functionality as `zod`, but using a *functional*, *tree-shakable* API.🧰 Tools
🪛 LanguageTool
[style] ~13-~13: ‘exact same’ might be wordy. Consider a shorter alternative.
Context: ...tall zod@^3.25.0 ``` It implements the exact same functionality aszod, but using a *fu...(EN_WORDINESS_PREMIUM_EXACT_SAME)
68-68: Add missing comma after “Instead”
A quick comma after “Instead” will smooth the read.- In `zod/v4-mini` such methods aren't implemented. Instead you pass these checks into schemas using the `.check()` method: + In `zod/v4-mini` such methods aren't implemented. Instead, you pass these checks into schemas using the `.check()` method:🧰 Tools
🪛 LanguageTool
[uncategorized] ~68-~68: A comma may be missing after the conjunctive/linking adverb ‘Instead’.
Context: ...-mini` such methods aren't implemented. Instead you pass these checks into schemas usin...(SENT_START_CONJUNCTIVE_LINKING_ADVERB_COMMA)
packages/docs/app/layout.tsx (2)
1-11: 🧹 Nitpick (assertive)Group those imports for better readability!
You've got a mix of component imports, CSS imports, and utilities all jumbled together. Consider organizing them for clarity:
- External packages (
@vercel/analytics/react,next/font/google, etc.)- Global styles (
./global.css)- Local components (
@/components/*)This makes it way easier to scan the dependencies at a glance.
-import { InkeepBubble } from "@/components/inkeep-bubble"; -import InkeepSearchBox from "@/components/inkeep-search"; - -import "./global.css"; -import Scroller from "@/components/scroller"; -import { Analytics } from "@vercel/analytics/react"; -import { Banner } from "fumadocs-ui/components/banner"; -import { RootProvider } from "fumadocs-ui/provider"; -import { Inter } from "next/font/google"; -import { type ReactNode, Suspense } from "react"; +import { Analytics } from "@vercel/analytics/react"; +import { Inter } from "next/font/google"; +import { type ReactNode, Suspense } from "react"; +import { RootProvider } from "fumadocs-ui/provider"; + +import "./global.css"; + +import { InkeepBubble } from "@/components/inkeep-bubble"; +import InkeepSearchBox from "@/components/inkeep-search"; +import Scroller from "@/components/scroller";🧰 Tools
🪛 Biome (1.9.4)
[error] 7-7: This import is unused.
Unused imports might be the result of an incomplete refactoring.
(lint/correctness/noUnusedImports)
33-33: 🧹 Nitpick (assertive)Drop the empty theme object.
That empty
theme={{}}prop isn't doing anything. Unless you're planning to add theme values soon, you can safely remove it.- theme={{}}packages/docs/app/(doc)/layout.tsx (2)
31-36: 🧹 Nitpick (assertive)Consider hosting the Zod 3 logo locally.
Using a raw GitHub URL for the Zod 3 logo could break if the repo structure changes. For better reliability, save the logo locally in your public directory.
- <img - src="https://raw.githubusercontent.com/colinhacks/zod/3782fe29920c311984004c350b9fefaf0ae4c54a/logo.svg" - alt="Zod 3" - className="h-4" - /> + <img + src="/logo/logo-v3.svg" + alt="Zod 3" + className="h-4" + />
48-59: 🧹 Nitpick (assertive)Add aria-label to the GitHub icon link.
The SVG icon has a title, but adding an aria-label to the link itself would improve accessibility for screen readers.
{ type: "icon", url: "https://github.com/colinhacks/zod", text: "GitHub", + aria-label: "GitHub repository", icon: ( <svg role="img" viewBox="0 0 24 24" fill="currentColor"> <title>github logo</title> <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" /> </svg> ), external: true, },packages/docs/content/index.mdx (7)
6-7: 🧹 Nitpick (assertive)Remove unused imports.
You're importing
Accordion,Accordions, andTabscomponents that aren't being used in this file. Let's clean that up!-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion'; -import { Tabs } from 'fumadocs-ui/components/tabs';
18-19: 🛠️ Refactor suggestionFix Tailwind important modifier syntax.
The Tailwind important modifier is in the wrong spot - it should be before the class name, not after it.
- <img className="block dark:hidden mx-auto my-0! h-full" alt="zod logo" src="/logo/logo-glow.png" /> - <img className="hidden dark:block mx-auto my-0! h-full" alt="zod logo" src="/logo/logo-glow.png" /> + <img className="block dark:hidden mx-auto !my-0 h-full" alt="zod logo" src="/logo/logo-glow.png" /> + <img className="hidden dark:block mx-auto !my-0 h-full" alt="zod logo" src="/logo/logo-glow.png" />
25-38: 🛠️ Refactor suggestionFix Tailwind important modifier in badge images.
Same issue with the Tailwind important modifiers across all these badge images - the
!should go before the class name.- <img className="h-[20px] m-0!" src="https://github.com/colinhacks/zod/actions/workflows/test.yml/badge.svg?event=push&branch=main" alt="Zod CI status" /> + <img className="h-[20px] !m-0" src="https://github.com/colinhacks/zod/actions/workflows/test.yml/badge.svg?event=push&branch=main" alt="Zod CI status" />(Apply similar fix to all other badge images)
52-53: 🧹 Nitpick (assertive)Replace
with Tailwind spacing.Using
<br/>tags for spacing is a bit old-school. Tailwind's margin utilities would give you more consistent spacing control.-<br/> +<div className="my-8"></div>
54-64: 🧹 Nitpick (assertive)Remove commented-out ParamField block.
This large commented-out block of example code isn't serving any purpose. If you're not planning to use it soon, best to remove it to keep the file clean.
66-70: 🧹 Nitpick (assertive)Remove or fix the commented-out announcement block.
If you're not planning to use this announcement, you should remove it. If you do plan to use it, the
altattribute on the anchor tag is invalid HTML - usearia-labelortitleinstead.-{/* <div className="mt-5 font-gray-100 mx-auto text-center pt-12"> - <span className=""> - Zod 4 is now stable! <a rel="noopener noreferrer" href="/v4" alt="zod 4 release notes">Click here</a> to read the release notes. - </span> -</div> */}
72-72: 🧹 Nitpick (assertive)Replace triple
with margin.These consecutive line breaks should be replaced with a proper margin utility class for better maintainability.
-<br /><br /><br /> +<div className="my-16"></div>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
📒 Files selected for processing (4)
packages/docs/app/(doc)/layout.tsx(1 hunks)packages/docs/app/layout.tsx(1 hunks)packages/docs/content/index.mdx(1 hunks)packages/docs/content/packages/mini.mdx(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
packages/docs/app/layout.tsx (3)
packages/docs/components/inkeep-bubble.tsx (1)
InkeepBubble(6-58)packages/docs/components/inkeep-search.tsx (1)
InkeepSearchBox(7-46)packages/docs/components/scroller.tsx (1)
Scroller(7-32)
🪛 Biome (1.9.4)
packages/docs/app/layout.tsx
[error] 7-7: This import is unused.
Unused imports might be the result of an incomplete refactoring.
(lint/correctness/noUnusedImports)
🪛 LanguageTool
packages/docs/content/index.mdx
[uncategorized] ~141-~141: Possible missing comma found.
Context: ...v5.5* and later. Older versions may work but are not officially supported. You must...
(AI_HYDRA_LEO_MISSING_COMMA)
packages/docs/content/packages/mini.mdx
[style] ~13-~13: ‘exact same’ might be wordy. Consider a shorter alternative.
Context: ...tall zod@^3.25.0 ``` It implements the exact same functionality as zod, but using a *fu...
(EN_WORDINESS_PREMIUM_EXACT_SAME)
[uncategorized] ~68-~68: A comma may be missing after the conjunctive/linking adverb ‘Instead’.
Context: ...-mini` such methods aren't implemented. Instead you pass these checks into schemas usin...
(SENT_START_CONJUNCTIVE_LINKING_ADVERB_COMMA)
🔇 Additional comments (5)
packages/docs/app/layout.tsx (2)
20-25: LGTM - good call commenting out the banner.The banner would be redundant once Zod 4 is stable and widely used. Commenting it out keeps the code clean while preserving it for reference.
37-39: Good use of Suspense for the Scroller!Wrapping the Scroller component in Suspense with a null fallback is a smart approach - it prevents layout shifts during loading.
packages/docs/app/(doc)/layout.tsx (1)
12-39: Nice sidebar configuration!The sidebar setup with configurable components, tabs for different Zod versions, and proper navigation is well-structured. Good job disabling collapsibility for a cleaner UI.
packages/docs/content/index.mdx (2)
86-101: Great code example!This is a nice, clean example that quickly demonstrates how to use Zod for validation. The import path
zod/v4clearly indicates this is for the new version.
119-135: Comprehensive installation instructions!Nice job covering all the major package managers (npm, deno, yarn, bun, pnpm) for both stable and canary versions. This makes it easy for users regardless of their preferred tools.
| ```sh | ||
| npm install zod@^3.25.0 | ||
| 6851 | ``` |
There was a problem hiding this comment.
Fix installation instructions for Zod 4 mini
The “Try it” snippet is pointing people to v3 (^3.25.0), but the mini variant lives in Zod 4. Let’s bump this so folks actually get the v4 package.
- npm install zod@^3.25.0
+ npm install zod@^4.0.0📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| ```sh | |
| npm install zod@^3.25.0 | |
| ``` |
🤖 Prompt for AI Agents
In packages/docs/content/packages/mini.mdx around lines 9 to 11, the
installation command for Zod is incorrectly set to version 3 (^3.25.0). Update
the npm install command to specify a version from Zod 4 to ensure users install
the correct mini variant. Replace the version number with an appropriate Zod 4
version, such as ^4.x.x.
packages/docs/app/layout.tsx
Outdated
| import "./global.css"; | ||
| import Scroller from "@/components/scroller"; | ||
| import { Analytics } from "@vercel/analytics/react"; | ||
| import { Banner } from "fumadocs-ui/components/banner"; |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Remove the unused Banner import.
The Banner component is imported but commented out in the actual layout. Let's keep things tidy!
-import { Banner } from "fumadocs-ui/components/banner";📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { Banner } from "fumadocs-ui/components/banner"; | |
| -import { Banner } from "fumadocs-ui/components/banner"; |
🧰 Tools
🪛 Biome (1.9.4)
[error] 7-7: This import is unused.
Unused imports might be the result of an incomplete refactoring.
(lint/correctness/noUnusedImports)
🤖 Prompt for AI Agents
In packages/docs/app/layout.tsx at line 7, the Banner component is imported but
not used in the code since it is commented out. Remove the import statement for
Banner to clean up unused imports and keep the code tidy.
| }; | ||
| export default function Layout({ children }: { children: ReactNode }) { | ||
| return ( | ||
| <DocsLayout {...layoutProps} containerProps={{}}> |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Is the empty containerProps necessary?
You're passing containerProps={{}} to DocsLayout, but if you're not customizing container properties, you could omit this prop entirely.
- <DocsLayout {...layoutProps} containerProps={{}}>
+ <DocsLayout {...layoutProps}>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <DocsLayout {...layoutProps} containerProps={{}}> | |
| <DocsLayout {...layoutProps}> |
🤖 Prompt for AI Agents
In packages/docs/app/(doc)/layout.tsx at line 64, the prop containerProps is
being passed as an empty object to DocsLayout. Since no container properties are
being customized, remove the containerProps={{}} prop entirely from the
DocsLayout component to clean up the code.
|
|
||
| ## Requirements | ||
|
|
||
| Zod is tested against *TypeScript v5.5* and later. Older versions may work but are not officially supported. |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Add comma in requirements section.
There should be a comma after "Older versions may work" for better readability.
-Zod is tested against *TypeScript v5.5* and later. Older versions may work but are not officially supported.
+Zod is tested against *TypeScript v5.5* and later. Older versions may work, but are not officially supported.🧰 Tools
🪛 LanguageTool
[uncategorized] ~141-~141: Possible missing comma found.
Context: ...v5.5* and later. Older versions may work but are not officially supported. You must...
(AI_HYDRA_LEO_MISSING_COMMA)
🤖 Prompt for AI Agents
In packages/docs/content/index.mdx at line 141, add a comma after "Older
versions may work" in the sentence to improve readability. The corrected
sentence should read: "Older versions may work, but are not officially
supported."
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (3)
packages/docs/app/(doc)/layout.tsx (3)
31-36: 🧹 Nitpick (assertive)Consider hosting the Zod 3 logo locally instead of using an external URL.
Hey there! Loading the Zod 3 logo from a GitHub raw URL could break if the repo structure changes or if GitHub changes how they serve raw content. It'd be safer to save this logo in your local public directory:
- <img - src="https://raw.githubusercontent.com/colinhacks/zod/3782fe29920c311984004c350b9fefaf0ae4c54a/logo.svg" - alt="Zod 3" - className="h-6" - /> + <img + src="/logo/logo-v3.svg" + alt="Zod 3" + className="h-6" + />This would make your docs more resilient and load faster too!
48-59: 🛠️ Refactor suggestionEnhance accessibility for the GitHub icon link.
The SVG has a
<title>tag, but wrapping it in a link without anaria-labelcan be confusing for screen readers. Add anaria-labelto make this link more accessible:{ type: "icon", url: "https://github.com/colinhacks/zod", text: "GitHub", + aria-label: "GitHub repository", icon: ( <svg role="img" viewBox="0 0 24 24" fill="currentColor"> <title>github logo</title> <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" /> </svg> ), external: true, },
64-64: 🧹 Nitpick (assertive)Is the empty containerProps necessary?
Looks like you're passing
containerProps={{}}to DocsLayout, but since it's empty, you could just remove it to clean up the code:- <DocsLayout {...layoutProps} containerProps={{}}> + <DocsLayout {...layoutProps}>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
📒 Files selected for processing (1)
packages/docs/app/(doc)/layout.tsx(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
packages/docs/app/(doc)/layout.tsx (3)
packages/docs/app/layout.config.tsx (1)
baseOptions(19-30)packages/docs/loaders/source.ts (1)
source(8-19)packages/docs/components/sidebar-item.tsx (2)
SidebarItem(16-42)SidebarSeparator(44-58)
🔇 Additional comments (1)
packages/docs/app/(doc)/layout.tsx (1)
1-68: Nice work on the docs layout structure!The overall structure of the layout looks good! You've set up a clean navigation system with tabs for different Zod versions, added GitHub links, and configured the sidebar properly. The use of custom sidebar components will help maintain consistent styling throughout the docs.
| title: "Zod 4", | ||
| description: "The latest version of Zod", | ||
| url: "/", | ||
| icon: <img src="/logo/logo.png" alt="Zod 4" className="h-5" />, |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Make logo heights consistent between tabs.
The Zod 4 logo uses className="h-5" while the Zod 3 logo uses className="h-6". This might make the tabs look unbalanced. Consider using the same height value for both logos for visual consistency.
- <img src="/logo/logo.png" alt="Zod 4" className="h-5" />
+ <img src="/logo/logo.png" alt="Zod 4" className="h-6" />Also applies to: 34-34
🤖 Prompt for AI Agents
In packages/docs/app/(doc)/layout.tsx at lines 24 and 34, the logo images have
inconsistent height classes: one uses "h-5" and the other "h-6". To fix this,
update both logo img elements to use the same className height value, either
"h-5" or "h-6", ensuring visual consistency between tabs.
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (3)
packages/docs/app/layout.tsx (3)
1-11: Let's organize these imports for better readability.The imports could be grouped more logically to make it easier to scan:
- External packages (
@vercel/analytics/react,next/font/google)- Global CSS (
./global.css)- Local components (
@/components/*,fumadocs-ui/*)+import { Analytics } from "@vercel/analytics/react"; +import { Inter } from "next/font/google"; +import { type ReactNode, Suspense } from "react"; + +import "./global.css"; + +// import { Banner } from "fumadocs-ui/components/banner"; +import { RootProvider } from "fumadocs-ui/provider"; import { InkeepBubble } from "@/components/inkeep-bubble"; import InkeepSearchBox from "@/components/inkeep-search"; - -import "./global.css"; import Scroller from "@/components/scroller"; -import { Analytics } from "@vercel/analytics/react"; -// import { Banner } from "fumadocs-ui/components/banner"; -import { RootProvider } from "fumadocs-ui/provider"; -import { Inter } from "next/font/google"; -import { type ReactNode, Suspense } from "react";
7-7: Drop the unused Banner import.The Banner component is imported but commented out in the JSX. Since it's not being used, we should remove the import entirely.
-// import { Banner } from "fumadocs-ui/components/banner";
33-33: That empty theme object isn't doing anything.The empty theme prop isn't adding any value here. You can safely remove it unless you're planning to add theme values later.
- theme={{}}
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
📒 Files selected for processing (1)
packages/docs/app/layout.tsx(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
packages/docs/app/layout.tsx (3)
packages/docs/components/inkeep-bubble.tsx (1)
InkeepBubble(6-58)packages/docs/components/inkeep-search.tsx (1)
InkeepSearchBox(7-46)packages/docs/components/scroller.tsx (1)
Scroller(7-32)
🔇 Additional comments (1)
packages/docs/app/layout.tsx (1)
18-41: Overall structure looks clean and well-organized.The layout provides a solid foundation with proper HTML semantics, language attributes, and responsive structure. The integration of Inkeep for search and chat functionality is implemented correctly, and wrapping everything in the RootProvider ensures consistent theming and functionality.
| <Suspense fallback={null}> | ||
| <Scroller /> | ||
| </Suspense> |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Nice use of Suspense for the Scroller.
Wrapping the Scroller component in Suspense with a null fallback is a good approach for async components. Looking at the Scroller component code snippet, you might want to clean up the console.dir statement in the handleScroll function before going to production.
🤖 Prompt for AI Agents
In packages/docs/app/layout.tsx around lines 37 to 39, the Suspense wrapper for
the Scroller component is correctly implemented, but the handleScroll function
inside the Scroller component contains a console.dir statement used for
debugging. Remove or comment out this console.dir statement to clean up the code
before production deployment.
| {/* <Banner id="zod4"> | ||
| 💎 Zod 4 is now stable! <span> </span> | ||
| <a className="underline" href="/v4"> | ||
| Read the announcement. | ||
| </a> | ||
| </Banner> */} |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Consider whether you still need this Banner component.
The Banner is commented out - if you're keeping it for later, that's cool, but if you're done with it, you might want to remove it completely to keep things clean.
- {/* <Banner id="zod4">
- 💎 Zod 4 is now stable! <span> </span>
- <a className="underline" href="/v4">
- Read the announcement.
- </a>
- </Banner> */}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| {/* <Banner id="zod4"> | |
| 💎 Zod 4 is now stable! <span> </span> | |
| <a className="underline" href="/v4"> | |
| Read the announcement. | |
| </a> | |
| </Banner> */} | |
| // (The commented-out Banner block has been removed) |
🤖 Prompt for AI Agents
In packages/docs/app/layout.tsx around lines 20 to 25, the Banner component is
commented out. Decide if this Banner is still needed; if it is no longer
required, remove the commented-out code entirely to keep the file clean and
maintainable. If you plan to use it later, you can leave it as is.
Zod 4 (colinhacks#4074) - Remove `z.literal(Symbol("terrific"));` from docs in api.mdx
Zod 4 (#4074) - Remove `z.literal(Symbol("terrific"));` from docs in api.mdx
Zod 4 (colinhacks#4074) - Remove `z.literal(Symbol("terrific"));` from docs in api.mdx
Announcement post: v4.zod.dev/v4
Release notes / breaking changes: v4.zod.dev/v4/changelog
Summary by CodeRabbit
New Features
Bug Fixes
Documentation
Chores
Refactor
Style
Tests