@dxtmisha/wiki 0.39.5 → 0.39.7

package/src/media/mdx/Snackbar/add.ru.mdx

@@ -1,44 +0,0 @@
-## Добавление уведомлений
-
-Основной метод взаимодействия с компонентом `Snackbar` — добавление новых сообщений в очередь.
-
-### Метод add()
-
-Через инстанс компонента (`ref`) доступен объект `data`, предоставляющий метод `add(item: SnackbarValue)`. Параметр `item` определяет конфигурацию и поведение добавляемого уведомления.
-
-```typescript
-snackbar.value?.data.add({
-  data: {
-    label: 'Заголовок уведомления',
-    description: 'Описание происходящего события'
-  }
-})
-```
-
-### Структура SnackbarValue
-
-Объект конфигурации включает следующие свойства:
-
-- **`data`** (`SnackbarItemProps`) — параметры для отображаемого компонента (по умолчанию `SnackbarItem`). Здесь передаются заголовок (`label`), описание (`description`), иконка (`icon`), кнопки действий и прочие визуальные данные.
-- **`component`** (`any`) — позволяет передать пользовательский Vue-компонент для рендеринга вместо стандартного `SnackbarItem`.
-- **`highPriority`** (`boolean`) — при значении `true` уведомление отображается в отдельном приоритетном контейнере (обычно закрепленном сверху или в начале списка).
-- **`delay`** (`number`) — индивидуальное время жизни уведомления в миллисекундах. Если не указано, используется глобальное значение `delay` из настроек `Snackbar`.
-- **`value`** (`string`) — уникальный ключ уведомления. Если не передан, генерируется автоматически. Необходим для ручного удаления сообщения через метод `remove(value)`.
-
-### Использование кастомных компонентов
-
-Для вывода уведомлений с нестандартной версткой можно передать свой компонент через свойство `component`. При этом все свойства, указанные в объекте `data`, будут переданы в ваш компонент как `props`.
-
-```typescript
-import MyAlert from './MyAlert.vue'
-
-snackbar.value?.data.add({
-  component: MyAlert,
-  data: {
-    title: 'Внимание!',
-    message: 'Это сообщение в кастомном стиле'
-  }
-})
-```
-
-Свойство `highPriority` рекомендуется использовать для критических системных уведомлений или ошибок авторизации, чтобы они гарантированно привлекали внимание пользователя и отображались отдельно от общего потока сообщений.

package/src/media/mdx/Snackbar/event.hide.en.mdx

@@ -1,12 +0,0 @@
-### `hide`
-
-The event fires when a notification is hidden from the list.
-
-**When triggered:**
-- The notification display time has expired (automatic hiding)
-- The user or program initiated the removal of the notification
-- The notification list has been cleared
-
-**Arguments:**
-- `value`: `string` — Unique identifier of the notification
-- `item`: `SnackbarValue` — Notification data object

package/src/media/mdx/Snackbar/event.hide.ru.mdx

@@ -1,12 +0,0 @@
-### `hide`
-
-Событие срабатывает при скрытии уведомления из списка.
-
-**Когда срабатывает:**
-- Время отображения уведомления истекло (автоматическое скрытие)
-- Пользователь или программа инициировали удаление уведомления
-- Список уведомлений был очищен
-
-**Параметры:**
-- `value`: `string` — Уникальный идентификатор уведомления
-- `item`: `SnackbarValue` — Объект данных уведомления

package/src/media/mdx/Snackbar/event.show.en.mdx

@@ -1,11 +0,0 @@
-### `show`
-
-The event fires when a notification is displayed in the list.
-
-**When triggered:**
-- A new notification has been successfully added to the list
-- The notification has become visible to the user
-
-**Arguments:**
-- `value`: `string` — Unique identifier of the notification
-- `item`: `SnackbarValue` — Notification data object

package/src/media/mdx/Snackbar/event.show.ru.mdx

