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
  74fa3bdf_2317_e2a5_2e7b_cc8e8d304526["SwitchInvalid()"]
  7544c728_24be_c9c6_e86f_81a05cad72cc["switch-invalid.tsx"]
  74fa3bdf_2317_e2a5_2e7b_cc8e8d304526 -->|defined in| 7544c728_24be_c9c6_e86f_81a05cad72cc
  style 74fa3bdf_2317_e2a5_2e7b_cc8e8d304526 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/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>
  )
}