Тарифы

Панель промокода

Поле промокода, которое отвечает сразу: код проверяется на месте, результат объявляется через role="status", старая цена остаётся зачёркнутой рядом с новой.

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

  • тексты eyebrow, title, planName, planCaption и hint
  • цену price, валюту currency и период period
  • массив promos: code, percent и caption каждого промокода

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

Превью

1440pxТема страницы

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

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

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

https://vibeui.ru/c/pricing-016?theme=dark

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

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

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

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

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

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

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

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

Клиентский компонент ("use client"): без состояния поле не проверяет код. Один файл, ноль зависимостей, палитра --vibeui-pricing-016-*, светлая база. Результат проверки объявляется через role="status", а не только подкрашивается зелёным и красным: цвет один не доходит до скринридера и до дальтоника. Ошибочный код не стирается — его оставляют, чтобы человек увидел опечатку. Введённый код приводится к верхнему регистру только при сравнении, а поле отображает его через text-transform. Старая цена размечена как <s>.

Теги

  • pricing
  • promo
  • discount
  • client
Исходник компонента

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

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