import{booleanType as e,objectType as t,someType as n}from"../_util/type.mjs";import r from"../_util/classNames.mjs";import i from"../_util/PortalWrapper.mjs";import a from"../_util/hooks/useId.mjs";import{Fragment as o,createVNode as s,defineComponent as c}from"vue";var l={fill:`transparent`,"pointer-events":`auto`},u=c({name:`TourMask`,props:{prefixCls:{type:String},pos:t(),rootClassName:{type:String},showMask:e(),fill:{type:String,default:`rgba(0,0,0,0.5)`},open:e(),animated:n([Boolean,Object]),zIndex:{type:Number}},setup(e,{attrs:t}){let n=a();return()=>{let{prefixCls:a,open:c,rootClassName:u,pos:d,showMask:f,fill:p,animated:m,zIndex:h}=e,g=`${a}-mask-${n}`,_=typeof m==`object`?m?.placeholder:m;return s(i,{visible:c,autoLock:!0},{default:()=>c&&s(`div`,{...t,class:r(`${a}-mask`,u,t.class),style:[{position:`fixed`,left:0,right:0,top:0,bottom:0,zIndex:h,pointerEvents:`none`},t.style]},[f?s(`svg`,{style:{width:`100%`,height:`100%`}},[s(`defs`,null,[s(`mask`,{id:g},[s(`rect`,{x:`0`,y:`0`,width:`100vw`,height:`100vh`,fill:`white`},null),d&&s(`rect`,{x:d.left,y:d.top,rx:d.radius,width:d.width,height:d.height,fill:`black`,class:_?`${a}-placeholder-animated`:``},null)])]),s(`rect`,{x:`0`,y:`0`,width:`100%`,height:`100%`,fill:p,mask:`url(#${g})`},null),d&&s(o,null,[s(`rect`,{...l,x:`0`,y:`0`,width:`100%`,height:d.top},null),s(`rect`,{...l,x:`0`,y:`0`,width:d.left,height:`100%`},null),s(`rect`,{...l,x:`0`,y:d.top+d.height,width:`100%`,height:`calc(100vh - ${d.top+d.height}px)`},null),s(`rect`,{...l,x:d.left+d.width,y:`0`,width:`calc(100vw - ${d.left+d.width}px)`,height:`100%`},null)])]):null])})}}});export{u as default};