@dxtmisha/wiki 0.24.2 → 0.25.1

package/src/media/props/wikiTechnical.ts

@@ -10,6 +10,50 @@ import {
  * Объект wikiTechnical содержит общие технические свойства для всех компонентов
  */
 export const wikiTechnical: StorybookArgsToList = {
+  helperId: {
+    type: StorybookControl.string,
+    options: {
+      category: StorybookCategory.technical,
+      type: 'string',
+      description: {
+        en: 'Unique identifier for the helper message element',
+        ru: 'Уникальный идентификатор для элемента вспомогательного сообщения'
+      }
+    }
+  },
+  id: {
+    type: StorybookControl.string,
+    options: {
+      category: StorybookCategory.technical,
+      type: 'string',
+      description: {
+        en: 'Unique identifier attribute for the element',
+        ru: 'Уникальный идентификатор атрибута для элемента'
+      }
+    }
+  },
+  labelId: {
+    type: StorybookControl.string,
+    options: {
+      category: StorybookCategory.technical,
+      type: 'string',
+      description: {
+        en: 'Unique identifier for the label element',
+        ru: 'Уникальный идентификатор для элемента метки'
+      }
+    }
+  },
+  messageId: {
+    type: StorybookControl.string,
+    options: {
+      category: StorybookCategory.technical,
+      type: 'string',
+      description: {
+        en: 'Unique identifier for the message element',
+        ru: 'Уникальный идентификатор для элемента сообщения'
+      }
+    }
+  },
   modelOpen: {
     type: StorybookControl.boolean,
     options: {
@@ -20,6 +64,16 @@ export const wikiTechnical: StorybookArgsToList = {
       }
     }
   },
+  modelSelected: {
+    type: StorybookControl.object,
+    options: {
+      category: StorybookCategory.technical,
+      description: {
+        en: 'Two-way binding for selected state (v-model:selected)',
+        ru: 'Двусторонняя привязка состояния выбора (v-model:selected)'
+      }
+    }
+  },
   modelValue: {
     type: StorybookControl.object,
     options: {
@@ -29,5 +83,16 @@ export const wikiTechnical: StorybookArgsToList = {
         ru: 'Двусторонняя привязка значения компонента (v-model)'
       }
     }
+  },
+  validationId: {
+    type: StorybookControl.string,
+    options: {
+      category: StorybookCategory.technical,
+      type: 'string',
+      description: {
+        en: 'Unique identifier for the validation message element',
+        ru: 'Уникальный идентификатор для элемента сообщения валидации'
+      }
+    }
   }
 }

package/src/media/props/wikiText.ts

@@ -0,0 +1,57 @@
+import {
+  type StorybookArgsToList,
+  StorybookCategory,
+  StorybookControl
+} from '../../types/storybookTypes'
+
+/**
+ * The wikiText object contains descriptions of all text properties
+ *
+ * Объект wikiText содержит описание всех текстовых свойств
+ */
+export const wikiText: StorybookArgsToList = {
+  textClose: {
+    type: StorybookControl.text,
+    options: {
+      category: StorybookCategory.text,
+      type: 'string | (() => string)',
+      description: {
+        en: 'Close text',
+        ru: 'Текст закрытия'
+      }
+    }
+  },
+  textCopiedClipboard: {
+    type: StorybookControl.text,
+    options: {
+      category: StorybookCategory.text,
+      type: 'string | (() => string)',
+      description: {
+        en: 'Text displayed when content is copied to clipboard',
+        ru: 'Текст, отображаемый при копировании содержимого в буфер обмена'
+      }
+    }
+  },
+  textEntriesMatch: {
+    type: StorybookControl.text,
+    options: {
+      category: StorybookCategory.text,
+      type: 'string | (() => string)',
+      description: {
+        en: 'Text for entries mismatch validation message',
+        ru: 'Текст сообщения валидации о несовпадении записей'
+      }
+    }
+  },
+  textOk: {
+    type: StorybookControl.text,
+    options: {
+      category: StorybookCategory.text,
+      type: 'string | (() => string)',
+      description: {
+        en: 'OK text',
+        ru: 'Текст подтверждения'
+      }
+    }
+  }
+}

package/src/media/props/wikiTooltip.ts

@@ -0,0 +1,53 @@
+import {
+  type StorybookArgsToList,
+  StorybookCategory,
+  StorybookControl
+} from '../../types/storybookTypes'
+
+/**
+ * The wikiTooltip object contains descriptions of all properties for the Tooltip component
+ *
+ * Объект wikiTooltip содержит описание всех свойств для компонента Tooltip
+ */
+export const wikiTooltip: StorybookArgsToList = {
+  'tooltip.delay': {
+    type: StorybookControl.number,
+    options: {
+      category: StorybookCategory.style,
+      description: {
+        en: 'Delay before showing the tooltip',
+        ru: 'Задержка перед появлением подсказки'
+      }
+    }
+  },
+  'tooltip.delayHide': {
+    type: StorybookControl.number,
+    options: {
+      category: StorybookCategory.style,
+      description: {
+        en: 'Delay before hiding the tooltip',
+        ru: 'Задержка перед скрытием подсказки'
+      }
+    }
+  },
+  'tooltip.indent': {
+    type: StorybookControl.number,
+    options: {
+      category: StorybookCategory.style,
+      description: {
+        en: 'Indent from the element',
+        ru: 'Отступ от элемента'
+      }
+    }
+  },
+  'tooltip.top': {
+    type: StorybookControl.boolean,
+    options: {
+      category: StorybookCategory.style,
+      description: {
+        en: 'Displaying the tooltip on top of the element',
+        ru: 'Отображение подсказки поверх элемента'
+      }
+    }
+  }
+}

package/src/media/props/wikiValue.ts

@@ -31,75 +31,24 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  barsDescription: {
+  currency: {
     type: StorybookControl.string,
     options: {
       category: StorybookCategory.value,
       type: 'string',
       description: {
-        en: 'Description text displayed in the bars area (subtitle/help)',
-        ru: 'Текст описания, отображаемый в области бара (подзаголовок/подсказка)'
-      }
-    }
-  },
-  barsLabel: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: ['string', 'number'],
-      description: {
-        en: 'Label or numeric indicator shown in the bars header',
-        ru: 'Метка или числовой индикатор, отображаемый в заголовке бара'
+        en: 'Currency code for formatting monetary values',
+        ru: 'Код валюты для форматирования денежных значений'
       }
     }
   },
