@dxtmisha/wiki 0.39.3 → 0.39.5

package/src/media/mdx/Mask/expose.en.mdx

@@ -0,0 +1,3 @@
+- `value: Ref<string>` — Final formatted mask value.
+- `valueBasic: Ref<string>` — Basic mask value without formatting (only entered characters).
+- `set(value: string): boolean` — Sets new value and reinitializes the mask. Returns `true` if changed.

package/src/media/mdx/Mask/expose.ru.mdx

@@ -0,0 +1,3 @@
+- `value: Ref<string>` — Итоговое отформатированное значение маски.
+- `valueBasic: Ref<string>` — Базовое значение маски без форматирования (только введённые символы).
+- `set(value: string): boolean` — Устанавливает новое значение и переинициализирует маску. Возвращает `true`, если значение было изменено.

package/src/media/mdx/Mask/groupSave.en.mdx

@@ -0,0 +1,26 @@
+## Preserving groups on deletion
+
+The `groupSave` property controls behavior when deleting characters in a mask with multiple types of special characters.
+
+**Possible values:**
+
+- `true` — preserves group separation on deletion (default)
+- `false` — allows characters from different groups to mix on deletion
+
+With `groupSave: true` and different groups ahead, the character is not physically deleted but marked with a deletion marker, preserving the mask structure. With `false`, characters are deleted completely, which can lead to "collapsing" of groups and loss of structure. Only works for fixed (non-rubber) groups of special characters.
+
+```html
+<!-- Preserve group structure (default) -->
+<Mask
+  mask="***-###"
+  :special="['*', '#']"
+  groupSave
+/>
+
+<!-- Without structure preservation -->
+<Mask
+  mask="***-###"
+  :special="['*', '#']"
+  :groupSave="false"
+/>
+```

package/src/media/mdx/Mask/groupSave.ru.mdx

@@ -0,0 +1,26 @@
+## Сохранение групп при удалении
+
+Свойство `groupSave` управляет поведением при удалении символов в маске с несколькими типами специальных символов.
+
+**Возможные значения:**
+
+- `true` — сохраняет разделение групп при удалении (по умолчанию)
+- `false` — позволяет символам из разных групп смешиваться при удалении
+
+При `groupSave: true` и наличии разных групп впереди символ не удаляется физически, а помечается маркером удаления, сохраняя структуру маски. При `false` символы удаляются полностью, что может привести к "схлопыванию" групп и потере структуры. Работает только для фиксированных (не резиновых) групп специальных символов.
+
+```html
+<!-- Сохранение структуры групп (по умолчанию) -->
+<Mask
+  mask="***-###"
+  :special="['*', '#']"
+  groupSave
+/>
+
+<!-- Без сохранения структуры -->
+<Mask
+  mask="***-###"
+  :special="['*', '#']"
+  :groupSave="false"
+/>
+```

package/src/media/mdx/Mask/mask.en.mdx

@@ -0,0 +1,21 @@
+## Mask template
+
+The `mask` property defines a template for structured data input with automatic real-time formatting.
+
+**Possible values:**
+
+- `string` — single mask for fixed format
+- `string[]` — array of masks to support multiple formats with automatic selection
+
+The template uses two types of characters: special characters (default `*`) denote positions for user input, while literal characters are inserted automatically and cannot be changed. The component automatically adds separators during typing and restricts input to only allowed characters in corresponding positions. When using an array of masks, the system automatically selects the most suitable template based on entered data. Works together with the validation system through `pattern` and `check` properties. For built-in types (`currency`, `number`, `date`), masks are generated automatically based on regional settings.
+
+```html
+<!-- Russian phone -->
+<Mask mask="+7 *** *** ** **" />
+
+<!-- Bank card -->
+<Mask mask="**** **** **** ****" />
+
+<!-- Multiple formats -->
+<Mask :mask="['+7 *** *** ** **', '8 *** *** ** **']" />
+```

package/src/media/mdx/Mask/mask.ru.mdx

