@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
2 lines (1 loc) • 33.5 kB
JavaScript
(function(H,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("../tags/index.umd.js"),require("../popover/index.umd.js"),require("../common/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","../tags/index.umd.js","../popover/index.umd.js","../common/index.umd.js"],t):(H=typeof globalThis<"u"?globalThis:H||self,t(H["button-edit"]={},H.Vue,H.FTags,H.FPopover,H.common))})(this,function(H,t,X,ie,re){"use strict";var Ge=Object.defineProperty;var _e=(H,t,X)=>t in H?Ge(H,t,{enumerable:!0,configurable:!0,writable:!0,value:X}):H[t]=X;var U=(H,t,X)=>_e(H,typeof t!="symbol"?t+"":t,X);const te={id:String,buttonContent:{type:String,default:'<i class="f-icon f-icon-lookup"></i>'},buttonBehavior:{type:String,default:"Popup"},autoComplete:{type:Boolean,default:!1},customClass:{type:String,default:""},disable:{type:Boolean,default:!1},editable:{type:Boolean,default:!0},enableClear:{type:Boolean,default:!1},modelValue:{type:String,default:""},readonly:{type:Boolean,default:!1},showButtonWhenDisabled:{type:Boolean,default:!1},enableTitle:{type:Boolean,default:!1},inputType:{type:String,default:"text"},forcePlaceholder:{type:Boolean,default:!1},placeholder:{type:String,default:""},minLength:Number,maxLength:Number,tabIndex:Number,popupHost:{type:Object},popupRightBoundary:{type:Object},popupOffsetX:{type:Object},popupOnInput:{type:Boolean,default:!1},popupOnFocus:{type:Boolean,default:!1},popupOnClick:{type:Boolean,default:!1},popupClass:{type:String,default:""},popupMinWidth:{type:Number,default:160},modalOptions:{type:Object,default:{}},wrapText:{type:Boolean,default:!1},multiSelect:{type:Boolean,default:!1},separator:{type:String,default:","},textAlign:{type:String,default:"left"},beforeClickButton:{type:Function,default:null},focusOnCreated:{type:Boolean,default:!1},selectOnCreated:{type:Boolean,default:!1},beforeOpen:{type:Function,default:null},updateOn:{type:String,default:"change"},keepWidthWithReference:{type:Boolean,default:!0},placement:{type:String,default:"bottom-left"}},ce={popupContentPosition:{type:Object,default:{left:0,top:0}},host:{type:Object},backgroundColor:{type:String,default:""}},de=t.defineComponent({name:"FOverlay",props:ce,emits:["click"],setup(e,n){const a=t.ref(e.popupContentPosition),l=t.ref(e.host),i=t.computed(()=>({backgroundColor:e.backgroundColor||"",pointerEvents:"auto"}));function s(u){n.emit("click"),u.preventDefault(),u.stopPropagation()}t.computed(()=>{const u=l.value;if(u){const c=u.getBoundingClientRect(),{left:v,top:g,height:p}=c;return{left:v,top:g+p}}return a.value});const r=t.computed(()=>({}));return()=>t.createVNode(t.Teleport,{to:"body"},{default:()=>{var u,c;return[t.createVNode("div",{class:"overlay-container",onClick:v=>s(v),style:i.value},[t.createVNode("div",{style:r.value},[(c=(u=n.slots).default)==null?void 0:c.call(u)])])]}})}});function fe(e){if(e.content&&e.content.render)return e.content.render;if(e.render&&typeof e.render=="function")return e.render}function he(e){const n=document.createElement("div");n.style.display="contents";let a;const l=e.onClickCallback||(()=>{}),i=()=>{l(),a&&a.unmount()};return a=t.createApp({setup(){t.onUnmounted(()=>{document.body.removeChild(n)});const s=fe(e);return()=>t.createVNode(de,{"popup-content-position":e.popupPosition,host:e.host,onClick:i,backgroundColor:e.backgroundColor},{default:()=>[s&&s()]})}}),document.body.appendChild(n),a.mount(n),a}class me{static show(n){return he(n)}}const ve={allowClickMaskToClose:{type:Boolean,default:!1},beforeClose:{type:Function,default:()=>!0},class:{type:String,default:""},maskClass:{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},mask:{type:Boolean,default:!0},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:Object,default:null},resizeable:{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},enableEnter:{type:Boolean,default:!1},dialogType:{type:String,default:""},src:{type:String,default:""},footerHeight:{type:Number,default:60}};class R{constructor(n,a){this.x=n,this.y=a}static getTransformInfo(n){const l=window.getComputedStyle(n).getPropertyValue("transform").replace(/[^-\d,]/g,"").split(",");if(l.length>=6){const i=parseInt(l[4],10),s=parseInt(l[5],10);return{x:i,y:s}}return{x:0,y:0}}static fromEvent(n,a=null){if(this.isMouseEvent(n))return new R(n.clientX,n.clientY);if(a===null||n.changedTouches.length===1)return new R(n.changedTouches[0].clientX,n.changedTouches[0].clientY);for(let l=0;l<n.changedTouches.length;l++)if(n.changedTouches[l].target===a)return new R(n.changedTouches[l].clientX,n.changedTouches[l].clientY)}static isMouseEvent(n){return Object.prototype.toString.apply(n).indexOf("MouseEvent")===8}static isIPosition(n){return!!n&&"x"in n&&"y"in n}static getCurrent(n){const a=new R(0,0);if(window){const l=window.getComputedStyle(n);if(l){const i=parseInt(l.getPropertyValue("left"),10),s=parseInt(l.getPropertyValue("top"),10);a.x=isNaN(i)?0:i,a.y=isNaN(s)?0:s}return a}return null}static copy(n){return new R(0,0).set(n)}get value(){return{x:this.x,y:this.y}}add(n){return this.x+=n.x,this.y+=n.y,this}subtract(n){return this.x-=n.x,this.y-=n.y,this}multiply(n){this.x*=n,this.y*=n}divide(n){this.x/=n,this.y/=n}reset(){return this.x=0,this.y=0,this}set(n){return this.x=n.x,this.y=n.y,this}}class W{constructor(n,a){this.width=n,this.height=a}static getCurrent(n){const a=new W(0,0);if(window){const l=window.getComputedStyle(n);return l&&(a.width=parseInt(l.getPropertyValue("width"),10),a.height=parseInt(l.getPropertyValue("height"),10)),a}return null}static copy(n){return new W(0,0).set(n)}set(n){return this.width=n.width,this.height=n.height,this}}function ge(e,n){const a=t.ref(),l=t.ref(),i=t.ref(),s=t.ref(),r=t.ref(),u=t.ref(),c=t.ref(),v=t.ref(),g=t.ref(),p=t.ref(),M=t.ref(),y=t.ref(e.resizeable),b=t.ref(),T=t.ref(e.draggable),E=t.ref(!1);function O(){const d=l.value||document.body,h=window.getComputedStyle(d);if(!h||!a.value)return;const k=R.getTransformInfo(a.value),x={};c.value&&(x.deltaL=a.value.offsetLeft-c.value.x,x.deltaT=a.value.offsetTop-c.value.y);const j=h.getPropertyValue("position");x.width=d.clientWidth,x.height=d.clientHeight,x.pr=parseInt(h.getPropertyValue("padding-right"),10),x.pb=parseInt(h.getPropertyValue("padding-bottom"),10),x.position=h.getPropertyValue("position"),j==="static"&&(d.style.position="relative"),x.translateX=k.x,x.translateY=k.y,p.value=x}function V(d){if(a.value){s.value=W.getCurrent(a.value),r.value=R.getCurrent(a.value),u.value=s.value?W.copy(s.value):null,c.value=r.value?R.copy(r.value):null,O();const h=d.target.getAttribute("type")||"";v.value={n:!!h.match(/n/),s:!!h.match(/s/),w:!!h.match(/w/),e:!!h.match(/e/)}}}function I(){var d,h,k,x;if(a.value){const j=a.value;v.value&&((v.value.n||v.value.s)&&((d=u.value)!=null&&d.height)&&(j.style.height=u.value.height+"px"),(v.value.w||v.value.e)&&((h=u.value)!=null&&h.width)&&(j.style.width=u.value.width+"px"),c.value&&((k=c.value)!=null&&k.x&&(j.style.left=c.value.x+"px"),(x=c.value)!=null&&x.y&&(j.style.top=c.value.y+"px")))}}function F(){const d=e.minHeight?e.minHeight:1,h=e.minWidth?e.minWidth:1;u.value&&c.value&&v.value&&s.value&&(u.value.height<d&&(u.value.height=d,v.value.n&&r.value&&(c.value.y=r.value.y+(s.value.height-d))),u.value.width<h&&(u.value.width=h,v.value.w&&r.value&&(c.value.x=r.value.x+(s.value.width-h))),e.maxHeight&&u.value.height>e.maxHeight&&(u.value.height=e.maxHeight,r.value&&v.value.n&&(c.value.y=r.value.y+(s.value.height-e.maxHeight))),e.maxWidth&&u.value.width>e.maxWidth&&(u.value.width=e.maxWidth,v.value.w&&r.value&&(c.value.x=r.value.x+(s.value.width-e.maxWidth))))}function w(){if(l.value){const d=p.value;if(c.value&&u.value&&v.value&&s.value){const h=d.width-d.pr-d.deltaL-d.translateX-c.value.x,k=d.height-d.pb-d.deltaT-d.translateY-c.value.y;v.value.n&&c.value.y+d.translateY<0&&r.value&&(c.value.y=-d.translateY,u.value.height=s.value.height+r.value.y+d.translateY),v.value.w&&c.value.x+d.translateX<0&&r.value&&(c.value.x=-d.translateX,u.value.width=s.value.width+r.value.x+d.translateX),u.value.width>h&&(u.value.width=h),u.value.height>k&&(u.value.height=k)}}}function N(d){if(!i.value||!s.value||!r.value||!v.value)return;d.subtract(i.value);const h=d.x,k=d.y;v.value.n?(c.value.y=r.value.y+k,u.value.height=s.value.height-k):v.value.s&&(u.value.height=s.value.height+k),v.value.e?u.value.width=s.value.width+h:v.value.w&&(u.value.width=s.value.width-h,c.value.x=r.value.x+h),w(),F(),I()}function f(d){if(!g.value)return;const h=R.fromEvent(d);h&&N(h)}function C(){if(a.value){const{width:d,height:h,x:k,y:x}=a.value.getBoundingClientRect(),j=R.getTransformInfo(a.value);return{size:{width:d,height:h},position:{x:k-j.x,y:x-j.y}}}return null}function z(d){if(a.value){const h=C();M.value=h}i.value=void 0,s.value=null,r.value=null,u.value=null,c.value=null,v.value=null,g.value=null,document.removeEventListener("mousemove",f),document.removeEventListener("mouseup",z)}function P(){document.addEventListener("mousemove",f),document.addEventListener("mouseup",z)}function m(d){d instanceof MouseEvent&&d.button===2||T.value&&(document.body.click(),d.stopPropagation(),d.preventDefault(),i.value=R.fromEvent(d),g.value=d.target,V(d),P())}function S(d){return a.value=d,y.value&&t.createVNode(t.Fragment,null,[t.createVNode("div",{class:"fv-resizable-handle fv-resizable-n",type:"n",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-e",type:"e",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-s",type:"s",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-w",type:"w",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-ne",type:"ne",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-se fv-resizable-diagonal",type:"se",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-sw",type:"sw",onMousedown:h=>m(h)},null),t.createVNode("div",{class:"fv-resizable-handle fv-resizable-nw",type:"nw",onMousedown:h=>m(h)},null)])}function $(d=!0){document.body.click();const h=l.value||document.body,k=W.getCurrent(h),x=a.value;d&&x&&(b.value=C(),b.value.transform=x.style.transform),k&&x&&(u.value=k,u.value.height-=14,u.value.width-=14,x.style.height=u.value.height+"px",x.style.width=u.value.width+"px",x.style.left="7px",x.style.top="7px",x.style.transform="",M.value={size:u.value,position:{x:0,y:0}},T.value=!1,E.value=!0)}function q(){var d,h;if(document.body.click(),b.value){const k={width:b.value.size.width||0,height:b.value.size.height||0},x={x:(window.innerWidth-k.width)/2,y:(window.innerHeight-k.height)/2};(d=u.value)==null||d.set(k),(h=c.value)==null||h.set(x);const j=a.value;j.style.height=k.height+"px",j.style.width=k.width+"px",j.style.left=`${x.x}px`,j.style.top=`${x.y}px`,j.style.transform="",M.value={size:k,position:x},T.value=e.draggable,E.value=!1}}function G(){if(a.value){const d=W.getCurrent(a.value);if(d){const{width:h,height:k}=d;a.value.style.left=`${(window.innerWidth-h)/2}px`,a.value.style.top=`${(window.innerHeight-k)/2}px`,a.value.style.transform=""}}}function K(){const d=()=>{E.value?$(!1):G(),document.body.click()};return window.addEventListener("resize",d),()=>{window.removeEventListener("resize",d)}}const _=K();return{renderResizeBar:S,boundingElement:l,resizedEventParam:M,maximize:$,restore:q,allowDrag:T,isMaximized:E,unWindowResizeHandle:_}}function pe(e,n,a){const l=t.ref(),i=t.ref(e.draggable),s=t.ref(e.lockAxis),r=t.ref(),u=t.ref(),c=t.ref(!1),v=t.ref(new R(0,0)),g=t.ref(new R(0,0)),p=t.ref(new R(0,0)),M=t.ref(new R(0,0));t.watch(()=>a.value,f=>{r.value.style.cursor=f?"move":"default"});function y(f,C){if(C.tagName==="BUTTON")return!1;if(C===f)return!0;for(const z in C.children)if(Object.prototype.hasOwnProperty.call(C.children,z)&&y(f,C.children[z]))return!0;return!1}function b(){var P,m;let f=p.value.x+g.value.x,C=p.value.y+g.value.y;s.value==="x"?(f=((P=v.value)==null?void 0:P.x)||0,p.value.x=0):s.value==="y"&&(C=((m=v.value)==null?void 0:m.y)||0,p.value.y=0);const z=`translate3d(${Math.round(f)}px, ${Math.round(C)}px, 0px)`;l.value&&(l.value.style.transform=z),M.value.x=f,M.value.y=C}function T(){if(!u.value||!l.value)return null;const f=u.value.getBoundingClientRect(),C=l.value.getBoundingClientRect(),z={top:f.top<C.top,right:f.right>C.right,bottom:f.bottom>C.bottom,left:f.left<C.left};return z.top||(p.value.y-=C.top-f.top),z.bottom||(p.value.y-=C.bottom-f.bottom),z.right||(p.value.x-=C.right-f.right),z.left||(p.value.x-=C.left-f.left),b(),z}function E(f){f&&(v.value&&f.subtract(v.value),p.value.set(f),b(),T())}function O(f){c.value&&i.value&&(f.stopPropagation(),f.preventDefault(),E(R.fromEvent(f,r.value)))}function V(){var f;c.value&&(c.value=!1,g.value.add(p.value),p.value.reset(),(f=l.value)==null||f.classList.remove("ng-dragging"),n.emit("stopMove"),document.removeEventListener("mousemove",O),document.removeEventListener("mouseup",V))}function I(){!c.value&&r.value&&(c.value=!0,r.value.classList.add("ng-dragging"),document.addEventListener("mousemove",O),document.addEventListener("mouseup",V))}function F(){if(l.value){const f=R.getTransformInfo(l.value);g.value.set(f);return}g.value.reset()}function w(f){if(!a.value||f instanceof MouseEvent&&f.button===2)return;const C=f.target||f.srcElement;r.value!==void 0&&C&&!y(C,r.value)||i.value!==!1&&(document.body.click(),f.stopPropagation(),f.preventDefault(),v.value=R.fromEvent(f,l.value),F(),I())}function N(f,C,z){if(i.value&&C){if(f)r.value=f;else if(e.dragHandle){if(e.dragHandle instanceof HTMLElement)r.value=e.dragHandle;else if(typeof e.dragHandle=="string"){const P=C.querySelector(e.dragHandle);P&&(r.value=P)}}l.value=C,u.value=z,r.value?(r.value.classList.add("ng-draggable"),r.value.addEventListener("mousedown",w)):i.value=!1}}return{registerDraggle:N,resetTranslate:F}}function ne(e,n){if(e){const a=l=>{l.key.toLowerCase()===e.toLowerCase()&&n({event:l,key:e})};return document.addEventListener("keydown",a),()=>{document.removeEventListener("keydown",a)}}}function ye(e,n){const a=t.ref(e.enableEsc);let l=null;return a.value?(l=ne("Escape",i=>{n.emit("esc",{event:i.event,type:"esc"})}),{remove:l}):null}function be(e,n){const a=t.ref(e.enableEnter);let l=null;return a.value?(l=ne("Enter",i=>{n.emit("enter",{event:i.event,type:"enter"})}),{remove:l}):null}const Y=t.defineComponent({name:"FModal",props:ve,emits:["update:modelValue","accept","cancel","closed","resize","esc","enter","stopMove"],setup(e,n){const a=t.ref(e.width||300),l=t.ref(e.height||200),i=t.ref(e.modelValue),s=t.ref(""),r=t.ref(e.class),u=t.ref(e.fitContent),c=t.ref(e.showHeader),v=t.ref(""),g=t.ref(e.showCloseButton),p=t.ref(e.showMaxButton),M=t.ref(!1),y=t.ref(e.dialogType),b=t.ref(e.src),T=t.ref(""),E=t.ref(e.showButtons),O=t.ref(e.title),V=t.ref(e.containment||null),I=t.ref(),F=t.ref(!1);function w(o,B){Promise.resolve().then(()=>{var L;return(L=e.beforeClose)==null?void 0:L.call(e)}).then(L=>{L&&(i.value=!1,n.emit("update:modelValue",!1),B!=null&&n.emit(B?"accept":"cancel"),n.emit("closed",o))})}const N=[{name:"cancel",text:"取消",class:"btn btn-secondary",handle:o=>{w(o,!1)}},{name:"accept",text:"确定",class:"btn btn-primary",handle:o=>{w(o,!0)}}],f=t.ref(e.buttons&&e.buttons.length?e.buttons:N),C=t.computed(()=>!!v.value),z=t.computed(()=>!!E.value&&!!f.value),P=t.ref(),m=t.ref(),S=t.ref(!1),{renderResizeBar:$,maximize:q,restore:G,boundingElement:K,resizedEventParam:_,allowDrag:d,unWindowResizeHandle:h}=ge(e),{registerDraggle:k}=pe(e,n,d);function x(){return!!document.querySelectorAll(".farris-modal").length&&document.body.classList.contains("modal-open")}function j(){const o=document.querySelectorAll(".farris-modal").length;(!o||o-1<=0)&&document.body.classList.remove("modal-open"),I.value&&I.value.classList.remove("show")}t.watch(()=>e.title,(o,B)=>{o!==B&&(O.value=o)}),t.watch(()=>e.modelValue,(o,B)=>{o!==B&&(i.value=o,i.value&&e.draggable&&t.nextTick(()=>{m.value&&!V.value&&(V.value=m.value.parentElement,K.value=V.value,k(P.value,m.value,K.value))}),o||(V.value&&(V.value=null),j())),i.value&&(F.value=x())}),t.watch(()=>e.showHeader,(o,B)=>{o!==B&&(c.value=o)}),t.watch(()=>e.showButtons,(o,B)=>{o!==B&&(E.value=o)}),t.watch(()=>_.value,(o,B)=>{const L=o||{},A=B||{};JSON.stringify(L)!==JSON.stringify(A)&&n.emit("resize",{newSize:o,oldSize:B,isMaximized:S.value})});const J=t.computed(()=>(i.value&&document.body.classList.add("modal-open"),i.value)),ze=t.computed(()=>{var L;const o={modal:!0,"farris-modal":!0,fade:!0};o["f-modal-fitContent"]=!!u.value,o.show=!!J.value;const B=(L=e.maskClass)==null?void 0:L.split(" ");return B==null||B.reduce((A,ee)=>(A[ee]=!0,A),o),o}),Pe=t.computed(()=>{var L;const o={"modal-dialog":!0},B=(L=r.value)==null?void 0:L.split(" ");return B==null||B.reduce((A,ee)=>(A[ee]=!0,A),o),o}),Ie=t.computed(()=>{const o={position:"absolute",top:`${(window.innerHeight-l.value)/2}px`,left:`${(window.innerWidth-a.value)/2}px`,width:`${a.value}px`,height:u.value?"auto":`${l.value}px`};return e.mask||(o.pointerEvents="auto"),o}),Se=t.computed(()=>{const o={display:"block"};return e.mask||(o.pointerEvents="none",o.backgroundColor="transparent"),F.value&&(o.backgroundColor="transparent"),o}),Re=t.computed(()=>({"modal-content":!0,"modal-content-has-header":c.value})),He=t.computed(()=>{const o={display:c.value?"":"none"};return o["pointer-events"]=d.value?"auto":"none",o}),je=t.computed(()=>({"f-icon":!0,modal_maximize:!0,modalrevert:S.value})),Le=t.computed(()=>({"modal-body":!0,"f-utils-flex-column":y.value==="iframe","f-utils-fill":!0}));function Fe(){return{height:`${e.footerHeight||60}px`}}const We=t.computed(()=>{const o={textAlgin:T.value},B=Fe();return Object.assign(o,B)});function se(o){if(o.stopPropagation(),S.value){S.value=!1,G();return}q(),S.value=!0}async function De(o,B){o.handle&&await o.handle(B,o)&&n.emit("closed",B)}function Ae(o){o.width&&(a.value=o.width),o.height&&(l.value=o.height),o.buttons&&(f.value=o.buttons),o.title&&(O.value=o.title)}let Q=null,Z=null;t.onBeforeMount(()=>{F.value=x()}),t.onMounted(()=>{m.value&&!V.value&&(V.value=m.value.parentElement,K.value=V.value,k(P.value,m.value,K.value)),J.value&&document.body.classList.add("modal-open"),Q=ye(e,n),Z=be(e,n)}),t.onUnmounted(()=>{h&&h(),Q&&Q.remove(),Z&&Z.remove()}),n.expose({modalElementRef:m,updateModalOptions:Ae,close:w,maxDialog:se,isMaximized:S});function Ue(){return t.createVNode("ul",null,[M.value&&t.createVNode("li",{class:"f-btn-icon f-bare"},[t.createVNode("span",{class:"f-icon modal_minimize"},null)]),p.value&&t.createVNode("li",{onClick:se,class:"f-btn-icon f-bare",style:"pointer-events: auto;"},[t.createVNode("span",{class:je.value},null)]),g.value&&t.createVNode("li",{class:"f-btn-icon f-bare",onClick:o=>w(o,!1),style:"pointer-events: auto;"},[t.createVNode("span",{class:"f-icon modal_close"},null)])])}function Xe(){return t.createVNode("div",{class:"modal-footer",style:We.value},[f.value&&f.value.map(o=>{const B=t.ref(o.disabled);return t.createVNode("button",{name:o.name,type:"button",disabled:B.value,class:o.class+(o.iconClass?" btn-icontext":""),onClick:L=>{De(o,L)}},[!!o.iconClass&&t.createVNode("i",{class:o.iconClass},null),o.text])})])}function Ke(){return t.createVNode("div",{ref:P,class:"modal-header",style:He.value},[n.slots.headerTemplate?n.slots.headerTemplate():t.createVNode("div",{class:"modal-title"},[C.value&&t.createVNode("span",{class:v.value,style:"margin-right: 8px"},null),t.createVNode("span",{class:"modal-title-label"},[O.value])]),t.createVNode("div",{class:"actions"},[Ue()])])}function Ye(){return n.slots.footerTemplate?n.slots.footerTemplate():z.value&&Xe()}function $e(o){if(o.stopPropagation(),e.allowClickMaskToClose){if(o.target!==I.value)return;w(o,!1)}}function qe(){var o,B;return t.createVNode("div",{id:s.value,class:Pe.value,style:Ie.value,ref:m},[t.createVNode("div",{class:Re.value},[c.value&&Ke(),t.createVNode("div",{class:Le.value},[(B=(o=n.slots).default)==null?void 0:B.call(o),y.value==="iframe"&&t.createVNode("iframe",{title:s.value,class:"f-utils-fill",width:"100%",frameborder:"0",src:b.value},null)]),Ye()]),!u.value&&m.value&&!S.value&&$(m.value)])}return()=>t.createVNode(t.Teleport,{to:"body"},{default:()=>[J.value&&t.createVNode(t.Transition,{name:"fade",appear:!0},{default:()=>[t.createVNode("div",{ref:I,class:ze.value,style:Se.value,onClick:$e},[qe()])]})]})}});function ae(e){if(e.content&&e.content.render)return e.content.render;if(e.render&&typeof e.render=="function")return e.render}function we(e){const n=document.createElement("div");n.style.display="contents";const a=t.createApp({setup(l,i){t.onUnmounted(()=>{document.body.removeChild(n)});const s=t.ref(),r=t.ref(e.class||""),u=t.ref(!!e.showButtons),c=t.ref(!!e.showHeader),v=t.ref(e.showCloseButton==null?!0:e.showCloseButton),g=t.ref(!0),p=t.ref(e.title||""),M=e.acceptCallback||(()=>{}),y=e.rejectCallback||(()=>{}),b=e.closedCallback||(I=>{}),T=e.resizeHandle||(I=>{}),E=e.stopMoveHandle||(I=>{}),O=ae(e),V=I=>{g.value=!1,a.unmount(),b(I)};return t.onMounted(()=>{}),i.expose({modalRef:s}),()=>t.createVNode(Y,{ref:s,class:r.value,modelValue:g.value,"onUpdate:modelValue":I=>g.value=I,title:p.value,width:e.width,height:e.height,buttons:e.buttons,"show-header":c.value,"show-buttons":u.value,"show-close-button":v.value,"show-max-button":!1,onAccept:M,onCancel:y,fitContent:e.fitContent==null?!0:e.fitContent,onClosed:V,onResize:T,onStopMove:E},{default:()=>[O&&O(a)]})}});return document.body.appendChild(n),a.mount(n),a}class Ce{constructor(n){U(this,"appContext",null);U(this,"modalRef",t.ref());U(this,"activeModalIndex",t.ref(0));U(this,"modalRefs",{});U(this,"isUseEscCloseModal",t.ref(!1));U(this,"activeModalInstance",t.computed(()=>this.modalRefs[this.activeModalIndex.value]));this.app=n,this.appContext=n?n._context:null}getCurrentModal(){return this.activeModalInstance.value}adaptToWindow(n,a){const{width:l,height:i}={width:window.innerWidth,height:window.innerHeight};return l<n&&(n=l-14),i<a&&(a=i-14),{width:n,height:a}}static show(n){const a=Object.assign({title:"",showButtons:!0,showHeader:!0},n);return we(a)}close(n){var a,l;n?(l=n.value)==null||l.close():(a=this.getCurrentModal())==null||a.close()}open(n){const a=document.createDocumentFragment();n.showMaxButton&&n.fitContent&&(n.showMaxButton=!1);const l=t.shallowRef(Object.assign({title:"",showButtons:!0,showHeader:!0},n)),i=t.ref(!0),s=l.value.acceptCallback||(()=>{}),r=l.value.rejectCallback||(()=>{}),u=l.value.closedCallback||((w,N)=>{}),c=l.value.resizeHandle||(w=>{}),v=n.stopMoveHandle||(w=>{});let g;const p=ae(l.value),M=w=>{var f;i.value=!1;const N=(f=w==null?void 0:w.target)==null?void 0:f.classList.contains("modal_close");u(w,this.isUseEscCloseModal.value?"esc":N?"icon":"button")},y=w=>{M(w),g&&t.nextTick(()=>{if(this.modalRefs[this.activeModalIndex.value]&&delete this.modalRefs[this.activeModalIndex.value],t.render(null,a),g=null,this.modalRef.value=null,this.modalRefs){const N=Object.keys(this.modalRefs).map(f=>Number(f));N.length>0?this.activeModalIndex.value=Math.max(...N):this.activeModalIndex.value=0}this.isUseEscCloseModal.value=!1})},b=w=>{var N;this.isUseEscCloseModal.value=!0,this.activeModalInstance&&((N=this.activeModalInstance.value)==null||N.close(w==null?void 0:w.event))},{width:T,height:E}=l.value,O=this.adaptToWindow(T||500,E||320);Object.assign(l.value,O);const V=()=>t.createVNode(Y,t.mergeProps({ref:this.modalRef,modelValue:i.value,"onUpdate:modelValue":w=>i.value=w},l.value,{onAccept:s,onCancel:r,onClosed:y,onResize:c,onEsc:b,onStopMove:v}),{default:()=>[p&&p(this.app)]});return g=(w=>{const N=t.h(V,w);return N.appContext=this.appContext,t.render(N,a),N})({...l.value}),this.activeModalIndex.value++,this.modalRefs[this.activeModalIndex.value]=this.modalRef.value,{update:w=>{l.value={...l.value,...w},g&&t.render(t.cloneVNode(g,{...l}),a)},destroy:y,modalRef:this.activeModalInstance,close:this.close}}}const le=Symbol("FModalService");Y.install=e=>{e.component(Y.name,Y);const n=new Ce(e);e.provide(le,n),e.provide("FModalService",n)};function oe(e,n){function a(){const l=e.beforeOpen||e.beforeClickButton||null;let i=Promise.resolve(!0);if(l){const s=l(n.value);if(typeof s>"u")return i;typeof s=="boolean"?i=Promise.resolve(s):i=s}return i}return{judgeCanOpen:a}}function xe(e,n,a,l,i){const s=t.ref(e.buttonBehavior),r=t.ref(e.popupOnInput),u=t.computed(()=>({"input-group-append":!0,"append-force-show":e.showButtonWhenDisabled&&(e.readonly||e.disable)})),{judgeCanOpen:c}=oe(e,i),v=t.computed(()=>e.showButtonWhenDisabled||(!e.editable||!e.readonly)&&!e.disable),g=t.inject(le,null),p=t.ref();async function M(T){if(await c()&&v.value){const E=!!n.slots.default;if(s.value==="Modal"){const O=e.modalOptions,V=g==null?void 0:g.open({...O,render:()=>n.slots.default&&n.slots.default()});p.value=V==null?void 0:V.modalRef}s.value==="Overlay"&&me.show({host:document.body,backgroundColor:"rgba(0,0,0,.15)",render:()=>n.slots.default&&n.slots.default()}),E&&s.value==="Popup"&&l.togglePopup(!0),E&&r.value&&l.hidePopup(),n.emit("clickButton",{origin:T,value:e.modelValue})}}function y(T){n.emit("mouseEnterIcon",T)}function b(T){n.emit("mouseLeaveIcon",T)}return{buttonGroupClass:u,onClickButton:M,onMouseEnterButton:y,onMouseLeaveButton:b,modalRef:p}}function Be(e,n,a,l,i,s){const r=t.ref(!1),u=t.computed(()=>e.enableClear&&!e.readonly&&!e.disable),{changeTextBoxValue:c,hasClearClass:v}=s;function g(b){r.value=b,v.value=b}t.watch(i,()=>{g(!!i.value)});function p(b){const T=!e.readonly&&!e.disable&&e.editable,E=!e.editable;b.stopPropagation(),(T||E)&&(c(""),g(!r.value),n.emit("clear"))}function M(b){if(u.value){if(!a.value){g(!1);return}!e.disable&&!e.readonly&&g(!0)}}function y(b){u.value&&g(!1)}return{enableClearButton:u,showClearButton:r,onClearValue:p,onMouseEnterTextBox:M,onMouseLeaveTextBox:y}}function Me(e,n,a,l,i){const s=t.computed(()=>e.popupOnInput),r=t.computed(()=>e.popupOnFocus),{shouldPopupContent:u,closeAllPopover:c}=i,v=t.ref(!1),g=t.computed(()=>e.enableTitle?a.value:""),p=t.computed(()=>(e.disable||e.readonly)&&!e.forcePlaceholder?"":e.placeholder),M=t.computed(()=>e.readonly||!e.editable),y=t.ref(!1),b=t.computed(()=>!e.disable&&y.value),T=t.computed(()=>({"text-left":e.textAlign==="left","text-center":e.textAlign==="center","text-right":e.textAlign==="right","form-control":!0,"f-utils-fill":!0})),E=t.computed(()=>({"input-group":!0,"f-state-disabled":e.disable,"f-state-editable":e.editable&&!e.disable&&!e.readonly,"f-state-readonly":e.readonly&&!e.disable,"f-state-focus":b.value,"input-group--has-clear":e.enableClear&&v.value}));function O(m,S=!0){a.value=m,S&&(n.emit("change",m),n.emit("update:modelValue",m))}function V(m){u.value=!1,O(m,!0)}t.watch(()=>e.modelValue,m=>{a.value=m});function I(m){y.value=!1,n.emit("blur",m),m.stopPropagation()}function F(m){n.emit("click",m),c(),n.slots.default&&!e.disable&&!e.readonly&&e.popupOnClick&&i.togglePopup()}function w(m){e.disable||(y.value=!0,M.value||(n.emit("focus",m),r.value&&!u.value&&i.popup()))}function N(m){n.emit("input",m.target.value);const S=m.target.value;l.value=S,a.value!==S&&O(S,e.updateOn==="change"),s.value&&!u.value&&i.popup()}function f(m){m.target.tagName!=="INPUT"&&m.preventDefault(),m.stopPropagation()}function C(m){n.emit("keydown",m)}function z(m){m.key==="Enter"&&(s.value||r.value)&&i.hidePopup(),n.emit("keyup",m)}function P(m){const S=m.target.value;m.stopPropagation(),O(S)}return{hasFocusedTextBox:b,isTextBoxReadonly:M,textBoxClass:T,textBoxPlaceholder:p,textBoxTitle:g,inputGroupClass:E,hasClearClass:v,changeTextBoxValue:O,commitValue:V,onBlurTextBox:I,onClickTextBox:F,onFocusTextBox:w,onInput:N,onKeyDownTextBox:C,onKeyUpTextBox:z,onMouseDownTextBox:f,onTextBoxValueChange:P}}const D="FarrisVue_PopoverInstancesKey";function ke(e,n,a,l){const i=t.ref(),s=t.ref(!1),{judgeCanOpen:r}=oe(e,l);t.watch(()=>i.value,(y,b)=>{window[D]=window[D]||new WeakMap,y?window[D].set(a.value,y):window[D].delete(a.value)});function u(){if(window[D]){const y=window[D];document.querySelectorAll(".f-button-edit,.v-popover").forEach(b=>{y.get(b)&&b!==a.value&&y.get(b).hide()})}}function c(){const y=i.value;y&&y.show(a.value)}async function v(y=!1){if(!!n.slots.default){if(!y&&!s.value&&!await r())return;s.value=!s.value,await t.nextTick(),c()}}async function g(y=!1){if(!!n.slots.default){if(!y&&!await r())return;s.value=!0,await t.nextTick(),c()}}function p(){s.value=!1}function M(){s.value=!0,t.nextTick(()=>{c()})}return{hidePopup:p,showPopup:M,popup:g,shouldPopupContent:s,togglePopup:v,popoverRef:i,closeAllPopover:u}}function Te(e,n,a){const l=t.ref(),{isTextBoxReadonly:i,textBoxClass:s,textBoxPlaceholder:r,textBoxTitle:u,onBlurTextBox:c,onClickTextBox:v,onFocusTextBox:g,onInput:p,onKeyDownTextBox:M,onKeyUpTextBox:y,onMouseDownTextBox:b,onTextBoxValueChange:T}=a;return t.onMounted(()=>{var E,O;e.selectOnCreated&&((E=l.value)==null||E.select()),e.focusOnCreated&&((O=l.value)==null||O.focus({preventScroll:!0}))}),()=>t.createVNode("input",{ref:l,name:"input-group-value",autocomplete:e.autoComplete?"on":"off",class:s.value,disabled:e.disable,maxlength:e.maxLength,minlength:e.minLength,placeholder:r.value,readonly:i.value,tabindex:e.tabIndex,title:u.value,type:e.inputType,value:n.value,onBlur:c,onChange:T,onClick:v,onFocus:g,onInput:p,onKeydown:M,onKeyup:y,onMousedown:b},null)}function Ee(e,n,a){const l=t.ref(e.separator),{changeTextBoxValue:i}=a,s=t.computed(()=>e.readonly||e.disable),r=t.computed(()=>n.value?n.value.split(l.value).map(c=>({name:c,selectable:!0})):[]);function u(c){i(c.map(v=>v.name).join(l.value),!0)}return()=>t.createVNode(X,{id:`${e.id}-tag-editor`,class:"form-control",data:r.value,showClose:!s.value,disable:s.value,showInput:!0,onChange:u},null)}function Oe(e,n,a,l){const{buttonGroupClass:i,onClickButton:s,onMouseEnterButton:r,onMouseLeaveButton:u}=a,{enableClearButton:c,showClearButton:v,onClearValue:g}=l,p=t.ref();return{renderButtonGroup:()=>t.createVNode("div",{id:`${e.id}-button-group`,class:i.value},[c.value&&t.withDirectives(t.createVNode("span",{class:"input-group-text input-group-clear",onClick:g},[t.createVNode("i",{class:"f-icon modal_close"},null)]),[[t.vShow,v.value]]),n.slots.buttonContent?t.createVNode("span",{class:"input-group-text input-group-append-button",onClick:s,onMouseenter:r,onMouseleave:u},[n.slots.buttonContent()]):e.buttonContent?t.createVNode("span",{class:"input-group-text input-group-append-button",innerHTML:e.buttonContent,ref:p,onClick:s,onMouseenter:r,onMouseleave:u},null):null]),buttonHandleElement:p}}function Ve(e,n,a){const l=t.ref(e.popupMinWidth),{hidePopup:i,popoverRef:s}=a;return()=>t.createVNode(ie,{id:`${e.id}-popover`,ref:s,placement:e.placement,host:e.popupHost,"keep-width-with-reference":e.keepWidthWithReference,fitContent:!0,"right-boundary":e.popupRightBoundary,minWidth:l.value,class:e.popupClass,offsetX:e.popupOffsetX,onHidden:i},{default:()=>{var r,u;return[(u=(r=n.slots).default)==null?void 0:u.call(r)]}})}const ue=t.defineComponent({name:"FButtonEdit",props:te,emits:["updateExtendInfo","clear","change","click","clickButton","blur","focus","mouseEnterIcon","mouseLeaveIcon","keyup","keydown","inputClick","input","update:modelValue"],setup(e,n){const a=t.ref(),l=t.ref(e.customClass),i=t.ref(e.modelValue),s=ke(e,n,a,i),{shouldPopupContent:r,hidePopup:u,showPopup:c,togglePopup:v}=s,g=xe(e,n,a,s,i),p=t.ref(""),M=Me(e,n,i,p,s),{hasFocusedTextBox:y,commitValue:b,inputGroupClass:T}=M,E=Be(e,n,i,y,p,M),{onMouseEnterTextBox:O,onMouseLeaveTextBox:V}=E,I=t.computed(()=>{const P={"f-button-edit":!0,"f-cmp-inputgroup":!0,"f-button-edit-nowrap":!e.wrapText};return l.value&&l.value.split(" ").reduce((m,S)=>(m[S]=!0,m),P),P});function F(){return e.multiSelect&&e.inputType==="tag"?Ee(e,i,M):Te(e,i,M)}let w=F();t.watch([()=>e.multiSelect,()=>e.inputType],()=>{w=F()});const{renderButtonGroup:N,buttonHandleElement:f}=Oe(e,n,g,E),C=Ve(e,n,s),z={commitValue:b,elementRef:a,hidePopup:u,showPopup:c,popoverRef:s.popoverRef,shouldPopupContent:r,togglePopup:v,openDialog:()=>{f.value&&e.buttonBehavior==="Modal"&&f.value.click()},getModal:()=>{var P;return e.buttonBehavior==="Modal"?(P=g.modalRef.value)==null?void 0:P.value:null}};return t.onMounted(()=>{a.value.componentInstance=z,window.onresize=()=>{document.body.click()}}),t.onBeforeUnmount(()=>{var P;window.onresize=null,(P=window[D])==null||P.delete(a.value)}),n.expose(z),()=>t.createVNode(t.Fragment,null,[t.createVNode("div",t.mergeProps(n.attrs,{ref:a,class:I.value,id:e.id}),[t.createVNode("div",{id:`${e.id}-input-group`,class:T.value,onMouseenter:O,onMouseleave:V},[w(),N()])]),r.value&&C()])}}),Ne=re.withInstall(ue);H.FButtonEdit=ue,H.buttonEditProps=te,H.default=Ne,Object.defineProperties(H,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});