@dxtmisha/scripts 0.4.4 → 0.4.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@dxtmisha/scripts",
3
3
  "private": false,
4
- "version": "0.4.4",
4
+ "version": "0.4.5",
5
5
  "type": "module",
6
6
  "description": "Development scripts and CLI tools for DXT UI projects - automated component generation, library building and project management tools",
7
7
  "keywords": [
@@ -5,7 +5,8 @@ import type { LibraryFiles } from '../../types/libraryTypes'
5
5
  import {
6
6
  UI_DIRS_LIST_EXPORT,
7
7
  UI_DIRS_FILE_EXPORT,
8
- UI_DIR_IN, UI_FLAG_NOT_EXPORT
8
+ UI_DIR_IN,
9
+ UI_FLAG_NOT_EXPORT
9
10
  } from '../../config'
10
11
 
11
12
  /**
package/src/config.ts CHANGED
@@ -58,6 +58,7 @@ export const UI_DIRS_LIST_EXPORT = [
58
58
  'components',
59
59
  'composables',
60
60
  'functions',
61
+ 'global',
61
62
  'types'
62
63
  ]
63
64
 
@@ -1,5 +1,5 @@
1
1
  You need to prepare documentation for a component in the [wikiLanguage] language. Follow the format and requirements strictly. Do not add anything beyond what is described.
2
- Stack: Storybook 9.x, TypeScript, MDX.
2
+ Stack: Storybook 9.x, TypeScript, MDX, Vue 3 Composition API.
3
3
 
4
4
  Canvas component is imported from '@storybook/addon-docs/blocks'
5
5
 
@@ -9,12 +9,21 @@ Canvas component is imported from '@storybook/addon-docs/blocks'
9
9
  ```
10
10
  [code]
11
11
  ```
12
- Analyze the structure, props, events, slots, types, internal logic.
12
+
13
+ Analyze:
14
+ - Component structure (props, computed, methods)
15
+ - Events (emit) and their parameters
16
+ - Slots and their parameters
17
+ - Data types (interfaces, types)
18
+ - Expose methods and properties
19
+ - Internal logic and behavior
20
+ - Dependencies on other components
13
21
 
14
22
  ====================================
15
23
  2) Add missing type comments
16
24
  ====================================
17
25
  Add brief single-language (in [wikiLanguage]) JSDoc comments to missing types and their properties.
26
+
18
27
  Code to fix:
19
28
  ```ts
20
29
  // types.ts
@@ -22,12 +31,14 @@ Code to fix:
22
31
  ```
23
32
 
24
33
  Comment requirements:
25
- - Single-line for simple fields.
26
- - Multi-line for logic blocks.
27
- - No duplication of the obvious.
28
- - Adapted for storybook.
29
-
30
- Example:
34
+ - Single-line for simple fields (/** Description */)
35
+ - Multi-line for complex types or logic blocks
36
+ - No duplication of the obvious (don't comment "id" as "component id")
37
+ - Adapted for display in Storybook
38
+ - Use technical terms correctly
39
+ - For union types, describe each value separately in code
40
+
41
+ Example (strictly follow the format):
31
42
  ```ts
32
43
  /**
33
44
  * Basic properties for image components.
@@ -44,52 +55,189 @@ export interface IconPropsBasic<
44
55
  icon?: ImageValue<Image>
45
56
  /** Active icon value */
46
57
  iconActive?: ImageValue<Image>
58
+
59
+ // Design
60
+ /**
61
+ * Icon size
62
+ * @default 'medium'
63
+ */
64
+ size?: 'small' | 'medium' | 'large'
47
65
  }
48
66
  ```
49
67
 
50
68
  ====================================
51
69
  3) Stories for Storybook
52
70
  ====================================
53
- Create only the minimum necessary examples. Each example is as simple as possible, without extra wrappers, only what demonstrates the essence.
71
+ Create minimum necessary examples. Each story demonstrates a specific usage scenario.
72
+
54
73
  Code to fix:
55
74
  ```ts
56
75
  // ComponentDoc.stories.ts
57
76
  [stories]
58
77
  ```
78
+
59
79
  Rules:
60
- - Don't touch existing stories, only additions.
61
- - Don't touch const meta. DO NOT CHANGE ANYTHING IN META.
62
- - Don't touch existing constants.
63
- - Don't rename existing constants.
64
- - Don't add stories just for filling.
65
- - If the component has different modes (e.g., states or display variants), show one example each.
66
- - Story names in PascalCase style without extra words.
67
- - Minimize imports: only what is required.
80
+ - STRICTLY FORBIDDEN to touch const meta. DO NOT CHANGE ANYTHING IN META.
81
+ - Don't touch existing constants and stories
82
+ - Don't rename existing constants
83
+ - Don't add stories just for filling
84
+ - Each story must have a purpose and demonstrate specific functionality
85
+ - If component has different modes, show one clear example for each
86
+ - Story names in PascalCase style without extra words (e.g.: `Basic`, `WithIcon`, `Disabled`)
87
+ - Minimize imports: only necessary
88
+ - Don't use extra wrappers (div, section) without necessity
89
+ - Simple, readable code
90
+
91
+ Example:
92
+ ```ts
93
+ export const Basic: Story = {
94
+ args: {
95
+ label: 'Click me'
96
+ }
97
+ }
98
+
99
+ export const WithIcon: Story = {
100
+ args: {
101
+ label: 'Click me',
102
+ icon: 'check'
103
+ }
104
+ }
105
+ ```
68
106
 
69
107
  ====================================
70
108
  4) MDX documentation (component description)
71
109
  ====================================
72
- Prepare a complete component description in MDX format. Strict style: no tables, no extra sections.
110
+ Prepare complete component description in MDX format. Strict style: no tables, no extra sections, only necessary information.
111
+
73
112
  Code to fix:
74
113
  ```md
75
- // UiPlayerLite.mdx
114
+ // ComponentName.mdx
76
115
  [md]
77
116
  ```
78
117
 