@@ -0,0 +1,21 @@
+## Шаблон маски
+
+Свойство `mask` определяет шаблон для структурированного ввода данных с автоматическим форматированием в реальном времени.
+
+**Возможные значения:**
+
+- `string` — одиночная маска для фиксированного формата
+- `string[]` — массив масок для поддержки множественных форматов с автоматическим выбором
+
+В шаблоне используются два типа символов: специальные символы (по умолчанию `*`) обозначают позиции для пользовательского ввода, а литеральные символы вставляются автоматически и не могут быть изменены. Компонент автоматически добавляет разделители во время набора и ограничивает ввод только допустимыми символами в соответствующих позициях. При использовании массива масок система автоматически выбирает наиболее подходящий шаблон на основе введённых данных. Работает совместно с системой валидации через свойства `pattern` и `check`. Для встроенных типов (`currency`, `number`, `date`) маски генерируются автоматически на основе региональных настроек.
+
+```html
+<!-- Российский телефон -->
+<Mask mask="+7 *** *** ** **" />
+
+<!-- Банковская карта -->
+<Mask mask="**** **** **** ****" />
+
+<!-- Множественные форматы -->
+<Mask :mask="['+7 *** *** ** **', '8 *** *** ** **']" />
+```

package/src/media/mdx/Mask/match.en.mdx

@@ -0,0 +1,28 @@
+## Input character validation
+
+The `match` property defines a regular expression for checking the validity of entered characters.
+
+**Possible values:**
+
+- `RegExp` — regular expression (default `/[0-9]/`)
+- `string` — string converted to regular expression
+
+Checks each character during input. Characters that don't match the expression are ignored. Local `match` in group settings (`special[group].match`) takes priority over global. Differs from `pattern` in that `match` is a simple regular expression check, while `pattern` can be a function with access to mask state.
+
+```html
+<!-- Digits only (default) -->
+<Mask mask="***-***" />
+
+<!-- HEX characters -->
+<Mask mask="***-***" :match="/[A-F0-9]/i" />
+
+<!-- Different rules for groups -->
+<Mask
+  mask="***-###"
+  match="\\d"
+  :special="{
+    '*': {},
+    '#': { match: /[A-Z]/ }
+  }"
+/>
+```

package/src/media/mdx/Mask/match.ru.mdx

@@ -0,0 +1,28 @@
+## Валидация вводимых символов
+
+Свойство `match` определяет регулярное выражение для проверки допустимости вводимых символов.
+
+**Возможные значения:**
+
+- `RegExp` — регулярное выражение (по умолчанию `/[0-9]/`)
+- `string` — строка, преобразуется в регулярное выражение
+
+Проверяет каждый символ при вводе. Символы, не соответствующие выражению, игнорируются. Локальный `match` в настройках группы (`special[группа].match`) имеет приоритет над глобальным. Отличается от `pattern` тем, что `match` — простая проверка регулярным выражением, а `pattern` может быть функцией с доступом к состоянию маски.
+
+```html
+<!-- Только цифры (по умолчанию) -->
+<Mask mask="***-***" />
+
+<!-- HEX-символы -->
+<Mask mask="***-***" :match="/[A-F0-9]/i" />
+
+<!-- Разные правила для групп -->
+<Mask
+  mask="***-###"
+  match="\\d"
+  :special="{
+    '*': {},
+    '#': { match: /[A-Z]/ }
+  }"
+/>
+```

package/src/media/mdx/Mask/numberTypes.en.mdx

@@ -0,0 +1,38 @@
+## Numeric mask types
+
+Numeric types in Mask provide specialized formatting and validation for working with numbers, currencies, and financial data.
+
+Numeric types automatically create rubber masks with variable length, ignoring the `mask` property. Negative values and `min`/`max` constraints are supported. Thousand separators and decimal places (via the `fraction` parameter) adapt based on the selected locale.
+
+### Types
+
+- `number` — simple numeric mask without formatting
+- `number-format` — numbers with automatic thousand separators
+- `currency` — currency with symbol (₽, $, €) and formatting
+
+### Property fraction
+
+Defines the number of decimal places:
+- `number` — fixed number of digits (e.g., `2`)
+- `true` — auto-detection from input
+- `false`, `0` — integers only
+
+### Localization
+
+Formats adapt via the `language` property:
+- `ru` — `1 234,56` (space and comma)
+- `en-US` — `1,234.56` (comma and dot)
+- `de` — `1.234,56` (dot and comma)
+
+### Examples
+
+```html
+<!-- Formatted number -->
+<Mask type="number-format" language="en-US" :fraction="2" />
+
+<!-- Currency -->
+<Mask type="currency" currency="USD" language="en-US" />
+
+<!-- Currency without symbol -->
+<Mask type="currency" currency="USD" :currencyHide="true" />
+```