-  barsList: {
-    type: StorybookControl.object,
-    options: {
-      category: StorybookCategory.value,
-      description: {
-        en: 'Array of buttons displayed in the bars area (actions)',
-        ru: 'Массив кнопок, отображаемых в области бара (действия)'
-      },
-      value: [
-        { icon: 'home', label: 'Home' },
-        { icon: 'search', label: 'Search' },
-        { icon: 'settings', label: 'Settings' }
-      ]
-    }
-  },
-  caption: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string',
-      description: {
-        en: 'Caption text for additional information',
-        ru: 'Текст подписи для дополнительной информации'
-      },
-      value: 'Caption'
-    }
-  },
-  counter: {
-    type: StorybookControl.number,
-    options: {
-      category: StorybookCategory.value,
-      type: ['number', 'string'],
-      description: {
-        en: 'Current character count',
-        ru: 'Текущее количество символов'
-      },
-      value: 25
-    }
-  },
-  currency: {
-    type: StorybookControl.string,
+  currencyHide: {
+    type: StorybookControl.boolean,
     options: {
       category: StorybookCategory.value,
-      type: 'string',
       description: {
-        en: 'Currency code for formatting monetary values',
-        ru: 'Код валюты для форматирования денежных значений'
+        en: 'Hide the currency symbol in the formatted value',
+        ru: 'Скрывать символ валюты в форматированном значении'
       }
     }
   },
@@ -114,18 +63,6 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  description: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string',
-      description: {
-        en: 'Description text providing additional context',
-        ru: 'Текст описания, предоставляющий дополнительный контекст'
-      },
-      value: 'Here is a detailed description of the component'
-    }
-  },
   detail: {
     type: StorybookControl.object,
     options: {
@@ -158,26 +95,25 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  helperMessage: {
+  highlight: {
     type: StorybookControl.string,
     options: {
       category: StorybookCategory.value,
       type: 'string',
       description: {
-        en: 'Helper text providing guidance or additional information',
-        ru: 'Вспомогательный текст, предоставляющий руководство или дополнительную информацию'
-      },
-      value: 'This is a helpful message'
+        en: 'Text to highlight within the component content',
+        ru: 'Текст для выделения в содержимом компонента'
+      }
     }
   },
-  highlight: {
+  href: {
     type: StorybookControl.string,
     options: {
       category: StorybookCategory.value,
       type: 'string',
       description: {
-        en: 'Text to highlight within the component content',
-        ru: 'Текст для выделения в содержимом компонента'
+        en: 'URL or link destination',
+        ru: 'URL или адрес ссылки'
       }
     }
   },
@@ -214,40 +150,6 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  icon: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: ['string', 'File'],
-      description: {
-        en: 'Value of the main icon',
-        ru: 'Значение основной иконки'
-      },
-      value: 'home'
-    }
-  },
-  iconTrailing: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: ['string', 'File'],
-      description: {
-        en: 'Value of the trailing icon',
-        ru: 'Значение завершающей иконки'
-      }
-    }
-  },
-  image: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string | File | ImageProps',
-      description: {
-        en: 'Specifies the image value for the component',
-        ru: 'Указывает значение изображения для компонента'
-      }
-    }
-  },
   index: {
     type: StorybookControl.number,
     options: {
@@ -259,52 +161,6 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  label: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string',
-      description: {
-        en: 'Text label for the component',
-        ru: 'Текстовая метка для компонента'
-      },
-      value: 'Label'
-    }
-  },
-  labelMax: {
-    type: StorybookControl.number,
-    options: {
-      category: StorybookCategory.value,
-      type: 'number',
-      description: {
-        en: 'Maximum length of the label text before truncation',
-        ru: 'Максимальная длина текста метки перед обрезкой'
-      }
-    }
-  },
-  max: {
-    type: StorybookControl.number,
-    options: {
-      category: StorybookCategory.value,
-      type: ['number', 'string'],
-      description: {
-        en: 'Maximum value',
-        ru: 'Максимальное значение'
-      }
-    }
-  },
-  maxlength: {
-    type: StorybookControl.number,
-    options: {
-      category: StorybookCategory.value,
-      type: ['number', 'string'],
-      description: {
-        en: 'Maximum allowed characters',
-        ru: 'Максимально допустимое количество символов'
-      },
-      value: 100
-    }
-  },
   name: {
     type: StorybookControl.string,
     options: {
@@ -316,40 +172,6 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  prefix: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string',
-      description: {
-        en: 'Prefix text displayed before the main content',
-        ru: 'Текст префикса, отображаемый перед основным содержимым'
-      },
-      value: 'Prefix'
-    }
-  },
-  required: {
-    type: StorybookControl.boolean,
-    options: {
-      category: StorybookCategory.value,
-      description: {
-        en: 'Marks the field as required and shows the required indicator',
-        ru: 'Помечает поле как обязательное и показывает индикатор обязательности'
-      }
-    }
-  },
-  suffix: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string',
-      description: {
-        en: 'Suffix text displayed after the main content',
-        ru: 'Текст суффикса, отображаемый после основного содержимого'
-      },
-      value: 'Suffix'
-    }
-  },
   to: {
     type: StorybookControl.string,
     options: {
@@ -361,17 +183,6 @@ export const wikiValue: StorybookArgsToList = {
       }
     }
   },
