vue-shadow-dom
Version:
Shadow dom support for Vue
3 lines (2 loc) • 2.39 kB
JavaScript
!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self).shadow={},e.Vue)}(this,(function(e,o){"use strict";function t(e,o){return a(e,e.childNodes,o)}function a(e,o,{mode:t="open",delegatesFocus:a=!1}={mode:"open"}){try{const n=e.shadowRoot;if(null!=n)return void console.error("[shadow] Attach shadow multiple times",e,o,n);{const n=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)}(n,o),n}}catch(t){console.error("[shadow] make shadow-root failed",e,o),console.error(t)}}const n=document.createDocumentFragment(),d=o.defineComponent({props:{media:String,nonce:String},setup:(e,{slots:t})=>()=>o.h("style",{media:e.media,nonce:e.nonce},t.default?.())}),r=o.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(e,{slots:t,expose:d,emit:r}){const s=o.ref(!1),l=o.ref(),u=o.ref(),c=o.ref(),i=o.computed((()=>c.value??n));return d(o.reactive({shadow_root:c})),o.onBeforeMount((()=>{s.value=e.abstract})),o.onMounted((()=>{try{s.value?u.value.parentElement.shadowRoot?c.value=u.value.parentElement.shadowRoot:c.value=a(u.value.parentElement,void 0,{mode:e.mode,delegatesFocus:e.delegatesFocus}):c.value=a(l.value,void 0,{mode:e.mode,delegatesFocus:e.delegatesFocus}),c.value?.styleSheets}catch(e){console.error(e),r("error",e)}})),o.watch([c,()=>e.adoptedStyleSheets],(([e,o])=>{if(e&&o)try{e.adoptedStyleSheets=o}catch(e){console.error(e),r("error",e)}})),()=>{const a=o.h(o.Teleport,{ref:u,to:i.value},[t.default?.()]);return s.value?a:o.h(e.tag,{ref:l},a)}},install:s,Style:d});function s(e){e.component("shadow-root",r),e.directive("shadow",{beforeMount(e){console.warn("[VueShadowDom] Deprecated v-shadow directive, use <shadow-root> component"),t(e)}})}var l={ShadowRoot:r,ShadowStyle:d,shadow_root:r,shadow_style:d,install:s};e.ShadowRoot=r,e.ShadowStyle=d,e.default=l,e.install=s,e.makeShadow=t,e.makeShadowRaw=a,e.shadow_root=r,e.shadow_style=d,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=shadow.global.prod.js.map