cosey 0.7.5 → 0.7.7

package/components/form-dialog/form-dialog.d.ts

@@ -1,6 +1,16 @@
-import { type DialogEmits, type DialogInstance, type ButtonProps } from 'element-plus';
-import { type PropType, type EmitFn, type ExtractPropTypes } from 'vue';
-export declare const formDialogButtonProps: {
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    width: {
+        type: import("vue").PropType<import("./form-dialog.api").FormDialogWidth>;
+        default: string;
+    };
+    closeOnClickModal: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    closeOnPressEscape: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     confirmText: {
         type: StringConstructor;
         default: string;
@@ -10,10 +20,10 @@ export declare const formDialogButtonProps: {
         default: string;
     };
     confirmProps: {
-        type: PropType<ButtonProps>;
+        type: import("vue").PropType<import("element-plus").ButtonProps>;
     };
     cancelProps: {
-        type: PropType<ButtonProps>;
+        type: import("vue").PropType<import("element-plus").ButtonProps>;
     };
     hideConfirm: {
         type: BooleanConstructor;
@@ -21,19 +31,156 @@ export declare const formDialogButtonProps: {
     hideCancel: {
         type: BooleanConstructor;
     };
-};
-export type FormDialogPresetWidth = 'sm' | 'md' | 'lg' | 'xl';
-export declare const mapFormDialogWidth: {
-    sm: number;
-    md: number;
-    lg: number;
-    xl: number;
-};
-export type FormDialogButtonProps = ExtractPropTypes<typeof formDialogButtonProps>;
-export type FormDialogWidth = FormDialogPresetWidth | number | (string & {});
-export declare const formDialogProps: {
+    appendToBody: BooleanConstructor;
+    appendTo: {
+        readonly type: import("vue").PropType<string | HTMLElement>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "body";
+    };
+    beforeClose: {
+        readonly type: import("vue").PropType<import("element-plus").DialogBeforeCloseFn>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    destroyOnClose: BooleanConstructor;
+    lockScroll: {
+        readonly type: import("vue").PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    modal: {
+        readonly type: import("vue").PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    modalPenetrable: BooleanConstructor;
+    openDelay: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: 0;
+    };
+    closeDelay: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: 0;
+    };
+    top: {
+        readonly type: import("vue").PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    modelValue: BooleanConstructor;
+    modalClass: StringConstructor;
+    headerClass: StringConstructor;
+    bodyClass: StringConstructor;
+    footerClass: StringConstructor;
+    zIndex: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    trapFocus: BooleanConstructor;
+    headerAriaLevel: {
+        readonly type: import("vue").PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "2";
+    };
+    transition: {
+        readonly type: import("vue").PropType<import("element-plus").DialogTransition>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: undefined;
+    };
+    center: BooleanConstructor;
+    alignCenter: {
+        readonly type: import("vue").PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: undefined;
+    };
+    closeIcon: {
+        readonly type: import("vue").PropType<string | import("vue").Component>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    draggable: {
+        readonly type: import("vue").PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: undefined;
+    };
+    overflow: {
+        readonly type: import("vue").PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: undefined;
+    };
+    fullscreen: BooleanConstructor;
+    showClose: {
+        readonly type: import("vue").PropType<boolean>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: true;
+    };
+    title: {
+        readonly type: import("vue").PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "";
+    };
+    ariaLevel: {
+        readonly type: import("vue").PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    } & {
+        readonly default: "2";
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    open: () => boolean;
+    opened: () => boolean;
+    close: () => boolean;
+    closed: () => boolean;
+    "update:modelValue": (value: boolean) => boolean;
+    openAutoFocus: () => boolean;
+    closeAutoFocus: () => boolean;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     width: {
-        type: PropType<FormDialogWidth>;
+        type: import("vue").PropType<import("./form-dialog.api").FormDialogWidth>;
         default: string;
     };
     closeOnClickModal: {
@@ -53,10 +200,10 @@ export declare const formDialogProps: {
         default: string;
     };
     confirmProps: {
-        type: PropType<ButtonProps>;
+        type: import("vue").PropType<import("element-plus").ButtonProps>;
     };
     cancelProps: {
-        type: PropType<ButtonProps>;
+        type: import("vue").PropType<import("element-plus").ButtonProps>;
     };
     hideConfirm: {
         type: BooleanConstructor;
@@ -66,7 +213,7 @@ export declare const formDialogProps: {
     };
     appendToBody: BooleanConstructor;
     appendTo: {
-        readonly type: PropType<string | HTMLElement>;
+        readonly type: import("vue").PropType<string | HTMLElement>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -74,14 +221,14 @@ export declare const formDialogProps: {
         readonly default: "body";
     };
     beforeClose: {
-        readonly type: PropType<import("element-plus").DialogBeforeCloseFn>;
+        readonly type: import("vue").PropType<import("element-plus").DialogBeforeCloseFn>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     destroyOnClose: BooleanConstructor;
     lockScroll: {
-        readonly type: PropType<boolean>;
+        readonly type: import("vue").PropType<boolean>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -89,7 +236,7 @@ export declare const formDialogProps: {
         readonly default: true;
     };
     modal: {
-        readonly type: PropType<boolean>;
+        readonly type: import("vue").PropType<boolean>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -98,7 +245,7 @@ export declare const formDialogProps: {
     };
     modalPenetrable: BooleanConstructor;
     openDelay: {
-        readonly type: PropType<number>;
+        readonly type: import("vue").PropType<number>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -106,7 +253,7 @@ export declare const formDialogProps: {
         readonly default: 0;
     };
     closeDelay: {
-        readonly type: PropType<number>;
+        readonly type: import("vue").PropType<number>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -114,7 +261,7 @@ export declare const formDialogProps: {
         readonly default: 0;
     };
     top: {
-        readonly type: PropType<string>;
+        readonly type: import("vue").PropType<string>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -125,14 +272,14 @@ export declare const formDialogProps: {
     bodyClass: StringConstructor;
     footerClass: StringConstructor;
     zIndex: {
-        readonly type: PropType<number>;
+        readonly type: import("vue").PropType<number>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     trapFocus: BooleanConstructor;
     headerAriaLevel: {
-        readonly type: PropType<string>;
+        readonly type: import("vue").PropType<string>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -140,7 +287,7 @@ export declare const formDialogProps: {
         readonly default: "2";
     };
     transition: {
-        readonly type: PropType<import("element-plus").DialogTransition>;
+        readonly type: import("vue").PropType<import("element-plus").DialogTransition>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -149,7 +296,7 @@ export declare const formDialogProps: {
     };
     center: BooleanConstructor;
     alignCenter: {
-        readonly type: PropType<boolean>;
+        readonly type: import("vue").PropType<boolean>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -157,13 +304,13 @@ export declare const formDialogProps: {
         readonly default: undefined;
     };
     closeIcon: {
-        readonly type: PropType<string | import("vue").Component>;
+        readonly type: import("vue").PropType<string | import("vue").Component>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
     draggable: {
-        readonly type: PropType<boolean>;
+        readonly type: import("vue").PropType<boolean>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -171,7 +318,7 @@ export declare const formDialogProps: {
         readonly default: undefined;
     };
     overflow: {
-        readonly type: PropType<boolean>;
+        readonly type: import("vue").PropType<boolean>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -180,7 +327,7 @@ export declare const formDialogProps: {
     };
     fullscreen: BooleanConstructor;
     showClose: {
-        readonly type: PropType<boolean>;
+        readonly type: import("vue").PropType<boolean>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -188,7 +335,7 @@ export declare const formDialogProps: {
         readonly default: true;
     };
     title: {
-        readonly type: PropType<string>;
+        readonly type: import("vue").PropType<string>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
@@ -196,33 +343,48 @@ export declare const formDialogProps: {
         readonly default: "";
     };
     ariaLevel: {
-        readonly type: PropType<string>;
+        readonly type: import("vue").PropType<string>;
         readonly required: false;
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     } & {
         readonly default: "2";
     };
-};
-export type FormDialogProps = ExtractPropTypes<typeof formDialogProps>;
-export interface ElDialogSlots {
-    default?: (props: Record<string, never>) => any;
-    header?: (props: {
-        close?: () => void;
-        titleId?: string;
-        titleClass?: string;
-    }) => any;
-    footer?: (props: Record<string, never>) => any;
-}
-export interface FormDialogSlots extends ElDialogSlots {
-    button?: (props: {
-        submitting: boolean;
-        confirm: () => any | Promise<any>;
-        cancel: () => any;
-    }) => any;
-}
-export interface FormDialogEmits extends /* @vue-ignore */ EmitFn<DialogEmits> {
-}
-export interface FormDialogExpose extends DialogInstance {
-}
-export declare const elFormDialogExposeKeys: string[];
+}>> & Readonly<{
+    onOpen?: (() => any) | undefined;
+    onClose?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    onOpened?: (() => any) | undefined;
+    onClosed?: (() => any) | undefined;
+    onOpenAutoFocus?: (() => any) | undefined;
+    onCloseAutoFocus?: (() => any) | undefined;
+}>, {
+    width: import("./form-dialog.api").FormDialogWidth;
+    overflow: boolean;
+    transition: import("element-plus").DialogTransition;
+    center: boolean;
+    title: string;
+    closeOnPressEscape: boolean;
+    draggable: boolean;
+    appendToBody: boolean;
+    appendTo: string | HTMLElement;
+    modelValue: boolean;
+    showClose: boolean;
+    confirmText: string;
+    cancelText: string;
+    hideConfirm: boolean;
+    hideCancel: boolean;
+    closeOnClickModal: boolean;
+    destroyOnClose: boolean;
+    lockScroll: boolean;
+    modal: boolean;
+    modalPenetrable: boolean;
+    openDelay: number;
+    closeDelay: number;
+    trapFocus: boolean;
+    headerAriaLevel: string;
+    alignCenter: boolean;
+    fullscreen: boolean;
+    ariaLevel: string;
+}, import("vue").SlotsType<import("./form-dialog.api").FormDialogSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/components/form-dialog/form-dialog.js

@@ -1,49 +1,56 @@
-import { dialogProps } from 'element-plus';
+import { defineComponent, computed, createVNode, mergeProps, h } from 'vue';
+import { formDialogEmits, formDialogSlots, formDialogProps, elFormDialogExposeKeys } from './form-dialog.api.js';
+import '../form/index.js';
+import { useFormDialogWidth } from './useFormDialogWidth.js';
+import { ElDialog } from 'element-plus';
+import { useBubbleTemplate } from '../form/useBubbleTemplate.js';
 
-const formDialogButtonProps = {
-  confirmText: {
-    type: String,
-    default: "co.common.confirm"
-  },
-  cancelText: {
-    type: String,
-    default: "co.common.cancel"
-  },
-  confirmProps: {
-    type: Object
-  },
-  cancelProps: {
-    type: Object
-  },
-  hideConfirm: {
-    type: Boolean
-  },
-  hideCancel: {
-    type: Boolean
+var stdin_default = defineComponent({
+  name: "CoFormDialog",
+  props: formDialogProps,
+  slots: formDialogSlots,
+  emits: formDialogEmits,
+  setup(props, {
+    emit,
+    slots,
+    expose: _expose
+  }) {
+    const {
+      visible,
+      handleOpen,
+      handleClosed,
+      expose,
+      buttonTemplate,
+      elPopupRef
+    } = useBubbleTemplate({
+      props,
+      emit,
+      slots,
+      exposeKeys: elFormDialogExposeKeys
+    });
+    const width = useFormDialogWidth(computed(() => props.width));
+    _expose(expose);
+    return () => {
+      return createVNode(ElDialog, mergeProps({
+        "ref": elPopupRef
+      }, props, {
+        "modelValue": visible.value,
+        "onUpdate:modelValue": $event => visible.value = $event,
+        "style": {
+          maxWidth: props.fullscreen ? null : "calc(100vw - 32px)"
+        },
+        "width": width.value,
+        "append-to-body": true,
+        "onOpen": handleOpen,
+        "onClosed": handleClosed
+      }), {
+        ...slots,
+        footer: () => {
+          return slots.footer ? slots.footer({}) : h(buttonTemplate);
+        }
+      });
+    };
   }
-};
-const mapFormDialogWidth = {
-  sm: 420,
-  md: 640,
-  lg: 900,
-  xl: 1200
-};
-const formDialogProps = {
-  ...dialogProps,
-  ...formDialogButtonProps,
-  width: {
-    type: [String, Number],
-    default: "fit-content"
-  },
-  closeOnClickModal: {
-    type: Boolean,
-    default: false
-  },
-  closeOnPressEscape: {
-    type: Boolean,
-    default: false
-  }
-};
-const elFormDialogExposeKeys = ["resetPosition", "handleClose"];
+});
 
-export { elFormDialogExposeKeys, formDialogButtonProps, formDialogProps, mapFormDialogWidth };
+export { stdin_default as default };

package/components/form-dialog/index.d.ts

@@ -1,7 +1,7 @@
 import { type Plugin, Component } from 'vue';
 import { useFormDialogWidth } from './useFormDialogWidth';
-import { FormDialogProps } from './form-dialog';
-export * from './form-dialog';
+import { FormDialogProps } from './form-dialog.api';
+export * from './form-dialog.api';
 declare const _FormDialog: Component<FormDialogProps> & Plugin;
 export { _FormDialog as FormDialog, useFormDialogWidth };
 export default _FormDialog;

package/components/form-dialog/index.js

@@ -1,7 +1,7 @@
 import { withInstall } from '../utils.js';
-import stdin_default$1 from './form-dialog.vue.js';
+import stdin_default$1 from './form-dialog.js';
 export { useFormDialogWidth } from './useFormDialogWidth.js';
-export { elFormDialogExposeKeys, formDialogButtonProps, formDialogProps, mapFormDialogWidth } from './form-dialog.js';
+export { elFormDialogExposeKeys, formDialogButtonProps, formDialogEmits, formDialogProps, formDialogSlots, mapFormDialogWidth } from './form-dialog.api.js';
 
 const _FormDialog = withInstall(stdin_default$1);
 var stdin_default = _FormDialog;

package/components/form-dialog/useFormDialogWidth.d.ts

@@ -1,4 +1,4 @@
 import { Ref } from 'vue';
-import { type FormDialogWidth } from './form-dialog';
+import { type FormDialogWidth } from './form-dialog.api';
 export declare function getFormDialogWidth(outWidth?: FormDialogWidth): FormDialogWidth | undefined;
 export declare function useFormDialogWidth(width: Ref<FormDialogWidth | undefined>): import("vue").ComputedRef<FormDialogWidth | undefined>;

package/components/form-dialog/useFormDialogWidth.js

@@ -1,5 +1,5 @@
 import { computed } from 'vue';
-import { mapFormDialogWidth } from './form-dialog.js';
+import { mapFormDialogWidth } from './form-dialog.api.js';
 
 function getFormDialogWidth(outWidth) {
   return mapFormDialogWidth[outWidth] || outWidth;