@mobilon-dev/chotto 0.3.4 → 0.3.6

package/dist/types/components/3_compounds/SideBar/styles/types.d.ts

@@ -0,0 +1,279 @@
+/**
+ * CSS переменные для компонента SideBar
+ */
+export interface SideBarThemeCSSVariables {
+    /** Отступы контейнера */
+    '--chotto-sidebar-padding-container': string;
+    /** Промежуток между строками списка */
+    '--chotto-sidebar-row-gap-list': string;
+    /** Граница активного изображения */
+    '--chotto-sidebar-image-active-border': string;
+    /** Граница сверху фиксированного списка */
+    '--chotto-sidebar-list-fixed-border-top': string;
+    /** Граница снизу фиксированного списка */
+    '--chotto-sidebar-list-fixed-border-bottom': string;
+    /** Высота счетчика уведомлений */
+    '--chotto-sidebar-notification-count-height': string;
+    /** Радиус наведения */
+    '--chotto-sidebar-hover-radius': string;
+    /** Отображение контейнера */
+    '--chotto-sidebar-container-display': string;
+    /** Направление флекс-контейнера */
+    '--chotto-sidebar-container-flex-direction': string;
+    /** Высота контейнера */
+    '--chotto-sidebar-container-height': string;
+    /** Цвет фона контейнера */
+    '--chotto-sidebar-container-background-color': string;
+    /** Позиционирование контейнера */
+    '--chotto-sidebar-container-position': string;
+    /** Переполнение контейнера */
+    '--chotto-sidebar-container-overflow': string;
+    /** Коэффициент роста контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-flex': string;
+    /** Переполнение по вертикали контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-overflow-y': string;
+    /** Переполнение по горизонтали контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-overflow-x': string;
+    /** Отступ снизу контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-padding-bottom': string;
+    /** Ширина скроллбара контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-scrollbar-width': string;
+    /** Стиль переполнения MS контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-ms-overflow-style': string;
+    /** Отображение webkit скроллбара контейнера прокрутки */
+    '--chotto-sidebar-scroll-container-webkit-scrollbar-display': string;
+    /** Позиционирование фиксированного списка */
+    '--chotto-sidebar-list-fixed-position': string;
+    /** Позиция фиксированного списка сверху */
+    '--chotto-sidebar-list-fixed-top': string;
+    /** Z-index фиксированного списка */
+    '--chotto-sidebar-list-fixed-z-index': string;
+    /** Фон расширенной первой колонки лэйаута */
+    '--chotto-sidebar-layout-extended-first-col-bg': string;
+    /** Отступы фиксированного списка */
+    '--chotto-sidebar-list-fixed-padding': string;
+    /** Отступ снизу фиксированного списка */
+    '--chotto-sidebar-list-fixed-margin-bottom': string;
+    /** Отображение фиксированного списка */
+    '--chotto-sidebar-list-fixed-display': string;
+    /** Направление флекс-контейнера фиксированного списка */
+    '--chotto-sidebar-list-fixed-flex-direction': string;
+    /** Содержимое псевдоэлемента after фиксированного списка */
+    '--chotto-sidebar-list-fixed-after-content': string;
+    /** Позиционирование псевдоэлемента after фиксированного списка */
+    '--chotto-sidebar-list-fixed-after-position': string;
+    /** Позиция псевдоэлемента after фиксированного списка снизу */
+    '--chotto-sidebar-list-fixed-after-bottom': string;
+    /** Позиция псевдоэлемента after фиксированного списка слева */
+    '--chotto-sidebar-list-fixed-after-left': string;
+    /** Трансформация псевдоэлемента after фиксированного списка */
+    '--chotto-sidebar-list-fixed-after-transform': string;
+    /** Ширина псевдоэлемента after фиксированного списка */
+    '--chotto-sidebar-list-fixed-after-width': string;
+    /** Ширина границы снизу фиксированного списка */
+    '--chotto-sidebar-list-fixed-border-bottom-width': string;
+    /** Цвет границы снизу фиксированного списка */
+    '--chotto-sidebar-list-fixed-border-bottom-color': string;
+    /** Отображение границы снизу фиксированного списка */
+    '--chotto-sidebar-list-fixed-border-bottom-display': string;
+    /** Отображение списка */
+    '--chotto-sidebar-list-display': string;
+    /** Направление флекс-контейнера списка */
+    '--chotto-sidebar-list-flex-direction': string;
+    /** Отступы списка */
+    '--chotto-sidebar-list-padding': string;
+    /** Z-index списка */
+    '--chotto-sidebar-list-z-index': string;
+    /** Позиционирование элемента */
+    '--chotto-sidebar-item-position': string;
+    /** Курсор элемента */
+    '--chotto-sidebar-item-cursor': string;
+    /** Отображение элемента */
+    '--chotto-sidebar-item-display': string;
+    /** Направление флекс-контейнера элемента */
+    '--chotto-sidebar-item-flex-direction': string;
+    /** Промежуток между строками элемента */
+    '--chotto-sidebar-item-row-gap': string;
+    /** Выравнивание по поперечной оси элемента */
+    '--chotto-sidebar-item-align-items': string;
+    /** Цвет фона элемента */
+    '--chotto-sidebar-item-background-color': string;
+    /** Радиус границы элемента */
+    '--chotto-sidebar-item-border-radius': string;
+    /** Содержимое псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-content': string;
+    /** Позиционирование псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-position': string;
+    /** Ширина псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-width': string;
+    /** Высота псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-height': string;
+    /** Цвет фона псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-background-color': string;
+    /** Позиция псевдоэлемента before элемента сверху */
+    '--chotto-sidebar-item-before-top': string;
+    /** Позиция псевдоэлемента before элемента слева */
+    '--chotto-sidebar-item-before-left': string;
+    /** Трансформация псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-transform': string;
+    /** Z-index псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-z-index': string;
+    /** Переход псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-transition': string;
+    /** События указателя псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-pointer-events': string;
+    /** Цвет фона hover псевдоэлемента before элемента */
+    '--chotto-sidebar-item-before-background-color-hover': string;
+    /** Цвет текста бейджа непрочитанных */
+    '--chotto-sidebar-unread-text-color': string;
+    /** Цвет фона бейджа непрочитанных */
+    '--chotto-sidebar-unread-background-color': string;
+    /** Позиционирование span элемента */
+    '--chotto-sidebar-item-span-position': string;
+    /** Позиция span элемента сверху */
+    '--chotto-sidebar-item-span-top': string;
+    /** Позиция span элемента справа */
+    '--chotto-sidebar-item-span-right': string;
+    /** Отображение span элемента */
+    '--chotto-sidebar-item-span-display': string;
+    /** Выравнивание по главной оси span элемента */
+    '--chotto-sidebar-item-span-justify-content': string;
+    /** Выравнивание по поперечной оси span элемента */
+    '--chotto-sidebar-item-span-align-items': string;
+    /** Отступы span элемента */
+    '--chotto-sidebar-item-span-padding': string;
+    /** Максимальная ширина span элемента */
+    '--chotto-sidebar-item-span-max-width': string;
+    /** Минимальная ширина span элемента */
+    '--chotto-sidebar-item-span-min-width': string;
+    /** Радиус границы span элемента */
+    '--chotto-sidebar-item-span-border-radius': string;
+    /** Высота строки span элемента */
+    '--chotto-sidebar-item-span-line-height': string;
+    /** Z-index span элемента */
+    '--chotto-sidebar-item-span-z-index': string;
+    /** Размер шрифта маленького текста */
+    '--chotto-sidebar-small-text-font-size': string;
+    /** Начертание шрифта маленького текста */
+    '--chotto-sidebar-small-text-font-weight': string;
+    /** Цвет заголовка/подписи элемента */
+    '--chotto-sidebar-header-font-color': string;
+    /** Выравнивание текста параграфа элемента */
+    '--chotto-sidebar-item-p-text-align': string;
+    /** Высота строки параграфа элемента */
+    '--chotto-sidebar-item-p-line-height': string;
+    /** Позиционирование изображения */
+    '--chotto-sidebar-image-position': string;
+    /** Z-index изображения */
+    '--chotto-sidebar-image-z-index': string;
+    /** Радиус границы изображения */
+    '--chotto-sidebar-image-border-radius': string;
+    /** Обрезка изображения */
+    '--chotto-sidebar-image-object-fit': string;
+    /** Переход изображения */
+    '--chotto-sidebar-image-transition': string;
+    /** Прозрачность изображения */
+    '--chotto-sidebar-image-opacity': string;
+    /** Прозрачность активного изображения */
+    '--chotto-sidebar-image-active-opacity': string;
+    /** Позиционирование контейнера настроек */
+    '--chotto-sidebar-settings-container-position': string;
+    /** Позиция контейнера настроек снизу */
+    '--chotto-sidebar-settings-container-bottom': string;
+    /** Позиция контейнера настроек слева */
+    '--chotto-sidebar-settings-container-left': string;
+    /** Позиция контейнера настроек справа */
+    '--chotto-sidebar-settings-container-right': string;
+    /** Отображение контейнера настроек */
+    '--chotto-sidebar-settings-container-display': string;
+    /** Выравнивание по главной оси контейнера настроек */
+    '--chotto-sidebar-settings-container-justify-content': string;
+    /** Z-index контейнера настроек */
+    '--chotto-sidebar-settings-container-z-index': string;
+    /** Цвет фона кнопки настроек */
+    '--chotto-sidebar-settings-btn-background': string;
+    /** Граница кнопки настроек */
+    '--chotto-sidebar-settings-btn-border': string;
+    /** Отступы кнопки настроек */
+    '--chotto-sidebar-settings-btn-padding': string;
+    /** Отступы кнопки настроек */
+    '--chotto-sidebar-settings-btn-margin': string;
+    /** Контур кнопки настроек */
+    '--chotto-sidebar-settings-btn-outline': string;
+    /** Курсор кнопки настроек */
+    '--chotto-sidebar-settings-btn-cursor': string;
+    /** Отображение кнопки настроек */
+    '--chotto-sidebar-settings-btn-display': string;
+    /** Выравнивание по поперечной оси кнопки настроек */
+    '--chotto-sidebar-settings-btn-align-items': string;
+    /** Выравнивание по главной оси кнопки настроек */
+    '--chotto-sidebar-settings-btn-justify-content': string;
+    /** Радиус границы кнопки настроек */
+    '--chotto-sidebar-settings-btn-border-radius': string;
+    /** Переход кнопки настроек */
+    '--chotto-sidebar-settings-btn-transition': string;
+    /** Цвет фона hover кнопки настроек */
+    '--chotto-sidebar-settings-btn-hover-background-color': string;
+    /** Позиционирование выбранной полосы */
+    '--chotto-sidebar-selected-bar-position': string;
+    /** Ширина выбранной полосы */
+    '--chotto-sidebar-selected-bar-width': string;
+    /** Высота выбранной полосы */
+    '--chotto-sidebar-selected-bar-height': string;
+    /** Позиция выбранной полосы слева */
+    '--chotto-sidebar-selected-bar-left': string;
+    /** Позиция выбранной полосы сверху */
+    '--chotto-sidebar-selected-bar-top': string;
+    /** Радиус границы выбранной полосы */
+    '--chotto-sidebar-selected-bar-border-radius': string;
+    /** Цвет фона выбранной полосы */
+    '--chotto-sidebar-selected-bar-background-color': string;
+    /** Z-index выбранной полосы */
+    '--chotto-sidebar-selected-bar-z-index': string;
+    /** Переход выбранной полосы */
+    '--chotto-sidebar-selected-bar-transition': string;
+    /** Направление флекс-контейнера горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-container-flex-direction': string;
+    /** Высота контейнера горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-container-height': string;
+    /** Отступ сверху контейнера горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-container-padding-top': string;
+    /** Отступ снизу контейнера горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-container-padding-bottom': string;
+    /** Цвет фона контейнера горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-container-background-color': string;
+    /** Направление флекс-контейнера списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-flex-direction': string;
+    /** Позиционирование фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-position': string;
+    /** Отступ слева фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-padding-left': string;
+    /** Отступ сверху фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-padding-top': string;
+    /** Граница сверху фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-border-top': string;
+    /** Отступ справа фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-margin-right': string;
+    /** Отступ снизу фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-margin-bottom': string;
+    /** Сжатие фиксированного списка горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-list-fixed-flex-shrink': string;
+    /** Отображение элемента горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-item-display': string;
+    /** Максимальная ширина элемента горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-item-max-width': string;
+    /** Выравнивание текста элемента горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-item-text-align': string;
+    /** Ширина span элемента горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-item-span-width': string;
+    /** Высота span элемента горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-item-span-height': string;
+    /** Позиция span элемента горизонтального сайдбара слева */
+    '--chotto-sidebar-horizontal-item-span-left': string;
+    /** Размер шрифта параграфа элемента горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-item-p-font-size': string;
+    /** Ширина изображения горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-image-width': string;
+    /** Высота изображения горизонтального сайдбара */
+    '--chotto-sidebar-horizontal-image-height': string;
+}

