@dxtmisha/wiki 0.65.0 → 0.67.0

package/src/media/functional/scripts/bin/dxt-constructor/design-constructor.ru.mdx

@@ -0,0 +1,48 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/scripts/bin/dxt-constructor - Генерация конструкторов компонентов'/>
+
+# dxt-constructor
+
+Команда `dxt-constructor` обеспечивает автоматическую генерацию файлов ядра конструкторов компонентов, типов, конфигураций свойств и точек входа библиотеки в дизайн-системе. Под капотом она использует `DesignConstructors` и `DesignConstructor` для оркестрации массовой или целевой инициализации компонентов.
+
+## Ключевые возможности
+
+- **Целевая или массовая генерация**: Может инициализировать все компоненты внутри директории конструкторов или обрабатывать конкретный компонент, переданный в качестве аргумента.
+- **Объединение стилей**: Автоматически генерирует и агрегирует экспорты SCSS компонентов в централизованном файле `packages/library/style.scss`.
+- **Полная генерация кода и типов**: Автоматически создает файлы конфигурации свойств (`properties.json`), файлы типов (`types.ts`, `basicTypes.ts`), стили (`style.scss`), файлы кода (`Constructors.ts`, `ConstructorsDesign.tsx`) и индексный файл экспортов (`index.ts`).
+
+## Как это работает?
+
+Процесс генерации конструкторов автоматизирует интеграцию компонентов:
+
+1. Скрипт определяет имя целевого компонента, переданное в качестве аргумента, либо автоматически сканирует настроенную директорию системы для получения имен всех компонентов.
+2. Он очищает общий кэш свойств `PropertiesCache`, чтобы гарантировать использование актуальных конфигурационных состояний при генерации.
+3. Для каждого компонента вызывается генератор `DesignConstructor` для создания JSON свойств, типов свойств TypeScript, базовых типов, стилей, файлов кода и структуры индексного файла.
+4. Он перебирает все папки компонентов для сбора их индивидуальных стилей и объединяет их в единый набор правил `@forward`.
+5. Он обновляет экспорты в `package.json`, чтобы предоставить доступ к точкам входа компонентов, и создает файлы сопоставления библиотеки.
+
+## Настройка и запуск
+
+Для работы генератора не требуются сложные конфигурации. Инструмент спроектирован так, чтобы сканировать директории конструкторов и беспрепятственно интегрировать их в рабочую среду.
+
+Чтобы сгенерировать все конструкторы компонентов в рабочем пространстве, выполните:
+```bash
+npx dxt-constructor
+```
+
+Чтобы сгенерировать конкретный компонент (например, `Button`), передайте его имя в качестве аргумента:
+```bash
+npx dxt-constructor Button
+```
+
+## Структура генерируемых файлов
+
+Когда конструктор компонента инициализируется или обновляется, инструмент создает следующие файлы в его директории:
+
+- `properties.json`: Содержит необработанную конфигурацию свойств компонента.
+- `props.ts`: Определяет структуры пропсов React/Vue на основе конфигураций.
+- `types.ts` & `basicTypes.ts`: Содержат стандартные типы TypeScript.
+- `style.scss`: Управляет базовыми стилями SCSS компонента.
+- `Constructors.ts` & `ConstructorsDesign.tsx`: Содержат основной код поведения конструктора.
+- `index.ts`: Экспортирует публичные интерфейсы и классы.

package/src/media/functional/scripts/bin/dxt-constructor/design-constructor.vi.mdx

