UNPKG

@spectrum-web-components/picker

Version:

An `<sp-picker>` is an alternative to HTML's `<select>` element. Use [`<sp-menu-item>`](../menu-item) elements to outline the options that will be made available to the user when interacting with the `<sp-picker>` element.

3 lines (2 loc) 2.73 kB
"use strict";export var InteractionTypes=(t=>(t[t.desktop=0]="desktop",t[t.mobile=1]="mobile",t))(InteractionTypes||{});export const SAFARI_FOCUS_RING_CLASS="remove-focus-ring-safari-hack";export class InteractionController{constructor(e,t){this.target=e;this.host=t;this.preventNextToggle="no";this.pointerdownState=!1;this.enterKeydownOn=null;this._open=!1;this.target=e,this.host=t,this.host.addController(this),this.init()}get activelyOpening(){return!1}get open(){return this._open}set open(e){if(this._open!==e){if(this._open=e,this.overlay){this.host.open=e;return}customElements.whenDefined("sp-overlay").then(async()=>{const{Overlay:t}=await import("@spectrum-web-components/overlay/src/Overlay.js");this.overlay=new t,this.host.open=!0,this.host.requestUpdate()}),import("@spectrum-web-components/overlay/sp-overlay.js")}}get overlay(){return this._overlay}set overlay(e){e&&this.overlay!==e&&(this._overlay=e,this.initOverlay())}releaseDescription(){}handleBeforetoggle(e){var t;e.composedPath()[0]===e.target&&(e.newState==="closed"&&(this.preventNextToggle==="no"?this.open=!1:this.pointerdownState||(t=this.overlay)==null||t.manuallyKeepOpen()),this.open||(this.host.optionsMenu.updateSelectedItemIndex(),this.host.optionsMenu.closeDescendentOverlays()))}initOverlay(){this.overlay&&(this.overlay.addEventListener("beforetoggle",e=>{this.handleBeforetoggle(e)}),this.overlay.type=this.host.isMobile.matches&&!this.host.forcePopover?"modal":"auto",this.overlay.triggerElement=this.host,this.overlay.placement=this.host.isMobile.matches&&!this.host.forcePopover?void 0:this.host.placement,this.overlay.receivesFocus="false",this.overlay.willPreventClose=this.preventNextToggle!=="no"&&this.open,this.overlay.addEventListener("slottable-request",this.host.handleSlottableRequest))}handlePointerdown(e){}handleButtonFocus(e){this.preventNextToggle==="maybe"&&e.relatedTarget===this.host.optionsMenu&&(this.preventNextToggle="yes"),this.preventNextToggle==="no"&&this.host.close()}handleActivate(e){}init(){}abort(){var e;this.releaseDescription(),(e=this.abortController)==null||e.abort()}hostConnected(){this.init(),this.host.addEventListener("sp-opened",()=>{this.host.optionsMenu.shouldSupportDragAndSelect=!this.host.isMobile.matches}),this.host.addEventListener("sp-closed",()=>{!this.open&&this.host.optionsMenu.matches(":focus-within")&&!this.host.button.matches(":focus")&&this.host.button.focus()})}hostDisconnected(){var e;(e=this.abortController)==null||e.abort()}hostUpdated(){this.overlay&&this.host.dependencyManager.loaded&&this.host.open!==this.overlay.open&&(this.overlay.willPreventClose=this.preventNextToggle!=="no",this.overlay.open=this.host.open)}} //# sourceMappingURL=InteractionController.js.map