layerchart
Expert guide for LayerChart, a Svelte component library for building diverse data visualizations (Cartesian, radial, hierarchical, geo, graph) with unopinionated building blocks, motion primitives, and advanced interactions.
Expert guide for LayerChart, a Svelte component library for building diverse data visualizations (Cartesian, radial, hierarchical, geo, graph) with unopinionated building blocks, motion primitives, and advanced interactions.
Expert in internationalization (i18n) and localization (l10n) with i18next, react-intl, multi-language support, RTL layouts, locale-specific formatting, translation management, and automated text extraction
Web/CSS implementation patterns for building polished frontends. Use when implementing designs in HTML/CSS, building components, or creating responsive web interfaces.
Create and manage design systems with Tailwind CSS 4, design tokens, theming, and component documentation
UI component best practices for vanilla JavaScript and HTML. Use this skill when creating or modifying HTML elements, building reusable JavaScript modules, or structuring DOM components in this static website. Apply when working on .html files, JavaScript modules in js/ that manage UI state or rendering, or when creating modular, reusable UI patterns.
Access TailwindPlus UI component library - search, list, and retrieve code for Marketing, Application UI, and eCommerce components in HTML/React/Vue with Tailwind CSS v3/v4
Enforces project client component conventions for interactive React components with hooks, event handlers, Radix UI integration, and server action consumption. Extends react-coding-conventions with client-specific patterns.
Use when creating or modifying Angular components in WebV2 (Angular 19) with proper base class inheritance, state management, and platform patterns.
Enforces project UI component conventions when creating or modifying React components, forms, dialogs, and other UI elements. This skill ensures consistent patterns for Radix UI integration, form handling with TanStack Form, test IDs, accessibility, and component composition.
React開発の詳細ガイド。Hooks、コンポーネント設計、パフォーマンス最適化、テストなど、Reactアプリケーション開発のベストプラクティス。
Review code changes in web/client/ts/ for compliance with architecture principles. Use when reviewing TypeScript UI code, checking store patterns, or validating separation of concerns. Verifies Zustand store as single source of truth, reactive updates, and proper component communication patterns.
Guide for writing React code without unnecessary useEffect. Use when writing or editing React components. Avoid anti-patterns like derived state, chained state updates, and event handlers in effects.
Implement RxJS observables, apply operators, fix memory leaks with unsubscribe patterns, handle errors, create subjects, and build reactive data pipelines in Angular applications.
UI component patterns for React 19, shadcn/ui, and Tailwind. Use when working on files in src/components/.
Provides Tenzir design system tokens and component specifications. Use when building UI components, styling with CSS/Tailwind, choosing colors, typography, spacing, or implementing buttons, inputs, tags/badges, toasts, and other Tenzir UI elements.
Efficient Tailwind CSS patterns using inheritance and custom config
Implement web accessibility (a11y) patterns including ARIA attributes, keyboard navigation, focus management, and screen reader support. Use for any UI component or interactive element.
Design and build reusable, well-documented components. Master component composition, prop design, variant systems, state management, and documentation. Create a scalable component library that enables consistency and speeds up development. Works with React, TypeScript, and Tailwind CSS.
Implement NgRx store with actions and reducers, build selectors, create effects for async operations, configure entity adapters, and integrate HTTP APIs with state management.
Implement responsive layouts with mobile-first CSS, breakpoint strategies, and adaptive components. Use for any UI that needs to work across devices from mobile to desktop.
Guide for UI styling with semantic design system classes. Never use gray-* colors or arbitrary Tailwind utilities.
Guide feature development for React applications with architecture focus. Covers Zustand/Redux patterns, IndexedDB usage, component systems, lazy loading strategies, and seamless integration. Use when adding new features, refactoring existing code, or planning major changes.