@@ -0,0 +1,48 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/scripts/bin/dxt-constructor - Tạo Khung Bộ Dựng Thành Phần'/>
+
+# dxt-constructor
+
+Lệnh `dxt-constructor` cung cấp khả năng tự động tạo sinh các tệp cốt lõi của bộ dựng thành phần (constructor), kiểu dữ liệu (types), cấu hình thuộc tính (properties) và các điểm xuất thư viện cho các thành phần trong hệ thống thiết kế. Lệnh này sử dụng `DesignConstructors` và `DesignConstructor` làm nền tảng để điều phối quá trình khởi tạo hàng loạt hoặc khởi tạo riêng biệt cho một thành phần.
+
+## Các tính năng chính
+
+- **Tạo sinh Mục tiêu hoặc Hàng loạt**: Có khả năng khởi tạo tất cả các thành phần bên trong thư mục chứa bộ dựng hoặc tập trung khởi tạo duy nhất cho một thành phần được truyền dưới dạng đối số.
+- **Hợp nhất Phong cách**: Tự động tạo sinh và tổng hợp các xuất SCSS của thành phần vào tệp tập trung `packages/library/style.scss`.
+- **Tạo sinh Mã nguồn & Kiểu dữ liệu Đầy đủ**: Tự động tạo các cấu hình thuộc tính (`properties.json`), kiểu dữ liệu (`types.ts`, `basicTypes.ts`), tệp phong cách thành phần (`style.scss`), các tệp mã nguồn (`Constructors.ts`, `ConstructorsDesign.tsx`) và cấu trúc tệp xuất (`index.ts`).
+
+## Nó hoạt động như thế nào?
+
+Quy trình tạo khung bộ dựng tự động hóa quá trình tích hợp các thành phần:
+
+1. Tập lệnh nhận dạng tên thành phần mục tiêu được truyền làm đối số hoặc tự động quét thư mục hệ thống đã được cấu hình để thu thập tất cả tên thành phần.
+2. Tiến hành xóa bộ nhớ đệm thuộc tính dùng chung `PropertiesCache` để đảm bảo quá trình tạo sinh sử dụng các trạng thái cấu hình hoàn toàn cập nhật mới nhất.
+3. Đối với mỗi thành phần, nó triệu gọi trình tạo `DesignConstructor` để xây dựng cấu trúc thuộc tính JSON, các kiểu dữ liệu TypeScript cho thuộc tính, kiểu dữ liệu cơ bản, phong cách, các tệp mã và cấu trúc tệp chỉ mục.
+4. Lặp qua tất cả thư mục thành phần để thu thập phong cách riêng biệt của từng thành phần và biên dịch chúng thành một bộ quy tắc `@forward` tập trung.
+5. Cập nhật các xuất của `package.json` để hiển thị các điểm xuất của thành phần và viết các tệp ánh xạ thư viện tương ứng.
+
+## Cách thiết lập và khởi chạy
+
+Toàn bộ quy trình sẽ không thiết lập ràng buộc với những cấu hình phức tạp. Công cụ này chủ động quét các thư mục bộ dựng và tích hợp chúng vào không gian làm việc một cách liền mạch.
+
+Để thiết lập cấu trúc khung cho tất cả các bộ dựng thành phần trong vùng làm việc, hãy chạy:
+```bash
+npx dxt-constructor
+```
+
+Để nhắm mục tiêu vào một thành phần cụ thể (ví dụ: `Button`), hãy truyền tên thành phần đó làm đối số:
+```bash
+npx dxt-constructor Button
+```
+
+## Cấu trúc tệp được tạo sinh
+
+Khi một bộ dựng thành phần được khởi tạo hoặc cập nhật, công cụ sẽ tự động thiết lập cấu trúc khung gồm các tệp sau bên trong thư mục của nó:
+
+- `properties.json`: Lưu giữ cấu hình thuộc tính thô của thành phần.
+- `props.ts`: Định nghĩa cấu trúc prop cho React/Vue dựa trên cấu hình thuộc tính.
+- `types.ts` & `basicTypes.ts`: Chứa các định dạng kiểu dữ liệu TypeScript chuẩn.
+- `style.scss`: Quản lý phong cách SCSS cơ bản của thành phần.
+- `Constructors.ts` & `ConstructorsDesign.tsx`: Chứa mã nguồn hành vi cốt lõi của bộ dựng.
+- `index.ts`: Hiển thị các giao diện và xuất công khai.

package/src/media/functional/scripts/bin/dxt-figma-layout/design-figma.en.mdx

@@ -0,0 +1,45 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/scripts/bin/dxt-figma-layout - Figma Layout Integrator'/>
+
+# dxt-figma-layout
+
+The `dxt-figma-layout` command provides CLI access for fetching components layout and image structures directly from Figma. It utilizes the `DesignFigma` orchestrator and `FigmaApi` client internally to extract SVG image assets based on target Figma keys and node IDs.
+
+> **Warning**: A corporate Figma subscription (Figma Enterprise or Organization) is strictly required to execute this command and fetch target layout assets.
+
+## Key Features
+
+- **Automated Image Fetching**: Retrieves target vector and raster layouts from Figma files in clean SVG format.
+- **Config-Driven Authentication**: Automatically extracts the Figma API access token from the system configurations.
+- **Flexible Arguments Support**: Allows targeting specific files and specific nodes dynamically through CLI parameters.
+
+## How does it work?
+
+The layout integration workflow automates asset retrieval:
+
+1. The script reads the target Figma file key and optional node identifier passed directly from the command line arguments.
+2. It instantiates the `DesignFigma` controller, passing the target parameters along with the automatically resolved system Figma token.
+3. The underlying `FigmaApi` client issues a secure HTTP request to Figma's `fileImages` endpoint, requesting the nodes in SVG format with specific ID preservation parameters.
+4. It receives the image mapping containing URLs for the compiled assets and prints the resulting JSON map directly to the console.
+
+## How to configure and run
+
+No complex setup is required to run the layout integrator. Ensure that your Figma API token is configured in the environment or properties configuration before execution.
+
+To retrieve layout images, execute the command passing your Figma file key and specific node ID:
+```bash
+npx dxt-figma-layout [fileKey] [nodeId]
+```
+
+Example:
+```bash
+npx dxt-figma-layout abc123xyz456 1-24
+```
+
+## CLI Arguments
+
+The command accepts two positional parameters:
+
+- `fileKey`: The unique identifier of the Figma file (typically found in the Figma file URL).
+- `nodeId`: The specific node ID inside the file (e.g. `1-24` or `1:24`) to fetch.

