@dxtmisha/wiki 0.39.7 → 0.56.0

package/src/media/functional/functional-basic/classes/HashInstance/HashInstance.ru.mdx

@@ -0,0 +1,54 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/functional-basic/Classes/HashInstance - Экземпляр URL Hash'/>
+
+# Класс HashInstance
+
+`HashInstance` — это основной класс, реализующий логику управления данными в URL-хэше. Он обеспечивает хранение состояния, механизмы подписки на изменения и синхронизацию с браузерным API.
+
+Вы можете использовать этот класс напрямую, если вам требуется изолированное управление хэшем, отличное от глобального состояния `Hash`.
+
+## Ключевые особенности
+
+- **Изолированное состояние** — Хранит свой набор переменных хэша.
+- **Поддержка цепочки вызовов** — Большинство методов возвращают `this`, позволяя писать компактный код.
+- **Автоматическая синхронизация** — При инициализации считывает данные из URL и подписывается на событие `hashchange`.
+- **SSR-совместимость** — Безопасно работает в серверном окружении, используя заглушки для DOM API.
+
+## Инициализация
+
+Для создания экземпляра используйте конструктор `HashInstance()`.
+
+```typescript
+import { HashInstance } from '@dxtmisha/functional-basic'
+
+const myHash = new HashInstance()
+```
+
+## Методы
+
+### Чтение и запись
+- `get<T>(name: string, defaultValue?: T | (() => T)): T` — Возвращает значение переменной. Если её нет, устанавливает `defaultValue` и возвращает его.
+- `set<T>(name: string, callback: T | (() => T)): this` — Обновляет значение переменной и синхронизирует URL.
+
+### Наблюдение (Watchers)
+- `addWatch<T>(name: string, callback: (value: T) => void): this` — Добавляет обработчик изменения переменной.
+- `removeWatch<T>(name: string, callback: (value: T) => void): this` — Удаляет обработчик.
+
+### Управление
+- `reload(): this` — Обновляет внутреннее состояние из текущего URL-хэша.
+
+## Примеры
+
+### Использование изолированного экземпляра
+```typescript
+const searchHash = new HashInstance()
+
+// Подписка
+searchHash.addWatch('query', (q) => {
+  console.log('Поиск:', q)
+})
+
+// Установка значения (обновит URL)
+searchHash.set('query', 'smartphones')
+```

package/src/media/functional/functional-basic/classes/HashInstance/HashInstance.vi.mdx

@@ -0,0 +1,54 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/functional-basic/Classes/HashInstance - Phiên bản URL Hash'/>
+
+# Lớp HashInstance
+
+`HashInstance` là lớp cốt lõi triển khai logic quản lý dữ liệu trong URL hash. Nó cung cấp khả năng lưu trữ trạng thái, các cơ chế để đăng ký theo dõi thay đổi và đồng bộ hóa với browser API.
+
+Bạn có thể sử dụng lớp này trực tiếp nếu cần quản lý hash riêng biệt, tách rời khỏi trạng thái `Hash` toàn cục.
+
+## Tính năng chính
+
+- **Trạng thái biệt lập** — Lưu trữ bộ biến hash riêng của nó.
+- **Chainable API** — Hầu hết các phương thức trả về `this`, cho phép viết mã ngắn gọn.
+- **Đồng bộ hóa tự động** — Khi khởi tạo, nó đọc dữ liệu từ URL và đăng ký sự kiện `hashchange`.
+- **Tương thích SSR** — Hoạt động an toàn trong môi trường máy chủ bằng cách sử dụng các bản giả cho DOM API.
+
+## Khởi tạo
+
+Để tạo một phiên bản, hãy sử dụng hàm khởi tạo `HashInstance()`.
+
+```typescript
+import { HashInstance } from '@dxtmisha/functional-basic'
+
+const myHash = new HashInstance()
+```
+
+## Phương thức
+
+### Đọc và Ghi
+- `get<T>(name: string, defaultValue?: T | (() => T)): T` — Trả về giá trị của một biến. Nếu nó không tồn tại, thiết lập `defaultValue` và trả về nó.
+- `set<T>(name: string, callback: T | (() => T)): this` — Cập nhật giá trị của biến và đồng bộ hóa URL.
+
+### Theo dõi (Watchers)
+- `addWatch<T>(name: string, callback: (value: T) => void): this` — Thêm bộ xử lý cho các thay đổi của biến.
+- `removeWatch<T>(name: string, callback: (value: T) => void): this` — Xóa bộ xử lý.
+
+### Quản lý
+- `reload(): this` — Làm mới trạng thái nội bộ từ URL hash hiện tại.
+
+## Ví dụ
+
+### Sử dụng một phiên bản biệt lập
+```typescript
+const searchHash = new HashInstance()
+
+// Đăng ký theo dõi
+searchHash.addWatch('query', (q) => {
+  console.log('Tìm kiếm:', q)
+})
+
+// Thiết lập giá trị (sẽ cập nhật URL)
+searchHash.set('query', 'smartphones')
+```