79
- MDX structure rules:
80
- - At the beginning: [description] — Brief description of the purpose (1–3 sentences): conveys the essence of the component as briefly as possible.
81
- - Next: main text (documentation) — starts without a heading. This is [doc].
82
- - You can refine existing text by changing it, but don't delete. Delete only unnecessary or outdated content.
83
- - Be sure to list Expose (if any), slots (if any) and events (if any) in the given format.
84
- - Don't describe props in a list if they are simple. Describe only complex relationships (e.g., dependent props) or composite types in detail.
85
- - Expose, Slots and events — strictly in the format below. If there are no types, the type block is omitted.
86
- - Add Canvas if there is a usage example. If not, add stories.
87
- - Don't add <Canvas of={Component.Component}/>
88
- - Don't touch Meta and StorybookMain. They must remain as they are and be at the top. Don't add, don't delete, don't modify them.
89
-
90
- Example MDX documentation (don't include in response, only as style guide)
91
- Make sure to follow the style and formatting as shown in the example
92
- ====================================
118
+ Document structure (strict):
119
+
120
+ **1. Brief description:**
121
+ - One sentence, conveying the essence of the component as briefly as possible
122
+ - Don't use phrases like "This component", start immediately with the purpose
123
+
124
+ **2. Main documentation text:**
125
+ - Starts WITHOUT a heading
126
+ - Detailed functionality description (2-4 paragraphs)
127
+ - Block "**Key Features:**" (list of key features)
128
+ - Block "**Typical Use Cases:**" (list of usage examples)
129
+ - Can refine existing text, but DO NOT delete relevant information
130
+ - Delete only outdated or redundant content
131
+
132
+ **3. Special sections (if present):**
133
+
134
+ **Props (only for complex cases):**
135
+ - Describe Props only if they have complex interaction logic, dependencies, or composite types
136
+ - DO NOT describe simple boolean/string props in a list - JSDoc comments in types are enough for them
137
+ - Format: `## Props`, then `### PropName` for each complex prop
138
+
139
+ Example of complex prop description:
140
+ ```md
141
+ ## Props
142
+ ### `adaptive`
143
+
144
+ Window adaptive behavior mode.
145
+
146
+ **Type:** `'modal' | 'menu' | 'actionSheet' | 'static'`
147
+
148
+ **Default:** `'modal'`
149
+
150
+ **Possible values:**
151
+ - `'modal'` — modal window in screen center with overlay
152
+ - `'menu'` — dropdown menu attached to control element
153
+ - `'actionSheet'` — bottom panel for mobile interfaces
154
+ - `'static'` — static mode without overlay and positioning
155
+ ```
156
+
157
+ **4. Mandatory sections (if present in component):**
158
+
159
+ **Expose methods/properties:**
160
+ ```md
161
+ ## Expose Methods
162
+ ### `methodName`
163
+
164
+ Method description.
165
+
166
+ **Type:** `(param: Type) => ReturnType`
167
+
168
+ **Parameters:**
169
+ - `param: Type` — parameter description
170
+
171
+ **Returns:** return value description
172
+
173
+ [code example]
174
+ ```
175
+
176
+ **Slots:**
177
+ ```md
178
+ ## Slots
179
+ ### `slotName`
180
+
181
+ Slot description.
182
+
183
+ **Parameters:**
184
+ - `param: Type` — slot parameter description
185
+
186
+ [code example]
187
+ ```
188
+
189
+ **Events:**
190
+ ```md
191
+ ## Events
192
+ ### `eventName`
193
+
194
+ Event description.
195
+
196
+ **Parameters:**
197
+ - `param: Type` — event parameter description
198
+
199
+ **Type structure:** (if parameter is complex)
200
+ - `field: string` — field description
201
+ - `field2: number` — field description
202
+
203
+ [code example]
204
+ ```
205
+
206
+ **5. Usage examples:**
207
+ - Add Canvas to demonstrate specific scenarios
208
+ - DO NOT add base `<Canvas of={Component.Component}/>` — it's already at the beginning
209
+ - Format: `<Canvas of={Component.StoryName}/>`
210
+
211
+ **Strict formatting rules:**
212
+
213
+ - Heading levels:
214
+ - `##` — main sections (Props, Expose Methods, Slots, Events)
215
+ - `###` — specific elements (method, slot, event names)
216
+ - `####` — subsections within description (Behavior, Examples)
217
+
218
+ - Code:
219
+ - Types and interfaces: ` ```ts `
220
+ - Component markup: ` ```html ` (NOT ` ```vue `)
221
+ - Inline code: wrap in backticks `` `code` ``
222
+
223
+ - Meta and StorybookMain:
224
+ - STRICTLY FORBIDDEN to touch Meta and StorybookMain blocks
225
+ - They must remain as is at the beginning of the file
226
+ - Don't add, don't delete, don't modify them
227
+
228
+ - Structural elements:
229
+ - Use `**Bold text:**` for subheadings within descriptions
230
+ - Use `>` for important notes and warnings
231
+ - Lists only where they improve readability
232
+
233
+ **Example of full document structure:**
234
+
235
+ ```md
236
+ import { Meta, Canvas } from '@storybook/addon-docs/blocks'
237
+ import * as Component from './Component.stories'
238
+
239
+ <Meta of={Component} />
240
+
93
241
  Component for creating modal windows, dialogs, and popup elements with flexible positioning and adaptive behavior.
94
242
 
95
243
  Window manages content display over the main interface, supports various positioning types (modal windows, dropdown menus, action sheets), open/close animations, and event system integration. The component automatically handles clicks outside the area, focus management, and adaptation to different screen sizes.
@@ -114,6 +262,8 @@ Window manages content display over the main interface, supports various positio
114
262
 
115
263
  ## CSS Classes for Behavior Control
116
264
 
265
+ Component uses special CSS classes for behavior control:
266
+
117
267
  - `*--block` — prevents window from closing when clicking outside its boundaries
118
268
  - `*--blockChildren` — prevents current window from closing
119
269
  - `*--blockOther` — prevents other windows from closing until current one is closed
@@ -124,34 +274,20 @@ Window manages content display over the main interface, supports various positio
124
274
 
125
275
  Where `*` is the component class name (e.g., `d1-window`, `m3-window`).
126
276
 
127
- ## Static Mode (staticMode)
128
-
129
- The Window component supports static mode operation through the `staticMode` property. In this mode, the window works as an embedded component without modal behavior:
130
-
131
- - **Content displays immediately** — window doesn't hide and doesn't require activation
132
- - **Animations disabled** — no appearance/disappearance effects
133
- - **Positioning disabled** — window is embedded in document flow
134
- - **Works with adaptive** — when the `adaptive` property has one of the static modes (e.g., `static`), static mode is enabled
277
+ ## Props
278
+ ### `adaptive`
135
279
 
136
- Static mode is especially useful for embedding window content directly into the interface without modal behavior.
280
+ Window adaptive behavior mode.
137
281
 
138
- ## Positioning Direction (axis)
282
+ **Type:** `'modal' | 'menu' | 'actionSheet' | 'static'`
139
283
 
140
- Controls the axis of window placement relative to the anchor element. Default: `y`.
141
-
142
- > Applies only in menu mode (`adaptive="menu"` or `adaptive="menuWindow"`).
284
+ **Default:** `'modal'`
143
285
 
144
286
  **Possible values:**
145
- - `'x'` — horizontal axis (left or right of anchor)
146
- - `'y'` — vertical axis (top or bottom of anchor)
147
- - `'on'` — over anchor (window centers on element)
148
-
149
- ### Behavior
150
-
151
- - Component automatically selects the placement side with the most available space
152
- - When using context menu (`contextmenu`), positioning occurs from cursor coordinates
153
- - Window always stays within visible screen area (viewport)
154
- - Indent from anchor is set via `indent` property (default 4px)
287
+ - `'modal'` — modal window in screen center
288
+ - `'menu'` — dropdown menu attached to element
289
+ - `'actionSheet'` — bottom panel for mobile devices
290
+ - `'static'` — static mode without overlay
155
291
 
156
292
  ## State Management via v-model
157
293
 
@@ -251,36 +387,61 @@ const handleWindow = (options) => {
251
387
  </template>
252
388
  ```
253
389
 
254
- Canvas usage example:
255
- <Canvas of={Chip.ChipSkeleton}/>
390
+ ## Usage Examples
391
+ ### Basic Modal Window
392
+
393
+ <Canvas of={Component.BasicModal}/>
394
+
395
+ ### Dropdown Menu
396
+
397
+ <Canvas of={Component.DropdownMenu}/>
398
+ ```
256
399
 
257
400
  ====================================
258
401
  5) Final return
259
402
  ====================================
260
- Return the result strictly in the format (nothing extra before or after):
403
+ Return the result STRICTLY in the format (nothing extra before or after):
404
+
261
405
  [types.ts]
262
406
  #########
263
407
  [ComponentDoc.stories.ts]
264
408
  #########
265
- [UiPlayerLite.mdx]
266
-
267
- Where:
268
- - Don't add anything extra (like ```ts)
269
- - Don't wrap in blocks.
270
- - Don't wrap in ```ts or anything similar.
271
- - [types.ts] final types block with comments (only content, without file name comments).
272
- - [ComponentDoc.stories.ts] final stories file (only content, without file name comments).
273
- - [UiPlayerLite.mdx] final MDX documentation (only content, without file name comments).
274
- - Result strictly in this order, separated by line #########.
409
+ [ComponentName.mdx]
410
+
411
+ **Output format requirements:**
412
+ - DO NOT add file labels like `// filepath: ...`
413
+ - DO NOT wrap in code blocks (` ```ts `, ` ```md `)
414
+ - DO NOT add comments with file names
415
+ - DO NOT include in the result text `[types.ts]`, `[ComponentDoc.stories.ts]`, `[ComponentName.mdx]`
416
+ - Only clean code, separated by a line of nine hash symbols: `#########`
417
+ - Order strictly: types stories documentation
418
+ - Each block starts with the first line of code, without spaces and line breaks before
419
+
420
+ **Structure of each block:**
421
+ - `[types.ts]` — final types file with JSDoc comments (only file content)
422
+ - `[ComponentDoc.stories.ts]` — final stories file (only file content)
423
+ - `[ComponentName.mdx]` — final MDX documentation (only file content)
275
424
 
276
425
  ====================================
277
426
  Constraints and style
278
427
  ====================================
279
- - No tables.
280
- - No arbitrary additional sections.
281
- - Don't add "Props" section if there are no complex dependencies.
282
- - Don't duplicate descriptions of the same thing.
283
- - Respect the [wikiLanguage] language — if it's "en" use English, otherwise the corresponding language.
284
- - Don't use placeholders outside those specified.
285
- - Code blocks: for types and events ```ts, for markup — ```html when necessary.
286
- - Stories: only necessary scenarios, without extra visual decorations.
428
+
429
+ **Forbidden:**
430
+ - Tables in any form
431
+ - Arbitrary additional sections outside specified ones
432
+ - "Props" section for simple properties without complex logic
433
+ - Duplication of descriptions of the same thing
434
+ - Placeholders outside those specified in prompt (`[code]`, `[types]`, `[stories]`, `[md]`)
435
+ - Using ` ```vue ` for code examples (only ` ```html `)
436
+ - Changing Meta block in MDX
437
+ - Adding base Canvas (`<Canvas of={Component.Component}/>`)
438
+
439
+ **Required:**
440
+ - Documentation language corresponds to [wikiLanguage]
441
+ - If [wikiLanguage] = "en", use English for ALL documentation
442
+ - If [wikiLanguage] = "ru", use Russian for ALL documentation
443
+ - Code blocks: types and events — ` ```ts `, markup — ` ```html `
444
+ - Stories: only necessary scenarios, without visual decorations
445
+ - Brevity and informativeness without "fluff"
446
+ - Technically correct terms
447
+ - Code examples are functional and up-to-date
@@ -1,7 +1,9 @@
1
- Нужно подготовить документацию для компонента на языке [wikiLanguage]. Следуй строго формату и требованиям ниже. Не добавляй ничего лишнего вне описанного.
2
- Стек Storybook 9.x, TypeScript, MDX.
1
+ Нужно подготовить документацию для компонента на языке [wikiLanguage].
2
+ Следуй строго формату и требованиям ниже.
3
+ Не добавляй ничего лишнего вне описанного.
4
+ Стек: Storybook 9.x, TypeScript, MDX, Vue 3 Composition API.
3
5
 
4
- Компонент Canvas подключается из '@storybook/addon-docs/blocks'
6
+ Canvas компонент импортируется из '@storybook/addon-docs/blocks'
5
7
 
6
8
  ====================================
7
9
  1) Изучи текущий код компонента
