How to use flask_assets and then inline the bundle's content?

Question

I am familiar with:

1. create the bundle

from flask_assets import Bundle

bundles = {
    'all_css': Bundle(
        '../dependency1.scss',
        '../dependency2.scss',
        filters=("libsass", "rcssmin"),
        output="css/my.min.css"
    ),

2. use the bundle

{% assets "all_css" %}
    <link rel="stylesheet" href="{{ ASSET_URL }}"></link>
{% endassets %}

In my project, I want to do something different. I am trying to use web components and scoped CSS. To do that, I would like to inline the contents of the bundle directly into a Javscript variable. Something liks this:

const css = `
    <style>
{% assets "all_css" %}
        {{ ASSET_CONTENT }}
{% endassets %}
    </style>
`;

The above doesn't work because I made up ASSET_CONTENT. How do I inline the content?

Here's more or less what the final code might look like:

class MyComponent extends HTMLElement {
    constructor() {
        super();
        this.shadow = this.attachShadow({mode: 'open'});

        const css = `
            <style>
{% assets "all_css" %}
                {{ ASSET_CONTENT }}
{% endassets %}
            </style>
        `;

        const template = document.createElement('template');
        template.innerHTML += `
            ${css}
            {% include 'my-component.html' %}
        `;

        this.shadowRoot.appendChild(template.content.cloneNode(true));
    }

customElements.define('my-component', MyComponent);

To resolve the jinja, I use another bundle config

'my_component_js': Bundle(
    Bundle(
        '../templates/my-component.js',
        filters=('jinja2')
    ),
    filters=('rjsmin'),
    output="js/my-component.min.js"
)