@teammodlr/ui-kit 1.0.6 → 2.0.0

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

@@ -0,0 +1,75 @@
+import { type PropType } from "vue";
+import * as style from './style';
+import type { Placement } from "@popperjs/core";
+declare const _default: import("vue").DefineComponent<{
+    modelValue: {
+        type: StringConstructor;
+        default: string;
+    };
+    transfer: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}, {
+    isOpen: import("vue").Ref<boolean>;
+    popper: import("vue").Ref<HTMLElement | null | undefined>;
+    transferTo: import("vue").Ref<String>;
+    wrapper: import("vue").Ref<HTMLElement | undefined>;
+    referenceRef: import("vue").Ref<HTMLElement | undefined>;
+    updateFromRGB: () => void;
+    updateFromHex: () => void;
+    setInputs: () => void;
+    rgbOrHex: import("vue").Ref<boolean>;
+    hexInputElement: import("vue").Ref<any>;
+    hexInput: import("vue").Ref<string>;
+    rInput: import("vue").Ref<string>;
+    gInput: import("vue").Ref<string>;
+    bInput: import("vue").Ref<string>;
+    aInput: import("vue").Ref<string>;
+    finalColor: import("vue").ComputedRef<import("./utils").Color>;
+    hueSlider: import("vue").Ref<number>;
+    opacitySlider: import("vue").Ref<number>;
+    dragging: import("vue").Ref<boolean>;
+    setThumbPosition: () => void;
+    position: {
+        x: number;
+        y: number;
+    };
+    elementX: import("vue").Ref<number>;
+    pressed: import("vue").Ref<boolean>;
+    handleMouseDown: () => void;
+    picker: import("vue").Ref<HTMLElement | undefined>;
+    style: typeof style;
+    mainColor: import("vue").ComputedRef<import("./utils").Color>;
+    zIndex: import("vue").Ref<number>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: StringConstructor;
+        default: string;
+    };
+    transfer: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: string;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    modelValue: string;
+    placement: Placement;
+    transfer: boolean;
+}>;
+export default _default;

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

@@ -0,0 +1,9 @@
+export declare const container: string;
+export declare const sliderThumb: string;
+export declare const preview: string;
+export declare const colours: string;
+export declare const reference: string;
+export declare const referenceColor: string;
+export declare const colorActions: string;
+export declare const whiteGradient: string;
+export declare const blackGradient: string;

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

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

package/lib/components/colorpicker/utils.d.ts

