shadow.js.map

{"version":3,"file":"shadow.js","sources":["src/shadow.tsx"],"sourcesContent":["import { defineComponent, h, ref, Teleport, onBeforeMount, onMounted, computed, reactive, PropType, watch } from 'vue'\r\nimport type { App, VNode } from 'vue'\r\n\r\ntype GShadowRoot = typeof global.ShadowRoot.prototype\r\n\r\nexport interface ShadowOption {\r\n    mode?: 'open' | 'closed'\r\n    delegatesFocus?: boolean\r\n}\r\n\r\nexport function makeShadow(el: Element, option?: ShadowOption) {\r\n    return makeShadowRaw(el, el.childNodes, option)\r\n}\r\nexport function makeShadowRaw(rootEl: Element, childNodes?: Iterable<Node>, option?: ShadowOption): ShadowRoot | undefined\r\nexport function makeShadowRaw(rootEl: Element, childNodes?: Iterable<Node>, { mode = 'open', delegatesFocus = false }: ShadowOption = { mode: 'open' }) {\r\n    try {\r\n        const oldroot = rootEl.shadowRoot\r\n        if (oldroot != null) {\r\n            console.error('[shadow] Attach shadow multiple times', rootEl, childNodes, oldroot)\r\n            return\r\n        } else {\r\n            const shadow_root = rootEl.attachShadow({ mode, delegatesFocus })\r\n            if (childNodes) putDomIntoShadow(shadow_root, childNodes)\r\n            return shadow_root\r\n        }\r\n    } catch (e) {\r\n        console.error('[shadow] make shadow-root failed', rootEl, childNodes)\r\n        console.error(e)\r\n    }\r\n}\r\n\r\n// function removeShadow(rootEl: Element): Element {\r\n//     const newroot = rootEl.cloneNode() as Element\r\n//     while (rootEl.hasChildNodes()) {\r\n//         newroot.appendChild(rootEl.firstChild!)\r\n//     }\r\n//     rootEl.parentElement!.replaceChild(newroot, rootEl)\r\n//     console.log('removeShadow', newroot)\r\n//     return newroot\r\n// }\r\n\r\nfunction putDomIntoShadow(shadow_root: GShadowRoot, childNodes: Iterable<Node>) {\r\n    const fragment = document.createDocumentFragment()\r\n    for (const node of childNodes) {\r\n        fragment.appendChild(node)\r\n    }\r\n    shadow_root.appendChild(fragment)\r\n}\r\n\r\nconst virtual_root = document.createDocumentFragment()\r\n\r\nexport const ShadowStyle = defineComponent({\r\n    props: {\r\n        media: String,\r\n        nonce: String,\r\n    },\r\n    setup(props, { slots }) {\r\n        return (): VNode => (\r\n            <style media={props.media} nonce={props.nonce}>\r\n                {slots.default?.()}\r\n            </style>\r\n        )\r\n    },\r\n})\r\n\r\nexport interface ShadowRootExpose {\r\n    shadow_root?: GShadowRoot\r\n}\r\n\r\nexport const ShadowRoot = withType<{\r\n    install: typeof install\r\n    Style: typeof ShadowStyle\r\n}>()(\r\n    defineComponent({\r\n        props: {\r\n            mode: {\r\n                type: String as PropType<'open' | 'closed'>,\r\n                default: 'open',\r\n            },\r\n            delegatesFocus: {\r\n                type: Boolean,\r\n                default: false,\r\n            },\r\n            abstract: {\r\n                type: Boolean,\r\n                default: false,\r\n            },\r\n            tag: {\r\n                type: String,\r\n                default: 'div',\r\n            },\r\n            adoptedStyleSheets: {\r\n                type: Array as PropType<CSSStyleSheet[]>,\r\n            },\r\n        },\r\n        emits: ['error'],\r\n        setup(props, { slots, expose, emit }) {\r\n            const abstract = ref(false)\r\n\r\n            const el = ref<HTMLElement>()\r\n            const teleport_el = ref<HTMLElement>()\r\n            const shadow_root = ref<GShadowRoot>()\r\n\r\n            const teleport_target = computed(() => shadow_root.value ?? virtual_root)\r\n\r\n            const ex: ShadowRootExpose = reactive({\r\n                shadow_root,\r\n            })\r\n            expose(ex)\r\n\r\n            onBeforeMount(() => {\r\n                abstract.value = props.abstract\r\n            })\r\n\r\n            onMounted(() => {\r\n                try {\r\n                    if (abstract.value) {\r\n                        if (teleport_el.value!.parentElement!.shadowRoot) {\r\n                            shadow_root.value = teleport_el.value!.parentElement!.shadowRoot\r\n                        } else {\r\n                            shadow_root.value = makeShadowRaw(teleport_el.value!.parentElement!, void 0, {\r\n                                mode: props.mode,\r\n                                delegatesFocus: props.delegatesFocus,\r\n                            })\r\n                        }\r\n                    } else {\r\n                        shadow_root.value = makeShadowRaw(el.value!, void 0, { mode: props.mode, delegatesFocus: props.delegatesFocus })\r\n                    }\r\n                    shadow_root.value?.styleSheets\r\n                } catch (e) {\r\n                    console.error(e)\r\n                    emit('error', e)\r\n                }\r\n            })\r\n\r\n            watch([shadow_root, () => props.adoptedStyleSheets], ([shadow_root, adoptedStyleSheets]) => {\r\n                if (!shadow_root || !adoptedStyleSheets) return\r\n                try {\r\n                    ;(shadow_root as any).adoptedStyleSheets = adoptedStyleSheets\r\n                } catch (e) {\r\n                    console.error(e)\r\n                    emit('error', e)\r\n                }\r\n            })\r\n\r\n            return (): VNode => {\r\n                const child_part = (\r\n                    <Teleport ref={teleport_el} to={teleport_target.value}>\r\n                        {[slots.default?.()]}\r\n                    </Teleport>\r\n                )\r\n                if (abstract.value) return child_part\r\n                return <props.tag ref={el}>{child_part}</props.tag>\r\n            }\r\n        },\r\n        install,\r\n        Style: ShadowStyle,\r\n    })\r\n)\r\n\r\nfunction withType<W>(): <T>(obj: T) => T & W {\r\n    return obj => obj as any\r\n}\r\n\r\nexport function install(app: App) {\r\n    app.component('shadow-root', ShadowRoot)\r\n\r\n    app.directive('shadow', {\r\n        beforeMount(el: HTMLElement) {\r\n            console.warn('[VueShadowDom] Deprecated v-shadow directive, use <shadow-root> component')\r\n            makeShadow(el)\r\n        },\r\n    })\r\n}\r\n\r\nexport { ShadowRoot as shadow_root, ShadowStyle as shadow_style }\r\nexport default { ShadowRoot, ShadowStyle, shadow_root: ShadowRoot, shadow_style: ShadowStyle, install }\r\n"],"names":["defineComponent","h","ref","computed","reactive","onBeforeMount","onMounted","watch","Teleport"],"mappings":"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"}