package/src/media/functional/functional-basic/classes/Meta/Meta.en.mdx

@@ -41,6 +41,11 @@ const meta = new Meta()
 - `getOg(): MetaOg` — direct access to the `MetaOg` instance.
 - `getTwitter(): MetaTwitter` — direct access to the `MetaTwitter` instance.
 
+## Methods for Generating HTML
+
+- `html(): string` — generates the full HTML string of all meta tags: standard + Open Graph + Twitter Card. Used for SSR.
+- `htmlTitle(): string` — generates the page title.
+
 ## Setters
 
 All setters return `this` for method chaining.
@@ -74,6 +79,17 @@ const html = meta.html()
 // ...
 ```
 
+### `htmlTitle(): string`
+
+Generates the current title (including suffix).
+
+```javascript
+const meta = new Meta()
+meta.setSuffix('My Site').setTitle('Home')
+
+meta.htmlTitle() // "Home - My Site"
+```
+
 ## Example
 
 ```javascript

package/src/media/functional/functional-basic/classes/Meta/Meta.ru.mdx

@@ -41,6 +41,11 @@ const meta = new Meta()
 - `getOg(): MetaOg` — прямой доступ к экземпляру `MetaOg`.
 - `getTwitter(): MetaTwitter` — прямой доступ к экземпляру `MetaTwitter`.
 
+## Методы для генерации HTML
+
+- `html(): string` — генерирует полную HTML-строку всех мета-тегов: стандартных + Open Graph + Twitter Card. Используется для SSR.
+- `htmlTitle(): string` — генерирует заголовок страницы.
+
 ## Сеттеры
 
 Все сеттеры возвращают `this` для цепочки вызовов.
@@ -74,6 +79,17 @@ const html = meta.html()
 // ...
 ```
 
+### `htmlTitle(): string`
+
+Генерирует текущий заголовок (включая суффикс).
+
+```javascript
+const meta = new Meta()
+meta.setSuffix('Мой Сайт').setTitle('Главная')
+
+meta.htmlTitle() // "Главная - Мой Сайт"
+```
+
 ## Пример
 
 ```javascript

package/src/media/functional/functional-basic/classes/Meta/Meta.vi.mdx

@@ -41,9 +41,14 @@ const meta = new Meta()
 - `getOg(): MetaOg` — truy cập trực tiếp instance `MetaOg`.
 - `getTwitter(): MetaTwitter` — truy cập trực tiếp instance `MetaTwitter`.
 
+## Phương thức tạo HTML
+
+- `html(): string` — tạo chuỗi HTML đầy đủ của tất cả thẻ meta: tiêu chuẩn + Open Graph + Twitter Card. Dùng cho SSR.
+- `htmlTitle(): string` — tạo tiêu đề trang.
+
 ## Setter
 
