vue-devui 1.0.0-rc.4 → 1.0.0-rc.7

package/input-number/index.es.js

@@ -0,0 +1,251 @@
+import { defineComponent, toRefs, createVNode, ref, computed } from "vue";
+const inputNumberProps = {
+  placeholder: {
+    type: String,
+    default: void 0
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  step: {
+    type: Number,
+    default: 0
+  },
+  max: {
+    type: Number,
+    default: Infinity
+  },
+  min: {
+    type: Number,
+    default: -Infinity
+  },
+  size: {
+    type: String,
+    default: ""
+  },
+  modelValue: {
+    type: Number,
+    default: 0
+  },
+  "onUpdate:modelValue": {
+    type: Function,
+    default: void 0
+  },
+  "onChange": {
+    type: Function,
+    default: void 0
+  },
+  "onKeydown": {
+    type: Function,
+    default: void 0
+  },
+  "onFocus": {
+    type: Function,
+    default: void 0
+  },
+  "onBlur": {
+    type: Function,
+    default: void 0
+  }
+};
+var inputNumber = "";
+const iconProps = {
+  name: {
+    type: String,
+    default: "",
+    required: true
+  },
+  size: {
+    type: String,
+    default: "inherit"
+  },
+  color: {
+    type: String,
+    default: "inherit"
+  },
+  classPrefix: {
+    type: String,
+    default: "icon"
+  }
+};
+var Icon = defineComponent({
+  name: "DIcon",
+  props: iconProps,
+  setup(props) {
+    const {
+      name,
+      size,
+      color,
+      classPrefix
+    } = toRefs(props);
+    return () => {
+      return /^((https?):)?\/\//.test(name.value) ? createVNode("img", {
+        "src": name.value,
+        "alt": name.value.split("/")[name.value.split("/").length - 1],
+        "style": {
+          width: size.value,
+          verticalAlign: "text-bottom"
+        }
+      }, null) : createVNode("i", {
+        "class": `${classPrefix.value} ${classPrefix.value}-${name.value}`,
+        "style": {
+          fontSize: size.value,
+          color: color.value
+        }
+      }, null);
+    };
+  }
+});
+var InputNumber = defineComponent({
+  name: "DInputNumber",
+  props: inputNumberProps,
+  emits: ["update:modelValue", "change", "input", "focus", "blur", "keydown"],
+  setup(props, ctx) {
+    const inputVal = ref(props.modelValue < props.min ? props.min : props.modelValue);
+    const focusVal = ref("");
+    const isSize = computed(() => {
+      return `devui-input-number-${props.size}`;
+    });
+    const isDisabled = computed(() => {
+      return props.disabled;
+    });
+    const add = () => {
+      if (props.disabled) {
+        return;
+      }
+      if (inputVal.value >= props.max) {
+        return;
+      }
+      if (props.step !== 0) {
+        const maxSpaceVal = props.max - inputVal.value;
+        if (inputVal.value < props.max && maxSpaceVal < props.step) {
+          inputVal.value += maxSpaceVal;
+        } else if (inputVal.value < props.max && maxSpaceVal > props.step) {
+          inputVal.value += props.step;
+        } else {
+          inputVal.value += props.step;
+        }
+      } else {
+        inputVal.value += 1;
+      }
+      focusVal.value = "active";
+      ctx.emit("change", inputVal.value);
+      ctx.emit("update:modelValue", inputVal.value);
+    };
+    const subtract = () => {
+      if (props.disabled) {
+        return;
+      }
+      if (inputVal.value <= props.min) {
+        return;
+      }
+      if (props.step !== 0) {
+        const minSpaceVal = inputVal.value - props.min;
+        if (inputVal.value > props.min && minSpaceVal > props.step) {
+          inputVal.value -= props.step;
+        } else if (inputVal.value > props.min && minSpaceVal < props.step) {
+          inputVal.value -= minSpaceVal;
+        } else {
+          inputVal.value -= props.step;
+        }
+      } else {
+        inputVal.value -= 1;
+      }
+      focusVal.value = "active";
+      ctx.emit("change", inputVal.value);
+      ctx.emit("update:modelValue", inputVal.value);
+    };
+    const onInput = (val) => {
+      inputVal.value = parseInt(val.data);
+      ctx.emit("input", inputVal.value);
+      ctx.emit("update:modelValue", inputVal.value);
+    };
+    const onFocus = ($event) => {
+      focusVal.value = "active";
+      ctx.emit("focus", $event);
+    };
+    const onBlur = ($event) => {
+      focusVal.value = "";
+      ctx.emit("blur", $event);
+    };
+    const onChange = ($event) => {
+      ctx.emit("change", $event.target.value);
+    };
+    const onKeydown = ($event) => {
+      ctx.emit("keydown", $event);
+    };
+    return {
+      inputVal,
+      focusVal,
+      isDisabled,
+      isSize,
+      add,
+      subtract,
+      onInput,
+      onChange,
+      onKeydown,
+      onBlur,
+      onFocus
+    };
+  },
+  render() {
+    const {
+      focusVal,
+      placeholder,
+      add,
+      inputVal,
+      isDisabled,
+      isSize,
+      subtract,
+      onInput,
+      onChange,
+      onKeydown,
+      onBlur,
+      onFocus
+    } = this;
+    const dInputNum = ["devui-input-number", isDisabled ? "devui-input-disabled" : "", isSize];
+    return createVNode("div", {
+      "class": dInputNum
+    }, [createVNode("div", {
+      "onBlur": onBlur,
+      "tabindex": "1",
+      "class": ["devui-control-buttons", focusVal.value]
+    }, [createVNode("span", {
+      "onClick": add
+    }, [createVNode(Icon, {
+      "size": "12px",
+      "name": "chevron-up"
+    }, null)]), createVNode("span", {
+      "onClick": subtract
+    }, [createVNode(Icon, {
+      "size": "12px",
+      "name": "chevron-down"
+    }, null)])]), createVNode("div", {
+      "class": "devui-input-item"
+    }, [createVNode("input", {
+      "type": "number",
+      "value": inputVal,
+      "placeholder": placeholder,
+      "disabled": isDisabled,
+      "class": ["devui-input-style devui-input-box", focusVal.value],
+      "onInput": onInput,
+      "onChange": onChange,
+      "onFocus": onFocus,
+      "onBlur": onBlur,
+      "onKeydown": onKeydown
+    }, null)])]);
+  }
+});
+InputNumber.install = function(app) {
+  app.component(InputNumber.name, InputNumber);
+};
+var index = {
+  title: "InputNumber \u6570\u5B57\u8F93\u5165\u6846",
+  category: "\u6570\u636E\u5F55\u5165",
+  status: "50%",
+  install(app) {
+    app.use(InputNumber);
+  }
+};
+export { InputNumber, index as default };

package/input-number/index.umd.js