package/dist/types/components/3_compounds/index.d.ts

@@ -0,0 +1,4 @@
+export { default as ChatInput } from './ChatInput/ChatInput.vue';
+export { default as ChatList } from './ChatList/ChatList.vue';
+export { default as Feed } from './Feed/Feed.vue';
+export { default as SideBar } from './SideBar/SideBar.vue';

package/dist/types/components/4_layouts/AdaptiveExtendedLayout/styles/types.d.ts

@@ -0,0 +1,83 @@
+/**
+ * CSS переменные для компонента AdaptiveExtendedLayout
+ */
+export interface AdaptiveExtendedLayoutThemeCSSVariables {
+    /** Высота контейнера адаптивного расширенного макета */
+    '--chotto-adaptiveextendedlayout-container-height': string;
+    /** Отображение контейнера адаптивного расширенного макета */
+    '--chotto-adaptiveextendedlayout-container-display': string;
+    /** Переход контейнера адаптивного расширенного макета */
+    '--chotto-adaptiveextendedlayout-container-transition': string;
+    /** Позиционирование контейнера адаптивного расширенного макета */
+    '--chotto-adaptiveextendedlayout-container-position': string;
+    /** Верхняя граница контейнера адаптивного расширенного макета */
+    '--chotto-adaptiveextendedlayout-container-border-top': string;
+    /** Левая граница контейнера адаптивного расширенного макета */
+    '--chotto-adaptiveextendedlayout-container-border-left': string;
+    /** Колонки сетки контейнера адаптивного расширенного макета для десктопа */
+    '--chotto-adaptiveextendedlayout-container-desktop-grid-template-columns': string;
+    /** Колонки сетки контейнера адаптивного расширенного макета для планшета */
+    '--chotto-adaptiveextendedlayout-container-tablet-grid-template-columns': string;
+    /** Колонки сетки контейнера адаптивного расширенного макета для мобильных устройств */
+    '--chotto-adaptiveextendedlayout-container-mobile-grid-template-columns': string;
+    /** Позиционирование первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-position': string;
+    /** Колонка сетки первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-grid-column': string;
+    /** Отображение первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-display': string;
+    /** Направление флекс-элементов первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-flex-direction': string;
+    /** Высота первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-height': string;
+    /** Правая граница первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-border-right': string;
+    /** Нижняя граница первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-border-bottom': string;
+    /** Цвет фона первой колонки */
+    '--chotto-adaptiveextendedlayout-first-col-background-color': string;
+    /** Отображение первой колонки на мобильных устройствах */
+    '--chotto-adaptiveextendedlayout-first-col-mobile-display': string;
+    /** Позиционирование второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-position': string;
+    /** Колонка сетки второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-grid-column': string;
+    /** Отображение второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-display': string;
+    /** Направление флекс-элементов второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-flex-direction': string;
+    /** Высота второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-height': string;
+    /** Переполнение второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-overflow': string;
+    /** Правая граница второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-border-right': string;
+    /** Нижняя граница второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-border-bottom': string;
+    /** Цвет фона второй колонки */
+    '--chotto-adaptiveextendedlayout-second-col-background-color': string;
+    /** Позиционирование третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-position': string;
+    /** Отображение третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-display': string;
+    /** Направление флекс-элементов третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-flex-direction': string;
+    /** Колонка сетки третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-grid-column': string;
+    /** Высота третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-height': string;
+    /** Правая граница третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-border-right': string;
+    /** Нижняя граница третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-border-bottom': string;
+    /** Цвет фона третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-background-color': string;
+    /** Ширина третьей колонки */
+    '--chotto-adaptiveextendedlayout-third-col-width': string;
+    /** Переход для активного состояния Vue Transition */
+    '--chotto-adaptiveextendedlayout-transition-enter-active-transition': string;
+    /** Непрозрачность для активного состояния Vue Transition */
+    '--chotto-adaptiveextendedlayout-transition-enter-active-opacity': string;
+    /** Непрозрачность для начального состояния Vue Transition */
+    '--chotto-adaptiveextendedlayout-transition-enter-from-opacity': string;
+}