-Tất cả setter trả về `this` để chuỗi phương thức.
+All setter trả về `this` để chuỗi phương thức.
 
 - `setTitle(title: string)` — đặt `document.title` (có hậu tố), `og:title` và `twitter:title` đồng thời.
 - `setKeywords(keywords: string | string[])` — nhận chuỗi hoặc mảng; mảng tự động nối bằng dấu phẩy.
@@ -74,6 +79,17 @@ const html = meta.html()
 // ...
 ```
 
+### `htmlTitle(): string`
+
+Tạo tiêu đề hiện tại (bao gồm cả hậu tố).
+
+```javascript
+const meta = new Meta()
+meta.setSuffix('Trang web của tôi').setTitle('Trang chủ')
+
+meta.htmlTitle() // "Trang chủ - Trang web của tôi"
+```
+
 ## Ví dụ
 
 ```javascript

package/src/media/functional/functional-basic/classes/MetaManager/MetaManager.en.mdx

@@ -49,3 +49,12 @@ manager.set('description', 'My description').set('keywords', 'vue, typescript')
 manager.html()
 // '<meta name="description" content="My description"><meta name="keywords" content="vue, typescript">'
 ```
+
+### `htmlTitle(title: string): string`
+
+Converts a title string into an HTML `<title>` tag.
+
+```javascript
+manager.htmlTitle('My Page Title')
+// '<title>My Page Title</title>'
+```

package/src/media/functional/functional-basic/classes/MetaManager/MetaManager.ru.mdx

@@ -49,3 +49,12 @@ manager.set('description', 'Моё описание').set('keywords', 'vue, type
 manager.html()
 // '<meta name="description" content="Моё описание"><meta name="keywords" content="vue, typescript">'
 ```
+
+### `htmlTitle(title: string): string`
+
+Преобразует строку заголовка в HTML-тег `<title>`.
+
+```javascript
+manager.htmlTitle('Заголовок страницы')
+// '<title>Заголовок страницы</title>'
+```

package/src/media/functional/functional-basic/classes/MetaManager/MetaManager.vi.mdx

