@dxtmisha/wiki 0.39.6 → 0.39.8

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

@@ -4,31 +4,31 @@ import {Meta} from '@storybook/addon-docs/blocks'
 
 # EventItem Class
 
-A powerful wrapper for managing event listeners on DOM elements or the `window` object. This class simplifies the lifecycle of events (adding, removing, toggling), supports automatic DOM presence checks, and provides built-in optimization for heavy events like `resize` and `scroll`.
+A powerful wrapper for managing event listeners on DOM elements or the `window` object. The class simplifies working with the event lifecycle (add, remove, toggle), supports automatic checking of the element's presence in the DOM, and provides built-in optimization for heavy events such as `resize` and `scroll`.
 
 ## Key Features
 
-- **Lifecycle Management** — convenient `start`, `stop`, `toggle`, and `reset` methods for precise control over event listening.
-- **DOM Safety** — automatic `isInDom` check before executing the listener (can be configured with a control element).
-- **ResizeObserver Support** — built-in handling of the `resize` event for any HTML element using the modern API.
-- **Scroll Optimization** — special `scroll-sync` event type using `requestAnimationFrame` for high performance.
-- **Chaining and Flexibility** — support for method chaining and dynamic target, type, or listener replacement.
-- **Custom Data** — ability to pass and dispatch custom data via `CustomEvent`.
+- **Lifecycle Management** — convenient `start`, `stop`, `toggle`, and `reset` methods to control event listening.
+- **DOM Safety** — automatic `isInDom` check before executing the handler (a control element can be configured).
+- **ResizeObserver Support** — built-in handling of the `resize` event for any HTML elements via a modern API.
+- **Scroll Optimization** — a special `scroll-sync` event type using `requestAnimationFrame` for high performance.
+- **Chaining and Flexibility** — support for call chaining and dynamic changing of the target, type, or event handler.
+- **Custom Data** — the ability to pass and dispatch custom data via `CustomEvent`.
 
 ## Initialization
 
-To initialize the object, call the `EventItem(elementSelector, type, listener, options, detail)` constructor.
+To initialize the object, call the constructor `EventItem(elementSelector, type, listener, options, detail)`.
 
 ### Generic Constraints
 
 To ensure strict typing, the class supports the following generics:
-- `E extends ElementOrWindow` — The type of the element on which events are listened to.
-- `O extends Event` — The event object type.
-- `D extends Record<string, any>` — The structure for additional data.
+- `E extends ElementOrWindow` — The type of element on which events are listened.
+- `O extends Event` — The type of the event object.
+- `D extends Record<string, any>` — The structure of additional data.
 
 **Parameters:**
-- `elementSelector?: ElementOrString<E>` — the target element where the listener is attached.
-- `type: string | string[] = 'click'` — the event type, an array of types, or special types (`'resize'`, `'scroll-sync'`).
+- `elementSelector?: ElementOrString<E>` — the target element on which the listener is attached.
+- `type: string | string[] = 'click'` — event type, array of types, or special types (`'resize'`, `'scroll-sync'`).
 - `listener?: EventListenerDetail<O, D>` — the event handler function.
 - `options?: EventOptions` — standard `addEventListener` options.
 - `detail?: D` — custom data that will be available in the handler.
@@ -36,7 +36,7 @@ To ensure strict typing, the class supports the following generics:
 ```typescript
 import { EventItem } from '@dxtmisha/functional-basic'
 
-// 1. Simple initialization
+// 1. Basic initialization
 const myEvent = new EventItem(
   '.my-button', 
   'click', 
@@ -49,13 +49,13 @@ const customEvent = new EventItem<Window, MouseEvent, MyData>(
   window,
   'mousedown',
   (event, detail) => {
-    console.log('Window clicked, data ID:', detail?.id)
+    console.log('Window click, data ID:', detail?.id)
   },
   { passive: true },
   { id: 42 }
 )
 
-// 3. Activating listeners
+// 3. Activating listening
 myEvent.start()
 customEvent.start()
 ```
