shadow.mjs.map

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