Skip to content

UI Kit

Компоненты интерфейса ComUnify. В будущих версиях здесь будут живые компоненты — реальные Vue-элементы встроенные в документацию, которые рендерятся в браузере, адаптируются под размер экрана и автоматически обновляются при изменении дизайна.

Компоненты форм

КомпонентОписание
TextInputТекстовое поле с label, hint, валидацией
TextAreaМногострочное поле
SelectFieldВыпадающий список
SliderInputПолзунок (для кворума и т.д.)
ToggleSwitchПереключатель вкл/выкл
AppButtonКнопка (primary/secondary/danger)
ChipGroupГруппа тегов для выбора интересов

Компоненты отображения

КомпонентОписание
StatCardКарточка со значением и подписью
StatusBadgeБейдж статуса (активен/завершён/черновик)
RoleBadgeБейдж роли (Председатель/Участник)
SectionHeaderЗаголовок секции с действием
EmptyStateПустое состояние (иконка + текст + кнопка)
MemberRowСтрока участника с аватаром
TransactionRowСтрока транзакции (доход/расход)
ProposalCardКарточка предложения
CommunityCardКарточка сообщества
NotificationItemЭлемент уведомления

Layout компоненты

КомпонентОписание
AppLayoutОсновной layout с нижним меню
CommunityLayoutLayout сообщества с боковым меню модулей
AuthLayoutLayout для login/register
BackHeaderЗаголовок с кнопкой «Назад»

Модальные окна

КомпонентОписание
ModalDialogУниверсальный модальный диалог (v-model)
ConfirmModalПодтверждение действия (danger/normal)

Голосование

КомпонентОписание
VoteProgressПрогресс-бар голосования (За/Против/Воздержался)

Живые компоненты

В следующей версии документации каждый компонент будет отображаться как реальный Vue-элемент — не скриншот, а работающий интерактивный компонент с разными состояниями (empty, filled, error, disabled).

ComUnify — открытый конструктор самоуправления