package/src/media/functional/scripts/bin/dxt-figma-layout/design-figma.ru.mdx

@@ -0,0 +1,45 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/scripts/bin/dxt-figma-layout - Интеграция макетов Figma'/>
+
+# dxt-figma-layout
+
+Команда `dxt-figma-layout` предоставляет интерфейс командной строки (CLI) для получения структуры макетов и изображений компонентов напрямую из Figma. Под капотом она использует оркестратор `DesignFigma` и клиент `FigmaApi` для извлечения векторных SVG-ресурсов на основе переданных ключей файлов и идентификаторов узлов (Node ID).
+
+> **Внимание**: Для выполнения этой команды и извлечения макетов строго требуется наличие корпоративной подписки Figma (Figma Enterprise или Organization).
+
+## Ключевые возможности
+
+- **Автоматическое получение изображений**: Извлекает векторные макеты из файлов Figma в чистом формате SVG.
+- **Конфигурационная аутентификация**: Автоматически извлекает токен доступа Figma API из системных конфигураций.
+- **Гибкая поддержка аргументов**: Позволяет динамически нацеливаться на конкретные файлы и узлы через параметры командной строки.
+
+## Как это работает?
+
+Процесс интеграции макетов автоматизирует извлечение ресурсов:
+
+1. Скрипт считывает ключ файла Figma и необязательный идентификатор узла, переданные непосредственно в качестве аргументов командной строки.
+2. Он инициализирует контроллер `DesignFigma`, передавая целевые параметры вместе с автоматически определенным системным токеном Figma.
+3. Внутренний клиент `FigmaApi` отправляет безопасный HTTP-запрос к эндпоинту `fileImages` Figma, запрашивая узлы в формате SVG с сохранением исходных идентификаторов.
+4. Он получает карту сопоставления изображений с URL-адресами сгенерированных ресурсов и выводит итоговый JSON-объект прямо в консоль.
+
+## Настройка и запуск
+
+Для работы интегратора макетов не требуется сложная предварительная настройка. Перед запуском убедитесь, что ваш API-токен Figma настроен в системной среде или файле конфигурации.
+
+Чтобы получить изображения макетов, выполните команду, передав ключ файла Figma и идентификатор узла:
+```bash
+npx dxt-figma-layout [fileKey] [nodeId]
+```
+
+Пример:
+```bash
+npx dxt-figma-layout abc123xyz456 1-24
+```
+
+## Аргументы CLI
+
+Команда принимает два позиционных параметра:
+
+- `fileKey`: Уникальный идентификатор файла Figma (обычно находится в URL-адресе файла Figma).
+- `nodeId`: Конкретный идентификатор узла внутри файла (например, `1-24` или `1:24`) для извлечения.

package/src/media/functional/scripts/bin/dxt-figma-layout/design-figma.vi.mdx

