Contents

import '@github/auto-check-element'
import {controller, target} from '@github/catalyst'

// eslint-disable-next-line custom-elements/expose-class-on-global
@controller
// eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
class PrimerTextFieldElement extends HTMLElement {
  @target inputElement: HTMLInputElement
  @target validationElement: HTMLElement
  @target validationMessageElement: HTMLElement

  #abortController: AbortController | null

  connectedCallback(): void {
    this.#abortController?.abort()
    const {signal} = (this.#abortController = new AbortController())

    this.inputElement.addEventListener(
      'auto-check-success',
      () => {
        this.clearError()
      },
      {signal}
    )

    this.inputElement.addEventListener(
      'auto-check-error',
      async (event: any) => {
        const errorMessage = await event.detail.response.text()
        this.setError(errorMessage)
      },
      {signal}
    )
  }

  disconnectedCallback() {
    this.#abortController?.abort()
  }

  clearContents() {
    this.inputElement.value = ''
    this.inputElement.focus()
  }

  clearError(): void {
    this.inputElement.removeAttribute('invalid')
    this.validationElement.hidden = true
    this.validationMessageElement.textContent = ''
  }

  setError(message: string): void {
    this.validationMessageElement.textContent = message
    this.validationElement.hidden = false
    this.inputElement.setAttribute('invalid', 'true')
  }
}

Version data entries

37 entries across 37 versions & 2 rubygems

Version	Path
openproject-primer_view_components-0.7.0	lib/primer/forms/primer_text_field.ts
openproject-primer_view_components-0.6.3	lib/primer/forms/primer_text_field.ts
primer_view_components-0.6.0	lib/primer/forms/primer_text_field.ts
primer_view_components-0.5.1	lib/primer/forms/primer_text_field.ts
primer_view_components-0.5.0	lib/primer/forms/primer_text_field.ts
primer_view_components-0.4.0	lib/primer/forms/primer_text_field.ts
primer_view_components-0.3.1	lib/primer/forms/primer_text_field.ts
primer_view_components-0.3.0	lib/primer/forms/primer_text_field.ts
primer_view_components-0.2.0	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.9	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.8	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.7	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.6	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.5	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.4	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.3	lib/primer/forms/primer_text_field.ts
primer_view_components-0.1.2	lib/primer/forms/primer_text_field.ts