@@ -9,12 +11,21 @@
9
11
  ```
10
12
  [code]
11
13
  ```
12
- Проанализируй структуру, props, события, слоты, типы, внутреннюю логику.
14
+
15
+ Проанализируй:
16
+ - Структуру компонента (props, computed, methods)
17
+ - События (emit) и их параметры
18
+ - Слоты (slots) и их параметры
19
+ - Типы данных (interfaces, types)
20
+ - Expose методы и свойства
21
+ - Внутреннюю логику и поведение
22
+ - Зависимости от других компонентов
13
23
 
14
24
  ====================================
15
25
  2) Добавь недостающие комментарии к типам
16
26
  ====================================
17
27
  Добавь краткие одноязычные (на [wikiLanguage]) JSDoc-комментарии к отсутствующим типам и их свойствам.
28
+
18
29
  Код для исправления:
19
30
  ```ts
20
31
  // types.ts
@@ -22,12 +33,14 @@
22
33
  ```
23
34
 
24
35
  Требования к комментариям:
25
- - Однострочные для простых полей.
26
- - Многострочные для блоков логики.
27
- - Без дублирования очевидного.
28
- - Адаптированы к storybook.
29
-
30
- Пример:
36
+ - Однострочные для простых полей (/** Описание */)
37
+ - Многострочные для сложных типов или блоков логики
38
+ - Без дублирования очевидного (не комментируй "id" как "id компонента")
39
+ - Адаптированы для отображения в Storybook
40
+ - Используй технические термины правильно
41
+ - Для union типов опиши каждое значение отдельно в коде
42
+
43
+ Пример (строго следуй формату):
31
44
  ```ts
32
45
  /**
33
46
  * Basic properties for image components.
@@ -44,53 +57,189 @@ export interface IconPropsBasic<
44
57
  icon?: ImageValue<Image>
45
58
  /** Значение активной иконки */
46
59
  iconActive?: ImageValue<Image>
60
+
61
+ // Design
62
+ /**
63
+ * Размер иконки
64
+ * @default 'medium'
65
+ */
66
+ size?: 'small' | 'medium' | 'large'
47
67
  }
48
68
  ```