@@ -0,0 +1,45 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/scripts/bin/dxt-figma-layout - Tích hợp Layout Figma'/>
+
+# dxt-figma-layout
+
+Lệnh `dxt-figma-layout` cung cấp giao diện dòng lệnh (CLI) để truy xuất cấu trúc layout và hình ảnh thành phần trực tiếp từ Figma. Lệnh này sử dụng bộ điều phối `DesignFigma` và ứng dụng khách `FigmaApi` ở bên dưới để trích xuất các tài nguyên ảnh vector SVG dựa trên khóa tệp và ID nút Figma mục tiêu.
+
+> **Lưu ý**: Yêu cầu bắt buộc phải có gói đăng ký Figma doanh nghiệp (Figma Enterprise hoặc Organization) để thực thi lệnh này và truy xuất các tài nguyên layout.
+
+## Các tính năng chính
+
+- **Tự động Truy xuất Hình ảnh**: Thu thập các layout vector và raster mục tiêu từ tệp Figma dưới định dạng SVG sạch.
+- **Xác thực dựa trên Cấu hình**: Tự động trích xuất mã thông báo (token) truy cập Figma API từ cấu hình hệ thống.
+- **Hỗ trợ Đối số Linh hoạt**: Cho phép nhắm mục tiêu động vào các tệp cụ thể và nút cụ thể thông qua tham số dòng lệnh.
+
+## Nó hoạt động như thế nào?
+
+Quy trình tích hợp layout tự động hóa việc truy xuất tài nguyên:
+
+1. Tập lệnh đọc khóa tệp Figma mục tiêu và mã định danh nút tùy chọn được truyền trực tiếp từ các đối số dòng lệnh.
+2. Nó khởi tạo bộ điều khiển `DesignFigma`, truyền các tham số mục tiêu cùng với mã thông báo Figma hệ thống được tự động phân giải.
+3. Ứng dụng khách `FigmaApi` gửi một yêu cầu HTTP an toàn đến điểm cuối `fileImages` của Figma, yêu cầu các nút ở định dạng SVG với các tham số bảo toàn ID cụ thể.
+4. Nó nhận về bản đồ hình ảnh chứa các URL cho tài nguyên đã biên dịch và in kết quả bản đồ JSON trực tiếp ra bảng điều khiển (console).
+
+## Cách thiết lập và khởi chạy
+
+Không yêu cầu thiết lập phức tạp để chạy bộ tích hợp layout. Hãy đảm bảo rằng mã thông báo Figma API của bạn được cấu hình trong môi trường hoặc cấu hình thuộc tính trước khi thực thi.
+
+Để truy xuất hình ảnh layout, hãy chạy lệnh truyền vào khóa tệp Figma và ID nút cụ thể:
+```bash
+npx dxt-figma-layout [fileKey] [nodeId]
+```
+
+Ví dụ:
+```bash
+npx dxt-figma-layout abc123xyz456 1-24
+```
+
+## Đối số CLI
+
+Lệnh chấp nhận hai tham số vị trí:
+
+- `fileKey`: Mã định danh duy nhất của tệp Figma (thường tìm thấy trong URL tệp Figma).
+- `nodeId`: ID nút cụ thể bên trong tệp (ví dụ: `1-24` hoặc `1:24`) cần truy xuất.

package/src/media/functional/scripts/bin/dxt-flags/design-flags.en.mdx

@@ -0,0 +1,41 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/scripts/bin/dxt-flags - Flag Sprite Generator'/>
+
+# dxt-flags
+
+The `dxt-flags` command provides an automated utility to compile a directory of SVG flag icons into a single optimized WebP sprite image and generate a corresponding CSS position mapping stylesheet. It uses the `DesignFlags` class to handle canvas-based rendering and grid calculations.
+
+> **Note**: This script is intended exclusively for internal use within the `dxt-ui` project repository.
+
+## Key Features
+
+- **Automated Sprite Composition**: Merges multiple separate SVG files into a single, high-performance WebP sprite sheet.
+- **Dynamic Position Mapping**: Automatically computes precise percentage-based coordinates and writes a CSS stylesheet with utility positioning classes.
+- **High-DPI Scaling**: Renders flags using high-performance canvas libraries at a 2x scaling factor for optimal crispness.
+
+## How does it work?
+
+The flag generation workflow automates the assembly of the sprite and utility styles:
+
+1. The script scans the default flag icons directory for all `.svg` files.
+2. It initializes a blank canvas using high-performance rendering tools, calculating the grid columns and rows based on the flag count.
+3. It loops through the discovered SVG files, loading each into memory and drawing them into the calculated grid positions while preserving layout spacing and proportions.
+4. It records the coordinates and names of every flag to build the position mapping records.
+5. It exports the combined canvas buffer into a `.webp` sprite image file and writes the utility stylesheet containing the CSS background position mappings.
+
+## How to configure and run
+
+No complex setup is required to run the flag sprite generator. Simply place your SVG flag icons into the standard `src/assets/flags` directory.
+
+To trigger the sprite and stylesheet compilation, execute:
+```bash
+npx dxt-flags
+```
+
+## Generated File Structure
+
+Upon successful execution, the tool exports the compiled assets directly to the configured workspace paths:
+
+- `src/assets/flags.webp`: The compiled, high-dpi combined sprite image containing all flag icons.
+- `src/styles/flags.css`: The generated CSS stylesheet mapping each individual flag modifier class (e.g. `.ui-sys-flags--us`) to its precise background position percentage.

package/src/media/functional/scripts/bin/dxt-flags/design-flags.ru.mdx