@@ -1,11 +0,0 @@
-### `show`
-
-Событие срабатывает при отображении уведомления в списке.
-
-**Когда срабатывает:**
-- Новое уведомление успешно добавлено в список
-- Уведомление стало видимым пользователю
-
-**Параметры:**
-- `value`: `string` — Уникальный идентификатор уведомления
-- `item`: `SnackbarValue` — Объект данных уведомления

package/src/media/mdx/Snackbar/expose.add.en.mdx

@@ -1 +0,0 @@
-- `add(item: SnackbarValue): void` — Method for adding a new notification to the queue.

package/src/media/mdx/Snackbar/expose.add.ru.mdx

@@ -1 +0,0 @@
-- `add(item: SnackbarValue): void` — Метод для добавления нового уведомления в очередь.

package/src/media/mdx/Snackbar/expose.clear.en.mdx

@@ -1 +0,0 @@
-- `clear(): void` — Method for completely clearing the notification queue.

package/src/media/mdx/Snackbar/expose.clear.ru.mdx

@@ -1 +0,0 @@
-- `clear(): void` — Метод для полной очистки очереди уведомлений.

package/src/media/mdx/Snackbar/expose.isItem.en.mdx

@@ -1 +0,0 @@
-- `isItem: ComputedRef<boolean>` — Computed state indicating whether there are messages in the queue to be displayed.

package/src/media/mdx/Snackbar/expose.isItem.ru.mdx

@@ -1 +0,0 @@
-- `isItem: ComputedRef<boolean>` — Вычисляемое состояние, указывающее, есть ли в очереди сообщения для отображения.

package/src/media/mdx/Snackbar/expose.remove.en.mdx

@@ -1 +0,0 @@
-- `remove(value: string): void` — Method for removing a notification by its identifier.

package/src/media/mdx/Snackbar/expose.remove.ru.mdx

@@ -1 +0,0 @@
-- `remove(value: string): void` — Метод для удаления уведомления по его идентификатору.

package/src/media/mdx/Snackbar/position.en.mdx

@@ -1,10 +0,0 @@
-## Positioning
-
-The `vertical`, `horizontal` and `origin` property group allows for determining the exact position of notifications on the screen and their entrance direction.
-
-**Features:**
-- `vertical` — defines the position along the vertical axis (`top`, `bottom`).
-- `horizontal` — manages the horizontal position of notifications and their width (`right`, `left`, `block`).
-- `origin` — sets the direction from which the notification will slide in (`topToBottom`, `bottomToTop`, `rightToLeft`, `leftToRight`).
-
-> These properties are intended solely for configuring behavior and adaptation for different screen sizes. It is recommended to define these values in the `properties.json` configuration file.

package/src/media/mdx/Snackbar/position.ru.mdx

@@ -1,10 +0,0 @@
-## Позиционирование
-
-Группа свойств `vertical`, `horizontal` и `origin` позволяет определить точное местоположение уведомлений на экране и направление их появления.
-
-**Особенности:**
-- `vertical` — определяет положение по вертикали (`top`, `bottom`).
-- `horizontal` — определяет положение по горизонтали (`right`, `left`, `block`).
-- `origin` — задает направление анимации появления (`topToBottom`, `bottomToTop`, `rightToLeft`, `leftToRight`).
-
-> Данные свойства предназначены исключительно для настройки поведения и адаптации под различные экраны. Рекомендуется задавать эти значения в конфигурационном файле `properties.json`.

package/src/media/mdx/Snackbar/snackbar.en.mdx

