2 lines
6.0 KiB
JavaScript
2 lines
6.0 KiB
JavaScript
import{_ as I,i as F,c as z,o as x,b,x as k,a as B,j as S,s as D,z as H,T as X,p as Y,E as _,d as E,G as $,e as f,w as L,f as R,H as M,k as T}from"./main-D6qyxymd.js";const N={props:{content:{type:Object,required:!0},wwFrontState:{type:Object,required:!0}},data(){return{dropdownSize:0}},setup(e){const t=wwLib.getFrontDocument().querySelector("#app"),d=E(()=>!1),i=$("triggerElement"),s=$("dropdownElement"),o=f({}),l=()=>{if(!(i!=null&&i.value))return;const n=i.value.getBoundingClientRect();o.value={left:n.left,right:n.right,top:n.top,bottom:n.bottom,width:n.width,height:n.height}};function r(n){e.content.disabled||e.content.triggerType==="hover"&&e.wwFrontState.screenSize==="default"||s.value&&s.value.contains(n.target)||i.value&&i.value.contains(n.target)||(u.value=!1)}const u=f(!1),g=E(()=>u.value||e.content.forceDisplayEditor&&d.value),p=f(g.value),m=f(!g.value),w=f(null);let h=null,c=[];function C(n){c=[];let a=n.parentNode;for(;a&&a!==wwLib.getFrontDocument().body;){const v=wwLib.getFrontWindow().getComputedStyle(a);/(auto|scroll|overlay)/.test(v.overflow+v.overflowY+v.overflowX)&&c.push(a),a=a.parentNode}c.push(wwLib.getFrontWindow())}function O(){l(),wwLib.getFrontDocument().addEventListener("click",r),h=new ResizeObserver(n=>{const a=n[0];o.value.width=a.contentRect.width,o.value.height=a.contentRect.height}),h.observe(i.value),C(i.value),c.forEach(n=>{n.addEventListener("scroll",l,{passive:!0}),wwLib.getFrontWindow().addEventListener("resize",l)})}function y(){wwLib.getFrontDocument().removeEventListener("click",r),h==null||h.disconnect(),c.forEach(n=>{n.removeEventListener("scroll",l),wwLib.getFrontWindow().removeEventListener("resize",l)}),c=[]}return L(g,n=>{n?(O(),m.value=!1,T(()=>{p.value=!0})):(y(),p.value=!1,T(()=>{setTimeout(()=>{m.value=!0},250)}))}),R(()=>{g.value&&O()}),M(()=>{y(),clearTimeout(w.value)}),L(()=>e.content.triggerType,(n,a)=>{n!==a&&(u.value=!1,clearTimeout(w.value))}),{appDiv:t,synchronizeTriggerBox:l,triggerBox:o,isOpened:u,timeoutId:w,isEditing:d,isDisplayed:g,delayedIsClosed:m,delayedIsOpen:p}},computed:{style(){const e={},t=this.content.position,d=this.content.alignment,i=this.content.offsetX!==void 0?this.content.offsetX:"0px",s=this.content.offsetY!==void 0?this.content.offsetY:"0px";switch(t){case"top":e.bottom=`calc(100% - ${this.triggerBox.bottom}px + ${this.triggerBox.height}px + ${s})`;break;case"bottom":e.top=`calc(${this.triggerBox.top}px + ${this.triggerBox.height}px + ${s})`;break;case"left":e.right=`calc(100% - ${this.triggerBox.right}px + ${this.triggerBox.width}px + ${i})`;break;case"right":e.left=`calc(${this.triggerBox.left}px + ${this.triggerBox.width}px + ${i})`;break}if(this.content.animated)switch(t){case"top":e["--slideOriginY"]=s;break;case"bottom":e["--slideOriginY"]=`calc(-1 * ${s})`,e["--slideOriginX"]="0px";break;case"left":e["--slideOriginX"]=i,e["--slideOriginY"]="0px";break;case"right":e["--slideOriginX"]=`calc(-1 * ${i})`,e["--slideOriginY"]="0px";break}switch(d){case"start":t==="top"||t==="bottom"?(this.content.animated&&(e["--transformOrigin"]=this.getOppositeSide(t)+" left"),e.left=`calc(${i} + ${this.triggerBox.left}px)`,e["--slideOriginX"]="-"+i):(this.content.animated&&(e["--transformOrigin"]="top "+this.getOppositeSide(t)),e.top=`calc(${this.triggerBox.top}px + ${s})`);break;case"center":t==="top"||t==="bottom"?(this.content.animated&&(e["--transformOrigin"]=this.getOppositeSide(t)+" center"),e.left=`calc(${i} + ${this.triggerBox.left}px)`,e.transform=`translateX( calc(-50% + (${this.triggerBox.width}px / 2) + ${i}))`,e["--slideOriginX"]="0px"):(this.content.animated&&(e["--transformOrigin"]="center "+this.getOppositeSide(t)),e.top=`calc(${this.triggerBox.top}px + ${s})`,e.transform=`translateY(calc(-50% + (${this.triggerBox.height}px / 2) + ${s}))`,e["--slideOriginY"]=`calc(-0.5 * ((${this.triggerBox.width}px / 2) + ${i}))`);break;case"end":t==="top"||t==="bottom"?(this.content.animated&&(e["--transformOrigin"]="center"),e.right=`calc(100% - ${this.triggerBox.right}px + ${i})`,e["--slideOriginX"]=i):(this.content.animated&&(e["--transformOrigin"]="bottom "+this.getOppositeSide(t)),e.bottom=`calc(100% - ${this.triggerBox.bottom}px + ${s})`);break}return e["z-index"]=this.content.dropdownZIndex||"unset",e}},methods:{handleClick(){(this.content.triggerType==="click"||this.wwFrontState.screenSize!=="default"&&!this.isEditing)&&(this.content.disabled||(this.isOpened=!this.isOpened))},closeDropdown(){this.isOpened=!1},handleHoverIn(){this.content.triggerType==="hover"&&this.wwFrontState.screenSize==="default"&&!this.isEditing&&(clearTimeout(this.timeoutId),this.content.disabled||(this.isOpened=!0))},handleHoverOut(){this.content.triggerType==="hover"&&(this.timeoutId=setTimeout(()=>{this.content.disabled||(this.isOpened=!1)},200))},handleRightClick(){(this.content.triggerType==="right-click"||this.wwFrontState.screenSize!=="default"&&!this.isEditing)&&(this.content.disabled||(this.isOpened=!this.isOpened))},getOppositeSide(e){return{top:"bottom",bottom:"top",left:"right",right:"left"}[e]}}},W={style:{position:"relative"}};function P(e,t,d,i,s,o){const l=F("wwLayout");return x(),z("div",W,[b("div",{ref:"triggerElement",onClick:t[0]||(t[0]=(...r)=>o.handleClick&&o.handleClick(...r)),onMouseenter:t[1]||(t[1]=(...r)=>o.handleHoverIn&&o.handleHoverIn(...r)),onMouseleave:t[2]||(t[2]=(...r)=>o.handleHoverOut&&o.handleHoverOut(...r)),onContextmenu:t[3]||(t[3]=D((...r)=>o.handleRightClick&&o.handleRightClick(...r),["prevent"]))},[S(l,{class:"layout content-layout",path:"triggerLayout"})],544),i.delayedIsClosed?B("",!0):(x(),k(_,{key:0,to:i.appDiv},[b("div",{style:Y(o.style),class:"dropdown","ww-responsive":"dropdown",ref:"dropdownElement"},[b("div",{onMouseenter:t[4]||(t[4]=(...r)=>o.handleHoverIn&&o.handleHoverIn(...r)),onMouseleave:t[5]||(t[5]=(...r)=>o.handleHoverOut&&o.handleHoverOut(...r))},[S(X,{name:d.content.animated?"slide":""},{default:H(()=>[i.delayedIsOpen?(x(),k(l,{key:0,path:"dropdownLayout"})):B("",!0)]),_:1},8,["name"])],32)],4)],8,["to"]))])}const q=I(N,[["render",P],["__scopeId","data-v-0fe30e22"]]);export{q as e};
|