@dxtmisha/wiki 0.39.5 → 0.39.7

package/src/media/descriptions/wikiDescriptionsCell.ts

@@ -1,121 +0,0 @@
-import type { StorybookComponentsDescriptionItem } from '../../types/storybookTypes'
-
-/**
- * Descriptions for Cell component properties
- *
- * Описания свойств компонента Cell
- */
-export const wikiDescriptionsCell: StorybookComponentsDescriptionItem = {
-  name: 'Cell',
-  description: {
-    en: 'Versatile container component for displaying structured content with labels, descriptions, and actions',
-    ru: 'Универсальный контейнерный компонент для отображения структурированного контента с метками, описаниями и действиями'
-  },
-  possibilities: {
-    en: [
-      'flexible content structure with label, description, and caption',
-      'interactive states including focus, selected, and disabled',
-      'built-in icon and trailing icon support',
-      'progress indicator integration',
-      'divider customization options',
-      'dynamic behavior with hover interactions',
-      'skeleton loading state support',
-      'click event handling with custom data'
-    ],
-    ru: [
-      'гибкая структура контента с меткой, описанием и подписью',
-      'интерактивные состояния включая focus, selected и disabled',
-      'встроенная поддержка иконок и завершающих иконок',
-      'интеграция индикатора прогресса',
-      'возможности настройки разделителей',
-      'динамическое поведение с взаимодействием при наведении',
-      'поддержка состояния загрузки скелетона',
-      'обработка событий клика с пользовательскими данными'
-    ]
-  },
-  render: `
-    <DesignComponent v-bind="args"/>
-    <DesignComponent v-bind="args"/>
-    <DesignComponent v-bind="args"/>
-    `,
-  import: [],
-  stories: [
-    {
-      id: 'CellSkeleton',
-      name: {
-        en: 'Skeleton loading',
-        ru: 'Загрузка скелетона'
-      },
-      components: ['Skeleton'],
-      template: `
-        <DesignSkeleton :active="true">
-          <DesignComponent
-            :isSkeleton="true"
-            caption="Caption"
-            description="Short desc."
-            label="A"
-          />
-          <DesignComponent
-            :isSkeleton="true"
-            caption="Caption"
-            description="A bit longer description for the cell component."
-            label="Label Example"
-          />
-          <DesignComponent
-            :isSkeleton="true"
-            caption="Caption"
-            description="This is a much longer description to demonstrate how the skeleton adapts to different content lengths in the cell."
-            label="Very Long Label Example for Skeleton"
-          />
-        </DesignSkeleton>
-      `
-    },
-    {
-      id: 'CellSlots',
-      name: {
-        en: 'Slots usage',
-        ru: 'Использование слотов'
-      },
-      template: `
-        <DesignComponent icon="home">
-          <template #default>Default slot</template>
-          <template #description>Description slot</template>
-          <template #caption>Caption slot</template>
-          <template #trailing>Trailing slot</template>
-          <template #body>Body slot</template>
-        </DesignComponent>
-      `
-    }
-  ],
-  documentation: {
-    body: `
-<StorybookDescriptions componentName={'Cell'} type={'cell'}/>
-
-<StorybookDescriptions componentName={'Style'} type={'isSkeleton'}/>
-<Canvas of={Component.CellSkeleton}/>
-`,
-    events: `
-<StorybookDescriptions componentName={'Event'} type={'click'}/>
-    `,
-    expose: `
-<StorybookDescriptions componentName={'Expose'} type={'value'}/>
-<StorybookDescriptions componentName={'Expose'} type={'detail'}/>
-<StorybookDescriptions componentName={'Expose'} type={'labelId'}/>
-<StorybookDescriptions componentName={'Expose'} type={'descriptionId'}/>
-    `,
-    slots: `
-<Canvas of={Component.CellSlots}/>
-<StorybookDescriptions componentName={'Slot'} type={'default'}/>
-<StorybookDescriptions componentName={'Slot'} type={'caption'}/>
-<StorybookDescriptions componentName={'Slot'} type={'description'}/>
-<StorybookDescriptions componentName={'Cell'} type={'slots'}/>
-`
-  },
-  ai: {
-    description: `
-Universal list item component for building structured interfaces like menus, settings, and data lists. Provides a standardized row layout with dedicated areas for icons, text, and actions.
-Features a composable structure with label, description, and caption support. Includes interactive states (hover, focus, selected, loading), built-in Ripple effect, and skeleton loading integration.
-Highly flexible via slots (#default, #trailing, #body) and controlled through content props and navigation attributes (to/href). Use for clickable rows, menu items, or complex data entities in lists.
-    `
-  }
-}