@@ -49,3 +49,12 @@ manager.set('description', 'Mô tả của tôi').set('keywords', 'vue, typescri
 manager.html()
 // '<meta name="description" content="Mô tả của tôi"><meta name="keywords" content="vue, typescript">'
 ```
+
+### `htmlTitle(title: string): string`
+
+Chuyển đổi chuỗi tiêu đề thành thẻ HTML `<title>`.
+
+```javascript
+manager.htmlTitle('Tiêu đề trang')
+// '<title>Tiêu đề trang</title>'
+```

package/src/media/functional/functional-basic/classes/MetaStatic/MetaStatic.en.mdx

@@ -0,0 +1,79 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/functional-basic/Classes/MetaStatic - Meta Tags Management (Static)'/>
+
+# Class MetaStatic
+
+The `MetaStatic` class is a **static entry point** for managing page meta tags, Open Graph (OG), and Twitter Card data. It acts as a static wrapper around a globally managed `Meta` instance, providing a clean singleton interface for SEO and social sharing management.
+
+## Key Features
+
+- **Static Interface** — Manage page titles, descriptions, and more without manual instantiation.
+- **Unified Management** — Automatically syncs titles and other information across standard meta, OG, and Twitter.
+- **SSR Isolation** — Uses `ServerStorage` to handle instance isolation during server-side rendering.
+- **Fluent API** — Support for method chaining in setter methods.
+
+## Methods
+
+### Access
+
+- `getItem(): Meta` — Returns the underlying `Meta` instance.
+- `getOg(): MetaOg` — Gets the MetaOg instance for advanced Open Graph operations.
+- `getTwitter(): MetaTwitter` — Gets the MetaTwitter instance for advanced Twitter Card operations.
+
+### Getters
+
+- `getTitle(): string` — Gets the current page title (without suffix).
+- `getDescription(): string` — Gets the current description meta tag.
+- `getKeywords(): string` — Gets the current keywords.
+- `getImage(): string` — Gets the image URL (from OG settings).
+- `getCanonical(): string` — Gets the canonical URL.
+- `getRobots(): MetaRobots` — Gets the current robots directive.
+- `getAuthor(): string` — Gets the author name.
+- `getSiteName(): string` — Gets the site name (from OG settings).
+- `getLocale(): string` — Gets the locale (from OG settings).
+
+### Setters
+
+All setter methods return `typeof MetaStatic` to support method chaining.
+
+- `setTitle(title: string): typeof MetaStatic` — Sets the page title and updates OG/Twitter titles.
+- `setDescription(description: string): typeof MetaStatic` — Sets the description meta tag.
+- `setKeywords(keywords: string | string[]): typeof MetaStatic` — Sets the keywords (string or array).
+- `setImage(image: string): typeof MetaStatic` — Sets the image for OG and Twitter.
+- `setCanonical(canonical: string): typeof MetaStatic` — Sets the canonical URL and updates OG/Twitter URLs.
+- `setRobots(robots: MetaRobots): typeof MetaStatic` — Sets the robots directive.
+- `setAuthor(author: string): typeof MetaStatic` — Sets the author meta tag.
+- `setSiteName(siteName: string): typeof MetaStatic` — Sets the site name for OG and Twitter.
+- `setLocale(locale: string): typeof MetaStatic` — Sets the locale for Open Graph.
+- `setSuffix(suffix?: string): typeof MetaStatic` — Sets a suffix (e.g., " | My Site") appended to titles.
+
+### Output
+
+- `html(): string` — Generates a complete string of HTML meta tags for all managed properties.
+- `htmlTitle(): string` — Generates a complete HTML-safe title string.
+
+## Architecture
+
+`MetaStatic` works as a **static proxy**. All calls are forwarded to an internal `Meta` instance managed via `ServerStorage`.
+
+### Request Isolation (SSR)
+
+By using `ServerStorage`, `MetaStatic` ensures that during Server-Side Rendering (SSR), meta information for one request does not leak into another. Each request gets its own isolated context.
+
+### Examples
+
+```typescript
+import { MetaStatic } from '@dxtmisha/functional-basic';
+
+MetaStatic
+  .setSuffix('My Online Store')
+  .setTitle('Summer Collection')
+  .setDescription('Explore our new arrivals.')
+  .setImage('https://example.com/cover.jpg')
+  .setLocale('en_US');
+
+console.log(MetaStatic.getTitle()); // "Summer Collection"
+document.title; // "Summer Collection - My Online Store"
+console.log(MetaStatic.htmlTitle()); // "Summer Collection - My Online Store"
+```

package/src/media/functional/functional-basic/classes/MetaStatic/MetaStatic.ru.mdx

@@ -0,0 +1,79 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/functional-basic/Classes/MetaStatic - Управление мета-тегами (Static)'/>
+
+# Класс MetaStatic
+
+Класс `MetaStatic` является **статической точкой входа** для управления мета-тегами страницы, данными Open Graph (OG) и Twitter Card. Он представляет собой статическую обертку над глобально управляемым экземпляром `Meta`, предоставляя удобный синглтон-интерфейс для SEO и социальных сетей.
+
+## Ключевые особенности
+
+- **Статический интерфейс** — управление заголовками, описаниями и другими данными без необходимости ручного создания экземпляров.
+- **Единое управление** — автоматическая синхронизация заголовков и другой информации между стандартными мета-тегами, OG и Twitter.
+- **Изоляция в SSR** — использует `ServerStorage` для обеспечения изоляции данных между запросами во время рендеринга на стороне сервера.
+- **Fluent API** — поддержка цепочки вызовов (method chaining) в методах установки.
+
+## Методы
+
+### Доступ
+
+- `getItem(): Meta` — Возвращает базовый экземпляр класса `Meta`.
+- `getOg(): MetaOg` — Получает экземпляр `MetaOg` для расширенных операций с Open Graph.
+- `getTwitter(): MetaTwitter` — Получает экземпляр `MetaTwitter` для расширенных операций с Twitter Card.
+
+### Получение (Getters)
+
+- `getTitle(): string` — Возвращает текущий заголовок (без суффикса).
+- `getDescription(): string` — Возвращает содержимое мета-тега description.
+- `getKeywords(): string` — Возвращает список ключевых слов.
+- `getImage(): string` — Возвращает URL изображения (из настроек OG).
+- `getCanonical(): string` — Возвращает канонический URL.
+- `getRobots(): MetaRobots` — Возвращает текущую директиву robots.
+- `getAuthor(): string` — Возвращает имя автора.
+- `getSiteName(): string` — Возвращает название сайта (из настроек OG).
+- `getLocale(): string` — Возвращает локаль (из настроек OG).
+
+### Установка (Setters)
+
+Все методы установки возвращают `typeof MetaStatic` для поддержки цепочки вызовов.
+
+- `setTitle(title: string): typeof MetaStatic` — Устанавливает заголовок страницы и обновляет заголовки OG/Twitter.
+- `setDescription(description: string): typeof MetaStatic` — Устанавливает мета-тег description.
+- `setKeywords(keywords: string | string[]): typeof MetaStatic` — Устанавливает ключевые слова (строка или массив).
+- `setImage(image: string): typeof MetaStatic` — Устанавливает изображение для OG и Twitter.
+- `setCanonical(canonical: string): typeof MetaStatic` — Устанавливает канонический URL и обновляет URL для OG/Twitter.
+- `setRobots(robots: MetaRobots): typeof MetaStatic` — Устанавливает директиву robots.
+- `setAuthor(author: string): typeof MetaStatic` — Устанавливает мета-тег author.
+- `setSiteName(siteName: string): typeof MetaStatic` — Устанавливает название сайта для OG и Twitter.
+- `setLocale(locale: string): typeof MetaStatic` — Устанавливает локаль для Open Graph.
+- `setSuffix(suffix?: string): typeof MetaStatic` — Устанавливает суффикс (например, " | Мой Сайт"), добавляемый к заголовкам.
+
+### Вывод
+
+- `html(): string` — Генерирует полную строку HTML-тегов для всех управляемых свойств.
+- `htmlTitle(): string` — Генерирует полную HTML-безопасную строку заголовка.
+
+## Архитектура
+
+`MetaStatic` работает как **статический прокси**. Все вызовы методов перенаправляются на внутренний экземпляр `Meta`, который управляется через `ServerStorage`.
+
+### Изоляция запросов (SSR)
+
+Благодаря использованию `ServerStorage`, `MetaStatic` гарантирует, что при рендеринге на стороне сервера (SSR) информация одного запроса не попадет в другой. Каждый запрос получает свой изолированный контекст.
+
+### Примеры
+
+```typescript
+import { MetaStatic } from '@dxtmisha/functional-basic';
+
+MetaStatic
+  .setSuffix('Мой Интернет Магазин')
+  .setTitle('Летняя коллекция')
+  .setDescription('Ознакомьтесь с нашими новинками.')
+  .setImage('https://example.com/cover.jpg')
+  .setLocale('ru_RU');
+
+console.log(MetaStatic.getTitle()); // "Летняя коллекция"
+document.title; // "Летняя коллекция - Мой Интернет Магазин"
+console.log(MetaStatic.htmlTitle()); // "Летняя коллекция - Мой Интернет Магазин"
+```

package/src/media/functional/functional-basic/classes/MetaStatic/MetaStatic.vi.mdx

@@ -0,0 +1,79 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/functional-basic/Classes/MetaStatic - Quản lý Meta Tags (Static)'/>
+
+# Class MetaStatic
+
+Lớp `MetaStatic` là **điểm truy cập tĩnh** để quản lý các thẻ meta của trang, dữ liệu Open Graph (OG) và Twitter Card. Nó hoạt động như một lớp vỏ bọc tĩnh (static wrapper) xung quanh một thực thể `Meta` được quản lý toàn cục, cung cấp một giao diện singleton sạch sẽ để quản lý SEO và chia sẻ mạng xã hội.
+
+## Các tính năng chính
+
+- **Giao diện tĩnh** — Quản lý tiêu đề trang, mô tả và nhiều thứ khác mà không cần khởi tạo thủ công.
+- **Quản lý thống nhất** — Tự động đồng bộ hóa tiêu đề và các thông tin khác trên các thẻ meta tiêu chuẩn, OG và Twitter.
+- **Cách ly trong SSR** — Sử dụng `ServerStorage` để xử lý cách ly thực thể trong quá trình render phía máy chủ (server-side rendering).
+- **Fluent API** — Hỗ trợ kỹ thuật method chaining cho các phương thức thiết lập (setter).
+
+## Các phương thức
+
+### Truy cập
+
+- `getItem(): Meta` — Trả về thực entity `Meta` cơ sở.
+- `getOg(): MetaOg` — Lấy thực thể `MetaOg` cho các thao tác Open Graph nâng cao.
+- `getTwitter(): MetaTwitter` — Lấy thực thể `MetaTwitter` cho các thao tác Twitter Card nâng cao.
+
+### Lấy dữ liệu (Getters)
+
+- `getTitle(): string` — Lấy tiêu đề trang hiện tại (không bao gồm hậu tố).
+- `getDescription(): string` — Lấy nội dung thẻ meta description.
+- `getKeywords(): string` — Lấy các từ khóa hiện tại.
+- `getImage(): string` — Lấy URL hình ảnh (từ cài đặt OG).
+- `getCanonical(): string` — Lấy URL chuẩn (canonical).
+- `getRobots(): MetaRobots` — Lấy chỉ thị robots hiện tại.
+- `getAuthor(): string` — Lấy tên tác giả.
+- `getSiteName(): string` — Lấy tên trang web (từ cài đặt OG).
+- `getLocale(): string` — Lấy mã ngôn ngữ/khu vực (từ cài đặt OG).
+
+### Thiết lập (Setters)
+
+Tất cả các phương thức thiết lập đều trả về `typeof MetaStatic` để hỗ trợ method chaining.
+
+- `setTitle(title: string): typeof MetaStatic` — Thiết lập tiêu đề trang và cập nhật tiêu đề OG/Twitter.
+- `setDescription(description: string): typeof MetaStatic` — Thiết lập thẻ meta description.
+- `setKeywords(keywords: string | string[]): typeof MetaStatic` — Thiết lập từ khóa (chuỗi hoặc mảng).
+- `setImage(image: string): typeof MetaStatic` — Thiết lập hình ảnh cho OG và Twitter.
+- `setCanonical(canonical: string): typeof MetaStatic` — Thiết lập URL chuẩn và cập nhật URL cho OG/Twitter.
+- `setRobots(robots: MetaRobots): typeof MetaStatic` — Thiết lập chỉ thị robots.
+- `setAuthor(author: string): typeof MetaStatic` — Thiết lập thẻ meta author.
+- `setSiteName(siteName: string): typeof MetaStatic` — Thiết lập tên trang web cho OG và Twitter.
+- `setLocale(locale: string): typeof MetaStatic` — Thiết lập mã ngôn ngữ cho Open Graph.
+- `setSuffix(suffix?: string): typeof MetaStatic` — Thiết lập hậu tố (ví dụ: " | My Site") được thêm vào cuối tiêu đề.
+
+### Đầu ra
+
+- `html(): string` — Tạo ra một chuỗi đầy đủ các thẻ HTML meta cho tất cả các thuộc tính được quản lý.
+- `htmlTitle(): string` — Tạo ra chuỗi tiêu đề an toàn với HTML.
+
+## Kiến trúc
+
+`MetaStatic` hoạt động như một **proxy tĩnh**. Tất cả các cuộc gọi phương thức được chuyển tiếp đến một thực thể `Meta` nội bộ được quản lý thông qua `ServerStorage`.
+
+### Cách ly yêu cầu (SSR)
+
+Bằng cách sử dụng `ServerStorage`, `MetaStatic` đảm bảo rằng trong quá trình Render phía máy chủ (SSR), thông tin meta của một yêu cầu không bị rò rỉ sang yêu cầu khác. Mỗi yêu cầu có một bối cảnh cách ly riêng.
+
+### Ví dụ
+
+```typescript
+import { MetaStatic } from '@dxtmisha/functional-basic';
+
+MetaStatic
+  .setSuffix('Cửa hàng trực tuyến của tôi')
+  .setTitle('Bộ sưu tập mùa hè')
+  .setDescription('Khám phá các sản phẩm mới nhất của chúng tôi.')
+  .setImage('https://example.com/cover.jpg')
+  .setLocale('vi_VN');
+
+console.log(MetaStatic.getTitle()); // "Bộ sưu tập mùa hè"
+document.title; // "Bộ sưu tập mùa hè - Cửa hàng trực tuyến của tôi"
+console.log(MetaStatic.htmlTitle()); // "Bộ sưu tập mùa hè - Cửa hàng trực tuyến của tôi"
+```

package/src/media/functional/functional-basic/classes/ResumableTimer/ResumableTimer.en.mdx

@@ -0,0 +1,50 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/functional-basic/Classes/ResumableTimer - Pausable Timer'/>
+
+# ResumableTimer Class
+
+A class for creating a timer that can be paused, resumed, reset, and cleared. It is useful for UI elements that need to track elapsed time even when interrupted, such as progress bars, auto-closing notifications, or slides.
+
+## Key Features
+
+- **Pause & Resume** — stop the countdown and continue later from the exact millisecond where it left off.
+- **Completion Tracking** — explicitly tracks if the timer has finished its execution.
+- **Robust Logic** — handles edge cases like resuming when time has already elapsed.
+- **Fluent Interface** — methods return `this`, allowing for method chaining.
+
+## Initialization
+
+To initialize the object, call the constructor `ResumableTimer(callback, delay, blockStart)`.
+
+**Parameters:**
+- `callback: FunctionVoid` — the function to be called after the delay.
+- `delay: number = 320` — delay in milliseconds.
+- `blockStart: boolean = false` — if true, the timer will not start immediately.
+
+```typescript
+import { ResumableTimer } from '@dxtmisha/functional-basic'
+
+// 1. Basic initialization (starts immediately)
+const timer = new ResumableTimer(() => {
+  console.log('Timer finished!')
+}, 5000)
+
+// 2. Initialization without starting
+const delayedTimer = new ResumableTimer(
+  () => console.log('Task started!'),
+  3000,
+  true
+)
+
+delayedTimer.resume() // Start it manually
+```
+
+## Methods
+
+### Management
+
+- `resume(): this` — Starts or resumes the timer.
+- `pause(): this` — Pauses the timer and calculates the remaining time.
+- `reset(): this` — Completely clears the current state and restarts the timer with the original delay.
+- `clear(): this` — Completely stops the timer and resets all internal states.

package/src/media/functional/functional-basic/classes/ResumableTimer/ResumableTimer.ru.mdx

@@ -0,0 +1,50 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/functional-basic/Classes/ResumableTimer - Таймер с паузой'/>
+
+# Класс ResumableTimer
+
+Класс для создания таймера, который можно приостанавливать, возобновлять, сбрасывать и очищать. Он полезен для элементов интерфейса, которым необходимо отслеживать прошедшее время даже при прерывании, таких как прогресс-бары, автоматически закрывающиеся уведомления или слайды.
+
+## Ключевые особенности
+
+- **Пауза и возобновление** — останавливает обратный отсчет и продолжает его позже с точностью до миллисекунды.
+- **Отслеживание завершения** — явно отслеживает, закончил ли таймер свое выполнение.
+- **Надежная логика** — обрабатывает крайние случаи, такие как возобновление, когда время уже истекло.
+- **Fluent Interface** — методы возвращают `this`, что позволяет использовать цепочки вызовов.
+
+## Инициализация
+
+Для инициализации объекта вызовите конструктор `ResumableTimer(callback, delay, blockStart)`.
+
+**Параметры:**
+- `callback: FunctionVoid` — функция, которая будет вызвана после задержки.
+- `delay: number = 320` — задержка в миллисекундах.
+- `blockStart: boolean = false` — если true, таймер не запустится сразу.
+
+```typescript
+import { ResumableTimer } from '@dxtmisha/functional-basic'
+
+// 1. Базовая инициализация (запускается сразу)
+const timer = new ResumableTimer(() => {
+  console.log('Таймер завершен!')
+}, 5000)
+
+// 2. Инициализация без немедленного запуска
+const delayedTimer = new ResumableTimer(
+  () => console.log('Задача запущена!'),
+  3000,
+  true
+)
+
+delayedTimer.resume() // Запуск вручную
+```
+
+## Методы
+
+### Управление
+
+- `resume(): this` — Запускает или возобновляет таймер.
+- `pause(): this` — Приостанавливает таймер и вычисляет оставшееся время.
+- `reset(): this` — Полностью сбрасывает текущее состояние и перезапускает таймер с исходной задержкой.
+- `clear(): this` — Полностью останавливает таймер и сбрасывает все внутренние состояния.

package/src/media/functional/functional-basic/classes/ResumableTimer/ResumableTimer.vi.mdx

@@ -0,0 +1,50 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/functional-basic/Classes/ResumableTimer - Bộ hẹn giờ có thể tạm dừng'/>
+
+# Lớp ResumableTimer
+
+Lớp chuyên dùng để tạo bộ hẹn giờ có thể tạm dừng, tiếp tục, thiết lập lại và xóa bỏ. Nó hữu ích cho các thành phần giao diện người dùng cần theo dõi thời gian đã trôi qua ngay cả khi bị gián đoạn, chẳng hạn như thanh tiến trình, thông báo tự động đóng hoặc các slide.
+
+## Các tính năng chính
+
+- **Tạm dừng & Tiếp tục** — dừng đếm ngược và tiếp tục sau đó từ chính xác mili giây đã dừng lại.
+- **Theo dõi hoàn thành** — theo dõi rõ ràng xem bộ hẹn giờ đã kết thúc thực thi hay chưa.
+- **Logic mạnh mẽ** — xử lý các trường hợp biên như tiếp tục khi thời gian đã trôi qua hết.
+- **Giao diện mượt mà (Fluent Interface)** — các phương thức trả về `this`, cho phép gọi chuỗi phương thức.
+
+## Khởi tạo
+
+Để khởi tạo đối tượng, hãy gọi hàm khởi tạo `ResumableTimer(callback, delay, blockStart)`.
+
+**Tham số:**
+- `callback: FunctionVoid` — hàm sẽ được gọi sau khoảng thời gian trễ.
+- `delay: number = 320` — thời gian trễ tính bằng mili giây.
+- `blockStart: boolean = false` — nếu là true, bộ hẹn giờ sẽ không bắt đầu ngay lập tức.
+
+```typescript
+import { ResumableTimer } from '@dxtmisha/functional-basic'
+
+// 1. Khởi tạo cơ bản (bắt đầu ngay lập tức)
+const timer = new ResumableTimer(() => {
+  console.log('Hết giờ!')
+}, 5000)
+
+// 2. Khởi tạo không bắt đầu ngay
+const delayedTimer = new ResumableTimer(
+  () => console.log('Nhiệm vụ bắt đầu!'),
+  3000,
+  true
+)
+
+delayedTimer.resume() // Bắt đầu thủ công
+```
+
+## Các phương thức
+
+### Quản lý
+
+- `resume(): this` — Bắt đầu hoặc tiếp tục bộ hẹn giờ.
+- `pause(): this` — Tạm dừng bộ hẹn giờ và tính toán thời gian còn lại.
+- `reset(): this` — Xóa hoàn toàn trạng thái hiện tại và khởi động lại với độ trễ ban đầu.
+- `clear(): this` — Dừng hoàn toàn bộ hẹn giờ và thiết lập lại tất cả các trạng thái nội bộ.