@vtj/ui 0.5.2 → 0.6.0

package/types/components/dialog/Dialog.d.ts

@@ -0,0 +1,334 @@
+import { Position, UseMouseSourceType } from '@vueuse/core';
+import { DialogMode } from './types';
+import { DraggableOptions, ResizableOptions } from '../../directives';
+import { BaseSize } from '../shared';
+import { IconParam } from '../';
+import { DefineComponent, PropType, VNode, RendererNode, RendererElement, Ref, ComputedRef, ComponentOptionsMixin, ComponentInternalInstance, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<{
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+    };
+    subtitle: {
+        type: StringConstructor;
+    };
+    icon: {
+        type: PropType<IconParam>;
+    };
+    size: {
+        type: PropType<BaseSize>;
+        default: string;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    left: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    top: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    modal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    draggable: {
+        type: PropType<boolean | DraggableOptions>;
+        default: boolean;
+    };
+    resizable: {
+        type: PropType<boolean | ResizableOptions>;
+    };
+    closable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maximizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    minimizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    mode: {
+        type: PropType<DialogMode>;
+        default: string;
+    };
+    content: {
+        type: PropType<VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+        }> | DefineComponent<any, any, any, any>>;
+    };
+    src: {
+        type: StringConstructor;
+    };
+    componentInstance: {
+        type: PropType<Record<string, any> | null>;
+    };
+    beforeClose: {
+        type: PropType<() => boolean | Promise<boolean>>;
+    };
+    submit: {
+        type: (BooleanConstructor | StringConstructor)[];
+    };
+    cancel: {
+        type: (BooleanConstructor | StringConstructor)[];
+    };
+    bodyPadding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    primary: {
+        type: BooleanConstructor;
+    };
+}, {
+    panelRef: Ref<any>;
+    state: {
+        mode: DialogMode;
+        wrapperWidth: number;
+        wrapperHeight: number;
+        width: number;
+        height: number;
+        left: number;
+        top: number;
+        zIndex: number;
+        dragging: boolean;
+        resizing: boolean;
+    };
+    maximized: ComputedRef<boolean>;
+    minimized: ComputedRef<boolean>;
+    changeMode: (mode: DialogMode) => void;
+    show: () => void;
+    hide: () => void;
+    submit: () => void;
+    cancel: () => void;
+    componentInstance: {
+        componentInstance: Record<string, any>;
+    } | undefined;
+}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    'update:modelValue': (value: boolean) => void;
+    open: (instance: ComponentInternalInstance) => void;
+    close: () => void;
+    destroy: () => void;
+    maximized: () => void;
+    minimized: () => void;
+    normal: () => void;
+    modeChange: (mode: DialogMode) => void;
+    dragStart: (position: Position) => void;
+    dragging: (position: Position) => void;
+    dragEnd: (position: Position) => void;
+    resizeStart: (dir: string, mie: {
+        x: Ref<number>;
+        y: Ref<number>;
+        sourceType: Ref<UseMouseSourceType>;
+        elementX: Ref<number>;
+        elementY: Ref<number>;
+        elementPositionX: Ref<number>;
+        elementPositionY: Ref<number>;
+        elementHeight: Ref<number>;
+        elementWidth: Ref<number>;
+        isOutside: Ref<boolean>;
+        stop: () => void;
+    }) => void;
+    resizeEnd: (dir: string, mie: {
+        x: Ref<number>;
+        y: Ref<number>;
+        sourceType: Ref<UseMouseSourceType>;
+        elementX: Ref<number>;
+        elementY: Ref<number>;
+        elementPositionX: Ref<number>;
+        elementPositionY: Ref<number>;
+        elementHeight: Ref<number>;
+        elementWidth: Ref<number>;
+        isOutside: Ref<boolean>;
+        stop: () => void;
+    }) => void;
+    resizing: (dir: string, mie: {
+        x: Ref<number>;
+        y: Ref<number>;
+        sourceType: Ref<UseMouseSourceType>;
+        elementX: Ref<number>;
+        elementY: Ref<number>;
+        elementPositionX: Ref<number>;
+        elementPositionY: Ref<number>;
+        elementHeight: Ref<number>;
+        elementWidth: Ref<number>;
+        isOutside: Ref<boolean>;
+        stop: () => void;
+    }) => void;
+    submit: () => void;
+    cancel: () => void;
+}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+    };
+    subtitle: {
+        type: StringConstructor;
+    };
+    icon: {
+        type: PropType<IconParam>;
+    };
+    size: {
+        type: PropType<BaseSize>;
+        default: string;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    left: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    top: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    modal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    draggable: {
+        type: PropType<boolean | DraggableOptions>;
+        default: boolean;
+    };
+    resizable: {
+        type: PropType<boolean | ResizableOptions>;
+    };
+    closable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maximizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    minimizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    mode: {
+        type: PropType<DialogMode>;
+        default: string;
+    };
+    content: {
+        type: PropType<VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+        }> | DefineComponent<any, any, any, any>>;
+    };
+    src: {
+        type: StringConstructor;
+    };
+    componentInstance: {
+        type: PropType<Record<string, any> | null>;
+    };
+    beforeClose: {
+        type: PropType<() => boolean | Promise<boolean>>;
+    };
+    submit: {
+        type: (BooleanConstructor | StringConstructor)[];
+    };
+    cancel: {
+        type: (BooleanConstructor | StringConstructor)[];
+    };
+    bodyPadding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    primary: {
+        type: BooleanConstructor;
+    };
+}>> & {
+    onSubmit?: (() => any) | undefined;
+    onResizing?: ((dir: string, mie: {
+        x: Ref<number>;
+        y: Ref<number>;
+        sourceType: Ref<UseMouseSourceType>;
+        elementX: Ref<number>;
+        elementY: Ref<number>;
+        elementPositionX: Ref<number>;
+        elementPositionY: Ref<number>;
+        elementHeight: Ref<number>;
+        elementWidth: Ref<number>;
+        isOutside: Ref<boolean>;
+        stop: () => void;
+    }) => any) | undefined;
+    onOpen?: ((instance: ComponentInternalInstance) => any) | undefined;
+    onCancel?: (() => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onNormal?: (() => any) | undefined;
+    onMaximized?: (() => any) | undefined;
+    onMinimized?: (() => any) | undefined;
+    onDragging?: ((position: Position) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    onDestroy?: (() => any) | undefined;
+    onModeChange?: ((mode: DialogMode) => any) | undefined;
+    onDragStart?: ((position: Position) => any) | undefined;
+    onDragEnd?: ((position: Position) => any) | undefined;
+    onResizeStart?: ((dir: string, mie: {
+        x: Ref<number>;
+        y: Ref<number>;
+        sourceType: Ref<UseMouseSourceType>;
+        elementX: Ref<number>;
+        elementY: Ref<number>;
+        elementPositionX: Ref<number>;
+        elementPositionY: Ref<number>;
+        elementHeight: Ref<number>;
+        elementWidth: Ref<number>;
+        isOutside: Ref<boolean>;
+        stop: () => void;
+    }) => any) | undefined;
+    onResizeEnd?: ((dir: string, mie: {
+        x: Ref<number>;
+        y: Ref<number>;
+        sourceType: Ref<UseMouseSourceType>;
+        elementX: Ref<number>;
+        elementY: Ref<number>;
+        elementPositionX: Ref<number>;
+        elementPositionY: Ref<number>;
+        elementHeight: Ref<number>;
+        elementWidth: Ref<number>;
+        isOutside: Ref<boolean>;
+        stop: () => void;
+    }) => any) | undefined;
+}, {
+    primary: boolean;
+    size: BaseSize;
+    height: string | number;
+    width: string | number;
+    mode: DialogMode;
+    bodyPadding: boolean;
+    modelValue: boolean;
+    modal: boolean;
+    draggable: boolean | DraggableOptions;
+    closable: boolean;
+    maximizable: boolean;
+    minimizable: boolean;
+}, {}>, {
+    actions?(_: {}): any;
+    default?(_: {}): any;
+    footer?(_: {}): any;
+    extra?(_: {}): any;
+    handle?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/types/components/dialog/create.d.ts

@@ -0,0 +1,11 @@
+import { VNode, RendererNode, RendererElement, AppContext } from 'vue';
+import { DialogProps } from './types';
+export type CreateDialogProps = DialogProps & {
+    [index: string]: any;
+};
+export declare function createDialog(props: CreateDialogProps, context?: AppContext | null): {
+    vnode: VNode<RendererNode, RendererElement, {
+        [key: string]: any;
+    }>;
+    destroy: () => void;
+};

package/types/components/dialog/hooks.d.ts

@@ -0,0 +1,58 @@
+import { ComputedRef, MaybeRef } from 'vue';
+import { DialogProps, DialogState, DialogMode, DialogEmits } from './types';
+import { Emits } from '../';
+import { DraggableOptions, ResizableOptions } from '../../directives';
+export declare function useState(props: DialogProps, wrapper: MaybeRef<HTMLElement>): {
+    state: {
+        mode: DialogMode;
+        wrapperWidth: number;
+        wrapperHeight: number;
+        width: number;
+        height: number;
+        left: number;
+        top: number;
+        zIndex: number;
+        dragging: boolean;
+        resizing: boolean;
+    };
+    normal: ComputedRef<boolean>;
+    maximized: ComputedRef<boolean>;
+    minimized: ComputedRef<boolean>;
+};
+export declare function useStyle(props: DialogProps, state: DialogState): {
+    styles: ComputedRef<{
+        width: string;
+        height: string;
+        top: string;
+        left: string;
+        zIndex: number;
+    }>;
+    classes: ComputedRef<{
+        [x: string]: boolean;
+        "is-draggable": boolean;
+        "is-resizable": boolean;
+        'is-primary': boolean;
+    }>;
+    wrapperClass: ComputedRef<{
+        [x: string]: boolean;
+        'is-dragging': boolean;
+        'is-resizing': boolean;
+    }>;
+    modalStyle: ComputedRef<{
+        zIndex: number;
+    }>;
+};
+export declare function useMethods(props: DialogProps, state: DialogState, emit: Emits<DialogEmits>): {
+    close: () => Promise<void>;
+    changeMode: (mode: DialogMode) => void;
+    show: () => void;
+    hide: () => void;
+    active: () => void;
+    submit: () => void;
+    cancel: () => void;
+};
+export declare function useDraggableOptions(props: DialogProps, state: DialogState, emit: Emits<DialogEmits>, target: MaybeRef<HTMLElement>): ComputedRef<DraggableOptions>;
+export declare function useResizableOptions(props: DialogProps, state: DialogState, emit: Emits<DialogEmits>): ComputedRef<ResizableOptions>;
+export declare function useComponentInstance(props: DialogProps, panelRef: MaybeRef<any>): {
+    componentInstance: Record<string, any>;
+} | undefined;

package/types/components/dialog/index.d.ts

@@ -0,0 +1,4 @@
+import XDialog from "./Dialog";
+export { XDialog };
+export * from './types';
+export * from './create';

package/types/components/dialog/types.d.ts

@@ -0,0 +1,124 @@
+import { RendererNode, RendererElement, PropType, VNode, DefineComponent, ComponentInternalInstance } from 'vue';
+import { Position } from '@vueuse/core';
+import { ComponentPropsType, BaseSize } from '../shared';
+import { IconParam } from '../';
+import { DraggableOptions, ResizableOptions, UseMouseInElementReturn } from '../../directives';
+export type DialogMode = 'normal' | 'maximized' | 'minimized';
+export declare const dialogProps: {
+    modelValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+    };
+    subtitle: {
+        type: StringConstructor;
+    };
+    icon: {
+        type: PropType<IconParam>;
+    };
+    size: {
+        type: PropType<BaseSize>;
+        default: string;
+    };
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
+    left: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    top: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    modal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    draggable: {
+        type: PropType<boolean | DraggableOptions>;
+        default: boolean;
+    };
+    resizable: {
+        type: PropType<boolean | ResizableOptions>;
+    };
+    closable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maximizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    minimizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    mode: {
+        type: PropType<DialogMode>;
+        default: string;
+    };
+    content: {
+        type: PropType<VNode<RendererNode, RendererElement, {
+            [key: string]: any;
+        }> | DefineComponent<any, any, any, any>>;
+    };
+    src: {
+        type: StringConstructor;
+    };
+    componentInstance: {
+        type: PropType<Record<string, any> | null>;
+    };
+    beforeClose: {
+        type: PropType<() => boolean | Promise<boolean>>;
+    };
+    submit: {
+        type: (BooleanConstructor | StringConstructor)[];
+    };
+    cancel: {
+        type: (BooleanConstructor | StringConstructor)[];
+    };
+    bodyPadding: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    primary: {
+        type: BooleanConstructor;
+    };
+};
+export type DialogProps = ComponentPropsType<typeof dialogProps>;
+export type DialogEmits = {
+    'update:modelValue': [value: boolean];
+    open: [instance: ComponentInternalInstance];
+    close: [];
+    destroy: [];
+    maximized: [];
+    minimized: [];
+    normal: [];
+    modeChange: [mode: DialogMode];
+    dragStart: [position: Position];
+    dragging: [position: Position];
+    dragEnd: [position: Position];
+    resizeStart: [dir: string, mie: UseMouseInElementReturn];
+    resizeEnd: [dir: string, mie: UseMouseInElementReturn];
+    resizing: [dir: string, mie: UseMouseInElementReturn];
+    submit: [];
+    cancel: [];
+};
+export interface DialogState {
+    mode: DialogMode;
+    wrapperWidth: number;
+    wrapperHeight: number;
+    width: number;
+    height: number;
+    left: number;
+    top: number;
+    zIndex: number;
+    dragging: boolean;
+    resizing: boolean;
+}

package/types/components/header/Header.d.ts

@@ -0,0 +1,61 @@
+import { IconParam } from '../';
+import { BaseSize } from '../shared';
+import { DefineComponent, PropType, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes } from 'vue';
+declare const _default: __VLS_WithTemplateSlots<DefineComponent<{
+    size: {
+        type: PropType<BaseSize>;
+        default: string;
+    };
+    content: {
+        type: StringConstructor;
+        default: string;
+    };
+    subtitle: {
+        type: StringConstructor;
+    };
+    icon: {
+        type: PropType<IconParam>;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    more: {
+        type: BooleanConstructor;
+    };
+}, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{
+    size: {
+        type: PropType<BaseSize>;
+        default: string;
+    };
+    content: {
+        type: StringConstructor;
+        default: string;
+    };
+    subtitle: {
+        type: StringConstructor;
+    };
+    icon: {
+        type: PropType<IconParam>;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    more: {
+        type: BooleanConstructor;
+    };
+}>>, {
+    size: BaseSize;
+    content: string;
+    border: boolean;
+    more: boolean;
+}, {}>, {
+    default?(_: {}): any;
+    subtitle?(_: {}): any;
+    actions?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/types/components/header/index.d.ts

@@ -0,0 +1,3 @@
+import XHeader from "./Header";
+export { XHeader };
+export * from './types';

package/types/components/header/types.d.ts

@@ -0,0 +1,29 @@
+import { PropType } from 'vue';
+import { IconParam } from '../icon';
+import { ComponentPropsType, BaseSize } from '../shared';
+export declare const headerProps: {
+    size: {
+        type: PropType<BaseSize>;
+        default: string;
+    };
+    content: {
+        type: StringConstructor;
+        default: string;
+    };
+    subtitle: {
+        type: StringConstructor;
+    };
+    icon: {
+        type: PropType<IconParam>;
+    };
+    border: {
+        type: BooleanConstructor;
+    };
+    more: {
+        type: BooleanConstructor;
+    };
+};
+export type HeaderProps = ComponentPropsType<typeof headerProps>;
+export type HeaderEmits = {
+    click: [];
+};

package/types/components/icon/Icon.d.ts

@@ -39,8 +39,8 @@ declare const _default: __VLS_WithTemplateSlots<DefineComponent<{
         type: BooleanConstructor;
     };
 }>>, {
-    size: IconSize;
     disabled: boolean;
+    size: IconSize;
 }, {}>, {
     default?(_: {}): any;
 }>;

package/types/components/index.d.ts

@@ -3,3 +3,10 @@ export * from './startup';
 export * from './icon';
 export * from './menu';
 export * from './simple-mask';
+export * from './action';
+export * from './action-bar';
+export * from './container';
+export * from './header';
+export * from './panel';
+export * from './dialog';
+export * from './mask';