@material/web 1.0.1 → 1.0.2-nightly.6a1fb38.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.
- 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 +16 -23
- package/checkbox/internal/checkbox.js +38 -52
- 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/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 +15 -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 +9 -25
- package/switch/internal/switch.js +31 -57
- 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
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sub-menu.js","sourceRoot":"","sources":["sub-menu.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 {html, isServer, LitElement} from 'lit';\nimport {property, queryAssignedElements} from 'lit/decorators.js';\n\nimport {createDeactivateItemsEvent, createRequestActivationEvent, deactivateActiveItem, getFirstActivatableItem} from '../../../list/internal/list-navigation-helpers.js';\nimport {MenuItem} from '../controllers/menuItemController.js';\nimport {CloseMenuEvent, CloseReason, createActivateTypeaheadEvent, createDeactivateTypeaheadEvent, KeydownCloseKey, Menu, NavigableKey, SelectionKey} from '../controllers/shared.js';\nimport {Corner} from '../menu.js';\n\n/**\n * @fires deactivate-items Requests the parent menu to deselect other items when\n * a submenu opens\n * @fires request-activation Requests the parent make the slotted item focusable\n * and focuses the item.\n * @fires deactivate-typeahead Requests the parent menu to deactivate the\n * typeahead functionality when a submenu opens\n * @fires activate-typeahead Requests the parent menu to activate the typeahead\n * functionality when a submenu closes\n */\nexport class SubMenu extends LitElement {\n /**\n * The anchorCorner to set on the submenu.\n */\n @property({attribute: 'anchor-corner'})\n anchorCorner: Corner = Corner.START_END;\n /**\n * The menuCorner to set on the submenu.\n */\n @property({attribute: 'menu-corner'}) menuCorner: Corner = Corner.START_START;\n /**\n * The delay between mouseenter and submenu opening.\n */\n @property({type: Number, attribute: 'hover-open-delay'}) hoverOpenDelay = 400;\n /**\n * The delay between ponterleave and the submenu closing.\n */\n @property({type: Number, attribute: 'hover-close-delay'})\n hoverCloseDelay = 400;\n\n /**\n * READONLY: self-identifies as a menu item and sets its identifying attribute\n */\n @property({type: Boolean, reflect: true, attribute: 'md-sub-menu'})\n isSubMenu = true;\n\n get item() {\n return this.items[0] ?? null;\n }\n\n get menu() {\n return this.menus[0] ?? null;\n }\n\n @queryAssignedElements({slot: 'item', flatten: true})\n private readonly items!: MenuItem[];\n\n @queryAssignedElements({slot: 'menu', flatten: true})\n private readonly menus!: Menu[];\n\n private previousOpenTimeout = 0;\n private previousCloseTimeout = 0;\n\n constructor() {\n super();\n\n if (!isServer) {\n this.addEventListener('mouseenter', this.onMouseenter);\n this.addEventListener('mouseleave', this.onMouseleave);\n }\n }\n\n override render() {\n return html`\n <slot\n name=\"item\"\n @click=${this.onClick}\n @keydown=${this.onKeydown}\n @slotchange=${this.onSlotchange}\n >\n </slot>\n <slot name=\"menu\"\n @keydown=${this.onSubMenuKeydown}\n @close-menu=${this.onCloseSubmenu}\n @slotchange=${this.onSlotchange}>\n </slot>\n `;\n }\n\n protected override firstUpdated() {\n // slotchange is not fired if the contents have been SSRd\n this.onSlotchange();\n }\n\n /**\n * Shows the submenu.\n */\n async show() {\n const menu = this.menu;\n if (!menu || menu.open) return;\n\n // Ensures that we deselect items when the menu closes and reactivate\n // typeahead when the menu closes, so that we do not have dirty state of\n // `sub-menu > menu-item[selected]` when we reopen.\n //\n // This cannot happen in `close()` because the menu may close via other\n // means Additionally, this cannot happen in onCloseSubmenu because\n // `close-menu` may not be called via focusout of outside click and not\n // triggered by an item\n menu.addEventListener('closed', () => {\n this.item.ariaExpanded = 'false';\n this.dispatchEvent(createActivateTypeaheadEvent());\n this.dispatchEvent(createDeactivateItemsEvent());\n // aria-hidden required so ChromeVox doesn't announce the closed menu\n menu.ariaHidden = 'true';\n }, {once: true});\n menu.quick = true;\n // Submenus are in overflow when not fixed. Can remove once we have native\n // popup support\n menu.hasOverflow = true;\n menu.anchorCorner = this.anchorCorner;\n menu.menuCorner = this.menuCorner;\n menu.anchorElement = this.item;\n menu.defaultFocus = 'first-item';\n // aria-hidden management required so ChromeVox doesn't announce the closed\n // menu. Remove it here since we are about to show and focus it.\n menu.removeAttribute('aria-hidden');\n // This is required in the case where we have a leaf menu open and and the\n // user hovers a parent menu's item which is not an md-sub-menu item.\n // If this were set to true, then the menu would close and focus would be\n // lost. That means the focusout event would have a `relatedTarget` of\n // `null` since nothing in the menu would be focused anymore due to the\n // leaf menu closing. restoring focus ensures that we keep focus in the\n // submenu tree.\n menu.skipRestoreFocus = false;\n\n // Menu could already be opened because of mouse interaction\n const menuAlreadyOpen = menu.open;\n menu.show();\n this.item.ariaExpanded = 'true';\n this.item.ariaHasPopup = 'menu';\n if (menu.id) {\n this.item.setAttribute('aria-controls', menu.id);\n }\n\n // Deactivate other items. This can be the case if the user has tabbed\n // around the menu and then mouses over an md-sub-menu.\n this.dispatchEvent(createDeactivateItemsEvent());\n this.dispatchEvent(createDeactivateTypeaheadEvent());\n this.item.selected = true;\n\n // This is the case of mouse hovering when already opened via keyboard or\n // vice versa\n if (!menuAlreadyOpen) {\n let open = (value: unknown) => {};\n const opened = new Promise((resolve) => {\n open = resolve;\n });\n menu.addEventListener('opened', open, {once: true});\n await opened;\n }\n }\n\n /**\n * Closes the submenu.\n */\n async close() {\n const menu = this.menu;\n if (!menu || !menu.open) return;\n\n this.dispatchEvent(createActivateTypeaheadEvent());\n menu.quick = true;\n menu.close();\n this.dispatchEvent(createDeactivateItemsEvent());\n let close = (value: unknown) => {};\n const closed = new Promise((resolve) => {\n close = resolve;\n });\n menu.addEventListener('closed', close, {once: true});\n await closed;\n }\n\n protected onSlotchange() {\n if (!this.item) {\n return;\n }\n\n // TODO(b/301296618): clean up old aria values on change\n this.item.ariaExpanded = 'false';\n this.item.ariaHasPopup = 'menu';\n if (this.menu?.id) {\n this.item.setAttribute('aria-controls', this.menu.id);\n }\n this.item.keepOpen = true;\n\n const menu = this.menu;\n if (!menu) return;\n\n menu.isSubmenu = true;\n // Required for ChromeVox to not linearly navigate to the menu while closed\n menu.ariaHidden = 'true';\n }\n\n /**\n * Starts the default 400ms countdown to open the submenu.\n *\n * NOTE: We explicitly use mouse events and not pointer events because\n * pointer events apply to touch events. And if a user were to tap a\n * sub-menu, it would fire the \"pointerenter\", \"pointerleave\", \"click\" events\n * which would open the menu on click, and then set the timeout to close the\n * menu due to pointerleave.\n */\n protected onMouseenter = () => {\n clearTimeout(this.previousOpenTimeout);\n clearTimeout(this.previousCloseTimeout);\n if (this.menu?.open) return;\n\n // Open synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverOpenDelay) {\n this.show();\n } else {\n this.previousOpenTimeout = setTimeout(() => {\n this.show();\n }, this.hoverOpenDelay);\n }\n };\n\n /**\n * Starts the default 400ms countdown to close the submenu.\n *\n * NOTE: We explicitly use mouse events and not pointer events because\n * pointer events apply to touch events. And if a user were to tap a\n * sub-menu, it would fire the \"pointerenter\", \"pointerleave\", \"click\" events\n * which would open the menu on click, and then set the timeout to close the\n * menu due to pointerleave.\n */\n protected onMouseleave = () => {\n clearTimeout(this.previousCloseTimeout);\n clearTimeout(this.previousOpenTimeout);\n\n // Close synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverCloseDelay) {\n this.close();\n } else {\n this.previousCloseTimeout = setTimeout(() => {\n this.close();\n }, this.hoverCloseDelay);\n }\n };\n\n protected onClick() {\n this.show();\n }\n\n /**\n * On item keydown handles opening the submenu.\n */\n protected async onKeydown(event: KeyboardEvent) {\n const shouldOpenSubmenu = this.isSubmenuOpenKey(event.code);\n\n if (event.defaultPrevented) return;\n\n const openedWithLR = shouldOpenSubmenu &&\n (NavigableKey.LEFT === event.code || NavigableKey.RIGHT === event.code);\n\n if (event.code === SelectionKey.SPACE || openedWithLR) {\n // prevent space from scrolling and Left + Right from selecting previous /\n // next items or opening / closing parent menus. Only open the submenu.\n event.preventDefault();\n\n if (openedWithLR) {\n event.stopPropagation();\n }\n }\n\n if (!shouldOpenSubmenu) {\n return;\n }\n\n const submenu = this.menu;\n if (!submenu) return;\n\n const submenuItems = submenu.items;\n const firstActivatableItem = getFirstActivatableItem(submenuItems);\n\n if (firstActivatableItem) {\n await this.show();\n\n firstActivatableItem.tabIndex = 0;\n firstActivatableItem.focus();\n\n return;\n }\n }\n\n private onCloseSubmenu(event: CloseMenuEvent) {\n const {itemPath, reason} = event.detail;\n itemPath.push(this.item);\n\n this.dispatchEvent(createActivateTypeaheadEvent());\n // Escape should only close one menu not all of the menus unlike space or\n // click selection which should close all menus.\n if (reason.kind === CloseReason.KEYDOWN &&\n reason.key === KeydownCloseKey.ESCAPE) {\n event.stopPropagation();\n this.item.dispatchEvent(createRequestActivationEvent());\n return;\n }\n\n this.dispatchEvent(createDeactivateItemsEvent());\n }\n\n private async onSubMenuKeydown(event: KeyboardEvent) {\n if (event.defaultPrevented) return;\n const {close: shouldClose, keyCode} = this.isSubmenuCloseKey(event.code);\n if (!shouldClose) return;\n\n // Communicate that it's handled so that we don't accidentally close every\n // parent menu. Additionally, we want to isolate things like the typeahead\n // keydowns from bubbling up to the parent menu and confounding things.\n event.preventDefault();\n\n if (keyCode === NavigableKey.LEFT || keyCode === NavigableKey.RIGHT) {\n // Prevent this from bubbling to parents\n event.stopPropagation();\n }\n\n await this.close();\n\n deactivateActiveItem(this.menu.items);\n this.item?.focus();\n this.item.tabIndex = 0;\n this.item.focus();\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should open\n * the submenu. This is RTL-aware. By default, left, right, space, or enter.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should open the submenu.\n */\n private isSubmenuOpenKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NavigableKey.LEFT : NavigableKey.RIGHT;\n switch (code) {\n case arrowEnterKey:\n case SelectionKey.SPACE:\n case SelectionKey.ENTER:\n return true;\n default:\n return false;\n }\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should close\n * the submenu. This is RTL-aware. By default right, left, or escape.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should close the submenu.\n */\n private isSubmenuCloseKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NavigableKey.RIGHT : NavigableKey.LEFT;\n switch (code) {\n case arrowEnterKey:\n case KeydownCloseKey.ESCAPE:\n return {close: true, keyCode: code} as const;\n default:\n return {close: false} as const;\n }\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"sub-menu.js","sourceRoot":"","sources":["sub-menu.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 {html, isServer, LitElement} from 'lit';\nimport {property, queryAssignedElements} from 'lit/decorators.js';\n\nimport {\n createDeactivateItemsEvent,\n createRequestActivationEvent,\n deactivateActiveItem,\n getFirstActivatableItem,\n} from '../../../list/internal/list-navigation-helpers.js';\nimport {MenuItem} from '../controllers/menuItemController.js';\nimport {\n CloseMenuEvent,\n CloseReason,\n createActivateTypeaheadEvent,\n createDeactivateTypeaheadEvent,\n KeydownCloseKey,\n Menu,\n NavigableKey,\n SelectionKey,\n} from '../controllers/shared.js';\nimport {Corner} from '../menu.js';\n\n/**\n * @fires deactivate-items {Event} Requests the parent menu to deselect other\n * items when a submenu opens. --bubbles --composed\n * @fires request-activation {Event} Requests the parent make the slotted item\n * focusable and focuses the item. --bubbles --composed\n * @fires deactivate-typeahead {Event} Requests the parent menu to deactivate\n * the typeahead functionality when a submenu opens. --bubbles --composed\n * @fires activate-typeahead {Event} Requests the parent menu to activate the\n * typeahead functionality when a submenu closes. --bubbles --composed\n */\nexport class SubMenu extends LitElement {\n /**\n * The anchorCorner to set on the submenu.\n */\n @property({attribute: 'anchor-corner'})\n anchorCorner: Corner = Corner.START_END;\n /**\n * The menuCorner to set on the submenu.\n */\n @property({attribute: 'menu-corner'}) menuCorner: Corner = Corner.START_START;\n /**\n * The delay between mouseenter and submenu opening.\n */\n @property({type: Number, attribute: 'hover-open-delay'}) hoverOpenDelay = 400;\n /**\n * The delay between ponterleave and the submenu closing.\n */\n @property({type: Number, attribute: 'hover-close-delay'})\n hoverCloseDelay = 400;\n\n /**\n * READONLY: self-identifies as a menu item and sets its identifying attribute\n */\n @property({type: Boolean, reflect: true, attribute: 'md-sub-menu'})\n isSubMenu = true;\n\n get item() {\n return this.items[0] ?? null;\n }\n\n get menu() {\n return this.menus[0] ?? null;\n }\n\n @queryAssignedElements({slot: 'item', flatten: true})\n private readonly items!: MenuItem[];\n\n @queryAssignedElements({slot: 'menu', flatten: true})\n private readonly menus!: Menu[];\n\n private previousOpenTimeout = 0;\n private previousCloseTimeout = 0;\n\n constructor() {\n super();\n\n if (!isServer) {\n this.addEventListener('mouseenter', this.onMouseenter);\n this.addEventListener('mouseleave', this.onMouseleave);\n }\n }\n\n override render() {\n return html`\n <slot\n name=\"item\"\n @click=${this.onClick}\n @keydown=${this.onKeydown}\n @slotchange=${this.onSlotchange}>\n </slot>\n <slot\n name=\"menu\"\n @keydown=${this.onSubMenuKeydown}\n @close-menu=${this.onCloseSubmenu}\n @slotchange=${this.onSlotchange}>\n </slot>\n `;\n }\n\n protected override firstUpdated() {\n // slotchange is not fired if the contents have been SSRd\n this.onSlotchange();\n }\n\n /**\n * Shows the submenu.\n */\n async show() {\n const menu = this.menu;\n if (!menu || menu.open) return;\n\n // Ensures that we deselect items when the menu closes and reactivate\n // typeahead when the menu closes, so that we do not have dirty state of\n // `sub-menu > menu-item[selected]` when we reopen.\n //\n // This cannot happen in `close()` because the menu may close via other\n // means Additionally, this cannot happen in onCloseSubmenu because\n // `close-menu` may not be called via focusout of outside click and not\n // triggered by an item\n menu.addEventListener(\n 'closed',\n () => {\n this.item.ariaExpanded = 'false';\n this.dispatchEvent(createActivateTypeaheadEvent());\n this.dispatchEvent(createDeactivateItemsEvent());\n // aria-hidden required so ChromeVox doesn't announce the closed menu\n menu.ariaHidden = 'true';\n },\n {once: true},\n );\n\n // Parent menu is `position: absolute` – this creates a new CSS relative\n // positioning context (similar to doing `position: relative`), so the\n // submenu's `<md-menu slot=\"submenu\" positioning=\"document\">` would be\n // wrong even if we change `md-sub-menu` from `position: relative` to\n // `position: static` because the submenu it would still be positioning\n // itself relative to the parent menu.\n if (menu.positioning === 'document') {\n menu.positioning = 'absolute';\n }\n menu.quick = true;\n // Submenus are in overflow when not fixed. Can remove once we have native\n // popup support\n menu.hasOverflow = true;\n menu.anchorCorner = this.anchorCorner;\n menu.menuCorner = this.menuCorner;\n menu.anchorElement = this.item;\n menu.defaultFocus = 'first-item';\n // aria-hidden management required so ChromeVox doesn't announce the closed\n // menu. Remove it here since we are about to show and focus it.\n menu.removeAttribute('aria-hidden');\n // This is required in the case where we have a leaf menu open and and the\n // user hovers a parent menu's item which is not an md-sub-menu item.\n // If this were set to true, then the menu would close and focus would be\n // lost. That means the focusout event would have a `relatedTarget` of\n // `null` since nothing in the menu would be focused anymore due to the\n // leaf menu closing. restoring focus ensures that we keep focus in the\n // submenu tree.\n menu.skipRestoreFocus = false;\n\n // Menu could already be opened because of mouse interaction\n const menuAlreadyOpen = menu.open;\n menu.show();\n this.item.ariaExpanded = 'true';\n this.item.ariaHasPopup = 'menu';\n if (menu.id) {\n this.item.setAttribute('aria-controls', menu.id);\n }\n\n // Deactivate other items. This can be the case if the user has tabbed\n // around the menu and then mouses over an md-sub-menu.\n this.dispatchEvent(createDeactivateItemsEvent());\n this.dispatchEvent(createDeactivateTypeaheadEvent());\n this.item.selected = true;\n\n // This is the case of mouse hovering when already opened via keyboard or\n // vice versa\n if (!menuAlreadyOpen) {\n let open = (value: unknown) => {};\n const opened = new Promise((resolve) => {\n open = resolve;\n });\n menu.addEventListener('opened', open, {once: true});\n await opened;\n }\n }\n\n /**\n * Closes the submenu.\n */\n async close() {\n const menu = this.menu;\n if (!menu || !menu.open) return;\n\n this.dispatchEvent(createActivateTypeaheadEvent());\n menu.quick = true;\n menu.close();\n this.dispatchEvent(createDeactivateItemsEvent());\n let close = (value: unknown) => {};\n const closed = new Promise((resolve) => {\n close = resolve;\n });\n menu.addEventListener('closed', close, {once: true});\n await closed;\n }\n\n protected onSlotchange() {\n if (!this.item) {\n return;\n }\n\n // TODO(b/301296618): clean up old aria values on change\n this.item.ariaExpanded = 'false';\n this.item.ariaHasPopup = 'menu';\n if (this.menu?.id) {\n this.item.setAttribute('aria-controls', this.menu.id);\n }\n this.item.keepOpen = true;\n\n const menu = this.menu;\n if (!menu) return;\n\n menu.isSubmenu = true;\n // Required for ChromeVox to not linearly navigate to the menu while closed\n menu.ariaHidden = 'true';\n }\n\n /**\n * Starts the default 400ms countdown to open the submenu.\n *\n * NOTE: We explicitly use mouse events and not pointer events because\n * pointer events apply to touch events. And if a user were to tap a\n * sub-menu, it would fire the \"pointerenter\", \"pointerleave\", \"click\" events\n * which would open the menu on click, and then set the timeout to close the\n * menu due to pointerleave.\n */\n protected onMouseenter = () => {\n clearTimeout(this.previousOpenTimeout);\n clearTimeout(this.previousCloseTimeout);\n if (this.menu?.open) return;\n\n // Open synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverOpenDelay) {\n this.show();\n } else {\n this.previousOpenTimeout = setTimeout(() => {\n this.show();\n }, this.hoverOpenDelay);\n }\n };\n\n /**\n * Starts the default 400ms countdown to close the submenu.\n *\n * NOTE: We explicitly use mouse events and not pointer events because\n * pointer events apply to touch events. And if a user were to tap a\n * sub-menu, it would fire the \"pointerenter\", \"pointerleave\", \"click\" events\n * which would open the menu on click, and then set the timeout to close the\n * menu due to pointerleave.\n */\n protected onMouseleave = () => {\n clearTimeout(this.previousCloseTimeout);\n clearTimeout(this.previousOpenTimeout);\n\n // Close synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverCloseDelay) {\n this.close();\n } else {\n this.previousCloseTimeout = setTimeout(() => {\n this.close();\n }, this.hoverCloseDelay);\n }\n };\n\n protected onClick() {\n this.show();\n }\n\n /**\n * On item keydown handles opening the submenu.\n */\n protected async onKeydown(event: KeyboardEvent) {\n const shouldOpenSubmenu = this.isSubmenuOpenKey(event.code);\n\n if (event.defaultPrevented) return;\n\n const openedWithLR =\n shouldOpenSubmenu &&\n (NavigableKey.LEFT === event.code || NavigableKey.RIGHT === event.code);\n\n if (event.code === SelectionKey.SPACE || openedWithLR) {\n // prevent space from scrolling and Left + Right from selecting previous /\n // next items or opening / closing parent menus. Only open the submenu.\n event.preventDefault();\n\n if (openedWithLR) {\n event.stopPropagation();\n }\n }\n\n if (!shouldOpenSubmenu) {\n return;\n }\n\n const submenu = this.menu;\n if (!submenu) return;\n\n const submenuItems = submenu.items;\n const firstActivatableItem = getFirstActivatableItem(submenuItems);\n\n if (firstActivatableItem) {\n await this.show();\n\n firstActivatableItem.tabIndex = 0;\n firstActivatableItem.focus();\n\n return;\n }\n }\n\n private onCloseSubmenu(event: CloseMenuEvent) {\n const {itemPath, reason} = event.detail;\n itemPath.push(this.item);\n\n this.dispatchEvent(createActivateTypeaheadEvent());\n // Escape should only close one menu not all of the menus unlike space or\n // click selection which should close all menus.\n if (\n reason.kind === CloseReason.KEYDOWN &&\n reason.key === KeydownCloseKey.ESCAPE\n ) {\n event.stopPropagation();\n this.item.dispatchEvent(createRequestActivationEvent());\n return;\n }\n\n this.dispatchEvent(createDeactivateItemsEvent());\n }\n\n private async onSubMenuKeydown(event: KeyboardEvent) {\n if (event.defaultPrevented) return;\n const {close: shouldClose, keyCode} = this.isSubmenuCloseKey(event.code);\n if (!shouldClose) return;\n\n // Communicate that it's handled so that we don't accidentally close every\n // parent menu. Additionally, we want to isolate things like the typeahead\n // keydowns from bubbling up to the parent menu and confounding things.\n event.preventDefault();\n\n if (keyCode === NavigableKey.LEFT || keyCode === NavigableKey.RIGHT) {\n // Prevent this from bubbling to parents\n event.stopPropagation();\n }\n\n await this.close();\n\n deactivateActiveItem(this.menu.items);\n this.item?.focus();\n this.item.tabIndex = 0;\n this.item.focus();\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should open\n * the submenu. This is RTL-aware. By default, left, right, space, or enter.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should open the submenu.\n */\n private isSubmenuOpenKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NavigableKey.LEFT : NavigableKey.RIGHT;\n switch (code) {\n case arrowEnterKey:\n case SelectionKey.SPACE:\n case SelectionKey.ENTER:\n return true;\n default:\n return false;\n }\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should close\n * the submenu. This is RTL-aware. By default right, left, or escape.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should close the submenu.\n */\n private isSubmenuCloseKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NavigableKey.RIGHT : NavigableKey.LEFT;\n switch (code) {\n case arrowEnterKey:\n case KeydownCloseKey.ESCAPE:\n return {close: true, keyCode: code} as const;\n default:\n return {close: false} as const;\n }\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"AAAA;;;;GAIG","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * Event properties used by the adapter and foundation.\n */\nexport interface MDCMenuItemEventDetail {\n index: number;\n}\n\n/**\n * Event properties specific to the default component implementation.\n */\nexport interface MDCMenuItemComponentEventDetail
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"AAAA;;;;GAIG","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * Event properties used by the adapter and foundation.\n */\nexport interface MDCMenuItemEventDetail {\n index: number;\n}\n\n/**\n * Event properties specific to the default component implementation.\n */\nexport interface MDCMenuItemComponentEventDetail\n extends MDCMenuItemEventDetail {\n item: Element;\n}\n\n// Note: CustomEvent<T> is not supported by Closure Compiler.\n\nexport interface MDCMenuItemEvent extends Event {\n readonly detail: MDCMenuItemEventDetail;\n}\n\nexport interface MDCMenuItemComponentEvent extends Event {\n readonly detail: MDCMenuItemComponentEventDetail;\n}\n"]}
|
package/package.json
CHANGED
|
@@ -43,7 +43,7 @@ $_indeterminate-duration: 2s;
|
|
|
43
43
|
position: relative;
|
|
44
44
|
// note, this matches the `meter` element and is just done so
|
|
45
45
|
// there's a default width.
|
|
46
|
-
width: 80px;
|
|
46
|
+
min-width: 80px;
|
|
47
47
|
height: var(--_track-height);
|
|
48
48
|
content-visibility: auto;
|
|
49
49
|
contain: strict;
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `:host{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 10);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;
|
|
7
|
+
export const styles = css `:host{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 10);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;width:var(--_size);height:var(--_size);position:relative;align-items:center;justify-content:center;contain:strict;content-visibility:auto}.progress{flex:1;align-self:stretch;margin:4px}.progress,.spinner,.left,.right,.circle,svg,.track,.active-track{position:absolute;inset:0}svg{transform:rotate(-90deg)}circle{cx:50%;cy:50%;r:calc(50%*(1 - var(--_active-indicator-width)/100));stroke-width:calc(var(--_active-indicator-width)*1%);stroke-dasharray:100;fill:rgba(0,0,0,0)}.active-track{transition:stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);stroke:var(--_active-indicator-color)}.track{stroke:rgba(0,0,0,0)}.progress.indeterminate{animation:linear infinite linear-rotate;animation-duration:1568.2352941176ms}.spinner{animation:infinite both rotate-arc;animation-duration:5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.left{overflow:hidden;inset:0 50% 0 0}.right{overflow:hidden;inset:0 0 0 50%}.circle{box-sizing:border-box;border-radius:50%;border:solid calc(var(--_active-indicator-width)/100*(var(--_size) - 8px));border-color:var(--_active-indicator-color) var(--_active-indicator-color) rgba(0,0,0,0) rgba(0,0,0,0);animation:expand-arc;animation-iteration-count:infinite;animation-fill-mode:both;animation-duration:1333ms,5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.four-color .circle{animation-name:expand-arc,four-color}.left .circle{rotate:135deg;inset:0 -100% 0 0}.right .circle{rotate:100deg;inset:0 0 0 -100%;animation-delay:-666.5ms,0ms}@media(forced-colors: active){.active-track{stroke:CanvasText}.circle{border-color:CanvasText CanvasText Canvas Canvas}}@keyframes expand-arc{0%{transform:rotate(265deg)}50%{transform:rotate(130deg)}100%{transform:rotate(265deg)}}@keyframes rotate-arc{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}100%{transform:rotate(1080deg)}}@keyframes linear-rotate{to{transform:rotate(360deg)}}@keyframes four-color{0%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}15%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}25%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}40%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}50%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}65%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}75%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}90%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}100%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}}/*# sourceMappingURL=circular-progress-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=circular-progress-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"circular-progress-styles.css.js","sourceRoot":"","sources":["circular-progress-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{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 10);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;
|
|
1
|
+
{"version":3,"file":"circular-progress-styles.css.js","sourceRoot":"","sources":["circular-progress-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{--_active-indicator-color: var(--md-circular-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-width: var(--md-circular-progress-active-indicator-width, 10);--_four-color-active-indicator-four-color: var(--md-circular-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-circular-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-circular-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-circular-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_size: var(--md-circular-progress-size, 48px);display:inline-flex;vertical-align:middle;width:var(--_size);height:var(--_size);position:relative;align-items:center;justify-content:center;contain:strict;content-visibility:auto}.progress{flex:1;align-self:stretch;margin:4px}.progress,.spinner,.left,.right,.circle,svg,.track,.active-track{position:absolute;inset:0}svg{transform:rotate(-90deg)}circle{cx:50%;cy:50%;r:calc(50%*(1 - var(--_active-indicator-width)/100));stroke-width:calc(var(--_active-indicator-width)*1%);stroke-dasharray:100;fill:rgba(0,0,0,0)}.active-track{transition:stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);stroke:var(--_active-indicator-color)}.track{stroke:rgba(0,0,0,0)}.progress.indeterminate{animation:linear infinite linear-rotate;animation-duration:1568.2352941176ms}.spinner{animation:infinite both rotate-arc;animation-duration:5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.left{overflow:hidden;inset:0 50% 0 0}.right{overflow:hidden;inset:0 0 0 50%}.circle{box-sizing:border-box;border-radius:50%;border:solid calc(var(--_active-indicator-width)/100*(var(--_size) - 8px));border-color:var(--_active-indicator-color) var(--_active-indicator-color) rgba(0,0,0,0) rgba(0,0,0,0);animation:expand-arc;animation-iteration-count:infinite;animation-fill-mode:both;animation-duration:1333ms,5332ms;animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.four-color .circle{animation-name:expand-arc,four-color}.left .circle{rotate:135deg;inset:0 -100% 0 0}.right .circle{rotate:100deg;inset:0 0 0 -100%;animation-delay:-666.5ms,0ms}@media(forced-colors: active){.active-track{stroke:CanvasText}.circle{border-color:CanvasText CanvasText Canvas Canvas}}@keyframes expand-arc{0%{transform:rotate(265deg)}50%{transform:rotate(130deg)}100%{transform:rotate(265deg)}}@keyframes rotate-arc{12.5%{transform:rotate(135deg)}25%{transform:rotate(270deg)}37.5%{transform:rotate(405deg)}50%{transform:rotate(540deg)}62.5%{transform:rotate(675deg)}75%{transform:rotate(810deg)}87.5%{transform:rotate(945deg)}100%{transform:rotate(1080deg)}}@keyframes linear-rotate{to{transform:rotate(360deg)}}@keyframes four-color{0%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}15%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}25%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}40%{border-top-color:var(--_four-color-active-indicator-two-color);border-right-color:var(--_four-color-active-indicator-two-color)}50%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}65%{border-top-color:var(--_four-color-active-indicator-three-color);border-right-color:var(--_four-color-active-indicator-three-color)}75%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}90%{border-top-color:var(--_four-color-active-indicator-four-color);border-right-color:var(--_four-color-active-indicator-four-color)}100%{border-top-color:var(--_four-color-active-indicator-one-color);border-right-color:var(--_four-color-active-indicator-one-color)}}/*# sourceMappingURL=circular-progress-styles.css.map */\n`;\n "]}
|
|
@@ -24,7 +24,9 @@ export class CircularProgress extends Progress {
|
|
|
24
24
|
return html `
|
|
25
25
|
<svg viewBox="0 0 4800 4800">
|
|
26
26
|
<circle class="track" pathLength="100"></circle>
|
|
27
|
-
<circle
|
|
27
|
+
<circle
|
|
28
|
+
class="active-track"
|
|
29
|
+
pathLength="100"
|
|
28
30
|
stroke-dashoffset=${dashOffset}></circle>
|
|
29
31
|
</svg>
|
|
30
32
|
`;
|
|
@@ -35,15 +37,14 @@ export class CircularProgress extends Progress {
|
|
|
35
37
|
// This approach has 4.5x the FPS of rendering via svg on Chrome 111.
|
|
36
38
|
// See https://lit.dev/playground/#gist=febb773565272f75408ab06a0eb49746.
|
|
37
39
|
renderIndeterminateContainer() {
|
|
38
|
-
return html `
|
|
39
|
-
<div class="
|
|
40
|
-
<div class="
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
<div class="
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
</div>`;
|
|
40
|
+
return html ` <div class="spinner">
|
|
41
|
+
<div class="left">
|
|
42
|
+
<div class="circle"></div>
|
|
43
|
+
</div>
|
|
44
|
+
<div class="right">
|
|
45
|
+
<div class="circle"></div>
|
|
46
|
+
</div>
|
|
47
|
+
</div>`;
|
|
47
48
|
}
|
|
48
49
|
}
|
|
49
50
|
//# sourceMappingURL=circular-progress.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["circular-progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAC;AAEvC;;GAEG;AACH,MAAM,OAAO,gBAAiB,SAAQ,QAAQ;IACzB,eAAe;QAChC,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,OAAO,IAAI,CAAC,4BAA4B,EAAE,CAAC;SAC5C;QAED,OAAO,IAAI,CAAC,0BAA0B,EAAE,CAAC;IAC3C,CAAC;IAED,sEAAsE;IACtE,yCAAyC;IACjC,0BAA0B;QAChC,MAAM,UAAU,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;QACrD,mEAAmE;QACnE,4EAA4E;QAC5E,OAAO,IAAI,CAAA
|
|
1
|
+
{"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["circular-progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAC;AAEvC;;GAEG;AACH,MAAM,OAAO,gBAAiB,SAAQ,QAAQ;IACzB,eAAe;QAChC,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,OAAO,IAAI,CAAC,4BAA4B,EAAE,CAAC;SAC5C;QAED,OAAO,IAAI,CAAC,0BAA0B,EAAE,CAAC;IAC3C,CAAC;IAED,sEAAsE;IACtE,yCAAyC;IACjC,0BAA0B;QAChC,MAAM,UAAU,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;QACrD,mEAAmE;QACnE,4EAA4E;QAC5E,OAAO,IAAI,CAAA;;;;;;8BAMe,UAAU;;KAEnC,CAAC;IACJ,CAAC;IAED,oEAAoE;IACpE,6EAA6E;IAC7E,uDAAuD;IACvD,qEAAqE;IACrE,yEAAyE;IACjE,4BAA4B;QAClC,OAAO,IAAI,CAAA;;;;;;;WAOJ,CAAC;IACV,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html} from 'lit';\n\nimport {Progress} from './progress.js';\n\n/**\n * A circular progress component.\n */\nexport class CircularProgress extends Progress {\n protected override renderIndicator() {\n if (this.indeterminate) {\n return this.renderIndeterminateContainer();\n }\n\n return this.renderDeterminateContainer();\n }\n\n // Determinate mode is rendered with an svg so the progress arc can be\n // easily animated via stroke-dashoffset.\n private renderDeterminateContainer() {\n const dashOffset = (1 - this.value / this.max) * 100;\n // note, dash-array/offset are relative to Setting `pathLength` but\n // Chrome seems to render this inaccurately and using a large viewbox helps.\n return html`\n <svg viewBox=\"0 0 4800 4800\">\n <circle class=\"track\" pathLength=\"100\"></circle>\n <circle\n class=\"active-track\"\n pathLength=\"100\"\n stroke-dashoffset=${dashOffset}></circle>\n </svg>\n `;\n }\n\n // Indeterminate mode rendered with 2 bordered-divs. The borders are\n // clipped into half circles by their containers. The divs are then carefully\n // animated to produce changes to the spinner arc size.\n // This approach has 4.5x the FPS of rendering via svg on Chrome 111.\n // See https://lit.dev/playground/#gist=febb773565272f75408ab06a0eb49746.\n private renderIndeterminateContainer() {\n return html` <div class=\"spinner\">\n <div class=\"left\">\n <div class=\"circle\"></div>\n </div>\n <div class=\"right\">\n <div class=\"circle\"></div>\n </div>\n </div>`;\n }\n}\n"]}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `:host{--_active-indicator-color: var(--md-linear-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-height: var(--md-linear-progress-active-indicator-height, 4px);--_four-color-active-indicator-four-color: var(--md-linear-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-linear-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-linear-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-linear-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_track-color: var(--md-linear-progress-track-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_track-height: var(--md-linear-progress-track-height, 4px);--_track-shape: var(--md-linear-progress-track-shape, 0px);border-radius:var(--_track-shape);display:flex;position:relative;width:80px;height:var(--_track-height);content-visibility:auto;contain:strict}.progress,.dots,.inactive-track,.bar,.bar-inner{position:absolute}.progress{direction:ltr;inset:0;border-radius:inherit;overflow:hidden;display:flex;align-items:center}.bar{animation:none;width:100%;height:var(--_active-indicator-height);transform-origin:left center;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1)}.secondary-bar{display:none}.bar-inner{inset:0;animation:none;background:var(--_active-indicator-color)}.inactive-track{background:var(--_track-color);inset:0;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1);transform-origin:left center}.dots{inset:0;animation:linear infinite 250ms;animation-name:buffering;background-color:var(--_track-color);background-repeat:repeat-x;-webkit-mask-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E");z-index:-1}.indeterminate .bar{transition:none}.indeterminate .primary-bar{inset-inline-start:-145.167%}.indeterminate .secondary-bar{inset-inline-start:-54.8889%;display:block}.indeterminate .dots{display:none}.indeterminate .primary-bar{animation:linear infinite 2s;animation-name:primary-indeterminate-translate}.indeterminate .primary-bar>.bar-inner{animation:linear infinite 2s primary-indeterminate-scale}.indeterminate.four-color .primary-bar>.bar-inner{animation-name:primary-indeterminate-scale,four-color;animation-duration:2s,4s}.indeterminate .secondary-bar{animation:linear infinite 2s;animation-name:secondary-indeterminate-translate}.indeterminate .secondary-bar>.bar-inner{animation:linear infinite 2s secondary-indeterminate-scale}.indeterminate.four-color .secondary-bar>.bar-inner{animation-name:secondary-indeterminate-scale,four-color;animation-duration:2s,4s}:host-context([dir=rtl]),:host([dir=rtl]){transform:scale(-1)}:host(:dir(rtl)){transform:scale(-1)}@keyframes primary-indeterminate-scale{0%{transform:scaleX(0.08)}36.65%{animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);transform:scaleX(0.08)}69.15%{animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);transform:scaleX(0.661479)}100%{transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);transform:scaleX(0.08)}19.15%{animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.00432);transform:scaleX(0.457104)}44.15%{animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);transform:scaleX(0.72796)}100%{transform:scaleX(0.08)}}@keyframes buffering{0%{transform:translateX(calc(var(--_track-height) / 2 * 5))}}@keyframes primary-indeterminate-translate{0%{transform:translateX(0px)}20%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(0px)}59.15%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(83.6714%)}100%{transform:translateX(200.611%)}}@keyframes secondary-indeterminate-translate{0%{animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);transform:translateX(0px)}25%{animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);transform:translateX(37.6519%)}48.35%{animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);transform:translateX(84.3862%)}100%{transform:translateX(160.278%)}}@keyframes four-color{0%{background:var(--_four-color-active-indicator-one-color)}15%{background:var(--_four-color-active-indicator-one-color)}25%{background:var(--_four-color-active-indicator-two-color)}40%{background:var(--_four-color-active-indicator-two-color)}50%{background:var(--_four-color-active-indicator-three-color)}65%{background:var(--_four-color-active-indicator-three-color)}75%{background:var(--_four-color-active-indicator-four-color)}90%{background:var(--_four-color-active-indicator-four-color)}100%{background:var(--_four-color-active-indicator-one-color)}}@media(forced-colors: active){:host{outline:1px solid CanvasText}.bar-inner,.dots{background-color:CanvasText}}/*# sourceMappingURL=linear-progress-styles.css.map */
|
|
7
|
+
export const styles = css `:host{--_active-indicator-color: var(--md-linear-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-height: var(--md-linear-progress-active-indicator-height, 4px);--_four-color-active-indicator-four-color: var(--md-linear-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-linear-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-linear-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-linear-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_track-color: var(--md-linear-progress-track-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_track-height: var(--md-linear-progress-track-height, 4px);--_track-shape: var(--md-linear-progress-track-shape, 0px);border-radius:var(--_track-shape);display:flex;position:relative;min-width:80px;height:var(--_track-height);content-visibility:auto;contain:strict}.progress,.dots,.inactive-track,.bar,.bar-inner{position:absolute}.progress{direction:ltr;inset:0;border-radius:inherit;overflow:hidden;display:flex;align-items:center}.bar{animation:none;width:100%;height:var(--_active-indicator-height);transform-origin:left center;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1)}.secondary-bar{display:none}.bar-inner{inset:0;animation:none;background:var(--_active-indicator-color)}.inactive-track{background:var(--_track-color);inset:0;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1);transform-origin:left center}.dots{inset:0;animation:linear infinite 250ms;animation-name:buffering;background-color:var(--_track-color);background-repeat:repeat-x;-webkit-mask-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E");z-index:-1}.indeterminate .bar{transition:none}.indeterminate .primary-bar{inset-inline-start:-145.167%}.indeterminate .secondary-bar{inset-inline-start:-54.8889%;display:block}.indeterminate .dots{display:none}.indeterminate .primary-bar{animation:linear infinite 2s;animation-name:primary-indeterminate-translate}.indeterminate .primary-bar>.bar-inner{animation:linear infinite 2s primary-indeterminate-scale}.indeterminate.four-color .primary-bar>.bar-inner{animation-name:primary-indeterminate-scale,four-color;animation-duration:2s,4s}.indeterminate .secondary-bar{animation:linear infinite 2s;animation-name:secondary-indeterminate-translate}.indeterminate .secondary-bar>.bar-inner{animation:linear infinite 2s secondary-indeterminate-scale}.indeterminate.four-color .secondary-bar>.bar-inner{animation-name:secondary-indeterminate-scale,four-color;animation-duration:2s,4s}:host-context([dir=rtl]),:host([dir=rtl]){transform:scale(-1)}:host(:dir(rtl)){transform:scale(-1)}@keyframes primary-indeterminate-scale{0%{transform:scaleX(0.08)}36.65%{animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);transform:scaleX(0.08)}69.15%{animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);transform:scaleX(0.661479)}100%{transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);transform:scaleX(0.08)}19.15%{animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.00432);transform:scaleX(0.457104)}44.15%{animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);transform:scaleX(0.72796)}100%{transform:scaleX(0.08)}}@keyframes buffering{0%{transform:translateX(calc(var(--_track-height) / 2 * 5))}}@keyframes primary-indeterminate-translate{0%{transform:translateX(0px)}20%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(0px)}59.15%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(83.6714%)}100%{transform:translateX(200.611%)}}@keyframes secondary-indeterminate-translate{0%{animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);transform:translateX(0px)}25%{animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);transform:translateX(37.6519%)}48.35%{animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);transform:translateX(84.3862%)}100%{transform:translateX(160.278%)}}@keyframes four-color{0%{background:var(--_four-color-active-indicator-one-color)}15%{background:var(--_four-color-active-indicator-one-color)}25%{background:var(--_four-color-active-indicator-two-color)}40%{background:var(--_four-color-active-indicator-two-color)}50%{background:var(--_four-color-active-indicator-three-color)}65%{background:var(--_four-color-active-indicator-three-color)}75%{background:var(--_four-color-active-indicator-four-color)}90%{background:var(--_four-color-active-indicator-four-color)}100%{background:var(--_four-color-active-indicator-one-color)}}@media(forced-colors: active){:host{outline:1px solid CanvasText}.bar-inner,.dots{background-color:CanvasText}}/*# sourceMappingURL=linear-progress-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=linear-progress-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"linear-progress-styles.css.js","sourceRoot":"","sources":["linear-progress-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{--_active-indicator-color: var(--md-linear-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-height: var(--md-linear-progress-active-indicator-height, 4px);--_four-color-active-indicator-four-color: var(--md-linear-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-linear-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-linear-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-linear-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_track-color: var(--md-linear-progress-track-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_track-height: var(--md-linear-progress-track-height, 4px);--_track-shape: var(--md-linear-progress-track-shape, 0px);border-radius:var(--_track-shape);display:flex;position:relative;width:80px;height:var(--_track-height);content-visibility:auto;contain:strict}.progress,.dots,.inactive-track,.bar,.bar-inner{position:absolute}.progress{direction:ltr;inset:0;border-radius:inherit;overflow:hidden;display:flex;align-items:center}.bar{animation:none;width:100%;height:var(--_active-indicator-height);transform-origin:left center;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1)}.secondary-bar{display:none}.bar-inner{inset:0;animation:none;background:var(--_active-indicator-color)}.inactive-track{background:var(--_track-color);inset:0;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1);transform-origin:left center}.dots{inset:0;animation:linear infinite 250ms;animation-name:buffering;background-color:var(--_track-color);background-repeat:repeat-x;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E\");z-index:-1}.indeterminate .bar{transition:none}.indeterminate .primary-bar{inset-inline-start:-145.167%}.indeterminate .secondary-bar{inset-inline-start:-54.8889%;display:block}.indeterminate .dots{display:none}.indeterminate .primary-bar{animation:linear infinite 2s;animation-name:primary-indeterminate-translate}.indeterminate .primary-bar>.bar-inner{animation:linear infinite 2s primary-indeterminate-scale}.indeterminate.four-color .primary-bar>.bar-inner{animation-name:primary-indeterminate-scale,four-color;animation-duration:2s,4s}.indeterminate .secondary-bar{animation:linear infinite 2s;animation-name:secondary-indeterminate-translate}.indeterminate .secondary-bar>.bar-inner{animation:linear infinite 2s secondary-indeterminate-scale}.indeterminate.four-color .secondary-bar>.bar-inner{animation-name:secondary-indeterminate-scale,four-color;animation-duration:2s,4s}:host-context([dir=rtl]),:host([dir=rtl]){transform:scale(-1)}:host(:dir(rtl)){transform:scale(-1)}@keyframes primary-indeterminate-scale{0%{transform:scaleX(0.08)}36.65%{animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);transform:scaleX(0.08)}69.15%{animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);transform:scaleX(0.661479)}100%{transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);transform:scaleX(0.08)}19.15%{animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.00432);transform:scaleX(0.457104)}44.15%{animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);transform:scaleX(0.72796)}100%{transform:scaleX(0.08)}}@keyframes buffering{0%{transform:translateX(calc(var(--_track-height) / 2 * 5))}}@keyframes primary-indeterminate-translate{0%{transform:translateX(0px)}20%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(0px)}59.15%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(83.6714%)}100%{transform:translateX(200.611%)}}@keyframes secondary-indeterminate-translate{0%{animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);transform:translateX(0px)}25%{animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);transform:translateX(37.6519%)}48.35%{animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);transform:translateX(84.3862%)}100%{transform:translateX(160.278%)}}@keyframes four-color{0%{background:var(--_four-color-active-indicator-one-color)}15%{background:var(--_four-color-active-indicator-one-color)}25%{background:var(--_four-color-active-indicator-two-color)}40%{background:var(--_four-color-active-indicator-two-color)}50%{background:var(--_four-color-active-indicator-three-color)}65%{background:var(--_four-color-active-indicator-three-color)}75%{background:var(--_four-color-active-indicator-four-color)}90%{background:var(--_four-color-active-indicator-four-color)}100%{background:var(--_four-color-active-indicator-one-color)}}@media(forced-colors: active){:host{outline:1px solid CanvasText}.bar-inner,.dots{background-color:CanvasText}}/*# sourceMappingURL=linear-progress-styles.css.map */\n`;\n "]}
|
|
1
|
+
{"version":3,"file":"linear-progress-styles.css.js","sourceRoot":"","sources":["linear-progress-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{--_active-indicator-color: var(--md-linear-progress-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_active-indicator-height: var(--md-linear-progress-active-indicator-height, 4px);--_four-color-active-indicator-four-color: var(--md-linear-progress-four-color-active-indicator-four-color, var(--md-sys-color-tertiary-container, #ffd8e4));--_four-color-active-indicator-one-color: var(--md-linear-progress-four-color-active-indicator-one-color, var(--md-sys-color-primary, #6750a4));--_four-color-active-indicator-three-color: var(--md-linear-progress-four-color-active-indicator-three-color, var(--md-sys-color-tertiary, #7d5260));--_four-color-active-indicator-two-color: var(--md-linear-progress-four-color-active-indicator-two-color, var(--md-sys-color-primary-container, #eaddff));--_track-color: var(--md-linear-progress-track-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_track-height: var(--md-linear-progress-track-height, 4px);--_track-shape: var(--md-linear-progress-track-shape, 0px);border-radius:var(--_track-shape);display:flex;position:relative;min-width:80px;height:var(--_track-height);content-visibility:auto;contain:strict}.progress,.dots,.inactive-track,.bar,.bar-inner{position:absolute}.progress{direction:ltr;inset:0;border-radius:inherit;overflow:hidden;display:flex;align-items:center}.bar{animation:none;width:100%;height:var(--_active-indicator-height);transform-origin:left center;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1)}.secondary-bar{display:none}.bar-inner{inset:0;animation:none;background:var(--_active-indicator-color)}.inactive-track{background:var(--_track-color);inset:0;transition:transform 250ms cubic-bezier(0.4, 0, 0.6, 1);transform-origin:left center}.dots{inset:0;animation:linear infinite 250ms;animation-name:buffering;background-color:var(--_track-color);background-repeat:repeat-x;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 2' preserveAspectRatio='xMinYMin slice'%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3C/svg%3E\");z-index:-1}.indeterminate .bar{transition:none}.indeterminate .primary-bar{inset-inline-start:-145.167%}.indeterminate .secondary-bar{inset-inline-start:-54.8889%;display:block}.indeterminate .dots{display:none}.indeterminate .primary-bar{animation:linear infinite 2s;animation-name:primary-indeterminate-translate}.indeterminate .primary-bar>.bar-inner{animation:linear infinite 2s primary-indeterminate-scale}.indeterminate.four-color .primary-bar>.bar-inner{animation-name:primary-indeterminate-scale,four-color;animation-duration:2s,4s}.indeterminate .secondary-bar{animation:linear infinite 2s;animation-name:secondary-indeterminate-translate}.indeterminate .secondary-bar>.bar-inner{animation:linear infinite 2s secondary-indeterminate-scale}.indeterminate.four-color .secondary-bar>.bar-inner{animation-name:secondary-indeterminate-scale,four-color;animation-duration:2s,4s}:host-context([dir=rtl]),:host([dir=rtl]){transform:scale(-1)}:host(:dir(rtl)){transform:scale(-1)}@keyframes primary-indeterminate-scale{0%{transform:scaleX(0.08)}36.65%{animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);transform:scaleX(0.08)}69.15%{animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);transform:scaleX(0.661479)}100%{transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);transform:scaleX(0.08)}19.15%{animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.00432);transform:scaleX(0.457104)}44.15%{animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);transform:scaleX(0.72796)}100%{transform:scaleX(0.08)}}@keyframes buffering{0%{transform:translateX(calc(var(--_track-height) / 2 * 5))}}@keyframes primary-indeterminate-translate{0%{transform:translateX(0px)}20%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(0px)}59.15%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(83.6714%)}100%{transform:translateX(200.611%)}}@keyframes secondary-indeterminate-translate{0%{animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);transform:translateX(0px)}25%{animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);transform:translateX(37.6519%)}48.35%{animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);transform:translateX(84.3862%)}100%{transform:translateX(160.278%)}}@keyframes four-color{0%{background:var(--_four-color-active-indicator-one-color)}15%{background:var(--_four-color-active-indicator-one-color)}25%{background:var(--_four-color-active-indicator-two-color)}40%{background:var(--_four-color-active-indicator-two-color)}50%{background:var(--_four-color-active-indicator-three-color)}65%{background:var(--_four-color-active-indicator-three-color)}75%{background:var(--_four-color-active-indicator-four-color)}90%{background:var(--_four-color-active-indicator-four-color)}100%{background:var(--_four-color-active-indicator-one-color)}}@media(forced-colors: active){:host{outline:1px solid CanvasText}.bar-inner,.dots{background-color:CanvasText}}/*# sourceMappingURL=linear-progress-styles.css.map */\n`;\n "]}
|
|
@@ -9,7 +9,7 @@ import { Progress } from './progress.js';
|
|
|
9
9
|
*/
|
|
10
10
|
export declare class LinearProgress extends Progress {
|
|
11
11
|
/**
|
|
12
|
-
* Buffer amount to display, a fraction between 0 and
|
|
12
|
+
* Buffer amount to display, a fraction between 0 and `max`.
|
|
13
13
|
*/
|
|
14
14
|
buffer: number;
|
|
15
15
|
protected renderIndicator(): import("lit-html").TemplateResult<1>;
|
|
@@ -15,7 +15,7 @@ export class LinearProgress extends Progress {
|
|
|
15
15
|
constructor() {
|
|
16
16
|
super(...arguments);
|
|
17
17
|
/**
|
|
18
|
-
* Buffer amount to display, a fraction between 0 and
|
|
18
|
+
* Buffer amount to display, a fraction between 0 and `max`.
|
|
19
19
|
*/
|
|
20
20
|
this.buffer = 1;
|
|
21
21
|
}
|
|
@@ -24,10 +24,10 @@ export class LinearProgress extends Progress {
|
|
|
24
24
|
// due to a now fixed Chrome bug: crbug.com/389359.
|
|
25
25
|
renderIndicator() {
|
|
26
26
|
const progressStyles = {
|
|
27
|
-
transform: `scaleX(${(this.indeterminate ? 1 : this.value / this.max) * 100}%)
|
|
27
|
+
transform: `scaleX(${(this.indeterminate ? 1 : this.value / this.max) * 100}%)`,
|
|
28
28
|
};
|
|
29
29
|
const dotStyles = {
|
|
30
|
-
transform: `scaleX(${(this.indeterminate ? 1 : this.buffer / this.max) * 100}%)
|
|
30
|
+
transform: `scaleX(${(this.indeterminate ? 1 : this.buffer / this.max) * 100}%)`,
|
|
31
31
|
};
|
|
32
32
|
return html `
|
|
33
33
|
<div class="dots"></div>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"linear-progress.js","sourceRoot":"","sources":["linear-progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAC;AAEvC;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,QAAQ;IAA5C;;QACE;;WAEG;QACuB,WAAM,GAAG,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"linear-progress.js","sourceRoot":"","sources":["linear-progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAC;AAEvC;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,QAAQ;IAA5C;;QACE;;WAEG;QACuB,WAAM,GAAG,CAAC,CAAC;IA4BvC,CAAC;IA1BC,mEAAmE;IACnE,8EAA8E;IAC9E,mDAAmD;IAChC,eAAe;QAChC,MAAM,cAAc,GAAG;YACrB,SAAS,EAAE,UACT,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,GACrD,IAAI;SACL,CAAC;QACF,MAAM,SAAS,GAAG;YAChB,SAAS,EAAE,UACT,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,GACtD,IAAI;SACL,CAAC;QAEF,OAAO,IAAI,CAAA;;0CAE2B,QAAQ,CAAC,SAAS,CAAC;2CAClB,QAAQ,CAAC,cAAc,CAAC;;;;;;KAM9D,CAAC;IACJ,CAAC;CACF;AA5B2B;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;8CAAY","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {styleMap} from 'lit/directives/style-map.js';\n\nimport {Progress} from './progress.js';\n\n/**\n * A linear progress component.\n */\nexport class LinearProgress extends Progress {\n /**\n * Buffer amount to display, a fraction between 0 and `max`.\n */\n @property({type: Number}) buffer = 1;\n\n // Note, the indeterminate animation is rendered with transform %'s\n // Previously, this was optimized to use px calculated with the resizeObserver\n // due to a now fixed Chrome bug: crbug.com/389359.\n protected override renderIndicator() {\n const progressStyles = {\n transform: `scaleX(${\n (this.indeterminate ? 1 : this.value / this.max) * 100\n }%)`,\n };\n const dotStyles = {\n transform: `scaleX(${\n (this.indeterminate ? 1 : this.buffer / this.max) * 100\n }%)`,\n };\n\n return html`\n <div class=\"dots\"></div>\n <div class=\"inactive-track\" style=${styleMap(dotStyles)}></div>\n <div class=\"bar primary-bar\" style=${styleMap(progressStyles)}>\n <div class=\"bar-inner\"></div>\n </div>\n <div class=\"bar secondary-bar\">\n <div class=\"bar-inner\"></div>\n </div>\n `;\n }\n}\n"]}
|
|
@@ -36,13 +36,15 @@ export class Progress extends LitElement {
|
|
|
36
36
|
// Needed for closure conformance
|
|
37
37
|
const { ariaLabel } = this;
|
|
38
38
|
return html `
|
|
39
|
-
<div
|
|
39
|
+
<div
|
|
40
|
+
class="progress ${classMap(this.getRenderClasses())}"
|
|
40
41
|
role="progressbar"
|
|
41
42
|
aria-label="${ariaLabel || nothing}"
|
|
42
43
|
aria-valuemin="0"
|
|
43
44
|
aria-valuemax=${this.max}
|
|
44
45
|
aria-valuenow=${this.indeterminate ? nothing : this.value}
|
|
45
|
-
|
|
46
|
+
>${this.renderIndicator()}</div
|
|
47
|
+
>
|
|
46
48
|
`;
|
|
47
49
|
}
|
|
48
50
|
getRenderClasses() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress.js","sourceRoot":"","sources":["progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAiB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAGrD,OAAO,EAAC,yBAAyB,EAAC,MAAM,iCAAiC,CAAC;AAE1E;;GAEG;AACH,MAAM,OAAgB,QAAS,SAAQ,UAAU;IAAjD;;QAKE;;WAEG;QACuB,UAAK,GAAG,CAAC,CAAC;QAEpC;;WAEG;QACuB,QAAG,GAAG,CAAC,CAAC;QAElC;;;WAGG;QACwB,kBAAa,GAAG,KAAK,CAAC;QAEjD;;WAEG;QACiD,cAAS,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"progress.js","sourceRoot":"","sources":["progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAiB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAGrD,OAAO,EAAC,yBAAyB,EAAC,MAAM,iCAAiC,CAAC;AAE1E;;GAEG;AACH,MAAM,OAAgB,QAAS,SAAQ,UAAU;IAAjD;;QAKE;;WAEG;QACuB,UAAK,GAAG,CAAC,CAAC;QAEpC;;WAEG;QACuB,QAAG,GAAG,CAAC,CAAC;QAElC;;;WAGG;QACwB,kBAAa,GAAG,KAAK,CAAC;QAEjD;;WAEG;QACiD,cAAS,GAAG,KAAK,CAAC;IA0BxE,CAAC;IAxBoB,MAAM;QACvB,iCAAiC;QACjC,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,IAAI,CAAA;;0BAEW,QAAQ,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC;;sBAErC,SAAS,IAAI,OAAO;;wBAElB,IAAI,CAAC,GAAG;wBACR,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK;WACtD,IAAI,CAAC,eAAe,EAAE;;KAE5B,CAAC;IACJ,CAAC;IAES,gBAAgB;QACxB,OAAO;YACL,eAAe,EAAE,IAAI,CAAC,aAAa;YACnC,YAAY,EAAE,IAAI,CAAC,SAAS;SAC7B,CAAC;IACJ,CAAC;CAGF;AAjDC;IACE,yBAAyB,CAAC,QAAQ,CAAC,CAAC;AACtC,CAAC,GAAA,CAAA;AAKyB;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;uCAAW;AAKV;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;qCAAS;AAMP;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;+CAAuB;AAKG;IAAnD,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAC,CAAC;2CAAmB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, LitElement, nothing, TemplateResult} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\nimport {requestUpdateOnAriaChange} from '../../internal/aria/delegate.js';\n\n/**\n * A progress component.\n */\nexport abstract class Progress extends LitElement {\n static {\n requestUpdateOnAriaChange(Progress);\n }\n\n /**\n * Progress to display, a fraction between 0 and `max`.\n */\n @property({type: Number}) value = 0;\n\n /**\n * Maximum progress to display, defaults to 1.\n */\n @property({type: Number}) max = 1;\n\n /**\n * Whether or not to display indeterminate progress, which gives no indication\n * to how long an activity will take.\n */\n @property({type: Boolean}) indeterminate = false;\n\n /**\n * Whether or not to render indeterminate mode using 4 colors instead of one.\n */\n @property({type: Boolean, attribute: 'four-color'}) fourColor = false;\n\n protected override render() {\n // Needed for closure conformance\n const {ariaLabel} = this as ARIAMixinStrict;\n return html`\n <div\n class=\"progress ${classMap(this.getRenderClasses())}\"\n role=\"progressbar\"\n aria-label=\"${ariaLabel || nothing}\"\n aria-valuemin=\"0\"\n aria-valuemax=${this.max}\n aria-valuenow=${this.indeterminate ? nothing : this.value}\n >${this.renderIndicator()}</div\n >\n `;\n }\n\n protected getRenderClasses() {\n return {\n 'indeterminate': this.indeterminate,\n 'four-color': this.fourColor,\n };\n }\n\n protected abstract renderIndicator(): TemplateResult;\n}\n"]}
|
|
@@ -6,18 +6,18 @@
|
|
|
6
6
|
import '../../focus/md-focus-ring.js';
|
|
7
7
|
import '../../ripple/ripple.js';
|
|
8
8
|
import { LitElement } from 'lit';
|
|
9
|
+
import { getFormState, getFormValue } from '../../labs/behaviors/form-associated.js';
|
|
9
10
|
declare const CHECKED: unique symbol;
|
|
11
|
+
declare const radioBaseClass: import("../../labs/behaviors/mixin.js").MixinReturn<(abstract new (...args: any[]) => import("../../labs/behaviors/element-internals.js").WithElementInternals) & (abstract new (...args: any[]) => import("../../labs/behaviors/focusable.js").Focusable) & typeof LitElement & import("../../labs/behaviors/form-associated.js").FormAssociatedConstructor, import("../../labs/behaviors/form-associated.js").FormAssociated>;
|
|
10
12
|
/**
|
|
11
13
|
* A radio component.
|
|
12
14
|
*
|
|
13
|
-
* @fires input Dispatched when the value changes from user
|
|
14
|
-
* --bubbles
|
|
15
|
-
* @fires change Dispatched when the value changes from user
|
|
16
|
-
* --bubbles --composed
|
|
15
|
+
* @fires input {InputEvent} Dispatched when the value changes from user
|
|
16
|
+
* interaction. --bubbles
|
|
17
|
+
* @fires change {Event} Dispatched when the value changes from user
|
|
18
|
+
* interaction. --bubbles --composed
|
|
17
19
|
*/
|
|
18
|
-
export declare class Radio extends
|
|
19
|
-
/** @nocollapse */
|
|
20
|
-
static readonly formAssociated = true;
|
|
20
|
+
export declare class Radio extends radioBaseClass {
|
|
21
21
|
private readonly maskId;
|
|
22
22
|
/**
|
|
23
23
|
* Whether or not the radio is selected.
|
|
@@ -25,37 +25,21 @@ export declare class Radio extends LitElement {
|
|
|
25
25
|
get checked(): boolean;
|
|
26
26
|
set checked(checked: boolean);
|
|
27
27
|
[CHECKED]: boolean;
|
|
28
|
-
/**
|
|
29
|
-
* Whether or not the radio is disabled.
|
|
30
|
-
*/
|
|
31
|
-
disabled: boolean;
|
|
32
28
|
/**
|
|
33
29
|
* The element value to use in form submission when checked.
|
|
34
30
|
*/
|
|
35
31
|
value: string;
|
|
36
|
-
/**
|
|
37
|
-
* The HTML name to use in form submission.
|
|
38
|
-
*/
|
|
39
|
-
get name(): string;
|
|
40
|
-
set name(name: string);
|
|
41
|
-
/**
|
|
42
|
-
* The associated form element with which this element's value will submit.
|
|
43
|
-
*/
|
|
44
|
-
get form(): HTMLFormElement;
|
|
45
|
-
/**
|
|
46
|
-
* The labels this element is associated with.
|
|
47
|
-
*/
|
|
48
|
-
get labels(): NodeList;
|
|
49
32
|
private readonly selectionController;
|
|
50
|
-
private readonly internals;
|
|
51
33
|
constructor();
|
|
52
34
|
protected render(): import("lit-html").TemplateResult<1>;
|
|
53
35
|
protected updated(): void;
|
|
54
36
|
private handleClick;
|
|
55
37
|
private handleKeydown;
|
|
56
|
-
|
|
38
|
+
disabled: boolean;
|
|
39
|
+
name: string;
|
|
40
|
+
[getFormValue](): string;
|
|
41
|
+
[getFormState](): string;
|
|
57
42
|
formResetCallback(): void;
|
|
58
|
-
/** @private */
|
|
59
43
|
formStateRestoreCallback(state: string): void;
|
|
60
44
|
}
|
|
61
45
|
export {};
|