import { LitElement } from 'lit'
import { customElement } from 'lit/decorators.js'
import { WrappingMixin } from '../../WrappingMixin'
import { PlaceholderEditableMixin } from '../../PlaceholderEditableMixin'

if (!window.BRIGHTSPOT?.ui.cms.enableV5UI) {
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
  // @ts-ignore
  await import('./index.less')
}

@customElement('btu-textarea-input')
export default class TextAreaInput extends PlaceholderEditableMixin(
  WrappingMixin(LitElement),
) {
  // Overrides #find in superclass.
  find() {
    return this.querySelector<HTMLTextAreaElement>(':scope > textarea')
  }

  // Overrides #child setter in superclass.
  set child(_c: HTMLTextAreaElement) {
    super._child = _c
    this.input = _c
  }

  createRenderRoot() {
    return this
  }
}

declare global {
  interface HTMLElementTagNameMap {
    'btu-textarea-input': TextAreaInput
  }
}
