@dxtmisha/wiki 0.39.1 → 0.39.2

package/src/media/functional/styles/color/functions/getColorByShade/getColorByShade.vi.mdx

@@ -0,0 +1,22 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getColorByShade - Màu theo sắc thái'/>
+
+# `getColorByShade`
+
+Hàm tìm kiếm một mức độ bão hòa (shade) cụ thể trong danh sách shade của thiết kế đang hoạt động từ `variables.scss`.
+
+**Tham số:**
+- `$color: String` — giá trị màu hoặc chuỗi biến cần tìm kiếm.
+
+**Trả về:**
+- `String | null` — tên đầy đủ của biến shade (ví dụ: `--d1-palette-500`) hoặc null nếu không tìm thấy kết quả khớp.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$shade: styles.getColorByShade('var(--d1-500)'); // '--d1-palette-500'
+$none: styles.getColorByShade('red'); // null
+```

package/src/media/functional/styles/color/functions/getColorValue/getColorValue.en.mdx

@@ -0,0 +1,26 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/getColorValue - Formatted color value'/>
+
+# `getColorValue`
+
+The function retrieves a formatted CSS `rgba()` value based on a given property name, optionally using a default fallback color.
+
+**Parameters:**
+- `$name: String` — the name of the CSS variable (e.g., `--sys-color`).
+- `$defaultValue: Color | String` [null] — an optional fallback color value.
+
+**Returns:**
+- `String` — a formatted CSS `rgba()` string.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$color: styles.getColorValue('--sys-primary'); 
+// rgba(var(--sys-primary), var(--sys-primary-opacity, var(--sys-primary-opacity-custom, 1)))
+
+$with-fallback: styles.getColorValue('--non-existent', #ff0000);
+// rgba(var(--non-existent, 255, 0, 0), var(--non-existent-opacity, var(--non-existent-opacity-custom, 1)))
+```

package/src/media/functional/styles/color/functions/getColorValue/getColorValue.ru.mdx

