@teammodlr/ui-kit 3.0.0-beta.9 → 3.0.0

package/lib/components/checkbox/Checkbox.vue.d.ts

@@ -30,11 +30,11 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<any>;
         default: undefined;
     };
-    modelValue: PropType<string | number | boolean | object | any[] | any[] | undefined>;
+    modelValue: PropType<string | number | boolean | object | any[] | null | undefined>;
     name: StringConstructor;
     readonly: BooleanConstructor;
     required: BooleanConstructor;
-    error: StringConstructor;
+    error: PropType<string | null | undefined>;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
@@ -92,11 +92,11 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<any>;
         default: undefined;
     };
-    modelValue: PropType<string | number | boolean | object | any[] | any[] | undefined>;
+    modelValue: PropType<string | number | boolean | object | any[] | null | undefined>;
     name: StringConstructor;
     readonly: BooleanConstructor;
     required: BooleanConstructor;
-    error: StringConstructor;
+    error: PropType<string | null | undefined>;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];

package/lib/components/clearbutton/ClearButton.vue.d.ts

@@ -0,0 +1,7 @@
+import * as style from './style';
+declare const _default: import("vue").DefineComponent<{}, {
+    style: typeof style;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "clear"[], "clear", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>> & {
+    onClear?: ((...args: any[]) => any) | undefined;
+}, {}, {}>;
+export default _default;

package/lib/components/clearbutton/style/ClearButton.css.d.ts

@@ -0,0 +1,2 @@
+export declare const clearButton: string;
+export declare const icon: string;

package/lib/components/clearbutton/style/index.d.ts

@@ -0,0 +1 @@
+export * from './ClearButton.css';

package/lib/components/colorpicker/ColorPicker.vue.d.ts

@@ -66,7 +66,6 @@ declare const _default: import("vue").DefineComponent<{
     transfer: import("vue").Ref<boolean>;
     canPickColor: import("vue").ComputedRef<boolean>;
     openEyeDropper: () => void;
-    handleOpenChange: (value: boolean) => void;
     onSliderChangeComplete: () => void;
     hexInputUser: import("vue").Ref<string>;
     toggleInherit: () => void;

package/lib/components/colorpicker/style/ColorPicker.css.d.ts

@@ -3,6 +3,7 @@ export declare const sliderThumb: string;
 export declare const eyeDrop: string;
 export declare const preview: string;
 export declare const colours: string;
+export declare const trigger: string;
 export declare const reference: string;
 export declare const transparent: string;
 export declare const referenceColor: string;

package/lib/components/dialog/style/Dialog.css.d.ts

@@ -6,6 +6,8 @@ export declare const wrapper: string;
 export declare const notModal: string;
 export declare const dialog: string;
 export declare const content: string;
+export declare const dialogContent: string;
+export declare const focusScope: string;
 export declare const header: string;
 export declare const draggable: string;
 export declare const dragging: string;

package/lib/components/drawer/Drawer.vue.d.ts

@@ -0,0 +1,142 @@
+import type { CSSProperties, PropType } from 'vue';
+import * as style from './style';
+type Placement = 'left' | 'right' | 'top' | 'bottom';
+declare const _default: import("vue").DefineComponent<{
+    open: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+    };
+    width: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    showClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showMask: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    outsideClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    focusTrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}, {
+    style: typeof style;
+    fade: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+    isOpen: import("vue").WritableComputedRef<boolean>;
+    zIndex: import("vue").Ref<number>;
+    hasFooter: import("vue").ComputedRef<boolean>;
+    hasTitle: import("vue").ComputedRef<boolean>;
+    hasTrigger: import("vue").ComputedRef<boolean>;
+    bodyRef: import("vue").Ref<HTMLElement | null>;
+    contentStyle: import("vue").ComputedRef<CSSProperties>;
+    currentTransition: import("vue").ComputedRef<{
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    } | {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    } | {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    } | {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    }>;
+    open: () => void;
+    close: (e: MouseEvent | KeyboardEvent | undefined) => void;
+    handleOpenAutoFocus: (e: Event) => void;
+    handleOpenChange: (value: boolean) => void;
+    onEscapeKeyDown: (e: KeyboardEvent) => void;
+    onPointerDownOutside: (e: Event) => void;
+    onInteractOutside: (e: Event) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("open" | "update:open" | "close")[], "open" | "update:open" | "close", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    open: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+    };
+    width: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    showClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showMask: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    outsideClose: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    focusTrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}>> & {
+    "onUpdate:open"?: ((...args: any[]) => any) | undefined;
+    onClose?: ((...args: any[]) => any) | undefined;
+    onOpen?: ((...args: any[]) => any) | undefined;
+}, {
+    height: string | number;
+    width: string | number;
+    open: boolean;
+    title: string;
+    placement: Placement;
+    outsideClose: boolean;
+    showClose: boolean;
+    focusTrap: boolean;
+    showMask: boolean;
+}, {}>;
+export default _default;

