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

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/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.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/dropdownMenuProps.js

@@ -0,0 +1,3 @@
+import '../../dropdown/style.css' 
+
+export  { dropdownMenuProps as default } from '../../dropdown/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/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, () => {

package/overlay/index.umd.js

@@ -1 +1 @@
-var R=Object.defineProperty,T=Object.defineProperties;var $=Object.getOwnPropertyDescriptors;var O=Object.getOwnPropertySymbols;var z=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable;var x=(l,e,a)=>e in l?R(l,e,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[e]=a,B=(l,e)=>{for(var a in e||(e={}))z.call(e,a)&&x(l,a,e[a]);if(O)for(var a of O(e))D.call(e,a)&&x(l,a,e[a]);return l},E=(l,e)=>T(l,$(e));(function(l,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):(l=typeof globalThis!="undefined"?globalThis:l||self,e(l.index={},l.Vue,l.dom))})(this,function(l,e,a){"use strict";var M="";function S(t){return typeof t=="function"||Object.prototype.toString.call(t)==="[object Object]"&&!e.isVNode(t)}const V=e.defineComponent({setup(t,r){return()=>{let i;return e.createVNode(e.Teleport,{to:"#d-overlay-anchor"},{default:()=>[e.createVNode(e.Transition,{name:"devui-overlay-fade"},S(i=e.renderSlot(r.slots,"default"))?i:{default:()=>[i]})]})}}}),p={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}},h=E(B({},p),{overlayStyle:{type:[String,Object],default:void 0}}),k=["update:visible","backdropClick"];function A(t,r){const i=e.computed(()=>["devui-overlay-background",t.backgroundClass,t.hasBackdrop?"devui-overlay-background__color":"devui-overlay-background__disabled"]),d=e.computed(()=>"devui-overlay"),n=o=>{var c;o.preventDefault(),(c=t.onBackdropClick)==null||c.call(t),t.backdropClose&&r.emit("update:visible",!1)},s=o=>o.cancelBubble=!0;return e.onMounted(()=>{const o=document.body,c=o.style.overflow,u=o.style.position;e.watch([()=>t.visible,()=>t.backgroundBlock],([f,v])=>{if(v){const y=o.getBoundingClientRect().y;f?(o.style.overflowY="scroll",o.style.position=f?"fixed":"",o.style.top=`${y}px`):(o.style.overflowY=c,o.style.position=u,o.style.top="",window.scrollTo(0,-y))}}),e.onUnmounted(()=>{document.body.style.overflow=c})}),{backgroundClass:i,overlayClass:d,handleBackdropClick:n,handleOverlayBubbleCancel:s}}var q="";const m=e.defineComponent({name:"DFixedOverlay",props:h,emits:k,setup(t,r){const{backgroundClass:i,overlayClass:d,handleBackdropClick:n,handleOverlayBubbleCancel:s}=A(t,r);return()=>e.createVNode(V,null,{default:()=>[t.visible&&e.createVNode("div",{class:i.value,style:t.backgroundStyle,onClick:n},[e.createVNode("div",{class:d.value,style:t.overlayStyle,onClick:s},[e.renderSlot(r.slots,"default")])])]})}}),C={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 j(t){const r=/(auto|scroll|hidden)/;for(let i=t;i=i.parentElement;i.parentElement!==document.body){const d=window.getComputedStyle(i);if(r.test(d.overflow+d.overflowX+d.overflowY))return i}return window}function P(t,r,i,d){let{x:n,y:s}=r;if(!t){const{width:o,height:c}=d;n&&i.includes("start")&&(n=12),n&&i.includes("end")&&(n=Math.round(o-24)),s&&i.includes("start")&&(s=10),s&&i.includes("end")&&(s=c-14)}return{x:n,y:s}}function L(t,r){const i=e.ref(),d=e.ref();let n=null;const s=(c,u,f,v)=>{const{x:y,y:w}=P(t.isArrowCenter,f,u,v.getBoundingClientRect()),b={top:"bottom",right:"left",bottom:"top",left:"right"}[u.split("-")[0]];Object.assign(c.style,{left:y?`${y}px`:"",top:w?`${w}px`:"",right:"",bottom:"",[b]:"-4px"})},o=async()=>{const c=t.origin,u=e.unref(i.value),f=e.unref(d.value),v=[a.shift(),a.offset(t.offset),a.autoPlacement({alignment:t.align,allowedPlacements:t.position})];t.showArrow&&v.push(a.arrow({element:f}));const{x:y,y:w,placement:b,middlewareData:_}=await a.computePosition(c,u,{strategy:"fixed",middleware:v});r("positionChange",b),Object.assign(u.style,{top:`${w}px`,left:`${y}px`}),t.showArrow&&s(f,b,_.arrow,u)};return e.watch(()=>t.modelValue,()=>{t.modelValue&&t.origin?(n=j(t.origin),e.nextTick(o),n==null||n.addEventListener("scroll",o),n!==window&&window.addEventListener("scroll",o),window.addEventListener("resize",o)):(n==null||n.removeEventListener("scroll",o),n!==window&&window.removeEventListener("scroll",o),window.removeEventListener("resize",o))}),e.onUnmounted(()=>{n==null||n.removeEventListener("scroll",o),n!==window&&window.removeEventListener("scroll",o),window.removeEventListener("resize",o)}),{arrowRef:d,overlayRef:i,updatePosition:o}}var Y="";const g=e.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:C,emits:["update:modelValue","positionChange"],setup(t,{slots:r,attrs:i,emit:d,expose:n}){const{arrowRef:s,overlayRef:o,updatePosition:c}=L(t,d);return n({updatePosition:c}),()=>{var u;return t.modelValue&&e.createVNode("div",e.mergeProps({ref:o,class:"devui-flexible-overlay"},i),[(u=r.default)==null?void 0:u.call(r),t.showArrow&&e.createVNode("div",{ref:s,class:"devui-flexible-overlay-arrow"},null)])}}}),N=typeof window!="undefined";var F={title:"Overlay \u906E\u7F69\u5C42",category:"\u901A\u7528",status:"100%",install(t){if(t.component(m.name,m),t.component(g.name,g),N&&!document.getElementById("d-overlay-anchor")){const r=document.createElement("div");r.setAttribute("id","d-overlay-anchor"),r.style.position="fixed",r.style.left="0",r.style.top="0",r.style.zIndex="1000",document.body.appendChild(r)}}};l.FixedOverlay=m,l.FlexibleOverlay=g,l.default=F,l.fixedOverlayProps=h,l.flexibleOverlayProps=C,l.overlayEmits=k,l.overlayProps=p,Object.defineProperty(l,"__esModule",{value:!0}),l[Symbol.toStringTag]="Module"});
+var z=Object.defineProperty,D=Object.defineProperties;var M=Object.getOwnPropertyDescriptors;var V=Object.getOwnPropertySymbols;var q=Object.prototype.hasOwnProperty,X=Object.prototype.propertyIsEnumerable;var A=(l,t,a)=>t in l?z(l,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[t]=a,j=(l,t)=>{for(var a in t||(t={}))q.call(t,a)&&A(l,a,t[a]);if(V)for(var a of V(t))X.call(t,a)&&A(l,a,t[a]);return l},P=(l,t)=>D(l,M(t));(function(l,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue"),require("@floating-ui/dom")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom"],t):(l=typeof globalThis!="undefined"?globalThis:l||self,t(l.index={},l.Vue,l.dom))})(this,function(l,t,a){"use strict";var I="";function L(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!t.isVNode(e)}const N=t.defineComponent({setup(e,i){return()=>{let r;return t.createVNode(t.Teleport,{to:"#d-overlay-anchor"},{default:()=>[t.createVNode(t.Transition,{name:"devui-overlay-fade"},L(r=t.renderSlot(i.slots,"default"))?r:{default:()=>[r]})]})}}}),p={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}},k=P(j({},p),{overlayStyle:{type:[String,Object],default:void 0}}),C=["update:visible","backdropClick"];function F(e,i){const r=t.computed(()=>["devui-overlay-background",e.backgroundClass,e.hasBackdrop?"devui-overlay-background__color":"devui-overlay-background__disabled"]),d=t.computed(()=>"devui-overlay"),n=o=>{var c;o.preventDefault(),(c=e.onBackdropClick)==null||c.call(e),e.backdropClose&&i.emit("update:visible",!1)},s=o=>o.cancelBubble=!0;return t.onMounted(()=>{const o=document.body,c=o.style.overflow,f=o.style.position;t.watch([()=>e.visible,()=>e.backgroundBlock],([u,y])=>{if(y){const v=o.getBoundingClientRect().y;u?(o.style.overflowY="scroll",o.style.position=u?"fixed":"",o.style.top=`${v}px`):(o.style.overflowY=c,o.style.position=f,o.style.top="",window.scrollTo(0,-v))}}),t.onUnmounted(()=>{document.body.style.overflow=c})}),{backgroundClass:r,overlayClass:d,handleBackdropClick:n,handleOverlayBubbleCancel:s}}var U="";const m=t.defineComponent({name:"DFixedOverlay",props:k,emits:C,setup(e,i){const{backgroundClass:r,overlayClass:d,handleBackdropClick:n,handleOverlayBubbleCancel:s}=F(e,i);return()=>t.createVNode(N,null,{default:()=>[e.visible&&t.createVNode("div",{class:r.value,style:e.backgroundStyle,onClick:n},[t.createVNode("div",{class:d.value,style:e.overlayStyle,onClick:s},[t.renderSlot(i.slots,"default")])])]})}}),x={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 _(e){const i=/(auto|scroll|hidden)/;for(let r=e;r=r.parentElement;r.parentElement!==document.body){const d=window.getComputedStyle(r);if(i.test(d.overflow+d.overflowX+d.overflowY))return r}return window}function R(e,i,r,d){let{x:n,y:s}=i;if(!e){const{width:o,height:c}=d;n&&r.includes("start")&&(n=12),n&&r.includes("end")&&(n=Math.round(o-24)),s&&r.includes("start")&&(s=10),s&&r.includes("end")&&(s=c-14)}return{x:n,y:s}}function T(e,i){const r=t.ref(),d=t.ref();let n=null;const s=(c,f,u,y)=>{const{x:v,y:w}=R(e.isArrowCenter,u,f,y.getBoundingClientRect()),b={top:"bottom",right:"left",bottom:"top",left:"right"}[f.split("-")[0]];Object.assign(c.style,{left:v?`${v}px`:"",top:w?`${w}px`:"",right:"",bottom:"",[b]:"-4px"})},o=async()=>{const c=e.origin,f=t.unref(r.value),u=t.unref(d.value),y=[a.offset(e.offset),a.autoPlacement({alignment:e.align,allowedPlacements:e.position})];e.showArrow&&y.push(a.arrow({element:u})),e.shiftOffset!==void 0&&y.push(a.shift());const{x:v,y:w,placement:b,middlewareData:B}=await a.computePosition(c,f,{strategy:"fixed",middleware:y});let g=v,O=w;if(e.shiftOffset!==void 0){const{x:E,y:S}=B.shift;E<0&&(g-=e.shiftOffset),E>0&&(g+=e.shiftOffset),S<0&&(O-=e.shiftOffset),S>0&&(O+=e.shiftOffset)}i("positionChange",b),Object.assign(f.style,{top:`${O}px`,left:`${g}px`}),e.showArrow&&s(u,b,B.arrow,f)};return t.watch(()=>e.modelValue,()=>{e.modelValue&&e.origin?(n=_(e.origin),t.nextTick(o),n==null||n.addEventListener("scroll",o),n!==window&&window.addEventListener("scroll",o),window.addEventListener("resize",o)):(n==null||n.removeEventListener("scroll",o),n!==window&&window.removeEventListener("scroll",o),window.removeEventListener("resize",o))}),t.onUnmounted(()=>{n==null||n.removeEventListener("scroll",o),n!==window&&window.removeEventListener("scroll",o),window.removeEventListener("resize",o)}),{arrowRef:d,overlayRef:r,updatePosition:o}}var G="";const h=t.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:x,emits:["update:modelValue","positionChange"],setup(e,{slots:i,attrs:r,emit:d,expose:n}){const{arrowRef:s,overlayRef:o,updatePosition:c}=T(e,d);return n({updatePosition:c}),()=>{var f;return e.modelValue&&t.createVNode("div",t.mergeProps({ref:o,class:"devui-flexible-overlay"},r),[(f=i.default)==null?void 0:f.call(i),e.showArrow&&t.createVNode("div",{ref:s,class:"devui-flexible-overlay-arrow"},null)])}}}),Y=typeof window!="undefined";var $={title:"Overlay \u906E\u7F69\u5C42",category:"\u901A\u7528",status:"100%",install(e){if(e.component(m.name,m),e.component(h.name,h),Y&&!document.getElementById("d-overlay-anchor")){const i=document.createElement("div");i.setAttribute("id","d-overlay-anchor"),i.style.position="fixed",i.style.left="0",i.style.top="0",i.style.zIndex="1000",document.body.appendChild(i)}}};l.FixedOverlay=m,l.FlexibleOverlay=h,l.default=$,l.fixedOverlayProps=k,l.flexibleOverlayProps=x,l.overlayEmits=C,l.overlayProps=p,Object.defineProperty(l,"__esModule",{value:!0}),l[Symbol.toStringTag]="Module"});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-devui",
-  "version": "1.0.0-rc.4",
+  "version": "1.0.0-rc.5",
   "license": "MIT",
   "description": "DevUI components based on Vite and Vue3",
   "keywords": [
@@ -25,7 +25,7 @@
   "style": "style.css",
   "dependencies": {
     "@devui-design/icons": "^1.3.0",
-    "@floating-ui/dom": "^0.4.0",
+    "@floating-ui/dom": "^0.4.4",
     "@types/lodash-es": "^4.17.4",
     "@vueuse/core": "^7.7.1",
     "async-validator": "^4.0.2",

package/popover/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, toRefs, Fragment } 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, () => {