# Input Search

Level: atom.

## Purpose and use

Collect a search query with a leading search icon and optional clear action. Search execution, debouncing, result loading and result announcements belong to the screen.

## Anatomy and behavior

The composition wraps Input without a floating label. placeholderText supplies both prompt and accessible name. Edits and clearing emit valueChange. `filled=true` seeds the literal demo value `Value`; changing filled resets internal text. There is no public value input, search-submit output or controlled query model.

## Accessibility and content

Native typing and Escape-to-blur come from Input. Disabled and validation are forwarded. Keep placeholderText descriptive because it is the accessible name; a placeholder is not a results status. The base clear-button label is not separately configurable here.

## Open Questions

Externally controlled query restoration and localized clear-action naming require an explicit component or integration change; do not document them as available.

## Local component contract

This is the current owned contract for `component.input-search`. Behavior above was checked
against the local implementation, template and focused tests listed below.
Historical migration evidence does not override these current sources.

### Public type values

`WblInputSearchSize` aliases `WblInputSize`: `L | M | S`. Validation: `default | warning | error`. disabled/filled/clearable/description are booleans; valueChange emits string.

### Classes and selectors

- `WblInputSearchComponent` — `wbl-input-search` (src/app/design-system/primitives/input-search/input-search.component.ts).

### Inputs

- `WblInputSearchComponent.size = input<WblInputSearchSize>('L')`
- `WblInputSearchComponent.disabled = input(false)`
- `WblInputSearchComponent.validation = input<WblInputValidation>('default')`
- `WblInputSearchComponent.filled = input(false)`
- `WblInputSearchComponent.clearable = input(false)`
- `WblInputSearchComponent.placeholderText = input('Search')`
- `WblInputSearchComponent.description = input(false)`
- `WblInputSearchComponent.descriptionText = input('Description')`

### Models

- None.

### Outputs

- `WblInputSearchComponent.valueChange = output<string>()`

### Slots and projection markers

- The exact template has no Angular content-projection slot.

### Local evidence

- Behavior/template: `src/app/design-system/primitives/input-search/input-search.component.html` (reviewed in D-025, 2026-09-05).

- Code: `src/app/design-system/primitives/input-search/input-search.component.ts`.
- Focused test: `src/app/design-system/primitives/input-search/input-search.component.spec.ts`.
- Public export: `export * from './primitives/input-search/input-search.component';` in `src/app/design-system/index.ts`.
- Storybook: `storybook/stories/input-search.stories.ts` (`Design System/Primitives/wbl-input-search`).

## Figma status

This runtime contract does not infer a Figma owner. Assembly evidence, when
verified, is maintained separately through the inventory-linked sidecar.

## Provenance

The archived source-document copy is historical evidence only. The active
resolver is local code/test/export and the exact Storybook story above.