{ "schemaVersion": "1.0.0", "readme": "", "modules": [ { "kind": "javascript-module", "path": "sp-picker.js", "declarations": [], "exports": [ { "kind": "custom-element-definition", "name": "sp-picker", "declaration": { "name": "Picker", "module": "/src/Picker.js" } } ] }, { "kind": "javascript-module", "path": "sync/sp-picker.js", "declarations": [], "exports": [] }, { "kind": "javascript-module", "path": "src/DesktopController.js", "declarations": [ { "kind": "class", "description": "Controller for managing picker interactions on desktop devices.\nHandles mouse pointer events with sophisticated toggle state management\nto properly coordinate pointerdown, pointerup, and click events.", "name": "DesktopController", "members": [ { "kind": "field", "name": "type", "type": { "text": "InteractionTypes" }, "description": "Identifies this as a desktop interaction controller.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handlePointerdown", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "PointerEvent" }, "description": "The pointer event" } ], "description": "Handles pointerdown events on the trigger button.\nCaptures the current open state and sets up cleanup handlers\nfor pointerup, pointercancel, and click events.\nIgnores non-primary buttons and touch events (handled by MobileController).", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handleActivate", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "optional": true, "type": { "text": "Event" }, "description": "Optional activation event (click event or undefined for pointerdown)" } ], "description": "Handles activation of the picker (via click or keyboard).\nPrevents double-toggling when pointerup already changed the state.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "init", "return": { "type": { "text": "void" } }, "description": "Initializes desktop-specific event listeners on the trigger button.\nBinds click, pointerdown, and focus handlers.\nCleans up any existing listeners before binding new ones.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "abortController", "type": { "text": "AbortController" }, "description": "AbortController for cleaning up event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "preventNextToggle", "type": { "text": "'no' | 'maybe' | 'yes'" }, "privacy": "public", "default": "'no'", "description": "Controls whether the next toggle action should be prevented.\n- `'no'`: Allow toggle\n- `'maybe'`: May prevent based on additional conditions\n- `'yes'`: Prevent the next toggle", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "pointerdownState", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Tracks the open state at the time of pointerdown for toggle logic.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "enterKeydownOn", "type": { "text": "EventTarget | null" }, "privacy": "public", "default": "null", "description": "Tracks the target of an active Enter keydown to prevent double-activation.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "container", "type": { "text": "TemplateResult" }, "privacy": "public", "description": "The rendered overlay container template.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "activelyOpening", "type": { "text": "boolean" }, "description": "Indicates whether the host element is actively in the process of opening.\nAlways returns false in the base class; may be overridden in subclasses.", "readonly": true, "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "_open", "type": { "text": "boolean" }, "privacy": "private", "default": "false", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "open", "type": { "text": "boolean" }, "privacy": "public", "description": "Sets the open state and synchronizes with the host element.\nAlso initializes the overlay reference if not already set.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "_overlay", "type": { "text": "AbstractOverlay" }, "privacy": "private", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "overlay", "type": { "text": "AbstractOverlay" }, "privacy": "public", "description": "Sets the overlay reference and initializes overlay configuration.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "releaseDescription", "return": { "type": { "text": "void" } }, "description": "Releases any description resources.\nOverride in subclasses if cleanup is needed.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "initOverlay", "return": { "type": { "text": "void" } }, "description": "Initializes the overlay with appropriate configuration.\nSets up event listeners, type, placement, and focus behavior.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handleButtonFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "FocusEvent" }, "description": "The focus event" } ], "description": "Handles focus events on the trigger button.\nPrevents reopening the menu when focus returns from the menu itself.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "abort", "return": { "type": { "text": "void" } }, "description": "Cleans up the controller by releasing resources and aborting event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "hostConnected", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback when the host element is connected to the DOM.\nInitializes event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "hostDisconnected", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback when the host element is disconnected from the DOM.\nCleans up event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "hostUpdated", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback after the host element updates.\nEnsures overlay reference is set and updates willPreventClose state.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "target", "default": "target", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "host", "default": "host", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } } ], "superclass": { "name": "InteractionController", "module": "/src/InteractionController.js" } } ], "exports": [ { "kind": "js", "name": "DesktopController", "declaration": { "name": "DesktopController", "module": "src/DesktopController.js" } } ] }, { "kind": "javascript-module", "path": "src/InteractionController.js", "declarations": [ { "kind": "variable", "name": "SAFARI_FOCUS_RING_CLASS", "type": { "text": "string" }, "default": "'remove-focus-ring-safari-hack'", "description": "CSS class applied to Safari to manage focus ring visibility." }, { "kind": "class", "description": "Base controller class for managing host element interactions.\nHandles overlay state, toggle prevention, and focus management.\nExtended by DesktopController and MobileController for device-specific behavior.", "name": "InteractionController", "members": [ { "kind": "field", "name": "abortController", "type": { "text": "AbortController" }, "description": "AbortController for cleaning up event listeners." }, { "kind": "field", "name": "preventNextToggle", "type": { "text": "'no' | 'maybe' | 'yes'" }, "privacy": "public", "default": "'no'", "description": "Controls whether the next toggle action should be prevented.\n- `'no'`: Allow toggle\n- `'maybe'`: May prevent based on additional conditions\n- `'yes'`: Prevent the next toggle" }, { "kind": "field", "name": "pointerdownState", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Tracks the open state at the time of pointerdown for toggle logic." }, { "kind": "field", "name": "enterKeydownOn", "type": { "text": "EventTarget | null" }, "privacy": "public", "default": "null", "description": "Tracks the target of an active Enter keydown to prevent double-activation." }, { "kind": "field", "name": "container", "type": { "text": "TemplateResult" }, "privacy": "public", "description": "The rendered overlay container template." }, { "kind": "field", "name": "activelyOpening", "type": { "text": "boolean" }, "description": "Indicates whether the host element is actively in the process of opening.\nAlways returns false in the base class; may be overridden in subclasses.", "readonly": true }, { "kind": "field", "name": "_open", "type": { "text": "boolean" }, "privacy": "private", "default": "false" }, { "kind": "field", "name": "open", "type": { "text": "boolean" }, "privacy": "public", "description": "Sets the open state and synchronizes with the host element.\nAlso initializes the overlay reference if not already set." }, { "kind": "field", "name": "_overlay", "type": { "text": "AbstractOverlay" }, "privacy": "private" }, { "kind": "field", "name": "overlay", "type": { "text": "AbstractOverlay" }, "privacy": "public", "description": "Sets the overlay reference and initializes overlay configuration." }, { "kind": "field", "name": "type", "type": { "text": "InteractionTypes" }, "description": "The interaction type (desktop or mobile) for this controller." }, { "kind": "method", "name": "releaseDescription", "return": { "type": { "text": "void" } }, "description": "Releases any description resources.\nOverride in subclasses if cleanup is needed." }, { "kind": "method", "name": "initOverlay", "return": { "type": { "text": "void" } }, "description": "Initializes the overlay with appropriate configuration.\nSets up event listeners, type, placement, and focus behavior." }, { "kind": "method", "name": "handlePointerdown", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "_event", "type": { "text": "PointerEvent" }, "description": "The pointer event" } ], "description": "Handles pointerdown events on the trigger button.\nOverride in subclasses for device-specific behavior." }, { "kind": "method", "name": "handleButtonFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "FocusEvent" }, "description": "The focus event" } ], "description": "Handles focus events on the trigger button.\nPrevents reopening the menu when focus returns from the menu itself." }, { "kind": "method", "name": "handleActivate", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "_event", "type": { "text": "Event" }, "description": "The activation event" } ], "description": "Handles activation events (click, Enter, Space) on the trigger.\nOverride in subclasses for device-specific behavior." }, { "kind": "method", "name": "init", "return": { "type": { "text": "void" } }, "description": "Initializes event listeners for the controller.\nOverride in subclasses to bind device-specific events." }, { "kind": "method", "name": "abort", "return": { "type": { "text": "void" } }, "description": "Cleans up the controller by releasing resources and aborting event listeners." }, { "kind": "method", "name": "hostConnected", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback when the host element is connected to the DOM.\nInitializes event listeners." }, { "kind": "method", "name": "hostDisconnected", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback when the host element is disconnected from the DOM.\nCleans up event listeners." }, { "kind": "method", "name": "hostUpdated", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback after the host element updates.\nEnsures overlay reference is set and updates willPreventClose state." }, { "kind": "field", "name": "target", "default": "target" }, { "kind": "field", "name": "host", "default": "host" } ] } ], "exports": [ { "kind": "js", "name": "SAFARI_FOCUS_RING_CLASS", "declaration": { "name": "SAFARI_FOCUS_RING_CLASS", "module": "src/InteractionController.js" } }, { "kind": "js", "name": "InteractionController", "declaration": { "name": "InteractionController", "module": "src/InteractionController.js" } } ] }, { "kind": "javascript-module", "path": "src/MobileController.js", "declarations": [ { "kind": "class", "description": "Controller for managing picker interactions on mobile/touch devices.\nHandles touch events with simplified toggle logic compared to desktop.\nIncludes workarounds for Safari focus ring visibility issues.", "name": "MobileController", "members": [ { "kind": "field", "name": "type", "type": { "text": "InteractionTypes" }, "description": "Identifies this as a mobile interaction controller.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handleClick", "return": { "type": { "text": "void" } }, "description": "Handles click events on the trigger button.\nToggles the picker unless disabled or toggle is prevented.\nResets the preventNextToggle state after processing." }, { "kind": "method", "name": "handlePointerdown", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "_event", "type": { "text": "PointerEvent" }, "description": "The pointer event" } ], "description": "Handles pointerdown events on mobile devices.\nSets toggle prevention based on current open state to prevent\ndouble-toggling. Applies Safari focus ring workaround class.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handleFocusOut", "privacy": "private", "return": { "type": { "text": "void" } }, "description": "Handles focusout events on the trigger button.\nRemoves the Safari focus ring workaround class when the picker is closed." }, { "kind": "method", "name": "init", "return": { "type": { "text": "void" } }, "description": "Initializes mobile-specific event listeners on the trigger button.\nBinds click, pointerdown, and focusout handlers.\nCleans up any existing listeners before binding new ones.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "abortController", "type": { "text": "AbortController" }, "description": "AbortController for cleaning up event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "preventNextToggle", "type": { "text": "'no' | 'maybe' | 'yes'" }, "privacy": "public", "default": "'no'", "description": "Controls whether the next toggle action should be prevented.\n- `'no'`: Allow toggle\n- `'maybe'`: May prevent based on additional conditions\n- `'yes'`: Prevent the next toggle", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "pointerdownState", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Tracks the open state at the time of pointerdown for toggle logic.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "enterKeydownOn", "type": { "text": "EventTarget | null" }, "privacy": "public", "default": "null", "description": "Tracks the target of an active Enter keydown to prevent double-activation.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "container", "type": { "text": "TemplateResult" }, "privacy": "public", "description": "The rendered overlay container template.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "activelyOpening", "type": { "text": "boolean" }, "description": "Indicates whether the host element is actively in the process of opening.\nAlways returns false in the base class; may be overridden in subclasses.", "readonly": true, "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "_open", "type": { "text": "boolean" }, "privacy": "private", "default": "false", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "open", "type": { "text": "boolean" }, "privacy": "public", "description": "Sets the open state and synchronizes with the host element.\nAlso initializes the overlay reference if not already set.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "_overlay", "type": { "text": "AbstractOverlay" }, "privacy": "private", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "overlay", "type": { "text": "AbstractOverlay" }, "privacy": "public", "description": "Sets the overlay reference and initializes overlay configuration.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "releaseDescription", "return": { "type": { "text": "void" } }, "description": "Releases any description resources.\nOverride in subclasses if cleanup is needed.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "initOverlay", "return": { "type": { "text": "void" } }, "description": "Initializes the overlay with appropriate configuration.\nSets up event listeners, type, placement, and focus behavior.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handleButtonFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "FocusEvent" }, "description": "The focus event" } ], "description": "Handles focus events on the trigger button.\nPrevents reopening the menu when focus returns from the menu itself.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "handleActivate", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "_event", "type": { "text": "Event" }, "description": "The activation event" } ], "description": "Handles activation events (click, Enter, Space) on the trigger.\nOverride in subclasses for device-specific behavior.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "abort", "return": { "type": { "text": "void" } }, "description": "Cleans up the controller by releasing resources and aborting event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "hostConnected", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback when the host element is connected to the DOM.\nInitializes event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "hostDisconnected", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback when the host element is disconnected from the DOM.\nCleans up event listeners.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "method", "name": "hostUpdated", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Lifecycle callback after the host element updates.\nEnsures overlay reference is set and updates willPreventClose state.", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "target", "default": "target", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } }, { "kind": "field", "name": "host", "default": "host", "inheritedFrom": { "name": "InteractionController", "module": "src/InteractionController.js" } } ], "superclass": { "name": "InteractionController", "module": "/src/InteractionController.js" } } ], "exports": [ { "kind": "js", "name": "MobileController", "declaration": { "name": "MobileController", "module": "src/MobileController.js" } } ] }, { "kind": "javascript-module", "path": "src/Picker.js", "declarations": [ { "kind": "variable", "name": "DESCRIPTION_ID", "type": { "text": "string" }, "default": "'option-picker'" }, { "kind": "class", "description": "Base class for expandable picker-like components with overlay functionality.\nProvides common properties and methods for managing an overlay menu,\ndevice-specific interaction strategies, and focus management.\n\nExtended by Picker, ActionMenu, and other components that display\na menu overlay triggered by a button.", "name": "ExpandableElement", "members": [ { "kind": "field", "name": "shadowRootOptions", "type": { "text": "object" }, "static": true, "default": "{ ...SpectrumElement.shadowRootOptions, delegatesFocus: true, }", "description": "Shadow root configuration with delegatesFocus enabled.\nAllows focus to be delegated to focusable children within the shadow root." }, { "kind": "field", "name": "isMobile", "privacy": "public", "default": "new MatchMediaController(this, IS_MOBILE)", "description": "Controller that tracks whether the device is mobile." }, { "kind": "field", "name": "isTouchDevice", "privacy": "public", "default": "new MatchMediaController(this, IS_TOUCH_DEVICE)", "description": "Controller that tracks whether the device supports touch input." }, { "kind": "field", "name": "strategy", "type": { "text": "DesktopController | MobileController" }, "privacy": "public", "description": "The interaction strategy controller (desktop or mobile) managing pointer and keyboard events." }, { "kind": "field", "name": "button", "type": { "text": "HTMLButtonElement" }, "privacy": "public", "description": "Reference to the component's trigger button element." }, { "kind": "field", "name": "dependencyManager", "privacy": "public", "default": "new DependencyManagerController(this)", "description": "Controller that manages lazy-loading of overlay dependencies." }, { "kind": "field", "name": "disabled", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component is disabled. When disabled, the component cannot be interacted with.", "attribute": "disabled", "reflects": true }, { "kind": "field", "name": "focused", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component currently has visible focus.", "attribute": "focused", "reflects": true }, { "kind": "field", "name": "readonly", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component is read-only. When read-only, the component displays its value but cannot be changed.", "attribute": "readonly", "reflects": true }, { "kind": "field", "name": "pending", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the items are currently loading.", "attribute": "pending", "reflects": true }, { "kind": "field", "name": "forcePopover", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Forces the component to render as a popover on mobile instead of a tray.", "attribute": "force-popover", "reflects": true }, { "kind": "field", "name": "open", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component's menu overlay is currently open.", "attribute": "open", "reflects": true }, { "kind": "field", "name": "optionsMenu", "type": { "text": "Menu" }, "privacy": "public", "description": "Reference to the component's internal menu element." }, { "kind": "field", "name": "overlayElement", "type": { "text": "Overlay" }, "privacy": "public", "description": "Reference to the component's overlay element." }, { "kind": "field", "name": "placement", "type": { "text": "\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"" }, "privacy": "public", "default": "'bottom-start'", "description": "The preferred placement of the component's overlay relative to the trigger button.", "attribute": "placement" }, { "kind": "field", "name": "focusElement", "type": { "text": "HTMLElement" }, "privacy": "public", "description": "Returns the element that should receive focus.\nWhen open, returns the options menu; otherwise returns the trigger button.", "readonly": true }, { "kind": "method", "name": "focus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "options", "optional": true, "type": { "text": "FocusOptions" }, "description": "Standard focus options" } ], "description": "Focuses the appropriate element (button or menu) based on the picker's state." }, { "kind": "method", "name": "close", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Closes the component's overlay.\nHas no effect when the component is readonly." }, { "kind": "method", "name": "toggle", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "target", "optional": true, "type": { "text": "boolean" }, "description": "Optional explicit open state. If not provided, toggles the current state." } ], "description": "Toggles the component's open state.\nHas no effect when the component is readonly, pending, or disabled." }, { "kind": "field", "name": "handleSlottableRequest", "privacy": "public", "description": "Handles slottable request events from the overlay.\nOverride in subclasses to customize slottable behavior.", "parameters": [ { "description": "The slottable request event", "name": "_event" } ] }, { "kind": "field", "name": "handleBeforetoggle", "privacy": "protected", "description": "Handles the overlay's beforetoggle event.\nManages overlay state and prevents unwanted closures during interaction.", "parameters": [ { "description": "The beforetoggle event with the new state", "name": "event" } ] }, { "kind": "method", "name": "bindEvents", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Binds the appropriate interaction strategy (desktop or mobile) based on device type.\nAborts any existing strategy before creating a new one." } ], "attributes": [ { "name": "placement", "type": { "text": "\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"" }, "default": "'bottom-start'", "description": "The preferred placement of the component's overlay relative to the trigger button.", "fieldName": "placement", "attribute": "placement" }, { "name": "disabled", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component is disabled. When disabled, the component cannot be interacted with.", "fieldName": "disabled" }, { "name": "focused", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component currently has visible focus.", "fieldName": "focused" }, { "name": "readonly", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component is read-only. When read-only, the component displays its value but cannot be changed.", "fieldName": "readonly" }, { "name": "pending", "type": { "text": "boolean" }, "default": "false", "description": "Whether the items are currently loading.", "fieldName": "pending" }, { "name": "force-popover", "type": { "text": "boolean" }, "default": "false", "description": "Forces the component to render as a popover on mobile instead of a tray.", "fieldName": "forcePopover" }, { "name": "open", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component's menu overlay is currently open.", "fieldName": "open" } ], "superclass": { "name": "SpectrumElement", "package": "@spectrum-web-components/base" } }, { "kind": "class", "description": "", "name": "PickerBase", "slots": [ { "description": "The placeholder content for the Picker", "name": "label" }, { "description": "The description content for the Picker", "name": "description" }, { "description": "Tooltip to to be applied to the the Picker Button", "name": "tooltip" }, { "description": "menu items to be listed in the Picker", "name": "" } ], "members": [ { "kind": "field", "name": "appliedLabel", "type": { "text": "string | undefined" }, "description": "The label applied to the picker, typically from an associated field label." }, { "kind": "field", "name": "deprecatedMenu", "type": { "text": "Menu | null" }, "privacy": "private", "default": "null" }, { "kind": "field", "name": "icons", "type": { "text": "'only' | 'none' | undefined" }, "privacy": "public", "description": "Controls how icons are displayed in the picker button.\n- `'only'`: Shows only the icon, hiding the label visually.\n- `'none'`: Hides the icon entirely.", "attribute": "icons", "reflects": true }, { "kind": "field", "name": "invalid", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the picker is in an invalid state. Displays a validation icon when true.", "attribute": "invalid", "reflects": true }, { "kind": "field", "name": "pendingLabel", "type": { "text": "string" }, "privacy": "public", "default": "'Pending'", "description": "Defines a string value that labels the Picker while it is in pending state.", "attribute": "pending-label" }, { "kind": "field", "name": "label", "type": { "text": "string | undefined" }, "privacy": "public", "description": "The placeholder label displayed when no item is selected.", "attribute": "label" }, { "kind": "field", "name": "selects", "type": { "text": "undefined | 'single'" }, "privacy": "public", "default": "'single'", "description": "The selection mode for the picker's menu.\nAlways forced to `'single'` for standard picker behavior." }, { "kind": "field", "name": "labelAlignment", "type": { "text": "'inline' | undefined" }, "privacy": "public", "description": "The alignment of the associated label, set by an external field label component." }, { "kind": "field", "name": "menuItems", "type": { "text": "MenuItem[]" }, "privacy": "protected", "description": "Returns the list of menu items contained in the picker's options menu.", "readonly": true }, { "kind": "field", "name": "selfManageFocusElement", "type": { "text": "boolean" }, "privacy": "public", "deprecated": "This property always returns true and will be removed in a future version.", "readonly": true }, { "kind": "field", "name": "tooltipEl", "type": { "text": "Tooltip | undefined" }, "privacy": "protected", "description": "Reference to the tooltip element, if one is slotted." }, { "kind": "field", "name": "quiet", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether to render the picker in quiet mode with minimal visual styling.", "attribute": "quiet", "reflects": true }, { "kind": "field", "name": "value", "type": { "text": "string" }, "privacy": "public", "default": "''", "description": "The current value of the picker, corresponding to the selected menu item's value.", "attribute": "value" }, { "kind": "field", "name": "selectedItem", "type": { "text": "MenuItem | undefined" }, "privacy": "public", "description": "The currently selected menu item, or undefined if no item is selected." }, { "kind": "field", "name": "_selectedItem", "type": { "text": "MenuItem | undefined" } }, { "kind": "field", "name": "listRole", "type": { "text": "'listbox' | 'menu'" }, "privacy": "protected", "default": "'listbox'", "description": "The ARIA role for the menu list element." }, { "kind": "field", "name": "itemRole", "type": { "text": "string" }, "privacy": "protected", "default": "'option'", "description": "The ARIA role for individual menu items." }, { "kind": "method", "name": "forceFocusVisible", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Programmatically applies visible focus styling to the picker.\nHas no effect when the picker is disabled." }, { "kind": "method", "name": "click", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Toggles the picker's open state when called programmatically.\nNote: Pointer events are handled by the interaction controller." }, { "kind": "method", "name": "handleButtonClick", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Handles click events on the trigger button.\nNote: Pointer events are typically handled by the interaction controller;\nthis method is called when `this.button.click()` is invoked programmatically." }, { "kind": "method", "name": "handleButtonBlur", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Handles blur events on the trigger button, removing focus styling." }, { "kind": "method", "name": "focus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "options", "optional": true, "type": { "text": "FocusOptions" } } ], "description": "Focuses the appropriate element (button or menu) based on the picker's state.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "handleHelperFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "deprecated": "Use `focus()` instead.\nFocuses the picker button and applies focus styling." }, { "kind": "method", "name": "handleFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Handles focus events on the picker, applying visible focus styling\nonly when focus is visible in the tree." }, { "kind": "method", "name": "handleChange", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "Event" }, "description": "The change event from the menu" } ], "description": "Handles change events from the menu, updating the selected value.\nDispatches a `change` event that can be prevented to cancel the selection." }, { "kind": "method", "name": "handleButtonFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "FocusEvent" }, "description": "The focus event" } ], "description": "Handles focus events on the trigger button, delegating to the interaction strategy." }, { "kind": "field", "name": "handleEscape", "privacy": "protected", "description": "Handles Escape key press to close the picker overlay.", "parameters": [ { "description": "The keyboard event", "name": "event" } ] }, { "kind": "field", "name": "handleKeydown", "privacy": "protected", "description": "Handles keyboard navigation on the picker button.\nOpens the menu on Arrow keys, Enter, or Space.", "parameters": [ { "description": "The keyboard event", "name": "event" } ] }, { "kind": "method", "name": "keyboardOpen", "privacy": "protected", "return": { "type": { "text": "Promise" } }, "description": "Opens the picker via keyboard interaction and focuses the first selected item.\nIf already open, focuses the first selected item in the menu." }, { "kind": "method", "name": "setValueFromItem", "privacy": "protected", "return": { "type": { "text": "Promise" } }, "parameters": [ { "name": "item", "type": { "text": "MenuItem" }, "description": "The menu item to select" }, { "name": "menuChangeEvent", "optional": true, "type": { "text": "Event" }, "description": "The original menu change event, if any" } ], "description": "Sets the picker's value from a menu item selection.\nDispatches a cancelable `change` event and reverts the selection if prevented." }, { "kind": "method", "name": "setMenuItemSelected", "privacy": "protected", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "item", "type": { "text": "MenuItem" }, "description": "The menu item to update" }, { "name": "value", "type": { "text": "boolean" }, "description": "Whether the item should be selected" } ], "description": "Updates the selected state of a menu item." }, { "kind": "field", "name": "containerStyles", "type": { "text": "StyleInfo" }, "privacy": "protected", "description": "Returns inline styles for the overlay container.\nOn mobile, sets full width; on desktop, returns empty styles.", "readonly": true }, { "kind": "field", "name": "selectedItemContent", "type": { "text": "MenuItemChildren" }, "privacy": "protected", "description": "The content (icon and text) of the currently selected menu item.\nUsed to render the selected item's display in the picker button." }, { "kind": "field", "name": "_selectedItemContent", "type": { "text": "MenuItemChildren | undefined" } }, { "kind": "method", "name": "handleTooltipSlotchange", "privacy": "protected", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "Event & { target: HTMLSlotElement }" }, "description": "The slotchange event" } ], "description": "Handles slotchange events for the tooltip slot.\nSets up the trigger element for self-managed tooltips." }, { "kind": "method", "name": "renderLabelContent", "privacy": "protected", "return": { "type": { "text": "" } }, "parameters": [ { "name": "content", "type": { "text": "Node[]" }, "description": "The content nodes from the selected item" } ], "description": "Renders the label content for the picker button.\nShows the selected item's content if available, otherwise renders the placeholder label." }, { "kind": "method", "name": "renderLoader", "privacy": "protected", "return": { "type": { "text": "" } }, "description": "Renders the loading indicator shown during pending state.\nDynamically imports the progress-circle component." }, { "kind": "field", "name": "buttonContent", "type": { "text": "TemplateResult[]" }, "privacy": "protected", "description": "Returns the content to render inside the picker button,\nincluding the icon, label, validation icon, and chevron.", "readonly": true }, { "kind": "field", "name": "applyFocusElementLabel", "description": "Callback invoked by an associated field label to apply its label value.\nSets the applied label and determines label alignment based on the field label's configuration.", "parameters": [ { "description": "The label text value", "name": "value" }, { "description": "The field label element providing the label", "name": "labelElement" } ] }, { "kind": "method", "name": "hasAccessibleLabel", "privacy": "protected", "return": { "type": { "text": "" } }, "description": "Checks whether the picker has an accessible label through any supported method:\n- `label` attribute\n- `aria-label` attribute\n- `aria-labelledby` attribute\n- Applied label from a field label\n- Slotted label content" }, { "kind": "method", "name": "warnNoLabel", "privacy": "protected", "return": { "type": { "text": "void" } }, "description": "Logs a warning in debug mode when the picker lacks an accessible label.\nProvides guidance on how to make the picker accessible." }, { "kind": "method", "name": "renderOverlay", "privacy": "protected", "return": { "type": { "text": "" } }, "parameters": [ { "name": "menu", "type": { "text": "TemplateResult" }, "description": "The menu template to render inside the overlay" } ], "description": "Renders the overlay element containing the menu.\nConfigures the overlay with appropriate placement, type, and event handlers." }, { "kind": "field", "name": "renderDescriptionSlot", "type": { "text": "TemplateResult" }, "privacy": "protected", "description": "Renders the description slot for additional picker context.\nContent is referenced by aria-describedby for accessibility.", "readonly": true }, { "kind": "method", "name": "bindButtonKeydownListener", "privacy": "protected", "return": { "type": { "text": "void" } }, "description": "Binds the keydown event listener to the trigger button.\nCalled during first update to enable keyboard navigation." }, { "kind": "field", "name": "dismissHelper", "type": { "text": "TemplateResult" }, "privacy": "protected", "description": "Renders a visually hidden dismiss button for accessibility.\nAllows screen reader users to dismiss the overlay.", "readonly": true }, { "kind": "method", "name": "renderContainer", "privacy": "protected", "return": { "type": { "text": "" } }, "parameters": [ { "name": "menu", "type": { "text": "TemplateResult" }, "description": "The menu template to wrap in the container" } ], "description": "Renders the overlay container (popover or tray) based on device type.\nOn mobile, uses a tray; on desktop, uses a popover." }, { "kind": "field", "name": "hasRenderedOverlay", "type": { "text": "boolean" }, "privacy": "protected", "default": "false", "description": "Tracks whether the overlay has been rendered at least once." }, { "kind": "method", "name": "onScroll", "privacy": "private", "return": { "type": { "text": "void" } }, "description": "Dispatches a scroll event when the menu is scrolled.\nThe event is intentionally non-composed so it fires on the picker host\nfor consumers but does not cross the shadow DOM boundary into ancestors." }, { "kind": "field", "name": "renderMenu", "type": { "text": "TemplateResult" }, "privacy": "protected", "description": "Renders the menu and overlay structure.\nLazily renders the overlay only after the picker has been focused or opened.", "readonly": true }, { "kind": "field", "name": "willManageSelection", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Tracks whether a selection change is already scheduled for the next frame." }, { "kind": "method", "name": "shouldScheduleManageSelection", "privacy": "protected", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "optional": true, "type": { "text": "Event" }, "description": "Optional event that triggered the scheduling" } ], "description": "Schedules selection management for the next animation frame.\nCalled when the value changes or menu slot content changes.\nPrevents duplicate scheduling if already pending." }, { "kind": "method", "name": "shouldManageSelection", "privacy": "protected", "return": { "type": { "text": "void" } }, "description": "Immediately manages selection when a menu item is added or updated.\nSkips if selection management is already scheduled." }, { "kind": "method", "name": "manageSelection", "privacy": "protected", "return": { "type": { "text": "Promise" } }, "description": "Synchronizes the menu selection state with the picker's current value.\nFinds and selects the menu item matching the current value,\nand deselects all other items." }, { "kind": "field", "name": "selectionPromise", "privacy": "private" }, { "kind": "field", "name": "selectionResolver", "type": { "text": "() => void" }, "privacy": "private" }, { "kind": "method", "name": "getUpdateComplete", "privacy": "protected", "return": { "type": { "text": "Promise" } } }, { "kind": "field", "name": "recentlyConnected", "type": { "text": "boolean" }, "privacy": "private", "default": "false" }, { "kind": "field", "name": "enterKeydownOn", "type": { "text": "EventTarget | null" }, "privacy": "private", "default": "null", "description": "Tracks the target of an active Enter keydown to prevent double-activation." }, { "kind": "field", "name": "handleEnterKeydown", "privacy": "protected", "description": "Handles Enter key events to prevent double-activation of menu items.\nTracks keydown state and clears it on keyup.\nAlso prevents Enter from triggering submenus that aren't open.", "parameters": [ { "description": "The keyboard event", "name": "event" } ] }, { "kind": "field", "name": "shadowRootOptions", "type": { "text": "object" }, "static": true, "default": "{ ...SpectrumElement.shadowRootOptions, delegatesFocus: true, }", "description": "Shadow root configuration with delegatesFocus enabled.\nAllows focus to be delegated to focusable children within the shadow root.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "isMobile", "privacy": "public", "default": "new MatchMediaController(this, IS_MOBILE)", "description": "Controller that tracks whether the device is mobile.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "isTouchDevice", "privacy": "public", "default": "new MatchMediaController(this, IS_TOUCH_DEVICE)", "description": "Controller that tracks whether the device supports touch input.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "strategy", "type": { "text": "DesktopController | MobileController" }, "privacy": "public", "description": "The interaction strategy controller (desktop or mobile) managing pointer and keyboard events.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "button", "type": { "text": "HTMLButtonElement" }, "privacy": "public", "description": "Reference to the component's trigger button element.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "dependencyManager", "privacy": "public", "default": "new DependencyManagerController(this)", "description": "Controller that manages lazy-loading of overlay dependencies.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "disabled", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component is disabled. When disabled, the component cannot be interacted with.", "attribute": "disabled", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "focused", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component currently has visible focus.", "attribute": "focused", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "readonly", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component is read-only. When read-only, the component displays its value but cannot be changed.", "attribute": "readonly", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "pending", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the items are currently loading.", "attribute": "pending", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "forcePopover", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Forces the component to render as a popover on mobile instead of a tray.", "attribute": "force-popover", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "open", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component's menu overlay is currently open.", "attribute": "open", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "optionsMenu", "type": { "text": "Menu" }, "privacy": "public", "description": "Reference to the component's internal menu element.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "overlayElement", "type": { "text": "Overlay" }, "privacy": "public", "description": "Reference to the component's overlay element.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "placement", "type": { "text": "\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"" }, "privacy": "public", "default": "'bottom-start'", "description": "The preferred placement of the component's overlay relative to the trigger button.", "attribute": "placement", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "focusElement", "type": { "text": "HTMLElement" }, "privacy": "public", "description": "Returns the element that should receive focus.\nWhen open, returns the options menu; otherwise returns the trigger button.", "readonly": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "close", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Closes the component's overlay.\nHas no effect when the component is readonly.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "toggle", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "target", "optional": true, "type": { "text": "boolean" }, "description": "Optional explicit open state. If not provided, toggles the current state." } ], "description": "Toggles the component's open state.\nHas no effect when the component is readonly, pending, or disabled.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "handleSlottableRequest", "privacy": "public", "description": "Handles slottable request events from the overlay.\nOverride in subclasses to customize slottable behavior.", "parameters": [ { "description": "The slottable request event", "name": "_event" } ], "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "handleBeforetoggle", "privacy": "protected", "description": "Handles the overlay's beforetoggle event.\nManages overlay state and prevents unwanted closures during interaction.", "parameters": [ { "description": "The beforetoggle event with the new state", "name": "event" } ], "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "bindEvents", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Binds the appropriate interaction strategy (desktop or mobile) based on device type.\nAborts any existing strategy before creating a new one.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } } ], "events": [ { "name": "change", "type": { "text": "Event" }, "description": "Announces that the `value` of the element has changed" }, { "name": "scroll", "type": { "text": "Event" } }, { "description": "Announces that the overlay has been opened", "name": "sp-opened" }, { "description": "Announces that the overlay has been closed", "name": "sp-closed" } ], "attributes": [ { "name": "icons", "type": { "text": "'only' | 'none' | undefined" }, "description": "Controls how icons are displayed in the picker button.\n- `'only'`: Shows only the icon, hiding the label visually.\n- `'none'`: Hides the icon entirely.", "fieldName": "icons" }, { "name": "invalid", "type": { "text": "boolean" }, "default": "false", "description": "Whether the picker is in an invalid state. Displays a validation icon when true.", "fieldName": "invalid" }, { "name": "pending-label", "type": { "text": "string" }, "default": "'Pending'", "description": "Defines a string value that labels the Picker while it is in pending state.", "fieldName": "pendingLabel" }, { "name": "label", "type": { "text": "string | undefined" }, "description": "The placeholder label displayed when no item is selected.", "fieldName": "label" }, { "name": "quiet", "type": { "text": "boolean" }, "default": "false", "description": "Whether to render the picker in quiet mode with minimal visual styling.", "fieldName": "quiet" }, { "name": "value", "type": { "text": "string" }, "default": "''", "description": "The current value of the picker, corresponding to the selected menu item's value.", "fieldName": "value" }, { "name": "placement", "type": { "text": "\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"" }, "default": "'bottom-start'", "description": "The preferred placement of the component's overlay relative to the trigger button.", "fieldName": "placement", "attribute": "placement", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "disabled", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component is disabled. When disabled, the component cannot be interacted with.", "fieldName": "disabled", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "focused", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component currently has visible focus.", "fieldName": "focused", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "readonly", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component is read-only. When read-only, the component displays its value but cannot be changed.", "fieldName": "readonly", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "pending", "type": { "text": "boolean" }, "default": "false", "description": "Whether the items are currently loading.", "fieldName": "pending", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "force-popover", "type": { "text": "boolean" }, "default": "false", "description": "Forces the component to render as a popover on mobile instead of a tray.", "fieldName": "forcePopover", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "open", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component's menu overlay is currently open.", "fieldName": "open", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } } ], "mixins": [ { "name": "SizedMixin", "package": "@spectrum-web-components/base" } ], "superclass": { "name": "ExpandableElement", "module": "src/Picker.ts" }, "deprecated": "This class is deprecated and will be removed in a future major release. Use the ExpandableElement base class instead." }, { "kind": "class", "description": "An `` is a dropdown selection component that allows users to choose\na single option from a list of menu items. It supports keyboard navigation,\nincluding arrow keys to cycle through options without opening the menu.", "name": "Picker", "slots": [ { "description": "The placeholder content for the Picker", "name": "label" }, { "description": "The description content for the Picker", "name": "description" }, { "description": "Tooltip to to be applied to the the Picker Button", "name": "tooltip" }, { "description": "menu items to be listed in the Picker", "name": "" } ], "members": [ { "kind": "field", "name": "appliedLabel", "type": { "text": "string | undefined" }, "description": "The label applied to the picker, typically from an associated field label." }, { "kind": "field", "name": "deprecatedMenu", "type": { "text": "Menu | null" }, "privacy": "private", "default": "null" }, { "kind": "field", "name": "icons", "type": { "text": "'only' | 'none' | undefined" }, "privacy": "public", "description": "Controls how icons are displayed in the picker button.\n- `'only'`: Shows only the icon, hiding the label visually.\n- `'none'`: Hides the icon entirely.", "attribute": "icons", "reflects": true }, { "kind": "field", "name": "invalid", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the picker is in an invalid state. Displays a validation icon when true.", "attribute": "invalid", "reflects": true }, { "kind": "field", "name": "pendingLabel", "type": { "text": "string" }, "privacy": "public", "default": "'Pending'", "description": "Defines a string value that labels the Picker while it is in pending state.", "attribute": "pending-label" }, { "kind": "field", "name": "label", "type": { "text": "string | undefined" }, "privacy": "public", "description": "The placeholder label displayed when no item is selected.", "attribute": "label" }, { "kind": "field", "name": "selects", "type": { "text": "undefined | 'single'" }, "privacy": "public", "default": "'single'", "description": "The selection mode for the picker's menu.\nAlways forced to `'single'` for standard picker behavior." }, { "kind": "field", "name": "labelAlignment", "type": { "text": "'inline' | undefined" }, "privacy": "public", "description": "The alignment of the associated label, set by an external field label component." }, { "kind": "field", "name": "menuItems", "type": { "text": "MenuItem[]" }, "privacy": "protected", "description": "Returns the list of menu items contained in the picker's options menu.", "readonly": true }, { "kind": "field", "name": "selfManageFocusElement", "type": { "text": "boolean" }, "privacy": "public", "deprecated": "This property always returns true and will be removed in a future version.", "readonly": true }, { "kind": "field", "name": "tooltipEl", "type": { "text": "Tooltip | undefined" }, "privacy": "protected", "description": "Reference to the tooltip element, if one is slotted." }, { "kind": "field", "name": "quiet", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether to render the picker in quiet mode with minimal visual styling.", "attribute": "quiet", "reflects": true }, { "kind": "field", "name": "value", "type": { "text": "string" }, "privacy": "public", "default": "''", "description": "The current value of the picker, corresponding to the selected menu item's value.", "attribute": "value" }, { "kind": "field", "name": "selectedItem", "type": { "text": "MenuItem | undefined" }, "privacy": "public", "description": "The currently selected menu item, or undefined if no item is selected." }, { "kind": "field", "name": "_selectedItem", "type": { "text": "MenuItem | undefined" } }, { "kind": "field", "name": "listRole", "type": { "text": "'listbox' | 'menu'" }, "privacy": "protected", "default": "'listbox'", "description": "The ARIA role for the menu list element." }, { "kind": "field", "name": "itemRole", "type": { "text": "string" }, "privacy": "protected", "default": "'option'", "description": "The ARIA role for individual menu items." }, { "kind": "method", "name": "forceFocusVisible", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Programmatically applies visible focus styling to the picker.\nHas no effect when the picker is disabled." }, { "kind": "method", "name": "click", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Toggles the picker's open state when called programmatically.\nNote: Pointer events are handled by the interaction controller." }, { "kind": "method", "name": "handleButtonClick", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Handles click events on the trigger button.\nNote: Pointer events are typically handled by the interaction controller;\nthis method is called when `this.button.click()` is invoked programmatically." }, { "kind": "method", "name": "handleButtonBlur", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Handles blur events on the trigger button, removing focus styling." }, { "kind": "method", "name": "handleHelperFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "deprecated": "Use `focus()` instead.\nFocuses the picker button and applies focus styling." }, { "kind": "method", "name": "handleFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Handles focus events on the picker, applying visible focus styling\nonly when focus is visible in the tree." }, { "kind": "method", "name": "handleChange", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "Event" }, "description": "The change event from the menu" } ], "description": "Handles change events from the menu, updating the selected value.\nDispatches a `change` event that can be prevented to cancel the selection." }, { "kind": "method", "name": "handleButtonFocus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "FocusEvent" }, "description": "The focus event" } ], "description": "Handles focus events on the trigger button, delegating to the interaction strategy." }, { "kind": "field", "name": "handleEscape", "privacy": "protected", "description": "Handles Escape key press to close the picker overlay.", "parameters": [ { "description": "The keyboard event", "name": "event" } ] }, { "kind": "field", "name": "handleKeydown", "privacy": "protected", "description": "Enhanced keyboard handler that supports arrow key navigation to cycle\nthrough options without opening the menu (in addition to base navigation).", "parameters": [ { "description": "The keyboard event", "name": "event" } ] }, { "kind": "method", "name": "keyboardOpen", "privacy": "protected", "return": { "type": { "text": "Promise" } }, "description": "Opens the picker via keyboard interaction and focuses the first selected item.\nIf already open, focuses the first selected item in the menu." }, { "kind": "method", "name": "setValueFromItem", "privacy": "protected", "return": { "type": { "text": "Promise" } }, "parameters": [ { "name": "item", "type": { "text": "MenuItem" }, "description": "The menu item to select" }, { "name": "menuChangeEvent", "optional": true, "type": { "text": "Event" }, "description": "The original menu change event, if any" } ], "description": "Sets the picker's value from a menu item selection.\nDispatches a cancelable `change` event and reverts the selection if prevented." }, { "kind": "method", "name": "setMenuItemSelected", "privacy": "protected", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "item", "type": { "text": "MenuItem" }, "description": "The menu item to update" }, { "name": "value", "type": { "text": "boolean" }, "description": "Whether the item should be selected" } ], "description": "Updates the selected state of a menu item." }, { "kind": "field", "name": "containerStyles", "type": { "text": "StyleInfo" }, "privacy": "protected", "description": "Returns inline styles for the overlay container.\nOn mobile, sets full width; on desktop, returns empty styles.", "readonly": true }, { "kind": "field", "name": "selectedItemContent", "type": { "text": "MenuItemChildren" }, "privacy": "protected", "description": "The content (icon and text) of the currently selected menu item.\nUsed to render the selected item's display in the picker button." }, { "kind": "field", "name": "_selectedItemContent", "type": { "text": "MenuItemChildren | undefined" } }, { "kind": "method", "name": "handleTooltipSlotchange", "privacy": "protected", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "type": { "text": "Event & { target: HTMLSlotElement }" }, "description": "The slotchange event" } ], "description": "Handles slotchange events for the tooltip slot.\nSets up the trigger element for self-managed tooltips." }, { "kind": "method", "name": "renderLabelContent", "privacy": "protected", "return": { "type": { "text": "" } }, "parameters": [ { "name": "content", "type": { "text": "Node[]" }, "description": "The content nodes from the selected item" } ], "description": "Renders the label content for the picker button.\nShows the selected item's content if available, otherwise renders the placeholder label." }, { "kind": "method", "name": "renderLoader", "privacy": "protected", "return": { "type": { "text": "" } }, "description": "Renders the loading indicator shown during pending state.\nDynamically imports the progress-circle component." }, { "kind": "field", "name": "buttonContent", "type": { "text": "TemplateResult[]" }, "privacy": "protected", "description": "Returns the content to render inside the picker button,\nincluding the icon, label, validation icon, and chevron.", "readonly": true }, { "kind": "field", "name": "applyFocusElementLabel", "description": "Callback invoked by an associated field label to apply its label value.\nSets the applied label and determines label alignment based on the field label's configuration.", "parameters": [ { "description": "The label text value", "name": "value" }, { "description": "The field label element providing the label", "name": "labelElement" } ] }, { "kind": "method", "name": "hasAccessibleLabel", "privacy": "protected", "return": { "type": { "text": "" } }, "description": "Checks whether the picker has an accessible label through any supported method:\n- `label` attribute\n- `aria-label` attribute\n- `aria-labelledby` attribute\n- Applied label from a field label\n- Slotted label content" }, { "kind": "method", "name": "warnNoLabel", "privacy": "protected", "return": { "type": { "text": "void" } }, "description": "Logs a warning in debug mode when the picker lacks an accessible label.\nProvides guidance on how to make the picker accessible." }, { "kind": "method", "name": "renderOverlay", "privacy": "protected", "return": { "type": { "text": "" } }, "parameters": [ { "name": "menu", "type": { "text": "TemplateResult" }, "description": "The menu template to render inside the overlay" } ], "description": "Renders the overlay element containing the menu.\nConfigures the overlay with appropriate placement, type, and event handlers." }, { "kind": "field", "name": "renderDescriptionSlot", "type": { "text": "TemplateResult" }, "privacy": "protected", "description": "Renders the description slot for additional picker context.\nContent is referenced by aria-describedby for accessibility.", "readonly": true }, { "kind": "method", "name": "bindButtonKeydownListener", "privacy": "protected", "return": { "type": { "text": "void" } }, "description": "Binds the keydown event listener to the trigger button.\nCalled during first update to enable keyboard navigation." }, { "kind": "field", "name": "dismissHelper", "type": { "text": "TemplateResult" }, "privacy": "protected", "description": "Renders a visually hidden dismiss button for accessibility.\nAllows screen reader users to dismiss the overlay.", "readonly": true }, { "kind": "method", "name": "renderContainer", "privacy": "protected", "return": { "type": { "text": "" } }, "parameters": [ { "name": "menu", "type": { "text": "TemplateResult" }, "description": "The menu template to wrap in the container" } ], "description": "Renders the overlay container (popover or tray) based on device type.\nOn mobile, uses a tray; on desktop, uses a popover." }, { "kind": "field", "name": "hasRenderedOverlay", "type": { "text": "boolean" }, "privacy": "protected", "default": "false", "description": "Tracks whether the overlay has been rendered at least once." }, { "kind": "method", "name": "onScroll", "privacy": "private", "return": { "type": { "text": "void" } }, "description": "Dispatches a scroll event when the menu is scrolled.\nThe event is intentionally non-composed so it fires on the picker host\nfor consumers but does not cross the shadow DOM boundary into ancestors." }, { "kind": "field", "name": "renderMenu", "type": { "text": "TemplateResult" }, "privacy": "protected", "description": "Renders the menu and overlay structure.\nLazily renders the overlay only after the picker has been focused or opened.", "readonly": true }, { "kind": "field", "name": "willManageSelection", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Tracks whether a selection change is already scheduled for the next frame." }, { "kind": "method", "name": "shouldScheduleManageSelection", "privacy": "protected", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "event", "optional": true, "type": { "text": "Event" }, "description": "Optional event that triggered the scheduling" } ], "description": "Schedules selection management for the next animation frame.\nCalled when the value changes or menu slot content changes.\nPrevents duplicate scheduling if already pending." }, { "kind": "method", "name": "shouldManageSelection", "privacy": "protected", "return": { "type": { "text": "void" } }, "description": "Immediately manages selection when a menu item is added or updated.\nSkips if selection management is already scheduled." }, { "kind": "method", "name": "manageSelection", "privacy": "protected", "return": { "type": { "text": "Promise" } }, "description": "Synchronizes the menu selection state with the picker's current value.\nFinds and selects the menu item matching the current value,\nand deselects all other items." }, { "kind": "field", "name": "selectionPromise", "privacy": "private" }, { "kind": "field", "name": "selectionResolver", "type": { "text": "() => void" }, "privacy": "private" }, { "kind": "method", "name": "getUpdateComplete", "privacy": "protected", "return": { "type": { "text": "Promise" } } }, { "kind": "field", "name": "recentlyConnected", "type": { "text": "boolean" }, "privacy": "private", "default": "false" }, { "kind": "field", "name": "enterKeydownOn", "type": { "text": "EventTarget | null" }, "privacy": "private", "default": "null", "description": "Tracks the target of an active Enter keydown to prevent double-activation." }, { "kind": "field", "name": "handleEnterKeydown", "privacy": "protected", "description": "Handles Enter key events to prevent double-activation of menu items.\nTracks keydown state and clears it on keyup.\nAlso prevents Enter from triggering submenus that aren't open.", "parameters": [ { "description": "The keyboard event", "name": "event" } ] }, { "kind": "field", "name": "shadowRootOptions", "type": { "text": "object" }, "static": true, "default": "{ ...SpectrumElement.shadowRootOptions, delegatesFocus: true, }", "description": "Shadow root configuration with delegatesFocus enabled.\nAllows focus to be delegated to focusable children within the shadow root.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "isMobile", "privacy": "public", "default": "new MatchMediaController(this, IS_MOBILE)", "description": "Controller that tracks whether the device is mobile.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "isTouchDevice", "privacy": "public", "default": "new MatchMediaController(this, IS_TOUCH_DEVICE)", "description": "Controller that tracks whether the device supports touch input.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "strategy", "type": { "text": "DesktopController | MobileController" }, "privacy": "public", "description": "The interaction strategy controller (desktop or mobile) managing pointer and keyboard events.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "button", "type": { "text": "HTMLButtonElement" }, "privacy": "public", "description": "Reference to the component's trigger button element.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "dependencyManager", "privacy": "public", "default": "new DependencyManagerController(this)", "description": "Controller that manages lazy-loading of overlay dependencies.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "disabled", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component is disabled. When disabled, the component cannot be interacted with.", "attribute": "disabled", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "focused", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component currently has visible focus.", "attribute": "focused", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "readonly", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component is read-only. When read-only, the component displays its value but cannot be changed.", "attribute": "readonly", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "pending", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the items are currently loading.", "attribute": "pending", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "forcePopover", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Forces the component to render as a popover on mobile instead of a tray.", "attribute": "force-popover", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "open", "type": { "text": "boolean" }, "privacy": "public", "default": "false", "description": "Whether the component's menu overlay is currently open.", "attribute": "open", "reflects": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "optionsMenu", "type": { "text": "Menu" }, "privacy": "public", "description": "Reference to the component's internal menu element.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "overlayElement", "type": { "text": "Overlay" }, "privacy": "public", "description": "Reference to the component's overlay element.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "placement", "type": { "text": "\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"" }, "privacy": "public", "default": "'bottom-start'", "description": "The preferred placement of the component's overlay relative to the trigger button.", "attribute": "placement", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "focusElement", "type": { "text": "HTMLElement" }, "privacy": "public", "description": "Returns the element that should receive focus.\nWhen open, returns the options menu; otherwise returns the trigger button.", "readonly": true, "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "focus", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "options", "optional": true, "type": { "text": "FocusOptions" }, "description": "Standard focus options" } ], "description": "Focuses the appropriate element (button or menu) based on the picker's state.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "close", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Closes the component's overlay.\nHas no effect when the component is readonly.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "toggle", "privacy": "public", "return": { "type": { "text": "void" } }, "parameters": [ { "name": "target", "optional": true, "type": { "text": "boolean" }, "description": "Optional explicit open state. If not provided, toggles the current state." } ], "description": "Toggles the component's open state.\nHas no effect when the component is readonly, pending, or disabled.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "handleSlottableRequest", "privacy": "public", "description": "Handles slottable request events from the overlay.\nOverride in subclasses to customize slottable behavior.", "parameters": [ { "description": "The slottable request event", "name": "_event" } ], "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "field", "name": "handleBeforetoggle", "privacy": "protected", "description": "Handles the overlay's beforetoggle event.\nManages overlay state and prevents unwanted closures during interaction.", "parameters": [ { "description": "The beforetoggle event with the new state", "name": "event" } ], "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "method", "name": "bindEvents", "privacy": "public", "return": { "type": { "text": "void" } }, "description": "Binds the appropriate interaction strategy (desktop or mobile) based on device type.\nAborts any existing strategy before creating a new one.", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.js" } } ], "events": [ { "name": "change", "type": { "text": "Event" }, "description": "Announces that the `value` of the element has changed" }, { "name": "scroll", "type": { "text": "Event" } }, { "description": "Announces that the overlay has been opened", "name": "sp-opened" }, { "description": "Announces that the overlay has been closed", "name": "sp-closed" } ], "attributes": [ { "name": "icons", "type": { "text": "'only' | 'none' | undefined" }, "description": "Controls how icons are displayed in the picker button.\n- `'only'`: Shows only the icon, hiding the label visually.\n- `'none'`: Hides the icon entirely.", "fieldName": "icons" }, { "name": "invalid", "type": { "text": "boolean" }, "default": "false", "description": "Whether the picker is in an invalid state. Displays a validation icon when true.", "fieldName": "invalid" }, { "name": "pending-label", "type": { "text": "string" }, "default": "'Pending'", "description": "Defines a string value that labels the Picker while it is in pending state.", "fieldName": "pendingLabel" }, { "name": "label", "type": { "text": "string | undefined" }, "description": "The placeholder label displayed when no item is selected.", "fieldName": "label" }, { "name": "quiet", "type": { "text": "boolean" }, "default": "false", "description": "Whether to render the picker in quiet mode with minimal visual styling.", "fieldName": "quiet" }, { "name": "value", "type": { "text": "string" }, "default": "''", "description": "The current value of the picker, corresponding to the selected menu item's value.", "fieldName": "value" }, { "name": "placement", "type": { "text": "\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"" }, "default": "'bottom-start'", "description": "The preferred placement of the component's overlay relative to the trigger button.", "fieldName": "placement", "attribute": "placement", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "disabled", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component is disabled. When disabled, the component cannot be interacted with.", "fieldName": "disabled", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "focused", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component currently has visible focus.", "fieldName": "focused", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "readonly", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component is read-only. When read-only, the component displays its value but cannot be changed.", "fieldName": "readonly", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "pending", "type": { "text": "boolean" }, "default": "false", "description": "Whether the items are currently loading.", "fieldName": "pending", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "force-popover", "type": { "text": "boolean" }, "default": "false", "description": "Forces the component to render as a popover on mobile instead of a tray.", "fieldName": "forcePopover", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } }, { "name": "open", "type": { "text": "boolean" }, "default": "false", "description": "Whether the component's menu overlay is currently open.", "fieldName": "open", "inheritedFrom": { "name": "ExpandableElement", "module": "src/Picker.ts" } } ], "mixins": [ { "name": "SizedMixin", "package": "@spectrum-web-components/base" } ], "superclass": { "name": "ExpandableElement", "module": "src/Picker.ts" }, "tagName": "sp-picker", "customElement": true } ], "exports": [ { "kind": "js", "name": "DESCRIPTION_ID", "declaration": { "name": "DESCRIPTION_ID", "module": "src/Picker.js" } }, { "kind": "js", "name": "ExpandableElement", "declaration": { "name": "ExpandableElement", "module": "src/Picker.js" } }, { "kind": "js", "name": "PickerBase", "declaration": { "name": "PickerBase", "module": "src/Picker.js" } }, { "kind": "js", "name": "Picker", "declaration": { "name": "Picker", "module": "src/Picker.js" } } ] } ] }