t-fighting-design
Version:
Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.
2 lines (1 loc) • 1.82 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),l=require("./index3.js"),p=require("../../close-btn/index.js"),c=require("../../popup/index.js"),u={class:"f-drawer"},m={class:"f-drawer__header"},f={class:"f-drawer__header-title"},k={key:0,class:"f-drawer__body"},h={key:1,class:"f-drawer__footer"},b=e.defineComponent({name:"FDrawer"}),v=e.defineComponent({...b,props:l.Props,emits:l.Emits,setup(d,{emit:i}){const n=d,s=e.ref(n.visible),t=()=>{i("update:visible",!1)};return e.watch(()=>s.value,o=>{o||t()}),e.watch(()=>n.visible,o=>{s.value=o}),(o,r)=>(e.openBlock(),e.createBlock(e.unref(c.FPopup),{visible:s.value,"onUpdate:visible":r[0]||(r[0]=a=>s.value=a),"append-to-body":o.appendToBody,"show-mask":o.showMask,"mask-close":o.maskClose,"z-index":o.zIndex,"mask-blur":o.maskBlur,direction:o.direction,"popup-size":o.size,onOpen:o.open,onOpenEnd:o.openEnd,onClose:o.close,onCloseEnd:o.closeEnd},{default:e.withCtx(()=>[e.createElementVNode("div",u,[e.createElementVNode("header",m,[e.renderSlot(o.$slots,"header",{},()=>[e.createElementVNode("span",f,e.toDisplayString(o.title),1),o.showCloseIcon?(e.openBlock(),e.createBlock(e.unref(p.FCloseBtn),{key:0,icon:o.closeIcon,onClick:t},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"closeIcon")]),_:3},8,["icon"])):e.createCommentVNode("",!0)])]),o.$slots.default?(e.openBlock(),e.createElementBlock("section",k,[e.renderSlot(o.$slots,"default")])):e.createCommentVNode("",!0),o.$slots.footer?(e.openBlock(),e.createElementBlock("footer",h,[e.renderSlot(o.$slots,"footer")])):e.createCommentVNode("",!0)])]),_:3},8,["visible","append-to-body","show-mask","mask-close","z-index","mask-blur","direction","popup-size","onOpen","onOpenEnd","onClose","onCloseEnd"]))}});exports.default=v;