@@ -0,0 +1,41 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/scripts/bin/dxt-flags - Генератор спрайтов флагов'/>
+
+# dxt-flags
+
+Команда `dxt-flags` предоставляет автоматизированную утилиту для компиляции директории SVG-иконок флагов в единый оптимизированный файл спрайта WebP и создания соответствующего CSS-файла с маппингом позиций. Под капотом она использует класс `DesignFlags` для рендеринга на основе холста и расчета параметров сетки.
+
+> **Примечание**: Этот скрипт предназначен исключительно для внутреннего использования в репозитории проекта `dxt-ui`.
+
+## Ключевые возможности
+
+- **Автоматическая сборка спрайта**: Объединяет множество отдельных файлов SVG в один высокопроизводительный спрайт WebP.
+- **Динамический маппинг позиций**: Автоматически вычисляет точные процентные координаты для каждого флага и генерирует CSS-стили с утилитарными классами.
+- **Масштабирование High-DPI**: Рендерит флаги с помощью высокопроизводительных графических библиотек с коэффициентом масштабирования 2x для достижения максимальной четкости.
+
+## Как это работает?
+
+Процесс генерации флагов автоматизирует сборку спрайта и утилитарных стилей:
+
+1. Скрипт сканирует стандартную директорию иконок флагов на наличие всех файлов с расширением `.svg`.
+2. Он инициализирует пустой холст с помощью графических инструментов, рассчитывая количество столбцов и строк сетки на основе количества найденных флагов.
+3. Он перебирает обнаруженные файлы SVG, загружая каждый в память и рисуя их в рассчитанных позициях сетки с сохранением отступов и пропорций макета.
+4. Он записывает координаты и имена каждого флага для построения карты соответствия позиций.
+5. Он экспортирует буфер объединенного холста в файл изображения спрайта `.webp` и записывает утилитарный файл стилей, содержащий CSS-маппинг фонового позиционирования.
+
+## Настройка и запуск
+
+Для работы генератора не требуются сложные конфигурации. Просто поместите ваши SVG-иконки флагов в стандартную директорию `src/assets/flags`.
+
+Чтобы запустить компиляцию спрайта и таблицы стилей, выполните:
+```bash
+npx dxt-flags
+```
+
+## Структура генерируемых файлов
+
+После успешного выполнения инструмент экспортирует сгенерированные ресурсы напрямую по настроенным путям в рабочем пространстве:
+
+- `src/assets/flags.webp`: Готовый объединенный High-DPI файл спрайта, содержащий все иконки флагов.
+- `src/styles/flags.css`: Сгенерированная таблица стилей CSS, сопоставляющая каждый класс-модификатор отдельного флага (например, `.ui-sys-flags--ru`) с его точным процентным значением фонового позиционирования.

package/src/media/functional/scripts/bin/dxt-flags/design-flags.vi.mdx

@@ -0,0 +1,41 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/scripts/bin/dxt-flags - Trình tạo Sprite cờ'/>
+
+# dxt-flags
+
+Lệnh `dxt-flags` cung cấp một tiện ích tự động để biên dịch một thư mục chứa các biểu tượng cờ SVG thành một ảnh sprite WebP duy nhất được tối ưu hóa và tạo bảng kiểu dáng CSS ánh xạ vị trí tương ứng. Lệnh này sử dụng lớp `DesignFlags` để xử lý hiển thị dựa trên canvas và tính toán lưới.
+
+> **Lưu ý**: Tập lệnh này chỉ dành riêng cho việc sử dụng nội bộ bên trong kho lưu trữ dự án `dxt-ui`.
+
+## Các tính năng chính
+
+- **Tự động Đóng gói Sprite**: Kết hợp nhiều tệp SVG riêng lệ thành một tấm sprite WebP duy nhất có hiệu suất cao.
+- **Ánh xạ Vị trí Động**: Tự động tính toán các tọa độ chính xác dựa trên phần trăm và tạo một bảng kiểu dáng CSS với các lớp định vị tiện ích.
+- **Thu phóng High-DPI**: Hiển thị cờ bằng cách sử dụng các thư viện canvas hiệu suất cao với hệ số tỷ lệ 2x để đạt được độ sắc nét tối ưu.
+
+## Nó hoạt động như thế nào?
+
+Quy trình tạo sinh cờ tự động hóa việc lắp ráp sprite và các phong cách tiện ích:
+
+1. Tập lệnh quét thư mục biểu tượng cờ mặc định để tìm tất cả các tệp `.svg`.
+2. Nó khởi tạo một canvas trống bằng các công cụ hiển thị hiệu suất cao, tính toán các cột và hàng lưới dựa trên số lượng cờ.
+3. Nó lặp qua các tệp SVG được phát hiện, tải từng tệp vào bộ nhớ và vẽ chúng vào các vị trí lưới đã tính toán trong khi vẫn bảo toàn khoảng cách và tỷ lệ layout.
+4. Nó ghi lại tọa độ và tên của mọi lá cờ để xây dựng các bản ghi ánh xạ vị trí.
+5. Nó xuất bộ đệm canvas đã kết hợp thành một tệp hình ảnh sprite `.webp` và ghi tệp bảng kiểu dáng tiện ích chứa các ánh xạ vị trí nền CSS.
+
+## Cách thiết lập và khởi chạy
+
+Không yêu cầu thiết lập phức tạp để chạy trình tạo sprite cờ. Chỉ cần đặt các biểu tượng cờ SVG của bạn vào thư mục tiêu chuẩn `src/assets/flags`.
+
+Để kích hoạt biên dịch sprite và bảng kiểu dáng, hãy thực thi:
+```bash
+npx dxt-flags
+```
+
+## Cấu trúc tệp được tạo sinh
+
+Sau khi thực thi thành công, công cụ sẽ xuất các tài nguyên đã biên dịch trực tiếp đến các đường dẫn không gian làm việc được cấu hình:
+
+- `src/assets/flags.webp`: Hình ảnh sprite kết hợp High-DPI đã biên dịch chứa tất cả các biểu tượng cờ.
+- `src/styles/flags.css`: Bảng kiểu dáng CSS được tạo sinh ánh xạ từng lớp sửa đổi cờ riêng lẻ (ví dụ: `.ui-sys-flags--vn`) tới phần trăm vị trí nền chính xác của nó.

