@central-design-system/components 3.0.0-beta.9 → 3.0.0-rc.1

package/dist/composable/theme.d.ts

@@ -1,6 +1,6 @@
 import { ComputedRef } from 'vue';
-import type { App, DeepReadonly, InjectionKey, PropType, Ref } 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;
@@ -12,7 +12,7 @@ export declare type IThemeOptions = false | {
 };
 export declare type ThemeDefinition = DeepPartial<InternalThemeDefinition>;
 export declare type TTheme = typeof availableTheme[number];
-export interface Colors extends BaseColors, OnColors {
+export interface Colors extends BaseColors {
     [key: string]: string;
 }
 interface VariationOptions {
@@ -26,24 +26,15 @@ interface InternalThemeDefinition {
     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;
+    'brand-primary': string;
+    'brand-primary-active': string;
+    'brand-primary-border': string;
+    'brand-primary-content': string;
+    'brand-primary-hover': string;
+    'brand-secondary': string;
+    'brand-secondary-active': string;
+    'brand-secondary-border': string;
+    'brand-secondary-hover': string;
 }
 export interface ThemeInstance {
     readonly isDisabled: boolean;
@@ -59,7 +50,7 @@ export interface ThemeInstance {
     };
 }
 export declare const ThemeSymbol: InjectionKey<ThemeInstance>;
-export declare const availableTheme: readonly ["cds", "b2b", "promo", "dark"];
+export declare const availableTheme: readonly ["cdsLight", "cdsDark", "b2bLight", "b2bDark"];
 export declare const makeThemeProps: <Defaults extends {
     theme?: unknown;
 } = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
@@ -68,7 +59,7 @@ export declare const makeThemeProps: <Defaults extends {
      */
     theme: {
         type: PropType<string>;
-        available: readonly ["cds", "b2b", "promo", "dark"];
+        available: readonly ["cdsLight", "cdsDark", "b2bLight", "b2bDark"];
         default: undefined;
     };
 }, Defaults>;

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;

package/dist/composable/transparent.d.ts

@@ -0,0 +1,19 @@
+import type { ComputedRef, PropType } from 'vue';
+export interface ITransparentProps {
+    transparent: boolean;
+}
+export interface IUseTransparentProps {
+    transparentClasses: ComputedRef<string | undefined>;
+}
+export declare const makeTransparentProps: <Defaults extends {
+    transparent?: unknown;
+} = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
+    /**
+     * Позволяет использовать компонент на прозрачном фоне
+     */
+    transparent: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+}, Defaults>;
+export declare function useTransparent(props: ITransparentProps, name: string): IUseTransparentProps;

package/dist/composable/validation.d.ts

@@ -1,5 +1,5 @@
-import type { PropType, ComputedRef, Ref } from 'vue';
 import type { MaybeRef } from '../utils';
+import type { PropType, ComputedRef, Ref } from 'vue';
 export declare type TValidationResult = string | boolean;
 export declare type TValidationRule = TValidationResult | PromiseLike<TValidationResult> | ((value: any) => TValidationResult) | ((value: any) => PromiseLike<TValidationResult>);
 export declare type TValidationOn = typeof allowedValidationOn[number];
@@ -102,7 +102,7 @@ export declare const makeValidationProps: <Defaults extends {
         default: undefined;
     };
     /**
-     * Убирает слот для сообщений об ошибках, если ошибок нет
+     * Убирает слот для сообщений об ошибках
      */
     hideMessages: {
         type: PropType<boolean>;

package/dist/composable/variant.d.ts

@@ -7,15 +7,12 @@ export interface IVariantProps {
 export interface IUseVariant {
     variantClasses: ComputedRef<string>;
 }
-export declare const allowedVariant: readonly ["default", "important"];
+export declare const allowedVariant: readonly ["default", "compact", "important"];
 export declare const makeVariantProps: <Defaults extends {
     variant?: unknown;
 } = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
-    /**
-     * Вариант отображения
-     */
     variant: {
-        type: PropType<"default" | "important">;
+        type: PropType<"default" | "compact" | "important">;
         default: string;
         validator: (value: TVariant) => boolean;
     };

package/dist/create.d.ts

@@ -1,6 +1,7 @@
+import { ITeleportOptions } from './components/CdsOverlay/composable';
 import { ILocale, TAvailableLocale } from './locale';
-import type { App } from 'vue';
 import type { IDisplayOptions, IThemeOptions } from './composable';
+import type { App } from 'vue';
 export interface ICdsOptions {
     components?: Record<string, any>;
     directives?: Record<string, any>;
@@ -11,6 +12,7 @@ export interface ICdsOptions {
     cssGrid?: boolean;
     ssr?: boolean;
     locale?: TAvailableLocale | ILocale;
+    teleport?: Partial<ITeleportOptions>;
 }
 interface NuxtApp {
     $nuxt?: {
@@ -20,5 +22,8 @@ interface NuxtApp {
 export declare function createCds(options?: ICdsOptions): {
     install: (app: App & NuxtApp) => void;
     display: import("./composable").IDisplayInstance;
+    theme: import("./composable").ThemeInstance & {
+        install: (app: App<any>) => void;
+    };
 };
 export {};

package/dist/globals.d.ts

@@ -27,5 +27,12 @@ declare global {
     >;
   }
 
+  interface MouseEvent {
+    sourceCapabilities?: { firesTouchEvents: boolean };
+  }
+
+  function parseInt(s: string | number, radix?: number): number;
+  function parseFloat(string: string | number): number;
+
   export const __VUE_OPTIONS_API__: boolean | undefined;
 }

package/dist/locale/index.d.ts

@@ -1,11 +1,14 @@
+import type { TNotificationLocale } from '../components/CdsNotification/composable';
 import type { NTable } from '../components/CdsTable/interface';
 import type { NUploader } from '../components/CdsUploader/interface';
-import type { TNotificationLocale } from '../components/CdsNotification/composable';
 import type { TDateLocale } from '../utils';
 export interface ILocale {
     notification: TNotificationLocale;
     table: NTable.ILocale;
     date: TDateLocale;
+    time: {
+        now: string;
+    };
     container: {
         prev?: string;
         next?: string;

package/dist/themes/b2bDark.d.ts

@@ -0,0 +1,190 @@
+declare const _default: {
+    dark: boolean;
+    colors: {
+        'surface-secondary': string;
+        'surface-primary': string;
+        'surface-overlay': string;
+        'surface-inverse': string;
+        'surface-elevated': string;
+        'status-warning-surface': string;
+        'status-warning-line': string;
+        'status-warning-fill-hover': string;
+        'status-warning-fill': string;
+        'status-warning-content': string;
+        'status-success-surface': string;
+        'status-success-line': string;
+        'status-success-fill-hover': string;
+        'status-success-fill': string;
+        'status-success-content': string;
+        'status-progress-surface': string;
+        'status-progress-line': string;
+        'status-progress-fill-hover': string;
+        'status-progress-fill': string;
+        'status-progress-content': string;
+        'status-info-surface': string;
+        'status-info-line': string;
+        'status-info-fill-hover': string;
+        'status-info-fill': string;
+        'status-info-content': string;
+        'status-indication-surface': string;
+        'status-indication-line': string;
+        'status-indication-fill-hover': string;
+        'status-indication-fill': string;
+        'status-indication-content': string;
+        'status-danger-surface': string;
+        'status-danger-line': string;
+        'status-danger-fill-hover': string;
+        'status-danger-fill': string;
+        'status-danger-content': string;
+        'page-primary': string;
+        'other-teal-surface': string;
+        'other-teal-line': string;
+        'other-teal-fill-hover': string;
+        'other-teal-fill': string;
+        'other-teal-content': string;
+        'other-purple-surface': string;
+        'other-purple-line': string;
+        'other-purple-fill-hover': string;
+        'other-purple-fill': string;
+        'other-purple-content': string;
+        'other-pink-surface': string;
+        'other-pink-line': string;
+        'other-pink-fill-hover': string;
+        'other-pink-fill': string;
+        'other-pink-content': string;
+        'other-lime-surface': string;
+        'other-lime-line': string;
+        'other-lime-fill-hover': string;
+        'other-lime-fill': string;
+        'other-lime-content': string;
+        'other-lemon-surface': string;
+        'other-lemon-line': string;
+        'other-lemon-fill-hover': string;
+        'other-lemon-fill': string;
+        'other-lemon-content': string;
+        'other-indigo-surface': string;
+        'other-indigo-line': string;
+        'other-indigo-fill-hover': string;
+        'other-indigo-fill': string;
+        'other-indigo-content': string;
+        'other-cyan-surface': string;
+        'other-cyan-line': string;
+        'other-cyan-fill-hover': string;
+        'other-cyan-fill': string;
+        'other-cyan-content': string;
+        'other-chocolate-surface': string;
+        'other-chocolate-line': string;
+        'other-chocolate-fill-hover': string;
+        'other-chocolate-fill': string;
+        'other-chocolate-content': string;
+        'line-tertiary-hover': string;
+        'line-tertiary': string;
+        'line-selected-hover': string;
+        'line-selected': string;
+        'line-secondary-hover': string;
+        'line-secondary': string;
+        'line-primary-hover': string;
+        'line-primary': string;
+        'line-focus-outline': string;
+        'line-focus': string;
+        'line-elevated': string;
+        'line-disable': string;
+        'fill-selected-hover': string;
+        'fill-selected': string;
+        'fill-secondary-hover': string;
+        'fill-secondary-active': string;
+        'fill-secondary': string;
+        'fill-primary-hover': string;
+        'fill-primary-active': string;
+        'fill-primary': string;
+        'fill-elevated': string;
+        'fill-disable': string;
+        'content-tertiary': string;
+        'content-secondary': string;
+        'content-primary': string;
+        'content-placeholder': string;
+        'content-on-dark': string;
+        'content-link-visited': string;
+        'content-link': string;
+        'content-inverse': string;
+        'content-disable': string;
+        'brand-secondary-hover': string;
+        'brand-secondary-border': string;
+        'brand-secondary-active': string;
+        'brand-secondary': string;
+        'brand-primary-hover': string;
+        'brand-primary-content': string;
+        'brand-primary-border': string;
+        'brand-primary-active': string;
+        'brand-primary': string;
+    };
+    variables: {
+        'spacing-900': string;
+        'spacing-800': string;
+        'spacing-700': string;
+        'spacing-600': string;
+        'spacing-500': string;
+        'spacing-50': string;
+        'spacing-400': string;
+        'spacing-300': string;
+        'spacing-200': string;
+        'spacing-1100': string;
+        'spacing-1000': string;
+        'spacing-100': string;
+        'shadow-y-minus-400': string;
+        'shadow-y-minus-300': string;
+        'shadow-y-minus-200': string;
+        'shadow-y-minus-100': string;
+        'shadow-y-400': string;
+        'shadow-y-300': string;
+        'shadow-y-200': string;
+        'shadow-y-100': string;
+        'shadow-x-minus-400': string;
+        'shadow-x-minus-300': string;
+        'shadow-x-minus-200': string;
+        'shadow-x-minus-100': string;
+        'shadow-x-400': string;
+        'shadow-x-300': string;
+        'shadow-x-200': string;
+        'shadow-x-100': string;
+        'shadow-blur-400': string;
+        'shadow-blur-300': string;
+        'shadow-blur-200': string;
+        'shadow-blur-100': string;
+        'font-weight-regular': number;
+        'font-weight-bold': number;
+        'font-size-900': string;
+        'font-size-800': string;
+        'font-size-700': string;
+        'font-size-600': string;
+        'font-size-500': string;
+        'font-size-50': string;
+        'font-size-400': string;
+        'font-size-300': string;
+        'font-size-200': string;
+        'font-size-1100': string;
+        'font-size-1000': string;
+        'font-size-100': string;
+        'font-line-height-900': string;
+        'font-line-height-800': string;
+        'font-line-height-700': string;
+        'font-line-height-600': string;
+        'font-line-height-500': string;
+        'font-line-height-50': string;
+        'font-line-height-400': string;
+        'font-line-height-300': string;
+        'font-line-height-200': string;
+        'font-line-height-1100': string;
+        'font-line-height-1000': string;
+        'font-line-height-100': string;
+        'font-letter-spacing-500': string;
+        'font-family': string;
+        'border-radius-300': string;
+        'border-radius-200': string;
+        'border-radius-100': string;
+        'border-200': string;
+        'border-100': string;
+        'base-unit': string;
+    };
+};
+export default _default;

package/dist/themes/b2bLight.d.ts

@@ -0,0 +1,190 @@
+declare const _default: {
+    dark: boolean;
+    colors: {
+        'surface-secondary': string;
+        'surface-primary': string;
+        'surface-overlay': string;
+        'surface-inverse': string;
+        'surface-elevated': string;
+        'status-warning-surface': string;
+        'status-warning-line': string;
+        'status-warning-fill-hover': string;
+        'status-warning-fill': string;
+        'status-warning-content': string;
+        'status-success-surface': string;
+        'status-success-line': string;
+        'status-success-fill-hover': string;
+        'status-success-fill': string;
+        'status-success-content': string;
+        'status-progress-surface': string;
+        'status-progress-line': string;
+        'status-progress-fill-hover': string;
+        'status-progress-fill': string;
+        'status-progress-content': string;
+        'status-info-surface': string;
+        'status-info-line': string;
+        'status-info-fill-hover': string;
+        'status-info-fill': string;
+        'status-info-content': string;
+        'status-indication-surface': string;
+        'status-indication-line': string;
+        'status-indication-fill-hover': string;
+        'status-indication-fill': string;
+        'status-indication-content': string;
+        'status-danger-surface': string;
+        'status-danger-line': string;
+        'status-danger-fill-hover': string;
+        'status-danger-fill': string;
+        'status-danger-content': string;
+        'page-primary': string;
+        'other-teal-surface': string;
+        'other-teal-line': string;
+        'other-teal-fill-hover': string;
+        'other-teal-fill': string;
+        'other-teal-content': string;
+        'other-purple-surface': string;
+        'other-purple-line': string;
+        'other-purple-fill-hover': string;
+        'other-purple-fill': string;
+        'other-purple-content': string;
+        'other-pink-surface': string;
+        'other-pink-line': string;
+        'other-pink-fill-hover': string;
+        'other-pink-fill': string;
+        'other-pink-content': string;
+        'other-lime-surface': string;
+        'other-lime-line': string;
+        'other-lime-fill-hover': string;
+        'other-lime-fill': string;
+        'other-lime-content': string;
+        'other-lemon-surface': string;
+        'other-lemon-line': string;
+        'other-lemon-fill-hover': string;
+        'other-lemon-fill': string;
+        'other-lemon-content': string;
+        'other-indigo-surface': string;
+        'other-indigo-line': string;
+        'other-indigo-fill-hover': string;
+        'other-indigo-fill': string;
+        'other-indigo-content': string;
+        'other-cyan-surface': string;
+        'other-cyan-line': string;
+        'other-cyan-fill-hover': string;
+        'other-cyan-fill': string;
+        'other-cyan-content': string;
+        'other-chocolate-surface': string;
+        'other-chocolate-line': string;
+        'other-chocolate-fill-hover': string;
+        'other-chocolate-fill': string;
+        'other-chocolate-content': string;
+        'line-tertiary-hover': string;
+        'line-tertiary': string;
+        'line-selected-hover': string;
+        'line-selected': string;
+        'line-secondary-hover': string;
+        'line-secondary': string;
+        'line-primary-hover': string;
+        'line-primary': string;
+        'line-focus-outline': string;
+        'line-focus': string;
+        'line-elevated': string;
+        'line-disable': string;
+        'fill-selected-hover': string;
+        'fill-selected': string;
+        'fill-secondary-hover': string;
+        'fill-secondary-active': string;
+        'fill-secondary': string;
+        'fill-primary-hover': string;
+        'fill-primary-active': string;
+        'fill-primary': string;
+        'fill-elevated': string;
+        'fill-disable': string;
+        'content-tertiary': string;
+        'content-secondary': string;
+        'content-primary': string;
+        'content-placeholder': string;
+        'content-on-dark': string;
+        'content-link-visited': string;
+        'content-link': string;
+        'content-inverse': string;
+        'content-disable': string;
+        'brand-secondary-hover': string;
+        'brand-secondary-border': string;
+        'brand-secondary-active': string;
+        'brand-secondary': string;
+        'brand-primary-hover': string;
+        'brand-primary-content': string;
+        'brand-primary-border': string;
+        'brand-primary-active': string;
+        'brand-primary': string;
+    };
+    variables: {
+        'spacing-900': string;
+        'spacing-800': string;
+        'spacing-700': string;
+        'spacing-600': string;
+        'spacing-500': string;
+        'spacing-50': string;
+        'spacing-400': string;
+        'spacing-300': string;
+        'spacing-200': string;
+        'spacing-1100': string;
+        'spacing-1000': string;
+        'spacing-100': string;
+        'shadow-y-minus-400': string;
+        'shadow-y-minus-300': string;
+        'shadow-y-minus-200': string;
+        'shadow-y-minus-100': string;
+        'shadow-y-400': string;
+        'shadow-y-300': string;
+        'shadow-y-200': string;
+        'shadow-y-100': string;
+        'shadow-x-minus-400': string;
+        'shadow-x-minus-300': string;
+        'shadow-x-minus-200': string;
+        'shadow-x-minus-100': string;
+        'shadow-x-400': string;
+        'shadow-x-300': string;
+        'shadow-x-200': string;
+        'shadow-x-100': string;
+        'shadow-blur-400': string;
+        'shadow-blur-300': string;
+        'shadow-blur-200': string;
+        'shadow-blur-100': string;
+        'font-weight-regular': number;
+        'font-weight-bold': number;
+        'font-size-900': string;
+        'font-size-800': string;
+        'font-size-700': string;
+        'font-size-600': string;
+        'font-size-500': string;
+        'font-size-50': string;
+        'font-size-400': string;
+        'font-size-300': string;
+        'font-size-200': string;
+        'font-size-1100': string;
+        'font-size-1000': string;
+        'font-size-100': string;
+        'font-line-height-900': string;
+        'font-line-height-800': string;
+        'font-line-height-700': string;
+        'font-line-height-600': string;
+        'font-line-height-500': string;
+        'font-line-height-50': string;
+        'font-line-height-400': string;
+        'font-line-height-300': string;
+        'font-line-height-200': string;
+        'font-line-height-1100': string;
+        'font-line-height-1000': string;
+        'font-line-height-100': string;
+        'font-letter-spacing-500': string;
+        'font-family': string;
+        'border-radius-300': string;
+        'border-radius-200': string;
+        'border-radius-100': string;
+        'border-200': string;
+        'border-100': string;
+        'base-unit': string;
+    };
+};
+export default _default;