VibeUI
РусEng
Войти

Вопросы и ответы

Вопросы с обращением в поддержку

Вопросы с карточкой «не нашли ответ» рядом со списком, а не после него: на широкой раскладке карточка залипает, и до контактов не нужно долистывать.

React + Tailwind, совместим с shadcn: нажмите «Копировать для ИИ» — агент в Cursor или Claude Code поставит его через shadcn CLI.

Что можно поменять

  • title — заголовок списка вопросов
  • массив items — вопросы и ответы
  • helpTitle и helpText — заголовок и текст карточки помощи

Собран из

Команда установки поставит и эти компоненты. Блок задаёт им только пропсы: их палитра и поведение — свои.

Ссылка для ИИ-агента: в ней превью, код и инструкция.

Превью

1440pxТема страницы
Вопросы с обращением в поддержку — Вопросы с карточкой «не нашли ответ» рядом со списком, а не после него: на широкой раскладке карточка залипает, и до контактов не нужно долистывать.

Использовать с ИИ

  1. 1. Скопируйте ссылку.
  2. 2. Напишите агенту своими словами и вставьте её в предложение.
  3. 3. Агент откроет ссылку и поставит компонент из реестра.
AI
1Выбрали здесь

добавь это на главную первым экраном:

https://vibeui.ru/c/faq-006?theme=dark

2Вставили в чат агента
3Получили в проекте

Не знаете, куда вставить? Пошаговый гайд

Показать полную инструкцию

То, что лежит по ссылке в развёрнутом виде. Нужна, если агент не может открыть ссылку — тогда вставьте этот текст целиком.

Загружается…

Как использовать

<Faq006
  title="Частые вопросы о работе сервиса"
  helpTitle="Не нашли ответ?"
  channels={[{ label: "Написать в поддержку", detail: "Отвечаем за 15 минут", href: "/support" }]}
/>

Пример вызова. Сам компонент агент ставит из реестра по ссылке «Копировать для ИИ».

Настройки

Заголовок карточки
helpTitle · по умолчанию: Не нашли ответ?
Заголовок списка
title · по умолчанию: Частые вопросы о работе сервиса
Значок
marker · по умолчанию: chevron
Акцент
accent · по умолчанию: цвет темы
Фон
background · по умолчанию: цвет темы

Ещё в разделе «Вопросы и ответы»

Частые вопросы

Как установить компонент «Вопросы с обращением в поддержку» через Cursor или Claude Code?
Нажмите «Копировать для ИИ» на этой странице и вставьте текст в чат агента. В инструкции команда установки через shadcn CLI, зависимости и что сохранить — агент поставит именно этот компонент, а не перерисует похожий.
Какие зависимости у компонента «Вопросы с обращением в поддержку»?
Никаких npm-пакетов, кроме React и Tailwind CSS. Вместе с ним ставятся компоненты каталога: accordion-001, card-024, item-004, heading-001.
Что можно поменять в компоненте «Вопросы с обращением в поддержку»?
Можно менять: title — заголовок списка вопросов; массив items — вопросы и ответы; helpTitle и helpText — заголовок и текст карточки помощи. Сохранить как есть: импорты accordion-001, card-024, item-004, heading-001 из @/components/vibeui/ — не встраивать их код в блок и не заменять своими; частям уходят только пропсы; локальную палитру --vibeui-faq-006-* и не подменять её токенами вашей темы; карточку помощи рядом со списком, а не под ним: тот, кто не нашёл вопрос, бросает список посередине.
Компонент «Вопросы с обращением в поддержку» бесплатный?
Да. Превью открыто без регистрации, а с бесплатным аккаунтом можно скопировать до 20 компонентов в месяц.

Для разработчика

npx shadcn@latest add https://vibeui.ru/r/pro/faq-006.json

Команде нужна подписанная ссылка: войдите и откройте «Исходник компонента» ниже — там рабочая ссылка на 30 минут. Все способы установки

Технические заметки

Составной блок: импортирует accordion-001, card-024, item-004, heading-001 из @/components/vibeui/ — команда установки приносит их вместе с блоком. Блок владеет раскладкой и своим текстом, частям передаёт только пропсы, их палитры --vibeui-<name>-* не трогает. Блок самодостаточен: один файл, без npm-зависимостей, собственная палитра в локальных переменных --vibeui-faq-006-*. Серверный компонент, раскрытие держат нативные <details>. Карточка помощи — <aside> с подписью, на широкой раскладке она становится sticky: тот, кто не нашёл свой вопрос, обычно бросает список посередине, и контакты должны быть в поле зрения именно там. Каналы связи оформлены ссылками с пояснением, а не одной кнопкой «Связаться»: пояснение отвечает на вопрос «когда мне ответят» до нажатия.

Теги

  • faq
  • support
  • contact
  • sticky
  • composite
Исходник компонента

Тот же файл, который поставит агент. Нужен, если вы предпочитаете скопировать код руками.

Загружается…