skills.rest
cometchat
cometchatOFFICIAL
Explore all skills by this author →
WebsiteGitHub

cometchat-placement

Guide CometChat placement across routes, modals, drawers, panels, and widgets.

74|2|Updated Apr 3, 2026
Search Tags:#integration#widget#modal#drawer#route#placement#cometchat
One-click install
npx skills add https://github.com/cometchat/cometchat-skills --skill cometchat-placement
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: cometchat-placement
Source: https://github.com/cometchat/cometchat-skills/tree/main/skills/cometchat-placement
Command: npx skills add https://github.com/cometchat/cometchat-skills --skill cometchat-placement

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provide clear, framework-agnostic guidance for integrating CometChat into existing applications by showing where to place chat (route, modal, drawer, embedded panel, or widget) and how to wire it into the app structure for a consistent, scalable experience.

Core Features & Use Cases

  • Framework-agnostic placement guidance across five patterns: route, modal, drawer, embedded panel, and floating widget.
  • Step-by-step integration patterns including provider setup, routing considerations, and UI composition with practical examples.
  • Real-world use cases illustrating how chat can be embedded in pages, opened as a modal, displayed in a drawer, or embedded as a widget.

Quick Start

Select a placement and follow the framework-agnostic steps to integrate CometChat into your app.

Frequently Asked Questions about cometchat-placement

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I integrate CometChat into an existing app using different UI patterns?▼

The best way to integrate CometChat depends on your UX needs, choosing from route-based pages, modals, drawers, embedded panels, or floating widgets. It enforces a structured workflow covering provider setup, routing, navigation, and UI composition.

What steps are required to set up a CometChat provider and routing for a chat widget?▼

CometChat provider setup and routing require a structured workflow that describes navigation and UI composition. The Skill guides you through wiring the chat widget into your app structure with practical examples.

Can I use CometChat placement patterns across both web and mobile projects?▼

Yes, CometChat placement patterns apply to both web and mobile projects. The framework-agnostic guidance covers route-based pages, modals, drawers, embedded panels, and floating widgets for consistent integration.

When should I use a floating chat widget versus an embedded panel for my CometChat integration?▼

Use a CometChat floating widget for non-intrusive chat access, or an embedded panel for persistent inline experiences. The Skill provides real-world use cases to help you choose the right UI composition for your app.

Do I need specific dependencies to follow the CometChat placement integration steps?▼

No, the CometChat placement Skill has no required dependencies. It provides framework-agnostic integration patterns and references framework skill specifics to guide provider setup and UI composition.

Related Skills

Explore More Software Engineering Skills→
cometchatcometchat
74

cometchat-react-patterns

Integrate CometChat React UI Kit into Vite or CRA projects with provider and routing patterns.

Official
Advanced
MAX5271MAX5271

cometchat-placement

Recommend and implement CometChat UI placement patterns for React and framework-agnostic apps.

Community
Intermediate
MAX5271MAX5271

cometchat

Detect app frameworks and generate CometChat integration code.

Community
Advanced
cometchatcometchat
74

cometchat-native-theming

Configure CometChat React Native theming and localization with provider components.

Official
Advanced