skill CX Codex

syncfusion-react-inline-ai-assist — Claude Code skill

Q: How do I install syncfusion-react-inline-ai-assist in Claude Code?

Run `npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a claude-code`, then use `~/.claude/skills/syncfusion-react-inline-ai-assist/SKILL.md`.

This skill guides React implementations of Syncfusion Inline AI Assist with AI suggestions, commands, response handling, and service integrations.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a claude-code

Open on GitHub

What syncfusion-react-inline-ai-assist does

This skill guides an agent through building InlineAIAssistComponent with @syncfusion/ej2-react-interactive-chat. It covers prompt suggestions, progressive output, predefined commands, response actions, editor and response templates, and inline or popup presentation.

The material also covers lifecycle events, public methods, prompt history, themes, localization, and right-to-left layouts. Integration sections address OpenAI, Google Gemini, Lite-LLM, and Ollama, including the enableStreaming option. Voice input relies on the browser Web Speech API through speechToTextSettings, so that API affects whether speech controls work.

The skill is aimed at React projects and includes patterns for promptRequest, addResponse(), and executePrompt(). Connecting an external AI provider requires that provider’s credentials.

What it helps with

add AI suggestions to a React interface
connect OpenAI, Gemini, Lite-LLM, or Ollama
configure prompt commands and response actions
turn on streamed output and speech input

Example prompts for the agent

Add InlineAIAssistComponent from @syncfusion/ej2-react-interactive-chat to the React app and wire its promptRequest handler.
Configure speechToTextSettings with interim transcript updates for voice prompts.
Connect Ollama and enable enableStreaming for generated responses.

How to install syncfusion-react-inline-ai-assist

1Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a claude-code

2Manually: put the files in place

~/.claude/skills/syncfusion-react-inline-ai-assist/SKILL.md

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

1Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a codex

2Manually: put the files in place

.agents/skills/syncfusion-react-inline-ai-assist/SKILL.md

For all projects use ~/.agents/skills/

1Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a cursor

2Manually: put the files in place

.cursor/skills/syncfusion-react-inline-ai-assist/SKILL.md

Cursor also reads .agents/skills/ and .claude/skills/

1GitHub CLI

gh skill install syncfusion/react-ui-components-skills syncfusion-react-inline-ai-assist

2Manually: put the files in place

.github/skills/syncfusion-react-inline-ai-assist/SKILL.md

1Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a gemini-cli

2Platform CLI

gemini skills install https://github.com/syncfusion/react-ui-components-skills --path skills/syncfusion-react-inline-ai-assist

Manually: put the files in place

.devin/skills/syncfusion-react-inline-ai-assist/SKILL.md

The legacy .windsurf/skills/ path still works

Skills CLI (Vercel)

npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a opencode

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

Questions about syncfusion-react-inline-ai-assist

How do I install syncfusion-react-inline-ai-assist in Claude Code?

Run npx skills add syncfusion/react-ui-components-skills --skill syncfusion-react-inline-ai-assist -a claude-code, then use ~/.claude/skills/syncfusion-react-inline-ai-assist/SKILL.md.

What does syncfusion-react-inline-ai-assist do?

It guides React work with Syncfusion Inline AI Assist, covering AI providers, prompts, commands, response controls, templates, events, and streamed output.

Which AI services can it connect to?

The skill covers OpenAI, Google Gemini, Lite-LLM, and Ollama. It also addresses provider credentials and streamed responses.

Similar skills

All skills for Frontend and UI →

emblem-ai-react EmblemAI A skill for building a React app with EmblemAI authentication and wallet-enabled accounts. It covers providers, hooks and ready-made login and chat components. CX Codex +1 8,800installs vercel-react-view-transitions vercel A skill that walks your agent through native view transitions in React: page changes, shared elements, enter and exit animations without third-party libraries. CX Codex +1 168,100installs gsap-react greensock This skill guides GSAP animation work in React and Next.js, including scoped selectors, cleanup, and client-only execution. CX Codex +1 66,900installs stitch::react-components official google-labs-code Turns Stitch designs into modular Vite and React components. Can also sync existing components with updated Stitch designs. CX Codex +1 50,400installs clerk-react-patterns clerk Provides authentication patterns for React single-page apps using @clerk/react in Vite and CRA. It helps implement route guards, session hooks, and custom forms. CX Codex +1 19,700installs react-doctor millionco Audits React codebases for architecture, accessibility, and rendering issues. Computes a health score from 0 to 100 and helps patch regressions. CX Codex +1 19,200installs

From the same set57

syncfusion-react-blockeditor A skill that walks your agent through the Syncfusion React BlockEditor: block-based content editing with menus, drag-and-drop and Yjs collaboration. CX Codex +1 706installs syncfusion-react-speech-to-text This skill guides React implementations of Syncfusion SpeechToText, including microphone input, transcript events, listening control, and accessible voice forms. CX Codex +1 705installs syncfusion-react-treeview An agent skill for building hierarchical trees with @syncfusion/ej2-react-navigations: node selection, checkboxes, drag-drop, inline editing and templates. CX Codex +1 705installs 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-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-buttons Provides implementation guides for Syncfusion React button components. Helps code assistants wire up styled buttons, toggle actions, and grouped selections. CX Codex +1 675installs 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