@koi-design/uxd-ui 14.0.2 → 14.0.4

package/es/components/Mask/Mask.mjs

@@ -51,7 +51,7 @@ const maskProps = {
 var Mask = defineComponent({
   name: "UMask",
   props: maskProps,
-  emits: ["after-show-mask-change"],
+  emits: ["after-show-mask-change", "click"],
   setup(props, {
     slots,
     emit,
@@ -82,6 +82,9 @@ var Mask = defineComponent({
       const maskColor = props.color === "white" ? "255, 255, 255" : "0, 0, 0";
       return `rgba(${maskColor}, ${opacity})`;
     });
+    const handleClick = () => {
+      emit("click");
+    };
     const renderMask = lazyRender(() => {
       const style = {
         backgroundColor: maskBackground.value,
@@ -97,7 +100,8 @@ var Mask = defineComponent({
         "class": prefixCls.value,
         "onTouchmove": props.preventScroll ? handleTouchMove : () => {
         },
-        "onAnimationend": handleAnimationend
+        "onAnimationend": handleAnimationend,
+        "onClick": handleClick
       }, [useShouldRender(props.show, props.desdroyOnClose, animationEnd.value, slots.default)]), [[vShow, props.show]]);
     });
     return () => createVNode(Transition, {

package/es/components/Mask/Mask.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Mask.mjs","sources":["../../../../src/components/Mask/Mask.tsx"],"sourcesContent":["import { ref, computed, Transition, defineComponent } from 'vue';\nimport type { PropType, CSSProperties } from 'vue';\nimport { isValid, oneOf, getPropStyle, preventDefault } from '../../utils';\nimport { useGlobalConfig, useLazyRender, useShouldRender } from '../base/hooks';\nimport type { OpacityMap, MaskColor, MaskOpacity } from './Mask.type';\n\nexport const maskColors = ['black', 'white'] as const;\nexport const maskOpacity = ['lighter', 'default', 'darker'] as const;\nexport const opacityMap: OpacityMap = {\n  lighter: 0.35,\n  default: 0.55,\n  darker: 0.75\n};\n\nexport const maskProps = {\n  show: Boolean,\n  zIndex: [Number, String],\n  duration: [Number, String],\n  preventScroll: {\n    type: Boolean,\n    default: true\n  },\n  lazyRender: {\n    type: Boolean,\n    default: true\n  },\n  desdroyOnClose: {\n    type: Boolean,\n    default: true\n  },\n  customStyle: Object as PropType<CSSProperties>,\n  color: {\n    type: String as PropType<MaskColor>,\n    default: 'black',\n    validator: oneOf(maskColors)\n  },\n  opacity: {\n    type: [Number, String],\n    default: 'default',\n    validator: (value: any) => {\n      if (typeof value === 'string') {\n        return maskOpacity.includes(value as MaskOpacity);\n      }\n      return value >= 0 && value <= 1;\n    }\n  }\n};\n\nexport default defineComponent({\n  name: 'UMask',\n  props: maskProps,\n  emits: ['after-show-mask-change'],\n  setup(props, { slots, emit, expose }) {\n    const { prefixCls } = useGlobalConfig('mask');\n    const maskRef = ref<HTMLElement | null>(null);\n    const animationEnd = ref(false);\n    const lazyRender = useLazyRender(() => props.show || !props.lazyRender);\n    expose({ maskRef, animationEnd });\n\n    const handleTouchMove = (event: Event) => {\n      preventDefault(event, true);\n    };\n\n    const handleAnimationend = (event: AnimationEvent) => {\n      if (event.target === maskRef.value && event.animationName.match(/uuiFade$/)) {\n        animationEnd.value = !props.show;\n        emit('after-show-mask-change', props.show);\n      }\n    };\n\n    const maskBackground = computed(() => {\n      const opacity = opacityMap[props.opacity as keyof OpacityMap] ?? props.opacity;\n      const maskColor = props.color === 'white' ? '255, 255, 255' : '0, 0, 0';\n      return `rgba(${maskColor}, ${opacity})`;\n    });\n\n    const renderMask = lazyRender(() => {\n      const style: CSSProperties = {\n        backgroundColor: maskBackground.value,\n        ...getPropStyle('zIndex', props.zIndex),\n        ...props.customStyle\n      };\n\n      if (isValid(props.duration)) {\n        style.animationDuration = `${props.duration}s`;\n      }\n\n      return (\n        <div\n          ref={maskRef}\n          v-show={props.show}\n          style={style}\n          class={prefixCls.value}\n          onTouchmove={props.preventScroll ? handleTouchMove : () => {}}\n          onAnimationend={handleAnimationend}\n        >\n          {useShouldRender(props.show, props.desdroyOnClose, animationEnd.value, slots.default)}\n        </div>\n      );\n    });\n\n    return () => <Transition v-slots={{ default: renderMask }} name={`fade`} appear />;\n  }\n});\n"],"names":["maskColors","maskOpacity","opacityMap","lighter","default","darker","maskProps","show","Boolean","zIndex","Number","String","duration","preventScroll","type","lazyRender","desdroyOnClose","customStyle","Object","color","validator","oneOf","opacity","value","includes","defineComponent","name","props","emits","setup","slots","emit","expose","prefixCls","useGlobalConfig","maskRef","ref","animationEnd","useLazyRender","handleTouchMove","event","preventDefault","handleAnimationend","target","animationName","match","maskBackground","computed","maskColor","renderMask","style","backgroundColor","getPropStyle","isValid","animationDuration","_withDirectives","_createVNode","useShouldRender","_vShow","Transition"],"mappings":"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"}
+{"version":3,"file":"Mask.mjs","sources":["../../../../src/components/Mask/Mask.tsx"],"sourcesContent":["import { ref, computed, Transition, defineComponent } from 'vue';\nimport type { PropType, CSSProperties } from 'vue';\nimport { isValid, oneOf, getPropStyle, preventDefault } from '../../utils';\nimport { useGlobalConfig, useLazyRender, useShouldRender } from '../base/hooks';\nimport type { OpacityMap, MaskColor, MaskOpacity } from './Mask.type';\n\nexport const maskColors = ['black', 'white'] as const;\nexport const maskOpacity = ['lighter', 'default', 'darker'] as const;\nexport const opacityMap: OpacityMap = {\n  lighter: 0.35,\n  default: 0.55,\n  darker: 0.75\n};\n\nexport const maskProps = {\n  show: Boolean,\n  zIndex: [Number, String],\n  duration: [Number, String],\n  preventScroll: {\n    type: Boolean,\n    default: true\n  },\n  lazyRender: {\n    type: Boolean,\n    default: true\n  },\n  desdroyOnClose: {\n    type: Boolean,\n    default: true\n  },\n  customStyle: Object as PropType<CSSProperties>,\n  color: {\n    type: String as PropType<MaskColor>,\n    default: 'black',\n    validator: oneOf(maskColors)\n  },\n  opacity: {\n    type: [Number, String],\n    default: 'default',\n    validator: (value: any) => {\n      if (typeof value === 'string') {\n        return maskOpacity.includes(value as MaskOpacity);\n      }\n      return value >= 0 && value <= 1;\n    }\n  }\n};\n\nexport default defineComponent({\n  name: 'UMask',\n  props: maskProps,\n  emits: ['after-show-mask-change', 'click'],\n  setup(props, { slots, emit, expose }) {\n    const { prefixCls } = useGlobalConfig('mask');\n    const maskRef = ref<HTMLElement | null>(null);\n    const animationEnd = ref(false);\n    const lazyRender = useLazyRender(() => props.show || !props.lazyRender);\n    expose({ maskRef, animationEnd });\n\n    const handleTouchMove = (event: Event) => {\n      preventDefault(event, true);\n    };\n\n    const handleAnimationend = (event: AnimationEvent) => {\n      if (event.target === maskRef.value && event.animationName.match(/uuiFade$/)) {\n        animationEnd.value = !props.show;\n        emit('after-show-mask-change', props.show);\n      }\n    };\n\n    const maskBackground = computed(() => {\n      const opacity = opacityMap[props.opacity as keyof OpacityMap] ?? props.opacity;\n      const maskColor = props.color === 'white' ? '255, 255, 255' : '0, 0, 0';\n      return `rgba(${maskColor}, ${opacity})`;\n    });\n\n    const handleClick = () => {\n      emit('click');\n    };\n\n    const renderMask = lazyRender(() => {\n      const style: CSSProperties = {\n        backgroundColor: maskBackground.value,\n        ...getPropStyle('zIndex', props.zIndex),\n        ...props.customStyle\n      };\n\n      if (isValid(props.duration)) {\n        style.animationDuration = `${props.duration}s`;\n      }\n\n      return (\n        <div\n          ref={maskRef}\n          v-show={props.show}\n          style={style}\n          class={prefixCls.value}\n          onTouchmove={props.preventScroll ? handleTouchMove : () => {}}\n          onAnimationend={handleAnimationend}\n          onClick={handleClick}\n        >\n          {useShouldRender(props.show, props.desdroyOnClose, animationEnd.value, slots.default)}\n        </div>\n      );\n    });\n\n    return () => <Transition v-slots={{ default: renderMask }} name={`fade`} appear />;\n  }\n});\n"],"names":["maskColors","maskOpacity","opacityMap","lighter","default","darker","maskProps","show","Boolean","zIndex","Number","String","duration","preventScroll","type","lazyRender","desdroyOnClose","customStyle","Object","color","validator","oneOf","opacity","value","includes","defineComponent","name","props","emits","setup","slots","emit","expose","prefixCls","useGlobalConfig","maskRef","ref","animationEnd","useLazyRender","handleTouchMove","event","preventDefault","handleAnimationend","target","animationName","match","maskBackground","computed","maskColor","handleClick","renderMask","style","backgroundColor","getPropStyle","isValid","animationDuration","_withDirectives","_createVNode","useShouldRender","_vShow","Transition"],"mappings":"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"}

package/es/components/Mask/index.d.ts

@@ -28,8 +28,9 @@ export declare const UMask: {
             validator: (value: any) => boolean;
         };
     }>> & Readonly<{
+        onClick?: (...args: any[]) => any;
         "onAfter-show-mask-change"?: (...args: any[]) => any;
-    }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "after-show-mask-change"[], import("vue").PublicProps, {
+    }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "after-show-mask-change")[], import("vue").PublicProps, {
         color: import("./Mask.type").MaskColor;
         show: boolean;
         opacity: string | number;
@@ -71,6 +72,7 @@ export declare const UMask: {
             validator: (value: any) => boolean;
         };
     }>> & Readonly<{
+        onClick?: (...args: any[]) => any;
         "onAfter-show-mask-change"?: (...args: any[]) => any;
     }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, {
         color: import("./Mask.type").MaskColor;
@@ -111,8 +113,9 @@ export declare const UMask: {
         validator: (value: any) => boolean;
     };
 }>> & Readonly<{
+    onClick?: (...args: any[]) => any;
     "onAfter-show-mask-change"?: (...args: any[]) => any;
-}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "after-show-mask-change"[], "after-show-mask-change", {
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "after-show-mask-change")[], "click" | "after-show-mask-change", {
     color: import("./Mask.type").MaskColor;
     show: boolean;
     opacity: string | number;

package/es/components/Menu/MenuItem.vue.d.ts

@@ -95,8 +95,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
             color: {
-                type: import("vue").PropType<"primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint">;
-                default: "primary" | "blue" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                type: import("vue").PropType<"light" | "red">;
+                default: "light" | "red";
                 validator: (val: string) => boolean;
             };
         }>> & Readonly<{
@@ -108,41 +108,41 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             prefixCls: import("vue").ComputedRef<string>;
             arrowStyle: import("vue").ComputedRef<{
                 top: string;
+                right: string;
                 transform: string;
                 bottom?: undefined;
                 left?: undefined;
-                right?: undefined;
             } | {
                 bottom: string;
+                right: string;
                 transform: string;
                 top?: undefined;
                 left?: undefined;
-                right?: undefined;
             } | {
+                top: string;
                 left: string;
                 transform: string;
-                top?: undefined;
-                bottom?: undefined;
                 right?: undefined;
+                bottom?: undefined;
             } | {
-                right: string;
+                bottom: string;
+                left: string;
                 transform: string;
                 top?: undefined;
-                bottom?: undefined;
-                left?: undefined;
+                right?: undefined;
             } | {
                 top?: undefined;
+                right?: undefined;
                 transform?: undefined;
                 bottom?: undefined;
                 left?: undefined;
-                right?: undefined;
             }>;
             onVisibleChange: (val: boolean) => void;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
             'visible-change': (v: boolean) => boolean;
             'update:visible': (v: boolean) => boolean;
         }, import("vue").PublicProps, {
-            color: "primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+            color: "light" | "red";
             offset: number[];
             visible: boolean;
             placement: "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end";
@@ -396,8 +396,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
             color: {
-                type: import("vue").PropType<"primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint">;
-                default: "primary" | "blue" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                type: import("vue").PropType<"light" | "red">;
+                default: "light" | "red";
                 validator: (val: string) => boolean;
             };
         }>> & Readonly<{
@@ -409,38 +409,38 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             prefixCls: import("vue").ComputedRef<string>;
             arrowStyle: import("vue").ComputedRef<{
                 top: string;
+                right: string;
                 transform: string;
                 bottom?: undefined;
                 left?: undefined;
-                right?: undefined;
             } | {
                 bottom: string;
+                right: string;
                 transform: string;
                 top?: undefined;
                 left?: undefined;
-                right?: undefined;
             } | {
+                top: string;
                 left: string;
                 transform: string;
-                top?: undefined;
-                bottom?: undefined;
                 right?: undefined;
+                bottom?: undefined;
             } | {
-                right: string;
+                bottom: string;
+                left: string;
                 transform: string;
                 top?: undefined;
-                bottom?: undefined;
-                left?: undefined;
+                right?: undefined;
             } | {
                 top?: undefined;
+                right?: undefined;
                 transform?: undefined;
                 bottom?: undefined;
                 left?: undefined;
-                right?: undefined;
             }>;
             onVisibleChange: (val: boolean) => void;
         }, {}, {}, {}, {
-            color: "primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+            color: "light" | "red";
             offset: number[];
             visible: boolean;
             placement: "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end";
@@ -503,8 +503,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: boolean;
         };
         color: {
-            type: import("vue").PropType<"primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint">;
-            default: "primary" | "blue" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+            type: import("vue").PropType<"light" | "red">;
+            default: "light" | "red";
             validator: (val: string) => boolean;
         };
     }>> & Readonly<{
@@ -516,41 +516,41 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         prefixCls: import("vue").ComputedRef<string>;
         arrowStyle: import("vue").ComputedRef<{
             top: string;
+            right: string;
             transform: string;
             bottom?: undefined;
             left?: undefined;
-            right?: undefined;
         } | {
             bottom: string;
+            right: string;
             transform: string;
             top?: undefined;
             left?: undefined;
-            right?: undefined;
         } | {
+            top: string;
             left: string;
             transform: string;
-            top?: undefined;
-            bottom?: undefined;
             right?: undefined;
+            bottom?: undefined;
         } | {
-            right: string;
+            bottom: string;
+            left: string;
             transform: string;
             top?: undefined;
-            bottom?: undefined;
-            left?: undefined;
+            right?: undefined;
         } | {
             top?: undefined;
+            right?: undefined;
             transform?: undefined;
             bottom?: undefined;
             left?: undefined;
-            right?: undefined;
         }>;
         onVisibleChange: (val: boolean) => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
         'visible-change': (v: boolean) => boolean;
         'update:visible': (v: boolean) => boolean;
     }, string, {
-        color: "primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+        color: "light" | "red";
         offset: number[];
         visible: boolean;
         placement: "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end";

package/es/components/Menu/index.d.ts

@@ -344,8 +344,8 @@ export declare const UMenu: {
                     default: boolean;
                 };
                 color: {
-                    type: import("vue").PropType<"primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint">;
-                    default: "primary" | "blue" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                    type: import("vue").PropType<"light" | "red">;
+                    default: "light" | "red";
                     validator: (val: string) => boolean;
                 };
             }>> & Readonly<{
@@ -357,41 +357,41 @@ export declare const UMenu: {
                 prefixCls: import("vue").ComputedRef<string>;
                 arrowStyle: import("vue").ComputedRef<{
                     top: string;
+                    right: string;
                     transform: string;
                     bottom?: undefined;
                     left?: undefined;
-                    right?: undefined;
                 } | {
                     bottom: string;
+                    right: string;
                     transform: string;
                     top?: undefined;
                     left?: undefined;
-                    right?: undefined;
                 } | {
+                    top: string;
                     left: string;
                     transform: string;
-                    top?: undefined;
-                    bottom?: undefined;
                     right?: undefined;
+                    bottom?: undefined;
                 } | {
-                    right: string;
+                    bottom: string;
+                    left: string;
                     transform: string;
                     top?: undefined;
-                    bottom?: undefined;
-                    left?: undefined;
+                    right?: undefined;
                 } | {
                     top?: undefined;
+                    right?: undefined;
                     transform?: undefined;
                     bottom?: undefined;
                     left?: undefined;
-                    right?: undefined;
                 }>;
                 onVisibleChange: (val: boolean) => void;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
                 'visible-change': (v: boolean) => boolean;
                 'update:visible': (v: boolean) => boolean;
             }, import("vue").PublicProps, {
-                color: "primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                color: "light" | "red";
                 offset: number[];
                 visible: boolean;
                 placement: "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end";
@@ -645,8 +645,8 @@ export declare const UMenu: {
                     default: boolean;
                 };
                 color: {
-                    type: import("vue").PropType<"primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint">;
-                    default: "primary" | "blue" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                    type: import("vue").PropType<"light" | "red">;
+                    default: "light" | "red";
                     validator: (val: string) => boolean;
                 };
             }>> & Readonly<{
@@ -658,38 +658,38 @@ export declare const UMenu: {
                 prefixCls: import("vue").ComputedRef<string>;
                 arrowStyle: import("vue").ComputedRef<{
                     top: string;
+                    right: string;
                     transform: string;
                     bottom?: undefined;
                     left?: undefined;
-                    right?: undefined;
                 } | {
                     bottom: string;
+                    right: string;
                     transform: string;
                     top?: undefined;
                     left?: undefined;
-                    right?: undefined;
                 } | {
+                    top: string;
                     left: string;
                     transform: string;
-                    top?: undefined;
-                    bottom?: undefined;
                     right?: undefined;
+                    bottom?: undefined;
                 } | {
-                    right: string;
+                    bottom: string;
+                    left: string;
                     transform: string;
                     top?: undefined;
-                    bottom?: undefined;
-                    left?: undefined;
+                    right?: undefined;
                 } | {
                     top?: undefined;
+                    right?: undefined;
                     transform?: undefined;
                     bottom?: undefined;
                     left?: undefined;
-                    right?: undefined;
                 }>;
                 onVisibleChange: (val: boolean) => void;
             }, {}, {}, {}, {
-                color: "primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                color: "light" | "red";
                 offset: number[];
                 visible: boolean;
                 placement: "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end";
@@ -752,8 +752,8 @@ export declare const UMenu: {
                 default: boolean;
             };
             color: {
-                type: import("vue").PropType<"primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint">;
-                default: "primary" | "blue" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+                type: import("vue").PropType<"light" | "red">;
+                default: "light" | "red";
                 validator: (val: string) => boolean;
             };
         }>> & Readonly<{
@@ -765,41 +765,41 @@ export declare const UMenu: {
             prefixCls: import("vue").ComputedRef<string>;
             arrowStyle: import("vue").ComputedRef<{
                 top: string;
+                right: string;
                 transform: string;
                 bottom?: undefined;
                 left?: undefined;
-                right?: undefined;
             } | {
                 bottom: string;
+                right: string;
                 transform: string;
                 top?: undefined;
                 left?: undefined;
-                right?: undefined;
             } | {
+                top: string;
                 left: string;
                 transform: string;
-                top?: undefined;
-                bottom?: undefined;
                 right?: undefined;
+                bottom?: undefined;
             } | {
-                right: string;
+                bottom: string;
+                left: string;
                 transform: string;
                 top?: undefined;
-                bottom?: undefined;
-                left?: undefined;
+                right?: undefined;
             } | {
                 top?: undefined;
+                right?: undefined;
                 transform?: undefined;
                 bottom?: undefined;
                 left?: undefined;
-                right?: undefined;
             }>;
             onVisibleChange: (val: boolean) => void;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
             'visible-change': (v: boolean) => boolean;
             'update:visible': (v: boolean) => boolean;
         }, string, {
-            color: "primary" | "blue" | "light" | "red" | "orange" | "green" | "iris" | "cyan" | "yellow" | "amber" | "purple" | "lime" | "sky" | "violet" | "pink" | "mint";
+            color: "light" | "red";
             offset: number[];
             visible: boolean;
             placement: "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end";

package/es/components/Message/Message.mjs

@@ -34,7 +34,8 @@ const getMessageInstance = () => {
 const notice = (args) => {
   const {
     type,
-    content
+    content,
+    showIcon = true
   } = args;
   const duration = args.duration !== void 0 ? args.duration : defaultDuration;
   const iconType = iconTypes[type];
@@ -51,8 +52,8 @@ const notice = (args) => {
     background: args.background,
     content: () => createVNode("div", {
       "class": `${prefixCls}-custom-content ${prefixCls}-${type}`,
-      "data-color": type
-    }, [createVNode(UIcon, {
+      "data-type": type
+    }, [showIcon && createVNode(UIcon, {
       "spin": type === "loading"
     }, {
       default: () => [createVNode(iconType, null, null)]

package/es/components/Message/Message.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Message.mjs","sources":["../../../../src/components/Message/Message.tsx"],"sourcesContent":["import type { Component } from 'vue';\nimport Notification from '@uxd-ui/components/Notification';\nimport UIcon from '@uxd-ui/components/Icon';\nimport { Info, CheckCircle, AlertCircle, CircleX, LoaderCircle } from 'lucide-vue-next';\nimport type { NoticationPublicInstance } from '../Notification/Notication.type';\nimport type { MessageOption, MessageParams, MessageType } from './Message.type';\n\nlet prefixCls = 'uui-message';\nconst prefixKey = 'uui_message_key_';\nlet defaultDuration = 3;\nlet defaultTop = '24px';\nlet key = 0;\nlet messageInstance: NoticationPublicInstance | null;\nlet transitionName = 'move-up';\nlet maxCount: number;\n\nconst iconTypes: Record<MessageType, Component> = {\n  info: Info,\n  success: CheckCircle,\n  warning: AlertCircle,\n  error: CircleX,\n  loading: LoaderCircle\n};\n\nconst getMessageInstance = () => {\n  messageInstance =\n    messageInstance ||\n    (Notification.newInstance({\n      prefixCls,\n      transitionName,\n      style: { top: defaultTop },\n      maxCount,\n      type: 'message'\n    }) as NoticationPublicInstance);\n  return messageInstance;\n};\n\nconst notice = (args: MessageParams) => {\n  const { type, content } = args;\n  const duration = args.duration !== undefined ? args.duration : defaultDuration;\n  const iconType = iconTypes[type];\n  key += 1;\n  const target = args.key || `${prefixKey}${key}`;\n\n  const instance = getMessageInstance();\n  instance &&\n    instance.notice({\n      key: target,\n      duration,\n      style: {},\n      msgType: type,\n      closable: args.closable,\n      onClose: args.onClose,\n      background: args.background,\n      content: () => (\n        <div class={`${prefixCls}-custom-content ${prefixCls}-${type}`} data-color={type}>\n          <UIcon spin={type === 'loading'}>\n            <iconType />\n          </UIcon>\n          <span>{typeof content === 'function' ? content() : content}</span>\n        </div>\n      )\n    });\n\n  const result = () => {\n    if (messageInstance) {\n      messageInstance.remove(target);\n    }\n  };\n  return result;\n};\n\nconst api = {\n  config(options: MessageOption) {\n    if (options.top !== undefined) {\n      defaultTop = options.top;\n      messageInstance = null;\n    }\n    if (options.duration !== undefined) {\n      defaultDuration = options.duration;\n      messageInstance = null;\n    }\n    if (options.prefixCls !== undefined) {\n      prefixCls = options.prefixCls;\n    }\n    if (options.transitionName !== undefined) {\n      transitionName = options.transitionName;\n      messageInstance = null;\n    }\n    if (options.maxCount !== undefined) {\n      maxCount = options.maxCount;\n      messageInstance = null;\n    }\n  },\n  message(type: MessageType, options: string | Omit<MessageParams, 'type'>, duration?: number) {\n    let opt: MessageParams;\n    if (typeof options === 'string') {\n      opt = {\n        type,\n        content: options,\n        duration\n      };\n    } else {\n      opt = {\n        type,\n        ...options,\n        ...(duration ? { duration } : {})\n      };\n    }\n    return notice(opt);\n  },\n  close(closeKey: string) {\n    if (messageInstance) {\n      messageInstance.remove(closeKey);\n    }\n  },\n  destroy() {\n    if (messageInstance) {\n      messageInstance.destroy();\n      messageInstance = null;\n    }\n  }\n};\n\nexport type MessageFunction = (options: string | Omit<MessageParams, 'type'>, duration?: number) => () => void;\n\nexport interface Message {\n  config(options: MessageOption): void;\n  message(type: MessageType, options: string | Omit<MessageParams, 'type'>, duration?: number | undefined): () => void;\n  close(closeKey: string): void;\n  destroy(): void;\n  success: MessageFunction;\n  info: MessageFunction;\n  error: MessageFunction;\n  warning: MessageFunction;\n  loading: MessageFunction;\n}\n\n(['success', 'info', 'error', 'warning', 'loading'] as MessageType[]).forEach((type) => {\n  (api as Message)[type] = (options: string | Omit<MessageParams, 'type'>, duration?: number) => {\n    return api.message(type, options, duration);\n  };\n});\n\nexport default api as Message;\n"],"names":["prefixCls","prefixKey","defaultDuration","defaultTop","key","messageInstance","transitionName","maxCount","iconTypes","info","Info","success","CheckCircle","warning","AlertCircle","error","CircleX","loading","LoaderCircle","getMessageInstance","Notification","newInstance","style","top","type","notice","args","content","duration","undefined","iconType","target","instance","msgType","closable","onClose","background","_createVNode","UIcon","default","result","remove","api","config","options","message","opt","close","closeKey","destroy","forEach"],"mappings":"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"}
+{"version":3,"file":"Message.mjs","sources":["../../../../src/components/Message/Message.tsx"],"sourcesContent":["import type { Component } from 'vue';\nimport Notification from '@uxd-ui/components/Notification';\nimport UIcon from '@uxd-ui/components/Icon';\nimport { Info, CheckCircle, AlertCircle, CircleX, LoaderCircle } from 'lucide-vue-next';\nimport type { NoticationPublicInstance } from '../Notification/Notication.type';\nimport type { MessageOption, MessageParams, MessageType } from './Message.type';\n\nlet prefixCls = 'uui-message';\nconst prefixKey = 'uui_message_key_';\nlet defaultDuration = 3;\nlet defaultTop = '24px';\nlet key = 0;\nlet messageInstance: NoticationPublicInstance | null;\nlet transitionName = 'move-up';\nlet maxCount: number;\n\nconst iconTypes: Record<MessageType, Component> = {\n  info: Info,\n  success: CheckCircle,\n  warning: AlertCircle,\n  error: CircleX,\n  loading: LoaderCircle\n};\n\nconst getMessageInstance = () => {\n  messageInstance =\n    messageInstance ||\n    (Notification.newInstance({\n      prefixCls,\n      transitionName,\n      style: { top: defaultTop },\n      maxCount,\n      type: 'message'\n    }) as NoticationPublicInstance);\n  return messageInstance;\n};\n\nconst notice = (args: MessageParams) => {\n  const { type, content, showIcon = true } = args;\n  const duration = args.duration !== undefined ? args.duration : defaultDuration;\n  const iconType = iconTypes[type];\n  key += 1;\n  const target = args.key || `${prefixKey}${key}`;\n\n  const instance = getMessageInstance();\n  instance &&\n    instance.notice({\n      key: target,\n      duration,\n      style: {},\n      msgType: type,\n      closable: args.closable,\n      onClose: args.onClose,\n      background: args.background,\n      content: () => (\n        <div class={`${prefixCls}-custom-content ${prefixCls}-${type}`} data-type={type}>\n          {showIcon && (\n            <UIcon spin={type === 'loading'}>\n              <iconType />\n            </UIcon>\n          )}\n          <span>{typeof content === 'function' ? content() : content}</span>\n        </div>\n      )\n    });\n\n  const result = () => {\n    if (messageInstance) {\n      messageInstance.remove(target);\n    }\n  };\n  return result;\n};\n\nconst api = {\n  config(options: MessageOption) {\n    if (options.top !== undefined) {\n      defaultTop = options.top;\n      messageInstance = null;\n    }\n    if (options.duration !== undefined) {\n      defaultDuration = options.duration;\n      messageInstance = null;\n    }\n    if (options.prefixCls !== undefined) {\n      prefixCls = options.prefixCls;\n    }\n    if (options.transitionName !== undefined) {\n      transitionName = options.transitionName;\n      messageInstance = null;\n    }\n    if (options.maxCount !== undefined) {\n      maxCount = options.maxCount;\n      messageInstance = null;\n    }\n  },\n  message(type: MessageType, options: string | Omit<MessageParams, 'type'>, duration?: number) {\n    let opt: MessageParams;\n    if (typeof options === 'string') {\n      opt = {\n        type,\n        content: options,\n        duration\n      };\n    } else {\n      opt = {\n        type,\n        ...options,\n        ...(duration ? { duration } : {})\n      };\n    }\n    return notice(opt);\n  },\n  close(closeKey: string) {\n    if (messageInstance) {\n      messageInstance.remove(closeKey);\n    }\n  },\n  destroy() {\n    if (messageInstance) {\n      messageInstance.destroy();\n      messageInstance = null;\n    }\n  }\n};\n\nexport type MessageFunction = (options: string | Omit<MessageParams, 'type'>, duration?: number) => () => void;\n\nexport interface Message {\n  config(options: MessageOption): void;\n  message(type: MessageType, options: string | Omit<MessageParams, 'type'>, duration?: number | undefined): () => void;\n  close(closeKey: string): void;\n  destroy(): void;\n  success: MessageFunction;\n  info: MessageFunction;\n  error: MessageFunction;\n  warning: MessageFunction;\n  loading: MessageFunction;\n}\n\n(['success', 'info', 'error', 'warning', 'loading'] as MessageType[]).forEach((type) => {\n  (api as Message)[type] = (options: string | Omit<MessageParams, 'type'>, duration?: number) => {\n    return api.message(type, options, duration);\n  };\n});\n\nexport default api as Message;\n"],"names":["prefixCls","prefixKey","defaultDuration","defaultTop","key","messageInstance","transitionName","maxCount","iconTypes","info","Info","success","CheckCircle","warning","AlertCircle","error","CircleX","loading","LoaderCircle","getMessageInstance","Notification","newInstance","style","top","type","notice","args","content","showIcon","duration","undefined","iconType","target","instance","msgType","closable","onClose","background","_createVNode","UIcon","default","result","remove","api","config","options","message","opt","close","closeKey","destroy","forEach"],"mappings":"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"}

package/es/components/Message/Message.type.d.ts

@@ -12,6 +12,7 @@ export interface MessageParams {
     class?: string;
     closable?: boolean;
     background?: boolean;
+    showIcon?: boolean;
 }
 export interface MessageOption {
     top?: string;

package/es/components/Notice/Notice.mjs

@@ -7,9 +7,9 @@ import Notification from '../Notification/Notification.mjs';
 let prefixCls = "uui-notice";
 const prefixKey = "uui_notice_key_";
 let defaultDuration = 4.5;
-let defaultPlacement = "top-right";
-let defaultBottom = "24px";
-let defaultTop = "24px";
+let defaultPlacement = "bottom-right";
+let defaultBottom = "0px";
+let defaultTop = "0px";
 let key = 0;
 const noticeInstance = {};
 const transitionName = "move-notice";
@@ -84,7 +84,8 @@ const notice = (args) => {
     placement,
     top,
     bottom,
-    btn
+    action,
+    showIcon = true
   } = args;
   const duration = args.duration !== void 0 ? args.duration : defaultDuration;
   let iconType = propIconType || void 0;
@@ -98,15 +99,14 @@ const notice = (args) => {
     top,
     bottom
   });
-  const IconNode = iconType ? createVNode("span", {
-    "class": `${prefixCls}-icon ${prefixCls}-icon-${type}`,
-    "data-color": type || void 0
+  const IconNode = showIcon && iconType ? createVNode("span", {
+    "class": `${prefixCls}-icon ${prefixCls}-icon-${type}`
   }, [createVNode(UIcon, {
     "class": `${iconClass || ""}`
   }, {
     default: () => [createVNode(iconType, null, null)]
   })]) : null;
-  const withIconCls = iconType ? `${prefixCls}-with-icon ${prefixCls}-with-${type} ` : "";
+  const withIconCls = showIcon && iconType ? `${prefixCls}-with-icon ${prefixCls}-with-${type} ` : "";
   const withDescCls = desc ? `${prefixCls}-with-desc` : "";
   instance.notice({
     key: target,
@@ -116,14 +116,16 @@ const notice = (args) => {
     style: args.style || {},
     class: args.class,
     content: () => createVNode("div", {
-      "class": `${withIconCls} ${withDescCls}`
-    }, [IconNode, createVNode("div", {
+      "class": `${prefixCls}-wrapper ${withIconCls} ${withDescCls}`,
+      "data-type": type || void 0
+    }, [IconNode, createVNode("div", null, [createVNode("div", {
       "class": `${prefixCls}-title`
     }, [typeof title === "function" ? title() : title]), createVNode("div", {
       "class": `${prefixCls}-desc`
-    }, [typeof desc === "function" ? desc() : desc]), btn ? createVNode("span", {
-      "class": `${prefixCls}-btn`
-    }, [typeof btn === "function" ? btn() : btn]) : null])
+    }, [typeof desc === "function" ? desc() : desc])]), action ? createVNode("button", {
+      "class": `${prefixCls}-btn`,
+      "onClick": args.onAction
+    }, [action]) : null])
   });
   const result = () => {
     const cls = `${prefixCls}-${placement}`;