npm - @material/web - Versions diffs - 1.0.1 → 1.0.2-nightly.3d8c7ac.0 - Mend

@material/web 1.0.1 → 1.0.2-nightly.3d8c7ac.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (314) hide show

package/all.d.ts +2 -0
package/all.js +2 -0
package/all.js.map +1 -1
package/button/elevated-button.js +5 -1
package/button/elevated-button.js.map +1 -1
package/button/internal/_elevation.scss +32 -32
package/button/internal/_icon.scss +22 -23
package/button/internal/_outlined-button.scss +21 -19
package/button/internal/_shared.scss +84 -77
package/button/internal/_touch-target.scss +4 -0
package/button/internal/button.d.ts +7 -11
package/button/internal/button.js +52 -38
package/button/internal/button.js.map +1 -1
package/button/internal/elevated-button.d.ts +1 -1
package/button/internal/elevated-button.js +1 -1
package/button/internal/elevated-button.js.map +1 -1
package/button/internal/filled-button.d.ts +1 -1
package/button/internal/filled-button.js +1 -1
package/button/internal/filled-button.js.map +1 -1
package/button/internal/filled-tonal-button.d.ts +1 -1
package/button/internal/filled-tonal-button.js +1 -1
package/button/internal/filled-tonal-button.js.map +1 -1
package/button/internal/outlined-button.d.ts +1 -1
package/button/internal/outlined-button.js +2 -2
package/button/internal/outlined-button.js.map +1 -1
package/button/internal/outlined-styles.css.js +1 -1
package/button/internal/outlined-styles.css.js.map +1 -1
package/button/internal/shared-elevation-styles.css.js +1 -1
package/button/internal/shared-elevation-styles.css.js.map +1 -1
package/button/internal/shared-styles.css.js +1 -1
package/button/internal/shared-styles.css.js.map +1 -1
package/checkbox/internal/checkbox.d.ts +18 -25
package/checkbox/internal/checkbox.js +43 -74
package/checkbox/internal/checkbox.js.map +1 -1
package/chips/filter-chip.js +5 -1
package/chips/filter-chip.js.map +1 -1
package/chips/harness.js.map +1 -1
package/chips/input-chip.js +6 -1
package/chips/input-chip.js.map +1 -1
package/chips/internal/assist-chip.js +8 -4
package/chips/internal/assist-chip.js.map +1 -1
package/chips/internal/chip-set.js +6 -4
package/chips/internal/chip-set.js.map +1 -1
package/chips/internal/chip.d.ts +3 -0
package/chips/internal/chip.js +7 -5
package/chips/internal/chip.js.map +1 -1
package/chips/internal/filter-chip.d.ts +2 -0
package/chips/internal/filter-chip.js +11 -5
package/chips/internal/filter-chip.js.map +1 -1
package/chips/internal/input-chip.d.ts +2 -0
package/chips/internal/input-chip.js +10 -4
package/chips/internal/input-chip.js.map +1 -1
package/chips/internal/multi-action-chip.js.map +1 -1
package/chips/internal/trailing-icons.d.ts +1 -1
package/chips/internal/trailing-icons.js +6 -5
package/chips/internal/trailing-icons.js.map +1 -1
package/common.d.ts +2 -0
package/common.js +2 -0
package/common.js.map +1 -1
package/dialog/harness.js +1 -2
package/dialog/harness.js.map +1 -1
package/dialog/internal/_dialog.scss +1 -1
package/dialog/internal/animations.js +14 -12
package/dialog/internal/animations.js.map +1 -1
package/dialog/internal/dialog-styles.css.js +1 -1
package/dialog/internal/dialog-styles.css.js.map +1 -1
package/dialog/internal/dialog.d.ts +6 -6
package/dialog/internal/dialog.js +24 -24
package/dialog/internal/dialog.js.map +1 -1
package/fab/harness.js.map +1 -1
package/fab/internal/fab.js.map +1 -1
package/fab/internal/shared.js +10 -11
package/fab/internal/shared.js.map +1 -1
package/field/harness.js.map +1 -1
package/field/internal/_content.scss +185 -174
package/field/internal/_filled-field.scss +147 -136
package/field/internal/_label.scss +83 -72
package/field/internal/_outlined-field.scss +276 -262
package/field/internal/_supporting-text.scss +53 -42
package/field/internal/field.js +26 -22
package/field/internal/field.js.map +1 -1
package/field/internal/filled-styles.css.js +1 -1
package/field/internal/filled-styles.css.js.map +1 -1
package/field/internal/outlined-styles.css.js +1 -1
package/field/internal/outlined-styles.css.js.map +1 -1
package/field/internal/shared-styles.css.js +1 -1
package/field/internal/shared-styles.css.js.map +1 -1
package/focus/internal/focus-ring.d.ts +2 -0
package/focus/internal/focus-ring.js +3 -3
package/focus/internal/focus-ring.js.map +1 -1
package/icon/internal/_icon.scss +7 -4
package/icon/internal/icon-styles.css.js +1 -1
package/icon/internal/icon-styles.css.js.map +1 -1
package/iconbutton/internal/icon-button.d.ts +9 -4
package/iconbutton/internal/icon-button.js +35 -22
package/iconbutton/internal/icon-button.js.map +1 -1
package/internal/aria/aria.d.ts +4 -26
package/internal/aria/aria.js +10 -28
package/internal/aria/aria.js.map +1 -1
package/internal/aria/delegate.js +2 -2
package/internal/aria/delegate.js.map +1 -1
package/internal/controller/attachable-controller.js +3 -5
package/internal/controller/attachable-controller.js.map +1 -1
package/internal/controller/form-submitter.d.ts +3 -5
package/internal/controller/form-submitter.js +5 -7
package/internal/controller/form-submitter.js.map +1 -1
package/internal/controller/is-rtl.js +2 -2
package/internal/controller/is-rtl.js.map +1 -1
package/internal/controller/string-converter.js +1 -1
package/internal/controller/string-converter.js.map +1 -1
package/internal/motion/animation.js.map +1 -1
package/labs/behaviors/element-internals.d.ts +45 -0
package/labs/behaviors/element-internals.js +50 -0
package/labs/behaviors/element-internals.js.map +1 -0
package/labs/behaviors/focusable.d.ts +39 -0
package/labs/behaviors/focusable.js +82 -0
package/labs/behaviors/focusable.js.map +1 -0
package/labs/behaviors/form-associated.d.ts +199 -0
package/labs/behaviors/form-associated.js +155 -0
package/labs/behaviors/form-associated.js.map +1 -0
package/labs/behaviors/mixin.d.ts +54 -0
package/labs/behaviors/mixin.js +7 -0
package/labs/behaviors/mixin.js.map +1 -0
package/labs/behaviors/validators/checkbox-validator.d.ts +32 -0
package/labs/behaviors/validators/checkbox-validator.js +32 -0
package/labs/behaviors/validators/checkbox-validator.js.map +1 -0
package/labs/behaviors/validators/validator.d.ts +92 -0
package/labs/behaviors/validators/validator.js +73 -0
package/labs/behaviors/validators/validator.js.map +1 -0
package/labs/card/_elevated-card.scss +6 -0
package/labs/card/_filled-card.scss +6 -0
package/labs/card/_outlined-card.scss +6 -0
package/labs/card/elevated-card.d.ts +18 -0
package/labs/card/elevated-card.js +21 -0
package/labs/card/elevated-card.js.map +1 -0
package/labs/card/filled-card.d.ts +18 -0
package/labs/card/filled-card.js +21 -0
package/labs/card/filled-card.js.map +1 -0
package/labs/card/internal/_elevated-card.scss +35 -0
package/labs/card/internal/_filled-card.scss +35 -0
package/labs/card/internal/_outlined-card.scss +39 -0
package/labs/card/internal/_shared.scss +40 -0
package/labs/card/internal/card.d.ts +13 -0
package/labs/card/internal/card.js +20 -0
package/labs/card/internal/card.js.map +1 -0
package/labs/card/internal/elevated-styles.css.js +9 -0
package/labs/card/internal/elevated-styles.css.js.map +1 -0
package/labs/card/internal/elevated-styles.scss +10 -0
package/labs/card/internal/filled-styles.css.js +9 -0
package/labs/card/internal/filled-styles.css.js.map +1 -0
package/labs/card/internal/filled-styles.scss +10 -0
package/labs/card/internal/outlined-styles.css.js +9 -0
package/labs/card/internal/outlined-styles.css.js.map +1 -0
package/labs/card/internal/outlined-styles.scss +10 -0
package/labs/card/internal/shared-styles.css.js +9 -0
package/labs/card/internal/shared-styles.css.js.map +1 -0
package/labs/card/internal/shared-styles.scss +10 -0
package/labs/card/outlined-card.d.ts +18 -0
package/labs/card/outlined-card.js +21 -0
package/labs/card/outlined-card.js.map +1 -0
package/labs/item/internal/item.js +8 -8
package/labs/item/internal/item.js.map +1 -1
package/labs/navigationbar/internal/constants.js.map +1 -1
package/labs/navigationbar/internal/navigation-bar.d.ts +3 -0
package/labs/navigationbar/internal/navigation-bar.js +18 -11
package/labs/navigationbar/internal/navigation-bar.js.map +1 -1
package/labs/navigationdrawer/internal/navigation-drawer-modal.d.ts +3 -0
package/labs/navigationdrawer/internal/navigation-drawer-modal.js +10 -3
package/labs/navigationdrawer/internal/navigation-drawer-modal.js.map +1 -1
package/labs/navigationdrawer/internal/navigation-drawer.d.ts +3 -0
package/labs/navigationdrawer/internal/navigation-drawer.js +8 -1
package/labs/navigationdrawer/internal/navigation-drawer.js.map +1 -1
package/labs/navigationtab/harness.js.map +1 -1
package/labs/navigationtab/internal/navigation-tab.d.ts +6 -0
package/labs/navigationtab/internal/navigation-tab.js +43 -27
package/labs/navigationtab/internal/navigation-tab.js.map +1 -1
package/labs/navigationtab/internal/state.js.map +1 -1
package/labs/segmentedbutton/internal/segmented-button.d.ts +3 -0
package/labs/segmentedbutton/internal/segmented-button.js +26 -12
package/labs/segmentedbutton/internal/segmented-button.js.map +1 -1
package/labs/segmentedbuttonset/internal/segmented-button-set.d.ts +5 -0
package/labs/segmentedbuttonset/internal/segmented-button-set.js +14 -9
package/labs/segmentedbuttonset/internal/segmented-button-set.js.map +1 -1
package/list/harness.d.ts +1 -1
package/list/harness.js.map +1 -1
package/list/internal/list-controller.d.ts +1 -1
package/list/internal/list-controller.js +7 -3
package/list/internal/list-controller.js.map +1 -1
package/list/internal/list-navigation-helpers.js.map +1 -1
package/list/internal/list.d.ts +2 -2
package/list/internal/list.js +8 -6
package/list/internal/list.js.map +1 -1
package/list/internal/listitem/harness.d.ts +1 -1
package/list/internal/listitem/harness.js.map +1 -1
package/list/internal/listitem/list-item.d.ts +3 -2
package/list/internal/listitem/list-item.js +19 -20
package/list/internal/listitem/list-item.js.map +1 -1
package/list/list-item.d.ts +4 -12
package/list/list-item.js +4 -12
package/list/list-item.js.map +1 -1
package/menu/harness.js.map +1 -1
package/menu/internal/_menu.scss +12 -1
package/menu/internal/controllers/menuItemController.js +9 -4
package/menu/internal/controllers/menuItemController.js.map +1 -1
package/menu/internal/controllers/shared.d.ts +9 -1
package/menu/internal/controllers/shared.js +4 -4
package/menu/internal/controllers/shared.js.map +1 -1
package/menu/internal/controllers/surfacePositionController.d.ts +16 -2
package/menu/internal/controllers/surfacePositionController.js +124 -54
package/menu/internal/controllers/surfacePositionController.js.map +1 -1
package/menu/internal/controllers/typeaheadController.js +19 -14
package/menu/internal/controllers/typeaheadController.js.map +1 -1
package/menu/internal/menu-styles.css.js +1 -1
package/menu/internal/menu-styles.css.js.map +1 -1
package/menu/internal/menu.d.ts +43 -12
package/menu/internal/menu.js +124 -57
package/menu/internal/menu.js.map +1 -1
package/menu/internal/menuitem/harness.js.map +1 -1
package/menu/internal/menuitem/menu-item.d.ts +3 -2
package/menu/internal/menuitem/menu-item.js +18 -19
package/menu/internal/menuitem/menu-item.js.map +1 -1
package/menu/internal/submenu/sub-menu.d.ts +8 -8
package/menu/internal/submenu/sub-menu.js +31 -22
package/menu/internal/submenu/sub-menu.js.map +1 -1
package/menu/internal/types.js.map +1 -1
package/package.json +1 -1
package/progress/internal/_circular-progress.scss +2 -2
package/progress/internal/_linear-progress.scss +1 -1
package/progress/internal/circular-progress-styles.css.js +1 -1
package/progress/internal/circular-progress-styles.css.js.map +1 -1
package/progress/internal/circular-progress.js +11 -10
package/progress/internal/circular-progress.js.map +1 -1
package/progress/internal/linear-progress-styles.css.js +1 -1
package/progress/internal/linear-progress-styles.css.js.map +1 -1
package/progress/internal/linear-progress.d.ts +1 -1
package/progress/internal/linear-progress.js +3 -3
package/progress/internal/linear-progress.js.map +1 -1
package/progress/internal/progress.js +4 -2
package/progress/internal/progress.js.map +1 -1
package/radio/internal/radio.d.ts +11 -27
package/radio/internal/radio.js +30 -54
package/radio/internal/radio.js.map +1 -1
package/radio/internal/single-selection-controller.js +1 -1
package/radio/internal/single-selection-controller.js.map +1 -1
package/ripple/internal/ripple.js +14 -9
package/ripple/internal/ripple.js.map +1 -1
package/select/filled-select.js +1 -2
package/select/filled-select.js.map +1 -1
package/select/harness.js +1 -1
package/select/harness.js.map +1 -1
package/select/internal/select.d.ts +25 -34
package/select/internal/select.js +101 -91
package/select/internal/select.js.map +1 -1
package/select/internal/selectoption/select-option.d.ts +8 -6
package/select/internal/selectoption/select-option.js +23 -22
package/select/internal/selectoption/select-option.js.map +1 -1
package/select/internal/selectoption/selectOptionController.js +1 -1
package/select/internal/selectoption/selectOptionController.js.map +1 -1
package/select/outlined-select.js +1 -2
package/select/outlined-select.js.map +1 -1
package/slider/harness.js +5 -5
package/slider/harness.js.map +1 -1
package/slider/internal/slider.d.ts +16 -25
package/slider/internal/slider.js +110 -114
package/slider/internal/slider.js.map +1 -1
package/switch/internal/switch.d.ts +11 -27
package/switch/internal/switch.js +40 -80
package/switch/internal/switch.js.map +1 -1
package/tabs/harness.js +3 -3
package/tabs/harness.js.map +1 -1
package/tabs/internal/_tab.scss +27 -35
package/tabs/internal/primary-tab.d.ts +0 -2
package/tabs/internal/tab-styles.css.js +1 -1
package/tabs/internal/tab-styles.css.js.map +1 -1
package/tabs/internal/tab.d.ts +4 -5
package/tabs/internal/tab.js +34 -22
package/tabs/internal/tab.js.map +1 -1
package/tabs/internal/tabs.d.ts +6 -2
package/tabs/internal/tabs.js +18 -11
package/tabs/internal/tabs.js.map +1 -1
package/textfield/filled-text-field.js +1 -2
package/textfield/filled-text-field.js.map +1 -1
package/textfield/harness.js +3 -2
package/textfield/harness.js.map +1 -1
package/textfield/internal/text-field.d.ts +26 -18
package/textfield/internal/text-field.js +81 -58
package/textfield/internal/text-field.js.map +1 -1
package/textfield/outlined-text-field.js +1 -2
package/textfield/outlined-text-field.js.map +1 -1
package/tokens/_index.scss +3 -0
package/tokens/_md-comp-elevated-card.scss +63 -0
package/tokens/_md-comp-filled-card.scss +63 -0
package/tokens/_md-comp-icon.scss +2 -0
package/tokens/_md-comp-outlined-card.scss +69 -0
package/tokens/_md-comp-test-table.scss +1 -0
package/internal/controller/element-internals.d.ts +0 -35
package/internal/controller/element-internals.js +0 -24
package/internal/controller/element-internals.js.map +0 -1
package/select/internal/filled-forced-colors-styles.css.js +0 -9
package/select/internal/filled-forced-colors-styles.css.js.map +0 -1
package/select/internal/filled-forced-colors-styles.scss +0 -29
package/select/internal/outlined-forced-colors-styles.css.js +0 -9
package/select/internal/outlined-forced-colors-styles.css.js.map +0 -1
package/select/internal/outlined-forced-colors-styles.scss +0 -29
package/textfield/internal/filled-forced-colors-styles.css.js +0 -9
package/textfield/internal/filled-forced-colors-styles.css.js.map +0 -1
package/textfield/internal/filled-forced-colors-styles.scss +0 -29
package/textfield/internal/outlined-forced-colors-styles.css.js +0 -9
package/textfield/internal/outlined-forced-colors-styles.css.js.map +0 -1
package/textfield/internal/outlined-forced-colors-styles.scss +0 -29
/package/{select/internal/filled-forced-colors-styles.css.d.ts → labs/card/internal/elevated-styles.css.d.ts} +0 -0
/package/{select/internal/outlined-forced-colors-styles.css.d.ts → labs/card/internal/filled-styles.css.d.ts} +0 -0
/package/{textfield/internal/filled-forced-colors-styles.css.d.ts → labs/card/internal/outlined-styles.css.d.ts} +0 -0
/package/{textfield/internal/outlined-forced-colors-styles.css.d.ts → labs/card/internal/shared-styles.css.d.ts} +0 -0

package/menu/internal/controllers/surfacePositionController.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"surfacePositionController.js","sourceRoot":"","sources":["surfacePositionController.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {ReactiveController, ReactiveControllerHost} from 'lit';\nimport {StyleInfo} from 'lit/directives/style-map.js';\n\n/\n An enum of supported Menu corners\n /\n// tslint:disable-next-line:enforce-name-casing We are mimicking enum style\nexport const Corner = {\n END_START: 'end-start',\n END_END: 'end-end',\n START_START: 'start-start',\n START_END: 'start-end',\n} as const;\n\n/\n A corner of a box in the standard logical property style of <block>_<inline>\n /\nexport type Corner = typeof Corner[keyof typeof Corner];\n\n/\n An interface that provides a method to customize the rect from which to\n * calculate the anchor positioning. Useful for when you want a surface to\n * anchor to an element in your shadow DOM rather than the host element.\n /\nexport interface SurfacePositionTarget extends HTMLElement {\n getSurfacePositionClientRect?: () => DOMRect;\n}\n\n/\n The configurable options for the surface position controller.\n /\nexport interface SurfacePositionControllerProperties {\n /\n The corner of the anchor to align the surface's position.\n /\n anchorCorner: Corner;\n /\n The corner of the surface to align to the given anchor corner.\n /\n surfaceCorner: Corner;\n /\n The HTMLElement reference of the surface to be positioned.\n /\n surfaceEl: SurfacePositionTarget\|null;\n /\n The HTMLElement reference of the anchor to align to.\n /\n anchorEl: SurfacePositionTarget\|null;\n /\n Whether the positioning algorithim should calculate relative to the parent\n * of the anchor element (absolute) or relative to the window (fixed).\n \n Examples for `position = 'fixed'`:\n \n - If there is no `position:relative` in the given parent tree and the\n * surface is `position:absolute`\n * - If the surface is `position:fixed`\n * - If the surface is in the \"top layer\"\n * - The anchor and the surface do not share a common `position:relative`\n * ancestor\n /\n positioning: 'absolute'\|'fixed';\n /\n Whether or not the surface should be \"open\" and visible\n /\n isOpen: boolean;\n /\n The number of pixels in which to offset from the inline axis relative to\n * logical property.\n \n Positive is right in LTR and left in RTL.\n /\n xOffset: number;\n /\n The number of pixes in which to offset the block axis.\n \n Positive is down and negative is up.\n /\n yOffset: number;\n /\n The strategy to follow when repositioning the menu to stay inside the\n * viewport. \"move\" will simply move the surface to stay in the viewport.\n * \"resize\" will attempt to resize the surface.\n \n Both strategies will still attempt to flip the anchor and surface corners.\n /\n repositionStrategy: 'move'\|'resize';\n /\n A function to call after the surface has been positioned.\n /\n onOpen: () => void;\n /\n A function to call before the surface should be closed. (A good time to\n * perform animations while the surface is still visible)\n /\n beforeClose: () => Promise<void>;\n /\n A function to call after the surface has been closed.\n /\n onClose: () => void;\n}\n\n/\n Given a surface, an anchor, corners, and some options, this surface will\n * calculate the position of a surface to align the two given corners and keep\n * the surface inside the window viewport. It also provides a StyleInfo map that\n * can be applied to the surface to handle visiblility and position.\n /\nexport class SurfacePositionController implements ReactiveController {\n // The current styles to apply to the surface.\n private surfaceStylesInternal: StyleInfo = {\n 'display': 'none',\n };\n // Previous values stored for change detection. Open change detection is\n // calculated separately so initialize it here.\n private lastValues: SurfacePositionControllerProperties = {isOpen: false} as\n SurfacePositionControllerProperties;\n\n /\n @param host The host to connect the controller to.\n * @param getProperties A function that returns the properties for the\n * controller.\n /\n constructor(\n private readonly host: ReactiveControllerHost,\n private readonly getProperties: () => SurfacePositionControllerProperties,\n ) {\n this.host.addController(this);\n }\n\n /\n The StyleInfo map to apply to the surface via Lit's stylemap\n /\n get surfaceStyles() {\n return this.surfaceStylesInternal;\n }\n\n /\n Calculates the surface's new position required so that the surface's\n * `surfaceCorner` aligns to the anchor's `anchorCorner` while keeping the\n * surface inside the window viewport. This positioning also respects RTL by\n * checking `getComputedStyle()` on the surface element.\n /\n async position() {\n const {\n surfaceEl,\n anchorEl,\n anchorCorner: anchorCornerRaw,\n surfaceCorner: surfaceCornerRaw,\n positioning,\n xOffset,\n yOffset,\n repositionStrategy,\n } = this.getProperties();\n const anchorCorner = anchorCornerRaw.toLowerCase().trim();\n const surfaceCorner = surfaceCornerRaw.toLowerCase().trim();\n\n if (!surfaceEl \|\| !anchorEl) {\n return;\n }\n\n // Store these before we potentially resize the window with the next set of\n // lines\n const windowInnerWidth = window.innerWidth;\n const windowInnerHeight = window.innerHeight;\n\n // Paint the surface transparently so that we can get the position and the\n // rect info of the surface.\n this.surfaceStylesInternal = {\n 'display': 'block',\n 'opacity': '0',\n };\n\n // Wait for it to be visible.\n this.host.requestUpdate();\n await this.host.updateComplete;\n\n const surfaceRect = surfaceEl.getSurfacePositionClientRect ?\n surfaceEl.getSurfacePositionClientRect() :\n surfaceEl.getBoundingClientRect();\n const anchorRect = anchorEl.getSurfacePositionClientRect ?\n anchorEl.getSurfacePositionClientRect() :\n anchorEl.getBoundingClientRect();\n const [surfaceBlock, surfaceInline] =\n surfaceCorner.split('-') as Array<'start'\|'end'>;\n const [anchorBlock, anchorInline] =\n anchorCorner.split('-') as Array<'start'\|'end'>;\n\n // LTR depends on the direction of the SURFACE not the anchor.\n const isLTR =\n getComputedStyle(surfaceEl as HTMLElement).direction === 'ltr';\n\n /\n * A diagram that helps describe some of the variables used in the following\n * calculations.\n \n ┌───── inline/blockTopLayerOffset\n * │ │\n * │ ┌─▼───┐ Window\n * │ ┌┼─────┴────────────────────────┐\n * │ ││ │\n * └──► ││ ┌──inline/blockAnchorOffset │\n * ││ │ │ │\n * └┤ │ ┌──▼───┐ │\n * │ │ ┌┼──────┤ │\n * │ └─►│Anchor│ │\n * │ └┴──────┘ │\n * │ │\n * │ ┌────────────────────────┼────┐\n * │ │ Surface │ │\n * │ │ │ │\n * │ │ │ │\n * │ │ │ │\n * │ │ │ │\n * │ │ │ │\n * └─────┼────────────────────────┘ ├┐\n * │ inline/blockOOBCorrection ││\n * │ │ ││\n * │ ├──►││\n * │ │ ││\n * └────────────────────────┐▼───┼┘\n * └────┘\n /\n\n // Calculate the block positioning properties\n let {blockInset, blockOutOfBoundsCorrection, surfaceBlockProperty} =\n this.calculateBlock({\n surfaceRect,\n anchorRect,\n anchorBlock,\n surfaceBlock,\n yOffset,\n positioning,\n windowInnerHeight,\n });\n\n // If the surface should be out of bounds in the block direction, flip the\n // surface and anchor corner block values and recalculate\n if (blockOutOfBoundsCorrection) {\n const flippedSurfaceBlock = surfaceBlock === 'start' ? 'end' : 'start';\n const flippedAnchorBlock = anchorBlock === 'start' ? 'end' : 'start';\n\n const flippedBlock = this.calculateBlock({\n surfaceRect,\n anchorRect,\n anchorBlock: flippedAnchorBlock,\n surfaceBlock: flippedSurfaceBlock,\n yOffset,\n positioning,\n windowInnerHeight,\n });\n\n // In the case that the flipped verion would require less out of bounds\n // correcting, use the flipped corner block values\n if (blockOutOfBoundsCorrection >\n flippedBlock.blockOutOfBoundsCorrection) {\n blockInset = flippedBlock.blockInset;\n blockOutOfBoundsCorrection = flippedBlock.blockOutOfBoundsCorrection;\n surfaceBlockProperty = flippedBlock.surfaceBlockProperty;\n }\n }\n\n // Calculate the inline positioning properties\n let {inlineInset, inlineOutOfBoundsCorrection, surfaceInlineProperty} =\n this.calculateInline({\n surfaceRect,\n anchorRect,\n anchorInline,\n surfaceInline,\n xOffset,\n positioning,\n isLTR,\n windowInnerWidth,\n });\n\n // If the surface should be out of bounds in the inline direction, flip the\n // surface and anchor corner inline values and recalculate\n if (inlineOutOfBoundsCorrection) {\n const flippedSurfaceInline = surfaceInline === 'start' ? 'end' : 'start';\n const flippedAnchorInline = anchorInline === 'start' ? 'end' : 'start';\n\n const flippedInline = this.calculateInline({\n surfaceRect,\n anchorRect,\n anchorInline: flippedAnchorInline,\n surfaceInline: flippedSurfaceInline,\n xOffset,\n positioning,\n isLTR,\n windowInnerWidth,\n });\n\n // In the case that the flipped verion would require less out of bounds\n // correcting, use the flipped corner inline values\n if (Math.abs(inlineOutOfBoundsCorrection) >\n Math.abs(flippedInline.inlineOutOfBoundsCorrection)) {\n inlineInset = flippedInline.inlineInset;\n inlineOutOfBoundsCorrection = flippedInline.inlineOutOfBoundsCorrection;\n surfaceInlineProperty = flippedInline.surfaceInlineProperty;\n }\n }\n\n // If we are simply repositioning the surface back inside the viewport,\n // subtract the out of bounds correction values from the positioning.\n if (repositionStrategy === 'move') {\n blockInset = blockInset - blockOutOfBoundsCorrection;\n inlineInset = inlineInset - inlineOutOfBoundsCorrection;\n }\n\n this.surfaceStylesInternal = {\n 'display': 'block',\n 'opacity': '1',\n [surfaceBlockProperty]: `${blockInset}px`,\n [surfaceInlineProperty]: `${inlineInset}px`,\n };\n\n // In the case that we are resizing the surface to stay inside the viewport\n // we need to set height and width on the surface.\n if (repositionStrategy === 'resize') {\n // Add a height property to the styles if there is block height correction\n if (blockOutOfBoundsCorrection) {\n this.surfaceStylesInternal['height'] =\n `${surfaceRect.height - blockOutOfBoundsCorrection}px`;\n }\n\n // Add a width property to the styles if there is block height correction\n if (inlineOutOfBoundsCorrection) {\n this.surfaceStylesInternal['width'] =\n `${surfaceRect.width - inlineOutOfBoundsCorrection}px`;\n }\n }\n\n this.host.requestUpdate();\n }\n\n /\n Calculates the css property, the inset, and the out of bounds correction\n * for the surface in the block direction.\n /\n private calculateBlock(config: {\n surfaceRect: DOMRect,\n anchorRect: DOMRect,\n anchorBlock: 'start'\|'end',\n surfaceBlock: 'start'\|'end',\n yOffset: number,\n positioning: 'absolute'\|'fixed',\n windowInnerHeight: number,\n }) {\n const {\n surfaceRect,\n anchorRect,\n anchorBlock,\n surfaceBlock,\n yOffset,\n positioning,\n windowInnerHeight,\n } = config;\n // We use number booleans to multiply values rather than `if` / ternary\n // statements because it _heavily_ cuts down on nesting and readability\n const relativeToWindow = positioning === 'fixed' ? 1 : 0;\n const isSurfaceBlockStart = surfaceBlock === 'start' ? 1 : 0;\n const isSurfaceBlockEnd = surfaceBlock === 'end' ? 1 : 0;\n const isOneBlockEnd = anchorBlock !== surfaceBlock ? 1 : 0;\n\n // Whether or not to apply the height of the anchor\n const blockAnchorOffset = isOneBlockEnd anchorRect.height + yOffset;\n // The absolute block position of the anchor relative to window\n const blockTopLayerOffset = isSurfaceBlockStart * anchorRect.top +\n isSurfaceBlockEnd * (windowInnerHeight - anchorRect.bottom);\n // If the surface's block would be out of bounds of the window, move it back\n // in\n const blockOutOfBoundsCorrection = Math.abs(Math.min(\n 0,\n windowInnerHeight - blockTopLayerOffset - blockAnchorOffset -\n surfaceRect.height));\n\n\n // The block logical value of the surface\n const blockInset =\n relativeToWindow * blockTopLayerOffset + blockAnchorOffset;\n\n const surfaceBlockProperty =\n surfaceBlock === 'start' ? 'inset-block-start' : 'inset-block-end';\n\n return {blockInset, blockOutOfBoundsCorrection, surfaceBlockProperty};\n }\n\n /*\n Calculates the css property, the inset, and the out of bounds correction\n * for the surface in the inline direction.\n /\n private calculateInline(config: {\n isLTR: boolean,\n surfaceInline: 'start'\|'end',\n anchorInline: 'start'\|'end',\n anchorRect: DOMRect,\n surfaceRect: DOMRect,\n xOffset: number,\n positioning: 'absolute'\|'fixed',\n windowInnerWidth: number,\n }) {\n const {\n isLTR: isLTRBool,\n surfaceInline,\n anchorInline,\n anchorRect,\n surfaceRect,\n xOffset,\n positioning,\n windowInnerWidth,\n } = config;\n // We use number booleans to multiply values rather than `if` / ternary\n // statements because it _heavily_ cuts down on nesting and readability\n const relativeToWindow = positioning === 'fixed' ? 1 : 0;\n const isLTR = isLTRBool ? 1 : 0;\n const isRTL = isLTRBool ? 0 : 1;\n const isSurfaceInlineStart = surfaceInline === 'start' ? 1 : 0;\n const isSurfaceInlineEnd = surfaceInline === 'end' ? 1 : 0;\n const isOneInlineEnd = anchorInline !== surfaceInline ? 1 : 0;\n\n // Whether or not to apply the width of the anchor\n const inlineAnchorOffset = isOneInlineEnd anchorRect.width + xOffset;\n // The inline position of the anchor relative to window in LTR\n const inlineTopLayerOffsetLTR = isSurfaceInlineStart * anchorRect.left +\n isSurfaceInlineEnd * (windowInnerWidth - anchorRect.right);\n // The inline position of the anchor relative to window in RTL\n const inlineTopLayerOffsetRTL =\n isSurfaceInlineStart * (windowInnerWidth - anchorRect.right) +\n isSurfaceInlineEnd * anchorRect.left;\n // The inline position of the anchor relative to window\n const inlineTopLayerOffset =\n isLTR * inlineTopLayerOffsetLTR + isRTL * inlineTopLayerOffsetRTL;\n\n // If the surface's inline would be out of bounds of the window, move it\n // back in\n const inlineOutOfBoundsCorrection = Math.abs(Math.min(\n 0,\n windowInnerWidth - inlineTopLayerOffset - inlineAnchorOffset -\n surfaceRect.width));\n\n\n // The inline logical value of the surface\n const inlineInset =\n relativeToWindow * inlineTopLayerOffset + inlineAnchorOffset;\n\n const surfaceInlineProperty =\n surfaceInline === 'start' ? 'inset-inline-start' : 'inset-inline-end';\n\n return {\n inlineInset,\n inlineOutOfBoundsCorrection,\n surfaceInlineProperty,\n };\n }\n\n hostUpdate() {\n this.onUpdate();\n }\n\n hostUpdated() {\n this.onUpdate();\n }\n\n /*\n Checks whether the properties passed into the controller have changed since\n * the last positioning. If so, it will reposition if the surface is open or\n * close it if the surface should close.\n /\n private async onUpdate() {\n const props = this.getProperties();\n let hasChanged = false;\n for (const [key, value] of Object.entries(props)) {\n // tslint:disable-next-line\n hasChanged = hasChanged \|\| (value !== (this.lastValues as any)[key]);\n if (hasChanged) break;\n }\n\n const openChanged = this.lastValues.isOpen !== props.isOpen;\n const hasAnchor = !!props.anchorEl;\n const hasSurface = !!props.surfaceEl;\n\n if (hasChanged && hasAnchor && hasSurface) {\n // Only update isOpen, because if it's closed, we do not want to waste\n // time on a useless reposition calculation. So save the other \"dirty\"\n // values until next time it opens.\n this.lastValues.isOpen = props.isOpen;\n\n if (props.isOpen) {\n // We are going to do a reposition, so save the prop values for future\n // dirty checking.\n this.lastValues = props;\n\n await this.position();\n props.onOpen();\n } else if (openChanged) {\n await props.beforeClose();\n this.close();\n props.onClose();\n }\n }\n }\n\n /\n Hides the surface.\n */\n private close() {\n this.surfaceStylesInternal = {\n 'display': 'none',\n };\n this.host.requestUpdate();\n }\n}\n"]}
1	+ {"version":3,"file":"surfacePositionController.js","sourceRoot":"","sources":["surfacePositionController.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {ReactiveController, ReactiveControllerHost} from 'lit';\nimport {StyleInfo} from 'lit/directives/style-map.js';\n\n/\n Declare popoverAPI functions and properties. See\n * https://developer.mozilla.org/en-US/docs/Web/API/Popover_API\n * Without this, closure will rename these functions. Can remove once these\n * functions make it into the typescript lib.\n /\ndeclare global {\n interface HTMLElement {\n showPopover(): void;\n hidePopover(): void;\n togglePopover(force: boolean): void;\n popover: string \| null;\n }\n}\n\n/\n An enum of supported Menu corners\n /\n// tslint:disable-next-line:enforce-name-casing We are mimicking enum style\nexport const Corner = {\n END_START: 'end-start',\n END_END: 'end-end',\n START_START: 'start-start',\n START_END: 'start-end',\n} as const;\n\n/\n A corner of a box in the standard logical property style of <block>_<inline>\n /\nexport type Corner = (typeof Corner)[keyof typeof Corner];\n\n/\n An interface that provides a method to customize the rect from which to\n * calculate the anchor positioning. Useful for when you want a surface to\n * anchor to an element in your shadow DOM rather than the host element.\n /\nexport interface SurfacePositionTarget extends HTMLElement {\n getSurfacePositionClientRect?: () => DOMRect;\n}\n\n/\n The configurable options for the surface position controller.\n /\nexport interface SurfacePositionControllerProperties {\n /\n The corner of the anchor to align the surface's position.\n /\n anchorCorner: Corner;\n /\n The corner of the surface to align to the given anchor corner.\n /\n surfaceCorner: Corner;\n /\n The HTMLElement reference of the surface to be positioned.\n /\n surfaceEl: SurfacePositionTarget \| null;\n /\n The HTMLElement reference of the anchor to align to.\n /\n anchorEl: SurfacePositionTarget \| null;\n /\n Whether the positioning algorithim should calculate relative to the parent\n * of the anchor element (absolute) or relative to the window (fixed).\n \n Examples for `position = 'fixed'`:\n \n - If there is no `position:relative` in the given parent tree and the\n * surface is `position:absolute`\n * - If the surface is `position:fixed`\n * - If the surface is in the \"top layer\"\n * - The anchor and the surface do not share a common `position:relative`\n * ancestor\n /\n positioning: 'absolute' \| 'fixed' \| 'document';\n /\n Whether or not the surface should be \"open\" and visible\n /\n isOpen: boolean;\n /\n The number of pixels in which to offset from the inline axis relative to\n * logical property.\n \n Positive is right in LTR and left in RTL.\n /\n xOffset: number;\n /\n The number of pixes in which to offset the block axis.\n \n Positive is down and negative is up.\n /\n yOffset: number;\n /\n The strategy to follow when repositioning the menu to stay inside the\n * viewport. \"move\" will simply move the surface to stay in the viewport.\n * \"resize\" will attempt to resize the surface.\n \n Both strategies will still attempt to flip the anchor and surface corners.\n /\n repositionStrategy: 'move' \| 'resize';\n /\n A function to call after the surface has been positioned.\n /\n onOpen: () => void;\n /\n A function to call before the surface should be closed. (A good time to\n * perform animations while the surface is still visible)\n /\n beforeClose: () => Promise<void>;\n /\n A function to call after the surface has been closed.\n /\n onClose: () => void;\n}\n\n/\n Given a surface, an anchor, corners, and some options, this surface will\n * calculate the position of a surface to align the two given corners and keep\n * the surface inside the window viewport. It also provides a StyleInfo map that\n * can be applied to the surface to handle visiblility and position.\n /\nexport class SurfacePositionController implements ReactiveController {\n // The current styles to apply to the surface.\n private surfaceStylesInternal: StyleInfo = {\n 'display': 'none',\n };\n // Previous values stored for change detection. Open change detection is\n // calculated separately so initialize it here.\n private lastValues: SurfacePositionControllerProperties = {\n isOpen: false,\n } as SurfacePositionControllerProperties;\n\n /\n @param host The host to connect the controller to.\n * @param getProperties A function that returns the properties for the\n * controller.\n /\n constructor(\n private readonly host: ReactiveControllerHost,\n private readonly getProperties: () => SurfacePositionControllerProperties,\n ) {\n this.host.addController(this);\n }\n\n /\n The StyleInfo map to apply to the surface via Lit's stylemap\n /\n get surfaceStyles() {\n return this.surfaceStylesInternal;\n }\n\n /\n Calculates the surface's new position required so that the surface's\n * `surfaceCorner` aligns to the anchor's `anchorCorner` while keeping the\n * surface inside the window viewport. This positioning also respects RTL by\n * checking `getComputedStyle()` on the surface element.\n /\n async position() {\n const {\n surfaceEl,\n anchorEl,\n anchorCorner: anchorCornerRaw,\n surfaceCorner: surfaceCornerRaw,\n positioning,\n xOffset,\n yOffset,\n repositionStrategy,\n } = this.getProperties();\n const anchorCorner = anchorCornerRaw.toLowerCase().trim();\n const surfaceCorner = surfaceCornerRaw.toLowerCase().trim();\n\n if (!surfaceEl \|\| !anchorEl) {\n return;\n }\n\n // Store these before we potentially resize the window with the next set of\n // lines\n const windowInnerWidth = window.innerWidth;\n const windowInnerHeight = window.innerHeight;\n\n const div = document.createElement('div');\n div.style.opacity = '0';\n div.style.position = 'fixed';\n div.style.display = 'block';\n div.style.inset = '0';\n document.body.appendChild(div);\n const scrollbarTestRect = div.getBoundingClientRect();\n div.remove();\n\n // Calculate the widths of the scrollbars in the inline and block directions\n // to account for window-relative calculations.\n const blockScrollbarHeight = window.innerHeight - scrollbarTestRect.bottom;\n const inlineScrollbarWidth = window.innerWidth - scrollbarTestRect.right;\n\n // Paint the surface transparently so that we can get the position and the\n // rect info of the surface.\n this.surfaceStylesInternal = {\n 'display': 'block',\n 'opacity': '0',\n };\n\n // Wait for it to be visible.\n this.host.requestUpdate();\n await this.host.updateComplete;\n\n // Safari has a bug that makes popovers render incorrectly if the node is\n // made visible + Animation Frame before calling showPopover().\n // https://bugs.webkit.org/show_bug.cgi?id=264069\n // also the cast is required due to differing TS types in Google and OSS.\n if (\n (surfaceEl as unknown as {popover: string}).popover &&\n surfaceEl.isConnected\n ) {\n (surfaceEl as unknown as {showPopover: () => void}).showPopover();\n }\n\n const surfaceRect = surfaceEl.getSurfacePositionClientRect\n ? surfaceEl.getSurfacePositionClientRect()\n : surfaceEl.getBoundingClientRect();\n const anchorRect = anchorEl.getSurfacePositionClientRect\n ? anchorEl.getSurfacePositionClientRect()\n : anchorEl.getBoundingClientRect();\n const [surfaceBlock, surfaceInline] = surfaceCorner.split('-') as Array<\n 'start' \| 'end'\n >;\n const [anchorBlock, anchorInline] = anchorCorner.split('-') as Array<\n 'start' \| 'end'\n >;\n\n // LTR depends on the direction of the SURFACE not the anchor.\n const isLTR =\n getComputedStyle(surfaceEl as HTMLElement).direction === 'ltr';\n\n /\n * For more on inline and block dimensions, see MDN article:\n * https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_logical_properties_and_values\n \n ┌───── inline/blockDocumentOffset inlineScrollbarWidth\n * │ │ │\n * │ ┌─▼─────┐ │Document\n * │ ┌┼───────┴──────────────────────────────┼────────┐\n * │ ││ │ │\n * └──► ││ ┌───── inline/blockWindowOffset │ │\n * ││ │ │ ▼ │\n * ││ │ ┌─▼───┐ Window┌┐ │\n * └┤ │ ┌┼─────┴───────────────────────┼│ │\n * │ │ ││ ││ │\n * │ └──► ││ ┌──inline/blockAnchorOffset││ │\n * │ ││ │ │ ││ │\n * │ └┤ │ ┌──▼───┐ ││ │\n * │ │ │ ┌┼──────┤ ││ │\n * │ │ └─►│Anchor│ ││ │\n * │ │ └┴──────┘ ││ │\n * │ │ ││ │\n * │ │ ┌───────────────────────┼┼────┐ │\n * │ │ │ Surface ││ │ │\n * │ │ │ ││ │ │\n * │ │ │ ││ │ │\n * │ │ │ ││ │ │\n * │ │ │ ││ │ │\n * │ ┌┼─────┼───────────────────────┼│ │ │\n * │ ┌─►┴──────┼────────────────────────┘ ├┐ │\n * │ │ │ inline/blockOOBCorrection ││ │\n * │ │ │ │ ││ │\n * │ │ │ ├──►├│ │\n * │ │ │ │ ││ │\n * │ │ └────────────────────────┐▼───┼┘ │\n * │ blockScrollbarHeight └────┘ │\n * │ │\n * └───────────────────────────────────────────────┘\n /\n\n // Calculate the block positioning properties\n let {blockInset, blockOutOfBoundsCorrection, surfaceBlockProperty} =\n this.calculateBlock({\n surfaceRect,\n anchorRect,\n anchorBlock,\n surfaceBlock,\n yOffset,\n positioning,\n windowInnerHeight,\n blockScrollbarHeight,\n });\n\n // If the surface should be out of bounds in the block direction, flip the\n // surface and anchor corner block values and recalculate\n if (blockOutOfBoundsCorrection) {\n const flippedSurfaceBlock = surfaceBlock === 'start' ? 'end' : 'start';\n const flippedAnchorBlock = anchorBlock === 'start' ? 'end' : 'start';\n\n const flippedBlock = this.calculateBlock({\n surfaceRect,\n anchorRect,\n anchorBlock: flippedAnchorBlock,\n surfaceBlock: flippedSurfaceBlock,\n yOffset,\n positioning,\n windowInnerHeight,\n blockScrollbarHeight,\n });\n\n // In the case that the flipped verion would require less out of bounds\n // correcting, use the flipped corner block values\n if (\n blockOutOfBoundsCorrection > flippedBlock.blockOutOfBoundsCorrection\n ) {\n blockInset = flippedBlock.blockInset;\n blockOutOfBoundsCorrection = flippedBlock.blockOutOfBoundsCorrection;\n surfaceBlockProperty = flippedBlock.surfaceBlockProperty;\n }\n }\n\n // Calculate the inline positioning properties\n let {inlineInset, inlineOutOfBoundsCorrection, surfaceInlineProperty} =\n this.calculateInline({\n surfaceRect,\n anchorRect,\n anchorInline,\n surfaceInline,\n xOffset,\n positioning,\n isLTR,\n windowInnerWidth,\n inlineScrollbarWidth,\n });\n\n // If the surface should be out of bounds in the inline direction, flip the\n // surface and anchor corner inline values and recalculate\n if (inlineOutOfBoundsCorrection) {\n const flippedSurfaceInline = surfaceInline === 'start' ? 'end' : 'start';\n const flippedAnchorInline = anchorInline === 'start' ? 'end' : 'start';\n\n const flippedInline = this.calculateInline({\n surfaceRect,\n anchorRect,\n anchorInline: flippedAnchorInline,\n surfaceInline: flippedSurfaceInline,\n xOffset,\n positioning,\n isLTR,\n windowInnerWidth,\n inlineScrollbarWidth,\n });\n\n // In the case that the flipped verion would require less out of bounds\n // correcting, use the flipped corner inline values\n if (\n Math.abs(inlineOutOfBoundsCorrection) >\n Math.abs(flippedInline.inlineOutOfBoundsCorrection)\n ) {\n inlineInset = flippedInline.inlineInset;\n inlineOutOfBoundsCorrection = flippedInline.inlineOutOfBoundsCorrection;\n surfaceInlineProperty = flippedInline.surfaceInlineProperty;\n }\n }\n\n // If we are simply repositioning the surface back inside the viewport,\n // subtract the out of bounds correction values from the positioning.\n if (repositionStrategy === 'move') {\n blockInset = blockInset - blockOutOfBoundsCorrection;\n inlineInset = inlineInset - inlineOutOfBoundsCorrection;\n }\n\n this.surfaceStylesInternal = {\n 'display': 'block',\n 'opacity': '1',\n [surfaceBlockProperty]: `${blockInset}px`,\n [surfaceInlineProperty]: `${inlineInset}px`,\n };\n\n // In the case that we are resizing the surface to stay inside the viewport\n // we need to set height and width on the surface.\n if (repositionStrategy === 'resize') {\n // Add a height property to the styles if there is block height correction\n if (blockOutOfBoundsCorrection) {\n this.surfaceStylesInternal['height'] = `${\n surfaceRect.height - blockOutOfBoundsCorrection\n }px`;\n }\n\n // Add a width property to the styles if there is block height correction\n if (inlineOutOfBoundsCorrection) {\n this.surfaceStylesInternal['width'] = `${\n surfaceRect.width - inlineOutOfBoundsCorrection\n }px`;\n }\n }\n\n this.host.requestUpdate();\n }\n\n /\n Calculates the css property, the inset, and the out of bounds correction\n * for the surface in the block direction.\n /\n private calculateBlock(config: {\n surfaceRect: DOMRect;\n anchorRect: DOMRect;\n anchorBlock: 'start' \| 'end';\n surfaceBlock: 'start' \| 'end';\n yOffset: number;\n positioning: 'absolute' \| 'fixed' \| 'document';\n windowInnerHeight: number;\n blockScrollbarHeight: number;\n }) {\n const {\n surfaceRect,\n anchorRect,\n anchorBlock,\n surfaceBlock,\n yOffset,\n positioning,\n windowInnerHeight,\n blockScrollbarHeight,\n } = config;\n // We use number booleans to multiply values rather than `if` / ternary\n // statements because it _heavily_ cuts down on nesting and readability\n const relativeToWindow =\n positioning === 'fixed' \|\| positioning === 'document' ? 1 : 0;\n const relativeToDocument = positioning === 'document' ? 1 : 0;\n const isSurfaceBlockStart = surfaceBlock === 'start' ? 1 : 0;\n const isSurfaceBlockEnd = surfaceBlock === 'end' ? 1 : 0;\n const isOneBlockEnd = anchorBlock !== surfaceBlock ? 1 : 0;\n\n // Whether or not to apply the height of the anchor\n const blockAnchorOffset = isOneBlockEnd anchorRect.height + yOffset;\n // The absolute block position of the anchor relative to window\n const blockTopLayerOffset =\n isSurfaceBlockStart * anchorRect.top +\n isSurfaceBlockEnd \n (windowInnerHeight - anchorRect.bottom - blockScrollbarHeight);\n const blockDocumentOffset =\n isSurfaceBlockStart window.scrollY - isSurfaceBlockEnd * window.scrollY;\n\n // If the surface's block would be out of bounds of the window, move it back\n // in\n const blockOutOfBoundsCorrection = Math.abs(\n Math.min(\n 0,\n windowInnerHeight -\n blockTopLayerOffset -\n blockAnchorOffset -\n surfaceRect.height,\n ),\n );\n\n // The block logical value of the surface\n const blockInset =\n relativeToWindow * blockTopLayerOffset +\n relativeToDocument * blockDocumentOffset +\n blockAnchorOffset;\n\n const surfaceBlockProperty =\n surfaceBlock === 'start' ? 'inset-block-start' : 'inset-block-end';\n\n return {blockInset, blockOutOfBoundsCorrection, surfaceBlockProperty};\n }\n\n /*\n Calculates the css property, the inset, and the out of bounds correction\n * for the surface in the inline direction.\n /\n private calculateInline(config: {\n isLTR: boolean;\n surfaceInline: 'start' \| 'end';\n anchorInline: 'start' \| 'end';\n anchorRect: DOMRect;\n surfaceRect: DOMRect;\n xOffset: number;\n positioning: 'absolute' \| 'fixed' \| 'document';\n windowInnerWidth: number;\n inlineScrollbarWidth: number;\n }) {\n const {\n isLTR: isLTRBool,\n surfaceInline,\n anchorInline,\n anchorRect,\n surfaceRect,\n xOffset,\n positioning,\n windowInnerWidth,\n inlineScrollbarWidth,\n } = config;\n // We use number booleans to multiply values rather than `if` / ternary\n // statements because it _heavily_ cuts down on nesting and readability\n const relativeToWindow =\n positioning === 'fixed' \|\| positioning === 'document' ? 1 : 0;\n const relativeToDocument = positioning === 'document' ? 1 : 0;\n const isLTR = isLTRBool ? 1 : 0;\n const isRTL = isLTRBool ? 0 : 1;\n const isSurfaceInlineStart = surfaceInline === 'start' ? 1 : 0;\n const isSurfaceInlineEnd = surfaceInline === 'end' ? 1 : 0;\n const isOneInlineEnd = anchorInline !== surfaceInline ? 1 : 0;\n\n // Whether or not to apply the width of the anchor\n const inlineAnchorOffset = isOneInlineEnd anchorRect.width + xOffset;\n // The inline position of the anchor relative to window in LTR\n const inlineTopLayerOffsetLTR =\n isSurfaceInlineStart * anchorRect.left +\n isSurfaceInlineEnd \n (windowInnerWidth - anchorRect.right - inlineScrollbarWidth);\n // The inline position of the anchor relative to window in RTL\n const inlineTopLayerOffsetRTL =\n isSurfaceInlineStart \n (windowInnerWidth - anchorRect.right - inlineScrollbarWidth) +\n isSurfaceInlineEnd * anchorRect.left;\n // The inline position of the anchor relative to window\n const inlineTopLayerOffset =\n isLTR * inlineTopLayerOffsetLTR + isRTL * inlineTopLayerOffsetRTL;\n\n // The inline position of the anchor relative to window in LTR\n const inlineDocumentOffsetLTR =\n isSurfaceInlineStart * window.scrollX -\n isSurfaceInlineEnd * window.scrollX;\n // The inline position of the anchor relative to window in RTL\n const inlineDocumentOffsetRTL =\n isSurfaceInlineEnd * window.scrollX -\n isSurfaceInlineStart * window.scrollX;\n // The inline position of the anchor relative to window\n const inlineDocumentOffset =\n isLTR * inlineDocumentOffsetLTR + isRTL * inlineDocumentOffsetRTL;\n\n // If the surface's inline would be out of bounds of the window, move it\n // back in\n const inlineOutOfBoundsCorrection = Math.abs(\n Math.min(\n 0,\n windowInnerWidth -\n inlineTopLayerOffset -\n inlineAnchorOffset -\n surfaceRect.width,\n ),\n );\n\n // The inline logical value of the surface\n const inlineInset =\n relativeToWindow * inlineTopLayerOffset +\n inlineAnchorOffset +\n relativeToDocument * inlineDocumentOffset;\n\n let surfaceInlineProperty =\n surfaceInline === 'start' ? 'inset-inline-start' : 'inset-inline-end';\n\n // There are cases where the element is RTL but the root of the page is not.\n // In these cases we want to not use logical properties.\n if (positioning === 'document' \|\| positioning === 'fixed') {\n if (\n (surfaceInline === 'start' && isLTRBool) \|\|\n (surfaceInline === 'end' && !isLTRBool)\n ) {\n surfaceInlineProperty = 'left';\n } else {\n surfaceInlineProperty = 'right';\n }\n }\n\n return {\n inlineInset,\n inlineOutOfBoundsCorrection,\n surfaceInlineProperty,\n };\n }\n\n hostUpdate() {\n this.onUpdate();\n }\n\n hostUpdated() {\n this.onUpdate();\n }\n\n /*\n Checks whether the properties passed into the controller have changed since\n * the last positioning. If so, it will reposition if the surface is open or\n * close it if the surface should close.\n /\n private async onUpdate() {\n const props = this.getProperties();\n let hasChanged = false;\n for (const [key, value] of Object.entries(props)) {\n // tslint:disable-next-line\n hasChanged = hasChanged \|\| value !== (this.lastValues as any)[key];\n if (hasChanged) break;\n }\n\n const openChanged = this.lastValues.isOpen !== props.isOpen;\n const hasAnchor = !!props.anchorEl;\n const hasSurface = !!props.surfaceEl;\n\n if (hasChanged && hasAnchor && hasSurface) {\n // Only update isOpen, because if it's closed, we do not want to waste\n // time on a useless reposition calculation. So save the other \"dirty\"\n // values until next time it opens.\n this.lastValues.isOpen = props.isOpen;\n\n if (props.isOpen) {\n // We are going to do a reposition, so save the prop values for future\n // dirty checking.\n this.lastValues = props;\n\n await this.position();\n props.onOpen();\n } else if (openChanged) {\n await props.beforeClose();\n this.close();\n props.onClose();\n }\n }\n }\n\n /\n Hides the surface.\n */\n private close() {\n this.surfaceStylesInternal = {\n 'display': 'none',\n };\n this.host.requestUpdate();\n const surfaceEl = this.getProperties().surfaceEl;\n\n // The following type casts are required due to differing TS types in Google\n // and open source.\n if (\n (surfaceEl as unknown as {popover?: string})?.popover &&\n surfaceEl?.isConnected\n ) {\n (surfaceEl as unknown as {hidePopover: () => void}).hidePopover();\n }\n }\n}\n"]}

