@central-design-system/components 3.0.0-beta.4 → 3.0.0-beta.41

package/dist/composable/display.d.ts

@@ -29,6 +29,8 @@ export interface IDisplayInstance {
     height: Ref<number>;
     platform: Ref<TDisplayPlatform>;
     thresholds: Ref<TDisplayThresholds>;
+    screenHeight: Ref<number>;
+    screenWidth: Ref<number>;
     ssr: boolean;
     update(): void;
 }

package/dist/composable/domObserver.d.ts

@@ -0,0 +1,5 @@
+import { Ref } from 'vue';
+export interface IUseDomObserver {
+    elements: Ref<HTMLElement[]>;
+}
+export declare function useDomObserver(dataAlertValue: string): IUseDomObserver;

package/dist/composable/field.d.ts

@@ -1,6 +1,6 @@
-import type { ComputedRef, PropType } from 'vue';
-import type { EventProp } from '../utils';
 import type { TCdsIconsName } from '@central-design-system/icons';
+import type { EventProp } from '../utils';
+import type { ComputedRef, PropType } from 'vue';
 export declare type TFieldTypes = typeof allowedFieldType[number];
 export interface IFieldProps {
     active: boolean;
@@ -9,11 +9,14 @@ export interface IFieldProps {
     suffix: string | undefined;
     prependInnerIcon: TCdsIconsName | undefined;
     appendInnerIcon: TCdsIconsName | undefined;
-    type: TFieldTypes | undefined;
+    type: TFieldTypes;
+    role: string | undefined;
     placeholder: string | undefined;
     counter: boolean;
     limit: number | undefined;
     clearable: boolean;
+    clearLabel: string;
+    persistentClearable: boolean;
     'onClick:appendInner': EventProp | undefined;
     'onClick:prependInner': EventProp | undefined;
 }
@@ -39,6 +42,7 @@ export declare const makeFieldProps: <Defaults extends {
     counter?: unknown;
     limit?: unknown;
     clearable?: unknown;
+    clearLabel?: unknown;
     persistentClearable?: unknown;
     'onClick:prependInner'?: unknown;
     'onClick:appendInner'?: unknown;
@@ -75,7 +79,7 @@ export declare const makeFieldProps: <Defaults extends {
      * Иконка внутри элемента перед значением поля
      */
     prependInnerIcon: {
-        type: PropType<"search" | "link" | "list" | "filters" | "add" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "funnel" | "globe" | "infinity" | "info-fill" | "info" | "insert" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "telegram" | "timer" | "tool" | "truck" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "winner" | "workspace" | "youtube">;
+        type: PropType<"search" | "bold" | "link" | "list" | "fill" | "filters" | "add" | "administrator" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "bookmark-fill" | "bookmark" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory-open" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "format" | "formula" | "funnel" | "globe" | "highlight" | "infinity" | "info-fill" | "info" | "insert" | "italic" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "tab-backward" | "tab-forward" | "telegram" | "timer" | "tool" | "truck" | "underline" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "whatsapp" | "winner" | "workspace" | "youtube">;
         default: undefined;
         validator: (value: TCdsIconsName) => boolean;
     };
@@ -83,7 +87,7 @@ export declare const makeFieldProps: <Defaults extends {
      * Иконка внутри элемента после значения поля
      */
     appendInnerIcon: {
-        type: PropType<"search" | "link" | "list" | "filters" | "add" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "funnel" | "globe" | "infinity" | "info-fill" | "info" | "insert" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "telegram" | "timer" | "tool" | "truck" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "winner" | "workspace" | "youtube">;
+        type: PropType<"search" | "bold" | "link" | "list" | "fill" | "filters" | "add" | "administrator" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "bookmark-fill" | "bookmark" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory-open" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "format" | "formula" | "funnel" | "globe" | "highlight" | "infinity" | "info-fill" | "info" | "insert" | "italic" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "tab-backward" | "tab-forward" | "telegram" | "timer" | "tool" | "truck" | "underline" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "whatsapp" | "winner" | "workspace" | "youtube">;
         default: undefined;
         validator: (value: TCdsIconsName) => boolean;
     };
@@ -130,6 +134,13 @@ export declare const makeFieldProps: <Defaults extends {
         type: PropType<boolean>;
         default: boolean;
     };
+    /**
+     * Лейбл для кнопки очистки поля ввода
+     */
+    clearLabel: {
+        type: PropType<string>;
+        default: string;
+    };
     /**
      * Всегда показывать иконку очистки поля
      */

package/dist/composable/filter.d.ts

@@ -21,22 +21,44 @@ export declare const makeFilterProps: <Defaults extends {
     filterMode?: unknown;
     noFilter?: unknown;
 } = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
+    /**
+     * Функция, используемая для фильтрации элементов списка.
+     * Вызывается для каждого фильтруемого ключа и для каждого элемента списка.
+     * Первый аргумент - это фильтруемое значение, второй - поисковой запрос, а третий - внутренний объект элемента списка.
+     * Функция должна возвращать true если элемент должен быть включен в результаты фильтрации, или индекс соответствия в значении, если он должен быть включен с выделенным результатом.
+     */
     customFilter: {
         type: PropType<TFilterFunction>;
         default: null;
     };
+    /**
+     * Функция, используемая для определенных ключей внутри объекта элемента списка. customFilter не будет учитывать элементы с указанным customKeyFilter
+     */
     customKeyFilter: {
         type: PropType<TFilterKeyFunctions>;
         default: null;
     };
+    /**
+     * Массив ключей, по которым будет производиться фильтрация
+     */
     filterKeys: {
         type: PropType<TFilterKeys>;
         default: string;
     };
+    /**
+     * Управляет объединением результатов customFilter и customKeyFilter. Все варианты применяют customFilter только к элементам, не указанным в customKeyFilter.
+     * - 'some' - имеется хотя бы одно совпадение либо с customFilter, либо с customKeyFilter
+     * - 'every' - все элементы соответствуют либо customFilter, либо customKeyFilter
+     * - 'union' - имеется хотя бы одно совпадение из customFilter и все совпадения из customKeyFilter
+     * - 'intersection' - имеется хотя бы одно совпадение из customFilter и все совпадения из customKeyFilter
+     */
     filterMode: {
         type: PropType<TFilterMode>;
         default: string;
     };
+    /**
+     * Не применяйте фильтрацию при поиске. Полезно, когда данные фильтруются на стороне сервера
+     */
     noFilter: {
         type: PropType<boolean>;
         default: boolean;
@@ -45,6 +67,14 @@ export declare const makeFilterProps: <Defaults extends {
 export declare function useFilter<T extends IInternalItem>(props: IFilterProps, items: MaybeRef<T[]>, query: Ref<string | number | undefined> | (() => string | undefined), options?: {
     transform?: (item: T) => {};
 }): IUseFilter<T>;
+export declare function defaultFilter(value: string, query: string): TFilterMath;
+export declare function filterItems(items: readonly (readonly [item: IInternalItem, transformed: {}])[] | readonly IInternalItem[], query: string, options: Omit<IFilterProps, 'customFilter'> & {
+    default?: TFilterFunction;
+}): TFilteredItems[];
+declare type TFilteredItems = {
+    index: number;
+    matches: Record<string, TFilterMath>;
+};
 declare type TFilterFunction = (value: string, query: string, item?: any) => TFilterMath;
 declare type TFilterKeyFunctions = Record<string, TFilterFunction>;
 declare type TFilterKeys = string | string[];

package/dist/composable/form.d.ts

@@ -1,6 +1,6 @@
 import { InjectionKey } from 'vue';
-import type { Ref, ComputedRef, PropType } from 'vue';
 import type { IValidationProps } from './validation';
+import type { Ref, ComputedRef, PropType } from 'vue';
 export interface IFormProvide {
     register: (item: {
         id: number | string;
@@ -23,7 +23,7 @@ export interface IFormProps {
     readonly: boolean;
     firstFail: boolean;
     modelValue: boolean | null;
-    validateOn?: IValidationProps['validateOn'];
+    validateOn: IValidationProps['validateOn'];
 }
 interface IFormField {
     id: number | string;

package/dist/composable/group.d.ts

@@ -1,18 +1,18 @@
-import type { ComponentInternalInstance, ComputedRef, ExtractPropTypes, InjectionKey, PropType, Ref } from 'vue';
 import type { IDisabledProps } from '../composable';
+import type { ComponentInternalInstance, ComputedRef, ExtractPropTypes, InjectionKey, PropType, Ref } from 'vue';
 export interface IGroupItem {
     id: number;
     value: Ref<unknown>;
     disabled: Ref<boolean | undefined>;
 }
 export interface IGroupProps {
-    disabled: boolean;
+    disabled?: boolean;
     modelValue: unknown;
     multiple?: boolean;
     required?: boolean | 'force';
     max?: number;
     selectedClass: string | undefined;
-    'onUpdate:modelValue': ((val: unknown) => void) | undefined;
+    'onUpdate:modelValue'?: ((val: unknown) => void) | undefined;
 }
 export interface IGroupProvide {
     selected: Ref<Readonly<number[]>>;

package/dist/composable/icon.d.ts

@@ -1,6 +1,6 @@
 import { EventProp } from '../utils';
-import type { PropType, ComputedRef } from 'vue';
 import type { TCdsIconsName } from '@central-design-system/icons';
+import type { PropType, ComputedRef } from 'vue';
 export interface IIconProps {
     prependIcon: TCdsIconsName | undefined;
     appendIcon: TCdsIconsName | undefined;
@@ -22,7 +22,7 @@ export declare const makeIconProps: <Defaults extends {
      * Иконка в начале элемента
      */
     prependIcon: {
-        type: PropType<"search" | "link" | "list" | "filters" | "add" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "funnel" | "globe" | "infinity" | "info-fill" | "info" | "insert" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "telegram" | "timer" | "tool" | "truck" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "winner" | "workspace" | "youtube">;
+        type: PropType<"search" | "bold" | "link" | "list" | "fill" | "filters" | "add" | "administrator" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "bookmark-fill" | "bookmark" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory-open" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "format" | "formula" | "funnel" | "globe" | "highlight" | "infinity" | "info-fill" | "info" | "insert" | "italic" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "tab-backward" | "tab-forward" | "telegram" | "timer" | "tool" | "truck" | "underline" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "whatsapp" | "winner" | "workspace" | "youtube">;
         default: undefined;
         validator: (value: TCdsIconsName) => boolean;
     };
@@ -30,7 +30,7 @@ export declare const makeIconProps: <Defaults extends {
      * Иконка в конце элемента
      */
     appendIcon: {
-        type: PropType<"search" | "link" | "list" | "filters" | "add" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "funnel" | "globe" | "infinity" | "info-fill" | "info" | "insert" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "telegram" | "timer" | "tool" | "truck" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "winner" | "workspace" | "youtube">;
+        type: PropType<"search" | "bold" | "link" | "list" | "fill" | "filters" | "add" | "administrator" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "bookmark-fill" | "bookmark" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory-open" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "format" | "formula" | "funnel" | "globe" | "highlight" | "infinity" | "info-fill" | "info" | "insert" | "italic" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "tab-backward" | "tab-forward" | "telegram" | "timer" | "tool" | "truck" | "underline" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "whatsapp" | "winner" | "workspace" | "youtube">;
         default: undefined;
         validator: (value: TCdsIconsName) => boolean;
     };

package/dist/composable/index.d.ts

@@ -8,7 +8,7 @@ export * from './appearance';
 export * from './size';
 export * from './disabled';
 export * from './readonly';
-export * from './dark';
+export * from './invertColor';
 export * from './color';
 export * from './status';
 export * from './tag';
@@ -45,3 +45,7 @@ export * from './group';
 export * from './ssrBoot';
 export * from './variant';
 export * from './layout';
+export * from './theme';
+export * from './domObserver';
+export * from './transparent';
+export * from './scrolling';

package/dist/composable/invertColor.d.ts

@@ -0,0 +1,19 @@
+import type { ComputedRef, PropType } from 'vue';
+export interface IInvertColorProps {
+    invertColor: boolean;
+}
+export interface IUseInvertColor {
+    invertColorClasses: ComputedRef<string | undefined>;
+}
+export declare const makeInvertColor: <Defaults extends {
+    invertColor?: unknown;
+} = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
+    /**
+     * Инвертирует цветовую схему компонента
+     */
+    invertColor: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+}, Defaults>;
+export declare function useInvertColor(props: IInvertColorProps, name: string): IUseInvertColor;

package/dist/composable/layout.d.ts

@@ -1,5 +1,6 @@
-import type { PropType } from 'vue';
-import { CSSProperties, Ref } from 'vue';
+import { CSSProperties } from 'vue';
+import { ILayoutContextProps } from '../components/CdsLayout/context';
+import type { PropType, Ref, ComputedRef } from 'vue';
 export interface ILayoutProps {
     modelValue: boolean;
     reveal: boolean;
@@ -8,6 +9,22 @@ export interface ILayoutProps {
     elevated: boolean;
     height: string | number;
 }
+export interface IUseLayout {
+    layout: ILayoutContextProps;
+    size: Ref<number>;
+    revealed: Ref<boolean>;
+    fixed: Ref<boolean>;
+    windowHeight: Ref<number>;
+    containerHeight: ComputedRef<number>;
+    offset: ComputedRef<number>;
+    hidden: ComputedRef<boolean>;
+    revealOnFocus: ComputedRef<boolean>;
+    classes: ComputedRef<Record<string, boolean>>;
+    style: Ref<CSSProperties>;
+    updateLocal: (prop: Ref, value: any) => void;
+    updateRevealed: () => void;
+    onResize: (rect: Pick<DOMRectReadOnly, 'width' | 'height'>) => void;
+}
 export declare const makeLayoutProps: <Defaults extends {
     modelValue?: unknown;
     reveal?: unknown;
@@ -59,21 +76,4 @@ export declare const makeLayoutProps: <Defaults extends {
         default: number;
     };
 }, Defaults>;
-export declare function useLayout(props: ILayoutProps, componentName: string, view?: 'H' | 'F'): {
-    layout: import("../components/CdsLayout/context").ILayoutContextProps;
-    size: Ref<number>;
-    revealed: Ref<boolean>;
-    fixed: import("vue").ComputedRef<boolean>;
-    windowHeight: Ref<number>;
-    containerHeight: import("vue").ComputedRef<number>;
-    offset: import("vue").ComputedRef<number>;
-    hidden: import("vue").ComputedRef<boolean>;
-    revealOnFocus: import("vue").ComputedRef<boolean>;
-    classes: import("vue").ComputedRef<{
-        [x: string]: boolean;
-    }>;
-    style: import("vue").ComputedRef<CSSProperties>;
-    updateLocal: (prop: Ref, value: any) => void;
-    updateRevealed: () => void;
-    onResize: ({ height }: Pick<DOMRectReadOnly, 'width' | 'height'>) => void;
-};
+export declare function useLayout(props: ILayoutProps, componentName: string, view?: 'H' | 'F'): IUseLayout;

package/dist/composable/loading.d.ts

@@ -1,5 +1,5 @@
 import type { ComputedRef, PropType } from 'vue';
-export interface ILoadingProp {
+export interface ILoadingProps {
     loading: boolean;
 }
 export interface IUseLoading {
@@ -17,4 +17,4 @@ export declare const makeLoadingProps: <Defaults extends {
         default: boolean;
     };
 }, Defaults>;
-export declare function useLoading(props: ILoadingProp): IUseLoading;
+export declare function useLoading(props: ILoadingProps): IUseLoading;

package/dist/composable/menu.d.ts

@@ -1,5 +1,5 @@
-import type { Ref, PropType, WritableComputedRef } from 'vue';
 import type { IDisabledProps } from './disabled';
+import type { Ref, PropType, WritableComputedRef } from 'vue';
 export interface IMenuProps extends IDisabledProps {
     menu: boolean | undefined;
 }

package/dist/composable/nested/nested.d.ts

@@ -1,6 +1,6 @@
-import type { Ref, InjectionKey, PropType, SetupContext } from 'vue';
-import type { TSelectStrategyProp } from './selectStrategies';
 import type { TOpenStrategyProp } from './openStrategies';
+import type { TSelectStrategyProp } from './selectStrategies';
+import type { Ref, InjectionKey, PropType, SetupContext } from 'vue';
 export declare type TNestedProvide = {
     id: Ref<unknown>;
     isGroupActivator?: boolean;

package/dist/composable/overlay.d.ts

@@ -22,6 +22,7 @@ export declare const makeOverlayProps: <Defaults extends {
     contentClasses?: unknown;
     contentProps?: unknown;
     noClickAnimation?: unknown;
+    opacity?: unknown;
 } = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
     /**
      * Указывает, к какому DOM элементу будет прикреплен компонент.
@@ -34,7 +35,7 @@ export declare const makeOverlayProps: <Defaults extends {
         default: boolean;
     };
     /**
-     * Указывает, что компонент будет прикреплен к родительскому элементу. Подразумевает absolute и attach
+     * Указывает, что компонент будет прикреплен к родительскому элементу. Подразумевает absolute и attach в true.
      */
     contained: {
         type: PropType<boolean>;
@@ -103,4 +104,11 @@ export declare const makeOverlayProps: <Defaults extends {
         type: PropType<boolean>;
         default: boolean;
     };
+    /**
+     * Прозрачность overlay компонента
+     */
+    opacity: {
+        type: PropType<string | number>;
+        default: undefined;
+    };
 }, Defaults>;

package/dist/{components/CdsDropdown/composable → composable}/scrolling.d.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
-import { CdsList } from '../../CdsList';
-import { CdsTextInput } from '../../CdsTextInput';
+import { CdsList } from '../components/CdsList';
+import { CdsTextInput } from '../components/CdsTextInput';
 export declare function useScrolling(listRef: Ref<typeof CdsList | undefined>, textFieldRef: Ref<typeof CdsTextInput | undefined>): {
     onListScroll: (event: Event) => void;
     onListKeydown: (event: KeyboardEvent) => Promise<void>;

package/dist/composable/select.d.ts

@@ -1,6 +1,7 @@
 import { MaybePick } from '../utils';
-import type { PropType, ComputedRef, Ref } from 'vue';
 import type { IInternalItem, IUseItems } from './items';
+import type { TCdsIconsName } from '@central-design-system/icons';
+import type { PropType, ComputedRef, Ref } from 'vue';
 export interface ISelectProps {
     multiple: boolean;
     openOnClear: boolean;
@@ -17,6 +18,7 @@ export declare const makeSelectProps: <Defaults extends {
     isSelectAll?: unknown;
     ellipsis?: unknown;
     listProps?: unknown;
+    menuIcon?: unknown;
 } = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
     /**
      * Множественный выбор элементов
@@ -74,12 +76,19 @@ export declare const makeSelectProps: <Defaults extends {
             tag: string;
             size: NonNullable<"xs" | "sm" | "md" | "lg" | "xl">;
             disabled: boolean;
-            dark: boolean;
+            invertColor: boolean;
+            transparent: boolean;
             required: boolean;
             selectStrategy: NonNullable<import("./nested/selectStrategies").TSelectStrategyProp>;
             openStrategy: NonNullable<import("./nested/openStrategies").TOpenStrategyProp>;
+            theme: string;
             lines: false | "one" | "two" | "three";
         }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            theme: {
+                type: PropType<string>;
+                available: readonly ["cds", "b2b", "promo", "dark"];
+                default: undefined;
+            };
             selectStrategy: {
                 type: PropType<NonNullable<import("./nested/selectStrategies").TSelectStrategyProp>>;
                 default: NonNullable<import("./nested/selectStrategies").TSelectStrategyProp>;
@@ -91,7 +100,11 @@ export declare const makeSelectProps: <Defaults extends {
             opened: PropType<unknown[]>;
             selected: PropType<unknown[]>;
             required: BooleanConstructor;
-            dark: {
+            transparent: {
+                type: PropType<boolean>;
+                default: boolean;
+            };
+            invertColor: {
                 type: PropType<boolean>;
                 default: boolean;
             };
@@ -122,9 +135,6 @@ export declare const makeSelectProps: <Defaults extends {
                 default: string;
             };
             itemValue: {
-                /**
-                 * Отображать элементы выбранного списка в одну строку
-                 */
                 type: PropType<import("./items").TItemKey>;
                 default: string;
             };
@@ -134,7 +144,9 @@ export declare const makeSelectProps: <Defaults extends {
             };
             itemProps: {
                 type: PropType<import("./items").TItemKey>;
-                default: string;
+                default: string; /**
+                 * Иконка выпадающего меню
+                 */
             };
             returnObject: {
                 type: PropType<boolean>;
@@ -149,9 +161,7 @@ export declare const makeSelectProps: <Defaults extends {
             "onUpdate:opened"?: ((value: unknown[]) => any) | undefined;
             "onClick:open"?: ((value: {
                 id: unknown;
-                value: boolean; /**
-                 * Свойства для списка
-                 */
+                value: boolean;
                 path: unknown[];
                 event: Event;
             }) => any) | undefined;
@@ -161,9 +171,17 @@ export declare const makeSelectProps: <Defaults extends {
                 path: unknown[];
                 event: Event;
             }) => any) | undefined;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "items" | "itemTitle" | "itemValue" | "itemChildren" | "itemProps" | "returnObject" | "tag" | "size" | "disabled" | "dark" | "required" | "selectStrategy" | "openStrategy" | "lines">, keyof import("vue").VNodeProps | keyof import("vue").AllowedComponentProps>>;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "items" | "itemTitle" | "itemValue" | "itemChildren" | "itemProps" | "returnObject" | "tag" | "size" | "disabled" | "invertColor" | "transparent" | "required" | "selectStrategy" | "openStrategy" | "theme" | "lines">, keyof import("vue").VNodeProps | keyof import("vue").AllowedComponentProps>>;
         default: undefined;
     };
+    /**
+     * Иконка выпадающего меню
+     */
+    menuIcon: {
+        type: PropType<"search" | "bold" | "link" | "list" | "fill" | "filters" | "add" | "administrator" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "bookmark-fill" | "bookmark" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "delete" | "directory-open" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "flag" | "format" | "formula" | "funnel" | "globe" | "highlight" | "infinity" | "info-fill" | "info" | "insert" | "italic" | "list-search" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "settings" | "shopping-cart" | "sort-date" | "source" | "star-fill" | "star" | "tab-backward" | "tab-forward" | "telegram" | "timer" | "tool" | "truck" | "underline" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "whatsapp" | "winner" | "workspace" | "youtube">;
+        default: string;
+        validator: (value: TCdsIconsName) => boolean;
+    };
 }, Defaults>;
 export declare function useSelect(props: ISelectProps, items: ComputedRef<IInternalItem[]> | Ref<IInternalItem[]>, transformIn: IUseItems['transformIn'], transformOut: IUseItems['transformOut']): {
     model: Ref<readonly IInternalItem<any>[]> & {

package/dist/composable/size.d.ts

@@ -1,5 +1,5 @@
-import type { ComputedRef, PropType } from 'vue';
 import type { MaybeRef } from '../utils';
+import type { ComputedRef, PropType } from 'vue';
 export declare type TSize = typeof allowedSize[number];
 export interface ISizeProps {
     size: TSize;

package/dist/composable/text.d.ts

@@ -1,6 +1,6 @@
 import type { PropType, ComputedRef } from 'vue';
 export interface ITextProps {
-    text: string | undefined;
+    text: string | number | undefined;
 }
 export interface IUseText {
     hasText: ComputedRef<boolean>;
@@ -12,7 +12,7 @@ export declare const makeTextProps: <Defaults extends {
      * Текст
      */
     text: {
-        type: PropType<string>;
+        type: PropType<string | number>;
         default: undefined;
     };
 }, Defaults>;

package/dist/composable/theme.d.ts

@@ -0,0 +1,82 @@
+import { ComputedRef } from 'vue';
+import type { TThemes } from '../themes';
+import type { App, DeepReadonly, InjectionKey, PropType, Ref } from 'vue';
+declare type DeepPartial<T> = T extends object ? {
+    [P in keyof T]?: DeepPartial<T[P]>;
+} : T;
+export declare type IThemeOptions = false | {
+    cspNonce?: string;
+    defaultTheme?: TThemes | string;
+    variations?: false | VariationOptions;
+    themes?: Record<string, ThemeDefinition>;
+};
+export declare type ThemeDefinition = DeepPartial<InternalThemeDefinition>;
+export declare type TTheme = typeof availableTheme[number];
+export interface Colors extends BaseColors, OnColors {
+    [key: string]: string;
+}
+interface VariationOptions {
+    colors: string[];
+    lighten: number;
+    darken: number;
+}
+interface InternalThemeDefinition {
+    dark: boolean;
+    colors: Colors;
+    variables: Record<string, string | number>;
+}
+interface BaseColors {
+    background: string;
+    surface: string;
+    primary: string;
+    secondary: string;
+    success: string;
+    warning: string;
+    info: string;
+    error: string;
+}
+interface OnColors {
+    'on-background': string;
+    'on-surface': string;
+    'on-primary': string;
+    'on-secondary': string;
+    'on-success': string;
+    'on-warning': string;
+    'on-info': string;
+    'on-error': string;
+}
+export interface ThemeInstance {
+    readonly isDisabled: boolean;
+    readonly themes: Ref<Record<string, InternalThemeDefinition>>;
+    readonly name: Readonly<Ref<string>>;
+    readonly current: DeepReadonly<Ref<InternalThemeDefinition>>;
+    readonly computedThemes: DeepReadonly<Ref<Record<string, InternalThemeDefinition>>>;
+    readonly themeClasses: Readonly<ComputedRef<string | undefined>>;
+    readonly styles: Readonly<ComputedRef<string>>;
+    readonly global: {
+        readonly name: Ref<string>;
+        readonly current: DeepReadonly<Ref<InternalThemeDefinition>>;
+    };
+}
+export declare const ThemeSymbol: InjectionKey<ThemeInstance>;
+export declare const availableTheme: readonly ["cds", "b2b", "promo", "dark"];
+export declare const makeThemeProps: <Defaults extends {
+    theme?: unknown;
+} = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
+    /**
+     * Тема
+     */
+    theme: {
+        type: PropType<string>;
+        available: readonly ["cds", "b2b", "promo", "dark"];
+        default: undefined;
+    };
+}, Defaults>;
+export declare function createTheme(options?: IThemeOptions): ThemeInstance & {
+    install: (app: App) => void;
+};
+export declare function provideTheme(props: {
+    theme?: string;
+}): ThemeInstance;
+export declare function useTheme(): ThemeInstance;
+export {};

package/dist/composable/transition.d.ts

@@ -3,6 +3,8 @@ interface ITransitionProps extends TransitionProps {
     transition: string | boolean | (TransitionProps & {
         component?: Component;
     });
+    disabled?: boolean;
+    group?: boolean;
 }
 export declare const makeTransitionProps: <Defaults extends {
     transition?: unknown;