SwitchInvalid() — ui Function Reference

Architecture documentation for the SwitchInvalid() function in switch-invalid.tsx from the ui codebase.

Function tsx DocumentationAtlas Changelog

Entity Profile

DocumentationAtlas→ Changelog→ SwitchInvalid() — ui Function Reference

Dependency Diagram

graph TD
  b7c8c08e_fc61_2fa7_6a07_5f1b3570a419["SwitchInvalid()"]
  8955e982_699b_11a0_17f2_aa15d05cdfe4["switch-invalid.tsx"]
  b7c8c08e_fc61_2fa7_6a07_5f1b3570a419 -->|defined in| 8955e982_699b_11a0_17f2_aa15d05cdfe4
  style b7c8c08e_fc61_2fa7_6a07_5f1b3570a419 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/switch-invalid.tsx lines 9–23

export function SwitchInvalid() {
  return (
    <Field orientation="horizontal" className="max-w-sm" data-invalid>
      <FieldContent>
        <FieldLabel htmlFor="switch-terms">
          Accept terms and conditions
        </FieldLabel>
        <FieldDescription>
          You must accept the terms and conditions to continue.
        </FieldDescription>
      </FieldContent>
      <Switch id="switch-terms" aria-invalid />
    </Field>
  )
}