<!-- source-hash: d02572a5b408584db5dc8403984b5d76 -->
A controlled/uncontrolled global search input component for the OpenFrame header, supporting both controlled (via `onChange`) and uncontrolled usage patterns.

## Key Components

### `HeaderGlobalSearch`
A form-based search input that renders a search icon alongside a text field. Automatically toggles between controlled and uncontrolled modes based on whether `onChange` is provided.

### `HeaderGlobalSearchProps`
| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `value` | `string` | `''` | Current search value |
| `onChange` | `(value: string) => void` | — | Enables controlled mode |
| `onSubmit` | `(value: string) => void` | — | Fires on form submit or Enter key |
| `placeholder` | `string` | `'Global Search'` | Input placeholder text |
| `className` | `string` | — | Additional CSS classes |

## Usage Example

**Controlled:**
```typescript
const [query, setQuery] = React.useState('')

<HeaderGlobalSearch
  value={query}
  onChange={setQuery}
  onSubmit={(val) => console.log('Search:', val)}
  placeholder="Search tickets, clients..."
/>
```

**Uncontrolled:**
```typescript
<HeaderGlobalSearch
  onSubmit={(val) => console.log('Search:', val)}
/>
```

## Notes

- Submission triggers on both **form submit** and **Enter keydown**
- Without `onChange`, component manages its own internal state
- Styled with ODS design tokens (`ods-card`, `ods-text-primary`, `ods-text-secondary`) for consistent theming across OpenFrame