49
69
 
50
70
  ====================================
51
71
  3) Истории (stories) для Storybook
52
72
  ====================================
53
- Создай только минимально необходимые примеры. Каждый пример максимально простой, без лишних обёрток, только то, что демонстрирует суть.
73
+ Создай минимально необходимые примеры. Каждая история демонстрирует конкретный сценарий использования.
74
+
54
75
  Код для исправления:
55
76
  ```ts
56
77
  // ComponentDoc.stories.ts
57
78
  [stories]
58
79
  ```
80
+
59
81
  Правила:
60
- - Не трогать те stories, которые уже есть, только добавления.
61
- - Не трогать const meta. НИЧЕГО НЕ МЕНЯТЬ В META.
62
- - Не трогать существующие константы.
63
- - Не переименовывай существующие константы.
64
- - Не добавляй истории ради заполнения.
65
- - Если компонент имеет разные режимы (например, состояния или варианты отображения), покажи по одному примеру.
66
- - Имена историй в стиле PascalCase без лишних слов.
67
- - Минимизируй импорты: только то, что требуется.
82
+ - СТРОГО ЗАПРЕЩЕНО трогать const meta. НИЧЕГО НЕ МЕНЯТЬ В META.
83
+ - Не трогать существующие константы и истории
84
+ - Не переименовывать существующие константы
85
+ - Не добавлять истории ради заполнения
86
+ - Каждая история должна иметь цель и демонстрировать конкретную функциональность
87
+ - Если компонент имеет разные режимы, покажи по одному чёткому примеру для каждого
88
+ - Имена историй в стиле PascalCase без лишних слов (например: `Basic`, `WithIcon`, `Disabled`)
89
+ - Минимизируй импорты: только необходимое
90
+ - Не используй лишние обёртки (div, section) без необходимости
91
+ - Простой, читаемый код
92
+
93
+ Пример:
94
+ ```ts
95
+ export const Basic: Story = {
96
+ args: {
97
+ label: 'Click me'
98
+ }
99
+ }
100
+
101
+ export const WithIcon: Story = {
102
+ args: {
103
+ label: 'Click me',
104
+ icon: 'check'
105
+ }
106
+ }
107
+ ```
68
108
 
69
109
  ====================================
70
110
  4) MDX-документация (описание компонента)
71
111
  ====================================
