Skip to content

Add solid-lang runtime package for OpenUI#429

Open
nizarfadlan wants to merge 4 commits intothesysdev:mainfrom
nizarfadlan:feat/solidjs-support
Open

Add solid-lang runtime package for OpenUI#429
nizarfadlan wants to merge 4 commits intothesysdev:mainfrom
nizarfadlan:feat/solidjs-support

Conversation

@nizarfadlan
Copy link
Copy Markdown

@nizarfadlan nizarfadlan commented Apr 6, 2026

What

Add first-class SolidJS support to OpenUI with a new @openuidev/solid-lang package, plus a complete examples/solid-chat app to demonstrate real-world usage.

This PR now covers both:

  1. Solid runtime/library support
  2. A working SolidJS chat dashboard example with streaming OpenUI rendering

Changes

  • Add new package: @openuidev/solid-lang
    • Component/library APIs: defineComponent, createLibrary
    • Solid renderer: Renderer
    • Context helpers for component authors
    • Form validation helpers and re-exports
    • Lang-core parser/action/runtime type re-exports
  • Add package tooling/config:
    • tsconfig.json, tsconfig.test.json
    • vite.config.ts (Vitest + Solid plugin)
    • eslint.config.cjs
    • package.json scripts and deps
  • Add tests:
    • src/__tests__/library.test.ts
    • src/__tests__/validation.test.ts
    • src/__tests__/Renderer.test.tsx
  • Add package docs:
    • packages/solid-lang/README.md
  • Update repo docs:
    • Add @openuidev/solid-lang to package table and repo structure in README.md
  • Update publish workflow:
    • Add solid-lang option in .github/workflows/publish-npm-package.yml
  • Update lockfile:
    • pnpm-lock.yaml

Add SolidJS example app

  • Add examples/solid-chat with:
    • Solid + Vite app wired to @openuidev/solid-lang
    • OpenUI component library (Card, Chart, KpiTile, MetricList, Timeline, Badge, etc.)
    • Prompt generation script and generated system prompt
    • Dev middleware chat endpoint (/api/chat) for OpenAI-compatible streaming
    • Streaming UX improvements:
      • loading state before valid UI tokens
      • client-side recovery/sanitization for noisy model output
    • Dashboard layout and chart rendering improvements to prevent clipping
    • Example docs and env setup (README.md, .env.example)

Repo-level updates

  • Update root README.md to include @openuidev/solid-lang and examples/solid-chat
  • Update publish workflow to include solid-lang
  • Update pnpm-lock.yaml

Test Plan

Validated locally:

solid-lang package

  • pnpm --filter @openuidev/solid-lang test
  • pnpm --filter @openuidev/solid-lang run ci
  • pnpm --filter @openuidev/solid-lang build

solid-chat example

  • pnpm --filter solid-chat generate:prompt
  • pnpm --filter solid-chat build

All commands pass.

  • Verified locally

Checklist

  • I linked a related issue, if applicable
  • I updated docs/README when needed
  • I considered backwards compatibility

@zahlekhan zahlekhan requested a review from abhithesys April 6, 2026 18:17
@zahlekhan
Copy link
Copy Markdown
Contributor

Thanks for PR. We have assigned a reviewer.

@nizarfadlan
Copy link
Copy Markdown
Author

nizarfadlan commented Apr 7, 2026

Update posted on this PR: the SolidJS work is now expanded beyond @openuidev/solid-lang package support and includes a full examples/solid-chat demo app with real streaming chat + dashboard rendering.

I’ve also updated the PR title/body to reflect this broader scope.
I’ll add UI screenshots in a follow-up comment so reviewers can quickly verify visual output.

OpenUI Solid Chat · 1 44pm · 04-07
OpenUI Solid Chat

Add InputField, TextAreaField, SelectField, ToggleField, and Divider
components and wire them into the example library and Stack layout.

These components enable form-like rendering and two-way binding using
state references so example UIs can collect and reflect user input more
naturally.

feat(solid-chat): extend text tones and structured button actions

Add additional TextContent tones (success, warning, danger, info) and
allow Button action to accept structured action objects (open_url and
continue_conversation) in addition to simple action strings.

This expands the expressiveness of UI primitives and enables richer
status styling and actionable button semantics from generated content.

feat(solid-chat): add action schemas and parser

Introduce Zod schemas for open_url and continue_conversation actions and
an actionSchema union used by the prompt generator and library. Add a
parser created from the library JSON schema for runtime parsing of
assistant responses.

These additions make action payloads explicit and allow the UI to
validate and interpret structured actions produced by the assistant.

feat(solid-chat): add raw/parsed/thinking views and UI improvements

Enhance the chat UI with a parser-backed parsed view, a raw response
panel, a thinking/debug panel, prompt starters, responsive compact mode,
and auto-scroll for streaming assistant messages. Expand assistant
message shape to capture raw, thinking, and reasoning
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