package/lib/components/drawer/style/Drawer.css.d.ts

@@ -0,0 +1,33 @@
+export declare const mask: string;
+export declare const placement: Record<"bottom" | "left" | "right" | "top", string>;
+export declare const slideTransition: {
+    left: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+    right: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+    top: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+    bottom: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+};
+export declare const header: string;
+export declare const title: string;
+export declare const close: string;
+export declare const body: string;
+export declare const footer: string;

package/lib/components/drawer/style/index.d.ts

@@ -0,0 +1 @@
+export * from './Drawer.css';

package/lib/components/hovercard/HoverCard.vue.d.ts

@@ -0,0 +1,122 @@
+import { type PropType } from 'vue';
+import { type Placement } from '../../composables/usePopper';
+import * as style from './style';
+declare const _default: import("vue").DefineComponent<{
+    open: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+        validator: (value: Placement) => boolean;
+    };
+    transfer: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sideOffset: {
+        type: NumberConstructor;
+        default: number;
+    };
+    collisionPadding: {
+        type: PropType<number | {
+            top?: number;
+            right?: number;
+            bottom?: number;
+            left?: number;
+        }>;
+        default: number;
+    };
+    arrow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<"light" | "dark">;
+        default: string;
+    };
+    openDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    closeDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}, {
+    isOpen: import("vue").Ref<boolean>;
+    zIndex: import("vue").Ref<number>;
+    showArrow: import("vue").ComputedRef<boolean>;
+    contentClasses: import("vue").ComputedRef<unknown[]>;
+    resolvedSide: import("vue").ComputedRef<"bottom" | "left" | "right" | "top" | undefined>;
+    resolvedAlign: import("vue").ComputedRef<"center" | "end" | "start" | undefined>;
+    style: typeof style;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:open"[], "update:open", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    open: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+        validator: (value: Placement) => boolean;
+    };
+    transfer: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sideOffset: {
+        type: NumberConstructor;
+        default: number;
+    };
+    collisionPadding: {
+        type: PropType<number | {
+            top?: number;
+            right?: number;
+            bottom?: number;
+            left?: number;
+        }>;
+        default: number;
+    };
+    arrow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<"light" | "dark">;
+        default: string;
+    };
+    openDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    closeDelay: {
+        type: NumberConstructor;
+        default: number;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}>> & {
+    "onUpdate:open"?: ((...args: any[]) => any) | undefined;
+}, {
+    open: boolean;
+    variant: "dark" | "light";
+    placement: Placement;
+    transfer: boolean;
+    arrow: boolean;
+    sideOffset: number;
+    collisionPadding: number | {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    openDelay: number;
+    closeDelay: number;
+}, {}>;
+export default _default;

package/lib/components/hovercard/style/HoverCard.css.d.ts

@@ -0,0 +1,3 @@
+export declare const content: string;
+export declare const arrow: string;
+export declare const dark: string;

package/lib/components/hovercard/style/index.d.ts

@@ -0,0 +1 @@
+export * from './HoverCard.css';

package/lib/components/index.d.ts

@@ -51,6 +51,9 @@ export { default as MVirtualScroll } from './virtualscroll/VirtualScroll.vue';
 export { default as MConfirm } from './confirm/Confirm.vue';
 export { default as MConfirmProvider } from './confirm/ConfirmProvider.vue';
 export { default as MDialog } from './dialog/Dialog.vue';
+export { default as MPanelDialog } from './paneldialog/PanelDialog.vue';
 export { default as MDialogProvider } from './dialogprovider/DialogProvider.vue';
+export { default as MDrawer } from './drawer/Drawer.vue';
 export { default as MTree } from './tree/Tree.vue';
 export { default as MPopover } from './popover/Popover.vue';
+export { default as MHoverCard } from './hovercard/HoverCard.vue';

package/lib/components/input/Input.vue.d.ts

@@ -39,10 +39,14 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     error: {
-        type: StringConstructor;
+        type: PropType<string | null>;
         default: string;
     };
-    modelValue: PropType<string | number | boolean | object | any[] | any[] | undefined>;
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: PropType<string | number | boolean | object | any[] | null | undefined>;
     name: StringConstructor;
     required: BooleanConstructor;
     rules: {
@@ -73,6 +77,12 @@ declare const _default: import("vue").DefineComponent<{
     hasHelpMessage: import("vue").ComputedRef<boolean>;
     inputError: import("vue").ComputedRef<any>;
     style: typeof style;
+    showClear: import("vue").ComputedRef<boolean>;
+    clearClasses: import("vue").ComputedRef<(string | {
+        [x: string]: boolean;
+    })[]>;
+    currentValue: import("vue").ComputedRef<any>;
+    onNativeInput: (event: Event) => void;
     onClear: () => void;
     validate: (value: any) => boolean;
     setError: (value: string) => void;
@@ -117,10 +127,14 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     error: {
-        type: StringConstructor;
+        type: PropType<string | null>;
         default: string;
     };
-    modelValue: PropType<string | number | boolean | object | any[] | any[] | undefined>;
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modelValue: PropType<string | number | boolean | object | any[] | null | undefined>;
     name: StringConstructor;
     required: BooleanConstructor;
     rules: {
@@ -137,9 +151,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly: boolean;
     description: string;
     required: boolean;
-    error: string;
+    error: string | null;
     loading: boolean;
     rules: unknown[];
     placeholder: string;
+    clearable: boolean;
 }, {}>;
 export default _default;

package/lib/components/input/style/Input.css.d.ts

@@ -23,5 +23,9 @@ export declare const leftIcon: string;
 export declare const hasLeftIcon: string;
 export declare const rightIcon: string;
 export declare const hasRightIcon: string;
+export declare const hasClear: string;
+export declare const hasClearAndRightIcon: string;
+export declare const clear: string;
+export declare const clearWithRightIcon: string;
 export declare const prefix: string;
 export declare const suffix: string;

package/lib/components/paneldialog/PanelDialog.vue.d.ts

@@ -0,0 +1,167 @@
+import { type ComponentPublicInstance, type CSSProperties, type PropType } from 'vue';
+import type { ComputedRef } from 'vue';
+import * as style from './style';
+declare const _default: import("vue").DefineComponent<{
+    open: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: PropType<number | string>;
+        default: string;
+    };
+    height: {
+        type: PropType<number | string>;
+        default: undefined;
+    };
+    maxHeight: {
+        type: PropType<number | string>;
+        default: string;
+    };
+    draggable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    handleSelector: {
+        type: StringConstructor;
+        default: string;
+    };
+    backdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    backdropClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    panelClass: {
+        type: PropType<string | unknown[] | Record<string, unknown>>;
+        default: string;
+    };
+    panelStyle: {
+        type: PropType<CSSProperties>;
+        default: undefined;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+    focusTrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onClose: {
+        type: PropType<() => void>;
+        default: () => void;
+    };
+}, {
+    dialogContent: import("vue").ShallowRef<HTMLElement | ComponentPublicInstance | null>;
+    panel: import("vue").Ref<HTMLElement | null>;
+    zIndex: import("vue").Ref<number>;
+    fade: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+    modalScale: {
+        enterActive: string;
+        leaveActive: string;
+        enterFrom: string;
+        leaveTo: string;
+    };
+    style: typeof style;
+    isOpen: ComputedRef<boolean>;
+    contentClasses: ComputedRef<string[]>;
+    contentStyle: ComputedRef<CSSProperties>;
+    focusScopeClasses: ComputedRef<string[]>;
+    panelComputedStyle: ComputedRef<CSSProperties>;
+    isDragging: import("vue").Ref<boolean>;
+    close: () => void;
+    handleAfterLeave: () => void;
+    handleEscapeKeyDown: (event: KeyboardEvent) => void;
+    handleOpenChange: (value: boolean) => void;
+    handleOpenAutoFocus: (event: Event) => void;
+    handleFocusOutside: (event: Event) => void;
+    onPanelPointerDown: (event: PointerEvent) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("open" | "update:open" | "close" | "onClose" | "onOpen")[], "open" | "update:open" | "close" | "onClose" | "onOpen", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    open: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    modal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: PropType<number | string>;
+        default: string;
+    };
+    height: {
+        type: PropType<number | string>;
+        default: undefined;
+    };
+    maxHeight: {
+        type: PropType<number | string>;
+        default: string;
+    };
+    draggable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    handleSelector: {
+        type: StringConstructor;
+        default: string;
+    };
+    backdrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    backdropClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    panelClass: {
+        type: PropType<string | unknown[] | Record<string, unknown>>;
+        default: string;
+    };
+    panelStyle: {
+        type: PropType<CSSProperties>;
+        default: undefined;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+    focusTrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    onClose: {
+        type: PropType<() => void>;
+        default: () => void;
+    };
+}>> & {
+    "onUpdate:open"?: ((...args: any[]) => any) | undefined;
+    onClose?: ((...args: any[]) => any) | undefined;
+    onOpen?: ((...args: any[]) => any) | undefined;
+    onOnClose?: ((...args: any[]) => any) | undefined;
+    onOnOpen?: ((...args: any[]) => any) | undefined;
+}, {
+    height: string | number;
+    maxHeight: string | number;
+    width: string | number;
+    open: boolean;
+    modal: boolean;
+    onClose: () => void;
+    focusTrap: boolean;
+    draggable: boolean;
+    handleSelector: string;
+    backdrop: boolean;
+    backdropClass: string;
+    panelClass: string | unknown[] | Record<string, unknown>;
+    panelStyle: CSSProperties;
+}, {}>;
+export default _default;

package/lib/components/paneldialog/style/PanelDialog.css.d.ts

@@ -0,0 +1,8 @@
+export declare const backdrop: string;
+export declare const dialogContent: string;
+export declare const dialogContentModal: string;
+export declare const dialogContentNonModal: string;
+export declare const focusScope: string;
+export declare const focusScopeNonModal: string;
+export declare const focusScopeModal: string;
+export declare const panel: string;

package/lib/components/paneldialog/style/index.d.ts

@@ -0,0 +1 @@
+export * from './PanelDialog.css';

package/lib/components/popover/Popover.vue.d.ts

@@ -23,6 +23,15 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
+    collisionPadding: {
+        type: PropType<number | {
+            top?: number;
+            right?: number;
+            bottom?: number;
+            left?: number;
+        }>;
+        default: number;
+    };
     arrow: {
         type: BooleanConstructor;
         default: boolean;
@@ -64,6 +73,15 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
+    collisionPadding: {
+        type: PropType<number | {
+            top?: number;
+            right?: number;
+            bottom?: number;
+            left?: number;
+        }>;
+        default: number;
+    };
     arrow: {
         type: BooleanConstructor;
         default: boolean;
@@ -85,5 +103,11 @@ declare const _default: import("vue").DefineComponent<{
     arrow: boolean;
     modal: boolean;
     sideOffset: number;
+    collisionPadding: number | {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
 }, {}>;
 export default _default;