package/src/media/mdx/Mask/numberTypes.ru.mdx

@@ -0,0 +1,38 @@
+## Числовые типы масок
+
+Числовые типы в Mask обеспечивают специализированное форматирование и валидацию для работы с числами, валютами и финансовыми данными.
+
+Числовые типы автоматически создают резиновые маски переменной длины, игнорируя свойство `mask`. Поддерживаются отрицательные значения и ограничения `min`/`max`. Разделители разрядов и дробной части (параметр `fraction`) адаптируются под выбранную локаль.
+
+### Типы
+
+- `number` — простая числовая маска без форматирования
+- `number-format` — числа с автоматическими разделителями разрядов
+- `currency` — валюта с символом (₽, $, €) и форматированием
+
+### Свойство fraction
+
+Определяет количество знаков после запятой:
+- `number` — фиксированное количество знаков (например, `2`)
+- `true` — автоопределение по вводу
+- `false`, `0` — только целые числа
+
+### Локализация
+
+Форматы адаптируются через свойство `language`:
+- `ru` — `1 234,56` (пробел и запятая)
+- `en-US` — `1,234.56` (запятая и точка)
+- `de` — `1.234,56` (точка и запятая)
+
+### Примеры
+
+```html
+<!-- Форматированное число -->
+<Mask type="number-format" language="ru" :fraction="2" />
+
+<!-- Валюта -->
+<Mask type="currency" currency="RUB" language="ru" />
+
+<!-- Валюта без символа -->
+<Mask type="currency" currency="USD" :currencyHide="true" />
+```

package/src/media/mdx/Mask/pattern.en.mdx

@@ -0,0 +1,66 @@
+## Validation and patterns
+
+The `pattern` and `check` properties are designed for managing input validation in the mask.
+
+**Properties:**
+
+- `pattern` — defines validation patterns for individual mask groups, checking entered values
+- `check` — global validation pattern applied after the mask is fully completed
+
+Properties work sequentially: `pattern` validates entered values at the mask group level, highlighting validation errors after input. Characters are entered into the field, but when they don't match the pattern, an error message is displayed. Each group (defined by special characters) receives its own pattern. After the mask is fully filled, `check` performs final validation of the entire value, providing an additional layer of verification for complex business logic. Both properties are optional and can be used independently or together for multi-level protection against incorrect data.
+
+```html
+<script setup>
+import { ref } from 'vue'
+
+const phone = ref('')
+const cardNumber = ref('')
+</script>
+
+<template>
+  <!-- Pattern for groups: digits only -->
+  <Mask
+    v-model="phone"
+    mask="+7 (***) ***-**-**"
+    pattern="\\d"
+  />
+
+  <!-- Pattern with function for different groups -->
+  <Mask
+    v-model="phone"
+    mask="DD/MM/YYYY"
+    :special="{
+      'D': {
+        pattern: (masks) => {
+          const value = masks['D']?.value || ''
+          if (value === '0') return '[1-9]'
+          if (value === '3') return '[0-1]'
+          return '\\d'
+        }
+      },
+      'M': {
+        pattern: (masks) => {
+          const value = masks['M']?.value || ''
+          if (value === '0') return '[1-9]'
+          if (value === '1') return '[0-2]'
+          return '\\d'
+        }
+      },
+      'Y': { pattern: '\\d' }
+    }"
+  />
+
+  <!-- Check for final validation -->
+  <Mask
+    v-model="cardNumber"
+    mask="**** **** **** ****"
+    pattern="\\d"
+    :check="(maskData) => {
+      const number = maskData.value.replace(/\s/g, '')
+      return isValidLuhn(number) ? {} : {
+        validationMessage: 'Invalid card number'
+      }
+    }"
+  />
+</template>
+```

