Skip to content

docs(plans): json-render as an iframe view provider (plan of record) - #181

Closed
antfubot wants to merge 1 commit into
mainfrom
docs/json-render-ui-packaging-plan
Closed

docs(plans): json-render as an iframe view provider (plan of record)#181
antfubot wants to merge 1 commit into
mainfrom
docs/json-render-ui-packaging-plan

Conversation

@antfubot

Copy link
Copy Markdown
Collaborator

Capture-only design doc (plans/json-render-ui-packaging.md) from a design interview — no implementation.

The model

json-render becomes a swappable, framework-agnostic view provider rendered in an iframe, rather than an in-process, Vue-coupled renderer baked into the hub UI.

  • A hub maps a dock view type (json-render, and any future type) → a provider SPA, registered node-side via initHub({ viewProviders }) (which mounts it through the existing mountDevframe path). Headless core keeps no json-render-ui dependency; the app wires the official provider; community swaps it.
  • The client discovers the type→URL map via a read-only devframe:view-providers shared-state key (avoids the __index.json manual-path gap). No entry for a type → the hub UI shows a built-in empty state ("no json-render provider registered").
  • A provider-backed dock renders as a pooled iframe (frameId = provider+stateKey, ?view=<stateKey>); the provider SPA reads that view off the shared socket. Inline specs are materialized by the client resolver into an ephemeral shared-state key so the iframe always gets a uniform stateKey.
  • The provider iframe themes itself to match the host (dark/light via the shared color-scheme storage key; brand primary via branding.json).

Why it matters (the crux)

json-render is implemented once (@devframes/json-render-ui's SPA) and reused by every hub UI — Vue, React, vanilla — via an iframe. The current triple implementation collapses to one; the Next example's React json-render port is deleted, not duplicated. The in-process DockRenderer seam stays for niche in-process/custom types; json-render's in-process bridge is deprecated.

Contents

Decision log (3 interview rounds), target package topology + composition model, and a staged PR stack (A: catalog growth → B: json-render-ui provider SPA → C: hub view-provider mechanism → D: hub-ui iframe rendering → E: examples/React-port deletion → F: later-cycle deprecation removal), including interactions with the open branding PRs #176/#177.

Supersedes the first draft in the same file (which had hub-ui reuse json-render-ui in-process). Follows the plans/ "plan of record" convention. Implementation is deliberately deferred pending sign-off.

Created with the help of an agent.

Capture-only design doc from a design interview. json-render becomes a
swappable, framework-agnostic iframe-hosted 'view provider' (default
@devframes/json-render-ui), registered node-side via initHub({ viewProviders })
and discovered by the client through a read-only devframe:view-providers
shared-state map. The hub UI renders a provider-backed dock as a pooled iframe
(?view=<stateKey>), materializes inline specs into an ephemeral key, and shows a
built-in empty state when a view type has no provider. Collapses the current
triple json-render implementation to one SPA reused by every UI; keeps the
in-process renderer seam for niche types. No implementation yet.
@netlify

netlify Bot commented Aug 10, 2026

Copy link
Copy Markdown

Deploy Preview for devfra ready!

Name Link
🔨 Latest commit 2aaae94
🔍 Latest deploy log https://app.netlify.com/projects/devfra/deploys/6a79329cefa6960008e676dc
😎 Deploy Preview https://deploy-preview-181--devfra.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants