`<sp-picker>`

An `<sp-picker>` is a dropdown selection component that allows users to choose a single option from a list of menu items.

Category: Forms
Built with: No library
Library: Spectrum Web Components
Author: Adobe
Package: @spectrum-web-components/picker
Component size: 66.6 kB JS (minified + gzipped, JS includes dependencies beyond the library)
Library size: 7.5 kB JS (shared by every Spectrum Web Components component, loaded once per page)
Popular: 3 out of 5
Downloads: 50,023/week · jsDelivr 11,698 hits/month (whole @spectrum-web-components/picker package)
Latest stable version: 1.12.4
Last published: Sep 29, 2026
Component last changed: Jul 6, 2026 (in 1.12.2)
License: Apache-2.0

An <sp-picker> is a dropdown selection component that allows users to choose a single option from a list of menu items. It supports keyboard navigation, including arrow keys to cycle through options without opening the menu.

Attributes

icons
invalid
pending-label
label
quiet
value
placement
disabled
focused
readonly
pending
force-popover
open

Slots

label
description
tooltip

Events

change
scroll
sp-opened
sp-closed