@@ -0,0 +1,16 @@
+export interface Color {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
+export interface HSV {
+    h: number;
+    s: number;
+    v: number;
+}
+export declare const RGBAToHex: (r: number, g: number, b: number, a: number) => string;
+export declare const hexToRGB: (hexColor: string, defaultR?: number, defaultG?: number, defaultB?: number, defaultA?: number) => Color;
+export declare const RGBToHSV: (r: number, g: number, b: number) => HSV;
+export declare const HSVToRGBA: (hue: number, brightness: number, saturation: number, alpha: number) => Color;
+export declare const HueToRGBA: (hue: number, alpha: number) => Color;

package/lib/components/dropdown/Dropdown.vue.d.ts

@@ -49,6 +49,7 @@ declare const _default: import("vue").DefineComponent<{
     isOpen: import("vue").Ref<boolean>;
     isNested: boolean;
     placement: import("vue").Ref<Placement>;
+    menuClasses: import("vue").ComputedRef<string[]>;
     computedWrapperClasses: import("vue").ComputedRef<(string | {
         'm-dropdown--open': boolean;
         'm-dropdown--nested': boolean;
@@ -102,13 +103,13 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     label: null;
     onSelect: (labels: any) => void;
+    x: number;
+    y: number;
+    open: boolean;
     placement: Placement;
     transfer: boolean;
-    open: boolean;
+    transitionName: string;
     trigger: "click" | "hover";
     virtual: Record<string, any>;
-    x: number;
-    y: number;
-    transitionName: string;
 }>;
 export default _default;

package/lib/components/dropdown/DropdownItem.vue.d.ts

@@ -1,4 +1,5 @@
 import { type PropType } from 'vue';
+import * as style from "./style";
 declare const _default: import("vue").DefineComponent<{
     label: {
         type: (StringConstructor | NumberConstructor)[];
@@ -20,16 +21,17 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: null;
     };
+    description: {
+        type: StringConstructor;
+        default: null;
+    };
 }, {
     wrapper: import("vue").Ref<null>;
     hasIconLeft: import("vue").ComputedRef<boolean>;
     hasIconRight: import("vue").ComputedRef<boolean>;
     handleSelect: () => void;
-    computedWrapperClasses: import("vue").ComputedRef<{
-        'm-dropdown-item': boolean;
-        'm-dropdown-item--disabled': boolean;
-        'm-dropdown-item--reference': boolean;
-    }>;
+    computedWrapperClasses: import("vue").ComputedRef<string[]>;
+    style: typeof style;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     label: {
         type: (StringConstructor | NumberConstructor)[];
@@ -51,10 +53,15 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: null;
     };
+    description: {
+        type: StringConstructor;
+        default: null;
+    };
 }>> & {}, {
     label: string | number;
     onSelect: (label: string | number) => void;
     disabled: boolean;
+    description: string;
     reference: boolean;
     hotkey: string;
 }>;

package/lib/components/dropdown/DropdownList.vue.d.ts

@@ -1,2 +1,5 @@
-declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+import * as style from "./style";
+declare const _default: import("vue").DefineComponent<{}, {
+    style: typeof style;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
 export default _default;

package/lib/components/dropdown/style/Dropdown.css.d.ts

@@ -0,0 +1,5 @@
+export declare const menu: string;
+export declare const menuItems: string;
+export declare const menuItem: string;
+export declare const menuItemText: string;
+export declare const menuItemIcon: string;

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

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

package/lib/components/dropdown/symbol.d.ts

@@ -0,0 +1,6 @@
+import type { InjectionKey } from "vue";
+export interface DropdownState {
+    handleSelect: (labels: string[]) => void;
+    isOpen: boolean;
+}
+export declare const DROPDOWN_STATE: InjectionKey<DropdownState>;

package/lib/components/index.d.ts

@@ -1,11 +1,17 @@
+export { default as MBadge } from './badge/Badge.vue';
 export { default as MButton } from './button/Button.vue';
 export { default as MButtonGroup } from './buttongroup/ButtonGroup.vue';
 export { default as MForm } from './form/Form.vue';
 export { default as MInput } from './input/Input.vue';
+export { default as MTag } from './tag/Tag.vue';
 export { default as MSelect } from './select/Select.vue';
 export { default as MCheckbox } from './checkbox/Checkbox.vue';
+export { default as MRadio } from './radio/Radio.vue';
+export { default as MRadioButton } from './radiobutton/RadioButton.vue';
+export { default as MRadioButtonGroup } from './radiobuttongroup/RadioButtonGroup.vue';
 export { default as MBreadcrumb } from './breadcrumb/Breadcrumb.vue';
-export { default as MBreadcrumbItem } from './breadcrumbitem/BreadcrumbItem.vue';
+export { default as MBreadcrumbItem } from './breadcrumb/BreadcrumbItem.vue';
+export { default as MVirtualScroll } from './virtualscroll/VirtualScroll.vue';
 export { default as MAvatar } from './avatar/Avatar.vue';
 export { default as MAvatarGroup } from './avatargroup/AvatarGroup.vue';
 export { default as MImage } from './image/Image.vue';
@@ -24,3 +30,6 @@ export { default as MDropdown } from './dropdown/Dropdown.vue';
 export { default as MDropdownWrapper } from './dropdown/DropdownWrapper.vue';
 export { default as MDropdownList } from './dropdown/DropdownList.vue';
 export { default as MDropdownItem } from './dropdown/DropdownItem.vue';
+export { default as MModal } from './modal/Modal.vue';
+export { default as MColorPicker } from './colorpicker/ColorPicker.vue';
+export { default as MSlider } from './slider/Slider.vue';

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

@@ -1,5 +1,6 @@
 import type { PropType } from "vue";
-import type { Size } from "@/types/props";
+import type { Size } from "../../types/props";
+import * as style from './style';
 declare const _default: import("vue").DefineComponent<{
     label: {
         type: StringConstructor;
@@ -29,46 +30,52 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    help: {
+    description: {
+        type: StringConstructor;
+        default: string;
+    };
+    block: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    error: {
         type: StringConstructor;
         default: string;
     };
     modelValue: PropType<string | number | boolean | object | any[] | undefined>;
     name: StringConstructor;
     required: BooleanConstructor;
-    error: StringConstructor;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
     };
 }, {
+    element: import("vue").Ref<HTMLInputElement | null>;
     id: Readonly<import("vue").Ref<string>>;
     inputType: import("vue").ComputedRef<string>;
     disabled: import("vue").ComputedRef<any>;
     loading: import("vue").ComputedRef<any>;
     readonly: import("vue").ComputedRef<boolean>;
     inputComputedClasses: import("vue").ComputedRef<(string | {
-        'm-input--disabled': any;
-        'm-input--readonly': boolean;
-        'm-input--focused': boolean;
-        'm-input--error': any;
-        'm-input--prefix': boolean;
-        'm-input--suffix': boolean;
-        'm-input--loading': boolean;
-        'm-input--password': boolean;
+        [x: string]: any;
     })[]>;
     wrapperComputedClasses: import("vue").ComputedRef<(string | {
-        'm-form__input': boolean;
+        [x: string]: boolean;
     })[]>;
+    computedContainerClasses: import("vue").ComputedRef<{
+        [x: string]: boolean;
+    }[]>;
     name: import("vue").Ref<string | undefined>;
-    hasPrefix: import("vue").ComputedRef<boolean>;
-    hasSuffix: import("vue").ComputedRef<boolean>;
+    hasLeftIcon: import("vue").ComputedRef<boolean>;
+    hasRightIcon: import("vue").ComputedRef<boolean>;
     inputError: import("vue").ComputedRef<any>;
+    style: typeof style;
     onClear: () => void;
-    focus: () => void;
     validate: (value: any) => boolean;
     setError: (value: string) => void;
-    listeners: {};
+    focus: () => void | undefined;
+    blur: () => void | undefined;
+    inputListeners: {};
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     label: {
         type: StringConstructor;
@@ -98,14 +105,21 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    help: {
+    description: {
+        type: StringConstructor;
+        default: string;
+    };
+    block: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    error: {
         type: StringConstructor;
         default: string;
     };
     modelValue: PropType<string | number | boolean | object | any[] | undefined>;
     name: StringConstructor;
     required: BooleanConstructor;
-    error: StringConstructor;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
@@ -113,14 +127,16 @@ declare const _default: import("vue").DefineComponent<{
 }>> & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
+    error: string;
     type: string;
     required: boolean;
     size: Size;
+    block: boolean;
     disabled: boolean;
     loading: boolean;
     readonly: boolean;
     rules: unknown[];
     placeholder: string;
-    help: string;
+    description: string;
 }>;
 export default _default;

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

@@ -0,0 +1,23 @@
+export declare const vars: {
+    height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    radius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    paddingX: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    paddingY: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    cursor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const wrapper: string;
+export declare const base: string;
+export declare const size: Record<"sm" | "md" | "lg" | "xs" | "xl", string>;
+export declare const block: string;
+export declare const disabled: string;
+export declare const label: string;
+export declare const description: string;
+export declare const errorMessage: string;
+export declare const error: string;
+export declare const leftIcon: string;
+export declare const hasLeftIcon: string;
+export declare const rightIcon: string;
+export declare const hasRightIcon: string;

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

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

package/lib/components/link/Link.vue.d.ts

@@ -1,4 +1,4 @@
-import type { Color } from "@/types/props";
+import type { Color } from "../../types/props";
 import { type PropType } from "vue";
 declare const _default: import("vue").DefineComponent<{
     color: {
@@ -44,8 +44,8 @@ declare const _default: import("vue").DefineComponent<{
     };
     to: (StringConstructor | ObjectConstructor)[];
 }>>, {
-    disabled: boolean;
     block: boolean;
     underline: boolean;
+    disabled: boolean;
 }>;
 export default _default;

package/lib/components/messageprovider/Message.vue.d.ts

@@ -1,4 +1,5 @@
 import type { PropType } from 'vue';
+type Variant = 'info' | 'success' | 'warning' | 'error' | 'default' | 'loading';
 declare const _default: import("vue").DefineComponent<{
     onInternalAfterLeave: PropType<(key: string) => void>;
     internalKey: {
@@ -12,6 +13,10 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    variant: {
+        type: PropType<Variant>;
+        default: string;
+    };
     timeout: {
         type: NumberConstructor;
         default: number;
@@ -27,6 +32,8 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     show: import("vue").Ref<boolean>;
     hide: () => void;
+    classes: import("vue").ComputedRef<(string | string[])[]>;
+    iconClasses: import("vue").ComputedRef<string[]>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     onInternalAfterLeave: PropType<(key: string) => void>;
     internalKey: {
@@ -40,6 +47,10 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         default: string;
     };
+    variant: {
+        type: PropType<Variant>;
+        default: string;
+    };
     timeout: {
         type: NumberConstructor;
         default: number;
@@ -54,8 +65,9 @@ declare const _default: import("vue").DefineComponent<{
     };
 }>>, {
     type: string;
+    variant: Variant;
+    onClose: Function;
     timeout: number;
     showClose: boolean;
-    onClose: Function;
 }>;
 export default _default;

package/lib/components/messageprovider/MessageProvider.vue.d.ts

@@ -1,4 +1,4 @@
-import type { MessageType, MessageReactive, MessageApiInjection } from './types';
+import type { MessageType, MessageReactive, MessageApiInjection, MessagePlacement } from './types';
 import type { PropType } from 'vue';
 export type MessageProviderInst = MessageApiInjection;
 interface PrivateMessageRef extends MessageReactive {
@@ -11,7 +11,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     placement: {
-        type: PropType<"top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
+        type: PropType<MessagePlacement>;
         default: string;
     };
     timeout: {
@@ -30,13 +30,14 @@ declare const _default: import("vue").DefineComponent<{
         destroy: () => void;
     }[]>;
     onInternalAfterLeave: (key: string) => void;
+    classes: import("vue").ComputedRef<(string | any[])[]>;
 } & MessageApiInjection, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     teleportTo: {
         type: StringConstructor;
         default: string;
     };
     placement: {
-        type: PropType<"top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
+        type: PropType<MessagePlacement>;
         default: string;
     };
     timeout: {
@@ -44,8 +45,8 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     };
 }>>, {
-    placement: "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
-    timeout: number;
+    placement: MessagePlacement;
     teleportTo: string;
+    timeout: number;
 }>;
 export default _default;

package/lib/components/messageprovider/style/Message.css.d.ts

@@ -0,0 +1,12 @@
+export declare const vars: {
+    top: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    left: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    right: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    iconColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const wrapper: string;
+export declare const base: string;
+export declare const placement: Record<"top" | "top-left" | "top-right", string>;
+export declare const icon: string;
+export declare const message: string;
+export declare const variant: Record<"error" | "default" | "success" | "warning" | "loading" | "info", string>;

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

@@ -0,0 +1 @@
+export * from "./Message.css";

package/lib/components/messageprovider/types.d.ts

@@ -1,6 +1,7 @@
 import type { VNodeChild } from 'vue';
 export type ContentType = string;
-export type MessageType = 'info' | 'success' | 'warning' | 'error' | 'loading' | 'default';
+export type MessageType = 'info' | 'success' | 'warning' | 'error' | 'default' | 'loading';
+export type MessagePlacement = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right';
 export type MessageRenderMessage = (props: any) => VNodeChild;
 export interface MessageOptions {
     type?: MessageType;

package/lib/components/modal/Modal.vue.d.ts

@@ -0,0 +1,52 @@
+import type { PropType } from "vue";
+import type { Size } from "../../types/props";
+import * as style from './style';
+declare const _default: import("vue").DefineComponent<{
+    size: {
+        type: PropType<Size>;
+        default: string;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    canClickOutside: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}, {
+    close: () => void;
+    closeOutside: () => void;
+    open: (element: HTMLElement | null) => void;
+    target: import("vue").Ref<any>;
+    style: typeof style;
+    isOpen: import("vue").Ref<boolean>;
+    containerClasses: import("vue").ComputedRef<string[]>;
+    zIndex: import("vue").Ref<number>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "open"[], "open", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    size: {
+        type: PropType<Size>;
+        default: string;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    canClickOutside: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    zIndex: {
+        type: NumberConstructor;
+    };
+}>> & {
+    onOpen?: ((...args: any[]) => any) | undefined;
+}, {
+    title: string;
+    size: Size;
+    canClickOutside: boolean;
+}>;
+export default _default;

package/lib/components/modal/style/Modal.css.d.ts

@@ -0,0 +1,21 @@
+export declare const vars: {
+    maxWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    initialLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    initialTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
+export declare const size: Record<"sm" | "md" | "lg" | "xs" | "xl", string>;
+export declare const background: string;
+export declare const container: 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;
+export declare const fadeEnterNoBounce: string;
+export declare const fadeEnter: string;
+export declare const fadeLeave: string;
+export declare const fadeBackgroundEnter: string;
+export declare const fadeBackgroundLeave: string;
+export declare const fadeEnterFrom: string;

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

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