@spectrum-web-components/picker 0.36.0 → 0.37.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/picker",
-    "version": "0.36.0",
+    "version": "0.37.0",
     "publishConfig": {
         "access": "public"
     },
@@ -65,17 +65,17 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.36.0",
-        "@spectrum-web-components/button": "^0.36.0",
-        "@spectrum-web-components/icon": "^0.36.0",
-        "@spectrum-web-components/icons-ui": "^0.36.0",
-        "@spectrum-web-components/icons-workflow": "^0.36.0",
-        "@spectrum-web-components/menu": "^0.36.0",
-        "@spectrum-web-components/overlay": "^0.36.0",
-        "@spectrum-web-components/popover": "^0.36.0",
-        "@spectrum-web-components/reactive-controllers": "^0.36.0",
-        "@spectrum-web-components/shared": "^0.36.0",
-        "@spectrum-web-components/tray": "^0.36.0"
+        "@spectrum-web-components/base": "^0.37.0",
+        "@spectrum-web-components/button": "^0.37.0",
+        "@spectrum-web-components/icon": "^0.37.0",
+        "@spectrum-web-components/icons-ui": "^0.37.0",
+        "@spectrum-web-components/icons-workflow": "^0.37.0",
+        "@spectrum-web-components/menu": "^0.37.0",
+        "@spectrum-web-components/overlay": "^0.37.0",
+        "@spectrum-web-components/popover": "^0.37.0",
+        "@spectrum-web-components/reactive-controllers": "^0.37.0",
+        "@spectrum-web-components/shared": "^0.37.0",
+        "@spectrum-web-components/tray": "^0.37.0"
     },
     "devDependencies": {
         "@spectrum-css/picker": "^4.0.22"
@@ -88,5 +88,5 @@
         "./sync/index.js",
         "./sync/sp-*.js"
     ],
-    "gitHead": "a532ff8a410abeefb54d9638a2316ae82570566e"
+    "gitHead": "d771f62f0d8063070af43283bb0fd5e3400bad06"
 }

package/src/Picker.d.ts

@@ -1,26 +1,22 @@
 import { CSSResultArray, PropertyValues, TemplateResult } from '@spectrum-web-components/base';
+import { StyleInfo } from '@spectrum-web-components/base/src/directives.js';
 import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-chevron100.js';
 import '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';
 import '@spectrum-web-components/menu/sp-menu.js';
-import type { Menu, MenuItem, MenuItemAddedOrUpdatedEvent, MenuItemChildren, MenuItemRemovedEvent } from '@spectrum-web-components/menu';
-import '@spectrum-web-components/tray/sp-tray.js';
-import '@spectrum-web-components/popover/sp-popover.js';
-import { OverlayOptions, Placement, TriggerInteractions } from '@spectrum-web-components/overlay';
+import type { Menu, MenuItem, MenuItemChildren } from '@spectrum-web-components/menu';
+import { Placement } from '@spectrum-web-components/overlay';
 import { MatchMediaController } from '@spectrum-web-components/reactive-controllers/src/MatchMedia.js';
+import type { Overlay } from '@spectrum-web-components/overlay/src/Overlay.js';
 declare const PickerBase_base: typeof Focusable & {
     new (...args: any[]): import("@spectrum-web-components/base").SizedElementInterface;
     prototype: import("@spectrum-web-components/base").SizedElementInterface;
 };
 export declare class PickerBase extends PickerBase_base {
-    /**
-     * @private
-     */
-    static openOverlay: (target: HTMLElement, interaction: TriggerInteractions, content: HTMLElement, options: OverlayOptions) => Promise<() => void>;
     protected isMobile: MatchMediaController;
     appliedLabel?: string;
     button: HTMLButtonElement;
-    get target(): HTMLButtonElement | this;
+    private deprecatedMenu;
     disabled: boolean;
     focused: boolean;
     icons?: 'only' | 'none';
@@ -29,64 +25,62 @@ export declare class PickerBase extends PickerBase_base {
     open: boolean;
     readonly: boolean;
     selects: undefined | 'single';
-    menuItems: MenuItem[];
-    private restoreChildren?;
-    optionsMenu: Menu;
+    protected get menuItems(): MenuItem[];
+    protected optionsMenu: Menu;
+    protected overlayElement: Overlay;
     /**
-     * @type {"auto" | "auto-start" | "auto-end" | "top" | "bottom" | "right" | "left" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | "none"}
+     * @type {"top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end"}
      * @attr
      */
     placement: Placement;
     quiet: boolean;
     value: string;
-    selectedItem?: MenuItem;
-    private closeOverlay?;
-    private popoverEl;
+    get selectedItem(): MenuItem | undefined;
+    set selectedItem(selectedItem: MenuItem | undefined);
+    _selectedItem?: MenuItem;
     protected listRole: 'listbox' | 'menu';
     protected itemRole: string;
-    constructor();
     get focusElement(): HTMLElement;
     forceFocusVisible(): void;
-    onButtonBlur(): void;
-    protected onButtonClick(): void;
+    handleButtonBlur(): void;
+    protected preventNextToggle: 'no' | 'maybe' | 'yes';
+    protected handlebuttonPointerdown(): void;
+    protected handleButtonFocus(event: FocusEvent): void;
+    protected handleButtonClick(): void;
     focus(options?: FocusOptions): void;
-    onHelperFocus(): void;
-    onButtonFocus(): void;
+    handleHelperFocus(): void;
     handleChange(event: Event): void;
-    protected onKeydown: (event: KeyboardEvent) => void;
-    setValueFromItem(item: MenuItem, menuChangeEvent?: Event): Promise<void>;
+    protected handleKeydown: (event: KeyboardEvent) => void;
+    protected setValueFromItem(item: MenuItem, menuChangeEvent?: Event): Promise<void>;
     protected setMenuItemSelected(item: MenuItem, value: boolean): void;
     toggle(target?: boolean): void;
     close(): void;
-    overlayOpenCallback: () => Promise<void>;
-    overlayCloseCallback: () => Promise<void>;
-    private popoverFragment;
-    private generatePopover;
-    private openMenu;
-    protected sizePopover(popover: HTMLElement): void;
-    private closeMenu;
+    protected get containerStyles(): StyleInfo;
     protected get selectedItemContent(): MenuItemChildren;
+    protected set selectedItemContent(selectedItemContent: MenuItemChildren | undefined);
+    _selectedItemContent?: MenuItemChildren;
     protected renderLabelContent(content: Node[]): TemplateResult | Node[];
     protected get buttonContent(): TemplateResult[];
     applyFocusElementLabel: (value?: string) => void;
+    protected renderOverlay(menu: TemplateResult): TemplateResult;
     protected render(): TemplateResult;
     protected update(changes: PropertyValues<this>): void;
+    protected bindButtonKeydownListener(): void;
+    protected firstUpdated(changes: PropertyValues<this>): void;
     protected get dismissHelper(): TemplateResult;
-    protected get renderPopover(): TemplateResult;
-    private _willUpdateItems;
-    protected itemsUpdated: Promise<void>;
-    /**
-     * Acquire the available MenuItems in the Picker by
-     * direct element query or by assuming the list managed
-     * by the Menu within the open options overlay.
-     */
-    protected updateMenuItems(event?: MenuItemAddedOrUpdatedEvent | MenuItemRemovedEvent): void;
+    protected renderContainer(menu: TemplateResult): TemplateResult;
+    protected hasOpened: boolean;
+    protected get renderMenu(): TemplateResult;
+    private willManageSelection;
+    protected shouldScheduleManageSelection(event?: Event): void;
+    protected shouldManageSelection(): void;
     protected manageSelection(): Promise<void>;
-    private menuStatePromise;
-    private menuStateResolver;
     private selectionPromise;
     private selectionResolver;
     protected getUpdateComplete(): Promise<boolean>;
+    private recentlyConnected;
+    private enterKeydownOn;
+    protected handleEnterKeydown: (event: KeyboardEvent) => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
 }
@@ -101,7 +95,7 @@ export declare class PickerBase extends PickerBase_base {
  */
 export declare class Picker extends PickerBase {
     static get styles(): CSSResultArray;
-    protected sizePopover(popover: HTMLElement): void;
-    protected onKeydown: (event: KeyboardEvent) => void;
+    protected get containerStyles(): StyleInfo;
+    protected handleKeydown: (event: KeyboardEvent) => void;
 }
 export {};