72
- Подготовь полное описание компонента в формате MDX. Строгая стилистика: никаких таблиц, никаких лишних разделов.
112
+ Подготовь полное описание компонента в формате MDX. Строгая стилистика: никаких таблиц, никаких лишних разделов, только необходимая информация.
113
+
73
114
  Код для исправления:
74
115
  ```md
75
- // UiPlayerLite.mdx
116
+ // ComponentName.mdx
76
117
  [md]
77
118
  ```
78
119
 
79
- Правила структуры MDX:
80
- - В начале: [description] — Краткое описание назначения (1–3 предложения): максимально коротко передаёт суть компонента.
81
- - Далее: основной текст (документация) — начинается без заголовка. Это [doc].
82
- - Можно дорабатывать существующий текст, изменяя, но не удалять. Удаляй только лишнее или неактуальное.
83
- - Обязательно перечисли Expose (если есть), слоты (если есть) и события (если есть) в заданном формате.
84
- - Не описывай props списком, если они простые. Подробно описывай только сложные связки (например, зависимые props) или составные типы.
85
- - Expose, Слоты и события — строго в формате ниже. Если типов нет — блок с типом опускается.
86
- - Добавь Canvas, если есть пример использования. Если нет — добавь stories.
87
- - Не надо добавлять <Canvas of={Component.Component}/>
88
- - Нельзя трогать Meta и StorybookMain. Они должны остаться как есть и находиться вверху. Не добавляй, не удаляй, не изменяй их.
120
+ Структура документа (строго):
121
+
122
+ **1. Краткое описание (description):**
123
+ - Одно предложение, максимально кратко передающее суть компонента
124
+ - Не используй фразы типа "Этот компонент", начинай сразу с назначения
125
+
126
+ **2. Основной текст документации (doc):**
127
+ - Начинается БЕЗ заголовка
128
+ - Детальное описание функциональности (2-4 абзаца)
129
+ - Блок "**Основные возможности:**" (список ключевых фич)
130
+ - Блок "**Типичные сценарии использования:**" (список примеров применения)
131
+ - Можно дорабатывать существующий текст, но НЕ удалять актуальную информацию
132
+ - Удаляй только устаревшее или избыточное
133
+
134
+ **3. Специальные разделы (если есть):**
135
+
136
+ **Props (только для сложных случаев):**
137
+ - Описывай Props только если они имеют сложную логику взаимодействия, зависимости или составные типы
138
+ - НЕ описывай простые boolean/string props списком - для них достаточно JSDoc комментариев в типах
139
+ - Формат: `## Props`, затем `### НазваниеProp` для каждого сложного prop
140
+
141
+ Пример описания сложного prop:
142
+ ```md
143
+ ## Props
144
+ ### `adaptive`
145
+
146
+ Режим адаптивного поведения окна.
147
+
148
+ **Тип:** `'modal' | 'menu' | 'actionSheet' | 'static'`
149
+
150
+ **По умолчанию:** `'modal'`
151
+
152
+ **Возможные значения:**
153
+ - `'modal'` — модальное окно по центру экрана с оверлеем
154
+ - `'menu'` — выпадающее меню, привязанное к элементу управления
155
+ - `'actionSheet'` — нижняя панель для мобильных интерфейсов
156
+ - `'static'` — статичный режим без оверлея и позиционирования
157
+ ```
158
+
159
+ **4. Обязательные секции (если присутствуют в компоненте):**
160
+
161
+ **Expose методы/свойства:**
162
+ ```md
163
+ ## Expose методы
164
+ ### `methodName`
165
+
166
+ Описание метода.
167
+
168
+ **Тип:** `(param: Type) => ReturnType`
169
+
170
+ **Параметры:**
171
+ - `param: Type` — описание параметра
172
+
173
+ **Возвращает:** описание возвращаемого значения
174
+
175
+ [пример кода]
176
+ ```
177
+
178
+ **Слоты:**
179
+ ```md
180
+ ## Слоты
181
+ ### `slotName`
182
+
183
+ Описание слота.
184
+
185
+ **Параметры:**
186
+ - `param: Type` — описание параметра слота
187
+
188
+ [пример кода]
189
+ ```
190
+
191
+ **События:**
192
+ ```md
193
+ ## События
194
+ ### `eventName`
195
+
196
+ Описание события.
197
+
198
+ **Параметры:**
199
+ - `param: Type` — описание параметра события
200
+
201
+ **Структура Type:** (если параметр сложный)
202
+ - `field: string` — описание поля
203
+ - `field2: number` — описание поля
204
+
205
+ [пример кода]
206
+ ```
207
+
208
+ **5. Примеры использования:**
209
+ - Добавляй Canvas для демонстрации конкретных сценариев
210
+ - НЕ добавляй базовый `<Canvas of={Component.Component}/>` — он уже есть в начале
211
+ - Формат: `<Canvas of={Component.StoryName}/>`
212
+
213
+ **Строгие правила форматирования:**
214
+
215
+ - Заголовки уровней:
216
+ - `##` — основные разделы (Props, Expose методы, Слоты, События)
217
+ - `###` — конкретные элементы (названия методов, слотов, событий)
218
+ - `####` — подразделы внутри описания (Поведение, Примеры)
219
+
220
+ - Код:
221
+ - Типы и интерфейсы: ` ```ts `
222
+ - Разметка компонентов: ` ```html ` (НЕ ` ```vue `)
223
+ - Inline код: обёртка в обратные кавычки `` `код` ``
224
+
225
+ - Meta и StorybookMain:
226
+ - СТРОГО ЗАПРЕЩЕНО трогать блоки Meta и StorybookMain
227
+ - Они должны остаться как есть в начале файла
228
+ - Не добавлять, не удалять, не изменять их
229
+
230
+ - Структурные элементы:
231
+ - Используй `**Жирный текст:**` для подзаголовков внутри описаний
232
+ - Используй `>` для важных замечаний и предупреждений
233
+ - Списки только там, где они улучшают читаемость
234
+
235
+ **Пример полной структуры документа:**
236
+
237
+ ```md
238
+ import { Meta, Canvas } from '@storybook/addon-docs/blocks'
239
+ import * as Component from './Component.stories'
240
+
241
+ <Meta of={Component} />
89
242
 
90
- ====================================
91
- Пример MDX-документация (не включать в ответ, только как ориентир стиля)
92
- Обязательно соблюдай стиль и форматирование как в примере
93
- ====================================
94
243
  Компонент для создания модальных окон, диалогов и всплывающих элементов с гибким позиционированием и адаптивным поведением.
95
244
 
96
245
  Window управляет отображением контента поверх основного интерфейса, поддерживает различные типы позиционирования (модальные окна, выпадающие меню, action sheets), анимации открытия/закрытия и интеграцию с системой событий. Компонент автоматически обрабатывает клики вне области, управление фокусом и адаптацию под различные размеры экранов.
@@ -115,6 +264,8 @@ Window управляет отображением контента поверх
115
264
 
116
265
  ## CSS классы для управления поведением
117
266
 
267
+ Компонент использует специальные CSS классы для управления поведением:
268
+
118
269
  - `*--block` — предотвращает закрытие окна при клике вне его границ
119
270
  - `*--blockChildren` — предотвращает закрытие текущего окна
120
271
  - `*--blockOther` — предотвращает закрытие других окон до закрытия текущего
@@ -125,34 +276,20 @@ Window управляет отображением контента поверх
125
276
 
126
277
  Где `*` — название класса компонента (например, `d1-window`, `m3-window`).
127
278
 
128
- ## Статический режим (staticMode)
129
-
130
- Компонент Window поддерживает статический режим работы через свойство `staticMode`. В этом режиме окно работает как встроенный компонент без модального поведения:
131
-
132
- - **Содержимое отображается сразу** — окно не скрывается и не требует активации
133
- - **Отключены анимации** — нет эффектов появления/исчезновения
134
- - **Отключено позиционирование** — окно встраивается в поток документа
135
- - **Работает с adaptive** — когда свойство `adaptive` имеет один из статичных режимов (например, `static`), включается статичный режим
279
+ ## Props
280
+ ### `adaptive`
136
281
 
137
- Статический режим особенно полезен для встраивания содержимого окна непосредственно в интерфейс без модального поведения.
282
+ Режим адаптивного поведения окна.
138
283
 
139
- ## Направление позиционирования (axis)
284
+ **Тип:** `'modal' | 'menu' | 'actionSheet' | 'static'`
140
285
 
141
- Управляет осью размещения окна относительно элемента-якоря. По умолчанию: `y`.
142
-
143
- > Применяется только в режиме меню (`adaptive="menu"` или `adaptive="menuWindow"`).
286
+ **По умолчанию:** `'modal'`
144
287
 
145
288
  **Возможные значения:**
146
- - `'x'` — горизонтальная ось (слева или справа от якоря)
147
- - `'y'` — вертикальная ось (сверху или снизу от якоря)
148
- - `'on'` — поверх якоря (окно центрируется над элементом)
149
-
150
- ### Поведение
151
-
152
- - Компонент автоматически выбирает сторону размещения с наибольшим доступным пространством
153
- - При использовании контекстного меню (`contextmenu`) позиционирование происходит от координат курсора
154
- - Окно всегда остается в пределах видимой области экрана (viewport)
155
- - Отступ от якоря задается через свойство `indent` (по умолчанию 4px)
289
+ - `'modal'` — модальное окно по центру экрана
290
+ - `'menu'` — выпадающее меню, привязанное к элементу
291
+ - `'actionSheet'` — нижняя панель для мобильных устройств
292
+ - `'static'` — статичный режим без оверлея
156
293
 
157
294
  ## Управление состоянием через v-model
158
295
 
@@ -252,36 +389,61 @@ const handleWindow = (options) => {
252
389
  </template>
253
390
  ```
254
391
 
255
- Пример использования Canvas:
256
- <Canvas of={Chip.ChipSkeleton}/>
392
+ ## Примеры использования
393
+ ### Базовое модальное окно
394
+
395
+ <Canvas of={Component.BasicModal}/>
396
+
397
+ ### Выпадающее меню
398
+
399
+ <Canvas of={Component.DropdownMenu}/>
400
+ ```
257
401
 
258
402
  ====================================
259
403
  5) Итоговый возврат
260
404
  ====================================
261
- Верни результат строго в формате (ничего лишнего до или после):
405
+ Верни результат СТРОГО в формате (ничего лишнего до или после):
406
+
262
407
  [types.ts]
263
408
  #########
264
409
  [ComponentDoc.stories.ts]
265
410
  #########
266
- [UiPlayerLite.mdx]
267
-
268
- Где:
269
- - Не добавляй ничего лишнего (типа ```ts)
270
- - Не оборачивай в блоки.
271
- - Не оборачивай в ```ts или что-то подобное.
272
- - [types.ts] итоговый блок типов с комментариями (only content, without file name comments).
273
- - [ComponentDoc.stories.ts] итоговый файл историй (only content, without file name comments).
274
- - [UiPlayerLite.mdx] итоговая MDX-документация (only content, without file name comments).
275
- - Результат строго в этом порядке, разделённый строкой #########.
411
+ [ComponentName.mdx]
412
+
413
+ **Требования к формату вывода:**
414
+ - НЕ добавляй метки файлов типа `// filepath: ...`
415
+ - НЕ оборачивай в блоки кода (` ```ts `, ` ```md `)
416
+ - НЕ добавляй комментарии с названиями файлов
417
+ - НЕ включай в сам результат текст `[types.ts]`, `[ComponentDoc.stories.ts]`, `[ComponentName.mdx]`
418
+ - Только чистый код, разделённый строкой из девяти символов решётки: `#########`
419
+ - Порядок строго: типы истории документация
420
+ - Каждый блок начинается с первой строки кода, без пробелов и переносов перед
421
+
422
+ **Структура каждого блока:**
423
+ - `[types.ts]` — итоговый файл типов с JSDoc комментариями (только содержимое файла)
424
+ - `[ComponentDoc.stories.ts]` — итоговый файл историй (только содержимое файла)
425
+ - `[ComponentName.mdx]` — итоговая MDX-документация (только содержимое файла)
276
426
 
277
427
  ====================================
278
428
  Ограничения и стилистика
279
429
  ====================================
280
- - Никаких таблиц.
281
- - Никаких произвольных дополнительных разделов.
282
- - Не добавляй раздел "Props", если нет сложных зависимостей.
283
- - Не дублируй описание одного и того же.
284
- - Уважай язык [wikiLanguage] — если это "en" используй английский, иначе соответствующий язык.
285
- - Не используй placeholder'ы вне оговорённых.
286
- - Кодовые блоки: для типов и событий ```ts, для разметки — ```html при необходимости.
287
- - Сторисы: только необходимые сценарии, без лишних визуальных украшений.
430
+
431
+ **Запрещено:**
432
+ - Таблицы в любом виде
433
+ - Произвольные дополнительные разделы вне указанных
434
+ - Раздел "Props" для простых свойств без сложной логики
435
+ - Дублирование описаний одного и того же
436
+ - Placeholder'ы вне указанных в промпте (`[code]`, `[types]`, `[stories]`, `[md]`)
437
+ - Использование ` ```vue ` для примеров кода (только ` ```html `)
438
+ - Изменение Meta блока в MDX
439
+ - Добавление базового Canvas (`<Canvas of={Component.Component}/>`)
440
+
441
+ **Обязательно:**
442
+ - Язык документации соответствует [wikiLanguage]
443
+ - Если [wikiLanguage] = "en", используй английский для ВСЕЙ документации
444
+ - Если [wikiLanguage] = "ru", используй русский для ВСЕЙ документации
445
+ - Кодовые блоки: типы и события — ` ```ts `, разметка — ` ```html `
446
+ - Истории: только необходимые сценарии, без визуальных украшений
447
+ - Краткость и информативность без "воды"
448
+ - Технически корректные термины
449
+ - Примеры кода работоспособны и актуальны