@vtbag/utensil-drawer/lib/dynamic-style.js

Pull out just what you need to craft seamless transitions. The Utensil Drawer holds reusable functions to help you build websites with view transitions. It is a bit sparse right now, but like the one in your kitchen, it is bound to fill up over time.

const styleMap = new Map();
export function initStyles(name) {
    let styles = styleMap.get(name);
    if (!styles) {
        document.head.insertAdjacentHTML('beforeend', `<style id="vtbag-dynamic-styles-${name}"/>`);
        styleMap.set(name, (styles = document.head.querySelector(`#vtbag-dynamic-styles-${name}`)));
    }
    styles.innerHTML = '';
}
export function addStyle(name, rule) {
    styleMap.get(name).innerHTML += rule;
}