React Flow Node Ts
技能 已验证 活跃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.
Empower developers to efficiently build custom nodes for React Flow diagrams, ensuring type safety and seamless state management.
功能
- Generates React Flow node components
- Includes TypeScript type definitions
- Provides integration patterns for Zustand store
- Offers templates for node structure and styling
- Supports custom handles and resizers
使用场景
- Building custom nodes for React Flow applications
- Developing visual workflow editors or diagramming tools
- Implementing complex, stateful node-based UI components
- Ensuring type safety and maintainability in React Flow projects
非目标
- Providing a complete React Flow implementation
- Managing the entire React Flow canvas setup
- Handling backend data fetching or API integration for node data
Practical Utility
- info:Edge casesThe SKILL.md outlines the core patterns and integration steps but does not explicitly document failure modes or recovery steps for edge cases.
安装
请先添加 Marketplace
/plugin marketplace add microsoft/skills/plugin install azure-sdk-typescript@skills质量评分
已验证类似扩展
Setup Tailwind Typescript
100Configure Tailwind CSS with TypeScript in a Next.js or React project. Covers installation, configuration, custom theme extensions, component patterns, and type-safe styling utilities. Use when adding Tailwind CSS to an existing TypeScript project, customizing the Tailwind theme for a project's design system, setting up type-safe component styling patterns, or configuring Tailwind plugins and extensions.
Sentry React Router Framework Sdk
100Full Sentry SDK setup for React Router Framework mode. Use when asked to "add Sentry to React Router Framework", "install @sentry/react-router", or configure error monitoring, tracing, profiling, session replay, logs, or user feedback for a React Router v7 framework app.
React Modernization
99Upgrade 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.
前端设计
99通过高设计质量创建独特、生产级的面向接口。当用户要求构建 Web 组件、页面或应用程序时，请使用此技能。生成富有创意、精美的代码，避免通用的 AI 美学。
Shadcn/ui Component Library
99shadcn/ui component library for React with Tailwind CSS - copy-paste accessible components with full code ownership
React State Management
99Master modern React state management with Redux Toolkit, Zustand, Jotai, and React Query. Use when setting up global state, managing server state, or choosing between state management solutions.