package/dist/types/components/4_layouts/BaseLayout/styles/types.d.ts

@@ -0,0 +1,63 @@
+/**
+ * CSS переменные для компонента BaseLayout
+ */
+export interface BaseLayoutThemeCSSVariables {
+    /** Высота контейнера базового макета */
+    '--chotto-baselayout-container-height': string;
+    /** Ширина контейнера базового макета */
+    '--chotto-baselayout-container-width': string;
+    /** Отображение контейнера базового макета */
+    '--chotto-baselayout-container-display': string;
+    /** Колонки сетки контейнера базового макета */
+    '--chotto-baselayout-container-grid-template-columns': string;
+    /** Переход контейнера базового макета */
+    '--chotto-baselayout-container-transition': string;
+    /** Позиционирование контейнера базового макета */
+    '--chotto-baselayout-container-position': string;
+    /** Верхняя граница контейнера базового макета */
+    '--chotto-baselayout-container-border-top': string;
+    /** Левая граница контейнера базового макета */
+    '--chotto-baselayout-container-border-left': string;
+    /** Позиционирование первой колонки */
+    '--chotto-baselayout-first-col-position': string;
+    /** Колонка сетки первой колонки */
+    '--chotto-baselayout-first-col-grid-column': string;
+    /** Отображение первой колонки */
+    '--chotto-baselayout-first-col-display': string;
+    /** Направление флекс-элементов первой колонки */
+    '--chotto-baselayout-first-col-flex-direction': string;
+    /** Высота первой колонки */
+    '--chotto-baselayout-first-col-height': string;
+    /** Цвет фона первой колонки */
+    '--chotto-baselayout-first-col-background-color': string;
+    /** Правая граница первой колонки */
+    '--chotto-baselayout-first-col-border-right': string;
+    /** Нижняя граница первой колонки */
+    '--chotto-baselayout-first-col-border-bottom': string;
+    /** Ширина первой колонки */
+    '--chotto-baselayout-first-col-width': string;
+    /** Позиционирование второй колонки */
+    '--chotto-baselayout-second-col-position': string;
+    /** Отображение второй колонки */
+    '--chotto-baselayout-second-col-display': string;
+    /** Направление флекс-элементов второй колонки */
+    '--chotto-baselayout-second-col-flex-direction': string;
+    /** Колонка сетки второй колонки */
+    '--chotto-baselayout-second-col-grid-column': string;
+    /** Высота второй колонки */
+    '--chotto-baselayout-second-col-height': string;
+    /** Ширина второй колонки */
+    '--chotto-baselayout-second-col-width': string;
+    /** Цвет фона второй колонки */
+    '--chotto-baselayout-second-col-background-color': string;
+    /** Правая граница второй колонки */
+    '--chotto-baselayout-second-col-border-right': string;
+    /** Нижняя граница второй колонки */
+    '--chotto-baselayout-second-col-border-bottom': string;
+    /** Переход для активного состояния Vue Transition */
+    '--chotto-baselayout-transition-enter-active-transition': string;
+    /** Непрозрачность для активного состояния Vue Transition */
+    '--chotto-baselayout-transition-enter-active-opacity': string;
+    /** Непрозрачность для начального состояния Vue Transition */
+    '--chotto-baselayout-transition-enter-from-opacity': string;
+}

