@central-design-system/components 3.0.0-alpha.12 → 3.0.0-alpha.13

package/dist/composable/group.d.ts

@@ -12,6 +12,7 @@ export interface IGroupProps {
     required?: boolean | 'force';
     max?: number;
     selectedClass: string | undefined;
+    'onUpdate:modelValue': ((val: unknown) => void) | undefined;
 }
 export interface IGroupProvide {
     selected: Ref<Readonly<number[]>>;
@@ -51,14 +52,14 @@ export declare const makeGroupProps: <Defaults extends {
      * Значение v-model
      */
     modelValue: {
-        type: PropType<unknown>;
+        type: null;
         default: undefined;
     };
     /**
      * Множественный выбор
      */
     multiple: {
-        type: BooleanConstructor;
+        type: PropType<boolean>;
         default: boolean;
     };
     /**
@@ -66,13 +67,13 @@ export declare const makeGroupProps: <Defaults extends {
      */
     required: {
         type: PropType<boolean | "force">;
-        default: boolean;
+        default: undefined;
     };
     /**
      * Максимально допустимое количество выбранных элементов
      */
     max: {
-        type: NumberConstructor;
+        type: PropType<number>;
         default: undefined;
     };
     /**
@@ -98,7 +99,7 @@ export declare const makeGroupItemProps: <Defaults extends {
      */
     value: {
         type: null;
-        default: null;
+        default: undefined;
     };
     /**
      * Классы для выбранных элементов
@@ -108,6 +109,31 @@ export declare const makeGroupItemProps: <Defaults extends {
         default: undefined;
     };
 }, Defaults>;
+export interface ISlideGroupProps extends ExtractPropTypes<ReturnType<typeof makeSlideGroupProps>> {
+    disabled: IDisabledProps['disabled'];
+    'onGroup:selected': ((value: {
+        value: boolean;
+    }) => void) | undefined;
+}
+export declare const makeSlideGroupProps: <Defaults extends {
+    centerActive?: unknown;
+    showArrows?: unknown;
+} = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
+    /**
+     * Принудительно центрировать активный элемент
+     */
+    centerActive: {
+        type: PropType<boolean>;
+        default: boolean;
+    };
+    /**
+     * Показывать стрелки для переключения между элементами
+     */
+    showArrows: {
+        type: PropType<string | boolean>;
+        validator: (value: any) => boolean;
+    };
+}, Defaults>;
 export declare function useGroupItem(props: IGroupItemProps, injectKey: InjectionKey<IGroupProvide>, required?: true): IGroupItemProvide;
 export declare function useGroupItem(props: IGroupItemProps, injectKey: InjectionKey<IGroupProvide>, required: false): IGroupItemProvide | null;
 export declare function useGroup(props: IGroupProps, injectKey: InjectionKey<IGroupProvide>): IGroupProvide;

package/dist/composable/index.d.ts

@@ -1,3 +1,4 @@
+export * from './align';
 export * from './text';
 export * from './title';
 export * from './link';

package/dist/composable/resizeObserver.d.ts

@@ -3,5 +3,5 @@ interface IUseResizeObserver {
     resizeRef: Ref<HTMLElement | undefined>;
     contentRect: DeepReadonly<Ref<DOMRectReadOnly | undefined>>;
 }
-export declare function useResizeObserver(callback?: ResizeObserverCallback): IUseResizeObserver;
+export declare function useResizeObserver(callback?: ResizeObserverCallback, box?: 'content' | 'border'): IUseResizeObserver;
 export {};

package/dist/transitions/index.d.ts

@@ -12,6 +12,7 @@ export declare const CdsTransitionExpandX: import("vue").DefineComponent<{
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     mode: import("vue").Prop<"default" | "in-out" | "out-in", "default" | "in-out" | "out-in">;
 }>>, {}>;
+export { CdsTransitionModal } from './modalTransition';
 export declare const CdsTransitionFade: import("vue").DefineComponent<{
     group: import("vue").PropType<boolean>;
     hideOnLeave: import("vue").PropType<boolean>;
@@ -252,3 +253,63 @@ export declare const CdsTransitionScale: import("vue").DefineComponent<{
     mode: string;
     origin: string;
 }>;
+export declare const CdsTransitionModalBottom: import("vue").DefineComponent<{
+    group: import("vue").PropType<boolean>;
+    hideOnLeave: import("vue").PropType<boolean>;
+    leaveAbsolute: import("vue").PropType<boolean>;
+    mode: {
+        type: import("vue").PropType<string>;
+        default: string | undefined;
+    };
+    origin: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    group: import("vue").PropType<boolean>;
+    hideOnLeave: import("vue").PropType<boolean>;
+    leaveAbsolute: import("vue").PropType<boolean>;
+    mode: {
+        type: import("vue").PropType<string>;
+        default: string | undefined;
+    };
+    origin: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+}>>, {
+    mode: string;
+    origin: string;
+}>;
+export declare const CdsTransitionModalTop: import("vue").DefineComponent<{
+    group: import("vue").PropType<boolean>;
+    hideOnLeave: import("vue").PropType<boolean>;
+    leaveAbsolute: import("vue").PropType<boolean>;
+    mode: {
+        type: import("vue").PropType<string>;
+        default: string | undefined;
+    };
+    origin: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    group: import("vue").PropType<boolean>;
+    hideOnLeave: import("vue").PropType<boolean>;
+    leaveAbsolute: import("vue").PropType<boolean>;
+    mode: {
+        type: import("vue").PropType<string>;
+        default: string | undefined;
+    };
+    origin: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+}>>, {
+    mode: string;
+    origin: string;
+}>;

package/dist/transitions/modalTransition.d.ts

@@ -0,0 +1,8 @@
+import type { PropType } from 'vue';
+export declare const CdsTransitionModal: import("vue").DefineComponent<{
+    target: PropType<HTMLElement>;
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    target: PropType<HTMLElement>;
+}>>, {}>;

package/dist/utils/helpers.d.ts

@@ -82,7 +82,8 @@ export declare function deepEqual(a: any, b: any): boolean;
  * Wrap value in array if it's not already an array
  * @param value
  */
-export declare function wrapInArray<T>(value: T | T[] | null | undefined): T[];
+declare type IfAny<T, Y, N> = 0 extends 1 & T ? Y : N;
+export declare function wrapInArray<T>(value: T | T[] | null | undefined): T extends readonly any[] ? IfAny<T, T[], T> : NonNullable<T>[];
 /**
  * Get the nested value of an object at a given path.
  * @param obj
@@ -146,6 +147,7 @@ export declare function omit<T extends object, K extends keyof T>(obj: T, fields
 export declare function findChildrenWithProvide(key: InjectionKey<any> | symbol, vnode?: VNodeChild | {
     [key: string]: any;
 }): ComponentInternalInstance[];
+export declare function focusableChildren(el: Element): HTMLElement[];
 /**
  * Types
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@central-design-system/components",
-  "version": "3.0.0-alpha.12",
+  "version": "3.0.0-alpha.13",
   "description": "Central Design System on the Vue 3.0 and TypeScript",
   "author": "magersoft",
   "license": "ISC",
@@ -26,8 +26,8 @@
   ],
   "types": "./dist/cds.d.ts",
   "scripts": {
-    "build": "rimraf dist && vue-tsc --noEmit && vite build",
-    "type-check": "npx vue-tsc --noEmit -p tsconfig.json --composite false",
+    "build": "rimraf dist && npm run type-check && vite build",
+    "type-check": "npx vue-tsc --noEmit -p tsconfig.build.json --composite false",
     "bump": "npx bumpp",
     "publish:alpha": "npm publish --tag next"
   },

package/src/scss/modules/_reset.scss

@@ -7,6 +7,11 @@
 
   html {
     font-size: var(--cds-font-base);
+    box-sizing: border-box;
+    overflow-y: scroll;
+    -webkit-text-size-adjust: 100%;
+    word-break: normal;
+    tab-size: 4;
   }
 
   body {

package/src/scss/modules/_transition.scss

@@ -1,8 +1,12 @@
 @import '../mixins/motion';
 
 $standard-easing: map-get(map-get($easing, 'ease-in-out'), 'basic');
-$standard-duration: $cds-duration-fast + ms;
+$decelerated-easing: map-get(map-get($easing, 'ease-out'), 'basic');
+$accelerated-easing: map-get(map-get($easing, 'ease-in'), 'basic');
+
 $accent-easting: map-get(map-get($easing, 'ease-in-out'), 'accent');
+
+$standard-duration: $cds-duration-fast + ms;
 $accent-duration: $cds-duration-normal + ms;
 
 @mixin transition-default() {
@@ -154,3 +158,46 @@ $accent-duration: $cds-duration-normal + ms;
   }
 }
 
+.modal-transition,
+.modal-transition-bottom,
+.modal-transition-top {
+  &-enter-active {
+    transition-duration: 225ms !important;
+    transition-timing-function: $decelerated-easing !important;
+  }
+
+  &-leave-active {
+    transition-duration: 125ms !important;
+    transition-timing-function: $accelerated-easing !important;
+  }
+
+  &-enter-active,
+  &-leave-active {
+    transition-property: transform, opacity !important;
+    pointer-events: none;
+  }
+}
+
+.modal-transition {
+  &-enter-from, &-leave-to {
+    transform: scale(0.9);
+    opacity: 0;
+  }
+
+  &-enter-to, &-leave-from {
+    opacity: 1;
+  }
+}
+
+.modal-transition-bottom {
+  &-enter-from, &-leave-to {
+    transform: translateY(calc(50vh + 50%));
+  }
+}
+
+.modal-transition-top {
+  &-enter-from, &-leave-to {
+    transform: translateY(calc(-50vh - 50%));
+  }
+}
+

package/src/scss/themes/index.ts

@@ -1,6 +1,6 @@
 /**
  * Automatically generated by CDS CLI
- * Generated on 7/18/2023, 12:07:08 PM
+ * Generated on 8/3/2023, 8:00:26 PM
  **/
 
 /**