vexip-ui/lib/components/full-screen/full-screen.vue2.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const e=require("vue");require("../portal/index.cjs");const c=require("@vexip-ui/config"),k=require("@vexip-ui/hooks"),q=require("./props.cjs"),C=require("../portal/portal.vue2.cjs"),E=["id"],S=e.defineComponent({name:"FullScreen",__name:"full-screen",props:q.fullScreenProps,setup(w,{expose:_}){const m=w,v=c.useProps("fullScreen",m,{tag:"div"}),n=c.useNameHelper("full-screen"),i=c.useId(),r=e.ref(!1),f=e.ref(),t=e.ref(),s=e.computed(()=>r.value&&t.value),g=e.computed(()=>[n.b(),n.bs("vars"),{[n.bm("full")]:s.value}]),b=e.computed(()=>t.value==="window"?"body":""),{enter:h,exit:x,target:p,full:y}=k.useFullScreen();e.watch(y,l=>{l||(r.value=!1,t.value=void 0)}),e.watch(s,l=>{c.emitEvent(v.onToggle,l)});async function a(l="window",o){r.value&&await u(),l!=="window"&&await h(),r.value=!0,f.value=o,t.value=l!=="window"?"browser":"window"}async function u(){await x(),f.value=void 0,r.value=!1,t.value=void 0}async function d(l="window",o){r.value?t.value!==l?await a(l,o):await u():await a(l,o)}return _({full:s,placeId:i,wrapper:p,enter:a,exit:u,toggle:d}),(l,o)=>(e.openBlock(),e.createBlock(e.unref(C),{to:b.value},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(v).tag||"div"),e.mergeProps(l.$attrs,{ref_key:"wrapper",ref:p,class:g.value,style:{[e.unref(n).cv("z-index")]:f.value}}),{default:e.withCtx(()=>[e.renderSlot(l.$slots,"default",{full:s.value,placeId:e.unref(i),enter:a,exit:u,toggle:d}),e.createElementVNode("div",{id:e.unref(i),class:e.normalizeClass(e.unref(n).be("place")),role:"none"},null,10,E)]),_:3},16,["class","style"]))]),_:3},8,["to"]))}});module.exports=S;
//# sourceMappingURL=full-screen.vue2.cjs.map