package/dist/types/components/4_layouts/ChatWrapper/styles/types.d.ts

@@ -0,0 +1,43 @@
+/**
+ * CSS переменные для компонента ChatWrapper
+ */
+export interface ChatWrapperThemeCSSVariables {
+    /** Отображение обертки чата */
+    '--chotto-chatwrapper-display': string;
+    /** Высота обертки чата */
+    '--chotto-chatwrapper-height': string;
+    /** Ширина обертки чата */
+    '--chotto-chatwrapper-width': string;
+    /** Выравнивание элементов обертки чата по вертикали */
+    '--chotto-chatwrapper-align-items': string;
+    /** Высота выбранного чата */
+    '--chotto-chatwrapper-selected-chat-height': string;
+    /** Ширина выбранного чата */
+    '--chotto-chatwrapper-selected-chat-width': string;
+    /** Отображение выбранного чата */
+    '--chotto-chatwrapper-selected-chat-display': string;
+    /** Направление флекс-элементов выбранного чата */
+    '--chotto-chatwrapper-selected-chat-flex-direction': string;
+    /** Выравнивание элементов выбранного чата по вертикали */
+    '--chotto-chatwrapper-selected-chat-align-items': string;
+    /** Цвет фона панели чата */
+    '--chotto-chatwrapper-chat-panel-background-color': string;
+    /** Левая граница панели чата */
+    '--chotto-chatwrapper-chat-panel-border-left': string;
+    /** Правая граница панели чата */
+    '--chotto-chatwrapper-chat-panel-border-right': string;
+    /** Радиус границы панели чата */
+    '--chotto-chatwrapper-chat-panel-border-radius': string;
+    /** Позиционирование панели чата */
+    '--chotto-chatwrapper-chat-panel-position': string;
+    /** Высота панели чата */
+    '--chotto-chatwrapper-chat-panel-height': string;
+    /** Z-index панели чата */
+    '--chotto-chatwrapper-chat-panel-z-index': string;
+    /** Ширина панели чата */
+    '--chotto-chatwrapper-chat-panel-width': string;
+    /** Левая позиция панели чата */
+    '--chotto-chatwrapper-chat-panel-left': string;
+    /** Отступы панели чата */
+    '--chotto-chatwrapper-chat-panel-padding': string;
+}