package/src/media/functional/scripts/bin/dxt-library/design-library.en.mdx

@@ -0,0 +1,40 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/scripts/bin/dxt-library - Library Entry Point Generator'/>
+
+# dxt-library
+
+The `dxt-library` command is a CLI utility that generates a consolidated entry point (`src/library.ts`) for the entire UI library. It uses the `LibraryExport` class to scan primary subfolders and dynamically compile all exports into a single public interface.
+
+## Key Features
+
+- **Unified Entry Point**: Compiles multiple directories into a single optimized export interface.
+- **Smart Module Handling**: Automatically handles wildcard exports for TypeScript utilities and creates named exports for Vue components.
+- **Intelligent Filtering**: Excludes unit test files and files marked with a non-export directive.
+- **Global Style Bundling**: Automatically incorporates global styles into the generated entry file.
+
+## How does it work?
+
+The entry point compilation workflow automates the assembly of all module exports:
+
+1. The script scans the designated source subdirectories (`classes`, `components`, `composables`, `functions`, `global`, `types`) using recursive directory reading tools.
+2. It filters out unit test files (containing `.test.`) and files containing the `// export:none` directive.
+3. For each valid TypeScript file (`.ts`), it appends a standard wildcard export.
+4. For each Vue SFC file (`.vue`), it generates an import and maps it to a named constant export for clean consumption.
+5. It checks for the existence of `style.scss` or `style.css` in the base input directory and prepends their import statements if found.
+6. It writes the compiled code directly to `src/library.ts`.
+
+## How to configure and run
+
+No complex setup is required to run the library entry point generator. The script automatically reads configurations and processes the preset export directories.
+
+To execute the generation workflow, run:
+```bash
+npx dxt-library
+```
+
+## Generated File Structure
+
+Upon successful execution, the tool creates or updates the following file in the package:
+
+- `src/library.ts`: The unified entry point containing all imports, named component exports, and wildcards.

package/src/media/functional/scripts/bin/dxt-library/design-library.ru.mdx

