Skip to content

feat: add Angular renderer#244

Open
marcushohlbein wants to merge 5 commits intovercel-labs:mainfrom
marcushohlbein:feat/angular-renderer
Open

feat: add Angular renderer#244
marcushohlbein wants to merge 5 commits intovercel-labs:mainfrom
marcushohlbein:feat/angular-renderer

Conversation

@marcushohlbein
Copy link
Copy Markdown

New @json-render/angular package: Brings json-render to Angular. Render JSON specs as Angular-managed DOM with signals, providers, and lightweight VNode registry functions.

  • Renderer component: Renders flat specs with optional local state/action inputs
  • Providers: StateProvider, ActionProvider, VisibilityProvider, ValidationProvider for context setup
  • Built-in actions: setState, pushState, removeState, validateForm
  • Hooks: useStateStore, useActions, useUIStream, useChatUI
  • VNode layer: element(), text(), fragment(), component() for registry functions
  • Focus preservation: Maintains focus during re-renders
  • Repeat scope: For rendering arrays with proper state isolation

Includes an Angular example app demonstrating the renderer with a simple card/button setup.

@vercel
Copy link
Copy Markdown
Contributor

vercel bot commented Mar 24, 2026

@marcushohlbein is attempting to deploy a commit to the Vercel Labs Team on Vercel.

A member of the Team first needs to authorize it.

@socket-security
Copy link
Copy Markdown

socket-security bot commented Mar 24, 2026

@socket-security
Copy link
Copy Markdown

socket-security bot commented Mar 24, 2026

All alerts resolved. Learn more about Socket for GitHub.

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

View full report

Comment thread packages/angular/src/hooks.ts
@marcushohlbein marcushohlbein force-pushed the feat/angular-renderer branch 2 times, most recently from eaa98e1 to b68c510 Compare March 24, 2026 23:46
- Renderer component with focus preservation and repeat scope
- Providers: StateProvider, ActionProvider, VisibilityProvider, ValidationProvider
- Hooks: useStateStore, useActions, useUIStream, useChatUI
- VNode layer: element(), text(), fragment(), component()
- Angular example app with full-width layout
@marcushohlbein marcushohlbein force-pushed the feat/angular-renderer branch from b68c510 to 56b3868 Compare March 24, 2026 23:53
::ng-deep is deprecated. JSON spec styles moved to styles.css
to avoid component encapsulation piercing.
- Remove duplicated deepResolveValue function from renderer.ts, now exported from providers/actions.ts
- Simplify focus restoration code by removing shadow DOM complexity (84 lines → 40 lines)
- Update turbo.json schema URL to use latest version instead of v2-8-20
- Remove flattenToPointers from main @json-render/core exports (still available via store-utils)
- Update Angular imports to use flattenToPointers from @json-render/core/store-utils

These changes reduce code duplication, simplify maintenance, and improve the public API surface.
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.

1 participant