<!-- source-hash: deeae07a7913733b844e875487c55c37 -->
A client-side input component built with `React.forwardRef`, supporting labels, validation states, adornments, loading indicators, and a special range slider variant.

## Key Components

- **`Input`** — Main exported component extending native `HTMLInputElement` attributes
- **`InputProps`** — Interface adding `invalid`, `startAdornment`, `endAdornment`, `label`, `error`, `errorVariant`, and `loading` props
- **`invalidBorderClasses`** — Tailwind class map for `"error"` (red) and `"warning"` (yellow) border states
- **`FieldWrapper`** — Wraps the input with optional label and error message rendering

## Behavior Notes

- **Range type** renders a styled slider without borders or adornments; still supports `label` via `FieldWrapper`
- **`loading`** replaces `endAdornment` with a spinning `Loader2` icon
- **`isInvalid`** is derived from either the `invalid` prop or a truthy `error` string
- Autofill background override applied via `-webkit-box-shadow` hack for consistent theming

## Usage Example

```typescript
// Basic input with label and error
<Input
  label="Email"
  type="email"
  placeholder="you@example.com"
  error="Invalid email address"
  errorVariant="error"
/>

// Input with adornments and loading state
<Input
  label="Search"
  startAdornment={<SearchIcon />}
  loading={isFetching}
  placeholder="Search tickets..."
/>

// Range slider
<Input
  type="range"
  label="Volume"
  min={0}
  max={100}
  defaultValue={50}
/>

// Warning variant
<Input
  label="Username"
  error="Username already taken"
  errorVariant="warning"
/>
```