package/src/media/mdx/Mask/pattern.ru.mdx

@@ -0,0 +1,66 @@
+## Валидация и паттерны
+
+Свойства `pattern` и `check` предназначены для управления валидацией ввода в маске.
+
+**Свойства:**
+
+- `pattern` — определяет паттерны валидации для отдельных групп маски, проверяя введённые значения
+- `check` — глобальный паттерн валидации, применяемый после полного заполнения маски
+
+Свойства работают последовательно: `pattern` проверяет введённые значения на уровне групп маски, подсвечивая ошибки валидации после ввода. Символы вводятся в поле, но при несоответствии паттерну отображается сообщение об ошибке. Каждая группа (определённая специальными символами) получает свой паттерн. После полного заполнения маски `check` выполняет финальную валидацию всего значения, обеспечивая дополнительный слой проверки для сложной бизнес-логики. Оба свойства опциональны и могут использоваться независимо или совместно для многоуровневой защиты от некорректных данных.
+
+```html
+<script setup>
+import { ref } from 'vue'
+
+const phone = ref('')
+const cardNumber = ref('')
+</script>
+
+<template>
+  <!-- Pattern для групп: только цифры -->
+  <Mask
+    v-model="phone"
+    mask="+7 (***) ***-**-**"
+    pattern="\\d"
+  />
+
+  <!-- Pattern с функцией для разных групп -->
+  <Mask
+    v-model="phone"
+    mask="DD/MM/YYYY"
+    :special="{
+      'D': {
+        pattern: (masks) => {
+          const value = masks['D']?.value || ''
+          if (value === '0') return '[1-9]'
+          if (value === '3') return '[0-1]'
+          return '\\d'
+        }
+      },
+      'M': {
+        pattern: (masks) => {
+          const value = masks['M']?.value || ''
+          if (value === '0') return '[1-9]'
+          if (value === '1') return '[0-2]'
+          return '\\d'
+        }
+      },
+      'Y': { pattern: '\\d' }
+    }"
+  />
+
+  <!-- Check для финальной валидации -->
+  <Mask
+    v-model="cardNumber"
+    mask="**** **** **** ****"
+    pattern="\\d"
+    :check="(maskData) => {
+      const number = maskData.value.replace(/\s/g, '')
+      return isValidLuhn(number) ? {} : {
+        validationMessage: 'Неверный номер карты'
+      }
+    }"
+  />
+</template>
+```

package/src/media/mdx/Mask/special.en.mdx