-  validationMessage: {
-    type: StorybookControl.string,
-    options: {
-      category: StorybookCategory.value,
-      type: 'string',
-      description: {
-        en: 'Error or validation message text',
-        ru: 'Текст сообщения об ошибке или валидации'
-      }
-    }
-  },
   valueDefault: {
     type: StorybookControl.string,
     options: {

package/src/media/props/wikiWindow.ts

@@ -62,16 +62,6 @@ export const wikiWindow: StorybookArgsToList = {
       }
     }
   },
-  'window.closeButton': {
-    type: StorybookControl.boolean,
-    options: {
-      category: StorybookCategory.style,
-      description: {
-        en: 'Shows close button in header',
-        ru: 'Показывает кнопку закрытия в заголовке'
-      }
-    }
-  },
   'window.closeMobileHide': {
     type: StorybookControl.boolean,
     options: {
@@ -142,17 +132,6 @@ export const wikiWindow: StorybookArgsToList = {
       }
     }
   },
-  'window.imagePosition': {
-    type: StorybookControl.select,
-    options: {
-      category: StorybookCategory.style,
-      description: {
-        en: 'Defines image placement within the window layout',
-        ru: 'Определяет расположение изображения внутри макета окна'
-      },
-      options: ['left', 'top']
-    }
-  },
   'window.imageSize': {
     type: StorybookControl.select,
     options: {
@@ -174,16 +153,6 @@ export const wikiWindow: StorybookArgsToList = {
       }
     }
   },
