AIKraft/Skills/Виджет поддержки Customware

Виджет поддержки Customware

Use this skill when adding, placing, configuring, or fixing the Customware support chat widget in the Customware React Router client-only SPA template. It covers root.tsx/root document script loading, route/layout placement, required org/project ids, bubble versus full mode, optional metadata and style options, page-operation support, and constraints for MITB-style code generation.

customware-ai official Документы

Что делает навык

Настраивает виджет чата поддержки Customware (<customware-chat>) в клиентских SPA-приложениях на React Router. Обеспечивает интеграцию скрипта, размещение компонента в нужных маршрутах и настройку режимов отображения (bubble или full).

Когда применять

  • Добавление точки входа для чата поддержки в клиентский шаблон Customware на React Router.
  • Настройка загрузки скрипта виджета в корневом файле (root.tsx) и его рендеринга в конкретном маршруте.
  • Выбор режима отображения чата: плавающий лаунчер (bubble) или боковая панель/регион (full).
  • Передача метаданных посетителя и параметров стиля через DOM-свойства или атрибуты.

Как работает

  1. Загрузить скрипт виджета в root.tsx или эквивалентном корневом файле/компоненте, где определена структура HTML-документа.
  2. Разместить компонент <customware-chat> только в том маршруте (route) или макете (layout), где требуется отображение чата.
  3. Настроить режим отображения: использовать chat-bubble для плавающего окна или full для боковой панели/региона.
  4. При необходимости передать метаданные посетителя через свойство meta DOM или настроить стили через styleOptions/style-options.

Примеры запросов агенту

Добавь виджет поддержки Customware в мой SPA на React Router, чтобы он открывался как плавающая кнопка.
Настрой чат Customware в режиме полной панели (full) на странице настроек профиля.
Инициализируй скрипт виджета в root.tsx и выведи <customware-chat> в корневом лейауте с метаданными пользователя.

Что понадобится

  • Клиентский SPA-шаблон Customware на React Router (только на стороне клиента).
  • Файл root.tsx или эквивалентный корневой компонент для загрузки скрипта.
  • Доступ к документации references/component-usage.md для примеров кода и типов JSX.

Описание составлено по SKILL.md навыка, сверено 05.10.2026.

Как подключить

1Скачать навык
# возьмите папку навыка «customware-support-widget» из репозитория: # https://github.com/customware-ai/skills
2Положить папку с SKILL.md к навыкам ассистента
# положите папку навыка туда, где ассистент ищет skills: cp -r customware-support-widget/ ~/.claude/skills/customware-support-widget/

Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.