@@ -0,0 +1,26 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/getColorValue - Значение цвета'/>
+
+# `getColorValue`
+
+Функция возвращает отформатированное значение CSS `rgba()` на основе заданного имени свойства, опционально используя резервный цвет по умолчанию.
+
+**Параметры:**
+- `$name: String` — имя переменной CSS (например, `--sys-color`).
+- `$defaultValue: Color | String` [null] — необязательное резервное значение цвета.
+
+**Возвращает:**
+- `String` — отформатированная строка CSS `rgba()`.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$color: styles.getColorValue('--sys-primary'); 
+// rgba(var(--sys-primary), var(--sys-primary-opacity, var(--sys-primary-opacity-custom, 1)))
+
+$with-fallback: styles.getColorValue('--non-existent', #ff0000);
+// rgba(var(--non-existent, 255, 0, 0), var(--non-existent-opacity, var(--non-existent-opacity-custom, 1)))
+```

package/src/media/functional/styles/color/functions/getColorValue/getColorValue.vi.mdx

@@ -0,0 +1,26 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getColorValue - Giá trị màu'/>
+
+# `getColorValue`
+
+Hàm truy xuất giá trị CSS `rgba()` được định dạng dựa trên một tên thuộc tính nhất định, tùy chọn sử dụng màu dự phòng mặc định.
+
+**Tham số:**
+- `$name: String` — tên biến CSS (ví dụ: `--sys-color`).
+- `$defaultValue: Color | String` [null] — giá trị màu dự phòng tùy chọn.
+
+**Trả về:**
+- `String` — một chuỗi CSS `rgba()` được định dạng.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$color: styles.getColorValue('--sys-primary'); 
+// rgba(var(--sys-primary), var(--sys-primary-opacity, var(--sys-primary-opacity-custom, 1)))
+
+$with-fallback: styles.getColorValue('--non-existent', #ff0000);
+// rgba(var(--non-existent, 255, 0, 0), var(--non-existent-opacity, var(--non-existent-opacity-custom, 1)))
+```

package/src/media/functional/styles/color/functions/getColorValueSys/getColorValueSys.en.mdx

@@ -0,0 +1,26 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/getColorValueSys - System color value'/>
+
+# `getColorValueSys`
+
+The function retrieves a formatted CSS `rgba()` value specifically for the design system's current color, background, stroke, or fill properties.
+
+**Parameters:**
+- `$prop: String` — the system property name (e.g., 'color', 'background', 'border').
+- `$defaultValue: Color | String` [null] — an optional fallback color value.
+
+**Returns:**
+- `String` — a formatted CSS `rgba()` string referencing `--sys-[prop]`.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$color: styles.getColorValueSys('color'); 
+// rgba(var(--sys-color), var(--sys-color-opacity, var(--sys-color-opacity-custom, 1)))
+
+$border: styles.getColorValueSys('border', #cccccc);
+// rgba(var(--sys-border, 204, 204, 204), var(--sys-border-opacity, var(--sys-border-opacity-custom, 1)))
+```

package/src/media/functional/styles/color/functions/getColorValueSys/getColorValueSys.ru.mdx

@@ -0,0 +1,26 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/getColorValueSys - Системный цвет'/>
+
+# `getColorValueSys`
+
+Функция возвращает отформатированное значение CSS `rgba()` специально для текущего цвета, фона, обводки или свойств заливки дизайн-системы.
+
+**Параметры:**
+- `$prop: String` — имя системного свойства (например,, 'color', 'background', 'border').
+- `$defaultValue: Color | String` [null] — необязательное резервное значение цвета.
+
+**Возвращает:**
+- `String` — отформатированная строка CSS `rgba()`, ссылающаяся на `--sys-[prop]`.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$color: styles.getColorValueSys('color'); 
+// rgba(var(--sys-color), var(--sys-color-opacity, var(--sys-color-opacity-custom, 1)))
+
+$border: styles.getColorValueSys('border', #cccccc);
+// rgba(var(--sys-border, 204, 204, 204), var(--sys-border-opacity, var(--sys-border-opacity-custom, 1)))
+```

package/src/media/functional/styles/color/functions/getColorValueSys/getColorValueSys.vi.mdx

@@ -0,0 +1,26 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getColorValueSys - Màu hệ thống'/>
+
+# `getColorValueSys`
+
+Hàm truy xuất giá trị CSS `rgba()` được định dạng cụ thể cho các thuộc tính màu sắc, nền, nét vẽ (stroke) hoặc tô màu (fill) hiện tại của hệ thống thiết kế.
+
+**Tham số:**
+- `$prop: String` — tên thuộc tính hệ thống (ví dụ: 'color', 'background', 'border').
+- `$defaultValue: Color | String` [null] — giá trị màu dự phòng tùy chọn.
+
+**Trả về:**
+- `String` — một chuỗi CSS `rgba()` được định dạng tham chiếu đến `--sys-[prop]`.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$color: styles.getColorValueSys('color'); 
+// rgba(var(--sys-color), var(--sys-color-opacity, var(--sys-color-opacity-custom, 1)))
+
+$border: styles.getColorValueSys('border', #cccccc);
+// rgba(var(--sys-border, 204, 204, 204), var(--sys-border-opacity, var(--sys-border-opacity-custom, 1)))
+```

package/src/media/functional/styles/color/functions/getPalette/getPalette.en.mdx

@@ -0,0 +1,25 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/getPalette - Get palette variable'/>
+
+# `getPalette`
+
+The function determines the correct palette variable for a given color input, handling both palette names and direct color values.
+
+**Parameters:**
+- `$color: Color | String` — input color or CSS variable reference.
+
+**Returns:**
+- `String` — the resulting CSS variable reference or raw color value.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$p: styles.getPalette('--sys-primary'); 
+// var(--sys-palette-primary, 255, 255, 255) (conceptual)
+
+$direct: styles.getPalette(#ff0000);
+// var(--sys-palette, 255, 0, 0)
+```

package/src/media/functional/styles/color/functions/getPalette/getPalette.ru.mdx

@@ -0,0 +1,25 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/getPalette - Переменная палитры'/>
+
+# `getPalette`
+
+Функция определяет правильную переменную палитры для заданного цвета, обрабатывая как именованные цвета палитры, так и прямые значения цвета.
+
+**Параметры:**
+- `$color: Color | String` — входной цвет или ссылка на переменную CSS.
+
+**Возвращает:**
+- `String` — итоговая ссылка на переменную CSS или исходное значение цвета.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$p: styles.getPalette('--sys-primary'); 
+// var(--sys-palette-primary, 255, 255, 255) (концептуально)
+
+$direct: styles.getPalette(#ff0000);
+// var(--sys-palette, 255, 0, 0)
+```

package/src/media/functional/styles/color/functions/getPalette/getPalette.vi.mdx

@@ -0,0 +1,25 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getPalette - Biến bảng màu'/>
+
+# `getPalette`
+
+Hàm xác định đúng biến bảng màu cho một đầu vào màu cụ thể, xử lý cả tên bảng màu và giá trị màu trực tiếp.
+
+**Tham số:**
+- `$color: Color | String` — màu đầu vào hoặc tham chiếu biến CSS.
+
+**Trả về:**
+- `String` — kết quả tham chiếu biến CSS hoặc giá trị màu gốc.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$p: styles.getPalette('--sys-primary'); 
+// var(--sys-palette-primary, 255, 255, 255) (conceptual)
+
+$direct: styles.getPalette(#ff0000);
+// var(--sys-palette, 255, 0, 0)
+```

package/src/media/functional/styles/color/functions/getPaletteItem/getPaletteItem.en.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/getPaletteItem - Palette search chain'/>
+
+# `getPaletteItem`
+
+The function generates a nested CSS variable chain (using the `var()` fallback parameter) to search for a color across multiple palette nodes.
+
+**Parameters:**
+- `$palette: List | String` — list of palette variable names or a single name.
+- `$color: Color | String` — the fallback color if no palette variables are defined.
+
+**Returns:**
+- `String` — a nested `var(--name1, var(--name2, ...))` string.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$chain: styles.getPaletteItem(('theme-color', 'sys-color'), #ff0000); 
+// var(--theme-color, var(--sys-color, 255, 0, 0))
+```

package/src/media/functional/styles/color/functions/getPaletteItem/getPaletteItem.ru.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/getPaletteItem - Цепочка палитры'/>
+
+# `getPaletteItem`
+
+Функция генерирует вложенную цепочку переменных CSS (используя параметр fallback функции `var()`) для поиска цвета в нескольких узлах палитры.
+
+**Параметры:**
+- `$palette: List | String` — список имен переменных палитры или одно имя.
+- `$color: Color | String` — резервный цвет, если переменные палитры не определены.
+
+**Возвращает:**
+- `String` — вложенная строка вида `var(--name1, var(--name2, ...))`.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$chain: styles.getPaletteItem(('theme-color', 'sys-color'), #ff0000); 
+// var(--theme-color, var(--sys-color, 255, 0, 0))
+```

package/src/media/functional/styles/color/functions/getPaletteItem/getPaletteItem.vi.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getPaletteItem - Chuỗi bảng màu'/>
+
+# `getPaletteItem`
+
+Hàm tạo một chuỗi biến CSS lồng nhau (sử dụng tham số fallback của hàm `var()`) để tìm kiếm màu sắc trên nhiều nút bảng màu khác nhau.
+
+**Tham số:**
+- `$palette: List | String` — danh sách tên biến bảng màu hoặc một tên duy nhất.
+- `$color: Color | String` — màu dự phòng nếu không có biến bảng màu nào được định nghĩa.
+
+**Trả về:**
+- `String` — một chuỗi `var(--name1, var(--name2, ...))` lồng nhau.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$chain: styles.getPaletteItem(('theme-color', 'sys-color'), #ff0000); 
+// var(--theme-color, var(--sys-color, 255, 0, 0))
+```

package/src/media/functional/styles/color/functions/getPaletteItemOpacity/getPaletteItemOpacity.en.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/getPaletteItemOpacity - Opacity search chain'/>
+
+# `getPaletteItemOpacity`
+
+The function generates a nested CSS variable chain (using the `var()` fallback parameter) to search for an opacity value across multiple palette nodes.
+
+**Parameters:**
+- `$palette: List | String` — list of palette variable names or a single name.
+- `$color: Color | String` — the fallback color if no palette variables are defined.
+
+**Returns:**
+- `String` — a nested `var(--name1-opacity, var(--name2-opacity, ...))` string.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$chain: styles.getPaletteItemOpacity(('theme-color', 'sys-color'), #ff0000); 
+// var(--theme-color-opacity, var(--sys-color-opacity, 1))
+```

package/src/media/functional/styles/color/functions/getPaletteItemOpacity/getPaletteItemOpacity.ru.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/getPaletteItemOpacity - Цепочка прозрачности'/>
+
+# `getPaletteItemOpacity`
+
+Функция генерирует вложенную цепочку переменных CSS (используя параметр fallback функции `var()`) для поиска значения прозрачности в нескольких узлах палитры.
+
+**Параметры:**
+- `$palette: List | String` — список имен переменных палитры или одно имя.
+- `$color: Color | String` — резервный цвет, если переменные палитры не определены.
+
+**Возвращает:**
+- `String` — вложенная строка вида `var(--name1-opacity, var(--name2-opacity, ...))`.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$chain: styles.getPaletteItemOpacity(('theme-color', 'sys-color'), #ff0000); 
+// var(--theme-color-opacity, var(--sys-color-opacity, 1))
+```

package/src/media/functional/styles/color/functions/getPaletteItemOpacity/getPaletteItemOpacity.vi.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getPaletteItemOpacity - Chuỗi độ mờ'/>
+
+# `getPaletteItemOpacity`
+
+Hàm tạo một chuỗi biến CSS lồng nhau (sử dụng tham số fallback của hàm `var()`) để tìm kiếm giá trị độ mờ trên nhiều nút bảng màu khác nhau.
+
+**Tham số:**
+- `$palette: List | String` — danh sách tên biến bảng màu hoặc một tên duy nhất.
+- `$color: Color | String` — màu dự phòng nếu không có biến bảng màu nào được định nghĩa.
+
+**Trả về:**
+- `String` — một chuỗi `var(--name1-opacity, var(--name2-opacity, ...))` lồng nhau.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$chain: styles.getPaletteItemOpacity(('theme-color', 'sys-color'), #ff0000); 
+// var(--theme-color-opacity, var(--sys-color-opacity, 1))
+```

package/src/media/functional/styles/color/functions/getPaletteOpacity/getPaletteOpacity.en.mdx

@@ -0,0 +1,25 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/getPaletteOpacity - Get palette opacity'/>
+
+# `getPaletteOpacity`
+
+The function determines the correct palette opacity variable for a given color input, handling both palette names and direct color values.
+
+**Parameters:**
+- `$color: Color | String` — input color or CSS variable reference.
+
+**Returns:**
+- `String` — the resulting CSS variable reference for opacity.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$o: styles.getPaletteOpacity('--sys-primary'); 
+// var(--sys-palette-primary-opacity, 1)
+
+$direct: styles.getPaletteOpacity(#ff0000);
+// var(--sys-palette-opacity, 1)
+```

package/src/media/functional/styles/color/functions/getPaletteOpacity/getPaletteOpacity.ru.mdx

@@ -0,0 +1,25 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/getPaletteOpacity - Прозрачность палитры'/>
+
+# `getPaletteOpacity`
+
+Функция определяет правильную переменную прозрачности палитры для заданного цвета, обрабатывая как именованные цвета палитры, так и прямые значения цвета.
+
+**Параметры:**
+- `$color: Color | String` — входной цвет или ссылка на переменную CSS.
+
+**Прозрачность:**
+- `String` — итоговая ссылка на переменную CSS для прозрачности.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$o: styles.getPaletteOpacity('--sys-primary'); 
+// var(--sys-palette-primary-opacity, 1)
+
+$direct: styles.getPaletteOpacity(#ff0000);
+// var(--sys-palette-opacity, 1)
+```

package/src/media/functional/styles/color/functions/getPaletteOpacity/getPaletteOpacity.vi.mdx

@@ -0,0 +1,25 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/getPaletteOpacity - Độ mờ bảng màu'/>
+
+# `getPaletteOpacity`
+
+Hàm xác định đúng biến độ mờ bảng màu cho một đầu vào màu cụ thể, xử lý cả tên bảng màu và giá trị màu trực tiếp.
+
+**Tham số:**
+- `$color: Color | String` — màu đầu vào hoặc tham chiếu biến CSS.
+
+**Trả về:**
+- `String` — kết quả tham chiếu biến CSS cho độ mờ.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$o: styles.getPaletteOpacity('--sys-primary'); 
+// var(--sys-palette-primary-opacity, 1)
+
+$direct: styles.getPaletteOpacity(#ff0000);
+// var(--sys-palette-opacity, 1)
+```

package/src/media/functional/styles/color/functions/isColorRbgOrVar/isColorRbgOrVar.en.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/isColorRbgOrVar - Validate color'/>
+
+# `isColorRbgOrVar`
+
+The function checks if a value is a valid color or a special CSS keyword (like `transparent`, `initial`, `inherit`, etc.).
+
+**Parameters:**
+- `$color: Color | String` — color value or CSS keyword for checking.
+
+**Returns:**
+- `Boolean` — `true` if the value is a valid color or keyword.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$is-color: styles.isColorRbgOrVar(#ff0000); // true
+$is-keyword: styles.isColorRbgOrVar('transparent'); // true
+$is-invalid: styles.isColorRbgOrVar('none'); // false
+```

package/src/media/functional/styles/color/functions/isColorRbgOrVar/isColorRbgOrVar.ru.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/isColorRbgOrVar - Проверить цвет'/>
+
+# `isColorRbgOrVar`
+
+Функция проверяет, является ли значение допустимым цветом или специальным ключевым словом CSS (например, `transparent`, `initial`, `inherit` и т. д.).
+
+**Параметры:**
+- `$color: Color | String` — значение цвета или ключевое слово CSS для проверки.
+
+**Возвращает:**
+- `Boolean` — `true`, если значение является допустимым цветом или ключевым словом.
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$is-color: styles.isColorRbgOrVar(#ff0000); // true
+$is-keyword: styles.isColorRbgOrVar('transparent'); // true
+$is-invalid: styles.isColorRbgOrVar('none'); // false
+```

package/src/media/functional/styles/color/functions/isColorRbgOrVar/isColorRbgOrVar.vi.mdx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/isColorRbgOrVar - Xác thực màu'/>
+
+# `isColorRbgOrVar`
+
+Hàm kiểm tra xem một giá trị có phải là một màu hợp lệ hoặc một từ khóa CSS đặc biệt hay không (như `transparent`, `initial`, `inherit`, v.v.).
+
+**Tham số:**
+- `$color: Color | String` — giá trị màu hoặc từ khóa CSS để kiểm tra.
+
+**Trả về:**
+- `Boolean` — `true` nếu giá trị là một màu hoặc từ khóa hợp lệ.
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$is-color: styles.isColorRbgOrVar(#ff0000); // true
+$is-keyword: styles.isColorRbgOrVar('transparent'); // true
+$is-invalid: styles.isColorRbgOrVar('none'); // false
+```

package/src/media/functional/styles/color/functions/isPalette/isPalette.en.mdx

@@ -0,0 +1,22 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/isPalette - Validate palette color'/>
+
+# `isPalette`
+
+The function checks if a string represents a palette-related CSS variable by looking for the `--` prefix.
+
+**Parameters:**
+- `$color: String` — the color variable name or string to check.
+
+**Returns:**
+- `Boolean` — `true` if the string contains a double-dash (`--`) prefix.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$is-palette: styles.isPalette('--sys-color'); // true
+$is-not-palette: styles.isPalette('#ff0000'); // false
+```

package/src/media/functional/styles/color/functions/isPalette/isPalette.ru.mdx

@@ -0,0 +1,22 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/ru/styles/color/| functions/isPalette - Проверить палитру'/>
+
+# `isPalette`
+
+Функция проверяет, представляет ли строка переменную CSS, связанную с палитрой, ища префикс `--`.
+
+**Параметры:**
+- `$color: String` — имя переменной цвета или строка для проверки.
+
+**Возвращает:**
+- `Boolean` — `true`, если строка содержит префикс в виде двойного тире (`--`).
+
+## Пример
+
+```scss
+@use '@dxtmisha/styles';
+
+$is-palette: styles.isPalette('--sys-color'); // true
+$is-not-palette: styles.isPalette('#ff0000'); // false
+```

package/src/media/functional/styles/color/functions/isPalette/isPalette.vi.mdx

@@ -0,0 +1,22 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/vi/styles/color/| functions/isPalette - Xác thực bảng màu'/>
+
+# `isPalette`
+
+Hàm kiểm tra xem một chuỗi có đại diện cho một biến CSS liên quan đến bảng màu hay không bằng cách tìm tiền tố `--`.
+
+**Tham số:**
+- `$color: String` — tên biến màu hoặc chuỗi cần kiểm tra.
+
+**Trả về:**
+- `Boolean` — `true` nếu chuỗi chứa tiền tố gạch nối kép (`--`).
+
+## Ví dụ
+
+```scss
+@use '@dxtmisha/styles';
+
+$is-palette: styles.isPalette('--sys-color'); // true
+$is-not-palette: styles.isPalette('#ff0000'); // false
+```

package/src/media/functional/styles/color/functions/toColorOpacity/toColorOpacity.en.mdx

@@ -0,0 +1,22 @@
+import { Meta } from '@storybook/addon-docs/blocks'
+
+<Meta title='@dxtmisha/en/styles/color/| functions/toColorOpacity - Extract opacity'/>
+
+# `toColorOpacity`
+
+The function extracts the alpha channel (opacity) from a Sass Color object or a custom CSS variable string.
+
+**Parameters:**
+- `$color: Color | String` — the color value to extract opacity from.
+
+**Returns:**
+- `Number | String` — alpha value [0..1] or the modified CSS variable string.
+
+## Example
+
+```scss
+@use '@dxtmisha/styles';
+
+$opacity: styles.toColorOpacity(rgba(255, 0, 0, 0.5)); // 0.5
+$var-opacity: styles.toColorOpacity(var(--sys-color)); // var(--sys-color-opacity)
+```