@koi-design/uxd-ui 14.0.3 → 14.0.4

package/uxd-ui.esm.mjs

@@ -1,4 +1,4 @@
-/*! @koi-design/uxd-ui@4.0.3 */
+/*! @koi-design/uxd-ui@4.0.4 */
 
 import { defineComponent, reactive, watch, provide, inject, computed, onMounted, ref, onBeforeUnmount, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot, withDirectives, vShow, createBlock, resolveDynamicComponent, createCommentVNode, toRaw, resolveComponent, Transition, withCtx, createVNode, toDisplayString, isVNode, Comment as Comment$1, Fragment, Text as Text$1, h, shallowRef, toRef, nextTick, onUpdated, onUnmounted, cloneVNode, Teleport, toRefs, withModifiers, mergeProps, renderList, onBeforeUpdate, createTextVNode, createStaticVNode, watchEffect, onActivated, onDeactivated, normalizeProps, guardReactiveProps, withKeys, TransitionGroup, createApp, onBeforeMount, unref } from 'vue';
 import { X, Terminal, CircleAlert, Info, CircleCheck, LoaderCircle, CircleX, Search, Eye, EyeOff, Check, CornerDownLeft, ChevronUp, ChevronDown, ChevronRight, MenuIcon, Minus, ChevronLeft, CheckCircle, ChevronsLeft, ChevronsRight, Calendar as Calendar$1, ZoomIn, ZoomOut, RotateCcw, RotateCw, PanelLeft, Image as Image$2, XCircle, Star as Star$1, CheckIcon, XIcon, FilterIcon, GripVertical, Plus, Clock, FileIcon, HelpCircle, CircleHelp, AlertCircle, SearchIcon } from 'lucide-vue-next';
