@silexlabs/grapesjs-advanced-selector/src/StylableElement.ts

A GrapesJS plugin for managing advanced CSS selectors with a visual interface

import { LitElement } from 'lit'
import { property } from 'lit/decorators.js'

export default class StylableElement extends LitElement {
  @property()
    t: (key: string) => string = (key) => key

  override connectedCallback() {
    super.connectedCallback()
    const styles = document.querySelectorAll('style, link[rel="stylesheet"]')
    styles.forEach(style => {
      this.shadowRoot?.appendChild(style.cloneNode(true))
    })
  }
}