Skip to main content
affpapa.org
RU EN
skill CX Codex

syncfusion-react-buttons — Claude Code skill: how to install

Provides implementation guides for Syncfusion React button components. Helps code assistants wire up styled buttons, toggle actions, and grouped selections.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓ 
npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-buttons -a claude-code
Open on GitHub

What syncfusion-react-buttons does

This skill supplies reference documentation for the @syncfusion/ej2-react-buttons package. It guides coding agents through configuring ButtonComponent, button groups, split buttons, and selection chips. Instructions rely on markdown files inside the references directory to look up attributes and events.

Implementations handle built-in styles such as e-primary or e-outline. Button groups support single or multi-selection states. They also arrange items vertically or horizontally.

Syncfusion packages require manual installation in your repository. Forgetting CSS imports from @syncfusion/ej2-base and the buttons package leaves elements unstyled.

What it helps with

  • Add a styled ButtonComponent with outline or primary visual classes
  • Organize buttons into horizontal or vertical ButtonGroup containers
  • Configure a toggle button with stateful click handlers
  • Implement single or multiple selection inside button groups

Example prompts for the agent

  • Create a primary Syncfusion React button with an e-save icon
  • Assemble a ButtonGroup with single selection for choosing view modes
  • Implement a full-width block button using e-block styling

How to install syncfusion-react-buttons

1Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-buttons -a claude-code

2Manually: put the files in place

~/.claude/skills/syncfusion-react-buttons/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/syncfusion-react-buttons/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about syncfusion-react-buttons

How to install syncfusion-react-buttons in Claude Code?

Run npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-buttons -a claude-code in your terminal. The file is saved to ~/.claude/skills/syncfusion-react-buttons/SKILL.md.

What components does syncfusion-react-buttons cover?

It covers ButtonComponent, ButtonGroup, DropDownButton, SplitButton, Switch, and Chips.

Which dependencies are needed for buttons to render properly?

Install @syncfusion/ej2-react-buttons and import stylesheets from @syncfusion/ej2-base and the button package into your CSS.

Similar skills

All skills for Frontend and UI →
frontend-design official anthropics This skill guides intentional visual design for new interfaces and redesigns. Use it when a generic generated UI is not enough. 1,025,790installs design-taste-frontend Leonxlnx This skill directs the design of public pages and work screens, then checks the result in a browser through screenshots. Use it when an interface feels generic or unfinished. CX Codex +1 678,700installs prototype Matt Pocock Creates throwaway prototypes for checking state logic or exploring UI before committing the decision to the main codebase. 986,201installs hyperframes heygen-com Instructs coding agents on creating, validating, and rendering HTML-based videos using the HyperFrames framework and CLI. CX Codex +1 1,200,000installs hyperframes-cli heygen-com Controls HyperFrames video workflows from the CLI: audits layouts and contrast, edits timeline clips, captures snapshots, and renders locally or in cloud runtimes. CX Codex +1 1,300,000installs webapp-testing official anthropics This skill tests local web apps with Playwright, helping agents debug UI behavior, capture screenshots, and inspect browser logs. 186,758installs

From the same set57

syncfusion-react-dropdown-tree Helps an agent build a Syncfusion React Dropdown Tree for hierarchical selection, checkboxes, and filtering. Useful with local or remote data sources. CX Codex +1 703installs syncfusion-react-inline-ai-assist This skill guides React implementations of Syncfusion Inline AI Assist with AI suggestions, commands, response handling, and service integrations. CX Codex +1 700installs syncfusion-react-ribbon A skill for building Office-style ribbon toolbars in React with Syncfusion: tabs, groups, galleries, backstage view, KeyTips. Use it when an agent needs to scaffold a command-centric UI. CX Codex +1 700installs syncfusion-react-data-manager Guides coding assistants in setting up Syncfusion DataManager for React apps, managing CRUD tasks, and selecting API adaptors safely. CX Codex +1 676installs syncfusion-react-inputs A skill covering Syncfusion input components for React: file uploads, numeric fields, OTP, signatures and sliders. Useful when a form is built on ej2-react-inputs. CX Codex +1 672installs syncfusion-react-dropdowns Implementation guide for Syncfusion React dropdown components. Helps coding assistants configure AutoComplete, remote data sources, and custom filters. CX Codex +1 668installs syncfusion-react-popups A skill that tells your coding agent how to build modal dialogs, tooltips and popovers with Syncfusion React components. CX Codex +1 663installs syncfusion-react-appbar This skill helps build React navigation and action bars with AppBar. Use it for top, bottom, sticky, or responsive headers with controls and sidebars. CX Codex +1 661installs

Project sponsors

Companies that keep this analytics open
Gold sponsor
Nutra.Club

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor