crisai-ui-surfaces

Provide React and Ink UI components with TypeScript contracts for crisAI.

Updated Apr 18, 2026
One-click install
npx skills add https://github.com/crissdiamond/crisAI --skill crisai-ui-surfaces
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: crisai-ui-surfaces
Source: https://github.com/crissdiamond/crisAI/tree/main/.claude/skills/crisai-ui-surfaces
Command: npx skills add https://github.com/crissdiamond/crisAI --skill crisai-ui-surfaces

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires react, ink, typescript, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides a comprehensive set of UI components and contracts for the crisAI platform, ensuring a consistent and efficient user interface across different applications.

Core Features & Use Cases

  • Shared UI Components: Offers React and Ink terminal clients for a seamless user experience.
  • TypeScript Contracts: Includes TypeScript contracts for UI event handling and state management.
  • Design Tokens: Provides a unified color palette and typography for consistent branding.
  • Use Case: When building a new crisAI application, this Skill can be used to integrate a consistent UI design, improving the user experience and maintaining brand consistency.

Quick Start

Load the crisai-ui-surfaces skill to ensure a consistent UI experience when developing with crisAI.

Frequently Asked Questions about crisai-ui-surfaces

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

FAQPage Schema
How do I maintain consistent UI branding across React and terminal applications?

Unified UI components and design tokens ensure consistent branding across React web and Ink terminal applications. A shared color palette and typography maintain visual consistency, while TypeScript contracts standardize event handling across different client interfaces.

What's the best way to handle UI events across web and terminal clients in TypeScript?

Handling UI events across web and terminal clients requires TypeScript contracts that define standard event handling and state management logic. These contracts provide a unified interface ensuring seamless interaction between React and Ink applications.

Do I need React and Ink to build terminal user interfaces with this UI component suite?

Yes, you need React and Ink to build terminal user interfaces with this component suite. The shared UI components are built specifically for React and Ink, requiring both dependencies alongside TypeScript to develop a consistent interface.

Can I use these design tokens to standardize typography and color palettes for new applications?

Yes, you can use these design tokens to standardize typography and color palettes for new applications. The unified design tokens enforce branding consistency, allowing new applications to integrate a consistent UI design efficiently.

How do I integrate a consistent UI design when developing new platform applications?

You integrate a consistent UI design by loading the shared component suite during application development. Providing React and Ink clients alongside TypeScript contracts ensures a seamless user experience and maintains branding consistency across the platform.