package/src/media/descriptions/wikiDescriptionsCheckbox.ts

@@ -1,134 +0,0 @@
-import type { StorybookComponentsDescriptionItem } from '../../types/storybookTypes'
-
-/**
- * Descriptions for Checkbox component
- *
- * Описания свойств компонента Checkbox
- */
-export const wikiDescriptionsCheckbox: StorybookComponentsDescriptionItem = {
-  name: 'Checkbox',
-  description: {
-    en: 'Interactive checkbox component for binary or indeterminate state selection',
-    ru: 'Интерактивный компонент чекбокса для выбора бинарного или неопределённого состояния'
-  },
-  possibilities: {
-    en: [
-      'checked, unchecked, and indeterminate states',
-      'built-in validation support with custom messages',
-      'label and description text support',
-      'customizable icons for checked and indeterminate states',
-      'disabled and loading states',
-      'ripple effect on interaction',
-      'skeleton state for loading placeholders',
-      'adaptive layout options',
-      'form integration with name and value attributes'
-    ],
-    ru: [
-      'состояния: отмечен, не отмечен и неопределённое',
-      'встроенная поддержка валидации с пользовательскими сообщениями',
-      'поддержка текста метки и описания',
-      'настраиваемые иконки для состояний отмечен и неопределённое',
-      'состояния отключения и загрузки',
-      'эффект волны при взаимодействии',
-      'состояние скелетона для заполнителей загрузки',
-      'опции адаптивной разметки',
-      'интеграция с формами через атрибуты name и value'
-    ]
-  },
-  import: [
-    'import { ref } from \'vue\''
-  ],
-  stories: [
-    {
-      id: 'CheckboxVModel',
-      name: {
-        en: 'Two-way binding (v-model)',
-        ru: 'Двусторонняя привязка (v-model)'
-      },
-      setup: `
-      return {
-        checkboxValue: ref(false),
-        indeterminateValue: ref(null)
-      }
-      `,
-      template: `
-        <div class="wiki-storybook-flex-column">
-          <div class="wiki-storybook-flex">
-            <button class="wiki-storybook-button" @click="checkboxValue = !checkboxValue">Check {{ checkboxValue }}</button>
-          </div>
-          <DesignComponent
-            v-model="checkboxValue"
-            label="Checkbox with v-model"
-          />
-        </div>
-      `
-    },
-    {
-      id: 'CheckboxSkeleton',
-      name: {
-        en: 'Skeleton',
-        ru: 'Скелетон'
-      },
-      components: ['Skeleton'],
-      template: `
-        <DesignSkeleton :active="true">
-          <div class="wiki-storybook-flex-column">
-            <DesignComponent isSkeleton label="Loading checkbox" />
-            <DesignComponent isSkeleton label="Another loading checkbox" />
-          </div>
-        </DesignSkeleton>
-      `
-    },
-    {
-      id: 'CheckboxSlots',
-      name: {
-        en: 'Slots usage',
-        ru: 'Использование слотов'
-      },
-      template: `
-        <DesignComponent>
-          <template #default>
-            <strong>Custom label slot</strong>
-          </template>
-          <template #description>
-            <em>Custom description slot</em>
-          </template>
-        </DesignComponent>
-      `
-    }
-  ],
-  documentation: {
-    body: `
-<StorybookDescriptions componentName={'Checkbox'} type={'checkbox'}/>
-
-<StorybookDescriptions componentName={'Checkbox'} type={'value'}/>
-<StorybookDescriptions componentName={'Checkbox'} type={'indeterminate'}/>
-<StorybookDescriptions componentName={'Value'} type={'v-model'}/>
-<Canvas of={Component.CheckboxVModel}/>
-
-<StorybookDescriptions componentName={'Style'} type={'isSkeleton'}/>
-<Canvas of={Component.CheckboxSkeleton}/>
-    `,
-    events: `
-<StorybookDescriptions componentName={'Event'} type={'input'}/>
-<StorybookDescriptions componentName={'Event'} type={'change'}/>
-    `,
-    expose: `
-<StorybookDescriptions componentName={'Expose'} type={'value'}/>
-<StorybookDescriptions componentName={'Expose'} type={'checkValidity'}/>
-<StorybookDescriptions componentName={'Expose'} type={'validationMessage'}/>
-    `,
-    slots: `
-<Canvas of={Component.CheckboxSlots}/>
-<StorybookDescriptions componentName={'Slot'} type={'label'}/>
-<StorybookDescriptions componentName={'Slot'} type={'description'}/>
-    `
-  },
-  ai: {
-    description: `
-Form control component for binary (yes/no) or indeterminate state selection. Allows users to toggle specific options or select multiple items from a list with visual feedback.
-Features support for primary label, secondary description, and custom icons for checked/indeterminate states. Includes built-in validation, loading indicators, and adaptive layout options.
-Controlled via v-model or value prop and emits @input/@change events. Use for terms agreement, feature toggles, or parent-child coordinated selections (via indeterminate state).
-    `
-  }
-}

