tagProps lit-element directive

tagProps.js

import { directive } from "https://unpkg.com/@polymer/lit-element/lit-element.js?module"

const stateMap = new WeakMap()

export const tagProps = directive((tag, props = {}) => part => {
    let state = stateMap.get(part)
    const el = () => document.createElement(tag)
    if (state === undefined) {
        state = { tag, element: el() }
        stateMap.set(part, state)
    }
    if (state.tag != tag) {
        state.element = el()
        stateMap.set(part, state)
    }
    Object.assign(state.element, props)
    part.setValue(state.element)
})

• lit/lit#78 (comment)
• https://codepen.io/andyvanee/pen/jOqWWge