feat: implement live React/JSX rendering in AI Assist Canvas
- Enhanced LiveCanvas with Babel Standalone and React/ReactDOM CDNs - Implemented automatic import resolution and root mounting for React components - Updated parseStreamingContent to identify React code as renderable 'app' artifacts - Updated UI to automatically switch to Preview mode for React artifacts - Updated all AI provider prompts to officially support and encourage React rendering
This commit is contained in:
@@ -751,8 +751,8 @@ AGENTS & CAPABILITIES:
|
||||
- pm: Project Manager. Create PRDs, timelines, and action plans.
|
||||
- code: Software Architect. Provide logic, algorithms, and backend snippets.
|
||||
- design: UI/UX Designer. Create high-fidelity mockups and components.
|
||||
- web: Frontend Developer. Build responsive sites using HTML/Tailwind.
|
||||
- app: Mobile App Developer. Create mobile-first interfaces and dashboards.
|
||||
- web: Frontend Developer. Build responsive sites using HTML/Tailwind or React. Use [PREVIEW:web:html] or [PREVIEW:web:javascript].
|
||||
- app: Mobile App Developer. Create mobile-first interfaces and dashboards. React components are supported and rendered live. Use [PREVIEW:app:javascript].
|
||||
|
||||
ITERATIVE MODIFICATIONS (CRITICAL):
|
||||
- When a user asks for a change, fix, or update to an existing design/preview, you MUST be SURGICAL.
|
||||
|
||||
@@ -1025,8 +1025,8 @@ AGENTS & CAPABILITIES:
|
||||
- pm: Project Manager. Create PRDs, timelines, and action plans.
|
||||
- code: Software Architect. Provide logic, algorithms, and backend snippets.
|
||||
- design: UI/UX Designer. Create high-fidelity mockups and components.
|
||||
- web: Frontend Developer. Build responsive sites using HTML/Tailwind.
|
||||
- app: Mobile App Developer. Create mobile-first interfaces and dashboards.
|
||||
- web: Frontend Developer. Build responsive sites using HTML/Tailwind or React. Use [PREVIEW:web:html] or [PREVIEW:web:javascript].
|
||||
- app: Mobile App Developer. Create mobile-first interfaces and dashboards. React components are supported and rendered live. Use [PREVIEW:app:javascript].
|
||||
|
||||
ITERATIVE MODIFICATIONS (CRITICAL):
|
||||
- When a user asks for a change, fix, or update to an existing design/preview, you MUST be SURGICAL.
|
||||
|
||||
@@ -824,8 +824,8 @@ AGENTS & CAPABILITIES:
|
||||
- pm: Project Manager. Create PRDs, timelines, and action plans.
|
||||
- code: Software Architect. Provide logic, algorithms, and backend snippets.
|
||||
- design: UI/UX Designer. Create high-fidelity mockups and components.
|
||||
- web: Frontend Developer. Build responsive sites using HTML/Tailwind.
|
||||
- app: Mobile App Developer. Create mobile-first interfaces and dashboards.
|
||||
- web: Frontend Developer. Build responsive sites using HTML/Tailwind or React. Use [PREVIEW:web:html] or [PREVIEW:web:javascript].
|
||||
- app: Mobile App Developer. Create mobile-first interfaces and dashboards. React components are supported and rendered live. Use [PREVIEW:app:javascript].
|
||||
|
||||
ITERATIVE MODIFICATIONS (CRITICAL):
|
||||
- When a user asks for a change, fix, or update to an existing design/preview, you MUST be SURGICAL.
|
||||
|
||||
Reference in New Issue
Block a user