package/src/media/descriptions/wikiDescriptionsChip.ts

@@ -1,144 +0,0 @@
-import type { StorybookComponentsDescriptionItem } from '../../types/storybookTypes'
-
-/**
- * Descriptions for Chip component properties
- *
- * Описания свойств компонента Chip
- */
-export const wikiDescriptionsChip: StorybookComponentsDescriptionItem = {
-  name: 'Chip',
-  description: {
-    en: 'Compact element that represents an input, attribute, or action',
-    ru: 'Компактный элемент, представляющий ввод, атрибут или действие'
-  },
-  possibilities: {
-    en: [
-      'multiple visual variants for different contexts',
-      'selectable state for user interaction',
-      'disabled state support',
-      'customizable styling through design tokens',
-      'icon support for enhanced visual representation',
-      'adaptive behavior for different screen sizes'
-    ],
-    ru: [
-      'множественные визуальные варианты для разных контекстов',
-      'выбираемое состояние для взаимодействия пользователя',
-      'поддержка отключенного состояния',
-      'настраиваемая стилизация через токены дизайна',
-      'поддержка иконок для улучшенного визуального представления',
-      'адаптивное поведение для разных размеров экрана'
-    ]
-  },
-  import: [],
-  stories: [
-    {
-      id: 'ChipInput',
-      name: {
-        en: 'Input',
-        ru: 'Ввод (input)'
-      },
-      template: `
-        <div class="wiki-storybook-flex">
-          <DesignComponent>Chip</DesignComponent>
-          <DesignComponent input>Tag</DesignComponent>
-          <DesignComponent input icon="person">Contact</DesignComponent>
-          <DesignComponent input selected icon="tag">Keyword</DesignComponent>
-        </div>
-      `,
-      propsName: 'input'
-    },
-    {
-      id: 'ChipAssistive',
-      name: {
-        en: 'Assistive',
-        ru: 'Вспомогательные (assistive)'
-      },
-      template: `
-        <div class="wiki-storybook-flex">
-          <DesignComponent>Chip</DesignComponent>
-          <DesignComponent assistive>Chip</DesignComponent>
-          <DesignComponent assistive icon="lightbulb">Suggestion</DesignComponent>
-          <DesignComponent assistive selected icon="check">Recommended</DesignComponent>
-        </div>
-      `,
-      propsName: 'assistive'
-    },
-    {
-      id: 'ChipAdaptive',
-      name: {
-        en: 'Adaptive',
-        ru: 'Адаптивные'
-      },
-      template: `
-        <div class="wiki-storybook-group">
-          <div class="wiki-storybook-item wiki-storybook-item--squared--sm wiki-storybook-item--center">
-            <div class="wiki-storybook-item__label">Default</div>
-            <DesignComponent icon="star" label="Chip"/>
-          </div>
-          <div class="wiki-storybook-item wiki-storybook-item--squared--sm wiki-storybook-item--center">
-            <div class="wiki-storybook-item__label">Adaptive</div>
-            <DesignComponent adaptive="fullSm" icon="star" label="Chip"/>
-          </div>
-          <div class="wiki-storybook-item wiki-storybook-item--squared--sm wiki-storybook-item--center wiki-storybook-container">
-            <div class="wiki-storybook-item__label">Container</div>
-            <DesignComponent container="fullSm" icon="star" label="Chip"/>
-          </div>
-        </div>
-      `,
-      propsName: 'adaptive'
-    },
-    {
-      id: 'ChipSkeleton',
-      name: {
-        en: 'Skeleton',
-        ru: 'Скелетон'
-      },
-      components: ['Skeleton'],
-      template: `
-        <DesignSkeleton :active="true">
-          <DesignComponent isSkeleton>Chip</DesignComponent>
-        </DesignSkeleton>
-      `
-    }
-  ],
-  documentation: {
-    body: `
-<StorybookDescriptions componentName={'Chip'} type={'chip'}/>
-
-<template prop="input">
-<StorybookDescriptions componentName={'Chip'} type={'input'}/>
-<Canvas of={Component.ChipInput}/>
-</template>
-
-<template prop="assistive">
-<StorybookDescriptions componentName={'Chip'} type={'assistive'}/>
-<Canvas of={Component.ChipAssistive}/>
-</template>
-
-<StorybookDescriptions componentName={'Value'} type={'value'}/>
-
-<StorybookDescriptions componentName={'Style'} type={'adaptive'}/>
-<Canvas of={Component.ChipAdaptive}/>
-
-<StorybookDescriptions componentName={'Style'} type={'isSkeleton'}/>
-<Canvas of={Component.ChipSkeleton}/>
-    `,
-    events: `
-<StorybookDescriptions componentName={'Event'} type={'click'}/>
-    `,
-    expose: `
-<StorybookDescriptions componentName={'Expose'} type={'value'}/>
-<StorybookDescriptions componentName={'Expose'} type={'detail'}/>
-    `,
-    slots: `
-<StorybookDescriptions componentName={'Slot'} type={'default'}/>
-    `
-  },
-  ai: {
-    description: `
-Compact interactive element representing an input, attribute, or action. Used for entering information, making selections, filtering content, or triggering immediate actions in a space-efficient way.
-Features multiple functional variants (Action, Input, Assistive, Filter) with support for leading icons and selection states. Includes built-in support for disabled/selected states and adaptive layout options.
-Controlled via value/label props and emits @click events with detailed data. Use for filter tags, choice groups (like radio buttons), or representing entities like contacts in input fields.
-    `
-  }
-}

