UNPKG

vue-shadow-dom

Version:

Shadow dom support for Vue

3 lines (2 loc) 2.2 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue");function o(e,o){return t(e,e.childNodes,o)}function t(e,o,{mode:t="open",delegatesFocus:a=!1}={mode:"open"}){try{const r=e.shadowRoot;if(null!=r)return void console.error("[shadow] Attach shadow multiple times",e,o,r);{const r=e.attachShadow({mode:t,delegatesFocus:a});return o&&function(e,o){const t=document.createDocumentFragment();for(const e of o)t.appendChild(e);e.appendChild(t)}(r,o),r}}catch(t){console.error("[shadow] make shadow-root failed",e,o),console.error(t)}}const a=document.createDocumentFragment(),r=e.defineComponent({props:{media:String,nonce:String},setup:(o,{slots:t})=>()=>e.h("style",{media:o.media,nonce:o.nonce},t.default?.())}),s=e.defineComponent({props:{mode:{type:String,default:"open"},delegatesFocus:{type:Boolean,default:!1},abstract:{type:Boolean,default:!1},tag:{type:String,default:"div"},adoptedStyleSheets:{type:Array}},emits:["error"],setup(o,{slots:r,expose:s,emit:d}){const n=e.ref(!1),l=e.ref(),u=e.ref(),c=e.ref(),p=e.computed((()=>c.value??a));return s(e.reactive({shadow_root:c})),e.onBeforeMount((()=>{n.value=o.abstract})),e.onMounted((()=>{try{n.value?u.value.parentElement.shadowRoot?c.value=u.value.parentElement.shadowRoot:c.value=t(u.value.parentElement,void 0,{mode:o.mode,delegatesFocus:o.delegatesFocus}):c.value=t(l.value,void 0,{mode:o.mode,delegatesFocus:o.delegatesFocus}),c.value?.styleSheets}catch(e){console.error(e),d("error",e)}})),e.watch([c,()=>o.adoptedStyleSheets],(([e,o])=>{if(e&&o)try{e.adoptedStyleSheets=o}catch(e){console.error(e),d("error",e)}})),()=>{const t=e.h(e.Teleport,{ref:u,to:p.value},[r.default?.()]);return n.value?t:e.h(o.tag,{ref:l},t)}},install:d,Style:r});function d(e){e.component("shadow-root",s),e.directive("shadow",{beforeMount(e){console.warn("[VueShadowDom] Deprecated v-shadow directive, use <shadow-root> component"),o(e)}})}var n={ShadowRoot:s,ShadowStyle:r,shadow_root:s,shadow_style:r,install:d};exports.ShadowRoot=s,exports.ShadowStyle=r,exports.default=n,exports.install=d,exports.makeShadow=o,exports.makeShadowRaw=t,exports.shadow_root=s,exports.shadow_style=r; //# sourceMappingURL=shadow.cjs.prod.cjs.map