@@ -10950,13 +10950,11 @@ const _sfc_main$23 = defineComponent({
       if (props.status) {
         switch (props.status) {
           case "success":
-            return "green";
-          case "processing":
-            return "blue";
           case "error":
-            return "red";
           case "warning":
-            return "orange";
+            return props.status;
+          case "processing":
+            return "primary";
           default:
             return void 0;
         }
@@ -24999,7 +24997,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,
@@ -25030,6 +25028,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,
@@ -25045,7 +25046,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, {
@@ -25089,6 +25091,10 @@ const drawerProps = {
     type: String,
     default: ""
   },
+  description: {
+    type: String,
+    default: ""
+  },
   closable: {
     type: Boolean,
     default: true
@@ -25356,20 +25362,22 @@ var Drawer = defineComponent({
     const renderDrawer = lazyRender(() => {
       const renderConrent = () => {
         var _a;
-        return createVNode(Fragment, null, [createVNode("div", {
-          "ref": headerRef,
-          "class": `${prefixCls.value}-header`,
-          "style": props.headerStyle
-        }, [createVNode("h2", {
-          "class": `${prefixCls.value}-header-title`
-        }, [slots.title ? slots.title() : props.title]), props.closable && createVNode("button", {
+        return createVNode(Fragment, null, [props.closable && createVNode("button", {
           "class": `${prefixCls.value}-close`,
           "onClick": () => handleClose("close")
         }, [createVNode(UIcon, {
           "class": `${prefixCls.value}-close-icon`
         }, {
           default: () => [createVNode(X, null, null)]
-        })])]), createVNode("div", {
+        })]), createVNode("div", {
+          "ref": headerRef,
+          "class": `${prefixCls.value}-header`,
+          "style": props.headerStyle
+        }, [createVNode("h2", {
+          "class": `${prefixCls.value}-header-title`
+        }, [slots.title ? slots.title() : props.title]), props.description && createVNode("p", {
+          "class": `${prefixCls.value}-header-description`
+        }, [props.description])]), createVNode("div", {
           "class": `${prefixCls.value}-body`,
           "style": {
             ...props.bodyStyle,
@@ -30883,15 +30891,6 @@ const sliderProps = {
     type: String,
     default: "surface"
   },
-  color: {
-    type: String,
-    default: void 0,
-    validator: oneOf(colorType)
-  },
-  size: {
-    type: String,
-    default: "default"
-  },
   direction: {
     type: String
   }
@@ -31309,13 +31308,12 @@ var Slider = defineComponent({
     })]);
     return createVNode("div", {
       "ref": "sliderRef",
-      "class": [this.prefixCls, `${this.prefixCls}-variant-${this.variant}`, `${this.prefixCls}-size-${this.size}`, {
+      "class": [this.prefixCls, `${this.prefixCls}-variant-${this.variant}`, {
         [`${this.prefixCls}-with-marks`]: this.marks && Object.keys(this.marks).length,
         [`${this.prefixCls}-disabled`]: this.disabled,
         [`${this.prefixCls}-vertical`]: this.vertical,
         [`${this.prefixCls}-rtl`]: this.direction === "rtl" && !this.vertical
       }],
-      "data-color": this.color,
       "onMousedown": this.handleMouseDown,
       "onMouseup": this.handleMouseUp
     }, [createVNode("div", {
@@ -36603,10 +36601,6 @@ const tagProps = {
     type: String,
     default: "surface"
   },
-  size: {
-    type: String,
-    default: "default"
-  },
   round: {
     type: Boolean,
     default: false
@@ -36700,25 +36694,23 @@ const _sfc_main$q = defineComponent({
         }
         if (props.variant === "outline") {
           return {
-            borderColor: void 0,
-            color: props.color,
-            boxShadow: `0 0 0 1px ${props.color} inset`
+            border: `1px solid ${props.color}`,
+            color: props.color
           };
         }
         if (props.variant === "solid") {
           return {
-            backgroundColor: props.color
+            backgroundColor: props.color,
+            color: "white"
           };
         }
         return {
           backgroundColor: hexToRgba(props.color, 0.1),
           color: props.color,
-          boxShadow: `0 0 0 1px ${props.color} inset`
+          border: `1px solid ${props.color}`
         };
       }
-      return {
-        backgroundColor: void 0
-      };
+      return {};
     });
     const showIcon = computed(() => {
       return !!slots.icon || !!props.icon;
@@ -36745,7 +36737,6 @@ function _sfc_render$o(_ctx, _cache, $props, $setup, $data, $options) {
     class: normalizeClass([
       `${_ctx.prefixCls}`,
       `${_ctx.prefixCls}-variant-${_ctx.variant}`,
-      `${_ctx.prefixCls}-${_ctx.size}`,
       {
         [`${_ctx.prefixCls}-has-color ${_ctx.prefixCls}-has-color-${_ctx.variant}`]: _ctx.color && !_ctx.isPresetColor && !_ctx.isStatusType,
         [`${_ctx.prefixCls}-has-icon`]: _ctx.showIcon,

package/uxd-ui.umd.js

@@ -1,4 +1,4 @@
-/*! @koi-design/uxd-ui@4.0.3 */
+/*! @koi-design/uxd-ui@4.0.4 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('lucide-vue-next')) :
@@ -10953,13 +10953,11 @@
         if (props.status) {
           switch (props.status) {
             case "success":
-              return "green";
-            case "processing":
-              return "blue";
             case "error":
-              return "red";
             case "warning":
-              return "orange";
+              return props.status;
+            case "processing":
+              return "primary";
             default:
               return void 0;
           }
@@ -25002,7 +25000,7 @@
   var Mask = vue.defineComponent({
     name: "UMask",
     props: maskProps,
-    emits: ["after-show-mask-change"],
+    emits: ["after-show-mask-change", "click"],
     setup(props, {
       slots,
       emit,
@@ -25033,6 +25031,9 @@
         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,
@@ -25048,7 +25049,8 @@
           "class": prefixCls.value,
           "onTouchmove": props.preventScroll ? handleTouchMove : () => {
           },
-          "onAnimationend": handleAnimationend
+          "onAnimationend": handleAnimationend,
+          "onClick": handleClick
         }, [useShouldRender(props.show, props.desdroyOnClose, animationEnd.value, slots.default)]), [[vue.vShow, props.show]]);
       });
       return () => vue.createVNode(vue.Transition, {
@@ -25092,6 +25094,10 @@
       type: String,
       default: ""
     },
+    description: {
+      type: String,
+      default: ""
+    },
     closable: {
       type: Boolean,
       default: true
@@ -25359,20 +25365,22 @@
       const renderDrawer = lazyRender(() => {
         const renderConrent = () => {
           var _a;
-          return vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
-            "ref": headerRef,
-            "class": `${prefixCls.value}-header`,
-            "style": props.headerStyle
-          }, [vue.createVNode("h2", {
-            "class": `${prefixCls.value}-header-title`
-          }, [slots.title ? slots.title() : props.title]), props.closable && vue.createVNode("button", {
+          return vue.createVNode(vue.Fragment, null, [props.closable && vue.createVNode("button", {
             "class": `${prefixCls.value}-close`,
             "onClick": () => handleClose("close")
           }, [vue.createVNode(UIcon, {
             "class": `${prefixCls.value}-close-icon`
           }, {
             default: () => [vue.createVNode(lucideVueNext.X, null, null)]
-          })])]), vue.createVNode("div", {
+          })]), vue.createVNode("div", {
+            "ref": headerRef,
+            "class": `${prefixCls.value}-header`,
+            "style": props.headerStyle
+          }, [vue.createVNode("h2", {
+            "class": `${prefixCls.value}-header-title`
+          }, [slots.title ? slots.title() : props.title]), props.description && vue.createVNode("p", {
+            "class": `${prefixCls.value}-header-description`
+          }, [props.description])]), vue.createVNode("div", {
             "class": `${prefixCls.value}-body`,
             "style": {
               ...props.bodyStyle,
@@ -30886,15 +30894,6 @@
       type: String,
       default: "surface"
     },
-    color: {
-      type: String,
-      default: void 0,
-      validator: oneOf(colorType)
-    },
-    size: {
-      type: String,
-      default: "default"
-    },
     direction: {
       type: String
     }
@@ -31312,13 +31311,12 @@
       })]);
       return vue.createVNode("div", {
         "ref": "sliderRef",
-        "class": [this.prefixCls, `${this.prefixCls}-variant-${this.variant}`, `${this.prefixCls}-size-${this.size}`, {
+        "class": [this.prefixCls, `${this.prefixCls}-variant-${this.variant}`, {
           [`${this.prefixCls}-with-marks`]: this.marks && Object.keys(this.marks).length,
           [`${this.prefixCls}-disabled`]: this.disabled,
           [`${this.prefixCls}-vertical`]: this.vertical,
           [`${this.prefixCls}-rtl`]: this.direction === "rtl" && !this.vertical
         }],
-        "data-color": this.color,
         "onMousedown": this.handleMouseDown,
         "onMouseup": this.handleMouseUp
       }, [vue.createVNode("div", {
@@ -36606,10 +36604,6 @@
       type: String,
       default: "surface"
     },
-    size: {
-      type: String,
-      default: "default"
-    },
     round: {
       type: Boolean,
       default: false
@@ -36703,25 +36697,23 @@
           }
           if (props.variant === "outline") {
             return {
-              borderColor: void 0,
-              color: props.color,
-              boxShadow: `0 0 0 1px ${props.color} inset`
+              border: `1px solid ${props.color}`,
+              color: props.color
             };
           }
           if (props.variant === "solid") {
             return {
-              backgroundColor: props.color
+              backgroundColor: props.color,
+              color: "white"
             };
           }
           return {
             backgroundColor: hexToRgba(props.color, 0.1),
             color: props.color,
-            boxShadow: `0 0 0 1px ${props.color} inset`
+            border: `1px solid ${props.color}`
           };
         }
-        return {
-          backgroundColor: void 0
-        };
+        return {};
       });
       const showIcon = vue.computed(() => {
         return !!slots.icon || !!props.icon;
@@ -36748,7 +36740,6 @@
       class: vue.normalizeClass([
         `${_ctx.prefixCls}`,
         `${_ctx.prefixCls}-variant-${_ctx.variant}`,
-        `${_ctx.prefixCls}-${_ctx.size}`,
         {
           [`${_ctx.prefixCls}-has-color ${_ctx.prefixCls}-has-color-${_ctx.variant}`]: _ctx.color && !_ctx.isPresetColor && !_ctx.isStatusType,
           [`${_ctx.prefixCls}-has-icon`]: _ctx.showIcon,