-  'window.inDom': {
-    type: StorybookControl.boolean,
-    options: {
-      category: StorybookCategory.status,
-      description: {
-        en: 'Indicates whether the window is in the DOM',
-        ru: 'Указывает, присутствует ли окно в DOM'
-      }
-    }
-  },
   'window.opening': {
     type: StorybookControl.object,
     options: {

package/src/media/styles/color.md

@@ -0,0 +1 @@
+

package/src/media/styles/en/about.mdx

@@ -0,0 +1,79 @@
+import {Meta} from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/styles/en/About'/>
+
+# @dxtmisha/styles
+
+SCSS utilities library for DXT UI ecosystem. Contains ready-made mixins and functions for styling with CSS Custom Properties support, automatic RTL handling, and responsive design patterns.
+
+## Package Contents
+
+### Color Management
+
+- **Color Functions** — validation, conversion, palette management, opacity handling
+- **getColor** — color value extraction with opacity support
+- **getPalette** — palette color management
+- **toColorRbg** — color conversion to RGB format
+- **toGradient** — color to gradient conversion
+
+### Layout & Positioning
+
+- **Flexbox Mixins** — horizontal/vertical layouts, centering, spacing presets
+- **Position Mixins** — absolute/relative positioning with automatic RTL support via inset-inline
+- **Dimension Mixins** — width, height, aspect ratio, viewport units (dvw/dvh)
+- **Margin & Padding** — spacing utilities with RTL support via margin-inline/padding-inline
+
+### Typography
+
+- **Font Mixins** — font size, line height, paragraph spacing with CSS variables
+- **Text Alignment** — automatic RTL text alignment inversion
+- **Text Overflow** — truncate, clamp, ellipsis handling
+- **Text Transformation** — uppercase, lowercase, capitalize utilities
+
+### Direction & RTL Support
+
+- **Dir System** — automatic LTR/RTL direction management via CSS variables
+- **initDir** — initialization with --d-dir multiplier (1 for LTR, -1 for RTL)
+- **dirLeft/dirRight** — automatic value inversion for RTL
+- **dirFlexLeft/dirFlexRight** — flex alignment with RTL support
+
+### Responsive Design
+
+- **Media Queries** — min/max width breakpoints from design system
+- **Container Queries** — responsive components based on parent container size
+- **mediaMinWidth/mediaMaxWidth** — convenient media query wrappers
+- **containerMinWidth/containerMaxWidth** — container query utilities
+
+### Transform & Animation
+
+- **Transform Mixins** — translateX/Y, scale, rotate with CSS variables
+- **transformInit** — applies all transforms with automatic RTL for translateX
+- **translateInit** — translate-only transforms
+
+### Interactive States
+
+- **Selector Mixins** — hover, active, focus, disabled, readonly states
+- **enabled** — automatic exclusion of disabled/readonly/loading states
+- **focus** — includes :focus, :focus-within, and BEM modifier support
+
+### Utilities
+
+- **Content Visibility** — performance optimization for off-screen content
+- **Scrollbar** — hide scrollbar while keeping scroll functionality
+- **Rules** — map operations, string manipulation, selector utilities
+- **Custom Properties** — CSS variable management and validation
+
+## Key Features
+
+**RTL Support:** Automatic right-to-left layout support through CSS Logical Properties (margin-inline, padding-inline, inset-inline) and direction system integration
+
+**CSS Custom Properties:** All sizing, spacing, and transform values stored as CSS variables for dynamic theming
+
+**Design System Integration:** Breakpoints, colors, and spacing values from centralized design tokens
+
+**Performance:** Content visibility optimizations, efficient selector generation, minimal CSS output
+
+**Type Safety:** Validation functions for colors, custom properties, and data types
+
+**BEM Compatible:** All mixins work seamlessly with BEM methodology
+