package/dist/types/components/4_layouts/ExtendedLayout/styles/types.d.ts

@@ -0,0 +1,79 @@
+/**
+ * CSS переменные для компонента ExtendedLayout
+ */
+export interface ExtendedLayoutThemeCSSVariables {
+    /** Высота контейнера расширенного макета */
+    '--chotto-extendedlayout-container-height': string;
+    /** Отображение контейнера расширенного макета */
+    '--chotto-extendedlayout-container-display': string;
+    /** Колонки сетки контейнера расширенного макета */
+    '--chotto-extendedlayout-container-grid-template-columns': string;
+    /** Переход контейнера расширенного макета */
+    '--chotto-extendedlayout-container-transition': string;
+    /** Позиционирование контейнера расширенного макета */
+    '--chotto-extendedlayout-container-position': string;
+    /** Верхняя граница контейнера расширенного макета */
+    '--chotto-extendedlayout-container-border-top': string;
+    /** Левая граница контейнера расширенного макета */
+    '--chotto-extendedlayout-container-border-left': string;
+    /** Позиционирование первой колонки */
+    '--chotto-extendedlayout-first-col-position': string;
+    /** Колонка сетки первой колонки */
+    '--chotto-extendedlayout-first-col-grid-column': string;
+    /** Отображение первой колонки */
+    '--chotto-extendedlayout-first-col-display': string;
+    /** Направление флекс-элементов первой колонки */
+    '--chotto-extendedlayout-first-col-flex-direction': string;
+    /** Высота первой колонки */
+    '--chotto-extendedlayout-first-col-height': string;
+    /** Ширина первой колонки */
+    '--chotto-extendedlayout-first-col-width': string;
+    /** Правая граница первой колонки */
+    '--chotto-extendedlayout-first-col-border-right': string;
+    /** Нижняя граница первой колонки */
+    '--chotto-extendedlayout-first-col-border-bottom': string;
+    /** Цвет фона первой колонки */
+    '--chotto-extendedlayout-first-col-background-color': string;
+    /** Позиционирование второй колонки */
+    '--chotto-extendedlayout-second-col-position': string;
+    /** Колонка сетки второй колонки */
+    '--chotto-extendedlayout-second-col-grid-column': string;
+    /** Отображение второй колонки */
+    '--chotto-extendedlayout-second-col-display': string;
+    /** Направление флекс-элементов второй колонки */
+    '--chotto-extendedlayout-second-col-flex-direction': string;
+    /** Высота второй колонки */
+    '--chotto-extendedlayout-second-col-height': string;
+    /** Ширина второй колонки */
+    '--chotto-extendedlayout-second-col-width': string;
+    /** Переполнение второй колонки */
+    '--chotto-extendedlayout-second-col-overflow': string;
+    /** Правая граница второй колонки */
+    '--chotto-extendedlayout-second-col-border-right': string;
+    /** Нижняя граница второй колонки */
+    '--chotto-extendedlayout-second-col-border-bottom': string;
+    /** Цвет фона второй колонки */
+    '--chotto-extendedlayout-second-col-background-color': string;
+    /** Позиционирование третьей колонки */
+    '--chotto-extendedlayout-third-col-position': string;
+    /** Отображение третьей колонки */
+    '--chotto-extendedlayout-third-col-display': string;
+    /** Направление флекс-элементов третьей колонки */
+    '--chotto-extendedlayout-third-col-flex-direction': string;
+    /** Колонка сетки третьей колонки */
+    '--chotto-extendedlayout-third-col-grid-column': string;
+    /** Высота третьей колонки */
+    '--chotto-extendedlayout-third-col-height': string;
+    /** Правая граница третьей колонки */
+    '--chotto-extendedlayout-third-col-border-right': string;
+    /** Нижняя граница третьей колонки */
+    '--chotto-extendedlayout-third-col-border-bottom': string;
+    /** Цвет фона третьей колонки */
+    '--chotto-extendedlayout-third-col-background-color': string;
+    /** Переход для активного состояния Vue Transition */
+    '--chotto-extendedlayout-transition-enter-active-transition': string;
+    /** Непрозрачность для активного состояния Vue Transition */
+    '--chotto-extendedlayout-transition-enter-active-opacity': string;
+    /** Непрозрачность для начального состояния Vue Transition */
+    '--chotto-extendedlayout-transition-enter-from-opacity': string;
+}