package/menu/internal/controllers/typeaheadController.js CHANGED Viewed

@@ -112,17 +112,22 @@ export class TypeaheadController {
         // We don't want to typeahead if the _beginning_ of the typeahead is a menu
         // navigation, or a selection. We will handle "Space" only if it's in the
         // middle of a typeahead
-        if (event.code === 'Space' || event.code === 'Enter' ||
-            event.code.startsWith('Arrow') || event.code === 'Escape') {
+        if (event.code === 'Space' ||
+            event.code === 'Enter' ||
+            event.code.startsWith('Arrow') ||
+            event.code === 'Escape') {
             return;
         }
         this.isTypingAhead = true;
         // Generates the record array data structure which is the index, the element
         // and a normalized header.
-        this.typeaheadRecords = this.items.map((el, index) => [index, el, el.typeaheadText.trim().toLowerCase()]);
+        this.typeaheadRecords = this.items.map((el, index) => [
+            index,
+            el,
+            el.typeaheadText.trim().toLowerCase(),
+        ]);
         this.lastActiveRecord =
-            this.typeaheadRecords.find(record => (record[TYPEAHEAD_RECORD.ITEM].tabIndex === 0)) ??
-                null;
+            this.typeaheadRecords.find((record) => record[TYPEAHEAD_RECORD.ITEM].tabIndex === 0) ?? null;
         if (this.lastActiveRecord) {
             this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;
         }
@@ -170,7 +175,8 @@ export class TypeaheadController {
         clearTimeout(this.cancelTypeaheadTimeout);
         // Stop typingahead if one of the navigation or selection keys (except for
         // Space) are pressed
-        if (event.code === 'Enter' || event.code.startsWith('Arrow') ||
+        if (event.code === 'Enter' ||
+            event.code.startsWith('Arrow') ||
             event.code === 'Escape') {
             this.endTypeahead();
             if (this.lastActiveRecord) {
@@ -183,12 +189,11 @@ export class TypeaheadController {
             event.preventDefault();
         }
         // Start up a new keystroke buffer timeout
-        this.cancelTypeaheadTimeout =
-            setTimeout(this.endTypeahead, this.getProperties().typeaheadBufferTime);
+        this.cancelTypeaheadTimeout = setTimeout(this.endTypeahead, this.getProperties().typeaheadBufferTime);
         this.typaheadBuffer += event.key.toLowerCase();
-        const lastActiveIndex = this.lastActiveRecord ?
-            this.lastActiveRecord[TYPEAHEAD_RECORD.INDEX] :
-            -1;
+        const lastActiveIndex = this.lastActiveRecord
+            ? this.lastActiveRecord[TYPEAHEAD_RECORD.INDEX]
+            : -1;
         const numRecords = this.typeaheadRecords.length;
         /**
          * Sorting function that will resort the items starting with the given index
@@ -213,12 +218,12 @@ export class TypeaheadController {
          * 5: [2, <reference>, 'banana']
          */
         const rebaseIndexOnActive = (record) => {
-            return (record[TYPEAHEAD_RECORD.INDEX] + numRecords - lastActiveIndex) %
-                numRecords;
+            return ((record[TYPEAHEAD_RECORD.INDEX] + numRecords - lastActiveIndex) %
+                numRecords);
         };
         // records filtered and sorted / rebased around the last active index
         const matchingRecords = this.typeaheadRecords
-            .filter(record => !record[TYPEAHEAD_RECORD.ITEM].disabled &&
+            .filter((record) => !record[TYPEAHEAD_RECORD.ITEM].disabled &&
             record[TYPEAHEAD_RECORD.TEXT].startsWith(this.typaheadBuffer))
             .sort((a, b) => rebaseIndexOnActive(a) - rebaseIndexOnActive(b));
         // Just leave if there's nothing that matches. Native select will just

package/menu/internal/controllers/typeaheadController.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"typeaheadController.js","sourceRoot":"","sources":["typeaheadController.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {MenuItem} from './menuItemController.js';\n\n/\n The options that are passed to the typeahead controller.\n /\nexport interface TypeaheadControllerProperties {\n /\n A function that returns an array of menu items to be searched.\n * @return An array of menu items to be searched by typing.\n /\n getItems: () => MenuItem[];\n /\n The maximum time between each keystroke to keep the current type buffer\n * alive.\n /\n typeaheadBufferTime: number;\n /\n Whether or not the typeahead should listen for keystrokes or not.\n /\n active: boolean;\n}\n\n/\n Data structure tuple that helps with indexing.\n \n [index, item, normalized header text]\n /\ntype TypeaheadRecord = [number, MenuItem, string];\n/\n Indicies to access the TypeaheadRecord tuple type.\n /\nexport const TYPEAHEAD_RECORD = {\n INDEX: 0,\n ITEM: 1,\n TEXT: 2,\n} as const;\n\n/\n This controller listens to `keydown` events and searches the header text of\n * an array of `MenuItem`s with the corresponding entered keys within the buffer\n * time and activates the item.\n \n @example\n * ```ts\n * const typeaheadController = new TypeaheadController(() => ({\n * typeaheadBufferTime: 50,\n * getItems: () => Array.from(document.querySelectorAll('md-menu-item'))\n * }));\n * html`\n * <div\n * @keydown=${typeaheadController.onKeydown}\n * tabindex=\"0\"\n * class=\"activeItemText\">\n * <!-- focusable element that will receive keydown events -->\n * Apple\n * </div>\n * <div>\n * <md-menu-item active header=\"Apple\"></md-menu-item>\n * <md-menu-item header=\"Apricot\"></md-menu-item>\n * <md-menu-item header=\"Banana\"></md-menu-item>\n * <md-menu-item header=\"Olive\"></md-menu-item>\n * <md-menu-item header=\"Orange\"></md-menu-item>\n * </div>\n * `;\n * ```\n /\nexport class TypeaheadController {\n /\n Array of tuples that helps with indexing.\n /\n private typeaheadRecords: TypeaheadRecord[] = [];\n /\n Currently-typed text since last buffer timeout\n /\n private typaheadBuffer = '';\n /\n The timeout id from the current buffer's setTimeout\n /\n private cancelTypeaheadTimeout = 0;\n /\n If we are currently \"typing\"\n /\n isTypingAhead = false;\n /\n The record of the last active item.\n /\n lastActiveRecord: TypeaheadRecord\|null = null;\n\n /\n @param getProperties A function that returns the options of the typeahead\n * controller:\n \n {\n * getItems: A function that returns an array of menu items to be searched.\n * typeaheadBufferTime: The maximum time between each keystroke to keep the\n * current type buffer alive.\n * }\n /\n constructor(\n private readonly getProperties: () => TypeaheadControllerProperties,\n ) {}\n\n private get items() {\n return this.getProperties().getItems();\n }\n\n private get active() {\n return this.getProperties().active;\n }\n\n /\n Apply this listener to the element that will receive `keydown` events that\n * should trigger this controller.\n \n @param event The native browser `KeyboardEvent` from the `keydown` event.\n /\n readonly onKeydown = (event: KeyboardEvent) => {\n if (this.isTypingAhead) {\n this.typeahead(event);\n } else {\n this.beginTypeahead(event);\n }\n };\n\n /\n Sets up typingahead\n /\n private beginTypeahead(event: KeyboardEvent) {\n if (!this.active) {\n return;\n }\n\n // We don't want to typeahead if the _beginning_ of the typeahead is a menu\n // navigation, or a selection. We will handle \"Space\" only if it's in the\n // middle of a typeahead\n if (event.code === 'Space' \|\| event.code === 'Enter' \|\|\n event.code.startsWith('Arrow') \|\| event.code === 'Escape') {\n return;\n }\n\n this.isTypingAhead = true;\n // Generates the record array data structure which is the index, the element\n // and a normalized header.\n this.typeaheadRecords = this.items.map(\n (el, index) => [index, el, el.typeaheadText.trim().toLowerCase()]);\n this.lastActiveRecord =\n this.typeaheadRecords.find(\n record => (record[TYPEAHEAD_RECORD.ITEM].tabIndex === 0)) ??\n null;\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n this.typeahead(event);\n }\n\n /\n Performs the typeahead. Based on the normalized items and the current text\n * buffer, finds the _next_ item with matching text and activates it.\n \n @example\n \n items: Apple, Banana, Olive, Orange, Cucumber\n * buffer: ''\n * user types: o\n \n activates Olive\n \n @example\n \n items: Apple, Banana, Olive (active), Orange, Cucumber\n * buffer: 'o'\n * user types: l\n \n activates Olive\n \n @example\n \n items: Apple, Banana, Olive (active), Orange, Cucumber\n * buffer: ''\n * user types: o\n \n activates Orange\n \n @example\n \n items: Apple, Banana, Olive, Orange (active), Cucumber\n * buffer: ''\n * user types: o\n \n activates Olive\n /\n private typeahead(event: KeyboardEvent) {\n if (event.defaultPrevented) return;\n clearTimeout(this.cancelTypeaheadTimeout);\n // Stop typingahead if one of the navigation or selection keys (except for\n // Space) are pressed\n if (event.code === 'Enter' \|\| event.code.startsWith('Arrow') \|\|\n event.code === 'Escape') {\n this.endTypeahead();\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n return;\n }\n\n // If Space is pressed, prevent it from selecting and closing the menu\n if (event.code === 'Space') {\n event.preventDefault();\n }\n\n // Start up a new keystroke buffer timeout\n this.cancelTypeaheadTimeout =\n setTimeout(this.endTypeahead, this.getProperties().typeaheadBufferTime);\n\n this.typaheadBuffer += event.key.toLowerCase();\n\n const lastActiveIndex = this.lastActiveRecord ?\n this.lastActiveRecord[TYPEAHEAD_RECORD.INDEX] :\n -1;\n const numRecords = this.typeaheadRecords.length;\n\n /\n Sorting function that will resort the items starting with the given index\n \n @example\n \n this.typeaheadRecords =\n * 0: [0, <reference>, 'apple']\n * 1: [1, <reference>, 'apricot']\n * 2: [2, <reference>, 'banana']\n * 3: [3, <reference>, 'olive'] <-- lastActiveIndex\n * 4: [4, <reference>, 'orange']\n * 5: [5, <reference>, 'strawberry']\n \n this.typeaheadRecords.sort((a,b) => rebaseIndexOnActive(a)\n * - rebaseIndexOnActive(b)) ===\n * 0: [3, <reference>, 'olive'] <-- lastActiveIndex\n * 1: [4, <reference>, 'orange']\n * 2: [5, <reference>, 'strawberry']\n * 3: [0, <reference>, 'apple']\n * 4: [1, <reference>, 'apricot']\n * 5: [2, <reference>, 'banana']\n /\n const rebaseIndexOnActive = (record: TypeaheadRecord) => {\n return (record[TYPEAHEAD_RECORD.INDEX] + numRecords - lastActiveIndex) %\n numRecords;\n };\n\n // records filtered and sorted / rebased around the last active index\n const matchingRecords =\n this.typeaheadRecords\n .filter(\n record => !record[TYPEAHEAD_RECORD.ITEM].disabled &&\n record[TYPEAHEAD_RECORD.TEXT].startsWith(\n this.typaheadBuffer))\n .sort((a, b) => rebaseIndexOnActive(a) - rebaseIndexOnActive(b));\n\n // Just leave if there's nothing that matches. Native select will just\n // choose the first thing that starts with the next letter in the alphabet\n // but that's out of scope and hard to localize\n if (matchingRecords.length === 0) {\n clearTimeout(this.cancelTypeaheadTimeout);\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n this.endTypeahead();\n return;\n }\n\n const isNewQuery = this.typaheadBuffer.length === 1;\n let nextRecord: TypeaheadRecord;\n\n // This is likely the case that someone is trying to \"tab\" through different\n // entries that start with the same letter\n if (this.lastActiveRecord === matchingRecords[0] && isNewQuery) {\n nextRecord = matchingRecords[1] ?? matchingRecords[0];\n } else {\n nextRecord = matchingRecords[0];\n }\n\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n\n this.lastActiveRecord = nextRecord;\n nextRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = 0;\n nextRecord[TYPEAHEAD_RECORD.ITEM].focus();\n return;\n }\n\n /\n Ends the current typeahead and clears the buffer.\n */\n private readonly endTypeahead = () => {\n this.isTypingAhead = false;\n this.typaheadBuffer = '';\n this.typeaheadRecords = [];\n };\n}\n"]}
1	+ {"version":3,"file":"typeaheadController.js","sourceRoot":"","sources":["typeaheadController.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AA8BH;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,KAAK,EAAE,CAAC;IACR,IAAI,EAAE,CAAC;IACP,IAAI,EAAE,CAAC;CACC,CAAC;AAEX;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,OAAO,mBAAmB;IAsB9B;;;;;;;;;OASG;IACH,YACmB,aAAkD;QAAlD,kBAAa,GAAb,aAAa,CAAqC;QAhCrE;;WAEG;QACK,qBAAgB,GAAsB,EAAE,CAAC;QACjD;;WAEG;QACK,mBAAc,GAAG,EAAE,CAAC;QAC5B;;WAEG;QACK,2BAAsB,GAAG,CAAC,CAAC;QACnC;;WAEG;QACH,kBAAa,GAAG,KAAK,CAAC;QACtB;;WAEG;QACH,qBAAgB,GAA2B,IAAI,CAAC;QAwBhD;;;;;WAKG;QACM,cAAS,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC5C,IAAI,IAAI,CAAC,aAAa,EAAE;gBACtB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;aACvB;iBAAM;gBACL,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;aAC5B;QACH,CAAC,CAAC;QAsLF;;WAEG;QACc,iBAAY,GAAG,GAAG,EAAE;YACnC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;YAC3B,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;YACzB,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC7B,CAAC,CAAC;IAnNC,CAAC;IAEJ,IAAY,KAAK;QACf,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC,QAAQ,EAAE,CAAC;IACzC,CAAC;IAED,IAAY,MAAM;QAChB,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC;IACrC,CAAC;IAgBD;;OAEG;IACK,cAAc,CAAC,KAAoB;QACzC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YAChB,OAAO;SACR;QAED,2EAA2E;QAC3E,yEAAyE;QACzE,wBAAwB;QACxB,IACE,KAAK,CAAC,IAAI,KAAK,OAAO;YACtB,KAAK,CAAC,IAAI,KAAK,OAAO;YACtB,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YAC9B,KAAK,CAAC,IAAI,KAAK,QAAQ,EACvB;YACA,OAAO;SACR;QAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;QAC1B,4EAA4E;QAC5E,2BAA2B;QAC3B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC;YACpD,KAAK;YACL,EAAE;YACF,EAAE,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE;SACtC,CAAC,CAAC;QACH,IAAI,CAAC,gBAAgB;YACnB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CACxB,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,KAAK,CAAC,CACzD,IAAI,IAAI,CAAC;QACZ,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACzB,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;SAC5D;QACD,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC;IAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAmCG;IACK,SAAS,CAAC,KAAoB;QACpC,IAAI,KAAK,CAAC,gBAAgB;YAAE,OAAO;QACnC,YAAY,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;QAC1C,0EAA0E;QAC1E,qBAAqB;QACrB,IACE,KAAK,CAAC,IAAI,KAAK,OAAO;YACtB,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YAC9B,KAAK,CAAC,IAAI,KAAK,QAAQ,EACvB;YACA,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,IAAI,IAAI,CAAC,gBAAgB,EAAE;gBACzB,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;aAC5D;YACD,OAAO;SACR;QAED,sEAAsE;QACtE,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAC1B,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;QAED,0CAA0C;QAC1C,IAAI,CAAC,sBAAsB,GAAG,UAAU,CACtC,IAAI,CAAC,YAAY,EACjB,IAAI,CAAC,aAAa,EAAE,CAAC,mBAAmB,CACzC,CAAC;QAEF,IAAI,CAAC,cAAc,IAAI,KAAK,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;QAE/C,MAAM,eAAe,GAAG,IAAI,CAAC,gBAAgB;YAC3C,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,KAAK,CAAC;YAC/C,CAAC,CAAC,CAAC,CAAC,CAAC;QACP,MAAM,UAAU,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC;QAEhD;;;;;;;;;;;;;;;;;;;;;WAqBG;QACH,MAAM,mBAAmB,GAAG,CAAC,MAAuB,EAAE,EAAE;YACtD,OAAO,CACL,CAAC,MAAM,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAG,UAAU,GAAG,eAAe,CAAC;gBAC/D,UAAU,CACX,CAAC;QACJ,CAAC,CAAC;QAEF,qEAAqE;QACrE,MAAM,eAAe,GAAG,IAAI,CAAC,gBAAgB;aAC1C,MAAM,CACL,CAAC,MAAM,EAAE,EAAE,CACT,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ;YACvC,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,cAAc,CAAC,CAChE;aACA,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAC,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;QAEnE,sEAAsE;QACtE,0EAA0E;QAC1E,+CAA+C;QAC/C,IAAI,eAAe,CAAC,MAAM,KAAK,CAAC,EAAE;YAChC,YAAY,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;YAC1C,IAAI,IAAI,CAAC,gBAAgB,EAAE;gBACzB,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;aAC5D;YACD,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,OAAO;SACR;QAED,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,KAAK,CAAC,CAAC;QACpD,IAAI,UAA2B,CAAC;QAEhC,4EAA4E;QAC5E,0CAA0C;QAC1C,IAAI,IAAI,CAAC,gBAAgB,KAAK,eAAe,CAAC,CAAC,CAAC,IAAI,UAAU,EAAE;YAC9D,UAAU,GAAG,eAAe,CAAC,CAAC,CAAC,IAAI,eAAe,CAAC,CAAC,CAAC,CAAC;SACvD;aAAM;YACL,UAAU,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC;SACjC;QAED,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACzB,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;SAC5D;QAED,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAAC;QACnC,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC;QAC/C,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,CAAC;QAC1C,OAAO;IACT,CAAC;CAUF","sourcesContent":["/*\n @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n\nimport {MenuItem} from './menuItemController.js';\n\n/\n The options that are passed to the typeahead controller.\n /\nexport interface TypeaheadControllerProperties {\n /\n A function that returns an array of menu items to be searched.\n * @return An array of menu items to be searched by typing.\n /\n getItems: () => MenuItem[];\n /\n The maximum time between each keystroke to keep the current type buffer\n * alive.\n /\n typeaheadBufferTime: number;\n /\n Whether or not the typeahead should listen for keystrokes or not.\n /\n active: boolean;\n}\n\n/\n Data structure tuple that helps with indexing.\n \n [index, item, normalized header text]\n /\ntype TypeaheadRecord = [number, MenuItem, string];\n/\n Indicies to access the TypeaheadRecord tuple type.\n /\nexport const TYPEAHEAD_RECORD = {\n INDEX: 0,\n ITEM: 1,\n TEXT: 2,\n} as const;\n\n/\n This controller listens to `keydown` events and searches the header text of\n * an array of `MenuItem`s with the corresponding entered keys within the buffer\n * time and activates the item.\n \n @example\n * ```ts\n * const typeaheadController = new TypeaheadController(() => ({\n * typeaheadBufferTime: 50,\n * getItems: () => Array.from(document.querySelectorAll('md-menu-item'))\n * }));\n * html`\n * <div\n * @keydown=${typeaheadController.onKeydown}\n * tabindex=\"0\"\n * class=\"activeItemText\">\n * <!-- focusable element that will receive keydown events -->\n * Apple\n * </div>\n * <div>\n * <md-menu-item active header=\"Apple\"></md-menu-item>\n * <md-menu-item header=\"Apricot\"></md-menu-item>\n * <md-menu-item header=\"Banana\"></md-menu-item>\n * <md-menu-item header=\"Olive\"></md-menu-item>\n * <md-menu-item header=\"Orange\"></md-menu-item>\n * </div>\n * `;\n * ```\n /\nexport class TypeaheadController {\n /\n Array of tuples that helps with indexing.\n /\n private typeaheadRecords: TypeaheadRecord[] = [];\n /\n Currently-typed text since last buffer timeout\n /\n private typaheadBuffer = '';\n /\n The timeout id from the current buffer's setTimeout\n /\n private cancelTypeaheadTimeout = 0;\n /\n If we are currently \"typing\"\n /\n isTypingAhead = false;\n /\n The record of the last active item.\n /\n lastActiveRecord: TypeaheadRecord \| null = null;\n\n /\n @param getProperties A function that returns the options of the typeahead\n * controller:\n \n {\n * getItems: A function that returns an array of menu items to be searched.\n * typeaheadBufferTime: The maximum time between each keystroke to keep the\n * current type buffer alive.\n * }\n /\n constructor(\n private readonly getProperties: () => TypeaheadControllerProperties,\n ) {}\n\n private get items() {\n return this.getProperties().getItems();\n }\n\n private get active() {\n return this.getProperties().active;\n }\n\n /\n Apply this listener to the element that will receive `keydown` events that\n * should trigger this controller.\n \n @param event The native browser `KeyboardEvent` from the `keydown` event.\n /\n readonly onKeydown = (event: KeyboardEvent) => {\n if (this.isTypingAhead) {\n this.typeahead(event);\n } else {\n this.beginTypeahead(event);\n }\n };\n\n /\n Sets up typingahead\n /\n private beginTypeahead(event: KeyboardEvent) {\n if (!this.active) {\n return;\n }\n\n // We don't want to typeahead if the _beginning_ of the typeahead is a menu\n // navigation, or a selection. We will handle \"Space\" only if it's in the\n // middle of a typeahead\n if (\n event.code === 'Space' \|\|\n event.code === 'Enter' \|\|\n event.code.startsWith('Arrow') \|\|\n event.code === 'Escape'\n ) {\n return;\n }\n\n this.isTypingAhead = true;\n // Generates the record array data structure which is the index, the element\n // and a normalized header.\n this.typeaheadRecords = this.items.map((el, index) => [\n index,\n el,\n el.typeaheadText.trim().toLowerCase(),\n ]);\n this.lastActiveRecord =\n this.typeaheadRecords.find(\n (record) => record[TYPEAHEAD_RECORD.ITEM].tabIndex === 0,\n ) ?? null;\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n this.typeahead(event);\n }\n\n /\n Performs the typeahead. Based on the normalized items and the current text\n * buffer, finds the _next_ item with matching text and activates it.\n \n @example\n \n items: Apple, Banana, Olive, Orange, Cucumber\n * buffer: ''\n * user types: o\n \n activates Olive\n \n @example\n \n items: Apple, Banana, Olive (active), Orange, Cucumber\n * buffer: 'o'\n * user types: l\n \n activates Olive\n \n @example\n \n items: Apple, Banana, Olive (active), Orange, Cucumber\n * buffer: ''\n * user types: o\n \n activates Orange\n \n @example\n \n items: Apple, Banana, Olive, Orange (active), Cucumber\n * buffer: ''\n * user types: o\n \n activates Olive\n /\n private typeahead(event: KeyboardEvent) {\n if (event.defaultPrevented) return;\n clearTimeout(this.cancelTypeaheadTimeout);\n // Stop typingahead if one of the navigation or selection keys (except for\n // Space) are pressed\n if (\n event.code === 'Enter' \|\|\n event.code.startsWith('Arrow') \|\|\n event.code === 'Escape'\n ) {\n this.endTypeahead();\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n return;\n }\n\n // If Space is pressed, prevent it from selecting and closing the menu\n if (event.code === 'Space') {\n event.preventDefault();\n }\n\n // Start up a new keystroke buffer timeout\n this.cancelTypeaheadTimeout = setTimeout(\n this.endTypeahead,\n this.getProperties().typeaheadBufferTime,\n );\n\n this.typaheadBuffer += event.key.toLowerCase();\n\n const lastActiveIndex = this.lastActiveRecord\n ? this.lastActiveRecord[TYPEAHEAD_RECORD.INDEX]\n : -1;\n const numRecords = this.typeaheadRecords.length;\n\n /\n Sorting function that will resort the items starting with the given index\n \n @example\n \n this.typeaheadRecords =\n * 0: [0, <reference>, 'apple']\n * 1: [1, <reference>, 'apricot']\n * 2: [2, <reference>, 'banana']\n * 3: [3, <reference>, 'olive'] <-- lastActiveIndex\n * 4: [4, <reference>, 'orange']\n * 5: [5, <reference>, 'strawberry']\n \n this.typeaheadRecords.sort((a,b) => rebaseIndexOnActive(a)\n * - rebaseIndexOnActive(b)) ===\n * 0: [3, <reference>, 'olive'] <-- lastActiveIndex\n * 1: [4, <reference>, 'orange']\n * 2: [5, <reference>, 'strawberry']\n * 3: [0, <reference>, 'apple']\n * 4: [1, <reference>, 'apricot']\n * 5: [2, <reference>, 'banana']\n /\n const rebaseIndexOnActive = (record: TypeaheadRecord) => {\n return (\n (record[TYPEAHEAD_RECORD.INDEX] + numRecords - lastActiveIndex) %\n numRecords\n );\n };\n\n // records filtered and sorted / rebased around the last active index\n const matchingRecords = this.typeaheadRecords\n .filter(\n (record) =>\n !record[TYPEAHEAD_RECORD.ITEM].disabled &&\n record[TYPEAHEAD_RECORD.TEXT].startsWith(this.typaheadBuffer),\n )\n .sort((a, b) => rebaseIndexOnActive(a) - rebaseIndexOnActive(b));\n\n // Just leave if there's nothing that matches. Native select will just\n // choose the first thing that starts with the next letter in the alphabet\n // but that's out of scope and hard to localize\n if (matchingRecords.length === 0) {\n clearTimeout(this.cancelTypeaheadTimeout);\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n this.endTypeahead();\n return;\n }\n\n const isNewQuery = this.typaheadBuffer.length === 1;\n let nextRecord: TypeaheadRecord;\n\n // This is likely the case that someone is trying to \"tab\" through different\n // entries that start with the same letter\n if (this.lastActiveRecord === matchingRecords[0] && isNewQuery) {\n nextRecord = matchingRecords[1] ?? matchingRecords[0];\n } else {\n nextRecord = matchingRecords[0];\n }\n\n if (this.lastActiveRecord) {\n this.lastActiveRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = -1;\n }\n\n this.lastActiveRecord = nextRecord;\n nextRecord[TYPEAHEAD_RECORD.ITEM].tabIndex = 0;\n nextRecord[TYPEAHEAD_RECORD.ITEM].focus();\n return;\n }\n\n /\n Ends the current typeahead and clears the buffer.\n */\n private readonly endTypeahead = () => {\n this.isTypingAhead = false;\n this.typaheadBuffer = '';\n this.typeaheadRecords = [];\n };\n}\n"]}

package/menu/internal/menu-styles.css.js CHANGED Viewed

@@ -4,6 +4,6 @@
   * SPDX-License-Identifier: Apache-2.0
   */
 import { css } from 'lit';
-export const styles = css `:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow .items{overflow:visible}.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/*# sourceMappingURL=menu-styles.css.map */
+export const styles = css `:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;inset:auto;border:none;padding:0px;overflow:visible;background-color:rgba(0,0,0,0);opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.menu::backdrop{display:none}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow:not([popover]) .items{overflow:visible}.has-overflow.animating .items,.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/*# sourceMappingURL=menu-styles.css.map */
 `;
 //# sourceMappingURL=menu-styles.css.js.map

package/menu/internal/menu-styles.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menu-styles.css.js","sourceRoot":"","sources":["menu-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/*\n @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n import {css} from 'lit';\n export const styles = css`:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow .items{overflow:visible}.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/# sourceMappingURL=menu-styles.css.map */\n`;\n "]}
1	+ {"version":3,"file":"menu-styles.css.js","sourceRoot":"","sources":["menu-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/*\n @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n /\n import {css} from 'lit';\n export const styles = css`:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;inset:auto;border:none;padding:0px;overflow:visible;background-color:rgba(0,0,0,0);opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.menu::backdrop{display:none}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow:not([popover]) .items{overflow:visible}.has-overflow.animating .items,.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/# sourceMappingURL=menu-styles.css.map */\n`;\n "]}

package/menu/internal/menu.d.ts CHANGED Viewed

@@ -3,8 +3,8 @@
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-import '../../focus/md-focus-ring.js';
 import '../../elevation/elevation.js';
+import '../../focus/md-focus-ring.js';
 import { LitElement, PropertyValues } from 'lit';
 import { MenuItem } from './controllers/menuItemController.js';
 import { FocusState } from './controllers/shared.js';
@@ -16,10 +16,10 @@ export { Corner } from './controllers/surfacePositionController.js';
  */
 export declare const DEFAULT_TYPEAHEAD_BUFFER_TIME = 200;
 /**
- * @fires opening Fired before the opening animation begins
- * @fires opened Fired once the menu is open, after any animations
- * @fires closing Fired before the closing animation begins
- * @fires closed Fired once the menu is closed, after any animations
+ * @fires opening {Event} Fired before the opening animation begins
+ * @fires opened {Event} Fired once the menu is open, after any animations
+ * @fires closing {Event} Fired before the closing animation begins
+ * @fires closed {Event} Fired once the menu is closed, after any animations
  */
 export declare abstract class Menu extends LitElement {
     private readonly surfaceEl;
@@ -34,9 +34,12 @@ export declare abstract class Menu extends LitElement {
     anchor: string;
     /**
      * Whether the positioning algorithim should calculate relative to the parent
-     * of the anchor element (absolute) or relative to the window (fixed).
+     * of the anchor element (`absolute`), relative to the window (`fixed`), or
+     * relative to the document (`document`). `popover` will use the popover API
+     * to render the menu in the top-layer. If your browser does not support the
+     * popover API, it will fall back to `fixed`.
      *
-     * Examples for `position = 'fixed'`:
+     * __Examples for `position = 'fixed'`:__
      *
      * - If there is no `position:relative` in the given parent tree and the
      *   surface is `position:absolute`
@@ -45,20 +48,36 @@ export declare abstract class Menu extends LitElement {
      * - The anchor and the surface do not share a common `position:relative`
      *   ancestor
      *
-     * When using positioning = fixed, in most cases, the menu should position
+     * When using `positioning=fixed`, in most cases, the menu should position
      * itself above most other `position:absolute` or `position:fixed` elements
      * when placed inside of them. e.g. using a menu inside of an `md-dialog`.
      *
      * __NOTE__: Fixed menus will not scroll with the page and will be fixed to
      * the window instead.
+     *
+     * __Examples for `position = 'document'`:__
+     *
+     * - There is no parent that creates a relative positioning context e.g.
+     *   `position: relative`, `position: absolute`, `transform: translate(x, y)`,
+     *   etc.
+     * - You put the effort into hoisting the menu to the top of the DOM like the
+     *   end of the `<body>` to render over everything or in a top-layer.
+     * - You are reusing a single `md-menu` element that dynamically renders
+     *   content.
+     *
+     * __Examples for `position = 'popover'`:__
+     *
+     * - Your browser supports `popover`.
+     * - Most cases. Once popover is in browsers, this will become the default.
      */
-    positioning: 'absolute' | 'fixed';
+    positioning: 'absolute' | 'fixed' | 'document' | 'popover';
     /**
      * Skips the opening and closing animations.
      */
     quick: boolean;
     /**
-     * Displays overflow content like a submenu.
+     * Displays overflow content like a submenu. Not required in most cases when
+     * using `positioning="popover"`.
      *
      * __NOTE__: This may cause adverse effects if you set
      * `md-menu {max-height:...}`
@@ -147,6 +166,10 @@ export declare abstract class Menu extends LitElement {
      * The event path of the last window pointerdown event.
      */
     private pointerPath;
+    /**
+     * Whether or not the menu is repositoining due to window / document resize
+     */
+    private isRepositioning;
     private readonly openCloseAnimationSignal;
     private readonly listController;
     /**
@@ -168,8 +191,8 @@ export declare abstract class Menu extends LitElement {
      * non-empty idref string, then `anchorEl` will resolve to the element with
      * the given id in the same root node. Otherwise, `null`.
      */
-    get anchorElement(): HTMLElement & Partial<SurfacePositionTarget> | null;
-    set anchorElement(element: HTMLElement & Partial<SurfacePositionTarget> | null);
+    get anchorElement(): (HTMLElement & Partial<SurfacePositionTarget>) | null;
+    set anchorElement(element: (HTMLElement & Partial<SurfacePositionTarget>) | null);
     private readonly internals;
     constructor();
     /**
@@ -184,6 +207,7 @@ export declare abstract class Menu extends LitElement {
     get items(): MenuItem[];
     protected willUpdate(changed: PropertyValues<Menu>): void;
     update(changed: PropertyValues<Menu>): void;
+    private readonly onWindowResize;
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected render(): import("lit-html").TemplateResult<1>;
@@ -263,4 +287,11 @@ export declare abstract class Menu extends LitElement {
      * @return The activated menu item or `null` if there are no items.
      */
     activatePreviousItem(): MenuItem;
+    /**
+     * Repositions the menu if it is open.
+     *
+     * Useful for the case where document or window-positioned menus have their
+     * anchors moved while open.
+     */
+    reposition(): void;
 }