@@ -0,0 +1,40 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/scripts/bin/dxt-library - Генератор точки входа библиотеки'/>
+
+# dxt-library
+
+Команда `dxt-library` представляет собой CLI-утилиту для генерации консолидированной точки входа (`src/library.ts`) для всей библиотеки UI. Под капотом она использует класс `LibraryExport` для сканирования основных подпапок и динамической компиляции всех экспортов в единый публичный интерфейс.
+
+## Ключевые возможности
+
+- **Единая точка входа**: Компилирует несколько директорий в один оптимизированный интерфейс экспорта.
+- **Умная обработка модулей**: Автоматически генерирует экспорты со звездочкой для TypeScript-утилит и именованные экспорты для Vue-компонентов.
+- **Интеллектуальная фильтрация**: Исключает файлы юнит-тестов и файлы, помеченные специальной директивой исключения экспорта.
+- **Интеграция глобальных стилей**: Автоматически включает глобальные стили в сгенерированный файл точки входа.
+
+## Как это работает?
+
+Процесс компиляции точки входа автоматизирует сборку экспортов всех модулей:
+
+1. Скрипт сканирует указанные исходные поддиректории (`classes`, `components`, `composables`, `functions`, `global`, `types`) с помощью инструментов рекурсивного чтения директорий.
+2. Он отфильтровывает файлы юнит-тестов (содержащие `.test.`) и файлы, содержимое которых совпадает с директивой `// export:none`.
+3. Для каждого валидного файла TypeScript (`.ts`) он добавляет стандартный экспорт со звездочкой.
+4. Для каждого файла Vue SFC (`.vue`) он генерирует импорт и сопоставляет его с именованным экспортом константы для чистого использования.
+5. Он проверяет наличие файлов `style.scss` или `style.css` в базовой входной директории и добавляет их импорт в начало файла, если они найдены.
+6. Он записывает скомпилированный код напрямую в файл `src/library.ts`.
+
+## Настройка и запуск
+
+Для запуска генератора точки входа библиотеки не требуется сложных настроек. Скрипт автоматически считывает конфигурации и обрабатывает предустановленные директории экспорта.
+
+Чтобы запустить процесс генерации, выполните:
+```bash
+npx dxt-library
+```
+
+## Структура генерируемых файлов
+
+После успешного выполнения инструмент создает или обновляет следующий файл в пакете:
+
+- `src/library.ts`: Единая точка входа, содержащая все импорты, именованные экспорты компонентов и экспорты со звездочкой.

package/src/media/functional/scripts/bin/dxt-library/design-library.vi.mdx

@@ -0,0 +1,40 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/scripts/bin/dxt-library - Trình tạo điểm truy cập thư viện'/>
+
+# dxt-library
+
+Lệnh `dxt-library` là một tiện ích CLI giúp tạo ra một điểm nhập thống nhất (`src/library.ts`) cho toàn bộ thư viện UI. Lệnh này sử dụng lớp `LibraryExport` để quét các thư mục con chính và biên dịch động tất cả các xuất bản (exports) thành một giao diện công khai duy nhất.
+
+## Các tính năng chính
+
+- **Điểm nhập thống nhất**: Biên dịch nhiều thư mục thành một giao diện xuất bản duy nhất được tối ưu hóa.
+- **Xử lý mô-đun thông minh**: Tự động xử lý các xuất bản ký tự đại diện cho các tiện ích TypeScript và tạo các xuất bản có tên cho các thành phần Vue.
+- **Bộ lọc thông minh**: Loại trừ các tệp kiểm thử đơn vị và các tệp được đánh dấu bằng chỉ thị không xuất bản.
+- **Tích hợp phong cách toàn cục**: Tự động kết hợp các kiểu dáng toàn cục vào tệp điểm nhập được tạo sinh.
+
+## Nó hoạt động như thế nào?
+
+Quy trình biên dịch điểm truy cập tự động hóa việc lắp ráp tất cả các xuất bản mô-đun:
+
+1. Tập lệnh quét các thư mục con nguồn được chỉ định (`classes`, `components`, `composables`, `functions`, `global`, `types`) bằng các công cụ đọc thư mục đệ quy.
+2. Nó lọc bỏ các tệp kiểm thử đơn vị (chứa `.test.`) và các tệp chứa chỉ thị `// export:none`.
+3. Đối với mỗi tệp TypeScript hợp lệ (`.ts`), nó sẽ thêm một xuất bản ký tự đại diện tiêu chuẩn.
+4. Đối với mỗi tệp Vue SFC (`.vue`), nó tạo ra một lệnh nhập và ánh xạ nó tới một xuất bản hằng số có tên để sử dụng một cách sạch sẽ.
+5. Nó kiểm tra sự tồn tại của `style.scss` hoặc `style.css` trong thư mục đầu vào cơ sở và thêm các câu lệnh nhập của chúng vào đầu tệp nếu tìm thấy.
+6. Nó ghi mã đã biên dịch trực tiếp vào tệp `src/library.ts`.
+
+## Cách thiết lập và khởi chạy
+
+Không yêu cầu thiết lập phức tạp để chạy trình tạo điểm nhập thư viện. Tập lệnh tự động đọc cấu hình và xử lý các thư mục xuất bản được cài đặt sẵn.
+
+Để thực thi quy trình tạo sinh, hãy chạy:
+```bash
+npx dxt-library
+```
+
+## Cấu trúc tệp được tạo sinh
+
+Sau khi thực thi thành công, công cụ sẽ tạo hoặc cập nhật tệp sau trong gói:
+
+- `src/library.ts`: Điểm nhập thống nhất chứa tất cả các lệnh nhập, xuất bản thành phần có tên và ký tự đại diện.