package/dist/types/components/4_layouts/FeedLayout/styles/types.d.ts

@@ -0,0 +1,33 @@
+/**
+ * CSS переменные для компонента FeedLayout
+ */
+export interface FeedLayoutThemeCSSVariables {
+    /** Высота контейнера макета ленты */
+    '--chotto-feedlayout-container-height': string;
+    /** Отображение контейнера макета ленты */
+    '--chotto-feedlayout-container-display': string;
+    /** Колонки сетки контейнера макета ленты */
+    '--chotto-feedlayout-container-grid-template-columns': string;
+    /** Переход контейнера макета ленты */
+    '--chotto-feedlayout-container-transition': string;
+    /** Позиционирование контейнера макета ленты */
+    '--chotto-feedlayout-container-position': string;
+    /** Позиционирование первой колонки */
+    '--chotto-feedlayout-first-col-position': string;
+    /** Колонка сетки первой колонки */
+    '--chotto-feedlayout-first-col-grid-column': string;
+    /** Отображение первой колонки */
+    '--chotto-feedlayout-first-col-display': string;
+    /** Направление флекс-элементов первой колонки */
+    '--chotto-feedlayout-first-col-flex-direction': string;
+    /** Высота первой колонки */
+    '--chotto-feedlayout-first-col-height': string;
+    /** Цвет фона первой колонки */
+    '--chotto-feedlayout-first-col-background-color': string;
+    /** Переход для активного состояния Vue Transition */
+    '--chotto-feedlayout-transition-enter-active-transition': string;
+    /** Непрозрачность для активного состояния Vue Transition */
+    '--chotto-feedlayout-transition-enter-active-opacity': string;
+    /** Непрозрачность для начального состояния Vue Transition */
+    '--chotto-feedlayout-transition-enter-from-opacity': string;
+}

