@farris/ui-vue 1.2.5 → 1.2.7

package/components/modal/index.umd.cjs

@@ -1 +1 @@
-(function(E,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(E=typeof globalThis<"u"?globalThis:E||self,e(E.modal={},E.Vue))})(this,function(E,e){"use strict";var we=Object.defineProperty;var be=(E,e,S)=>e in E?we(E,e,{enumerable:!0,configurable:!0,writable:!0,value:S}):E[e]=S;var j=(E,e,S)=>be(E,typeof e!="symbol"?e+"":e,S);const S={class:{type:String,default:""},title:{type:String,default:""},width:{type:Number,default:500},height:{type:Number,default:320},buttons:{type:Array,default:[]},modelValue:{type:Boolean,default:!1},showHeader:{type:Boolean,default:!0},showButtons:{type:Boolean,default:!0},fitContent:{type:Boolean,default:!0},showCloseButton:{type:Boolean,default:!0},showMaxButton:{type:Boolean,default:!1},minHeight:{type:Number},maxHeight:{type:Number},minWidth:{type:Number},maxWidth:{type:Number},containment:{type:HTMLElement,default:null},reiszeable:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},dragHandle:{type:HTMLElement,default:null},closedCallback:{type:Function,default:null},resizeHandle:{type:Function,default:null},render:{type:Function,default:null},acceptCallback:{type:Function,default:null},rejectCallback:{type:Function,default:null},enableEsc:{type:Boolean,default:!0}};class C{constructor(t,n){this.x=t,this.y=n}static getTransformInfo(t){const u=window.getComputedStyle(t).getPropertyValue("transform").replace(/[^-\d,]/g,"").split(",");if(u.length>=6){const b=parseInt(u[4],10),d=parseInt(u[5],10);return{x:b,y:d}}return{x:0,y:0}}static fromEvent(t,n=null){if(this.isMouseEvent(t))return new C(t.clientX,t.clientY);if(n===null||t.changedTouches.length===1)return new C(t.changedTouches[0].clientX,t.changedTouches[0].clientY);for(let u=0;u<t.changedTouches.length;u++)if(t.changedTouches[u].target===n)return new C(t.changedTouches[u].clientX,t.changedTouches[u].clientY)}static isMouseEvent(t){return Object.prototype.toString.apply(t).indexOf("MouseEvent")===8}static isIPosition(t){return!!t&&"x"in t&&"y"in t}static getCurrent(t){const n=new C(0,0);if(window){const u=window.getComputedStyle(t);if(u){const b=parseInt(u.getPropertyValue("left"),10),d=parseInt(u.getPropertyValue("top"),10);n.x=isNaN(b)?0:b,n.y=isNaN(d)?0:d}return n}return null}static copy(t){return new C(0,0).set(t)}get value(){return{x:this.x,y:this.y}}add(t){return this.x+=t.x,this.y+=t.y,this}subtract(t){return this.x-=t.x,this.y-=t.y,this}multiply(t){this.x*=t,this.y*=t}divide(t){this.x/=t,this.y/=t}reset(){return this.x=0,this.y=0,this}set(t){return this.x=t.x,this.y=t.y,this}}class L{constructor(t,n){this.width=t,this.height=n}static getCurrent(t){const n=new L(0,0);if(window){const u=window.getComputedStyle(t);return u&&(n.width=parseInt(u.getPropertyValue("width"),10),n.height=parseInt(u.getPropertyValue("height"),10)),n}return null}static copy(t){return new L(0,0).set(t)}set(t){return this.width=t.width,this.height=t.height,this}}function Q(a,t){const n=e.ref(),u=e.ref(),b=e.ref(),d=e.ref(),v=e.ref(),r=e.ref(),c=e.ref(),f=e.ref(),x=e.ref(),H=e.ref(),B=e.ref(),N=e.ref(),R=e.ref(a.draggable),I=e.ref(!1);function T(){const o=u.value||document.body,s=window.getComputedStyle(o);if(!s||!n.value)return;const y=C.getTransformInfo(n.value),h={};c.value&&(h.deltaL=n.value.offsetLeft-c.value.x,h.deltaT=n.value.offsetTop-c.value.y);const z=s.getPropertyValue("position");h.width=o.clientWidth,h.height=o.clientHeight,h.pr=parseInt(s.getPropertyValue("padding-right"),10),h.pb=parseInt(s.getPropertyValue("padding-bottom"),10),h.position=s.getPropertyValue("position"),z==="static"&&(o.style.position="relative"),h.translateX=y.x,h.translateY=y.y,H.value=h}function m(o){if(n.value){d.value=L.getCurrent(n.value),v.value=C.getCurrent(n.value),r.value=d.value?L.copy(d.value):null,c.value=v.value?C.copy(v.value):null,T();const s=o.target.getAttribute("type")||"";f.value={n:!!s.match(/n/),s:!!s.match(/s/),w:!!s.match(/w/),e:!!s.match(/e/)}}}function p(){var o,s,y,h;if(n.value){const z=n.value;f.value&&((f.value.n||f.value.s)&&((o=r.value)!=null&&o.height)&&(z.style.height=r.value.height+"px"),(f.value.w||f.value.e)&&((s=r.value)!=null&&s.width)&&(z.style.width=r.value.width+"px"),c.value&&((y=c.value)!=null&&y.x&&(z.style.left=c.value.x+"px"),(h=c.value)!=null&&h.y&&(z.style.top=c.value.y+"px")))}}function k(){const o=a.minHeight?a.minHeight:1,s=a.minWidth?a.minWidth:1;r.value&&c.value&&f.value&&d.value&&(r.value.height<o&&(r.value.height=o,f.value.n&&v.value&&(c.value.y=v.value.y+(d.value.height-o))),r.value.width<s&&(r.value.width=s,f.value.w&&v.value&&(c.value.x=v.value.x+(d.value.width-s))),a.maxHeight&&r.value.height>a.maxHeight&&(r.value.height=a.maxHeight,v.value&&f.value.n&&(c.value.y=v.value.y+(d.value.height-a.maxHeight))),a.maxWidth&&r.value.width>a.maxWidth&&(r.value.width=a.maxWidth,f.value.w&&v.value&&(c.value.x=v.value.x+(d.value.width-a.maxWidth))))}function O(){if(u.value){const o=H.value;if(c.value&&r.value&&f.value&&d.value){const s=o.width-o.pr-o.deltaL-o.translateX-c.value.x,y=o.height-o.pb-o.deltaT-o.translateY-c.value.y;f.value.n&&c.value.y+o.translateY<0&&v.value&&(c.value.y=-o.translateY,r.value.height=d.value.height+v.value.y+o.translateY),f.value.w&&c.value.x+o.translateX<0&&v.value&&(c.value.x=-o.translateX,r.value.width=d.value.width+v.value.x+o.translateX),r.value.width>s&&(r.value.width=s),r.value.height>y&&(r.value.height=y)}}}function W(o){if(!b.value||!d.value||!v.value||!f.value)return;o.subtract(b.value);const s=o.x,y=o.y;f.value.n?(c.value.y=v.value.y+y,r.value.height=d.value.height-y):f.value.s&&(r.value.height=d.value.height+y),f.value.e?r.value.width=d.value.width+s:f.value.w&&(r.value.width=d.value.width-s,c.value.x=v.value.x+s),O(),k(),p()}function i(o){if(!x.value)return;const s=C.fromEvent(o);s&&W(s)}function g(){if(n.value){const{width:o,height:s,x:y,y:h}=n.value.getBoundingClientRect(),z=C.getTransformInfo(n.value);return{size:{width:o,height:s},position:{x:y-z.x,y:h-z.y}}}return null}function V(o){if(n.value){const s=g();B.value=s}b.value=void 0,d.value=null,v.value=null,r.value=null,c.value=null,f.value=null,x.value=null,document.removeEventListener("mousemove",i),document.removeEventListener("mouseup",V)}function P(){document.addEventListener("mousemove",i),document.addEventListener("mouseup",V)}function M(o){o instanceof MouseEvent&&o.button===2||R.value&&(o.stopPropagation(),o.preventDefault(),b.value=C.fromEvent(o),x.value=o.target,m(o),P())}function F(o){return n.value=o,e.createVNode(e.Fragment,null,[e.createVNode("div",{class:"ng-resizable-handle ng-resizable-n",type:"n",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-e",type:"e",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-s",type:"s",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-w",type:"w",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-ne",type:"ne",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-se ng-resizable-diagonal",type:"se",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-sw",type:"sw",onMousedown:s=>M(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-nw",type:"nw",onMousedown:s=>M(s)},null)])}function Y(o=!0){const s=u.value||document.body,y=L.getCurrent(s),h=n.value;o&&(N.value=g(),N.value.transform=h.style.transform),y&&h&&(r.value=y,h.style.height=r.value.height-14+"px",h.style.width=r.value.width-14+"px",h.style.left="7px",h.style.top="7px",h.style.transform="",B.value={size:r.value,position:{x:0,y:0}},R.value=!1,I.value=!0)}function $(){var o,s;if(N.value){const y={width:N.value.size.width||0,height:N.value.size.height||0},h={x:(window.innerWidth-y.width)/2,y:(window.innerHeight-y.height)/2};(o=r.value)==null||o.set(y),(s=c.value)==null||s.set(h);const z=n.value;z.style.height=y.height+"px",z.style.width=y.width+"px",z.style.left=`${h.x}px`,z.style.top=`${h.y}px`,z.style.transform="",B.value={size:y,position:h},R.value=a.draggable,I.value=!1}}function _(){if(n.value){const o=L.getCurrent(n.value);if(o){const{width:s,height:y}=o;n.value.style.left=`${(window.innerWidth-s)/2}px`,n.value.style.top=`${(window.innerHeight-y)/2}px`,n.value.style.transform=""}}}function A(){const o=()=>{I.value?Y(!1):_()};return window.addEventListener("resize",o),()=>{window.removeEventListener("resize",o)}}const K=A();return{renderResizeBar:F,boundingElement:u,resizedEventParam:B,maximize:Y,restore:$,allowDrag:R,isMaximized:I,unWindowResizeHandle:K}}function Z(a,t){const n=e.ref(),u=e.ref(a.draggable),b=e.ref(a.lockAxis),d=e.ref(),v=e.ref(),r=e.ref(!1),c=e.ref(new C(0,0)),f=e.ref(new C(0,0)),x=e.ref(new C(0,0)),H=e.ref(new C(0,0));function B(i,g){if(g.tagName==="BUTTON")return!1;if(g===i)return!0;for(const V in g.children)if(g.children.hasOwnProperty(V)&&B(i,g.children[V]))return!0;return!1}function N(){var P,M;let i=x.value.x+f.value.x,g=x.value.y+f.value.y;b.value==="x"?(i=((P=c.value)==null?void 0:P.x)||0,x.value.x=0):b.value==="y"&&(g=((M=c.value)==null?void 0:M.y)||0,x.value.y=0);const V=`translate3d(${Math.round(i)}px, ${Math.round(g)}px, 0px)`;n.value&&(n.value.style.transform=V),H.value.x=i,H.value.y=g}function R(){if(!v.value||!n.value)return null;const i=v.value.getBoundingClientRect(),g=n.value.getBoundingClientRect(),V={top:i.top<g.top,right:i.right>g.right,bottom:i.bottom>g.bottom,left:i.left<g.left};return V.top||(x.value.y-=g.top-i.top),V.bottom||(x.value.y-=g.bottom-i.bottom),V.right||(x.value.x-=g.right-i.right),V.left||(x.value.x-=g.left-i.left),N(),V}function I(i){i&&(c.value&&i.subtract(c.value),x.value.set(i),N(),R())}function T(i){r.value&&u.value&&(i.stopPropagation(),i.preventDefault(),I(C.fromEvent(i,d.value)))}function m(){var i;r.value&&(r.value=!1,f.value.add(x.value),x.value.reset(),(i=n.value)==null||i.classList.remove("ng-dragging"),document.removeEventListener("mousemove",T),document.removeEventListener("mouseup",m))}function p(){!r.value&&d.value&&(r.value=!0,d.value.classList.add("ng-dragging"),document.addEventListener("mousemove",T),document.addEventListener("mouseup",m))}function k(){if(n.value){const i=C.getTransformInfo(n.value);f.value.set(i);return}f.value.reset()}function O(i){if(i instanceof MouseEvent&&i.button===2)return;const g=i.target||i.srcElement;d.value!==void 0&&g&&!B(g,d.value)||u.value!==!1&&(i.stopPropagation(),i.preventDefault(),c.value=C.fromEvent(i,n.value),k(),p())}function W(i,g,V){i&&u.value&&g&&(d.value=i,n.value=g,v.value=V,i.classList.add("ng-draggable"),i.addEventListener("mousedown",O))}return{registerDraggle:W,resetTranslate:k}}function ee(a,t){const n=e.ref(a.enableEsc);function u(b){b.key==="Escape"&&a.enableEsc&&t.emit("esc",{event:b,type:"esc"})}n.value&&document.addEventListener("keydown",u)}const D=e.defineComponent({name:"FModal",props:S,emits:["update:modelValue","accept","cancel","closed","resize","esc"],setup(a,t){const n=e.ref(a.width||300),u=e.ref(a.height||200),b=e.ref(a.modelValue),d=e.ref(""),v=e.ref(a.class),r=e.ref(a.fitContent),c=e.ref(a.showHeader),f=e.ref(""),x=e.ref(a.showCloseButton),H=e.ref(a.showMaxButton),B=e.ref(!1),N=e.ref(""),R=e.ref(""),I=e.ref(""),T=e.ref(a.showButtons),m=e.ref(a.title),p=e.ref(a.reiszeable),k=e.ref(a.containment||null);function O(l,w){b.value=!1,t.emit("update:modelValue",!1),w!=null&&t.emit(w?"accept":"cancel"),t.emit("closed",l)}const W=[{name:"cancel",text:"取消",class:"btn btn-light",handle:l=>{O(l,!1)}},{name:"accept",text:"确定",class:"btn btn-primary",handle:l=>{O(l,!0)}}],i=e.ref(a.buttons&&a.buttons.length?a.buttons:W),g=e.computed(()=>!!f.value),V=e.computed(()=>!!T.value&&!!i.value),P=e.ref(),M=e.ref(),F=e.ref(!1),{renderResizeBar:Y,maximize:$,restore:_,boundingElement:A,resizedEventParam:K,allowDrag:o,unWindowResizeHandle:s}=Q(a),{registerDraggle:y}=Z(a);e.watch(()=>a.title,(l,w)=>{l!==w&&(m.value=l)}),e.watch(()=>a.modelValue,(l,w)=>{l!==w&&(b.value=l)}),e.watch(()=>a.showHeader,(l,w)=>{l!==w&&(c.value=l)}),e.watch(()=>a.showButtons,(l,w)=>{l!==w&&(T.value=l)}),e.watch(()=>K.value,(l,w)=>{const X=l||{},U=w||{};JSON.stringify(X)!==JSON.stringify(U)&&t.emit("resize",{newSize:l,oldSize:w})});function h(){const l=document.querySelectorAll(".farris-modal").length;(!l||l-1<=0)&&document.body.classList.remove("modal-open")}const z=e.computed(()=>(b.value?document.body.classList.add("modal-open"):h(),b.value)),le=e.computed(()=>{const l={modal:!0,"farris-modal":!0,fade:!0,show:z.value};return l["f-modal-fitContent"]=!!r.value,l}),ne=e.computed(()=>{var X;const l={"modal-dialog":!0},w=(X=v.value)==null?void 0:X.split(" ");return w==null||w.reduce((U,ye)=>(U[ye]=!0,U),l),l}),oe=e.computed(()=>({position:"absolute",top:`${(window.innerHeight-u.value)/2}px`,left:`${(window.innerWidth-n.value)/2}px`,width:`${n.value}px`,height:r.value?"auto":`${u.value}px`})),se=e.computed(()=>({"modal-content":!0,"modal-content-has-header":c.value})),ie=e.computed(()=>{const l={display:c.value?"":"none"};return l["pointer-events"]=o.value?"auto":"none",l}),ue=e.computed(()=>({"f-icon":!0,modal_maximize:!0,modalrevert:F.value})),re=e.computed(()=>({"modal-body":!0,"f-utils-flex-column":N.value==="iframe"}));function ce(){return{}}const de=e.computed(()=>{const l={textAlgin:I.value},w=ce();return Object.assign(l,w)});function fe(l){if(l.stopPropagation(),F.value){F.value=!1,_();return}$(),F.value=!0}async function he(l,w){l.handle&&await l.handle(w,l)&&t.emit("closed",w)}function ve(l){l.width&&(n.value=l.width),l.height&&(u.value=l.height),l.buttons&&(i.value=l.buttons),l.title&&(m.value=l.title)}e.onMounted(()=>{M.value&&!k.value&&(k.value=M.value.parentElement,A.value=k.value,y(P.value,M.value,A.value)),z.value&&document.body.classList.add("modal-open"),ee(a,t)}),e.onUnmounted(()=>{h(),s&&s()}),t.expose({modalElementRef:M,updateModalOptions:ve,close:O});function me(){return e.createVNode("ul",null,[B.value&&e.createVNode("li",{class:"f-btn-icon f-bare"},[e.createVNode("span",{class:"f-icon modal_minimize"},null)]),H.value&&e.createVNode("li",{onClick:fe,class:"f-btn-icon f-bare",style:"pointer-events: auto;"},[e.createVNode("span",{class:ue.value},null)]),x.value&&e.createVNode("li",{class:"f-btn-icon f-bare",onClick:l=>O(l,!1),style:"pointer-events: auto;"},[e.createVNode("span",{class:"f-icon modal_close"},null)])])}function ge(){return e.createVNode("div",{class:"modal-footer",style:de.value},[i.value&&i.value.map(l=>e.createVNode("button",{name:l.name,type:"button",class:l.class+(l.iconClass?" btn-icontext":""),onClick:w=>{he(l,w)}},[!!l.iconClass&&e.createVNode("i",{class:l.iconClass},null),l.text]))])}return()=>e.createVNode(e.Teleport,{to:"body"},{default:()=>{var l,w;return[z.value&&e.createVNode("div",{class:le.value,style:"display: block"},[e.createVNode("div",{id:d.value,class:ne.value,style:oe.value,ref:M},[e.createVNode("div",{class:se.value},[e.createVNode("div",{ref:P,class:"modal-header",style:ie.value},[e.createVNode("div",{class:"modal-title"},[g.value&&e.createVNode("span",{class:f.value,style:"margin-right: 8px"},null),e.createVNode("span",{class:"modal-title-label"},[m.value])]),e.createVNode("div",{class:"actions"},[me()])]),e.createVNode("div",{class:re.value},[(w=(l=t.slots).default)==null?void 0:w.call(l),N.value==="iframe"&&e.createVNode("iframe",{title:d.value,class:"f-utils-fill",width:"100%",frameborder:"0",src:R.value},null)]),V.value&&ge()]),!r.value&&p.value&&M.value&&Y(M.value)])])]}})}});function q(a){if(a.content&&a.content.render)return a.content.render;if(a.render&&typeof a.render=="function")return a.render}function te(a){const t=document.createElement("div");t.style.display="contents";const n=e.createApp({setup(u,b){e.onUnmounted(()=>{document.body.removeChild(t)});const d=e.ref(),v=e.ref(a.class||""),r=e.ref(!!a.showButtons),c=e.ref(!!a.showHeader),f=e.ref(a.showCloseButton==null?!0:a.showCloseButton),x=e.ref(!0),H=e.ref(a.title||""),B=a.acceptCallback||(()=>{}),N=a.rejectCallback||(()=>{}),R=a.closedCallback||(p=>{}),I=a.resizeHandle||(p=>{}),T=q(a),m=p=>{x.value=!1,n.unmount(),R(p)};return e.onMounted(()=>{}),b.expose({modalRef:d}),()=>e.createVNode(D,{ref:d,class:v.value,modelValue:x.value,"onUpdate:modelValue":p=>x.value=p,title:H.value,width:a.width,height:a.height,buttons:a.buttons,"show-header":c.value,"show-buttons":r.value,"show-close-button":f.value,"show-max-button":!1,onAccept:B,onCancel:N,fitContent:a.fitContent==null?!0:a.fitContent,onClosed:m,onResize:I},{default:()=>[T&&T(n)]})}});return document.body.appendChild(t),n.mount(t),n}class J{constructor(t){j(this,"appContext",null);j(this,"modalRef",e.ref());j(this,"activeModalIndex",e.ref(0));j(this,"modalRefs",{});j(this,"isUseEscCloseModal",e.ref(!1));j(this,"activeModalInstance",e.computed(()=>this.modalRefs[this.activeModalIndex.value]));this.appContext=t?t._context:null}getCurrentModal(){return this.activeModalInstance.value}static show(t){const n=Object.assign({title:"",showButtons:!0,showHeader:!0},t);return te(n)}open(t){const n=document.createDocumentFragment();t.showMaxButton&&t.fitContent&&(t.showMaxButton=!1);const u=e.shallowRef(Object.assign({title:"",showButtons:!0,showHeader:!0},t)),b=e.ref(!0),d=u.value.acceptCallback||(()=>{}),v=u.value.rejectCallback||(()=>{}),r=u.value.closedCallback||((m,p)=>{}),c=u.value.resizeHandle||(m=>{});let f;const x=q(u.value),H=m=>{var k;b.value=!1;const p=(k=m==null?void 0:m.target)==null?void 0:k.classList.contains("modal_close");r(m,this.isUseEscCloseModal.value?"esc":p?"icon":"button")},B=m=>{H(m),f&&e.nextTick(()=>{if(this.modalRefs[this.activeModalIndex.value]&&delete this.modalRefs[this.activeModalIndex.value],e.render(null,n),f=null,this.modalRef.value=null,this.modalRefs){const p=Object.keys(this.modalRefs);p.length>0?this.activeModalIndex.value=Math.max(...p):this.activeModalIndex.value=0}this.isUseEscCloseModal.value=!1})},N=m=>{var p;this.isUseEscCloseModal.value=!0,this.activeModalInstance&&((p=this.activeModalInstance.value)==null||p.close(m==null?void 0:m.event))},R=()=>e.createVNode(D,e.mergeProps({ref:this.modalRef,modelValue:b.value,"onUpdate:modelValue":m=>b.value=m},u.value,{onAccept:d,onCancel:v,onClosed:B,onResize:c,onEsc:N}),{default:()=>[x&&x()]});return f=(m=>{const p=e.h(R,m);return p.appContext=this.appContext,e.render(p,n),p})({...u.value}),this.activeModalIndex.value++,this.modalRefs[this.activeModalIndex.value]=this.modalRef.value,{update:m=>{u.value={...u.value,...m},f&&e.render(e.cloneVNode(f,{...u}),n)},destroy:B,modalRef:this.activeModalInstance}}}const G=Symbol("FModalService"),ae={install(a){a.component(D.name,D);const t=new J(a);a.provide(G,t),a.provide("FModalService",t)}};E.FModal=D,E.FModalService=J,E.F_MODAL_SERVICE_TOKEN=G,E.default=ae,E.modalProps=S,Object.defineProperties(E,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(z,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(z=typeof globalThis<"u"?globalThis:z||self,e(z.modal={},z.Vue))})(this,function(z,e){"use strict";var be=Object.defineProperty;var xe=(z,e,P)=>e in z?be(z,e,{enumerable:!0,configurable:!0,writable:!0,value:P}):z[e]=P;var W=(z,e,P)=>xe(z,typeof e!="symbol"?e+"":e,P);const P={class:{type:String,default:""},title:{type:String,default:""},width:{type:Number,default:500},height:{type:Number,default:320},buttons:{type:Array,default:[]},modelValue:{type:Boolean,default:!1},showHeader:{type:Boolean,default:!0},showButtons:{type:Boolean,default:!0},fitContent:{type:Boolean,default:!0},showCloseButton:{type:Boolean,default:!0},showMaxButton:{type:Boolean,default:!1},minHeight:{type:Number},maxHeight:{type:Number},minWidth:{type:Number},maxWidth:{type:Number},containment:{type:HTMLElement,default:null},reiszeable:{type:Boolean,default:!1},draggable:{type:Boolean,default:!1},dragHandle:{type:Object,default:null},closedCallback:{type:Function,default:null},resizeHandle:{type:Function,default:null},render:{type:Function,default:null},acceptCallback:{type:Function,default:null},rejectCallback:{type:Function,default:null},enableEsc:{type:Boolean,default:!0}};class C{constructor(t,n){this.x=t,this.y=n}static getTransformInfo(t){const i=window.getComputedStyle(t).getPropertyValue("transform").replace(/[^-\d,]/g,"").split(",");if(i.length>=6){const b=parseInt(i[4],10),c=parseInt(i[5],10);return{x:b,y:c}}return{x:0,y:0}}static fromEvent(t,n=null){if(this.isMouseEvent(t))return new C(t.clientX,t.clientY);if(n===null||t.changedTouches.length===1)return new C(t.changedTouches[0].clientX,t.changedTouches[0].clientY);for(let i=0;i<t.changedTouches.length;i++)if(t.changedTouches[i].target===n)return new C(t.changedTouches[i].clientX,t.changedTouches[i].clientY)}static isMouseEvent(t){return Object.prototype.toString.apply(t).indexOf("MouseEvent")===8}static isIPosition(t){return!!t&&"x"in t&&"y"in t}static getCurrent(t){const n=new C(0,0);if(window){const i=window.getComputedStyle(t);if(i){const b=parseInt(i.getPropertyValue("left"),10),c=parseInt(i.getPropertyValue("top"),10);n.x=isNaN(b)?0:b,n.y=isNaN(c)?0:c}return n}return null}static copy(t){return new C(0,0).set(t)}get value(){return{x:this.x,y:this.y}}add(t){return this.x+=t.x,this.y+=t.y,this}subtract(t){return this.x-=t.x,this.y-=t.y,this}multiply(t){this.x*=t,this.y*=t}divide(t){this.x/=t,this.y/=t}reset(){return this.x=0,this.y=0,this}set(t){return this.x=t.x,this.y=t.y,this}}class j{constructor(t,n){this.width=t,this.height=n}static getCurrent(t){const n=new j(0,0);if(window){const i=window.getComputedStyle(t);return i&&(n.width=parseInt(i.getPropertyValue("width"),10),n.height=parseInt(i.getPropertyValue("height"),10)),n}return null}static copy(t){return new j(0,0).set(t)}set(t){return this.width=t.width,this.height=t.height,this}}function Z(a,t){const n=e.ref(),i=e.ref(),b=e.ref(),c=e.ref(),m=e.ref(),u=e.ref(),d=e.ref(),f=e.ref(),x=e.ref(),R=e.ref(),N=e.ref(),E=e.ref(),H=e.ref(a.draggable),I=e.ref(!1);function T(){const o=i.value||document.body,s=window.getComputedStyle(o);if(!s||!n.value)return;const y=C.getTransformInfo(n.value),v={};d.value&&(v.deltaL=n.value.offsetLeft-d.value.x,v.deltaT=n.value.offsetTop-d.value.y);const M=s.getPropertyValue("position");v.width=o.clientWidth,v.height=o.clientHeight,v.pr=parseInt(s.getPropertyValue("padding-right"),10),v.pb=parseInt(s.getPropertyValue("padding-bottom"),10),v.position=s.getPropertyValue("position"),M==="static"&&(o.style.position="relative"),v.translateX=y.x,v.translateY=y.y,R.value=v}function g(o){if(n.value){c.value=j.getCurrent(n.value),m.value=C.getCurrent(n.value),u.value=c.value?j.copy(c.value):null,d.value=m.value?C.copy(m.value):null,T();const s=o.target.getAttribute("type")||"";f.value={n:!!s.match(/n/),s:!!s.match(/s/),w:!!s.match(/w/),e:!!s.match(/e/)}}}function p(){var o,s,y,v;if(n.value){const M=n.value;f.value&&((f.value.n||f.value.s)&&((o=u.value)!=null&&o.height)&&(M.style.height=u.value.height+"px"),(f.value.w||f.value.e)&&((s=u.value)!=null&&s.width)&&(M.style.width=u.value.width+"px"),d.value&&((y=d.value)!=null&&y.x&&(M.style.left=d.value.x+"px"),(v=d.value)!=null&&v.y&&(M.style.top=d.value.y+"px")))}}function k(){const o=a.minHeight?a.minHeight:1,s=a.minWidth?a.minWidth:1;u.value&&d.value&&f.value&&c.value&&(u.value.height<o&&(u.value.height=o,f.value.n&&m.value&&(d.value.y=m.value.y+(c.value.height-o))),u.value.width<s&&(u.value.width=s,f.value.w&&m.value&&(d.value.x=m.value.x+(c.value.width-s))),a.maxHeight&&u.value.height>a.maxHeight&&(u.value.height=a.maxHeight,m.value&&f.value.n&&(d.value.y=m.value.y+(c.value.height-a.maxHeight))),a.maxWidth&&u.value.width>a.maxWidth&&(u.value.width=a.maxWidth,f.value.w&&m.value&&(d.value.x=m.value.x+(c.value.width-a.maxWidth))))}function F(){if(i.value){const o=R.value;if(d.value&&u.value&&f.value&&c.value){const s=o.width-o.pr-o.deltaL-o.translateX-d.value.x,y=o.height-o.pb-o.deltaT-o.translateY-d.value.y;f.value.n&&d.value.y+o.translateY<0&&m.value&&(d.value.y=-o.translateY,u.value.height=c.value.height+m.value.y+o.translateY),f.value.w&&d.value.x+o.translateX<0&&m.value&&(d.value.x=-o.translateX,u.value.width=c.value.width+m.value.x+o.translateX),u.value.width>s&&(u.value.width=s),u.value.height>y&&(u.value.height=y)}}}function L(o){if(!b.value||!c.value||!m.value||!f.value)return;o.subtract(b.value);const s=o.x,y=o.y;f.value.n?(d.value.y=m.value.y+y,u.value.height=c.value.height-y):f.value.s&&(u.value.height=c.value.height+y),f.value.e?u.value.width=c.value.width+s:f.value.w&&(u.value.width=c.value.width-s,d.value.x=m.value.x+s),F(),k(),p()}function r(o){if(!x.value)return;const s=C.fromEvent(o);s&&L(s)}function h(){if(n.value){const{width:o,height:s,x:y,y:v}=n.value.getBoundingClientRect(),M=C.getTransformInfo(n.value);return{size:{width:o,height:s},position:{x:y-M.x,y:v-M.y}}}return null}function V(o){if(n.value){const s=h();N.value=s}b.value=void 0,c.value=null,m.value=null,u.value=null,d.value=null,f.value=null,x.value=null,document.removeEventListener("mousemove",r),document.removeEventListener("mouseup",V)}function O(){document.addEventListener("mousemove",r),document.addEventListener("mouseup",V)}function B(o){o instanceof MouseEvent&&o.button===2||H.value&&(o.stopPropagation(),o.preventDefault(),b.value=C.fromEvent(o),x.value=o.target,g(o),O())}function S(o){return n.value=o,e.createVNode(e.Fragment,null,[e.createVNode("div",{class:"ng-resizable-handle ng-resizable-n",type:"n",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-e",type:"e",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-s",type:"s",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-w",type:"w",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-ne",type:"ne",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-se ng-resizable-diagonal",type:"se",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-sw",type:"sw",onMousedown:s=>B(s)},null),e.createVNode("div",{class:"ng-resizable-handle ng-resizable-nw",type:"nw",onMousedown:s=>B(s)},null)])}function D(o=!0){const s=i.value||document.body,y=j.getCurrent(s),v=n.value;o&&(E.value=h(),E.value.transform=v.style.transform),y&&v&&(u.value=y,v.style.height=u.value.height-14+"px",v.style.width=u.value.width-14+"px",v.style.left="7px",v.style.top="7px",v.style.transform="",N.value={size:u.value,position:{x:0,y:0}},H.value=!1,I.value=!0)}function $(){var o,s;if(E.value){const y={width:E.value.size.width||0,height:E.value.size.height||0},v={x:(window.innerWidth-y.width)/2,y:(window.innerHeight-y.height)/2};(o=u.value)==null||o.set(y),(s=d.value)==null||s.set(v);const M=n.value;M.style.height=y.height+"px",M.style.width=y.width+"px",M.style.left=`${v.x}px`,M.style.top=`${v.y}px`,M.style.transform="",N.value={size:y,position:v},H.value=a.draggable,I.value=!1}}function _(){if(n.value){const o=j.getCurrent(n.value);if(o){const{width:s,height:y}=o;n.value.style.left=`${(window.innerWidth-s)/2}px`,n.value.style.top=`${(window.innerHeight-y)/2}px`,n.value.style.transform=""}}}function q(){const o=()=>{I.value?D(!1):_()};return window.addEventListener("resize",o),()=>{window.removeEventListener("resize",o)}}const A=q();return{renderResizeBar:S,boundingElement:i,resizedEventParam:N,maximize:D,restore:$,allowDrag:H,isMaximized:I,unWindowResizeHandle:A}}function ee(a,t){const n=e.ref(),i=e.ref(a.draggable),b=e.ref(a.lockAxis),c=e.ref(),m=e.ref(),u=e.ref(!1),d=e.ref(new C(0,0)),f=e.ref(new C(0,0)),x=e.ref(new C(0,0)),R=e.ref(new C(0,0));function N(r,h){if(h.tagName==="BUTTON")return!1;if(h===r)return!0;for(const V in h.children)if(h.children.hasOwnProperty(V)&&N(r,h.children[V]))return!0;return!1}function E(){var O,B;let r=x.value.x+f.value.x,h=x.value.y+f.value.y;b.value==="x"?(r=((O=d.value)==null?void 0:O.x)||0,x.value.x=0):b.value==="y"&&(h=((B=d.value)==null?void 0:B.y)||0,x.value.y=0);const V=`translate3d(${Math.round(r)}px, ${Math.round(h)}px, 0px)`;n.value&&(n.value.style.transform=V),R.value.x=r,R.value.y=h}function H(){if(!m.value||!n.value)return null;const r=m.value.getBoundingClientRect(),h=n.value.getBoundingClientRect(),V={top:r.top<h.top,right:r.right>h.right,bottom:r.bottom>h.bottom,left:r.left<h.left};return V.top||(x.value.y-=h.top-r.top),V.bottom||(x.value.y-=h.bottom-r.bottom),V.right||(x.value.x-=h.right-r.right),V.left||(x.value.x-=h.left-r.left),E(),V}function I(r){r&&(d.value&&r.subtract(d.value),x.value.set(r),E(),H())}function T(r){u.value&&i.value&&(r.stopPropagation(),r.preventDefault(),I(C.fromEvent(r,c.value)))}function g(){var r;u.value&&(u.value=!1,f.value.add(x.value),x.value.reset(),(r=n.value)==null||r.classList.remove("ng-dragging"),document.removeEventListener("mousemove",T),document.removeEventListener("mouseup",g))}function p(){!u.value&&c.value&&(u.value=!0,c.value.classList.add("ng-dragging"),document.addEventListener("mousemove",T),document.addEventListener("mouseup",g))}function k(){if(n.value){const r=C.getTransformInfo(n.value);f.value.set(r);return}f.value.reset()}function F(r){if(r instanceof MouseEvent&&r.button===2)return;const h=r.target||r.srcElement;c.value!==void 0&&h&&!N(h,c.value)||i.value!==!1&&(r.stopPropagation(),r.preventDefault(),d.value=C.fromEvent(r,n.value),k(),p())}function L(r,h,V){if(r&&i.value&&h){if(a.dragHandle){if(a.dragHandle instanceof HTMLElement)c.value=a.dragHandle;else if(typeof a.dragHandle=="string"){const O=h.querySelector(a.dragHandle);O&&(c.value=O)}}else c.value=r;n.value=h,m.value=V,c.value.classList.add("ng-draggable"),c.value.addEventListener("mousedown",F)}}return{registerDraggle:L,resetTranslate:k}}function te(a,t){const n=e.ref(a.enableEsc);function i(b){b.key==="Escape"&&a.enableEsc&&t.emit("esc",{event:b,type:"esc"})}n.value&&document.addEventListener("keydown",i)}const X=e.defineComponent({name:"FModal",props:P,emits:["update:modelValue","accept","cancel","closed","resize","esc"],setup(a,t){const n=e.ref(a.width||300),i=e.ref(a.height||200),b=e.ref(a.modelValue),c=e.ref(""),m=e.ref(a.class),u=e.ref(a.fitContent),d=e.ref(a.showHeader),f=e.ref(""),x=e.ref(a.showCloseButton),R=e.ref(a.showMaxButton),N=e.ref(!1),E=e.ref(""),H=e.ref(""),I=e.ref(""),T=e.ref(a.showButtons),g=e.ref(a.title),p=e.ref(a.reiszeable),k=e.ref(a.containment||null),F=e.ref();function L(l,w){b.value=!1,t.emit("update:modelValue",!1),w!=null&&t.emit(w?"accept":"cancel"),t.emit("closed",l)}const r=[{name:"cancel",text:"取消",class:"btn btn-light",handle:l=>{L(l,!1)}},{name:"accept",text:"确定",class:"btn btn-primary",handle:l=>{L(l,!0)}}],h=e.ref(a.buttons&&a.buttons.length?a.buttons:r),V=e.computed(()=>!!f.value),O=e.computed(()=>!!T.value&&!!h.value),B=e.ref(),S=e.ref(),D=e.ref(!1),{renderResizeBar:$,maximize:_,restore:q,boundingElement:A,resizedEventParam:o,allowDrag:s,unWindowResizeHandle:y}=Z(a),{registerDraggle:v}=ee(a);e.watch(()=>a.title,(l,w)=>{l!==w&&(g.value=l)}),e.watch(()=>a.modelValue,(l,w)=>{l!==w&&(b.value=l)}),e.watch(()=>a.showHeader,(l,w)=>{l!==w&&(d.value=l)}),e.watch(()=>a.showButtons,(l,w)=>{l!==w&&(T.value=l)}),e.watch(()=>o.value,(l,w)=>{const Y=l||{},U=w||{};JSON.stringify(Y)!==JSON.stringify(U)&&t.emit("resize",{newSize:l,oldSize:w})});function M(){const l=document.querySelectorAll(".farris-modal").length;(!l||l-1<=0)&&document.body.classList.remove("modal-open"),F.value&&F.value.classList.remove("show")}const K=e.computed(()=>(b.value?document.body.classList.add("modal-open"):M(),b.value)),ne=e.computed(()=>{const l={modal:!0,"farris-modal":!0,fade:!0};return l["f-modal-fitContent"]=!!u.value,l.show=!!K.value,l}),oe=e.computed(()=>{var Y;const l={"modal-dialog":!0},w=(Y=m.value)==null?void 0:Y.split(" ");return w==null||w.reduce((U,we)=>(U[we]=!0,U),l),l}),se=e.computed(()=>({position:"absolute",top:`${(window.innerHeight-i.value)/2}px`,left:`${(window.innerWidth-n.value)/2}px`,width:`${n.value}px`,height:u.value?"auto":`${i.value}px`})),ie=e.computed(()=>({"modal-content":!0,"modal-content-has-header":d.value})),ue=e.computed(()=>{const l={display:d.value?"":"none"};return l["pointer-events"]=s.value?"auto":"none",l}),re=e.computed(()=>({"f-icon":!0,modal_maximize:!0,modalrevert:D.value})),ce=e.computed(()=>({"modal-body":!0,"f-utils-flex-column":E.value==="iframe"}));function de(){return{}}const fe=e.computed(()=>{const l={textAlgin:I.value},w=de();return Object.assign(l,w)});function he(l){if(l.stopPropagation(),D.value){D.value=!1,q();return}_(),D.value=!0}async function ve(l,w){l.handle&&await l.handle(w,l)&&t.emit("closed",w)}function me(l){l.width&&(n.value=l.width),l.height&&(i.value=l.height),l.buttons&&(h.value=l.buttons),l.title&&(g.value=l.title)}e.onMounted(()=>{S.value&&!k.value&&(k.value=S.value.parentElement,A.value=k.value,v(B.value,S.value,A.value)),K.value&&document.body.classList.add("modal-open"),te(a,t)}),e.onUnmounted(()=>{M(),y&&y()}),t.expose({modalElementRef:S,updateModalOptions:me,close:L});function ge(){return e.createVNode("ul",null,[N.value&&e.createVNode("li",{class:"f-btn-icon f-bare"},[e.createVNode("span",{class:"f-icon modal_minimize"},null)]),R.value&&e.createVNode("li",{onClick:he,class:"f-btn-icon f-bare",style:"pointer-events: auto;"},[e.createVNode("span",{class:re.value},null)]),x.value&&e.createVNode("li",{class:"f-btn-icon f-bare",onClick:l=>L(l,!1),style:"pointer-events: auto;"},[e.createVNode("span",{class:"f-icon modal_close"},null)])])}function ye(){return e.createVNode("div",{class:"modal-footer",style:fe.value},[h.value&&h.value.map(l=>e.createVNode("button",{name:l.name,type:"button",class:l.class+(l.iconClass?" btn-icontext":""),onClick:w=>{ve(l,w)}},[!!l.iconClass&&e.createVNode("i",{class:l.iconClass},null),l.text]))])}return()=>e.createVNode(e.Teleport,{to:"body"},{default:()=>{var l,w;return[K.value&&e.createVNode("div",{class:ne.value,style:"display: block",ref:F},[e.createVNode("div",{id:c.value,class:oe.value,style:se.value,ref:S},[e.createVNode("div",{class:ie.value},[e.createVNode("div",{ref:B,class:"modal-header",style:ue.value},[e.createVNode("div",{class:"modal-title"},[V.value&&e.createVNode("span",{class:f.value,style:"margin-right: 8px"},null),e.createVNode("span",{class:"modal-title-label"},[g.value])]),e.createVNode("div",{class:"actions"},[ge()])]),e.createVNode("div",{class:ce.value},[(w=(l=t.slots).default)==null?void 0:w.call(l),E.value==="iframe"&&e.createVNode("iframe",{title:c.value,class:"f-utils-fill",width:"100%",frameborder:"0",src:H.value},null)]),O.value&&ye()]),!u.value&&p.value&&S.value&&$(S.value)])])]}})}});function J(a){if(a.content&&a.content.render)return a.content.render;if(a.render&&typeof a.render=="function")return a.render}function ae(a){const t=document.createElement("div");t.style.display="contents";const n=e.createApp({setup(i,b){e.onUnmounted(()=>{document.body.removeChild(t)});const c=e.ref(),m=e.ref(a.class||""),u=e.ref(!!a.showButtons),d=e.ref(!!a.showHeader),f=e.ref(a.showCloseButton==null?!0:a.showCloseButton),x=e.ref(!0),R=e.ref(a.title||""),N=a.acceptCallback||(()=>{}),E=a.rejectCallback||(()=>{}),H=a.closedCallback||(p=>{}),I=a.resizeHandle||(p=>{}),T=J(a),g=p=>{x.value=!1,n.unmount(),H(p)};return e.onMounted(()=>{}),b.expose({modalRef:c}),()=>e.createVNode(X,{ref:c,class:m.value,modelValue:x.value,"onUpdate:modelValue":p=>x.value=p,title:R.value,width:a.width,height:a.height,buttons:a.buttons,"show-header":d.value,"show-buttons":u.value,"show-close-button":f.value,"show-max-button":!1,onAccept:N,onCancel:E,fitContent:a.fitContent==null?!0:a.fitContent,onClosed:g,onResize:I},{default:()=>[T&&T(n)]})}});return document.body.appendChild(t),n.mount(t),n}class G{constructor(t){W(this,"appContext",null);W(this,"modalRef",e.ref());W(this,"activeModalIndex",e.ref(0));W(this,"modalRefs",{});W(this,"isUseEscCloseModal",e.ref(!1));W(this,"activeModalInstance",e.computed(()=>this.modalRefs[this.activeModalIndex.value]));this.appContext=t?t._context:null}getCurrentModal(){return this.activeModalInstance.value}static show(t){const n=Object.assign({title:"",showButtons:!0,showHeader:!0},t);return ae(n)}open(t){const n=document.createDocumentFragment();t.showMaxButton&&t.fitContent&&(t.showMaxButton=!1);const i=e.shallowRef(Object.assign({title:"",showButtons:!0,showHeader:!0},t)),b=e.ref(!0),c=i.value.acceptCallback||(()=>{}),m=i.value.rejectCallback||(()=>{}),u=i.value.closedCallback||((g,p)=>{}),d=i.value.resizeHandle||(g=>{});let f;const x=J(i.value),R=g=>{var k;b.value=!1;const p=(k=g==null?void 0:g.target)==null?void 0:k.classList.contains("modal_close");u(g,this.isUseEscCloseModal.value?"esc":p?"icon":"button")},N=g=>{R(g),f&&e.nextTick(()=>{if(this.modalRefs[this.activeModalIndex.value]&&delete this.modalRefs[this.activeModalIndex.value],e.render(null,n),f=null,this.modalRef.value=null,this.modalRefs){const p=Object.keys(this.modalRefs);p.length>0?this.activeModalIndex.value=Math.max(...p):this.activeModalIndex.value=0}this.isUseEscCloseModal.value=!1})},E=g=>{var p;this.isUseEscCloseModal.value=!0,this.activeModalInstance&&((p=this.activeModalInstance.value)==null||p.close(g==null?void 0:g.event))},H=()=>e.createVNode(X,e.mergeProps({ref:this.modalRef,modelValue:b.value,"onUpdate:modelValue":g=>b.value=g},i.value,{onAccept:c,onCancel:m,onClosed:N,onResize:d,onEsc:E}),{default:()=>[x&&x()]});return f=(g=>{const p=e.h(H,g);return p.appContext=this.appContext,e.render(p,n),p})({...i.value}),this.activeModalIndex.value++,this.modalRefs[this.activeModalIndex.value]=this.modalRef.value,{update:g=>{i.value={...i.value,...g},f&&e.render(e.cloneVNode(f,{...i}),n)},destroy:N,modalRef:this.activeModalInstance}}}const Q=Symbol("FModalService"),le={install(a){a.component(X.name,X);const t=new G(a);a.provide(Q,t),a.provide("FModalService",t)}};z.FModal=X,z.FModalService=G,z.F_MODAL_SERVICE_TOKEN=Q,z.default=le,z.modalProps=P,Object.defineProperties(z,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/components/modal/package.json

@@ -3,6 +3,6 @@
         "version": "1.1.7",
         "main": "index.umd.js",
         "module": "index.esm.js",
-        "style": "style.css",
+        "style": "index.css",
         "types": "../types/modal/index.d.ts"
     }

package/components/nav/package.json

@@ -3,6 +3,6 @@
         "version": "1.1.7",
         "main": "index.umd.js",
         "module": "index.esm.js",
-        "style": "style.css",
+        "style": "index.css",
         "types": "../types/nav/index.d.ts"
     }

package/components/notify/package.json

@@ -3,6 +3,6 @@
         "version": "1.1.7",
         "main": "index.umd.js",
         "module": "index.esm.js",
-        "style": "style.css",
+        "style": "index.css",
         "types": "../types/notify/index.d.ts"
     }