import { renderText } from './text'

export default class NostrText extends HTMLElement {
  static observedAttributes = ['content']

  constructor() {
    super()

    this.attachShadow({ mode: 'open' })
  }

  connectedCallback() {
    this.set()
  }

  attributeChangedCallback() {
    this.set()
  }

  async set() {
    const { shadowRoot } = this
    if (!shadowRoot) return

    const content = this.getAttribute('content') || ''
    shadowRoot.innerHTML = ''
    renderText(shadowRoot as any as HTMLElement, content)
  }
}

window.customElements.define('nostr-text', NostrText)