package/dist/types/components/5_containers/BaseContainer/styles/types.d.ts

@@ -0,0 +1,39 @@
+/**
+ * CSS переменные для компонента BaseContainer
+ */
+export interface BaseContainerThemeCSSVariables {
+    /** Переход базового контейнера */
+    '--chotto-basecontainer-base-container-transition': string;
+    /** Жирность шрифта базового контейнера */
+    '--chotto-basecontainer-base-container-font-weight': string;
+    /** Цвет базового контейнера */
+    '--chotto-basecontainer-base-container-color': string;
+    /** Семейство шрифтов базового контейнера */
+    '--chotto-basecontainer-base-container-font-family': string;
+    /** Контейнерный запрос базового контейнера */
+    '--chotto-basecontainer-base-container-container': string;
+    /** Минимальная ширина базового контейнера */
+    '--chotto-basecontainer-base-container-min-width': string;
+    /** Размер коробки глобальных стилей */
+    '--chotto-basecontainer-global-box-sizing': string;
+    /** Отступы body глобальных стилей */
+    '--chotto-basecontainer-global-body-margin': string;
+    /** Отступы ul глобальных стилей */
+    '--chotto-basecontainer-global-ul-margin': string;
+    /** Отступы ul глобальных стилей */
+    '--chotto-basecontainer-global-ul-padding': string;
+    /** Тип маркера списка ul глобальных стилей */
+    '--chotto-basecontainer-global-ul-list-style-type': string;
+    /** Семейство шрифтов input и button глобальных стилей */
+    '--chotto-basecontainer-global-input-button-font-family': string;
+    /** Отступы p, h1, h2 глобальных стилей */
+    '--chotto-basecontainer-global-p-h1-h2-margin': string;
+    /** Декорация текста ссылок глобальных стилей */
+    '--chotto-basecontainer-global-a-text-decoration': string;
+    /** Переход анимации входа */
+    '--chotto-basecontainer-transition-enter-active-transition': string;
+    /** Прозрачность анимации входа */
+    '--chotto-basecontainer-transition-enter-active-opacity': string;
+    /** Прозрачность анимации выхода */
+    '--chotto-basecontainer-transition-enter-from-opacity': string;
+}