Components
AISearch
The “Ask etisalat” entry point — a Searchbar with an assistant placeholder. Its Figma page is not yet final.
Figma description ·
AI Search componentOpen in Figma ↗This page is not finalised in Figma, so it has no published component or description yet.
Not final in Figma
The AI Search frames in Figma DSL V1.2 are not finalised and have no published symbol.
Until they are, AISearch is the Searchbar with the placeholder
“Ask etisalat or search”.
import SwiftUI import EandTokens // AI search shares the search bar shell with an "Ask e& or search" prompt. struct AISearch: View { @Binding var query: String var body: some View { HStack(spacing: EandSpacing.sm) { Image(systemName: "sparkles").frame(width: EandIcon.lg, height: EandIcon.lg) TextField("Ask e& or search", text: $query) } .padding(.horizontal, EandSpacing.lg).frame(height: 52) .background(EandColor.surfaceBaseDefault) .clipShape(RoundedRectangle(cornerRadius: EandRadius.radius6)) } }
When to use
- Use as the entry point to the etisalat assistant, where a query may be a question as well as a search.
- Don't use for plain search — use the Searchbar.
AISearch takes the same props as Searchbar: every native input prop, plus onMic. The
site's Finder is a documentation feature built for this site, not this component.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
onMic? | (() => void) | — |
Design
Figma source: AI Search component — etisalat Consumer App DSL V1.2
- Frames only: a 367×396 card with a title row, a grid of suggestion chips or category filter pills, and a search field in default, focus and typing states.
- Voice dictation is drawn in three states: started (waveform and timer), transcribing and result.
- None of this is built yet; the component keeps the Searchbar geometry (52px,
border-radius/6).