Skip to content

fix(json-render-ui): restore shadow-root theming and scrollbars - #278

Merged
antfu merged 1 commit into
devframes:mainfrom
dvcolomban:codex/fix-json-render-shadow-shell
Aug 21, 2026
Merged

fix(json-render-ui): restore shadow-root theming and scrollbars#278
antfu merged 1 commit into
devframes:mainfrom
dvcolomban:codex/fix-json-render-shadow-shell

Conversation

@dvcolomban

@dvcolomban dvcolomban commented Aug 21, 2026

Copy link
Copy Markdown
Contributor

Summary

  • move the light and dark scheme classes onto a display-contents ancestor so Wind3 descendant selectors apply inside the renderer shadow root
  • keep the renderer shell transparent while preserving semantic text colors and native color-scheme behavior
  • bundle the design-system scrollbar stylesheet and reserve a stable scrollbar gutter
  • allow the shared shadow CSS builder to merge ordered hand-authored stylesheets
  • add a Storybook fixture that mounts the shipped dock renderer in a real shadow root

Before

image

After

image
Copilot AI lite review requested due to automatic review settings August 21, 2026 16:35
@vercel

vercel Bot commented Aug 21, 2026

Copy link
Copy Markdown

@dvcolomban is attempting to deploy a commit to the NuxtLabs Team on Vercel.

A member of the Team first needs to authorize it.

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Restores correct theming behavior for the @devframes/json-render-ui dock renderer when mounted inside a real shadow root (matching Wind3 descendant-selector semantics), while also improving scrollbar styling and the shared shadow-CSS build pipeline.

Changes:

  • Move .dark/.light + color-scheme onto a display: contents ancestor so Wind3 dark-variant selectors apply inside the renderer shadow root.
  • Add bundled scrollbar styling + stable scrollbar gutter for the renderer scroll root.
  • Extend design/build-shadow-css.ts to accept and merge multiple ordered hand-authored stylesheets, updating callers accordingly and adding a Storybook fixture that mounts the shipped dock renderer in a shadow root.

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
packages/json-render-ui/src/renderer-module/style.css Adds stable scrollbar gutter for the dock renderer scroll root.
packages/json-render-ui/src/renderer-module/index.ts Fixes shadow-root theme class placement and keeps renderer shell transparent while preserving color-scheme.
packages/json-render-ui/src/JsonRender.stories.ts Adds a Storybook fixture that mounts the shipped dock renderer in a real shadow root.
packages/json-render-ui/scripts/build-css.ts Bundles design-system scrollbar stylesheet + renderer-module styles into the generated shadow CSS.
packages/hub-ui/scripts/build-css.ts Updates build script to the new userStylePaths option shape.
design/build-shadow-css.ts Generalizes build pipeline to merge multiple ordered user stylesheets (post-transform).

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread packages/json-render-ui/src/JsonRender.stories.ts
@dvcolomban
dvcolomban force-pushed the codex/fix-json-render-shadow-shell branch from 8032698 to 849ee57 Compare August 21, 2026 17:27
Copilot AI review requested due to automatic review settings August 21, 2026 17:27

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 5 out of 5 changed files in this pull request and generated no new comments.

@antfu
antfu merged commit 64a21cb into devframes:main Aug 21, 2026
9 of 10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants