Label

Label vinculado a un campo de entrada con indicadores de estado.

Paquete: @solidiom/label
Versión: 0.0.1-next.0
Estado: stable

Ejemplos

import * as Label from "@solidiom/label"
import * as Input from "@solidiom/input"

;<div>
  <Label.Root htmlFor="username" required>
    Nombre de usuario
  </Label.Root>
  <Input.Root id="username" type="text" required />
</div>

Estados

La prop required en Label emite data-required para estilo. Las props disabled e invalid funcionan de la misma manera. Estos son puramente presentacionales; el estado real de validación del formulario reside en el control.

Nombre de usuario

Correo electrónico

Ver código fuente

        export function Root(props: LabelRootProps) {
  return (
    <label
      id={props.id}
      for={props.htmlFor}
      class={props.class}
      style={props.style}
      {...applySemanticAttrs({
        scope: "label",
        part: "root",
        disabled: props.disabled,
        required: props.required,
        invalid: props.invalid,
      })}
    >
      {props.children}
    </label>
  )
}