@@ -0,0 +1,106 @@
+## Special characters
+
+The `special` property defines special characters to denote user input positions in the mask and configure their extended behavior.
+
+**Possible values:**
+
+- `string` — single special character (default `'*'`)
+- `string[]` — array of special characters for different group types
+- `MaskSpecialList` — object with extended configuration for each character
+
+Special characters in the mask template denote positions where users can enter data, unlike literal characters that are inserted automatically.
+
+When using a simple string (e.g., `special="*"`), all input positions in the mask are restricted by the same validation rules.
+
+An array of characters (e.g., `special="['*', 'A', '#']"`) allows creating different group types with individual constraints: one group for digits, another for letters, a third for special characters.
+
+Object notation `MaskSpecialList` (see [detailed description below](#maskspeciallist)) provides maximum flexibility. Each special character is configured separately with the ability to set default values, rubber groups with variable length, auto-transition characters, and custom validation.
+
+For built-in types (`currency`, `number`, `date`, `time`), the system automatically generates special characters considering regional settings, ignoring the user-defined `special` value.
+
+```html
+<!-- Simple special character -->
+<Mask mask="***-***" special="*" />
+
+<!-- Multiple group types -->
+<Mask mask="AA*-###" :special="['A', '*', '#']" />
+
+<!-- Extended configuration -->
+<Mask
+  mask="***-***"
+  :special="{
+    '*': {
+      pattern: '\\d',
+      view: '_',
+      rubber: true,
+      minLength: 2,
+      maxLength: 8,
+      transitionChar: ' '
+    }
+  }"
+/>
+
+<!-- Groups with default values -->
+<Mask
+  mask="DD/MM/YYYY"
+  :special="{
+    'D': { defaultValue: '01', pattern: '\\d' },
+    'M': { defaultValue: '01', pattern: '\\d' },
+    'Y': { defaultValue: '2024', pattern: '\\d' }
+  }"
+/>
+```
+
+## MaskSpecialList
+
+`MaskSpecialList` is an extended configuration object that allows for fine-tuned control over the behavior of each special character in the mask. Each key in the object corresponds to one of the characters defined in the `special` property (or the default `*` character).
+
+### MaskSpecialItem Properties
+
+- `defaultValue?: string` — **initial value**. Automatically populates the group on initialization. The user can modify it if the `match` rules allow.
+- `rubber?: boolean` — **rubber mode**. Enables dynamic length for the group. In the mask template, such a group is typically represented by one or more identical characters.
+- `transitionChar?: string | string[]` — **transition character**. A specific character (e.g., space or dot) that triggers an immediate focus shift to the next part of the mask upon entry. Only for `rubber: true`.
+- `minLength?: number` — **minimum length**. Used to validate whether the group has been sufficiently filled.
+- `maxLength?: number` — **maximum length**. The limit for expansion in "rubber" groups.
+- `match?: RegExp | string` — **input filter**. A regular expression that checks *each individual* character as it is typed. Default: `[0-9]`.
+- `pattern?: string | Function` — **group validator**. A rule for validating the entire accumulated string in the group. Can be a string (regex) or a function receiving mask data.
+- `view?: string` — **visual placeholder**. The character the user sees in empty slots of this group. Default: `_`.
+
+### How to Work with MaskSpecialList
+
+For effective use of `MaskSpecialList`, follow these simple rules:
+
+1.  **Character Mapping**: Every key in the `MaskSpecialList` object must be a character you used in your `mask` template. For example, if the mask is `AAA-***`, you can configure group `A` for letters and `*` for digits.
+2.  **Filter Configuration (`match`)**: Use `match` to restrict the types of characters a user can physically type. This stops letters from being entered where numbers are expected at the earliest possible stage.
+3.  **Use Rubber Groups**: If a field's length is unknown in advance (like a phone extension), set `rubber: true`. This allows the mask to expand as the user types.
+4.  **Manage Transitions**: For a better user experience, define a `transitionChar` (like a space or dot). This allows users to manually finish the current group and jump to the next one without filling the entire length.
+5.  **Default Values**: If part of the data is frequently repeated (like the current year), use `defaultValue`. This reduces the number of actions required from the user.
+
+### Example
+
+```html
+<script setup>
+const value = ref('')
+</script>
+
+<template>
+  <!-- Example of a rubber mask for an IP address -->
+  <Mask
+    v-model="value"
+    mask="*.#.#.#"
+    :special="{
+      '*': { rubber: true, maxLength: 3, transitionChar: '.', pattern: '\\d{1,3}' },
+      '#': { rubber: true, maxLength: 3, transitionChar: '.', pattern: '\\d{1,3}' }
+    }"
+  />
+
+  <!-- Example of a mask with different group types and default values -->
+  <Mask
+    mask="AAA-****"
+    :special="{
+      'A': { match: /[A-Z]/, view: 'A' },
+      '*': { defaultValue: '0000', match: /[0-9]/, view: '0' }
+    }"
+  />
+</template>
+```

package/src/media/mdx/Mask/special.ru.mdx

@@ -0,0 +1,106 @@
+## Специальные символы
+
+Свойство `special` определяет специальные символы для обозначения мест пользовательского ввода в маске и настройку их расширенного поведения.
+
+**Возможные значения:**
+
+- `string` — одиночный специальный символ (по умолчанию `'*'`)
+- `string[]` — массив специальных символов для разных типов групп
+- `MaskSpecialList` — объект с расширенной конфигурацией каждого символа
+
+Специальные символы в шаблоне маски обозначают позиции, где пользователь может вводить данные, в отличие от литеральных символов, которые вставляются автоматически.
+
+При использовании простой строки (например, `special="*"`) все места ввода в маске ограничиваются одинаковыми правилами валидации.
+
+Массив символов (например, `special="['*', 'A', '#']"`) позволяет создавать разные типы групп с индивидуальными ограничениями: одна группа для цифр, другая для букв, третья для специальных символов.
+
+Объектная нотация `MaskSpecialList` (см. [детальное описание ниже](#maskspeciallist)) предоставляет максимальную гибкость. Каждый специальный символ настраивается отдельно с возможностью задать значения по умолчанию, резиновые группы переменной длины, символы автоперехода и кастомную валидацию.
+
+Для встроенных типов (`currency`, `number`, `date`, `time`) система автоматически генерирует специальные символы с учётом региональных настроек, игнорируя пользовательское значение `special`.
+
+```html
+<!-- Простой специальный символ -->
+<Mask mask="***-***" special="*" />
+
+<!-- Несколько типов групп -->
+<Mask mask="AA*-###" :special="['A', '*', '#']" />
+
+<!-- Расширенная конфигурация -->
+<Mask
+  mask="***-***"
+  :special="{
+    '*': {
+      pattern: '\\d',
+      view: '_',
+      rubber: true,
+      minLength: 2,
+      maxLength: 8,
+      transitionChar: ' '
+    }
+  }"
+/>
+
+<!-- Группы с значениями по умолчанию -->
+<Mask
+  mask="DD/MM/YYYY"
+  :special="{
+    'D': { defaultValue: '01', pattern: '\\d' },
+    'M': { defaultValue: '01', pattern: '\\d' },
+    'Y': { defaultValue: '2024', pattern: '\\d' }
+  }"
+/>
+```
+
+## MaskSpecialList
+
+`MaskSpecialList` — это объект расширенной конфигурации, который позволяет детально настроить поведение каждого специального символа в маске. Каждый ключ в объекте соответствует одному из символов, определённых в свойстве `special` (или символу `*` по умолчанию).
+
+### Свойства MaskSpecialItem
+
+- `defaultValue?: string` — **начальное значение**. Автоматически заполняет группу при инициализации. Пользователь может изменить его, если это разрешено правилами `match`.
+- `rubber?: boolean` — **резиновый режим**. Позволяет группе изменять свою длину. В шаблоне маски такая группа обычно представлена одним или несколькими одинаковыми символами.
+- `transitionChar?: string | string[]` — **символ перехода**. Конкретный символ (например, пробел или точка), при вводе которого фокус немедленно переходит к следующей части маски. Только для `rubber: true`.
+- `minLength?: number` — **минимальная длина**. Используется для валидации полноты заполнения группы.
+- `maxLength?: number` — **максимальная длина**. Лимит расширения для «резиновых» групп.
+- `match?: RegExp | string` — **фильтр ввода**. Регулярное выражение, проверяющее *каждый отдельный* символ при нажатии клавиши. По умолчанию: `[0-9]`.
+- `pattern?: string | Function` — **валидатор группы**. Правило для проверки всей накопленной строки в группе. Может быть строкой (regex) или функцией, принимающей данные маски.
+- `view?: string` — **визуальный плейсхолдер**. Тот символ, который видит пользователь в пустых ячейках этой группы. По умолчанию: `_`.
+
+### Как работать с MaskSpecialList
+
+Для эффективного использования `MaskSpecialList` придерживайтесь следующих правил:
+
+1.  **Сопоставление символов**: Каждый ключ в объекте `MaskSpecialList` должен быть символом, который вы использовали в шаблоне `mask`. Например, если маска `AAA-***`, вы можете настроить группу `A` для букв и `*` для цифр.
+2.  **Настройка фильтров (`match`)**: Используйте `match` для ограничения типов символов, которые пользователь в принципе может нажать. Это предотвращает ввод букв там, где нужны цифры, на самом раннем этапе.
+3.  **Использование резиновых групп**: Если длина поля заранее неизвестна (например, добавочный номер телефона), установите `rubber: true`. Это позволит маске расширяться по мере ввода.
+4.  **Управление переходом**: Для удобства пользователя задавайте `transitionChar` (например, пробел или точку). Это позволяет пользователю вручную завершить ввод в текущей группе и переключиться на следующую, не дожидаясь заполнения всей длины.
+5.  **Значения по умолчанию**: Если часть данных часто повторяется (например, текущий год), используйте `defaultValue`. Это уменьшит количество действий пользователя.
+
+### Пример
+
+```html
+<script setup>
+const value = ref('')
+</script>
+
+<template>
+  <!-- Пример резиновой маски для IP-адреса -->
+  <Mask
+    v-model="value"
+    mask="*.#.#.#"
+    :special="{
+      '*': { rubber: true, maxLength: 3, transitionChar: '.', pattern: '\\d{1,3}' },
+      '#': { rubber: true, maxLength: 3, transitionChar: '.', pattern: '\\d{1,3}' }
+    }"
+  />
+
+  <!-- Пример маски с разными типами групп и значениями по умолчанию -->
+  <Mask
+    mask="AAA-****"
+    :special="{
+      'A': { match: /[A-Z]/, view: 'A' },
+      '*': { defaultValue: '0000', match: /[0-9]/, view: '0' }
+    }"
+  />
+</template>
+```

package/src/media/mdx/Mask/type.en.mdx

@@ -0,0 +1,22 @@
+## Mask types
+
+The `type` property defines the mask operation mode and automatically generates the appropriate structure for different data types.
+
+**Possible values:**
+
+- `'text'` — basic text mask (default)
+- `'number'`, `'number-format'`, `'currency'` — numeric types with validation and localization
+- `'date'`, `'datetime'`, `'time'`, `'year'`, `'month'`, `'day'`, `'hour-minute'` — date and time types
+
+When using `text`, explicit structure specification via the `mask` property is required. Specialized numeric types automatically create rubber masks with thousand separators, validation, and formatting according to regional settings (`language`). Date types generate masks according to local formats with validation of entered values correctness. When a specialized type is activated, the `mask` property is ignored, and the mask structure is formed automatically based on `language`, `currency`, and `fraction`.
+
+```html
+<!-- Text mask -->
+<Mask mask="+1 (***) ***-****" type="text" />
+
+<!-- Currency mask -->
+<Mask type="currency" currency="USD" language="en-US" />
+
+<!-- Date mask -->
+<Mask type="date" language="en-US" />
+```

package/src/media/mdx/Mask/type.ru.mdx

@@ -0,0 +1,22 @@
+## Типы масок
+
+Свойство `type` определяет режим работы маски и автоматически генерирует соответствующую структуру для различных типов данных.
+
+**Возможные значения:**
+
+- `'text'` — базовая текстовая маска (по умолчанию)
+- `'number'`, `'number-format'`, `'currency'` — числовые типы с валидацией и локализацией
+- `'date'`, `'datetime'`, `'time'`, `'year'`, `'month'`, `'day'`, `'hour-minute'` — типы дат и времени
+
+При использовании `text` требуется явное указание структуры через свойство `mask`. Специализированные числовые типы автоматически создают резиновые маски с разделителями разрядов, валидацией и форматированием согласно региональным настройкам (`language`). Типы дат генерируют маски по локальным форматам с проверкой корректности введённых значений. При активации специализированного типа свойство `mask` игнорируется, а структура маски формируется автоматически на основе `language`, `currency` и `fraction`.
+
+```html
+<!-- Текстовая маска -->
+<Mask mask="+7 (***) ***-**-**" type="text" />
+
+<!-- Валютная маска -->
+<Mask type="currency" currency="RUB" language="ru" />
+
+<!-- Маска даты -->
+<Mask type="date" language="ru" />
+```