@@ -1,46 +0,0 @@
-## Description
-
-A component used to display temporary notifications (snackbars) in various parts of the screen. Snackbars provide brief messages about app processes at the bottom or top of the screen.
-
-Snackbar manages a message queue, automatically hiding notifications after a specified time or upon user interaction.
-
-**Key Features:**
-
-- Flexible positioning (top/bottom, left/right/block)
-- Configurable auto-hide delay (default 8 seconds)
-- Supports different entrance animations based on position
-- Active notification list management
-
-**Typical Usage Scenarios:**
-
-- Confirming user actions (e.g., "File saved erfolgreich")
-- Informing about errors or warnings
-- Real-time system notifications
-
-```html
-<script setup>
-import { ref } from 'vue'
-
-const snackbar = ref(null)
-
-const addMessage = () => {
-  snackbar.value?.data.add({
-    label: 'Notification Title',
-    description: 'Description of the event that occurred in the app.',
-    button: 'Ok'
-  })
-}
-</script>
-
-<template>
-  <Button label="Show Notification" @click="addMessage" />
-
-  <Snackbar
-    ref="snackbar"
-    vertical="bottom"
-    horizontal="right"
-  />
-</template>
-```
-
-> It is recommended to use Snackbar for non-critical information that does not require immediate user action.

package/src/media/mdx/Snackbar/snackbar.ru.mdx

@@ -1,46 +0,0 @@
-## Описание
-
-Компонент для отображения временных уведомлений (снекбаров) в различных частях экрана. Снекбары используются для предоставления кратких сообщений о процессах приложения в нижней или верхней части экрана.
-
-Snackbar управляет очередью сообщений, автоматически скрывая их по истечении заданного времени или при взаимодействии пользователя.
-
-**Основные возможности:**
-
-- Гибкое позиционирование (сверху/снизу, слева/справа/по центру)
-- Настраиваемая задержка автоматического скрытия (по умолчанию 8 секунд)
-- Поддержка различных анимаций появления в зависимости от позиции
-- Управление списком активных уведомлений
-
-**Типичные сценарии использования:**
-
-- Подтверждение действий пользователя (например, "Файл успешно сохранен")
-- Информирование об ошибках или предупреждениях
-- Системные уведомления в реальном времени
-
-```html
-<script setup>
-import { ref } from 'vue'
-
-const snackbar = ref(null)
-
-const addMessage = () => {
-  snackbar.value?.data.add({
-    label: 'Заголовок уведомления',
-    description: 'Описание события, которое произошло в приложении.',
-    button: 'Ок'
-  })
-}
-</script>
-
-<template>
-  <Button label="Показать уведомление" @click="addMessage" />
-
-  <Snackbar
-    ref="snackbar"
-    vertical="bottom"
-    horizontal="right"
-  />
-</template>
-```
-
-> Рекомендуется использовать Snackbar для второстепенной информации, которая не требует немедленного обязательного действия со стороны пользователя.

package/src/media/mdx/Snackbar/wikiMdxSnackbar.ts

@@ -1,73 +0,0 @@
-import type { StorybookComponentsMdxItem } from '../../../types/storybookTypes'
-
-import adaptationEn from './adaptation.en.mdx'
-import adaptationRu from './adaptation.ru.mdx'
-import addEn from './add.en.mdx'
-import addRu from './add.ru.mdx'
-import positionEn from './position.en.mdx'
-import positionRu from './position.ru.mdx'
-import snackbarEn from './snackbar.en.mdx'
-import snackbarRu from './snackbar.ru.mdx'
-import eventShowEn from './event.show.en.mdx'
-import eventShowRu from './event.show.ru.mdx'
-import eventHideEn from './event.hide.en.mdx'
-import eventHideRu from './event.hide.ru.mdx'
-import exposeIsItemEn from './expose.isItem.en.mdx'
-import exposeIsItemRu from './expose.isItem.ru.mdx'
-import exposeAddEn from './expose.add.en.mdx'
-import exposeAddRu from './expose.add.ru.mdx'
-import exposeRemoveEn from './expose.remove.en.mdx'
-import exposeRemoveRu from './expose.remove.ru.mdx'
-import exposeClearEn from './expose.clear.en.mdx'
-import exposeClearRu from './expose.clear.ru.mdx'
-
-/**
- * MDX files for Snackbar component
- *
- * MDX файлы для компонента Snackbar
- */
-export const wikiMdxSnackbar: StorybookComponentsMdxItem = {
-  name: 'Snackbar',
-  descriptions: {
-    'snackbar': {
-      en: snackbarEn,
-      ru: snackbarRu
-    },
-    'adaptation': {
-      en: adaptationEn,
-      ru: adaptationRu
-    },
-    'add': {
-      en: addEn,
-      ru: addRu
-    },
-    'position': {
-      en: positionEn,
-      ru: positionRu
-    },
-    'event.show': {
-      en: eventShowEn,
-      ru: eventShowRu
-    },
-    'event.hide': {
-      en: eventHideEn,
-      ru: eventHideRu
-    },
-    'expose.isItem': {
-      en: exposeIsItemEn,
-      ru: exposeIsItemRu
-    },
-    'expose.add': {
-      en: exposeAddEn,
-      ru: exposeAddRu
-    },
-    'expose.remove': {
-      en: exposeRemoveEn,
-      ru: exposeRemoveRu
-    },
-    'expose.clear': {
-      en: exposeClearEn,
-      ru: exposeClearRu
-    }
-  }
-}