@@ -72,27 +72,48 @@ customEvent.start()
 All methods in this group support chaining and automatically call `reset()` if the event is active.
 
 - `setElement(elementSelector?: ElementOrString): this` — Changes the target element.
-- `setElementControl(elementSelector?: ElementOrString): this` — Sets a control element (if missing in DOM, the event won't trigger).
+- `setElementControl(elementSelector?: ElementOrString): this` — Sets the control element (if it is not in the DOM, the event will not fire).
 - `setType(type: string | string[]): this` — Changes the event type.
-- `setListener(listener: Function): this` — Changes the callback function.
-- `setOptions(options?: EventOptions): this` — Changes the listener options.
-- `setDetail(detail?: D): this` — Changes the custom detail data.
+- `setListener(listener: Function): this` — Changes the handler function.
+- `setOptions(options?: EventOptions): this` — Changes the listener parameters.
+- `setDetail(detail?: D): this` — Changes the custom event data.
 
-### Control
+### Management
 
-- `start(): this` — Starts listening for events.
-- `stop(): this` — Stops listening for events.
-- `toggle(activity: boolean): this` — Enables or disables listening based on the flag.
+- `start(): this` — Starts event listening.
+- `stop(): this` — Stops event listening.
+- `toggle(activity: boolean): this` — Enables or disables listening depending on the flag.
 - `reset(): this` — Restarts the event (useful after changing settings).
-- `dispatch(detail?: D): this` — Triggers the event on the target element with data transmission.
+- `dispatch(detail?: D): this` — Triggers the event on the target element with data transfer.
+
+## Types
+
+#### `ElementOrWindow`
+Element on which an event can be attached: `HTMLElement | Window`.
+
+#### `ElementOrString<E>`
+Type for passing an element or its selector: `E | string`.
+
+#### `EventListenerDetail<O, D>`
+Event listener function: `(event: O, detail?: D) => void`.
+
+#### `EventOptions`
+Listening options: `AddEventListenerOptions | boolean | undefined`.
+
+#### `EventActivityItem<E>`
+Internal interface for tracking active listeners.
+- `element: E | undefined` — Target element.
+- `type: string` — Event type.
+- `listener?: (event: any) => void` — Active function.
+- `observer?: ResizeObserver` — Observer instance (for `resize`).
 
 ## Special Events
 
 ### `resize`
-If the event type is set to `resize`, the class automatically uses `ResizeObserver` to track element size changes (even if it's not the `window`).
+If the event type is set to `resize`, the class automatically uses `ResizeObserver` to track changes in the size of the element (even if it is not `window`).
 
 ### `scroll-sync`
-A special type for optimized scrolling. It uses `requestAnimationFrame` internally, preventing redundant handler calls and improving performance.
+A special type for optimized scrolling. Internally uses `requestAnimationFrame`, preventing unnecessary handler calls and increasing performance.
 
 ## Examples
 
@@ -104,7 +125,7 @@ const tracker = new EventItem('.item-1', 'mousemove', (e) => {
 
 tracker.start()
 
-// ... later switch to another element
+// ... switch to another element later
 tracker.setElement('.item-2')
 ```
 

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

@@ -86,6 +86,27 @@ customEvent.start()
 - `reset(): this` — Перезапускает событие (полезно после смены настроек).
 - `dispatch(detail?: D): this` — Вызывает событие на целевом элементе с передачей данных.
 
+## Типы
+
+#### `ElementOrWindow`
+Элемент, на котором может висеть событие: `HTMLElement | Window`.
+
+#### `ElementOrString<E>`
+Тип для передачи элемента или его селектора: `E | string`.
+
+#### `EventListenerDetail<O, D>`
+Функция-обработчик события: `(event: O, detail?: D) => void`.
+
+#### `EventOptions`
+Опции прослушивания: `AddEventListenerOptions | boolean | undefined`.
+
+#### `EventActivityItem<E>`
+Внутренний интерфейс для отслеживания активных слушателей.
+- `element: E | undefined` — Целевой элемент.
+- `type: string` — Тип события.
+- `listener?: (event: any) => void` — Активная функция.
+- `observer?: ResizeObserver` — Инстанс наблюдателя (для `resize`).
+
 ## Специальные события
 
 ### `resize`

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

@@ -1,34 +1,34 @@
 import {Meta} from '@storybook/addon-docs/blocks'
 
-<Meta title='@dxtmisha/vi/functional-basic/Classes/EventItem - Quản lý Sự kiện Nâng cao'/>
+<Meta title='@dxtmisha/vi/functional-basic/Classes/EventItem - Quản lý sự kiện nâng cao'/>
 
 # Lớp EventItem
 
-Một bộ khung (wrapper) mạnh mẽ để quản lý các trình lắng nghe sự kiện (event listeners) trên các phần tử DOM hoặc đối tượng `window`. Lớp này đơn giản hóa vòng đời của sự kiện (thêm, xóa, bật/tắt), hỗ trợ kiểm tra sự tồn tại của phần tử trong DOM và cung cấp các tối ưu hóa tích hợp cho các sự kiện nặng như `resize` và `scroll`.
+Một vỏ bọc mạnh mẽ để quản lý các trình lắng nghe sự kiện trên các phần tử DOM hoặc đối tượng `window`. Lớp này đơn giản hóa việc làm việc với vòng đời sự kiện (thêm, xóa, chuyển đổi), hỗ trợ tự động kiểm tra sự hiện diện của phần tử trong DOM và cung cấp tối ưu hóa tích hợp cho các sự kiện nặng như `resize` và `scroll`.
 
-## Tính năng chính
+## Các tính năng chính
 
-- **Quản lý vòng đời** — các phương thức `start`, `stop`, `toggle` và `reset` tiện lợi để kiểm soát chính xác việc lắng nghe sự kiện.
-- **An toàn DOM** — tự động kiểm tra `isInDom` trước khi thực hiện trình xử lý (có thể cấu hình phần tử kiểm soát).
-- **Hỗ trợ ResizeObserver** — xử lý tích hợp sự kiện `resize` cho bất kỳ phần tử HTML nào bằng API hiện đại.
-- **Tối ưu hóa cuộn** — loại sự kiện đặc biệt `scroll-sync` sử dụng `requestAnimationFrame` để đạt hiệu suất cao.
-- **Chuỗi lệnh và linh hoạt** — hỗ trợ chuỗi lệnh (chaining) và thay đổi động mục tiêu, loại hoặc trình xử lý sự kiện.
-- **Dữ liệu tùy chỉnh** — khả năng truyền và phát tán dữ liệu tùy chỉnh thông qua `CustomEvent`.
+- **Quản lý vòng đời** — các phương thức `start`, `stop`, `toggle` và `reset` thuận tiện để kiểm soát việc lắng nghe sự kiện.
+- **An toàn DOM** — tự động kiểm tra `isInDom` trước khi thực thi trình xử lý (có thể cấu hình phần tử điều khiển).
+- **Hỗ trợ ResizeObserver** — xử lý tích hợp sự kiện `resize` cho bất kỳ phần tử HTML nào thông qua API hiện đại.
+- **Tối ưu hóa cuộn** — kiểu sự kiện `scroll-sync` đặc biệt sử dụng `requestAnimationFrame` cho hiệu suất cao.
+- **Chaining và linh hoạt** — hỗ trợ nối chuỗi cuộc gọi và thay đổi động đích, kiểu hoặc trình xử lý sự kiện.
+- **Dữ liệu tùy chỉnh** — khả năng truyền và điều phối dữ liệu tùy chỉnh thông qua `CustomEvent`.
 
 ## Khởi tạo
 
-Để khởi tạo đối tượng, hãy gọi hàm khởi tạo `EventItem(elementSelector, type, listener, options, detail)`.
+Để khởi tạo đối tượng, hãy gọi constructor `EventItem(elementSelector, type, listener, options, detail)`.
 
-### Ràng buộc Generic (Generic Constraints)
+### Các ràng buộc Generic (Generic Constraints)
 
-Để đảm bảo định kiểu nghiêm ngặt, lớp này hỗ trợ các generic sau:
-- `E extends ElementOrWindow` — Kiểu của phần tử nơi các sự kiện được lắng nghe.
-- `O extends Event` — Kiểu đối tượng sự kiện.
-- `D extends Record<string, any>` — Cấu trúc dữ liệu bổ sung.
+Để đảm bảo kiểu nghiêm ngặt, lớp hỗ trợ các generic sau:
+- `E extends ElementOrWindow` — Kiểu phần tử mà các sự kiện được lắng nghe.
+- `O extends Event` — Kiểu của đối tượng sự kiện.
+- `D extends Record<string, any>` — Cấu trúc của dữ liệu bổ sung.
 
 **Tham số:**
-- `elementSelector?: ElementOrString<E>` — phần tử đích nơi trình lắng nghe được gắn vào.
-- `type: string | string[] = 'click'` — loại sự kiện, một mảng các loại hoặc các loại đặc biệt (`'resize'`, `'scroll-sync'`).
+- `elementSelector?: ElementOrString<E>` — phần tử đích mà trình lắng nghe được đính kèm.
+- `type: string | string[] = 'click'` — kiểu sự kiện, mảng các kiểu hoặc các kiểu đặc biệt (`'resize'`, `'scroll-sync'`).
 - `listener?: EventListenerDetail<O, D>` — hàm xử lý sự kiện.
 - `options?: EventOptions` — các tùy chọn `addEventListener` tiêu chuẩn.
 - `detail?: D` — dữ liệu tùy chỉnh sẽ có sẵn trong trình xử lý.
@@ -36,63 +36,84 @@ Một bộ khung (wrapper) mạnh mẽ để quản lý các trình lắng nghe
 ```typescript
 import { EventItem } from '@dxtmisha/functional-basic'
 
-// 1. Khởi tạo đơn giản
+// 1. Khởi tạo cơ bản
 const myEvent = new EventItem(
   '.my-button', 
   'click', 
-  (event) => console.log('Sự kiện được kích hoạt:', event.type)
+  (event) => console.log('Sự kiện đã kích hoạt:', event.type)
 )
 
-// 2. Sử dụng generic để định kiểu nghiêm ngặt
+// 2. Sử dụng generic cho kiểu nghiêm ngặt
 interface MyData { id: number }
 const customEvent = new EventItem<Window, MouseEvent, MyData>(
   window,
   'mousedown',
   (event, detail) => {
-    console.log('Cửa sổ được nhấn, ID dữ liệu:', detail?.id)
+    console.log('Nhấp vào cửa sổ, ID dữ liệu:', detail?.id)
   },
   { passive: true },
   { id: 42 }
 )
 
-// 3. Kích hoạt trình lắng nghe
+// 3. Kích hoạt lắng nghe
 myEvent.start()
 customEvent.start()
 ```
 
-## Phương thức
+## Các phương thức
 
 ### Thông tin
 
-- `isActive(): boolean` — Kiểm tra xem việc lắng nghe sự kiện có đang hoạt động hay không.
-- `getElement(): E | undefined` — Trả về phần tử mục tiêu hiện tại.
+- `isActive(): boolean` — Kiểm tra xem việc lắng nghe sự kiện hiện có đang hoạt động hay không.
+- `getElement(): E | undefined` — Trả về phần tử đích hiện tại.
 
 ### Cấu hình (Setters)
 
-Tất cả các phương thức trong nhóm này đều hỗ trợ chuỗi lệnh và tự động gọi `reset()` nếu sự kiện đang hoạt động.
+Tất cả các phương thức trong nhóm này đều hỗ trợ nối chuỗi và tự động gọi `reset()` nếu sự kiện đang hoạt động.
 
-- `setElement(elementSelector?: ElementOrString): this` — Thay đổi phần tử mục tiêu.
-- `setElementControl(elementSelector?: ElementOrString): this` — Thiết lập phần tử kiểm soát (nếu thiếu trong DOM, sự kiện sẽ không kích hoạt).
-- `setType(type: string | string[]): this` — Thay đổi loại sự kiện.
+- `setElement(elementSelector?: ElementOrString): this` — Thay đổi phần tử đích.
+- `setElementControl(elementSelector?: ElementOrString): this` — Thiết lập phần tử điều khiển (nếu nó không có trong DOM, sự kiện sẽ không kích hoạt).
+- `setType(type: string | string[]): this` — Thay đổi kiểu sự kiện.
 - `setListener(listener: Function): this` — Thay đổi hàm xử lý.
-- `setOptions(options?: EventOptions): this` — Thay đổi các tùy chọn của trình lắng nghe.
-- `setDetail(detail?: D): this` — Thay đổi dữ liệu tùy chỉnh của sự kiện.
+- `setOptions(options?: EventOptions): this` — Thay đổi các tham số trình lắng nghe.
+- `setDetail(detail?: D): this` — Thay đổi dữ liệu sự kiện tùy chỉnh.
 
-### Điều khiển
+### Quản lý
 
-- `start(): this` — Bắt đầu lắng nghe các sự kiện.
-- `stop(): this` — Dừng lắng nghe các sự kiện.
-- `toggle(activity: boolean): this` — Bật hoặc tắt việc lắng nghe dựa trên cờ hiệu.
+- `start(): this` — Bắt đầu lắng nghe sự kiện.
+- `stop(): this` — Dừng lắng nghe sự kiện.
+- `toggle(activity: boolean): this` — Bật hoặc tắt lắng nghe tùy thuộc vào cờ.
 - `reset(): this` — Khởi động lại sự kiện (hữu ích sau khi thay đổi cài đặt).
-- `dispatch(detail?: D): this` — Kích hoạt sự kiện trên phần tử mục tiêu với việc truyền dữ liệu.
+- `dispatch(detail?: D): this` — Kích hoạt sự kiện trên phần tử đích với việc truyền dữ liệu.
+
+## Các kiểu dữ liệu
+
+#### `ElementOrWindow`
+Phần tử mà sự kiện có thể được đính kèm: `HTMLElement | Window`.
+
+#### `ElementOrString<E>`
+Kiểu để truyền một phần tử hoặc bộ chọn của nó: `E | string`.
+
+#### `EventListenerDetail<O, D>`
+Hàm lắng nghe sự kiện: `(event: O, detail?: D) => void`.
+
+#### `EventOptions`
+Các tùy chọn lắng nghe: `AddEventListenerOptions | boolean | undefined`.
+
+#### `EventActivityItem<E>`
+Giao diện nội bộ để theo dõi các trình lắng nghe đang hoạt động.
+- `element: E | undefined` — Phần tử đích.
+- `type: string` — Kiểu sự kiện.
+- `listener?: (event: any) => void` — Hàm đang hoạt động.
+- `observer?: ResizeObserver` — Thực thể observer (cho `resize`).
 
 ## Các sự kiện đặc biệt
 
 ### `resize`
-Nếu loại sự kiện được đặt là `resize`, lớp sẽ tự động sử dụng `ResizeObserver` để theo dõi các thay đổi kích thước của phần tử (ngay cả khi đó không phải là `window`).
+Nếu kiểu sự kiện được đặt thành `resize`, lớp sẽ tự động sử dụng `ResizeObserver` để theo dõi những thay đổi về kích thước của phần tử (ngay cả khi đó không phải là `window`).
 
 ### `scroll-sync`
-Một loại đặc biệt để tối ưu hóa việc cuộn. Nó sử dụng `requestAnimationFrame` nội bộ, ngăn chặn các cuộc gọi trình xử lý dư thừa và cải thiện hiệu suất.
+Một kiểu đặc biệt cho việc cuộn tối ưu hóa. Bên trong sử dụng `requestAnimationFrame`, ngăn chặn các cuộc gọi trình xử lý không cần thiết và tăng hiệu suất.
 
 ## Ví dụ
 
@@ -104,20 +125,20 @@ const tracker = new EventItem('.item-1', 'mousemove', (e) => {
 
 tracker.start()
 
-// ... sau đó chuyển sang phần tử khác
+// ... chuyển sang phần tử khác sau đó
 tracker.setElement('.item-2')
 ```
 
-### Sử dụng CustomEvent với Dữ liệu
+### Sử dụng CustomEvent với dữ liệu
 ```javascript
 const emitter = new EventItem(window, 'my-custom-event')
 
 emitter.setListener((e, detail) => {
-  console.log('Dữ liệu nhận được:', e.detail) // dữ liệu từ CustomEvent
+  console.log('Dữ liệu đã nhận:', e.detail) // dữ liệu từ CustomEvent
 })
 
 emitter.start()
 
-// Phát tán sự kiện
+// Điều phối sự kiện
 emitter.dispatch({ userId: 123, action: 'refresh' })
 ```

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

@@ -4,34 +4,34 @@ import {Meta} from '@storybook/addon-docs/blocks'
 
 # Formatters Class
 
-A specialized class for formatting lists of data based on provided configuration. It acts as a bridge between raw data and localized, human-readable strings, leveraging the `GeoIntl` singleton for consistent formatting across different locales.
+A specialized class for formatting data lists based on a provided configuration. It serves as a bridge between raw data and localized, human-readable strings, utilizing the `GeoIntl` singleton for consistent formatting across different locales.
 
 ## Key Features
 
-- **Declarative Configuration** — Define formatting rules once and apply them to an entire dataset.
-- **Support for Multiple Types** — Built-in support for currency, dates, names, numbers, plurals, and units.
-- **Custom Transformations** — Ability to provide custom functions for unique formatting needs.
-- **Type Safety** — Full TypeScript support for items, options, and resulting formatted lists.
-- **Automatic Key Generation** — Automatically adds formatted values to items with a `Format` suffix (e.g., `price` becomes `priceFormat`).
+- **Declarative Configuration** — Define formatting rules once and apply them to the entire dataset.
+- **Support for Multiple Types** — Built-in support for currencies, dates, names, numbers, plurals, and units.
+- **Custom Transformations** — The ability to provide your own functions for unique formatting needs.
+- **Typing** — Full TypeScript support for items, parameters, and resulting formatted lists.
+- **Automatic Key Generation** — Automatically adds formatted values to items with the `Format` suffix (e.g., `price` becomes `priceFormat`).
 
 ## Initialization
 
-To initialize the object, call the `Formatters(options, list)` constructor.
+To initialize the object, call the constructor `Formatters(options, list)`.
 
 ### Generic Constraints
 
-- `Options extends FormattersOptionsList` — type of formatting options.
-- `List extends FormattersList<FormattersListItem> | FormattersListItem` — type of the input data (array or single item).
-- `Item extends (List extends any[] ? List[number] : List)` — type of a single item in the list.
+- `Options extends FormattersOptionsList` — type of formatting parameters.
+- `List extends FormattersListProp` — type of input data (array or single item).
+- `Item extends FormattersItemProp<List>` — type of a single item in the list.
 
 **Parameters:**
-- `options: Options` — formatting options for each column/property.
-- `list?: List` — initial list of data to format.
+- `options: Options` — formatting parameters for each column/property.
+- `list?: List` — initial data list for formatting.
 
 ```typescript
 import { Formatters } from '@dxtmisha/functional-basic'
 
-// 1. Define formatting options
+// 1. Defining formatting parameters
 const options = {
   price: { 
     type: 'currency', 
@@ -44,31 +44,17 @@ const options = {
   user: {
     type: 'name',
     options: { lastPropName: 'surname', firstPropName: 'name' }
-  },
-  weight: { 
-    type: 'unit', 
-    options: { unit: 'kilogram' } 
-  },
-  count: { 
-    type: 'plural', 
-    options: { words: 'apple|apples' } 
-  },
-  status: {
-    transformation: (value: number) => value === 1 ? 'Active' : 'Inactive'
   }
 }
 
-// 2. Initial data (can be an array or a single object)
+// 2. Raw data
 const data = [
   {
     price: 100,
     currency: 'USD',
     created: '2024-03-07T12:00:00',
     name: 'John',
-    surname: 'Doe',
-    weight: 75,
-    count: 5,
-    status: 1
+    surname: 'Doe'
   }
 ]
 
@@ -76,93 +62,95 @@ const data = [
 const formatter = new Formatters(options, data)
 ```
 
-## Processing Data
+## Methods
 
-### `to`
+### Processing
+- `to(): FormattersReturn<List, Options>` — Processes the data and returns the result. If the input was an array, returns a new array of enriched items. If it was a single item — a single object. Adds properties with the `Format` suffix.
 
-Processes the data and returns the result. If the input was an array, it returns a new array of enriched items. If the input was a single item, it returns that single enriched item.
+### Configuration
+- `setList(list?: List): this` — Updates the data for formatting. Supports chaining.
 
-**Returns:** `FormattersListColumns<Item, Options> | FormattersListColumnItem<Item, Options>` — enriched data with additional `*Format` properties.
+### Information
+- `is(): boolean` — Checks if data is set for processing.
+- `isArray(): boolean` — Whether the current data is an array.
+- `length(): number` — Returns the count of records in the list.
+- `getList(): FormattersList<Item>` — Returns the current list as an array.
+- `getOptions(): Options` — Returns the current formatting configuration.
+
+## Formatting Types and Parameters
+
+The `FormattersOptionsList` configuration is a dictionary where keys correspond to property names in the data (dot notation `path.to.prop` is supported), and values are `FormattersOptionsItem` objects.
+
+### General Structure of `FormattersOptionsItem`
+- `type?: FormattersType` — Formatter type.
+- `transformation?: (value, item, options) => string` — Custom transformation function.
+- `options?: Options` — Parameter object, the structure of which depends on the selected `type`.
+
+### Detailed Type Description
+
+#### 1. Currency (`currency`)
+Used for localized display of monetary values.
+- `currencyPropName?: string` — Property name in the item from which the currency code is taken (default is `currency`).
+- `options?: string | Intl.NumberFormatOptions` — You can pass a fixed code (e.g., `'USD'`) or an `Intl.NumberFormat` settings object.
+- `numberOnly?: boolean` — If `true`, returns only the formatted number without the currency symbol.
+
+#### 2. Date (`date`)
+Formatting dates and times via `GeoIntl`.
+- `type?: GeoDate` — Preset format:
+    - `full` — Full date and time.
+    - `datetime` — Date and time (without seconds).
+    - `date` — Date only.
+    - `time` — Time only.
+    - `year-month`, `year`, `month`, `day`, `day-month`, `hour-minute`.
+- `options?: Intl.DateTimeFormatOptions` — Standard `Intl` parameters (e.g., `month: 'long'`).
+- `hour24?: boolean` — If `true`, forces 24-hour mode.
+
+#### 3. Name (`name`)
+Combines full name parts in the correct order.
+- `lastPropName?: string` — Field for the last name (default is `lastName`).
+- `firstPropName?: string` — Field for the first name (default is `firstName`).
+- `surname?: string` — Field for the middle name/surname (default is `surname`).
+- `short?: boolean` — If `true`, outputs the last name and initials (e.g., "Doe J.").
+
+#### 4. Number (`number`)
+Standard number formatting with digit separation.
+- `options?: Intl.NumberFormatOptions` — `Intl` parameters (number of decimal places, style, etc.).
+
+#### 5. Plural (`plural`)
+Choosing the correct word form depending on the number.
+- `words: string` — Word forms via the `|` separator.
+    - For English: `"apple|apples"`.
+    - For Russian: `"яблоко|яблока|яблок"`.
+- `options?: Intl.PluralRulesOptions` — Pluralization rule settings.
+- `optionsNumber?: Intl.NumberFormatOptions` — Settings for formatting the number itself that is output before the word.
+
+#### 6. Unit (`unit`)
+Adding units of measurement (km, kg, l).
+- `unit: string` — Unit of measurement code (e.g., `'kilometer'`, `'kilogram'`, `'liter'`).
+- `options?: Intl.NumberFormatOptions` — Formatting parameters for the numeric part.
+
+## Examples
+
+### Using Dot Notation
+```typescript
+const options = {
+  'user.profile.age': { type: 'number' }
+}
+const data = { user: { profile: { age: 25 } } }
+const formatter = new Formatters(options, data)
 
-```javascript
 const result = formatter.to()
-/*
-Result (if array): [
-  { 
-    id: 101, 
-    price: 100, 
-    currency: 'USD', 
-    priceFormat: '$100.00', 
-    status: 1, 
-    statusFormat: 'Active',
-    ... 
-  }
-]
-
-Result (if single item): { 
-  price: 100, 
-  priceFormat: '$100.00', 
-  ... 
-}
-*/
+// result.userProfileAgeFormat === "25"
 ```
 
-## Retrieval and Data Management
-
-- `is(): boolean` — Checks if the list/item is set.
-- `isArray(): boolean` — Checks if the current data is an array.
-- `length(): number` — Returns the count of records in the list.
-- `getList(): Item[]` — Returns the current list of data as an array.
-- `getOptions(): Options` — Returns the current formatting configuration mapping.
-- `setList(list?: List): this` — Updates the data and returns the instance for chaining.
-
-## Configuration Structure
-
-The configuration object passed to the constructor is a map where each key corresponds to a property name in your data. Each value must follow the `FormattersOptionsItem` structure.
-
-### Main Item Structure
-
+### Custom Transformation
 ```typescript
-{
-  // 1. Specify the formatting type
-  type: 'currency' | 'date' | 'name' | 'number' | 'plural' | 'unit',
-
-  // 2. Pass type-specific parameters here
-  options: { ... },
-
-  // 3. Or use a custom function (overrides type-specific logic)
-  transformation: (value, item, options) => string
+const options = {
+  status: {
+    // Custom function takes precedence over type
+    transformation: (value, item) => {
+       return value === 'active' ? `✅ ${item.name} is online` : '❌ Offline'
+    }
+  }
 }
 ```
-
-## Specific Parameters
-
-Below are the parameters available within the **`options`** property for each type.
-
-### Currency (`currency`)
-- `currencyPropName?: string` — Property in the item containing the currency code (defaults to `item.currency`).
-- `options?: string | Intl.NumberFormatOptions` — Fixed currency code or full `Intl` options.
-- `numberOnly?: boolean` — If `true`, returns only the formatted number without the symbol.
-
-### Date (`date`)
-- `type?: GeoDate` — Preset type: `full`, `datetime`, `date`, `year-month`, `year`, `month`, `day`, `day-month`, `time`, `hour-minute`, `hour`, `minute`, `second`.
-- `options?: Intl.DateTimeFormatOptions['month'] | Intl.DateTimeFormatOptions` — Additional `Intl` date options or month style.
-- `hour24?: boolean` — Forces 24-hour format if `true`.
-
-### Name (`name`)
-- `lastPropName?: string` — Field for last name (default: `lastName`).
-- `firstPropName?: string` — Field for first name (default: `firstName`).
-- `surname?: string` — Field for surname (default: `surname`).
-- `short?: boolean` — Whether to use short format (initials).
-
-### Number (`number`)
-- `options?: Intl.NumberFormatOptions` — Standard `Intl` number options.
-
-### Plural (`plural`)
-- `words: string` — Word forms separated by `|` (e.g., `"apple|apples"`).
-- `options?: Intl.PluralRulesOptions` — Plural rule settings.
-- `optionsNumber?: Intl.NumberFormatOptions` — Formatting for the number itself.
-
-### Unit (`unit`)
-- `unit: string | Intl.NumberFormatOptions` — The unit to display (e.g., `'kilometer'`, `'kilogram'`).
-