dashboard-openui-parity

Synchronize compiled React dashboard pages with interpreted OpenUI Lang programs.

1|Updated Jul 12, 2026
One-click install
npx skills add https://github.com/Tyler-R-Kendrick/slm-training --skill dashboard-openui-parity
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: dashboard-openui-parity
Source: https://github.com/Tyler-R-Kendrick/slm-training/tree/main/.agents/skills/dashboard-openui-parity
Command: npx skills add https://github.com/Tyler-R-Kendrick/slm-training --skill dashboard-openui-parity

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires tsx, pytest, and includes scripts (resource) components.

What problem does it solve?

This skill prevents drift between hand-written React dashboard pages and their interpreted OpenUI Lang counterparts, ensuring that both rendering modes remain functionally and visually identical.

Core Features & Use Cases

  • Parity Synchronization: Automates the validation loop between compiled React components and interpreted OpenUI programs.
  • Structural Validation: Uses custom scripts to verify DSL integrity, manifest consistency, and component mapping.
  • Use Case: When updating a dashboard page, use this skill to ensure the corresponding .openui program is updated, validated, and correctly registered in the manifest to prevent interpreted-mode rendering errors.

Quick Start

Run the dashboard-openui-parity skill to validate the current page structure and synchronize the manifest after making changes to the dashboard source files.

Frequently Asked Questions about dashboard-openui-parity

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I keep React and OpenUI dashboard rendering in sync?

To keep React and OpenUI rendering in sync, validate the DSL structure and update the manifest to ensure both compiled and interpreted modes render identically. This prevents visual and functional drift across dual-mode environments.

Why does my dashboard page break in interpreted mode but work in React?

Your dashboard breaks in interpreted mode due to manifest drift or invalid DSL structure between the compiled React page and the OpenUI Lang program. Running structural validation scripts identifies and corrects the mapping inconsistencies causing the rendering errors.

What is OpenUI Lang parity for React dashboards?

OpenUI Lang parity for React dashboards is the state where hand-written compiled React components and interpreted OpenUI programs remain functionally and visually identical. It is maintained by synchronizing the DSL structure and component library mappings.

How do I validate an OpenUI DSL manifest against a React component?

To validate an OpenUI DSL manifest against a React component, execute the structural validation scripts provided by the dashboard-openui-parity skill. This verifies tool provider mappings, DSL integrity, and component library consistency to ensure correct runtime rendering.

Do I need tsx to validate OpenUI dashboard parity?

Yes, you need tsx and pytest installed in your environment to execute the structural validation scripts that verify the OpenUI dashboard parity. These dependencies are required to run the validation loop and synchronize the manifest updates.

When should I run dashboard parity validation during development?

You should run dashboard parity validation immediately after making changes to dashboard source files. This ensures the corresponding OpenUI program is updated, validated, and correctly registered in the manifest before runtime rendering errors can occur.