mirror of
https://github.com/hanzo-docs/docs.git
synced 2026-10-25 04:20:02 +00:00
* feat(openapi): anchor links on schema properties Each property rendered inline in a request body, response body, or parameter now gets a stable id and a hover-revealed link icon, enabling deep links to specific fields from guides. Ids follow: - body-<prop> for request bodies - response-<status>-<prop> for responses - parameters-<location>-<name> for parameters A new idPrefix option on SchemaUI opts other Schema renderings into the same behavior. See fuma-nama/fumadocs#3322. * feat(openapi): deep-link nested schema properties Extend the property anchor scheme to support hashes that point inside a popover or below an array's "Show array" collapsible. Schema-internal segments are joined with `.` so `#body.user.address.street` resolves unambiguously regardless of dashes in property names. On hash match, the inline anchor scrolls into view, the matching popover auto-opens with its breadcrumb pre-navigated, the array collapsible expands, and oneOf/anyOf tabs switch to the variant containing the targeted field. The deep target is consumed after the first auto-open, so subsequent user clicks on the same trigger get the base view; a different deep hash re-arms it. The hover anchor is now a copy-link button (matches fumadocs heading anchors) that writes the full URL to the clipboard and updates the address bar via history.replaceState (no hashchange, no popover reset). * address PR review feedback - Clarified the changeset: split anchor ID rules by context (request/response property paths vs flat parameter anchors) so dots aren't implied to apply to parameters. - Namespaced anchors by media type when an operation has multiple request-body or response content types: prefix becomes `<media-slug>-body` / `response-<status>-<media-slug>`, and the content-type SelectTabs auto-switches to the targeted tab when a deep link arrives. Single-content-type operations keep the simple `body` / `response-<status>` form. - Made findUnionPropMatch validate the *full* remaining path (via new pathResolves helper) so two variants that share the first prop name no longer race; the wrong tab can't be selected for a deep hash anymore. - Reset SchemaUIPopover breadcrumb state when initialPath changes so a fresh deep hash takes effect on an already-open popover. - Replaced the lossy slugifyPropertyName with encodeURIComponent (plus % encoding for `.`) so property anchors stay collision-safe across case-only differences, punctuation-only differences, and non-ASCII keys, while `.` remains exclusively a path separator. * address PR review feedback - Fix potential hydration mismatch in useTabValueFromHash by initializing state with the fallback value and resolving from the URL hash inside useEffect; the deep-linked tab now corrects after hydration on the client. * fix(openapi): move useTabValueFromHash into a client component The previous hydration-mismatch fix put `useEffect`/`useState` directly in `operation/index.tsx`, which is a Server Component — Next refused to compile because RSC modules can't import client-only React APIs. Extract the hash-aware tab wrapper into `operation/hash-tabs.tsx` (with `"use client"`) and switch both body and response sites to `HashAwareSelectTabs`. The parent tree stays server-side; only the tab wrapper hydrates on the client. * address PR review feedback - Wrap decodeURIComponent in try/catch in both deep-link hash parsers so a malformed percent-encoded fragment (e.g. `#body%`) is treated as "no target" instead of throwing URIError and breaking tab / popover resolution. * address PR review feedback - Match the URL hash against DOM ids using the raw fragment first, with the fully-decoded form as a fallback, in both DeepLinkProvider and hash-tabs. Property anchors are generated via slugifyPropertyName (which percent-encodes reserved chars like `.`), so DOM ids contain the encoded form; decoding the hash before lookup caused links like `#body.foo%2Ebar` to miss the matching element. * redesign * fix types --------- Co-authored-by: Fuma Nama <[email protected]>
Examples
The apps here are used to generate code examples for our docs.
Please be careful.