package/src/media/mdx/SnackbarItem/component.en.mdx

@@ -1,9 +0,0 @@
-## Custom Component
-
-The `component` and `componentProps` properties allow you to insert a custom Vue component inside the SnackbarItem. This is useful when the standard fields (label, description) are not enough to display complex content.
-
-**Features:**
-- `component` — accepts a component object or its name.
-- `componentProps` — an object with props that will be passed to the component.
-
-The component is rendered inside a special container with the main content area class, ensuring proper padding and styling.

package/src/media/mdx/SnackbarItem/component.ru.mdx

@@ -1,9 +0,0 @@
-## Кастомный компонент
-
-Свойства `component` и `componentProps` позволяют вставлять пользовательский Vue-компонент внутрь SnackbarItem. Это полезно, когда стандартных полей (label, description) недостаточно для отображения сложного контента.
-
-**Особенности:**
-- `component` — принимает объект компонента или его имя.
-- `componentProps` — объект с входными параметрами, которые будут переданы в компонент.
-
-Компонент рендерится внутри специального контейнера с классом основной области контента, что обеспечивает правильные отступы и стилизацию.

package/src/media/mdx/SnackbarItem/event.close.en.mdx

@@ -1,18 +0,0 @@
-### `close`
-
-The event is triggered when the element is closed (clicking the close button or programmatic closing).
-
-**Parameters:**
-- `value: string | undefined` — element identification (the value of the `value` property)
-
-```html
-<script setup>
-const onClose = (value) => {
-  console.log('Element closed:', value)
-}
-</script>
-
-<template>
-  <SnackbarItem value="item-1" @close="onClose" />
-</template>
-```

package/src/media/mdx/SnackbarItem/event.close.ru.mdx

@@ -1,18 +0,0 @@
-### `close`
-
-Событие срабатывает при закрытии элемента (нажатии на кнопку закрытия или программном закрытии).
-
-**Параметры:**
-- `value: string | undefined` — идентификатор элемента (значение свойства `value`)
-
-```html
-<script setup>
-const onClose = (value) => {
-  console.log('Элемент закрыт:', value)
-}
-</script>
-
-<template>
-  <SnackbarItem value="item-1" @close="onClose" />
-</template>
-```

package/src/media/mdx/SnackbarItem/html.en.mdx

@@ -1,6 +0,0 @@
-## HTML Content
-
-The `html` property allows you to insert arbitrary HTML code directly into the body of the SnackbarItem.
-
-> [!WARNING]
-> Using the `html` property is not recommended. It can be unsafe and may lead to XSS vulnerabilities. Consider using the `component` property or slots for safer and more flexible rendering of complex content.

package/src/media/mdx/SnackbarItem/html.ru.mdx

@@ -1,6 +0,0 @@
-## HTML-контент
-
-Свойство `html` позволяет вставлять произвольный HTML-код непосредственно в тело SnackbarItem.
-
-> [!WARNING]
-> Использование свойства `html` не рекомендуется. Это может быть небезопасно и привести к XSS-уязвимостям. Рассмотрите возможность использования свойства `component` или слотов для более безопасного и гибкого рендеринга сложного содержимого.