package/src/media/functional/scripts/bin/dxt-package/design-package.en.mdx

@@ -0,0 +1,48 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/scripts/bin/dxt-package - Package Structure Initialization'/>
+
+# dxt-package
+
+The `dxt-package` command automates the initialization of a new package's structure and development environment based on predefined templates. Under the hood, it uses the `PackageInit` and `PackageInitItem` classes to process empty package directories and scaffold them appropriately.
+
+## Key Features
+
+- **Automated Directory Scanning**: Automatically scans the configured base directory (defaults to `packages/`) and identifies empty package folders that require initialization.
+- **Template-Based Scaffolding**: Supports applying specific templates to customize the generation process, adapting the scaffolded structure based on the provided package `type`.
+- **Flexible Configuration**: Allows overriding the default package type, templates, and target base directory via command-line arguments.
+
+## How does it work?
+
+The package initialization workflow streamlines the creation of new packages:
+
+1. The script reads the provided arguments to determine the package `type` (defaulting to `library`), `templates`, and target `dir`.
+2. It scans the target directory to find any empty folders (directories with no children).
+3. For each empty directory found, it initializes a `PackageInitItem` instance, passing the package path, type, and templates.
+4. The system then processes these configurations to scaffold the required files and environment structure for the package, making it ready for development.
+
+## How to configure and run
+
+To initialize newly created empty package folders with the default `library` type, run:
+```bash
+npx dxt-package
+```
+
+To specify a custom package type (e.g., `vue`), run:
+```bash
+npx dxt-package vue
+```
+
+To specify a custom type and apply specific templates, pass them as arguments:
+```bash
+npx dxt-package vue "template1,template2"
+```
+
+You can also specify a custom base directory as the third argument:
+```bash
+npx dxt-package vue "template1" "packages/custom-dir"
+```
+
+## Generated Structure
+
+When the command processes an empty directory, it scaffolds the base files necessary for the given package type and templates. This typically includes structural files, base configurations, and entry points, transforming an empty folder into a fully functional package environment within the workspace.

package/src/media/functional/scripts/bin/dxt-package/design-package.ru.mdx

@@ -0,0 +1,48 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/scripts/bin/dxt-package - Инициализация структуры пакетов'/>
+
+# dxt-package
+
+Команда `dxt-package` автоматизирует инициализацию структуры нового пакета и среды разработки на основе предопределенных шаблонов. Под капотом она использует классы `PackageInit` и `PackageInitItem` для обработки пустых директорий пакетов и их соответствующего заполнения.
+
+## Ключевые возможности
+
+- **Автоматическое сканирование директорий**: Автоматически сканирует настроенную базовую директорию (по умолчанию `packages/`) и выявляет пустые папки пакетов, требующие инициализации.
+- **Генерация на основе шаблонов**: Поддерживает применение конкретных шаблонов для настройки процесса генерации, адаптируя создаваемую структуру в зависимости от указанного `type` пакета.
+- **Гибкая настройка**: Позволяет переопределять тип пакета по умолчанию, шаблоны и целевую базовую директорию через аргументы командной строки.
+
+## Как это работает?
+
+Процесс инициализации пакета упрощает создание новых пакетов:
+
+1. Скрипт считывает переданные аргументы для определения типа пакета `type` (по умолчанию `library`), шаблонов `templates` и целевой директории `dir`.
+2. Он сканирует целевую директорию, чтобы найти любые пустые папки (директории без дочерних элементов).
+3. Для каждой найденной пустой директории инициализируется экземпляр `PackageInitItem`, в который передаются путь пакета, тип и шаблоны.
+4. Затем система обрабатывает эти конфигурации для генерации необходимых файлов и структуры среды для пакета, подготавливая его к разработке.
+
+## Настройка и запуск
+
+Чтобы инициализировать недавно созданные пустые папки пакетов со стандартным типом `library`, выполните:
+```bash
+npx dxt-package
+```
+
+Чтобы указать пользовательский тип пакета (например, `vue`), выполните:
+```bash
+npx dxt-package vue
+```
+
+Чтобы указать пользовательский тип и применить конкретные шаблоны, передайте их в качестве аргументов:
+```bash
+npx dxt-package vue "template1,template2"
+```
+
+Вы также можете указать пользовательскую базовую директорию в качестве третьего аргумента:
+```bash
+npx dxt-package vue "template1" "packages/custom-dir"
+```
+
+## Генерируемая структура
+
+Когда команда обрабатывает пустую директорию, она создает базовые файлы, необходимые для заданного типа пакета и шаблонов. Обычно это включает структурные файлы, базовые конфигурации и точки входа, превращая пустую папку в полнофункциональную среду пакета внутри рабочего пространства.