Input

#Default usage

#Usage

import { Input } from "@froggdesign/enter-ui";

export function Example() {
  return (
    <>
      <Input aria-label="Package name" defaultValue="@froggdesign/enter-ui" />
      <Input aria-label="Disabled package" disabled defaultValue="@froggdesign/enterui-locked" />
      <Input aria-label="Invalid package" invalid defaultValue="invalid scope" />
    </>
  );
}

#Patterns

#Accessibility

Input renders a native input. Provide a visible Label or an aria-label. The invalid prop maps to aria-invalid.

#API

• invalid toggles invalid styling and aria state.
• All native input props are supported.
• Use className for local control styling.

#Styling

Every exported component accepts className when it renders an element. EnterUI styles use .eui-* classes and --eui-* variables mapped from FroggDesign theme tokens.