Agent Skills

Expert ReactFlow architect for building interactive graph applications with hierarchical node-edge systems, performance optimization, and auto-layout integration. Use when Claude needs to create or optimize ReactFlow applications for: (1) Interactive process graphs with expand/collapse navigation, (2) Hierarchical tree structures with drag & drop, (3) Performance-optimized large datasets with incremental rendering, (4) Auto-layout integration with Dagre, (5) Complex state management for nodes an

Automatically fetch latest library/framework documentation for Claude Code via Context7 API

A structured repository for React composition patterns that scale. These patterns help avoid boolean prop proliferation by using compound components, lifting state, and composing internals. - rules/ - Individual rule files (one per rule) - sections.md - Section metadata (titles, impacts, descriptions) - template.md - Template for creating new rules - area-description.md - Individual rule files - m

Feature flags for SaaS that run on TypeScript. Learn more and get started Client side React SDK Read the docs React Native SDK for mobile apps Read the docs Client side Vue SDK Read the docs Browser SDK for use in non-React web applications Read the docs Node.js SDK for use on the server side. Use this for Cloudflare Workers as well. Read the docs CLI to interact with Reflag and generate types Rea

Per-component i18n AI-powered translation. Visual Editor. Multilingual CMS. React + Vite • Most i18n libraries are either too complex, too rigid, or not built for modern frameworks. Intlayer is a modern i18n solution for web and mobile apps. It’s framework-agnostic, AI-powered, and includes a free CMS & visual editor. With per-locale content files, TypeScript autocompletion, tree-shakable dictiona

Upgrade React applications to latest versions, migrate from class components to hooks, and adopt concurrent features. Use when modernizing React codebases, migrating to React Hooks, or upgrading to latest React versions.

Creating interactive data visualisations using d3.js. This skill should be used when creating custom charts, graphs, network diagrams, geographic visualisations, or any complex SVG-based data visualisation that requires fine-grained control over visual elements, transitions, or interactions. Use this for bespoke visualisations beyond standard charting libraries, whether in React, Vue, Svelte, vanilla JavaScript, or any other environment.

Open-source intelligence dashboard tracking the Iran conflict in real time. conflicts.app Most OSINT (open-source intelligence) platforms do a decent job at surfacing individual events, but they fail at painting the full picture of a conflict. You get fragments — a strike here, a statement there — without the connective tissue that makes it possible to actually understand what's happening and why.

React Native upgrade workflow covering updated templates, dependencies, and common pitfalls. Use when migrating a React Native app to a newer release.

Project scaffolding templates for new applications. Use when creating new projects from scratch. Contains 12 templates for various tech stacks.

Best practices for Remotion - Video creation in React

Universal coding standards, best practices, and patterns for TypeScript, JavaScript, React, and Node.js development.

You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, s

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.

Create Zustand stores with TypeScript, subscribeWithSelector middleware, and proper state/action separation. Use when building React state management, creating global stores, or implementing reactive state patterns with Zustand.

Practical patterns for using fp-ts with React - hooks, state, forms, data fetching. Use when building React apps with functional programming patterns. Works with React 18/19, Next.js 14/15.

Angular performance optimization and best practices guide. Use when writing, reviewing, or refactoring Angular code for optimal performance, bundle size, and rendering efficiency.

Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.

Create React Flow node components with TypeScript types, handles, and Zustand integration. Use when building custom nodes for React Flow canvas, creating visual workflow editors, or implementing node-based UI components.

KoliBri stands for "component library for accessibility" and was released as open source by the Informationstechnikzentrum Bund (ITZBund) for reuse and continued development. Together we make HTML accessible using reusable web components to ensure usability and accessibility. The HTML web standard is itself very “openly” specified in order to be as long-lasting and robust as possible. It therefore

Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to build a presentation, convert a PPT/PPTX to web, or create slides for a talk/pitch. Helps non-designers discover their aesthetic through visual exploration rather than abstract choices.

Expert in LangGraph - the production-grade framework for building stateful, multi-actor AI applications. Covers graph construction, state management, cycles and branches, persistence with checkpointers, human-in-the-loop patterns, and the ReAct agent pattern. Used in production at LinkedIn, Uber, and 400+ companies. This is LangChain's recommended approach for building agents. Use when: langgraph, langchain agent, stateful agent, agent graph, react agent.

Expert patterns for Algolia search implementation, indexing strategies, React InstantSearch, and relevance tuning Use when: adding search to, algolia, instantsearch, search api, search functionality.

Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations. Use when creating dashboards, admin panels, or data-rich interfaces with a refined dark aesthetic.