@@ -0,0 +1 @@
+(function(l,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(l=typeof globalThis!="undefined"?globalThis:l||self,n(l.index={},l.Vue))})(this,function(l,n){"use strict";const V={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},step:{type:Number,default:0},max:{type:Number,default:1/0},min:{type:Number,default:-1/0},size:{type:String,default:""},modelValue:{type:Number,default:0},"onUpdate:modelValue":{type:Function,default:void 0},onChange:{type:Function,default:void 0},onKeydown:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onBlur:{type:Function,default:void 0}};var N="";const h={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var r=n.defineComponent({name:"DIcon",props:h,setup(e){const{name:u,size:t,color:i,classPrefix:o}=n.toRefs(e);return()=>/^((https?):)?\/\//.test(u.value)?n.createVNode("img",{src:u.value,alt:u.value.split("/")[u.value.split("/").length-1],style:{width:t.value,verticalAlign:"text-bottom"}},null):n.createVNode("i",{class:`${o.value} ${o.value}-${u.value}`,style:{fontSize:t.value,color:i.value}},null)}}),d=n.defineComponent({name:"DInputNumber",props:V,emits:["update:modelValue","change","input","focus","blur","keydown"],setup(e,u){const t=n.ref(e.modelValue<e.min?e.min:e.modelValue),i=n.ref(""),o=n.computed(()=>`devui-input-number-${e.size}`),s=n.computed(()=>e.disabled);return{inputVal:t,focusVal:i,isDisabled:s,isSize:o,add:()=>{if(!e.disabled&&!(t.value>=e.max)){if(e.step!==0){const a=e.max-t.value;t.value<e.max&&a<e.step?t.value+=a:(t.value<e.max&&a>e.step,t.value+=e.step)}else t.value+=1;i.value="active",u.emit("change",t.value),u.emit("update:modelValue",t.value)}},subtract:()=>{if(!e.disabled&&!(t.value<=e.min)){if(e.step!==0){const a=t.value-e.min;t.value>e.min&&a>e.step?t.value-=e.step:t.value>e.min&&a<e.step?t.value-=a:t.value-=e.step}else t.value-=1;i.value="active",u.emit("change",t.value),u.emit("update:modelValue",t.value)}},onInput:a=>{t.value=parseInt(a.data),u.emit("input",t.value),u.emit("update:modelValue",t.value)},onChange:a=>{u.emit("change",a.target.value)},onKeydown:a=>{u.emit("keydown",a)},onBlur:a=>{i.value="",u.emit("blur",a)},onFocus:a=>{i.value="active",u.emit("focus",a)}}},render(){const{focusVal:e,placeholder:u,add:t,inputVal:i,isDisabled:o,isSize:s,subtract:m,onInput:f,onChange:v,onKeydown:p,onBlur:c,onFocus:y}=this,b=["devui-input-number",o?"devui-input-disabled":"",s];return n.createVNode("div",{class:b},[n.createVNode("div",{onBlur:c,tabindex:"1",class:["devui-control-buttons",e.value]},[n.createVNode("span",{onClick:t},[n.createVNode(r,{size:"12px",name:"chevron-up"},null)]),n.createVNode("span",{onClick:m},[n.createVNode(r,{size:"12px",name:"chevron-down"},null)])]),n.createVNode("div",{class:"devui-input-item"},[n.createVNode("input",{type:"number",value:i,placeholder:u,disabled:o,class:["devui-input-style devui-input-box",e.value],onInput:f,onChange:v,onFocus:y,onBlur:c,onKeydown:p},null)])])}});d.install=function(e){e.component(d.name,d)};var g={title:"InputNumber \u6570\u5B57\u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"50%",install(e){e.use(d)}};l.InputNumber=d,l.default=g,Object.defineProperty(l,"__esModule",{value:!0}),l[Symbol.toStringTag]="Module"});

package/input-number/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "input-number",
+  "version": "0.0.0",
+  "main": "index.umd.js",
+  "module": "index.es.js",
+  "style": "style.css"
+}

package/input-number/style.css

@@ -0,0 +1 @@
+.devui-input-number{position:relative;display:inline-block;width:80px;line-height:38px;margin-right:12px}.devui-input-number:hover:not(.devui-input-disabled) .devui-input-box{border-color:var(--devui-form-control-line-hover)}.devui-input-number:hover:not(.devui-input-disabled) .devui-control-buttons:not(.disabled){display:flex;border-color:var(--devui-form-control-line-hover)}.devui-input-number:focus-within .devui-control-buttons{display:flex}.devui-input-number .active{border:1px solid var(--devui-form-control-line-active)!important;display:flex!important}.devui-input-number.devui-input-disabled .devui-subtract,.devui-input-number.devui-input-disabled .devui-add,.devui-input-number.devui-input-disabled .devui-input-style{cursor:not-allowed;border-color:#e4e7ed;color:#e4e7ed}.devui-input-number.devui-input-disabled .devui-input-style{border-color:var(--devui-disabled-line)!important;color:var(--devui-disabled-text)!important;background-color:var(--devui-disabled-bg)!important}.devui-input-number.devui-input-number-sm{width:60px}.devui-input-number.devui-input-number-sm .devui-input-box{height:26px;line-height:26px}.devui-input-number.devui-input-number-md{width:80px}.devui-input-number.devui-input-number-md .devui-input-box{height:32px;line-height:32px}.devui-input-number.devui-input-number-lg{width:100px}.devui-input-number.devui-input-number-lg .devui-input-box{height:38px;line-height:38px}.devui-input-number .devui-input-item{line-height:100%}.devui-input-number .devui-input-style::-webkit-outer-spin-button,.devui-input-number .devui-input-style::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.devui-input-number .devui-add,.devui-input-number .devui-subtract{display:inline-block;width:50px;height:38px;line-height:38px;text-align:center;font-size:16px;color:#333;background:#f5f7fa;cursor:pointer;border:1px solid #dcdfe6}.devui-input-number .devui-add{float:right;margin-left:-1px;border-radius:0 4px 4px 0}.devui-input-number .devui-subtract{float:left;margin-right:-1px;border-radius:4px 0 0 4px}.devui-input-number .devui-input-style{display:block;-moz-appearance:textfield}.devui-input-number .devui-input-style{outline:none;background-color:var(--devui-base-bg);border:1px solid var(--devui-form-control-line);border-radius:var(--devui-border-radius);padding:4px 8px;line-height:18px;font-size:var(--devui-font-size);color:var(--devui-text);width:100%;display:block;cursor:text;height:28px;transition:border-color .3s var(--devui-animation-ease-in-out-smooth)}.devui-input-number .devui-input-box{box-sizing:border-box;padding:4px 8px;font-size:var(--devui-font-size);vertical-align:middle;border-radius:var(--devui-border-radius);outline:none;width:100%;line-height:20px;height:28px;border-width:1px;border-style:solid}.devui-input-number .devui-input-box:not(.disabled){background-color:var(--devui-base-bg);border-color:var(--devui-line);color:var(--devui-text)}.devui-input-number .disabled{cursor:not-allowed}.devui-input-number .devui-control-buttons{display:none;position:absolute;right:0;width:22px;height:100%;flex-direction:column;justify-content:center;align-items:center;border-left:1px solid var(--devui-line);box-sizing:border-box;line-height:100%;border-radius:0 var(--devui-border-radius) var(--devui-border-radius) 0}.devui-input-number .devui-control-buttons:not(.disabled){cursor:pointer}.devui-input-number .devui-control-buttons>span{display:flex}

package/loading/style.css

@@ -1 +1 @@
-@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(135deg) scale(1.5)}to{transform:rotate(270deg) scale(1)}}.devui-loading-mask{position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #adb0b8);opacity:.3}.devui-loading-wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:9999}.devui-loading--hidden{overflow:hidden}.devui-loading-text{margin-left:10px}.devui-loading-area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-busy-default-spinner .devui-loading-bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-busy-default-spinner .devui-loading-bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-busy-default-spinner .devui-loading-bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-busy-default-spinner .devui-loading-bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}
+@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.5)}to{transform:rotate(360deg) scale(1)}}.devui-loading-mask{position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #adb0b8);opacity:.3}.devui-loading-wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:9999}.devui-loading--hidden{overflow:hidden}.devui-loading-text{margin-left:10px}.devui-loading-area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-busy-default-spinner .devui-loading-bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-busy-default-spinner .devui-loading-bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-busy-default-spinner .devui-loading-bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-busy-default-spinner .devui-loading-bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}

package/modal/index.es.js

@@ -34,7 +34,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 import { defineComponent, toRefs, createVNode, Teleport, Transition, renderSlot, isVNode, computed, onMounted, watch, onUnmounted, ref, unref, nextTick, mergeProps, h, render } from "vue";
-import { shift, offset, autoPlacement, arrow, computePosition } from "@floating-ui/dom";
+import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 const modalProps = {
   modelValue: {
     type: Boolean,
@@ -249,6 +249,9 @@ const flexibleOverlayProps = {
     type: [Number, Object],
     default: 8
   },
+  shiftOffset: {
+    type: Number
+  },
   align: {
     type: String,
     default: null
@@ -316,7 +319,6 @@ function useOverlay(props, emit) {
     const overlayEl = unref(overlayRef.value);
     const arrowEl = unref(arrowRef.value);
     const middleware = [
-      shift(),
       offset(props.offset),
       autoPlacement({
         alignment: props.align,
@@ -324,12 +326,22 @@ function useOverlay(props, emit) {
       })
     ];
     props.showArrow && middleware.push(arrow({ element: arrowEl }));
+    props.shiftOffset !== void 0 && middleware.push(shift());
     const { x, y, placement, middlewareData } = await computePosition(hostEl, overlayEl, {
       strategy: "fixed",
       middleware
     });
+    let applyX = x;
+    let applyY = y;
+    if (props.shiftOffset !== void 0) {
+      const { x: shiftX, y: shiftY } = middlewareData.shift;
+      shiftX < 0 && (applyX -= props.shiftOffset);
+      shiftX > 0 && (applyX += props.shiftOffset);
+      shiftY < 0 && (applyY -= props.shiftOffset);
+      shiftY > 0 && (applyY += props.shiftOffset);
+    }
     emit("positionChange", placement);
-    Object.assign(overlayEl.style, { top: `${y}px`, left: `${x}px` });
+    Object.assign(overlayEl.style, { top: `${applyY}px`, left: `${applyX}px` });
     props.showArrow && updateArrowPosition(arrowEl, placement, middlewareData.arrow, overlayEl);
   };
   watch(() => props.modelValue, () => {

package/modal/index.umd.js

@@ -1 +1 @@
-var J=Object.defineProperty,Q=Object.defineProperties;var W=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,P=Object.prototype.propertyIsEnumerable;var N=(a,e,i)=>e in a?J(a,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):a[e]=i,k=(a,e)=>{for(var i in e||(e={}))M.call(e,i)&&N(a,i,e[i]);if(C)for(var i of C(e))P.call(e,i)&&N(a,i,e[i]);return a},V=(a,e)=>Q(a,W(e));var A=(a,e)=>{var i={};for(var y in a)M.call(a,y)&&e.indexOf(y)<0&&(i[y]=a[y]);if(a!=null&&C)for(var y of C(a))e.indexOf(y)<0&&P.call(a,y)&&(i[y]=a[y]);return i};var j=(a,e,i)=>(N(a,typeof e!="symbol"?e+"":e,i),i);(function(a,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue"),require("@floating-ui/dom")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom"],e):(a=typeof globalThis!="undefined"?globalThis:a||self,e(a.index={},a.Vue,a.dom))})(this,function(a,e,i){"use strict";const y={modelValue:{type:Boolean,default:!1},title:{type:String,default:""},lockScroll:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0},beforeClose:{type:Function}},D={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var L=e.defineComponent({name:"DIcon",props:D,setup(o){const{name:t,size:n,color:d,classPrefix:l}=e.toRefs(o);return()=>/^((https?):)?\/\//.test(t.value)?e.createVNode("img",{src:t.value,alt:t.value.split("/")[t.value.split("/").length-1],style:{width:n.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${l.value} ${l.value}-${t.value}`,style:{fontSize:n.value,color:d.value}},null)}}),Z="";function R(o){return typeof o=="function"||Object.prototype.toString.call(o)==="[object Object]"&&!e.isVNode(o)}const T=e.defineComponent({setup(o,t){return()=>{let n;return e.createVNode(e.Teleport,{to:"#d-overlay-anchor"},{default:()=>[e.createVNode(e.Transition,{name:"devui-overlay-fade"},R(n=e.renderSlot(t.slots,"default"))?n:{default:()=>[n]})]})}}}),_=V(k({},{visible:{type:Boolean},backgroundBlock:{type:Boolean,default:!1},backgroundClass:{type:String,default:""},backgroundStyle:{type:[String,Object]},onBackdropClick:{type:Function},backdropClose:{type:Boolean,default:!0},hasBackdrop:{type:Boolean,default:!0}}),{overlayStyle:{type:[String,Object],default:void 0}}),z=["update:visible","backdropClick"];function F(o,t){const n=e.computed(()=>["devui-overlay-background",o.backgroundClass,o.hasBackdrop?"devui-overlay-background__color":"devui-overlay-background__disabled"]),d=e.computed(()=>"devui-overlay"),l=r=>{var c;r.preventDefault(),(c=o.onBackdropClick)==null||c.call(o),o.backdropClose&&t.emit("update:visible",!1)},u=r=>r.cancelBubble=!0;return e.onMounted(()=>{const r=document.body,c=r.style.overflow,s=r.style.position;e.watch([()=>o.visible,()=>o.backgroundBlock],([m,v])=>{if(v){const f=r.getBoundingClientRect().y;m?(r.style.overflowY="scroll",r.style.position=m?"fixed":"",r.style.top=`${f}px`):(r.style.overflowY=c,r.style.position=s,r.style.top="",window.scrollTo(0,-f))}}),e.onUnmounted(()=>{document.body.style.overflow=c})}),{backgroundClass:n,overlayClass:d,handleBackdropClick:l,handleOverlayBubbleCancel:u}}var te="";const $=e.defineComponent({name:"DFixedOverlay",props:_,emits:z,setup(o,t){const{backgroundClass:n,overlayClass:d,handleBackdropClick:l,handleOverlayBubbleCancel:u}=F(o,t);return()=>e.createVNode(T,null,{default:()=>[o.visible&&e.createVNode("div",{class:n.value,style:o.backgroundStyle,onClick:l},[e.createVNode("div",{class:d.value,style:o.overlayStyle,onClick:u},[e.renderSlot(t.slots,"default")])])]})}}),q={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},offset:{type:[Number,Object],default:8},align:{type:String,default:null},showArrow:{type:Boolean,default:!1},isArrowCenter:{type:Boolean,default:!0}};function H(o){const t=/(auto|scroll|hidden)/;for(let n=o;n=n.parentElement;n.parentElement!==document.body){const d=window.getComputedStyle(n);if(t.test(d.overflow+d.overflowX+d.overflowY))return n}return window}function I(o,t,n,d){let{x:l,y:u}=t;if(!o){const{width:r,height:c}=d;l&&n.includes("start")&&(l=12),l&&n.includes("end")&&(l=Math.round(r-24)),u&&n.includes("start")&&(u=10),u&&n.includes("end")&&(u=c-14)}return{x:l,y:u}}function U(o,t){const n=e.ref(),d=e.ref();let l=null;const u=(c,s,m,v)=>{const{x:f,y:p}=I(o.isArrowCenter,m,s,v.getBoundingClientRect()),b={top:"bottom",right:"left",bottom:"top",left:"right"}[s.split("-")[0]];Object.assign(c.style,{left:f?`${f}px`:"",top:p?`${p}px`:"",right:"",bottom:"",[b]:"-4px"})},r=async()=>{const c=o.origin,s=e.unref(n.value),m=e.unref(d.value),v=[i.shift(),i.offset(o.offset),i.autoPlacement({alignment:o.align,allowedPlacements:o.position})];o.showArrow&&v.push(i.arrow({element:m}));const{x:f,y:p,placement:b,middlewareData:g}=await i.computePosition(c,s,{strategy:"fixed",middleware:v});t("positionChange",b),Object.assign(s.style,{top:`${p}px`,left:`${f}px`}),o.showArrow&&u(m,b,g.arrow,s)};return e.watch(()=>o.modelValue,()=>{o.modelValue&&o.origin?(l=H(o.origin),e.nextTick(r),l==null||l.addEventListener("scroll",r),l!==window&&window.addEventListener("scroll",r),window.addEventListener("resize",r)):(l==null||l.removeEventListener("scroll",r),l!==window&&window.removeEventListener("scroll",r),window.removeEventListener("resize",r))}),e.onUnmounted(()=>{l==null||l.removeEventListener("scroll",r),l!==window&&window.removeEventListener("scroll",r),window.removeEventListener("resize",r)}),{arrowRef:d,overlayRef:n,updatePosition:r}}var oe="";e.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:q,emits:["update:modelValue","positionChange"],setup(o,{slots:t,attrs:n,emit:d,expose:l}){const{arrowRef:u,overlayRef:r,updatePosition:c}=U(o,d);return l({updatePosition:c}),()=>{var s;return o.modelValue&&e.createVNode("div",e.mergeProps({ref:r,class:"devui-flexible-overlay"},n),[(s=t.default)==null?void 0:s.call(t),o.showArrow&&e.createVNode("div",{ref:u,class:"devui-flexible-overlay-arrow"},null)])}}});const Y=typeof window!="undefined";function K(o,t){function n(){t("update:modelValue",!1)}function d(l){l||(o.beforeClose?o.beforeClose(n):n())}return{handleVisibleChange:d}}var O=e.defineComponent({name:"DModalHeader",setup(o,{slots:t}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-header"},[(n=t.default)==null?void 0:n.call(t)])}}}),x=e.defineComponent({name:"DModalBody",setup(o,{slots:t}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-body"},[(n=t.default)==null?void 0:n.call(t)])}}}),ne="",w=e.defineComponent({name:"DModal",inheritAttrs:!1,props:y,emits:["update:modelValue"],setup(o,{slots:t,attrs:n,emit:d,expose:l}){const{modelValue:u,lockScroll:r,closeOnClickOverlay:c,title:s}=e.toRefs(o),{handleVisibleChange:m}=K(o,d);return l({handleVisibleChange:m}),()=>{const v={visible:u.value,"onUpdate:visible":m,"background-class":"devui-modal-mask","background-block":r.value,"backdrop-close":c.value};return e.createVNode($,v,{default:()=>[e.createVNode(e.Transition,{name:"devui-modal-wipe"},{default:()=>{var f;return[e.createVNode("div",e.mergeProps({class:"devui-modal"},n),[e.createVNode(L,{name:"close",class:"btn-close",size:"var(--devui-font-size-md,12px)",onClick:()=>m(!1)},null),t.header?t.header():s.value&&e.createVNode(O,null,{default:()=>[s.value]}),e.createVNode(x,null,{default:()=>{var p;return[(p=t.default)==null?void 0:p.call(t)]}}),(f=t.footer)==null?void 0:f.call(t)])]}})]})}}}),E=e.defineComponent({name:"DModalFooter",setup(o,{slots:t}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-footer"},[(n=t.default)==null?void 0:n.call(t)])}}});class X{constructor(t){this.anchorContainer=t}renderModal(t,n,d){const l=e.h(this.component(),n,d);return e.render(l,t),l}renderNull(t){setTimeout(()=>{e.render(null,t)},500)}}let h;class B extends X{component(){return w}open(t={}){const n=document.createElement("div");this.anchorContainer.appendChild(n);const v=t,{header:d,content:l,footer:u}=v,r=A(v,["header","content","footer"]),c=(f,p)=>this.renderModal(n,V(k({},f),{modelValue:!0,"onUpdate:modelValue":p}),{header:d,default:l,footer:u}),s=()=>{var p,b,g;const f=S=>{S||s()};c(r,S=>{S?c(r,f):(this.renderModal(n,V(k({},r),{modelValue:!1})),this.renderNull(n))}),(g=(b=(p=h==null?void 0:h.component)==null?void 0:p.exposed)==null?void 0:b.handleVisibleChange)==null||g.call(b,!1)},m=f=>{f||s()};return this.renderModal(n,{modelValue:!1}),h=c(r,m),{hide:s}}}j(B,"token","MODAL_SERVICE_TOKEN");var G={title:"Modal \u5F39\u7A97",category:"\u53CD\u9988",status:"100%",install(o){if(o.component(w.name,w),o.component(O.name,O),o.component(x.name,x),o.component(E.name,E),!Y)return;let t=document.getElementById("d-modal-anchors-container");t||(t=document.createElement("div"),t.setAttribute("id","d-modal-anchors-container"),document.body.appendChild(t)),o.provide(B.token,new B(t))}};a.Modal=w,a.default=G,a.modalProps=y,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
+var Z=Object.defineProperty,ee=Object.defineProperties;var te=Object.getOwnPropertyDescriptors;var k=Object.getOwnPropertySymbols;var j=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable;var E=(r,e,d)=>e in r?Z(r,e,{enumerable:!0,configurable:!0,writable:!0,value:d}):r[e]=d,O=(r,e)=>{for(var d in e||(e={}))j.call(e,d)&&E(r,d,e[d]);if(k)for(var d of k(e))D.call(e,d)&&E(r,d,e[d]);return r},V=(r,e)=>ee(r,te(e));var L=(r,e)=>{var d={};for(var m in r)j.call(r,m)&&e.indexOf(m)<0&&(d[m]=r[m]);if(r!=null&&k)for(var m of k(r))e.indexOf(m)<0&&D.call(r,m)&&(d[m]=r[m]);return d};var R=(r,e,d)=>(E(r,typeof e!="symbol"?e+"":e,d),d);(function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue"),require("@floating-ui/dom")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.index={},r.Vue,r.dom))})(this,function(r,e,d){"use strict";const m={modelValue:{type:Boolean,default:!1},title:{type:String,default:""},lockScroll:{type:Boolean,default:!0},closeOnClickOverlay:{type:Boolean,default:!0},beforeClose:{type:Function}},T={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var _=e.defineComponent({name:"DIcon",props:T,setup(t){const{name:o,size:n,color:i,classPrefix:l}=e.toRefs(t);return()=>/^((https?):)?\/\//.test(o.value)?e.createVNode("img",{src:o.value,alt:o.value.split("/")[o.value.split("/").length-1],style:{width:n.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${l.value} ${l.value}-${o.value}`,style:{fontSize:n.value,color:i.value}},null)}}),oe="";function z(t){return typeof t=="function"||Object.prototype.toString.call(t)==="[object Object]"&&!e.isVNode(t)}const F=e.defineComponent({setup(t,o){return()=>{let n;return e.createVNode(e.Teleport,{to:"#d-overlay-anchor"},{default:()=>[e.createVNode(e.Transition,{name:"devui-overlay-fade"},z(n=e.renderSlot(o.slots,"default"))?n:{default:()=>[n]})]})}}}),$=V(O({},{visible:{type:Boolean},backgroundBlock:{type:Boolean,default:!1},backgroundClass:{type:String,default:""},backgroundStyle:{type:[String,Object]},onBackdropClick:{type:Function},backdropClose:{type:Boolean,default:!0},hasBackdrop:{type:Boolean,default:!0}}),{overlayStyle:{type:[String,Object],default:void 0}}),Y=["update:visible","backdropClick"];function q(t,o){const n=e.computed(()=>["devui-overlay-background",t.backgroundClass,t.hasBackdrop?"devui-overlay-background__color":"devui-overlay-background__disabled"]),i=e.computed(()=>"devui-overlay"),l=a=>{var s;a.preventDefault(),(s=t.onBackdropClick)==null||s.call(t),t.backdropClose&&o.emit("update:visible",!1)},u=a=>a.cancelBubble=!0;return e.onMounted(()=>{const a=document.body,s=a.style.overflow,c=a.style.position;e.watch([()=>t.visible,()=>t.backgroundBlock],([y,v])=>{if(v){const f=a.getBoundingClientRect().y;y?(a.style.overflowY="scroll",a.style.position=y?"fixed":"",a.style.top=`${f}px`):(a.style.overflowY=s,a.style.position=c,a.style.top="",window.scrollTo(0,-f))}}),e.onUnmounted(()=>{document.body.style.overflow=s})}),{backgroundClass:n,overlayClass:i,handleBackdropClick:l,handleOverlayBubbleCancel:u}}var le="";const H=e.defineComponent({name:"DFixedOverlay",props:$,emits:Y,setup(t,o){const{backgroundClass:n,overlayClass:i,handleBackdropClick:l,handleOverlayBubbleCancel:u}=q(t,o);return()=>e.createVNode(F,null,{default:()=>[t.visible&&e.createVNode("div",{class:n.value,style:t.backgroundStyle,onClick:l},[e.createVNode("div",{class:i.value,style:t.overlayStyle,onClick:u},[e.renderSlot(o.slots,"default")])])]})}}),I={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},offset:{type:[Number,Object],default:8},shiftOffset:{type:Number},align:{type:String,default:null},showArrow:{type:Boolean,default:!1},isArrowCenter:{type:Boolean,default:!0}};function U(t){const o=/(auto|scroll|hidden)/;for(let n=t;n=n.parentElement;n.parentElement!==document.body){const i=window.getComputedStyle(n);if(o.test(i.overflow+i.overflowX+i.overflowY))return n}return window}function X(t,o,n,i){let{x:l,y:u}=o;if(!t){const{width:a,height:s}=i;l&&n.includes("start")&&(l=12),l&&n.includes("end")&&(l=Math.round(a-24)),u&&n.includes("start")&&(u=10),u&&n.includes("end")&&(u=s-14)}return{x:l,y:u}}function K(t,o){const n=e.ref(),i=e.ref();let l=null;const u=(s,c,y,v)=>{const{x:f,y:p}=X(t.isArrowCenter,y,c,v.getBoundingClientRect()),h={top:"bottom",right:"left",bottom:"top",left:"right"}[c.split("-")[0]];Object.assign(s.style,{left:f?`${f}px`:"",top:p?`${p}px`:"",right:"",bottom:"",[h]:"-4px"})},a=async()=>{const s=t.origin,c=e.unref(n.value),y=e.unref(i.value),v=[d.offset(t.offset),d.autoPlacement({alignment:t.align,allowedPlacements:t.position})];t.showArrow&&v.push(d.arrow({element:y})),t.shiftOffset!==void 0&&v.push(d.shift());const{x:f,y:p,placement:h,middlewareData:w}=await d.computePosition(s,c,{strategy:"fixed",middleware:v});let b=f,S=p;if(t.shiftOffset!==void 0){const{x:P,y:A}=w.shift;P<0&&(b-=t.shiftOffset),P>0&&(b+=t.shiftOffset),A<0&&(S-=t.shiftOffset),A>0&&(S+=t.shiftOffset)}o("positionChange",h),Object.assign(c.style,{top:`${S}px`,left:`${b}px`}),t.showArrow&&u(y,h,w.arrow,c)};return e.watch(()=>t.modelValue,()=>{t.modelValue&&t.origin?(l=U(t.origin),e.nextTick(a),l==null||l.addEventListener("scroll",a),l!==window&&window.addEventListener("scroll",a),window.addEventListener("resize",a)):(l==null||l.removeEventListener("scroll",a),l!==window&&window.removeEventListener("scroll",a),window.removeEventListener("resize",a))}),e.onUnmounted(()=>{l==null||l.removeEventListener("scroll",a),l!==window&&window.removeEventListener("scroll",a),window.removeEventListener("resize",a)}),{arrowRef:i,overlayRef:n,updatePosition:a}}var ae="";e.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:I,emits:["update:modelValue","positionChange"],setup(t,{slots:o,attrs:n,emit:i,expose:l}){const{arrowRef:u,overlayRef:a,updatePosition:s}=K(t,i);return l({updatePosition:s}),()=>{var c;return t.modelValue&&e.createVNode("div",e.mergeProps({ref:a,class:"devui-flexible-overlay"},n),[(c=o.default)==null?void 0:c.call(o),t.showArrow&&e.createVNode("div",{ref:u,class:"devui-flexible-overlay-arrow"},null)])}}});const G=typeof window!="undefined";function J(t,o){function n(){o("update:modelValue",!1)}function i(l){l||(t.beforeClose?t.beforeClose(n):n())}return{handleVisibleChange:i}}var x=e.defineComponent({name:"DModalHeader",setup(t,{slots:o}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-header"},[(n=o.default)==null?void 0:n.call(o)])}}}),B=e.defineComponent({name:"DModalBody",setup(t,{slots:o}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-body"},[(n=o.default)==null?void 0:n.call(o)])}}}),re="",g=e.defineComponent({name:"DModal",inheritAttrs:!1,props:m,emits:["update:modelValue"],setup(t,{slots:o,attrs:n,emit:i,expose:l}){const{modelValue:u,lockScroll:a,closeOnClickOverlay:s,title:c}=e.toRefs(t),{handleVisibleChange:y}=J(t,i);return l({handleVisibleChange:y}),()=>{const v={visible:u.value,"onUpdate:visible":y,"background-class":"devui-modal-mask","background-block":a.value,"backdrop-close":s.value};return e.createVNode(H,v,{default:()=>[e.createVNode(e.Transition,{name:"devui-modal-wipe"},{default:()=>{var f;return[e.createVNode("div",e.mergeProps({class:"devui-modal"},n),[e.createVNode(_,{name:"close",class:"btn-close",size:"var(--devui-font-size-md,12px)",onClick:()=>y(!1)},null),o.header?o.header():c.value&&e.createVNode(x,null,{default:()=>[c.value]}),e.createVNode(B,null,{default:()=>{var p;return[(p=o.default)==null?void 0:p.call(o)]}}),(f=o.footer)==null?void 0:f.call(o)])]}})]})}}}),M=e.defineComponent({name:"DModalFooter",setup(t,{slots:o}){return()=>{var n;return e.createVNode("div",{class:"devui-modal-footer"},[(n=o.default)==null?void 0:n.call(o)])}}});class Q{constructor(o){this.anchorContainer=o}renderModal(o,n,i){const l=e.h(this.component(),n,i);return e.render(l,o),l}renderNull(o){setTimeout(()=>{e.render(null,o)},500)}}let C;class N extends Q{component(){return g}open(o={}){const n=document.createElement("div");this.anchorContainer.appendChild(n);const v=o,{header:i,content:l,footer:u}=v,a=L(v,["header","content","footer"]),s=(f,p)=>this.renderModal(n,V(O({},f),{modelValue:!0,"onUpdate:modelValue":p}),{header:i,default:l,footer:u}),c=()=>{var p,h,w;const f=b=>{b||c()};s(a,b=>{b?s(a,f):(this.renderModal(n,V(O({},a),{modelValue:!1})),this.renderNull(n))}),(w=(h=(p=C==null?void 0:C.component)==null?void 0:p.exposed)==null?void 0:h.handleVisibleChange)==null||w.call(h,!1)},y=f=>{f||c()};return this.renderModal(n,{modelValue:!1}),C=s(a,y),{hide:c}}}R(N,"token","MODAL_SERVICE_TOKEN");var W={title:"Modal \u5F39\u7A97",category:"\u53CD\u9988",status:"100%",install(t){if(t.component(g.name,g),t.component(x.name,x),t.component(B.name,B),t.component(M.name,M),!G)return;let o=document.getElementById("d-modal-anchors-container");o||(o=document.createElement("div"),o.setAttribute("id","d-modal-anchors-container"),document.body.appendChild(o)),t.provide(N.token,new N(o))}};r.Modal=g,r.default=W,r.modalProps=m,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});

package/modal/style.css

@@ -1 +1 @@
-@keyframes d-overlay-fade{0%{opacity:0}to{opacity:1}}.devui-overlay-fade-enter{opacity:0}.devui-overlay-fade-enter-active{animation-name:d-overlay-fade;animation-duration:.3s}.devui-overlay-fade-leave{opacity:1}.devui-overlay-fade-leave-active{animation-name:d-overlay-fade;animation-duration:.3s;animation-direction:reverse}.devui-overlay-background{position:fixed;top:0;left:0;height:100vh;width:100vw;display:flex}.devui-overlay-background__color{background:rgba(0,0,0,.4)}.devui-overlay-background .devui-overlay{position:relative;z-index:1000;pointer-events:auto}.devui-overlay-background__disabled{pointer-events:none}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-connected-overlay, 0 2px 8px 0) var(--devui-shadow, rgba(0, 0, 0, .2));z-index:1000}.devui-flexible-overlay-arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}.devui-modal-mask{justify-content:center;align-items:center;background-color:var(--devui-shadow, rgba(0, 0, 0, .2))}.devui-modal{position:relative;width:300px;background-color:var(--devui-global-bg-normal, #ffffff)}.devui-modal .btn-close{position:absolute;right:20px;top:20px;width:20px;height:20px;line-height:20px;text-align:center;color:#000;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}.devui-modal .btn-close:hover{color:var(--devui-icon-fill-active-hover, #526ecc);background-color:var(--devui-list-item-hover-bg, #f2f5fc)}.devui-modal-content{background:var(--devui-fullscreen-overlay-bg, #ffffff);border-radius:var(--devui-border-radius, 2px)}.devui-modal-header{width:100%;height:56px;padding:32px 32px 0;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;box-sizing:border-box;border:none;user-select:none}.devui-modal-header .header-alert-icon{display:inline-block;vertical-align:middle;margin-right:8px;line-height:16px;text-align:center}.devui-modal-body{padding:20px 32px;font-size:var(--devui-font-size, 12px);color:var(--devui-text-weak, #575d6c);box-sizing:border-box}.devui-modal-footer{width:100%;border-top:none;text-align:center;padding:0 32px 24px;box-sizing:border-box}.devui-modal-footer>*{margin:0 4px}@keyframes wipe-in-out{0%{opacity:.2;transform:translateY(-24px)}to{opacity:1;transform:translateY(0)}}.devui-modal-wipe-enter-from{opacity:.2}.devui-modal-wipe-enter-active{animation-name:wipe-in-out;animation-duration:.3s}.devui-modal-wipe-leave-to{opacity:1}.devui-modal-wipe-leave-active{animation-name:wipe-in-out;animation-duration:.3s;animation-direction:reverse}
+@keyframes d-overlay-fade{0%{opacity:0}to{opacity:1}}.devui-overlay-fade-enter{opacity:0}.devui-overlay-fade-enter-active{animation-name:d-overlay-fade;animation-duration:.3s}.devui-overlay-fade-leave{opacity:1}.devui-overlay-fade-leave-active{animation-name:d-overlay-fade;animation-duration:.3s;animation-direction:reverse}.devui-overlay-background{position:fixed;top:0;left:0;height:100vh;width:100vw;display:flex}.devui-overlay-background__color{background:rgba(0,0,0,.4)}.devui-overlay-background .devui-overlay{position:relative;z-index:1000;pointer-events:auto}.devui-overlay-background__disabled{pointer-events:none}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-connected-overlay, 0 2px 8px 0) var(--devui-shadow, rgba(37, 43, 58, .2));z-index:1000}.devui-flexible-overlay-arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}.devui-modal-mask{justify-content:center;align-items:center;background-color:var(--devui-shadow, rgba(37, 43, 58, .2))}.devui-modal{position:relative;width:300px;border-radius:var(--devui-border-radius, 2px);border:none;background-color:var(--devui-fullscreen-overlay-bg, #ffffff);background-clip:padding-box;outline:0;box-shadow:var(--devui-shadow-fullscreen-overlay, 0 8px 40px 0) var(--devui-shadow, rgba(37, 43, 58, .2))}.devui-modal .btn-close{position:absolute;right:16px;top:16px;width:20px;height:20px;line-height:20px;text-align:center;color:#000;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}.devui-modal .btn-close:hover{color:var(--devui-icon-fill-active-hover, #526ecc);background-color:var(--devui-list-item-hover-bg, #f2f5fc)}.devui-modal-content{background:var(--devui-fullscreen-overlay-bg, #ffffff);border-radius:var(--devui-border-radius, 2px)}.devui-modal-header{width:100%;height:56px;padding:32px 32px 0;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;box-sizing:border-box;border:none;user-select:none}.devui-modal-header .header-alert-icon{display:inline-block;vertical-align:middle;margin-right:8px;line-height:16px;text-align:center}.devui-modal-body{padding:20px 32px;font-size:var(--devui-font-size, 12px);color:var(--devui-text-weak, #575d6c);box-sizing:border-box}.devui-modal-footer{width:100%;border-top:none;text-align:center;padding:0 32px 24px;box-sizing:border-box}.devui-modal-footer>*{margin:0 4px}@keyframes wipe-in-out{0%{opacity:.2;transform:translateY(-24px)}to{opacity:1;transform:translateY(0)}}.devui-modal-wipe-enter-from{opacity:.2}.devui-modal-wipe-enter-active{animation-name:wipe-in-out;animation-duration:.3s}.devui-modal-wipe-leave-to{opacity:1}.devui-modal-wipe-leave-active{animation-name:wipe-in-out;animation-duration:.3s;animation-direction:reverse}

package/notification/style.css

@@ -1 +1 @@
-.devui-notification{position:fixed;top:50px;right:20px;width:20em;word-break:normal;word-wrap:break-word;z-index:1060}.devui-notification a:link,.devui-notification a:visited{color:var(--devui-link-light, #96adfa)}.devui-notification a:hover,.devui-notification a:active{color:var(--devui-link-light-active, #beccfa)}.devui-notification-item-container{position:relative;margin:0 0 8px;opacity:.95;filter:alpha(opacity=95);box-shadow:var(--devui-shadow-length-feedback-overlay, 0 4px 16px 0) var(--devui-shadow, rgba(0, 0, 0, .2));border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-notification-item{position:relative;display:block;padding:12px 16px}.devui-notification-icon-close{position:absolute;top:7px;right:10px;cursor:pointer}.devui-notification-icon-close i.icon{color:var(--devui-light-text, #ffffff)!important}.devui-notification-title{font-size:var(--devui-font-size-card-title, 14px);padding:0 0 calc(.5em - 2px) 0;display:block;font-weight:700}.devui-notification-image{position:absolute;display:inline-block;width:16px;height:16px;border-radius:50%;left:16px;top:14px;padding:0;line-height:1}.devui-notification-image.devui-notification-image-warning path.devui-icon-warning-outer{fill:var(--devui-warning-line, #fa9841)}.devui-notification-image.devui-notification-image-warning path.devui-icon-warning-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-notification-image.devui-notification-image-info{background-color:var(--devui-info, #5e7ce0)}.devui-notification-image.devui-notification-image-error{background-color:var(--devui-danger, #f66f6a)}.devui-notification-image.devui-notification-image-success{background-color:var(--devui-success, #50d4ab)}.devui-notification-image .devui-notification-image-info-path,.devui-notification-image .devui-notification-image-error-path,.devui-notification-image .devui-notification-image-success-path{fill:var(--devui-light-text, #ffffff)}.devui-notification-message{margin-left:20px}.devui-notification-message .devui-notification-content{font-size:var(--devui-font-size, 12px);margin-top:4px}.devui-notification-message-common .devui-notification-message{margin-left:0}.devui-notification-message p{font-size:var(--devui-font-size, 12px);margin-top:4px}.notification-fade-enter-active,.notification-fade-leave-active{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.notification-fade-enter-from,.notification-fade-leave-to{transform:translate(100%)}
+.devui-notification{position:fixed;top:50px;right:20px;width:20em;word-break:normal;word-wrap:break-word;z-index:1060}.devui-notification a:link,.devui-notification a:visited{color:var(--devui-link-light, #96adfa)}.devui-notification a:hover,.devui-notification a:active{color:var(--devui-link-light-active, #beccfa)}.devui-notification-item-container{position:relative;margin:0 0 8px;opacity:.95;filter:alpha(opacity=95);box-shadow:var(--devui-shadow-length-feedback-overlay, 0 4px 16px 0) var(--devui-shadow, rgba(37, 43, 58, .2));border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-notification-item{position:relative;display:block;padding:12px 16px}.devui-notification-icon-close{position:absolute;top:7px;right:10px;cursor:pointer}.devui-notification-icon-close i.icon{color:var(--devui-light-text, #ffffff)!important}.devui-notification-title{font-size:var(--devui-font-size-card-title, 14px);padding:0 0 calc(.5em - 2px) 0;display:block;font-weight:700}.devui-notification-image{position:absolute;display:inline-block;width:16px;height:16px;border-radius:50%;left:16px;top:14px;padding:0;line-height:1}.devui-notification-image.devui-notification-image-warning path.devui-icon-warning-outer{fill:var(--devui-warning-line, #fa9841)}.devui-notification-image.devui-notification-image-warning path.devui-icon-warning-inner{fill:var(--devui-light-text, #ffffff);stroke:var(--devui-light-text, #ffffff)}.devui-notification-image.devui-notification-image-info{background-color:var(--devui-info, #5e7ce0)}.devui-notification-image.devui-notification-image-error{background-color:var(--devui-danger, #f66f6a)}.devui-notification-image.devui-notification-image-success{background-color:var(--devui-success, #50d4ab)}.devui-notification-image .devui-notification-image-info-path,.devui-notification-image .devui-notification-image-error-path,.devui-notification-image .devui-notification-image-success-path{fill:var(--devui-light-text, #ffffff)}.devui-notification-message{margin-left:20px}.devui-notification-message .devui-notification-content{font-size:var(--devui-font-size, 12px);margin-top:4px}.devui-notification-message-common .devui-notification-message{margin-left:0}.devui-notification-message p{font-size:var(--devui-font-size, 12px);margin-top:4px}.notification-fade-enter-active,.notification-fade-leave-active{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.notification-fade-enter-from,.notification-fade-leave-to{transform:translate(100%)}

package/nuxt/components/CheckboxGroup.js

@@ -0,0 +1,3 @@
+import '../../checkbox/style.css' 
+
+export  { CheckboxGroup as default } from '../../checkbox/index.es.js'

package/nuxt/components/Column.js

@@ -0,0 +1,3 @@
+import '../../table/style.css' 
+
+export  { Column as default } from '../../table/index.es.js'

package/nuxt/components/DatePicker.js

@@ -0,0 +1,3 @@
+import '../../date-picker/style.css' 
+
+export  { DatePicker as default } from '../../date-picker/index.es.js'

package/nuxt/components/Drawer.js

@@ -0,0 +1,3 @@
+import '../../drawer/style.css' 
+
+export  { Drawer as default } from '../../drawer/index.es.js'

package/nuxt/components/DrawerService.js

@@ -0,0 +1,3 @@
+import '../../drawer/style.css' 
+
+export  { DrawerService as default } from '../../drawer/index.es.js'

package/nuxt/components/Dropdown.js

@@ -0,0 +1,3 @@
+import '../../dropdown/style.css' 
+
+export  { Dropdown as default } from '../../dropdown/index.es.js'

package/nuxt/components/DropdownMenu.js

@@ -0,0 +1,3 @@
+import '../../dropdown/style.css' 
+
+export  { DropdownMenu as default } from '../../dropdown/index.es.js'

package/nuxt/components/FORM_ITEM_TOKEN.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { FORM_ITEM_TOKEN as default } from '../../form/index.es.js'

package/nuxt/components/FORM_TOKEN.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { FORM_TOKEN as default } from '../../form/index.es.js'

package/nuxt/components/Form.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { Form as default } from '../../form/index.es.js'

package/nuxt/components/FormControl.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { FormControl as default } from '../../form/index.es.js'

package/nuxt/components/FormItem.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { FormItem as default } from '../../form/index.es.js'

package/nuxt/components/FormLabel.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { FormLabel as default } from '../../form/index.es.js'

package/nuxt/components/FormOperation.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { FormOperation as default } from '../../form/index.es.js'

package/nuxt/components/InputNumber.js

@@ -0,0 +1,3 @@
+import '../../input-number/style.css' 
+
+export  { InputNumber as default } from '../../input-number/index.es.js'

package/nuxt/components/Select.js

@@ -0,0 +1,3 @@
+import '../../select/style.css' 
+
+export  { Select as default } from '../../select/index.es.js'

package/nuxt/components/StickSlider.js

@@ -0,0 +1,3 @@
+import '../../date-picker/style.css' 
+
+export  { StickSlider as default } from '../../date-picker/index.es.js'

package/nuxt/components/Tab.js

@@ -0,0 +1,3 @@
+import '../../tabs/style.css' 
+
+export  { Tab as default } from '../../tabs/index.es.js'

package/nuxt/components/Table.js

@@ -0,0 +1,3 @@
+import '../../table/style.css' 
+
+export  { Table as default } from '../../table/index.es.js'

package/nuxt/components/Tabs.js

@@ -0,0 +1,3 @@
+import '../../tabs/style.css' 
+
+export  { Tabs as default } from '../../tabs/index.es.js'

package/nuxt/components/Tooltip.js

@@ -0,0 +1,3 @@
+import '../../tooltip/style.css' 
+
+export  { Tooltip as default } from '../../tooltip/index.es.js'

package/nuxt/components/Tree.js

@@ -0,0 +1,3 @@
+import '../../tree/style.css' 
+
+export  { Tree as default } from '../../tree/index.es.js'

package/nuxt/components/dropdownMenuProps.js

@@ -0,0 +1,3 @@
+import '../../dropdown/style.css' 
+
+export  { dropdownMenuProps as default } from '../../dropdown/index.es.js'

package/nuxt/components/formControlProps.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { formControlProps as default } from '../../form/index.es.js'

package/nuxt/components/formItemProps.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { formItemProps as default } from '../../form/index.es.js'

package/nuxt/components/formProps.js

@@ -0,0 +1,3 @@
+import '../../form/style.css' 
+
+export  { formProps as default } from '../../form/index.es.js'

package/nuxt/components/tabsProps.js

@@ -0,0 +1,3 @@
+import '../../tabs/style.css' 
+
+export  { tabsProps as default } from '../../tabs/index.es.js'

package/nuxt/components/tooltipProps.js

@@ -0,0 +1,3 @@
+import '../../tooltip/style.css' 
+
+export  { tooltipProps as default } from '../../tooltip/index.es.js'

package/nuxt/components/treeProps.js

@@ -0,0 +1,3 @@
+import '../../tree/style.css' 
+
+export  { treeProps as default } from '../../tree/index.es.js'

package/overlay/index.es.js

@@ -18,7 +18,7 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { defineComponent, createVNode, Teleport, Transition, renderSlot, isVNode, computed, onMounted, watch, onUnmounted, ref, unref, nextTick, mergeProps } from "vue";
-import { shift, offset, autoPlacement, arrow, computePosition } from "@floating-ui/dom";
+import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
 var baseOverlay = "";
 function _isSlot(s) {
   return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
@@ -165,6 +165,9 @@ const flexibleOverlayProps = {
     type: [Number, Object],
     default: 8
   },
+  shiftOffset: {
+    type: Number
+  },
   align: {
     type: String,
     default: null
@@ -232,7 +235,6 @@ function useOverlay(props, emit) {
     const overlayEl = unref(overlayRef.value);
     const arrowEl = unref(arrowRef.value);
     const middleware = [
-      shift(),
       offset(props.offset),
       autoPlacement({
         alignment: props.align,
@@ -240,12 +242,22 @@ function useOverlay(props, emit) {
       })
     ];
     props.showArrow && middleware.push(arrow({ element: arrowEl }));
+    props.shiftOffset !== void 0 && middleware.push(shift());
     const { x, y, placement, middlewareData } = await computePosition(hostEl, overlayEl, {
       strategy: "fixed",
       middleware
     });
+    let applyX = x;
+    let applyY = y;
+    if (props.shiftOffset !== void 0) {
+      const { x: shiftX, y: shiftY } = middlewareData.shift;
+      shiftX < 0 && (applyX -= props.shiftOffset);
+      shiftX > 0 && (applyX += props.shiftOffset);
+      shiftY < 0 && (applyY -= props.shiftOffset);
+      shiftY > 0 && (applyY += props.shiftOffset);
+    }
     emit("positionChange", placement);
-    Object.assign(overlayEl.style, { top: `${y}px`, left: `${x}px` });
+    Object.assign(overlayEl.style, { top: `${applyY}px`, left: `${applyX}px` });
     props.showArrow && updateArrowPosition(arrowEl, placement, middlewareData.arrow, overlayEl);
   };
   watch(() => props.modelValue, () => {