mirror of
https://github.com/chakra-ui/chakra-ui.git
synced 2026-09-14 16:43:45 +08:00
51eb0ff050
* feat(Button): add accessibleWhenDisabled prop for accessible disabled state When the `accessibleWhenDisabled` prop is set to `true`, the Button component uses `aria-disabled` instead of the native `disabled` attribute, keeping the button focusable and accessible to assistive technologies. - Add `accessibleWhenDisabled` prop to `ButtonBaseProps` - Use `aria-disabled` instead of `disabled` when the prop is enabled - Set `data-disabled` for CSS styling in both modes - Suppress click events when `aria-disabled` is active - IconButton and CloseButton inherit the feature via ButtonProps Closes #10929 * fix: add Emotion style registry for Next.js App Router to prevent hydration errors with Suspense streaming - Add EmotionRegistry component to sandbox/next-app template with delta-tracking cache to avoid duplicated styles - Add @emotion/cache dependency to sandbox/next-app - Document the Emotion style registry in the Next.js App Router guide including the full EmotionRegistry component code and layout usage - Update install command to include @emotion/cache Fixes #10942 * revert: drop unrelated Button accessibleWhenDisabled change This belongs in #10932, not the Next.js Emotion registry docs. * test: add Next.js streaming sandbox for Emotion hydration Reproduces the Suspense/Cache Components mismatch and the Emotion registry fix. * revert: keep the default next-app template without an Emotion registry Streaming hydration belongs in the dedicated next-app-streaming sandbox. * chore: stop ignoring Next agent files in the streaming sandbox * docs(next-app): make the Emotion registry an optional streaming step Keep the default install one-pass. Document the registry only for Suspense and Cache Components. * chore: sync lockfile after dropping @emotion/cache from next-app CI frozen-lockfile failed because the default template no longer depends on it. --------- Co-authored-by: waterWang <waterWang@users.noreply.github.com> Co-authored-by: Segun Adebayo <joseshegs@gmail.com>
next-app-streaming
Repro for streamed Emotion styles under Next.js 16 Cache Components.
pnpm --filter next-app-streaming dev # documented setup, no registry
pnpm --filter next-app-streaming dev:registry # same app with Emotion registry
Then open http://localhost:3010/ (one-pass) and http://localhost:3010/stream (Suspense).
Use a cold server for /stream. Emotion’s module cache hides the mismatch after
the first request.