The pin a person sets an address with by dragging the map under it — the pickup point or the destination, named by the tooltip above it.
DraggingMapPin marks the address a person is choosing on a map — where the ride or the courier picks them up, or where the trip ends. The map moves under it; the pin lifts while the map moves and sets down on the new address, which the tooltip above it names.
Six states, the same for Point A and Point B — Point A (Courier) is the RH pin. The host sets them from the map: Drag while it moves, Address Loading while it asks for the address, then Standard or Error; over a suggested pickup point, Hover and Selected Suggested Pickup.
A pin on the location with the address above it. The map moves under the pin; the parts move around one fixed spot — the root's bottom centre — and the host only sets the state.
Every part is placed from the location — the root's bottom centre. The pin stands on it, the tooltip sits above the pin, the shadow and the point centre on it. Each value takes the SP family Figma binds — the tooltip's box SP/100% ratio (fixed), the pin its own artwork, so only the text and the chevron grow.
dir="rtl" on the root or an ancestor does both. Figma: MapPinTooltip RTL=true.
The pin follows the map: it lifts while the map moves and sets down when it stops; the tooltip goes and comes back with the address. Every movement is a token of the motion system — the Specification frame has no Animation block, so the picks are the DS's — accepted as the contract (owner, 2026-11-12).
transform.
transform and opacity: scaled about the location rather than resized, so its 4 blur scales too — accepted (owner, 2026-11-12).
opacity; the content's visibility follows the fade — the live region itself stays.
opacity.
transform; the tooltip rises with it.
transform, as on Button.
DraggingMapPin stands at the centre of a map the person moves to choose an address — where the ride or the courier picks them up, or where the trip ends. The tooltip names the address; the sheet under the map carries the rest of the screen.
DraggingMapPin is a picture on a map with a line of text above it, and only the text speaks. The pin is not a control: it takes no focus and no gesture — the map does, and moving the map is the host's. Labels and voiced strings per platform: dragging-map-pin-a11y.md.
contentDescription "[Subtitle], [Title]" — plain text, no role.VoiceOver: the label "[Subtitle], [Title]", .staticText.Web: a role="status" element — a polite live region, read in browse mode as text and re-read when its content changes. A .visually-hidden ", " keeps the two from running together ("Pickup pointBotanical Garden").
importantForAccessibility = no / clearAndSetSemantics {}.VoiceOver: accessibilityHidden(true).Web: aria-hidden="true" on the pin <svg>, the shadow, the point and the chevron.
<button> named by the same text, inside the status region that stays mounted. The tooltip's own minimum is var(--sp-100-s40), so the button's hit area reaches past it — flagged for the owner.Pictures that the tooltip leads on — to the address search on the platforms. Figma gives the tooltip the text role.
opacity and its content goes visibility: hidden — out of the accessibility tree — while the region itself stays: a region that came back with new text would be announced by no one.
liveRegion = Polite) reads the address when it arrives.VoiceOver: nothing is announced; the address is announced when it arrives — UIAccessibility.post(notification: .announcement) with the new text.Web: the region stays with aria-busy="true" and the Loader aria-hidden; the host clears aria-busy as it puts the address in, and the region reads it once.
forced-color-adjust: none, or the glyph would vanish into a CanvasText head; the tooltip draws a CanvasText outline in place of its edge.