package/src/media/descriptions/wikiDescriptionsChipGroup.ts

@@ -1,113 +0,0 @@
-import type { StorybookComponentsDescriptionItem } from '../../types/storybookTypes'
-
-/**
- * Descriptions for ChipGroup component properties
- *
- * Описания свойств компонента ChipGroup
- */
-export const wikiDescriptionsChipGroup: StorybookComponentsDescriptionItem = {
-  name: 'ChipGroup',
-  description: {
-    en: 'Component for managing a group of interactive chips with support for selection and data binding',
-    ru: 'Компонент для управления группой интерактивных чипов с поддержкой выбора и привязки данных'
-  },
-  possibilities: {
-    en: [
-      'rendering a list of chips from a data array',
-      'managing selection state (single or multiple)',
-      'customizing the appearance of all chips in the group via chipAttrs',
-      'handling click events and value updates',
-      'controlling icon visibility based on selection'
-    ],
-    ru: [
-      'рендеринг списка чипов из массива данных',
-      'управление состоянием выбора (одиночный или множественный)',
-      'настройка внешнего вида всех чипов в группе через chipAttrs',
-      'обработка событий клика и обновлений значений',
-      'управление видимостью иконки в зависимости от выбора'
-    ]
-  },
-  import: [
-    'import { ref } from \'vue\''
-  ],
-  stories: [
-    {
-      id: 'ChipGroupSelection',
-      name: {
-        en: 'Selection States',
-        ru: 'Состояния выбора'
-      },
-      template: `
-        <div class="wiki-storybook-flex-column">
-          <DesignComponent :list="['Option 1', 'Option 2', 'Option 3']" selected="2"/>
-          <DesignComponent :list="['Option 1', 'Option 2', 'Option 3', 'Option 4']" :selected="['2', '3']"/>
-          <DesignComponent
-            :list="[
-              { label: 'Option 1', icon: 'check', value: 'option1' },
-              { label: 'Option 2', icon: 'check', value: 'option2' },
-              { label: 'Option 3', icon: 'check', value: 'option3' }
-            ]"
-            :selected="['option2']"
-            :icon-when-selected="true"
-          />
-        </div>
-      `
-    },
-    {
-      id: 'ChipGroupVModel',
-      name: {
-        en: 'Two-way binding (v-model)',
-        ru: 'Двусторонняя привязка (v-model)'
-      },
-      setup: `
-      return {
-        multipleSelected: ref(['option1', 'option3'])
-      }
-      `,
-      template: `
-        <div class="wiki-storybook-flex-column">
-          <div class="wiki-storybook-flex">
-            <span>Current value: {{ multipleSelected }}</span>
-            <button class="wiki-storybook-button" @click="multipleSelected = ['option1', 'option2']">Select 1,2</button>
-            <button class="wiki-storybook-button" @click="multipleSelected = ['option1', 'option2', 'option3']">Add 3</button>
-            <button class="wiki-storybook-button wiki-storybook-button--warning" @click="multipleSelected = []">Clear all</button>
-          </div>
-          <DesignComponent
-            v-model:selected="multipleSelected"
-            :list="[
-              { label: 'Option 1', value: 'option1', icon: 'check' },
-              { label: 'Option 2', value: 'option2', icon: 'check' },
-              { label: 'Option 3', value: 'option3', icon: 'check' }
-            ]"
-            :readonly="false"
-            :icon-when-selected="true"
-          />
-        </div>
-      `
-    }
-  ],
-  documentation: {
-    body: `
-    <StorybookDescriptions componentName={'ChipGroup'} type={'chipGroup'}/>
-
-    <StorybookDescriptions componentName={'ChipGroup'} type={'selected'}/>
-    <Canvas of={Component.ChipGroupSelection}/>
-
-    <StorybookDescriptions componentName={'Value'} type={'v-model:selected'}/>
-    <Canvas of={Component.ChipGroupVModel}/>
-    `,
-    events: `
-    <StorybookDescriptions componentName={'Event'} type={'click'}/>
-    `,
-    slots: `
-    <StorybookDescriptions componentName={'Slot'} type={'default'}/>
-    `
-  },
-  ai: {
-    description: `
-Wrapper component for managing collections of Chip elements based on an array of data. Streamlines the creation of filter sets, choice groups, and tag lists by automating iteration and selection logic.
-Features support for single and multiple selection modes, shared chip attributes (via chipAttrs), and icon visibility control. Includes built-in data binding for selected values and @click event propagation.
-Controlled via the list prop for data and v-model:selected for state. Use for dynamic filtering interfaces, selecting multiple categories, or building interactive tag lists from API data.
-    `
-  }
-}