package/src/media/mdx/SnackbarItem/role.en.mdx

@@ -1,18 +0,0 @@
-## ARIA Role
-
-The `role` property allows you to override the default ARIA role for the notification element. The default role is `status`.
-
-**When to use:**
- - `status` (default) — used for messages that contain advisory information not requiring immediate action. Assistive technologies (screen readers) will announce such a message when the user is idle.
- - `alert` — use for critical errors or warnings requiring immediate attention. Screen readers will interrupt the current task to announce this notification.
- - `log` — use if notifications represent a sequential log of events.
-
-```html
-<template>
-  <!-- Standard notification -->
-  <SnackbarItem label="Download complete" role="status" />
-
-  <!-- Critical error -->
-  <SnackbarItem label="Connection error!" role="alert" />
-</template>
-```

package/src/media/mdx/SnackbarItem/role.ru.mdx

@@ -1,18 +0,0 @@
-## ARIA роль
-
-Свойство `role` позволяет переопределить стандартную ARIA-роль для элемента уведомления. По умолчанию используется роль `status`.
-
-**Когда использовать:**
- - `status` (по умолчанию) — используйте для сообщений, которые содержат вспомогательную информацию, не требующую немедленного действия. Ассистивные технологии (экранные дикторы) озвучат такое сообщение, когда пользователь будет свободен.
- - `alert` — используйте для критических ошибок или предупреждений, требующих немедленного внимания. Экранные дикторы прервут текущую задачу, чтобы озвучить это уведомление.
- - `log` — используйте, если уведомления представляют собой последовательный лог событий.
-
-```html
-<template>
-  <!-- Стандартное уведомление -->
-  <SnackbarItem label="Загрузка завершена" role="status" />
-
-  <!-- Критическая ошибка -->
-  <SnackbarItem label="Ошибка соединения!" role="alert" />
-</template>
-```

package/src/media/mdx/SnackbarItem/snackbarItem.en.mdx

@@ -1,44 +0,0 @@
-## Description
-
-The component represents an individual notification card inside the `Snackbar`. It is responsible for the visual presentation of a message, including titles, text, icons, and actions.
-
-**Key Features:**
-
-- Displays labels, descriptions, and main text
-- Supports both leading and trailing icons
-- Default close button (cross)
-- Supports an additional action button
-- Flexible configuration via slots for complex content
-
-**Typical Usage Scenarios:**
-
-- Displaying short text messages
-- Notifications with "Undo" or "Retry" buttons
-- Cards with status icons (Success, Error, Info)
-
-```html
-<template>
-  <!-- Basic Usage -->
-  <SnackbarItem
-    label="Message sent successfully"
-    icon="check"
-  />
-
-  <!-- With Action Button -->
-  <SnackbarItem
-    description="Your subscription expires in 3 days."
-    button="Renew"
-    @click="onRenew"
-  />
-
-  <!-- With Custom Content -->
-  <SnackbarItem>
-    <div class="custom-content">
-      <strong>Attention!</strong>
-      <p>An unexpected server error occurred.</p>
-    </div>
-  </SnackbarItem>
-</template>
-```
-
-> SnackbarItem is typically not used on its own but is rendered automatically by the `Snackbar` component based on a provided list of data.

package/src/media/mdx/SnackbarItem/snackbarItem.ru.mdx

