@dxtmisha/scripts 0.4.5 → 0.5.0

package/src/media/templates/componentPrompt.ru.txt

@@ -1,449 +0,0 @@
-Нужно подготовить документацию для компонента на языке [wikiLanguage].
-Следуй строго формату и требованиям ниже.
-Не добавляй ничего лишнего вне описанного.
-Стек: Storybook 9.x, TypeScript, MDX, Vue 3 Composition API.
-
-Canvas компонент импортируется из '@storybook/addon-docs/blocks'
-
-====================================
-1) Изучи текущий код компонента
-====================================
-```
-[code]
-```
-
-Проанализируй:
-- Структуру компонента (props, computed, methods)
-- События (emit) и их параметры
-- Слоты (slots) и их параметры
-- Типы данных (interfaces, types)
-- Expose методы и свойства
-- Внутреннюю логику и поведение
-- Зависимости от других компонентов
-
-====================================
-2) Добавь недостающие комментарии к типам
-====================================
-Добавь краткие одноязычные (на [wikiLanguage]) JSDoc-комментарии к отсутствующим типам и их свойствам.
-
-Код для исправления:
-```ts
-// types.ts
-[types]
-```
-
-Требования к комментариям:
-- Однострочные для простых полей (/** Описание */)
-- Многострочные для сложных типов или блоков логики
-- Без дублирования очевидного (не комментируй "id" как "id компонента")
-- Адаптированы для отображения в Storybook
-- Используй технические термины правильно
-- Для union типов опиши каждое значение отдельно в коде
-
-Пример (строго следуй формату):
-```ts
-/**
- * Basic properties for image components.
- */
-export interface IconPropsBasic<
-  Image extends ImagePropsBasic = ImagePropsBasic
-> extends SkeletonPropsInclude {
-  // Status
-  /** Active state of the icon */
-  active?: boolean
-
-  // Icon
-  /** Значение основной иконки */
-  icon?: ImageValue<Image>
-  /** Значение активной иконки */
-  iconActive?: ImageValue<Image>
-
-  // Design
-  /**
-   * Размер иконки
-   * @default 'medium'
-   */
-  size?: 'small' | 'medium' | 'large'
-}
-```
-
-====================================
-3) Истории (stories) для Storybook
-====================================
-Создай минимально необходимые примеры. Каждая история демонстрирует конкретный сценарий использования.
-
-Код для исправления:
-```ts
-// ComponentDoc.stories.ts
-[stories]
-```
-
-Правила:
-- СТРОГО ЗАПРЕЩЕНО трогать const meta. НИЧЕГО НЕ МЕНЯТЬ В META.
-- Не трогать существующие константы и истории
-- Не переименовывать существующие константы
-- Не добавлять истории ради заполнения
-- Каждая история должна иметь цель и демонстрировать конкретную функциональность
-- Если компонент имеет разные режимы, покажи по одному чёткому примеру для каждого
-- Имена историй в стиле PascalCase без лишних слов (например: `Basic`, `WithIcon`, `Disabled`)
-- Минимизируй импорты: только необходимое
-- Не используй лишние обёртки (div, section) без необходимости
-- Простой, читаемый код
-
-Пример:
-```ts
-export const Basic: Story = {
-  args: {
-    label: 'Click me'
-  }
-}
-
-export const WithIcon: Story = {
-  args: {
-    label: 'Click me',
-    icon: 'check'
-  }
-}
-```
-
-====================================
-4) MDX-документация (описание компонента)
-====================================
-Подготовь полное описание компонента в формате MDX. Строгая стилистика: никаких таблиц, никаких лишних разделов, только необходимая информация.
-
-Код для исправления:
-```md
-// ComponentName.mdx
-[md]
-```
-
-Структура документа (строго):
-
-**1. Краткое описание (description):**
-- Одно предложение, максимально кратко передающее суть компонента
-- Не используй фразы типа "Этот компонент", начинай сразу с назначения
-
-**2. Основной текст документации (doc):**
-- Начинается БЕЗ заголовка
-- Детальное описание функциональности (2-4 абзаца)
-- Блок "**Основные возможности:**" (список ключевых фич)
-- Блок "**Типичные сценарии использования:**" (список примеров применения)
-- Можно дорабатывать существующий текст, но НЕ удалять актуальную информацию
-- Удаляй только устаревшее или избыточное
-
-**3. Специальные разделы (если есть):**
-
-**Props (только для сложных случаев):**
-- Описывай Props только если они имеют сложную логику взаимодействия, зависимости или составные типы
-- НЕ описывай простые boolean/string props списком - для них достаточно JSDoc комментариев в типах
-- Формат: `## Props`, затем `### НазваниеProp` для каждого сложного prop
-
-Пример описания сложного prop:
-```md
-## Props
-### `adaptive`
-
-Режим адаптивного поведения окна.
-
-**Тип:** `'modal' | 'menu' | 'actionSheet' | 'static'`
-
-**По умолчанию:** `'modal'`
-
-**Возможные значения:**
-- `'modal'` — модальное окно по центру экрана с оверлеем
-- `'menu'` — выпадающее меню, привязанное к элементу управления
-- `'actionSheet'` — нижняя панель для мобильных интерфейсов
-- `'static'` — статичный режим без оверлея и позиционирования
-```
-
-**4. Обязательные секции (если присутствуют в компоненте):**
-
-**Expose методы/свойства:**
-```md
-## Expose методы
-### `methodName`
-
-Описание метода.
-
-**Тип:** `(param: Type) => ReturnType`
-
-**Параметры:**
-- `param: Type` — описание параметра
-
-**Возвращает:** описание возвращаемого значения
-
-[пример кода]
-```
-
-**Слоты:**
-```md
-## Слоты
-### `slotName`
-
-Описание слота.
-
-**Параметры:**
-- `param: Type` — описание параметра слота
-
-[пример кода]
-```
-
-**События:**
-```md
-## События
-### `eventName`
-
-Описание события.
-
-**Параметры:**
-- `param: Type` — описание параметра события
-
-**Структура Type:** (если параметр сложный)
-- `field: string` — описание поля
-- `field2: number` — описание поля
-
-[пример кода]
-```
-
-**5. Примеры использования:**
-- Добавляй Canvas для демонстрации конкретных сценариев
-- НЕ добавляй базовый `<Canvas of={Component.Component}/>` — он уже есть в начале
-- Формат: `<Canvas of={Component.StoryName}/>`
-
-**Строгие правила форматирования:**
-
-- Заголовки уровней:
-  - `##` — основные разделы (Props, Expose методы, Слоты, События)
-  - `###` — конкретные элементы (названия методов, слотов, событий)
-  - `####` — подразделы внутри описания (Поведение, Примеры)
-
-- Код:
-  - Типы и интерфейсы: ` ```ts `
-  - Разметка компонентов: ` ```html ` (НЕ ` ```vue `)
-  - Inline код: обёртка в обратные кавычки `` `код` ``
-
-- Meta и StorybookMain:
-  - СТРОГО ЗАПРЕЩЕНО трогать блоки Meta и StorybookMain
-  - Они должны остаться как есть в начале файла
-  - Не добавлять, не удалять, не изменять их
-
-- Структурные элементы:
-  - Используй `**Жирный текст:**` для подзаголовков внутри описаний
-  - Используй `>` для важных замечаний и предупреждений
-  - Списки только там, где они улучшают читаемость
-
-**Пример полной структуры документа:**
-
-```md
-import { Meta, Canvas } from '@storybook/addon-docs/blocks'
-import * as Component from './Component.stories'
-
-<Meta of={Component} />
-
-Компонент для создания модальных окон, диалогов и всплывающих элементов с гибким позиционированием и адаптивным поведением.
-
-Window управляет отображением контента поверх основного интерфейса, поддерживает различные типы позиционирования (модальные окна, выпадающие меню, action sheets), анимации открытия/закрытия и интеграцию с системой событий. Компонент автоматически обрабатывает клики вне области, управление фокусом и адаптацию под различные размеры экранов.
-
-**Основные возможности:**
-
-- Гибкое позиционирование (центр, края, углы экрана)
-- Адаптивные режимы (modal, menu, actionSheet, static)
-- Анимации открытия/закрытия с настройкой origin
-- Управление состоянием через v-model или expose методы
-- Интеграция со Scrollbar для прокручиваемого контента
-- Блокировка взаимодействия с фоном (persistent режим)
-- События жизненного цикла окна
-
-**Типичные сценарии использования:**
-
-- Модальные окна для форм и подтверждений
-- Выпадающие меню и контекстные меню
-- Боковые панели и drawer компоненты
-- Action sheets для мобильных интерфейсов
-- Всплывающие подсказки и диалоги
-
-## CSS классы для управления поведением
-
-Компонент использует специальные CSS классы для управления поведением:
-
-- `*--block` — предотвращает закрытие окна при клике вне его границ
-- `*--blockChildren` — предотвращает закрытие текущего окна
-- `*--blockOther` — предотвращает закрытие других окон до закрытия текущего
-- `*--close` — применяется к элементам для закрытия окна
-- `*--controlOpenOnly` — применяется к элементам управления, которые только открывают окно
-- `*--controlStatic` — применяется к элементам управления в статическом режиме
-- `*--static` — применяется к элементам внутри окна, отменяя все действия
-
-Где `*` — название класса компонента (например, `d1-window`, `m3-window`).
-
-## Props
-### `adaptive`
-
-Режим адаптивного поведения окна.
-
-**Тип:** `'modal' | 'menu' | 'actionSheet' | 'static'`
-
-**По умолчанию:** `'modal'`
-
-**Возможные значения:**
-- `'modal'` — модальное окно по центру экрана
-- `'menu'` — выпадающее меню, привязанное к элементу
-- `'actionSheet'` — нижняя панель для мобильных устройств
-- `'static'` — статичный режим без оверлея
-
-## Управление состоянием через v-model
-
-Двусторонняя привязка состояния открытия окна через `v-model:open`.
-
-**Параметры:**
-- `open: boolean` — состояние открытия окна
-
-```html
-<script setup>
-import { ref } from 'vue'
-
-const isOpen = ref(false)
-</script>
-
-<template>
-  <button @click="isOpen = true">Открыть</button>
-
-  <Window v-model:open="isOpen">
-    <template #default>
-      <p>Содержимое окна</p>
-      <button @click="isOpen = false">Закрыть</button>
-    </template>
-  </Window>
-</template>
-```
-
-## Expose методы
-### `id`
-
-Уникальный идентификатор окна.
-
-**Тип:** `string`
-
-```html
-<script setup>
-const windowRef = ref()
-
-onMounted(() => {
-  console.log(windowRef.value.id) // "window-123"
-})
-</script>
-
-<template>
-  <Window ref="windowRef" />
-</template>
-```
-
-## Слоты
-### `control`
-
-Слот для размещения элементов управления окном (кнопки закрытия, минимизации и т.д.).
-
-**Параметры:**
-- `props: WindowControlItem` — объект с данными управления окном
-
-```html
-<Window>
-  <template #control="{ onclick, open }">
-    <button @click="onclick">
-      {{ open ? 'Закрыть' : 'Открыть' }}
-    </button>
-  </template>
-</Window>
-```
-
-## События
-### `window`
-
-Событие срабатывает при изменении состояния окна (открытие/закрытие).
-
-**Параметры:**
-- `options: WindowEmitOptions` — объект с данными окна
-
-**Структура WindowEmitOptions:**
-- `id: string` — уникальный идентификатор окна
-- `element: HTMLDivElement` — DOM элемент окна
-- `control: HTMLElement` — DOM элемент управления
-- `open: boolean` — состояние открытия окна (`true` - открыто, `false` - закрыто)
-
-```html
-<script setup>
-const handleWindow = (options) => {
-  console.log('ID окна:', options.id)
-  console.log('Окно открыто:', options.open)
-  console.log('Элемент окна:', options.element)
-  console.log('Элемент управления:', options.control)
-}
-</script>
-
-<template>
-  <Window @window="handleWindow">
-    <template #default>
-      <p>Содержимое окна</p>
-    </template>
-  </Window>
-</template>
-```
-
-## Примеры использования
-### Базовое модальное окно
-
-<Canvas of={Component.BasicModal}/>
-
-### Выпадающее меню
-
-<Canvas of={Component.DropdownMenu}/>
-```
-
-====================================
-5) Итоговый возврат
-====================================
-Верни результат СТРОГО в формате (ничего лишнего до или после):
-
-[types.ts]
-#########
-[ComponentDoc.stories.ts]
-#########
-[ComponentName.mdx]
-
-**Требования к формату вывода:**
-- НЕ добавляй метки файлов типа `// filepath: ...`
-- НЕ оборачивай в блоки кода (` ```ts `, ` ```md `)
-- НЕ добавляй комментарии с названиями файлов
-- НЕ включай в сам результат текст `[types.ts]`, `[ComponentDoc.stories.ts]`, `[ComponentName.mdx]`
-- Только чистый код, разделённый строкой из девяти символов решётки: `#########`
-- Порядок строго: типы → истории → документация
-- Каждый блок начинается с первой строки кода, без пробелов и переносов перед
-
-**Структура каждого блока:**
-- `[types.ts]` — итоговый файл типов с JSDoc комментариями (только содержимое файла)
-- `[ComponentDoc.stories.ts]` — итоговый файл историй (только содержимое файла)
-- `[ComponentName.mdx]` — итоговая MDX-документация (только содержимое файла)
-
-====================================
-Ограничения и стилистика
-====================================
-
-**Запрещено:**
-- Таблицы в любом виде
-- Произвольные дополнительные разделы вне указанных
-- Раздел "Props" для простых свойств без сложной логики
-- Дублирование описаний одного и того же
-- Placeholder'ы вне указанных в промпте (`[code]`, `[types]`, `[stories]`, `[md]`)
-- Использование ` ```vue ` для примеров кода (только ` ```html `)
-- Изменение Meta блока в MDX
-- Добавление базового Canvas (`<Canvas of={Component.Component}/>`)
-
-**Обязательно:**
-- Язык документации соответствует [wikiLanguage]
-- Если [wikiLanguage] = "en", используй английский для ВСЕЙ документации
-- Если [wikiLanguage] = "ru", используй русский для ВСЕЙ документации
-- Кодовые блоки: типы и события — ` ```ts `, разметка — ` ```html `
-- Истории: только необходимые сценарии, без визуальных украшений
-- Краткость и информативность без "воды"
-- Технически корректные термины
-- Примеры кода работоспособны и актуальны