Skill directory
Agent skills
Focused instruction packs that teach a coding agent one job well. Browse the catalog and use any of them inside a RiverX project.
18,175Skills
1,902Publishers
249Official
Syncfusion React Accumulation Chartsyncfusion/react-ui-components-skillsImplement Syncfusion React Accumulation Charts including Pie, Doughnut, Funnel, and Pyramid chart types. Use this skill when users need circular data visualization, percentage-based charts, or proportional data displays. Covers data labels, legends, tooltips, grouping, smart labels, drill-down charts, explode effects, theming, accessibility, export/print capabilities, and dynamic data updates.015Syncfusion React AI Assistviewsyncfusion/react-ui-components-skillsImplement the Syncfusion React AI AssistView component. Use this skill to handle AI-powered conversational interfaces, AssistView setup, conversation flow, speech input or output, file attachments, UI customization, state management, chain of thoughts reasoning visualization, generative UI with dynamic tools, and AI service integration such as OpenAI or Azure AI in React applications.014Syncfusion React Appbarsyncfusion/react-ui-components-skillsCreate responsive navigation headers with AppBar component. Build top, bottom, or sticky app bars with buttons, menus, icons, and sidebars. Use when building navigation elements, toolbars, action bars, or responsive headers with dynamic content layout. Includes color modes (Light, Dark, Primary, Inherit), size modes (Regular, Prominent, Dense), spacing, separators, and full accessibility support.07Syncfusion React Barcodesyncfusion/react-ui-components-skillsGenerate, customize, and export barcodes in React using Syncfusion BarcodeGenerator. Trigger for requests involving Code39 or Code128 barcodes, QR codes, Data Matrix generation, barcode styling (size, color, text, margins), React component setup, props or events, SVG or canvas rendering, and exporting or printing barcode images.07Syncfusion React Blockeditorsyncfusion/react-ui-components-skillsImplement the Syncfusion React BlockEditor component for block-based content editing. Use this skill for block-based rich content editing, document creation, CMS interfaces, markdown alternatives, editor setup, block configuration, toolbar or menu customization, drag-and-drop behavior, formatting options, APIs, accessibility, real-time collaborative editing with Yjs integration, user presence and remote cursors, document version history and snapshot management in React.011Syncfusion React Breadcrumbsyncfusion/react-ui-components-skillsImplement and configure Syncfusion React Breadcrumb component for navigation paths, routing, and site hierarchy. Use this skill whenever users need breadcrumb navigation, want to create hierarchical navigation paths, display location breadcrumbs, handle navigation between pages, customize overflow behaviors, or integrate breadcrumbs with routing libraries.07Syncfusion React Bullet Chartsyncfusion/react-ui-components-skillsImplements the Syncfusion React Bullet Chart component for KPI and performance indicator visualization. Use this when users need feature measure displays, comparative measures, target comparisons, or metric visualizations. Covers data binding, value bars, target bars, ranges, titles, tooltips, data labels, axis customization, orientation, and accessibility.014Syncfusion React Buttonssyncfusion/react-ui-components-skillsComprehensive guide for implementing Syncfusion React button components including Button, ButtonGroup, DropDownButton, Floating Action Button, ProgressButton, SplitButton, Speed Dial, Switch, RadioButton, and Chips. Use this when adding styled buttons, toggle behavior, icon support, grouped selections, dropdown action menus, programmatic control floating primary actions, expandable speed dial menus, compact interactive elements with avatars and drag-and-drop, or single/multiple selection capabilities to a React application.075Syncfusion React Calendarssyncfusion/react-ui-components-skillsComprehensive guide for implementing Syncfusion React Calendar components including Calendar, DatePicker, DateRangePicker, DateTimePicker, and TimePicker. Covers installation, data binding, date/time selection, range selection, formatting, localization, masking, validation, customization, templates, accessibility, and controlled component patterns in React applications.038Syncfusion React Cardssyncfusion/react-ui-components-skillsBuild flexible card layouts for displaying content in React. The Card component is a lightweight container that supports headers, images, action buttons, horizontal layouts, and integration with other Syncfusion components. Use this skill whenever the user needs to create cards, build card-based UIs, display content cards, add action buttons to cards, customize card layouts, or embed components within cards.07Syncfusion React Carouselsyncfusion/react-ui-components-skillsComplete guide to implementing the Syncfusion React Carousel component for rotating image galleries, product carousels, slideshow presentations, testimonials, and sequential content display. Use this skill when working with slide transitions, navigation controls, animations, styling, and accessibility features. Covers installation, item population, and all API properties, methods, and events.011Syncfusion React Chartssyncfusion/react-ui-components-skillsImplement Syncfusion React Charts component for data visualization. Use this when creating charts, configuring axes and series, or customizing visualization styles. This skill covers chart types, data binding, user interactions, financial indicators, accessibility features, and professional data visualization in React applications.09Syncfusion React Chat UIsyncfusion/react-ui-components-skillsImplement the Syncfusion React Chat UI component. Use this skill to create and customize messaging interfaces, including chat setup, message rendering, file attachments, typing indicators, conversation layout, theming, event handling, and real-time updates in React applications.013Syncfusion React Circular Gaugesyncfusion/react-ui-components-skillsImplement Syncfusion React Circular Gauge for displaying KPIs, sensor data, speedometers, and real-time monitoring dashboards. Use this skill when users need to visualize quantitative measurements on a circular scale. Covers axes, pointers, ranges, customization, animations, print/export, accessibility, and internationalization.09Syncfusion React Commonsyncfusion/react-ui-components-skillsCommon utilities and features for Syncfusion React components. Use this skill when the user needs to implement animations, drag-and-drop, state persistence, RTL support, localization, globalization, security, templates, and advanced features for Syncfusion React components.04Syncfusion React Context Menusyncfusion/react-ui-components-skillsImplements Syncfusion React ContextMenu (SfContextMenu) for right-click interactions and context-sensitive popup menus. Use this when adding menu items, handling selection events, or customizing templates and styling. Covers setup, data binding, accessibility, keyboard navigation, common methods and properties, and integration patterns.09Syncfusion React Dashboard Layoutsyncfusion/react-ui-components-skillsBuild responsive, interactive dashboard layouts with Syncfusion React Dashboard Layout component. Implement draggable and resizable panels, responsive grid systems, dynamic panel management, and state persistence. This skill covers multi-column layouts, floating panel arrangement, extensive customization, drag-drop panel rearrangement, and state management for React applications.015Syncfusion React Data Managersyncfusion/react-ui-components-skillsImplements Syncfusion DataManager for local/remote binding, CRUD, querying, caching, and middleware. Supports JsonAdaptor, ODataAdaptor, ODataV4Adaptor, UrlAdaptor, WebApiAdaptor, WebMethodAdaptor, RemoteSaveAdaptor, GraphQLAdaptor, CustomDataAdaptor, and CustomAdaptor. Covers Query class, filtering, sorting, paging, grouping, persistence, offline mode, caching, and error handling.010Syncfusion React Diagramsyncfusion/react-ui-components-skillsCreate and customize visual diagrams in React using Syncfusion Diagrams. Trigger for requests involving React component setup, nodes and connectors, flowcharts, org charts, process diagrams, BPMN or UML models, ER diagrams, layout algorithms, swimlanes, symbol palettes, and interactive diagram visualization features.018Syncfusion React Dropdown Treesyncfusion/react-ui-components-skillsImplement Syncfusion React Dropdown Tree component for hierarchical data selection with dropdown interaction. Use this when working with multi-select checkboxes, lazy loading, remote OData integration, custom templates, keyboard navigation, RTL support, or localized interfaces. Supports auto-check hierarchy, filtering, tree settings, comprehensive event handling, and full accessibility.010Syncfusion React Dropdownssyncfusion/react-ui-components-skillsComprehensive guide for implementing Syncfusion React dropdown components including AutoComplete, ComboBox, DropDownList, ListBox, Mention, MultiSelect, and MultiColumn ComboBox. Use this when building selection interfaces, data binding, filtering, cascading dropdowns, custom templates, and accessible dropdown experiences in React applications.073Syncfusion React File Managersyncfusion/react-ui-components-skillsImplement Syncfusion React File Manager component for file system navigation and management. Use when users need file browsing, upload/download, file operations (create, delete, rename), multiple views, drag-drop, customization, or accessibility features. Supports local and remote file systems with comprehensive customization options.020Syncfusion React Gantt Chartsyncfusion/react-ui-components-skillsImplement, configure, and customize the Syncfusion React Gantt Chart component. Use this when building project scheduling applications with task timelines, dependencies, and resource management. Covers GanttComponent setup, task constraints, taskbar customization, filtering, sorting, Excel/PDF export, critical path analysis, milestones, predecessors, resource view, and baseline tracking.028Syncfusion React Gridsyncfusion/react-ui-components-skillsImplements Syncfusion React Grid component for feature-rich data tables and grids. Use this when working with data display, sorting, filtering, grouping, aggregates, editing, or exporting. This skill covers grid configuration, CRUD operations, virtual scrolling or infinite scrolling, hierarchy grids, state persistence, and advanced data management features for data-intensive applications.043Syncfusion React Heatmapsyncfusion/react-ui-components-skillsImplement Syncfusion React HeatMap Chart component for data visualization. Use this skill when user needs to create heatmaps, visualize 2D data patterns, display matrix data with color gradients, configure axes (numerical/categorical/datetime), implement legends, handle cell selection, apply custom styling, or work with large datasets. Covers installation, data binding, axis configuration, appearance customization, interaction patterns, tooltips, events, and accessibility.09Syncfusion React Image Editorsyncfusion/react-ui-components-skillsMaster Syncfusion React Image Editor for comprehensive image editing. Use this when users need to edit images, add annotations, apply filters, manage layers, or implement image editing features. Supports multiple formats (PNG, JPEG, SVG, WEBP, BMP), annotations (text, shapes, freehand, images), effects (filters, finetune), and accessibility features.026Syncfusion React Inline AI Assistsyncfusion/react-ui-components-skillsImplement the Syncfusion React Inline AI Assist component. Use this skill to add inline AI suggestions, integrate AI services such as OpenAI, Gemini, Lite-LLM, or Ollama, configure command and response actions, customize toolbars, handle events, and support real-time prompt-response workflows in React.011Syncfusion React Inputssyncfusion/react-ui-components-skillsComprehensive guide for implementing Syncfusion React input components including Uploader, NumericTextBox, TextBox, TextArea, CheckBox, OTP Input, Signature, RangeSlider, ColorPicker, MaskedTextBox, and Rating. Use this when building file upload UIs with async/chunk uploads, drag-and-drop functionality, numeric inputs with validation and formatting, text inputs with floating labels, custom adornments, form integration, accessibility compliance, and styling in React applications.095Syncfusion React Kanbansyncfusion/react-ui-components-skillsImplement Syncfusion React Kanban component for flexible task management and workflow visualization. Use this when building kanban boards, workflow stages, or card-based task management systems. This skill covers drag-and-drop card operations, swimlane organization, WIP limit validation, custom card templates, event handling, and API data binding for React applications.012Syncfusion React Licensesyncfusion/react-ui-components-skillsUse this skill when the user asks about Syncfusion React licensing, license keys, license registration, license validation errors, trial licenses, or license troubleshooting. This skill provides comprehensive guidance on generating, registering, and managing Syncfusion license keys for React applications, including edition-based and platform-based licensing models, registration methods, CI/CD integration, and resolving common licensing errors.04Syncfusion React Linear Gaugesyncfusion/react-ui-components-skillsImplement Syncfusion React Linear Gauge for displaying measurements on a linear scale. Use this skill when users need temperature sensors, KPI indicators, progress gauges, or real-time monitoring dashboards. Covers axes configuration, pointer types, ranges, annotations, customization, animations, print/export, accessibility, and internationalization.08Syncfusion React Listviewsyncfusion/react-ui-components-skillsImplement Syncfusion React ListView component for displaying dynamic lists with single/multiple selection, templates, filtering, grouping, drag-drop, and virtualization. Use this when you need list visualization, item management, selection handling, custom templates, and data filtering. Supports local/remote data binding, checkboxes, animations, RTL, and accessibility features.012Syncfusion React Mapssyncfusion/react-ui-components-skillsImplement Syncfusion React Maps component for geographical data visualization. Use this when displaying interactive maps, location-based information, or regional data analysis. This skill covers map providers (Bing, OpenStreetMap), GeoJSON rendering, markers and bubbles, zooming/panning, data labels, legends, and choropleth visualizations in React applications.013Syncfusion React Markdown Convertersyncfusion/react-ui-components-skillsImplement the Syncfusion Markdown Converter in React to convert Markdown text into clean HTML. Use this when converting Markdown to HTML in React, integrating a live Markdown preview with the Rich Text Editor in Markdown mode, configuring GFM or line break options, or working with MarkdownConverter.toHtml() and MarkdownConverterOptions. This skill covers the @syncfusion/ej2-markdown-converter package and Markdown Editor integration with HTML preview in React applications.05Syncfusion React Menusyncfusion/react-ui-components-skills|013Syncfusion React Notificationssyncfusion/react-ui-components-skillsComprehensive guide for implementing Syncfusion React Notification components including Badge, Message, Skeleton, Toast, and Spinner. Use this when applying status indicators and badges with color variants and shapes; showing informational, success, warning, or error messages; configuring severity levels and display variants (Text, Outlined, Filled); handling message dismissal; toast positioning, toast templates, toast animations; displaying skeleton loading placeholders with shimmer animations (Wave, Pulse, Fade) and shapes (Circle, Rectangle, Text); or customizing notification appearance and accessibility.032Syncfusion React Pivot Tablesyncfusion/react-ui-components-skillsUse this skill when users ask how to build or customize Syncfusion PivotView pivot tables in React. Trigger for React pivot grid/OLAP, aggregation, data binding (JSON/remote), drill-down/drill-through, grouping, filtering, conditional formatting, exports (Excel/PDF/CSV), or pivot charts. React-only, not Angular/Vue/Blazor.038Syncfusion React Popupssyncfusion/react-ui-components-skillsComprehensive guide for implementing Syncfusion React popup components including Dialog, ToolTip. Use this when building modal/modeless dialogs, confirmation popups, forms in dialogs, draggable windows, popovers, tooltips, and overlaid content with custom positioning, animations, WCAG 2.2 accessibility, forms integration, and event handling in React applications.026Syncfusion React Progress Barsyncfusion/react-ui-components-skillsImplement Syncfusion React Progress Bar for visual feedback. Use this skill whenever users need to display progress indicators, loading states, file uploads, data processing, or task completion in React applications. Trigger when user mentions progress bars, loading spinners, progress indicators, determinate/indeterminate states, circular/linear progress, or any progress visualization scenario.07Syncfusion React Query Buildersyncfusion/react-ui-components-skillsComprehensive guide to implementing Syncfusion React Query Builder component. Use this skill when building advanced filter interfaces, creating complex data query systems, or implementing dynamic rule-based filtering. This skill covers query builder configuration, SQL query conversion, drag-and-drop filtering, customization, and state management.09Syncfusion React Range Navigatorsyncfusion/react-ui-components-skillsImplements the Syncfusion React Range Navigator component for scrolling and navigating through data with range selection. Use this when users need time-based navigation, financial data visualization, or chart integration with a range selector control. Supports numeric, logarithmic, and DateTime data binding, multiple series types, period selector, lightweight mode, tooltips, RTL, and export/print functionality.014Syncfusion React Ribbonsyncfusion/react-ui-components-skillsImplement the Syncfusion React Ribbon component. Use this skill for creating Ribbon UIs with tabs, groups, items, Classic or Simplified layouts, file menu and backstage view, contextual tabs, galleries, KeyTips, accessibility, theming, responsive behavior, customization, and troubleshooting in React.012Syncfusion React Rich Text Editorsyncfusion/react-ui-components-skillsImplements the Syncfusion React Rich Text Editor (RichTextEditorComponent) from ej2-react-richtexteditor, supporting HTML (WYSIWYG) and Markdown editing. Use this skill for toolbar configuration, image/video/audio insertion, paste cleanup, AI assistant integration, emoji picker, slash menu, mentions, import/export Word/PDF, form validation, and source code view in React applications.020Syncfusion React Sankeysyncfusion/react-ui-components-skillsImplement Syncfusion React Sankey Chart to visualize energy flows, process dependencies, and hierarchical relationships between nodes. Use this skill when creating Sankey diagrams, flow visualizations, or node-link networks. Covers installation, nodes and links configuration, labeling, legends, tooltips, events, appearance customization, RTL support, accessibility, and export features.013Syncfusion React Schedulersyncfusion/react-ui-components-skillsImplement Syncfusion React Scheduler component for calendar, event scheduling, and appointment management. Use this when building scheduling systems, calendar applications, booking systems, or time management interfaces. Covers all scheduler views (Day, Week, Month, Timeline, Agenda, Year), data binding, resource scheduling, recurring events, CRUD operations, drag-and-drop scheduling, customization, accessibility, and advanced features.020Syncfusion React Sidebarsyncfusion/react-ui-components-skillsImplement responsive Syncfusion React Sidebar component for navigation layouts. Use this when building responsive navigation menus, drawer layouts, or collapsible sidebars with various display modes (Over, Push, Slide). This skill covers sidebar configuration, animations, backdrop overlays, keyboard accessibility, and integration with multi-level navigation systems.011Syncfusion React Smithchartsyncfusion/react-ui-components-skillsImplements and customizes the Syncfusion React Smith Chart component for transmission line and RF circuit visualization. Use this when users need Smith Charts for impedance matching, RF design, or telecommunications data visualization. Covers series configuration, axis customization, markers, data labels, legend, tooltip, print/export, and accessibility features.011Syncfusion React Sparklinesyncfusion/react-ui-components-skillsImplement Syncfusion React Sparkline components for compact, inline data visualization. Use this when working with sparklines, mini charts, or trend indicators in constrained spaces. This skill covers all 5 sparkline types (line, column, area, win-loss, pie), tooltips, markers, data labels, range bands, axis customization, and themes. Ideal for displaying data trends within grids, dashboards, or tables without full-sized charts.010
Skills, installed in one click
Start building freePut a skill to work
Open any project, search the Skills panel in the chat, and the agent picks it up from there.