@@ -1,44 +0,0 @@
-## Описание
-
-Компонент представляет собой отдельную карточку уведомления внутри `Snackbar`. Он отвечает за визуальное представление сообщения, включая заголовок, текст, иконки и действия.
-
-**Основные возможности:**
-
-- Отображение меток (label), описаний (description) и основного текста
-- Поддержка иконок (начальной и конечной)
-- Кнопка закрытия (крестик) по умолчанию
-- Поддержка дополнительного действия (кнопка)
-- Гибкая настройка через слоты для сложного контента
-
-**Типичные сценарии использования:**
-
-- Отображение короткого текстового сообщения
-- Уведомление с кнопкой "Отмена" или "Повторить"
-- Карточка с иконкой статуса (Success, Error, Info)
-
-```html
-<template>
-  <!-- Базовое использование -->
-  <SnackbarItem
-    label="Сообщение успешно отправлено"
-    icon="check"
-  />
-
-  <!-- С кнопкой действия -->
-  <SnackbarItem
-    description="Ваша подписка истекает через 3 дня."
-    button="Продлить"
-    @click="onRenew"
-  />
-
-  <!-- С пользовательским контентом -->
-  <SnackbarItem>
-    <div class="custom-content">
-      <strong>Внимание!</strong>
-      <p>Произошла непредвиденная ошибка на сервере.</p>
-    </div>
-  </SnackbarItem>
-</template>
-```
-
-> SnackbarItem обычно не используется самостоятельно, а рендерится автоматически компонентом `Snackbar` на основе переданного списка данных.

package/src/media/mdx/SnackbarItem/wikiMdxSnackbarItem.ts

@@ -1,47 +0,0 @@
-import type { StorybookComponentsMdxItem } from '../../../types/storybookTypes'
-
-import snackbarItemEn from './snackbarItem.en.mdx'
-import snackbarItemRu from './snackbarItem.ru.mdx'
-
-import componentEn from './component.en.mdx'
-import componentRu from './component.ru.mdx'
-
-import htmlEn from './html.en.mdx'
-import htmlRu from './html.ru.mdx'
-
-import eventCloseEn from './event.close.en.mdx'
-import eventCloseRu from './event.close.ru.mdx'
-
-import roleEn from './role.en.mdx'
-import roleRu from './role.ru.mdx'
-
-/**
- * MDX files for SnackbarItem component
- *
- * MDX файлы для компонента SnackbarItem
- */
-export const wikiMdxSnackbarItem: StorybookComponentsMdxItem = {
-  name: 'SnackbarItem',
-  descriptions: {
-    snackbarItem: {
-      en: snackbarItemEn,
-      ru: snackbarItemRu
-    },
-    component: {
-      en: componentEn,
-      ru: componentRu
-    },
-    html: {
-      en: htmlEn,
-      ru: htmlRu
-    },
-    eventClose: {
-      en: eventCloseEn,
-      ru: eventCloseRu
-    },
-    role: {
-      en: roleEn,
-      ru: roleRu
-    }
-  }
-}

package/src/media/mdx/TabItem/tabItem.en.mdx

@@ -1,52 +0,0 @@
-A versatile component for creating tabs, menu items, and navigation links with icon and badge support.
-
-TabItem combines the functionality of a button, link, and list item. It supports various states (active, disabled), can display icons to the left and right of the text, and integrates with the Badge component to show notifications or counters. The component automatically manages ARIA attributes to ensure accessibility.
-
-**Key Features:**
-
-- Displaying a label and icons (icon, iconTrailing)
-- Built-in badge support for counters
-- Managing selection state (selected) and activity
-- Navigation support via href (link) or to (router-link)
-- Customizable root tag (button, a, div, li)
-- Ripple effect on click
-- Skeleton support for loading state
-
-**Typical Use Cases:**
-
-- Tabs in navigation bars
-- Dropdown menu items
-- Selection lists (select options)
-- Sidebar navigation menus
-- Links with icons and counters
-
-```html
-<script setup>
-import { ref } from 'vue'
-
-const activeTab = ref('home')
-</script>
-
-<template>
-  <div class="tabs">
-    <TabItem
-      label="Home"
-      icon="home"
-      :selected="activeTab === 'home'"
-      @click="activeTab = 'home'"
-    />
-    <TabItem
-      label="Messages"
-      icon="mail"
-      badge="5"
-      :selected="activeTab === 'messages'"
-      @click="activeTab = 'messages'"
-    />
-    <TabItem
-      label="Settings"
-      icon="settings"
-      disabled
-    />
-  </div>
-</template>
-```