@material/web 1.0.0 → 1.0.2-nightly.33c1afe.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.scss +6 -0
- package/checkbox/internal/checkbox-styles.css.js +1 -1
- package/checkbox/internal/checkbox-styles.css.js.map +1 -1
- package/checkbox/internal/checkbox.d.ts +20 -87
- package/checkbox/internal/checkbox.js +35 -153
- 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/_shared.scss +1 -0
- 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/shared-styles.css.js +1 -1
- package/chips/internal/shared-styles.css.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.scss +4 -0
- package/fab/internal/_shared.scss +1 -0
- package/fab/internal/fab-styles.css.js +1 -1
- package/fab/internal/fab-styles.css.js.map +1 -1
- package/fab/internal/fab.js.map +1 -1
- package/fab/internal/shared-styles.css.js +1 -1
- package/fab/internal/shared-styles.css.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 -135
- package/field/internal/_label.scss +83 -72
- package/field/internal/_outlined-field.scss +276 -261
- 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/constraint-validation.d.ts +133 -0
- package/labs/behaviors/constraint-validation.js +114 -0
- package/labs/behaviors/constraint-validation.js.map +1 -0
- package/labs/behaviors/element-internals.d.ts +45 -0
- package/labs/behaviors/element-internals.js +50 -0
- package/labs/behaviors/element-internals.js.map +1 -0
- package/labs/behaviors/focusable.d.ts +39 -0
- package/labs/behaviors/focusable.js +82 -0
- package/labs/behaviors/focusable.js.map +1 -0
- package/labs/behaviors/form-associated.d.ts +199 -0
- package/labs/behaviors/form-associated.js +155 -0
- package/labs/behaviors/form-associated.js.map +1 -0
- package/labs/behaviors/mixin.d.ts +54 -0
- package/labs/behaviors/mixin.js +7 -0
- package/labs/behaviors/mixin.js.map +1 -0
- package/labs/behaviors/on-report-validity.d.ts +70 -0
- package/labs/behaviors/on-report-validity.js +150 -0
- package/labs/behaviors/on-report-validity.js.map +1 -0
- package/labs/behaviors/validators/checkbox-validator.d.ts +31 -0
- package/labs/behaviors/validators/checkbox-validator.js +29 -0
- package/labs/behaviors/validators/checkbox-validator.js.map +1 -0
- package/labs/behaviors/validators/select-validator.d.ts +31 -0
- package/labs/behaviors/validators/select-validator.js +30 -0
- package/labs/behaviors/validators/select-validator.js.map +1 -0
- package/labs/behaviors/validators/validator.d.ts +92 -0
- package/labs/behaviors/validators/validator.js +83 -0
- package/labs/behaviors/validators/validator.js.map +1 -0
- package/labs/card/_elevated-card.scss +6 -0
- package/labs/card/_filled-card.scss +6 -0
- package/labs/card/_outlined-card.scss +6 -0
- package/labs/card/elevated-card.d.ts +18 -0
- package/labs/card/elevated-card.js +21 -0
- package/labs/card/elevated-card.js.map +1 -0
- package/labs/card/filled-card.d.ts +18 -0
- package/labs/card/filled-card.js +21 -0
- package/labs/card/filled-card.js.map +1 -0
- package/labs/card/internal/_elevated-card.scss +35 -0
- package/labs/card/internal/_filled-card.scss +35 -0
- package/labs/card/internal/_outlined-card.scss +39 -0
- package/labs/card/internal/_shared.scss +40 -0
- package/labs/card/internal/card.d.ts +13 -0
- package/labs/card/internal/card.js +20 -0
- package/labs/card/internal/card.js.map +1 -0
- package/labs/card/internal/elevated-styles.css.js +9 -0
- package/labs/card/internal/elevated-styles.css.js.map +1 -0
- package/labs/card/internal/elevated-styles.scss +10 -0
- package/labs/card/internal/filled-styles.css.js +9 -0
- package/labs/card/internal/filled-styles.css.js.map +1 -0
- package/labs/card/internal/filled-styles.scss +10 -0
- package/labs/card/internal/outlined-styles.css.js +9 -0
- package/labs/card/internal/outlined-styles.css.js.map +1 -0
- package/labs/card/internal/outlined-styles.scss +10 -0
- package/labs/card/internal/shared-styles.css.js +9 -0
- package/labs/card/internal/shared-styles.css.js.map +1 -0
- package/labs/card/internal/shared-styles.scss +10 -0
- package/labs/card/outlined-card.d.ts +18 -0
- package/labs/card/outlined-card.js +21 -0
- package/labs/card/outlined-card.js.map +1 -0
- package/labs/item/internal/_item.scss +1 -1
- package/labs/item/internal/item-styles.css.js +1 -1
- package/labs/item/internal/item-styles.css.js.map +1 -1
- 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/_shared.scss +1 -0
- 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/segmentedbutton/internal/shared-styles.css.js +1 -1
- package/labs/segmentedbutton/internal/shared-styles.css.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 +3 -2
- 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/_list-item.scss +19 -0
- package/list/internal/listitem/harness.d.ts +3 -3
- package/list/internal/listitem/harness.js.map +1 -1
- package/list/internal/listitem/list-item-styles.css.js +1 -1
- package/list/internal/listitem/list-item-styles.css.js.map +1 -1
- package/list/internal/listitem/list-item.d.ts +3 -2
- package/list/internal/listitem/list-item.js +20 -21
- package/list/internal/listitem/list-item.js.map +1 -1
- package/list/list-item.d.ts +4 -12
- package/list/list-item.js +5 -14
- package/list/list-item.js.map +1 -1
- package/menu/harness.js.map +1 -1
- package/menu/internal/_menu.scss +20 -1
- package/menu/internal/controllers/menuItemController.d.ts +7 -0
- package/menu/internal/controllers/menuItemController.js +17 -4
- package/menu/internal/controllers/menuItemController.js.map +1 -1
- package/menu/internal/controllers/shared.d.ts +9 -1
- package/menu/internal/controllers/shared.js +4 -4
- package/menu/internal/controllers/shared.js.map +1 -1
- package/menu/internal/controllers/surfacePositionController.d.ts +16 -2
- package/menu/internal/controllers/surfacePositionController.js +134 -56
- 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 +55 -17
- package/menu/internal/menu.js +175 -88
- package/menu/internal/menu.js.map +1 -1
- package/menu/internal/menuitem/_menu-item.scss +24 -0
- package/menu/internal/menuitem/harness.d.ts +3 -1
- package/menu/internal/menuitem/harness.js.map +1 -1
- package/menu/internal/menuitem/menu-item-styles.css.js +1 -1
- package/menu/internal/menuitem/menu-item-styles.css.js.map +1 -1
- package/menu/internal/menuitem/menu-item.d.ts +3 -2
- package/menu/internal/menuitem/menu-item.js +20 -20
- package/menu/internal/menuitem/menu-item.js.map +1 -1
- package/menu/internal/submenu/sub-menu.d.ts +9 -8
- package/menu/internal/submenu/sub-menu.js +35 -22
- package/menu/internal/submenu/sub-menu.js.map +1 -1
- package/menu/internal/types.js.map +1 -1
- package/menu/menu-item.js +1 -2
- package/menu/menu-item.js.map +1 -1
- package/menu/menu.js +1 -2
- package/menu/menu.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.scss +144 -123
- package/radio/internal/radio-styles.css.js +1 -1
- package/radio/internal/radio-styles.css.js.map +1 -1
- package/radio/internal/radio.d.ts +12 -23
- package/radio/internal/radio.js +31 -50
- 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/radio/radio.js +1 -2
- package/radio/radio.js.map +1 -1
- package/ripple/internal/ripple.js +21 -18
- 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/_shared.scss +4 -0
- package/select/internal/select.d.ts +26 -99
- package/select/internal/select.js +78 -187
- 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 +25 -23
- 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/internal/shared-styles.css.js +1 -1
- package/select/internal/shared-styles.css.js.map +1 -1
- package/select/outlined-select.js +1 -2
- package/select/outlined-select.js.map +1 -1
- package/select/select-option.js +1 -2
- package/select/select-option.js.map +1 -1
- package/slider/harness.js +5 -5
- package/slider/harness.js.map +1 -1
- package/slider/internal/_slider.scss +68 -30
- package/slider/internal/slider-styles.css.js +1 -1
- package/slider/internal/slider-styles.css.js.map +1 -1
- package/slider/internal/slider.d.ts +16 -25
- package/slider/internal/slider.js +111 -115
- package/slider/internal/slider.js.map +1 -1
- package/switch/internal/_handle.scss +159 -141
- package/switch/internal/_icon.scss +95 -72
- package/switch/internal/_switch.scss +90 -95
- package/switch/internal/_track.scss +110 -77
- package/switch/internal/switch-styles.css.js +1 -1
- package/switch/internal/switch-styles.css.js.map +1 -1
- package/switch/internal/switch.d.ts +13 -89
- package/switch/internal/switch.js +32 -159
- package/switch/internal/switch.js.map +1 -1
- package/switch/switch.js +1 -2
- package/switch/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 +10 -5
- package/tabs/internal/tab.js +43 -22
- package/tabs/internal/tab.js.map +1 -1
- package/tabs/internal/tabs.d.ts +7 -4
- package/tabs/internal/tabs.js +23 -22
- 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 +33 -18
- package/textfield/internal/text-field.js +96 -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/list/internal/listitem/forced-colors-styles.css.js +0 -9
- package/list/internal/listitem/forced-colors-styles.css.js.map +0 -1
- package/list/internal/listitem/forced-colors-styles.scss +0 -19
- package/menu/internal/forced-colors-styles.css.js +0 -9
- package/menu/internal/forced-colors-styles.css.js.map +0 -1
- package/menu/internal/forced-colors-styles.scss +0 -12
- package/menu/internal/menuitem/forced-colors-styles.css.js +0 -9
- package/menu/internal/menuitem/forced-colors-styles.css.js.map +0 -1
- package/menu/internal/menuitem/forced-colors-styles.scss +0 -26
- package/radio/internal/forced-colors-styles.css.js +0 -9
- package/radio/internal/forced-colors-styles.css.js.map +0 -1
- package/radio/internal/forced-colors-styles.scss +0 -29
- package/select/internal/filled-forced-colors-styles.css.d.ts +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.d.ts +0 -1
- 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/switch/internal/forced-colors-styles.css.d.ts +0 -1
- package/switch/internal/forced-colors-styles.css.js +0 -9
- package/switch/internal/forced-colors-styles.css.js.map +0 -1
- package/switch/internal/forced-colors-styles.scss +0 -42
- package/textfield/internal/filled-forced-colors-styles.css.d.ts +0 -1
- 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.d.ts +0 -1
- 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/{list/internal/listitem/forced-colors-styles.css.d.ts → labs/card/internal/elevated-styles.css.d.ts} +0 -0
- /package/{menu/internal/forced-colors-styles.css.d.ts → labs/card/internal/filled-styles.css.d.ts} +0 -0
- /package/{menu/internal/menuitem/forced-colors-styles.css.d.ts → labs/card/internal/outlined-styles.css.d.ts} +0 -0
- /package/{radio/internal/forced-colors-styles.css.d.ts → labs/card/internal/shared-styles.css.d.ts} +0 -0
|
@@ -6,26 +6,32 @@
|
|
|
6
6
|
import '../../focus/md-focus-ring.js';
|
|
7
7
|
import '../../ripple/ripple.js';
|
|
8
8
|
import { LitElement, PropertyValues } from 'lit';
|
|
9
|
+
import { createValidator, getValidityAnchor } from '../../labs/behaviors/constraint-validation.js';
|
|
10
|
+
import { getFormState, getFormValue } from '../../labs/behaviors/form-associated.js';
|
|
11
|
+
import { CheckboxValidator } from '../../labs/behaviors/validators/checkbox-validator.js';
|
|
12
|
+
declare const checkboxBaseClass: import("../../labs/behaviors/mixin.js").MixinReturn<import("../../labs/behaviors/mixin.js").MixinReturn<(abstract new (...args: any[]) => import("../../labs/behaviors/element-internals.js").WithElementInternals) & typeof LitElement & import("../../labs/behaviors/form-associated.js").FormAssociatedConstructor, import("../../labs/behaviors/form-associated.js").FormAssociated>, import("../../labs/behaviors/constraint-validation.js").ConstraintValidation>;
|
|
9
13
|
/**
|
|
10
14
|
* A checkbox component.
|
|
15
|
+
*
|
|
16
|
+
*
|
|
17
|
+
* @fires change {Event} The native `change` event on
|
|
18
|
+
* [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)
|
|
19
|
+
* --bubbles
|
|
20
|
+
* @fires input {InputEvent} The native `input` event on
|
|
21
|
+
* [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event)
|
|
22
|
+
* --bubbles --composed
|
|
11
23
|
*/
|
|
12
|
-
export declare class Checkbox extends
|
|
24
|
+
export declare class Checkbox extends checkboxBaseClass {
|
|
13
25
|
/** @nocollapse */
|
|
14
26
|
static shadowRootOptions: {
|
|
15
27
|
delegatesFocus: boolean;
|
|
16
28
|
mode: ShadowRootMode;
|
|
17
29
|
slotAssignment?: SlotAssignmentMode;
|
|
18
30
|
};
|
|
19
|
-
/** @nocollapse */
|
|
20
|
-
static readonly formAssociated = true;
|
|
21
31
|
/**
|
|
22
32
|
* Whether or not the checkbox is selected.
|
|
23
33
|
*/
|
|
24
34
|
checked: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* Whether or not the checkbox is disabled.
|
|
27
|
-
*/
|
|
28
|
-
disabled: boolean;
|
|
29
35
|
/**
|
|
30
36
|
* Whether or not the checkbox is indeterminate.
|
|
31
37
|
*
|
|
@@ -45,94 +51,21 @@ export declare class Checkbox extends LitElement {
|
|
|
45
51
|
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value
|
|
46
52
|
*/
|
|
47
53
|
value: string;
|
|
48
|
-
/**
|
|
49
|
-
* The HTML name to use in form submission.
|
|
50
|
-
*/
|
|
51
|
-
get name(): string;
|
|
52
|
-
set name(name: string);
|
|
53
|
-
/**
|
|
54
|
-
* The associated form element with which this element's value will submit.
|
|
55
|
-
*/
|
|
56
|
-
get form(): HTMLFormElement;
|
|
57
|
-
/**
|
|
58
|
-
* The labels this element is associated with.
|
|
59
|
-
*/
|
|
60
|
-
get labels(): NodeList;
|
|
61
|
-
/**
|
|
62
|
-
* Returns a ValidityState object that represents the validity states of the
|
|
63
|
-
* checkbox.
|
|
64
|
-
*
|
|
65
|
-
* Note that checkboxes will only set `valueMissing` if `required` and not
|
|
66
|
-
* checked.
|
|
67
|
-
*
|
|
68
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation
|
|
69
|
-
*/
|
|
70
|
-
get validity(): ValidityState;
|
|
71
|
-
/**
|
|
72
|
-
* Returns the native validation error message.
|
|
73
|
-
*
|
|
74
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process
|
|
75
|
-
*/
|
|
76
|
-
get validationMessage(): string;
|
|
77
|
-
/**
|
|
78
|
-
* Returns whether an element will successfully validate based on forms
|
|
79
|
-
* validation rules and constraints.
|
|
80
|
-
*
|
|
81
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process
|
|
82
|
-
*/
|
|
83
|
-
get willValidate(): boolean;
|
|
84
54
|
private prevChecked;
|
|
85
55
|
private prevDisabled;
|
|
86
56
|
private prevIndeterminate;
|
|
87
57
|
private readonly input;
|
|
88
|
-
private hasCustomValidityError;
|
|
89
|
-
private readonly internals;
|
|
90
58
|
constructor();
|
|
91
|
-
/**
|
|
92
|
-
* Checks the checkbox's native validation and returns whether or not the
|
|
93
|
-
* element is valid.
|
|
94
|
-
*
|
|
95
|
-
* If invalid, this method will dispatch the `invalid` event.
|
|
96
|
-
*
|
|
97
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/checkValidity
|
|
98
|
-
*
|
|
99
|
-
* @return true if the checkbox is valid, or false if not.
|
|
100
|
-
*/
|
|
101
|
-
checkValidity(): boolean;
|
|
102
|
-
/**
|
|
103
|
-
* Checks the checkbox's native validation and returns whether or not the
|
|
104
|
-
* element is valid.
|
|
105
|
-
*
|
|
106
|
-
* If invalid, this method will dispatch the `invalid` event.
|
|
107
|
-
*
|
|
108
|
-
* The `validationMessage` is reported to the user by the browser. Use
|
|
109
|
-
* `setCustomValidity()` to customize the `validationMessage`.
|
|
110
|
-
*
|
|
111
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/reportValidity
|
|
112
|
-
*
|
|
113
|
-
* @return true if the checkbox is valid, or false if not.
|
|
114
|
-
*/
|
|
115
|
-
reportValidity(): boolean;
|
|
116
|
-
/**
|
|
117
|
-
* Sets the checkbox's native validation error message. This is used to
|
|
118
|
-
* customize `validationMessage`.
|
|
119
|
-
*
|
|
120
|
-
* When the error is not an empty string, the checkbox is considered invalid
|
|
121
|
-
* and `validity.customError` will be true.
|
|
122
|
-
*
|
|
123
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setCustomValidity
|
|
124
|
-
*
|
|
125
|
-
* @param error The error message to display.
|
|
126
|
-
*/
|
|
127
|
-
setCustomValidity(error: string): void;
|
|
128
59
|
protected update(changed: PropertyValues<Checkbox>): void;
|
|
129
60
|
protected render(): import("lit-html").TemplateResult<1>;
|
|
130
|
-
protected updated(): void;
|
|
131
61
|
private handleChange;
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
62
|
+
disabled: boolean;
|
|
63
|
+
name: string;
|
|
64
|
+
[getFormValue](): string;
|
|
65
|
+
[getFormState](): string;
|
|
135
66
|
formResetCallback(): void;
|
|
136
|
-
/** @private */
|
|
137
67
|
formStateRestoreCallback(state: string): void;
|
|
68
|
+
[createValidator](): CheckboxValidator;
|
|
69
|
+
[getValidityAnchor](): HTMLInputElement;
|
|
138
70
|
}
|
|
71
|
+
export {};
|
|
@@ -10,74 +10,31 @@ import { html, isServer, LitElement, nothing } from 'lit';
|
|
|
10
10
|
import { property, query, state } from 'lit/decorators.js';
|
|
11
11
|
import { classMap } from 'lit/directives/class-map.js';
|
|
12
12
|
import { requestUpdateOnAriaChange } from '../../internal/aria/delegate.js';
|
|
13
|
-
import { dispatchActivationClick, isActivationClick, redispatchEvent } from '../../internal/controller/events.js';
|
|
13
|
+
import { dispatchActivationClick, isActivationClick, redispatchEvent, } from '../../internal/controller/events.js';
|
|
14
|
+
import { createValidator, getValidityAnchor, mixinConstraintValidation, } from '../../labs/behaviors/constraint-validation.js';
|
|
15
|
+
import { mixinElementInternals } from '../../labs/behaviors/element-internals.js';
|
|
16
|
+
import { getFormState, getFormValue, mixinFormAssociated, } from '../../labs/behaviors/form-associated.js';
|
|
17
|
+
import { CheckboxValidator } from '../../labs/behaviors/validators/checkbox-validator.js';
|
|
18
|
+
// Separate variable needed for closure.
|
|
19
|
+
const checkboxBaseClass = mixinConstraintValidation(mixinFormAssociated(mixinElementInternals(LitElement)));
|
|
14
20
|
/**
|
|
15
21
|
* A checkbox component.
|
|
22
|
+
*
|
|
23
|
+
*
|
|
24
|
+
* @fires change {Event} The native `change` event on
|
|
25
|
+
* [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)
|
|
26
|
+
* --bubbles
|
|
27
|
+
* @fires input {InputEvent} The native `input` event on
|
|
28
|
+
* [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event)
|
|
29
|
+
* --bubbles --composed
|
|
16
30
|
*/
|
|
17
|
-
export class Checkbox extends
|
|
18
|
-
/**
|
|
19
|
-
* The HTML name to use in form submission.
|
|
20
|
-
*/
|
|
21
|
-
get name() {
|
|
22
|
-
return this.getAttribute('name') ?? '';
|
|
23
|
-
}
|
|
24
|
-
set name(name) {
|
|
25
|
-
this.setAttribute('name', name);
|
|
26
|
-
}
|
|
27
|
-
/**
|
|
28
|
-
* The associated form element with which this element's value will submit.
|
|
29
|
-
*/
|
|
30
|
-
get form() {
|
|
31
|
-
return this.internals.form;
|
|
32
|
-
}
|
|
33
|
-
/**
|
|
34
|
-
* The labels this element is associated with.
|
|
35
|
-
*/
|
|
36
|
-
get labels() {
|
|
37
|
-
return this.internals.labels;
|
|
38
|
-
}
|
|
39
|
-
/**
|
|
40
|
-
* Returns a ValidityState object that represents the validity states of the
|
|
41
|
-
* checkbox.
|
|
42
|
-
*
|
|
43
|
-
* Note that checkboxes will only set `valueMissing` if `required` and not
|
|
44
|
-
* checked.
|
|
45
|
-
*
|
|
46
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation
|
|
47
|
-
*/
|
|
48
|
-
get validity() {
|
|
49
|
-
this.syncValidity();
|
|
50
|
-
return this.internals.validity;
|
|
51
|
-
}
|
|
52
|
-
/**
|
|
53
|
-
* Returns the native validation error message.
|
|
54
|
-
*
|
|
55
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process
|
|
56
|
-
*/
|
|
57
|
-
get validationMessage() {
|
|
58
|
-
this.syncValidity();
|
|
59
|
-
return this.internals.validationMessage;
|
|
60
|
-
}
|
|
61
|
-
/**
|
|
62
|
-
* Returns whether an element will successfully validate based on forms
|
|
63
|
-
* validation rules and constraints.
|
|
64
|
-
*
|
|
65
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process
|
|
66
|
-
*/
|
|
67
|
-
get willValidate() {
|
|
68
|
-
this.syncValidity();
|
|
69
|
-
return this.internals.willValidate;
|
|
70
|
-
}
|
|
31
|
+
export class Checkbox extends checkboxBaseClass {
|
|
71
32
|
constructor() {
|
|
72
33
|
super();
|
|
73
34
|
/**
|
|
74
35
|
* Whether or not the checkbox is selected.
|
|
75
36
|
*/
|
|
76
37
|
this.checked = false;
|
|
77
|
-
/**
|
|
78
|
-
* Whether or not the checkbox is disabled.
|
|
79
|
-
*/
|
|
80
|
-
this.disabled = false;
|
|
81
38
|
/**
|
|
82
39
|
* Whether or not the checkbox is indeterminate.
|
|
83
40
|
*
|
|
@@ -100,13 +57,9 @@ export class Checkbox extends LitElement {
|
|
|
100
57
|
this.prevChecked = false;
|
|
101
58
|
this.prevDisabled = false;
|
|
102
59
|
this.prevIndeterminate = false;
|
|
103
|
-
// Needed for Safari, see https://bugs.webkit.org/show_bug.cgi?id=261432
|
|
104
|
-
// Replace with this.internals.validity.customError when resolved.
|
|
105
|
-
this.hasCustomValidityError = false;
|
|
106
|
-
this.internals = this /* needed for closure */.attachInternals();
|
|
107
60
|
if (!isServer) {
|
|
108
61
|
this.addEventListener('click', (event) => {
|
|
109
|
-
if (!isActivationClick(event)) {
|
|
62
|
+
if (!isActivationClick(event) || !this.input) {
|
|
110
63
|
return;
|
|
111
64
|
}
|
|
112
65
|
this.focus();
|
|
@@ -114,63 +67,15 @@ export class Checkbox extends LitElement {
|
|
|
114
67
|
});
|
|
115
68
|
}
|
|
116
69
|
}
|
|
117
|
-
/**
|
|
118
|
-
* Checks the checkbox's native validation and returns whether or not the
|
|
119
|
-
* element is valid.
|
|
120
|
-
*
|
|
121
|
-
* If invalid, this method will dispatch the `invalid` event.
|
|
122
|
-
*
|
|
123
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/checkValidity
|
|
124
|
-
*
|
|
125
|
-
* @return true if the checkbox is valid, or false if not.
|
|
126
|
-
*/
|
|
127
|
-
checkValidity() {
|
|
128
|
-
this.syncValidity();
|
|
129
|
-
return this.internals.checkValidity();
|
|
130
|
-
}
|
|
131
|
-
/**
|
|
132
|
-
* Checks the checkbox's native validation and returns whether or not the
|
|
133
|
-
* element is valid.
|
|
134
|
-
*
|
|
135
|
-
* If invalid, this method will dispatch the `invalid` event.
|
|
136
|
-
*
|
|
137
|
-
* The `validationMessage` is reported to the user by the browser. Use
|
|
138
|
-
* `setCustomValidity()` to customize the `validationMessage`.
|
|
139
|
-
*
|
|
140
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/reportValidity
|
|
141
|
-
*
|
|
142
|
-
* @return true if the checkbox is valid, or false if not.
|
|
143
|
-
*/
|
|
144
|
-
reportValidity() {
|
|
145
|
-
this.syncValidity();
|
|
146
|
-
return this.internals.reportValidity();
|
|
147
|
-
}
|
|
148
|
-
/**
|
|
149
|
-
* Sets the checkbox's native validation error message. This is used to
|
|
150
|
-
* customize `validationMessage`.
|
|
151
|
-
*
|
|
152
|
-
* When the error is not an empty string, the checkbox is considered invalid
|
|
153
|
-
* and `validity.customError` will be true.
|
|
154
|
-
*
|
|
155
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setCustomValidity
|
|
156
|
-
*
|
|
157
|
-
* @param error The error message to display.
|
|
158
|
-
*/
|
|
159
|
-
setCustomValidity(error) {
|
|
160
|
-
this.hasCustomValidityError = !!error;
|
|
161
|
-
this.internals.setValidity({ customError: !!error }, error, this.getInput());
|
|
162
|
-
}
|
|
163
70
|
update(changed) {
|
|
164
|
-
if (changed.has('checked') ||
|
|
71
|
+
if (changed.has('checked') ||
|
|
72
|
+
changed.has('disabled') ||
|
|
165
73
|
changed.has('indeterminate')) {
|
|
166
74
|
this.prevChecked = changed.get('checked') ?? this.checked;
|
|
167
75
|
this.prevDisabled = changed.get('disabled') ?? this.disabled;
|
|
168
76
|
this.prevIndeterminate =
|
|
169
77
|
changed.get('indeterminate') ?? this.indeterminate;
|
|
170
78
|
}
|
|
171
|
-
const shouldAddFormValue = this.checked && !this.indeterminate;
|
|
172
|
-
const state = String(this.checked);
|
|
173
|
-
this.internals.setFormValue(shouldAddFormValue ? this.value : null, state);
|
|
174
79
|
super.update(changed);
|
|
175
80
|
}
|
|
176
81
|
render() {
|
|
@@ -196,7 +101,8 @@ export class Checkbox extends LitElement {
|
|
|
196
101
|
// form.reportValidity() to work in Chrome.
|
|
197
102
|
return html `
|
|
198
103
|
<div class="container ${containerClasses}">
|
|
199
|
-
<input
|
|
104
|
+
<input
|
|
105
|
+
type="checkbox"
|
|
200
106
|
id="input"
|
|
201
107
|
aria-checked=${isIndeterminate ? 'mixed' : nothing}
|
|
202
108
|
aria-label=${ariaLabel || nothing}
|
|
@@ -205,8 +111,7 @@ export class Checkbox extends LitElement {
|
|
|
205
111
|
?required=${this.required}
|
|
206
112
|
.indeterminate=${this.indeterminate}
|
|
207
113
|
.checked=${this.checked}
|
|
208
|
-
@change=${this.handleChange}
|
|
209
|
-
>
|
|
114
|
+
@change=${this.handleChange} />
|
|
210
115
|
|
|
211
116
|
<div class="outline"></div>
|
|
212
117
|
<div class="background"></div>
|
|
@@ -219,53 +124,35 @@ export class Checkbox extends LitElement {
|
|
|
219
124
|
</div>
|
|
220
125
|
`;
|
|
221
126
|
}
|
|
222
|
-
updated() {
|
|
223
|
-
// Sync validity when properties change, since validation properties may
|
|
224
|
-
// have changed.
|
|
225
|
-
this.syncValidity();
|
|
226
|
-
}
|
|
227
127
|
handleChange(event) {
|
|
228
128
|
const target = event.target;
|
|
229
129
|
this.checked = target.checked;
|
|
230
130
|
this.indeterminate = target.indeterminate;
|
|
231
131
|
redispatchEvent(this, event);
|
|
232
132
|
}
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
const input = this.getInput();
|
|
237
|
-
if (this.hasCustomValidityError) {
|
|
238
|
-
input.setCustomValidity(this.internals.validationMessage);
|
|
239
|
-
}
|
|
240
|
-
else {
|
|
241
|
-
input.setCustomValidity('');
|
|
133
|
+
[getFormValue]() {
|
|
134
|
+
if (!this.checked || this.indeterminate) {
|
|
135
|
+
return null;
|
|
242
136
|
}
|
|
243
|
-
|
|
137
|
+
return this.value;
|
|
244
138
|
}
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
// If the input is not yet defined, synchronously render.
|
|
248
|
-
this.connectedCallback();
|
|
249
|
-
this.performUpdate();
|
|
250
|
-
}
|
|
251
|
-
if (this.isUpdatePending) {
|
|
252
|
-
// If there are pending updates, synchronously perform them. This ensures
|
|
253
|
-
// that constraint validation properties (like `required`) are synced
|
|
254
|
-
// before interacting with input APIs that depend on them.
|
|
255
|
-
this.scheduleUpdate();
|
|
256
|
-
}
|
|
257
|
-
return this.input;
|
|
139
|
+
[getFormState]() {
|
|
140
|
+
return String(this.checked);
|
|
258
141
|
}
|
|
259
|
-
/** @private */
|
|
260
142
|
formResetCallback() {
|
|
261
143
|
// The checked property does not reflect, so the original attribute set by
|
|
262
144
|
// the user is used to determine the default value.
|
|
263
145
|
this.checked = this.hasAttribute('checked');
|
|
264
146
|
}
|
|
265
|
-
/** @private */
|
|
266
147
|
formStateRestoreCallback(state) {
|
|
267
148
|
this.checked = state === 'true';
|
|
268
149
|
}
|
|
150
|
+
[createValidator]() {
|
|
151
|
+
return new CheckboxValidator(() => this);
|
|
152
|
+
}
|
|
153
|
+
[getValidityAnchor]() {
|
|
154
|
+
return this.input;
|
|
155
|
+
}
|
|
269
156
|
}
|
|
270
157
|
(() => {
|
|
271
158
|
requestUpdateOnAriaChange(Checkbox);
|
|
@@ -273,16 +160,11 @@ export class Checkbox extends LitElement {
|
|
|
273
160
|
/** @nocollapse */
|
|
274
161
|
Checkbox.shadowRootOptions = {
|
|
275
162
|
...LitElement.shadowRootOptions,
|
|
276
|
-
delegatesFocus: true
|
|
163
|
+
delegatesFocus: true,
|
|
277
164
|
};
|
|
278
|
-
/** @nocollapse */
|
|
279
|
-
Checkbox.formAssociated = true;
|
|
280
165
|
__decorate([
|
|
281
166
|
property({ type: Boolean })
|
|
282
167
|
], Checkbox.prototype, "checked", void 0);
|
|
283
|
-
__decorate([
|
|
284
|
-
property({ type: Boolean, reflect: true })
|
|
285
|
-
], Checkbox.prototype, "disabled", void 0);
|
|
286
168
|
__decorate([
|
|
287
169
|
property({ type: Boolean })
|
|
288
170
|
], Checkbox.prototype, "indeterminate", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues} from 'lit';\nimport {property, query, state} 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';\nimport {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../internal/controller/events.js';\n\n/**\n * A checkbox component.\n */\nexport class Checkbox extends LitElement {\n static {\n requestUpdateOnAriaChange(Checkbox);\n }\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true\n };\n\n /** @nocollapse */\n static readonly formAssociated = true;\n\n /**\n * Whether or not the checkbox is selected.\n */\n @property({type: Boolean}) checked = false;\n\n /**\n * Whether or not the checkbox is disabled.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * Whether or not the checkbox is indeterminate.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes\n */\n @property({type: Boolean}) indeterminate = false;\n\n /**\n * When true, require the checkbox to be selected when participating in\n * form submission.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n @property({type: Boolean}) required = false;\n\n /**\n * The value of the checkbox that is submitted with a form when selected.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value\n */\n @property() value = 'on';\n\n /**\n * The HTML name to use in form submission.\n */\n get name() {\n return this.getAttribute('name') ?? '';\n }\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.internals.form;\n }\n\n /**\n * The labels this element is associated with.\n */\n get labels() {\n return this.internals.labels;\n }\n\n /**\n * Returns a ValidityState object that represents the validity states of the\n * checkbox.\n *\n * Note that checkboxes will only set `valueMissing` if `required` and not\n * checked.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n get validity() {\n this.syncValidity();\n return this.internals.validity;\n }\n\n /**\n * Returns the native validation error message.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process\n */\n get validationMessage() {\n this.syncValidity();\n return this.internals.validationMessage;\n }\n\n /**\n * Returns whether an element will successfully validate based on forms\n * validation rules and constraints.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation#constraint_validation_process\n */\n get willValidate() {\n this.syncValidity();\n return this.internals.willValidate;\n }\n\n @state() private prevChecked = false;\n @state() private prevDisabled = false;\n @state() private prevIndeterminate = false;\n @query('input') private readonly input!: HTMLInputElement|null;\n // Needed for Safari, see https://bugs.webkit.org/show_bug.cgi?id=261432\n // Replace with this.internals.validity.customError when resolved.\n private hasCustomValidityError = false;\n private readonly internals =\n (this as HTMLElement /* needed for closure */).attachInternals();\n\n constructor() {\n super();\n if (!isServer) {\n this.addEventListener('click', (event: MouseEvent) => {\n if (!isActivationClick(event)) {\n return;\n }\n this.focus();\n dispatchActivationClick(this.input!);\n });\n }\n }\n\n /**\n * Checks the checkbox's native validation and returns whether or not the\n * element is valid.\n *\n * If invalid, this method will dispatch the `invalid` event.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/checkValidity\n *\n * @return true if the checkbox is valid, or false if not.\n */\n checkValidity() {\n this.syncValidity();\n return this.internals.checkValidity();\n }\n\n /**\n * Checks the checkbox's native validation and returns whether or not the\n * element is valid.\n *\n * If invalid, this method will dispatch the `invalid` event.\n *\n * The `validationMessage` is reported to the user by the browser. Use\n * `setCustomValidity()` to customize the `validationMessage`.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/reportValidity\n *\n * @return true if the checkbox is valid, or false if not.\n */\n reportValidity() {\n this.syncValidity();\n return this.internals.reportValidity();\n }\n\n /**\n * Sets the checkbox's native validation error message. This is used to\n * customize `validationMessage`.\n *\n * When the error is not an empty string, the checkbox is considered invalid\n * and `validity.customError` will be true.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setCustomValidity\n *\n * @param error The error message to display.\n */\n setCustomValidity(error: string) {\n this.hasCustomValidityError = !!error;\n this.internals.setValidity({customError: !!error}, error, this.getInput());\n }\n\n protected override update(changed: PropertyValues<Checkbox>) {\n if (changed.has('checked') || changed.has('disabled') ||\n changed.has('indeterminate')) {\n this.prevChecked = changed.get('checked') ?? this.checked;\n this.prevDisabled = changed.get('disabled') ?? this.disabled;\n this.prevIndeterminate =\n changed.get('indeterminate') ?? this.indeterminate;\n }\n\n const shouldAddFormValue = this.checked && !this.indeterminate;\n const state = String(this.checked);\n this.internals.setFormValue(shouldAddFormValue ? this.value : null, state);\n super.update(changed);\n }\n\n protected override render() {\n const prevNone = !this.prevChecked && !this.prevIndeterminate;\n const prevChecked = this.prevChecked && !this.prevIndeterminate;\n const prevIndeterminate = this.prevIndeterminate;\n const isChecked = this.checked && !this.indeterminate;\n const isIndeterminate = this.indeterminate;\n\n const containerClasses = classMap({\n 'disabled': this.disabled,\n 'selected': isChecked || isIndeterminate,\n 'unselected': !isChecked && !isIndeterminate,\n 'checked': isChecked,\n 'indeterminate': isIndeterminate,\n 'prev-unselected': prevNone,\n 'prev-checked': prevChecked,\n 'prev-indeterminate': prevIndeterminate,\n 'prev-disabled': this.prevDisabled,\n });\n\n // Needed for closure conformance\n const {ariaLabel, ariaInvalid} = this as ARIAMixinStrict;\n // Note: <input> needs to be rendered before the <svg> for\n // form.reportValidity() to work in Chrome.\n return html`\n <div class=\"container ${containerClasses}\">\n <input type=\"checkbox\"\n id=\"input\"\n aria-checked=${isIndeterminate ? 'mixed' : nothing}\n aria-label=${ariaLabel || nothing}\n aria-invalid=${ariaInvalid || nothing}\n ?disabled=${this.disabled}\n ?required=${this.required}\n .indeterminate=${this.indeterminate}\n .checked=${this.checked}\n @change=${this.handleChange}\n >\n\n <div class=\"outline\"></div>\n <div class=\"background\"></div>\n <md-focus-ring part=\"focus-ring\" for=\"input\"></md-focus-ring>\n <md-ripple for=\"input\" ?disabled=${this.disabled}></md-ripple>\n <svg class=\"icon\" viewBox=\"0 0 18 18\" aria-hidden=\"true\">\n <rect class=\"mark short\" />\n <rect class=\"mark long\" />\n </svg>\n </div>\n `;\n }\n\n protected override updated() {\n // Sync validity when properties change, since validation properties may\n // have changed.\n this.syncValidity();\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLInputElement;\n this.checked = target.checked;\n this.indeterminate = target.indeterminate;\n\n redispatchEvent(this, event);\n }\n\n private syncValidity() {\n // Sync the internal <input>'s validity and the host's ElementInternals\n // validity. We do this to re-use native `<input>` validation messages.\n const input = this.getInput();\n if (this.hasCustomValidityError) {\n input.setCustomValidity(this.internals.validationMessage);\n } else {\n input.setCustomValidity('');\n }\n\n this.internals.setValidity(\n input.validity, input.validationMessage, this.getInput());\n }\n\n private getInput() {\n if (!this.input) {\n // If the input is not yet defined, synchronously render.\n this.connectedCallback();\n this.performUpdate();\n }\n\n if (this.isUpdatePending) {\n // If there are pending updates, synchronously perform them. This ensures\n // that constraint validation properties (like `required`) are synced\n // before interacting with input APIs that depend on them.\n this.scheduleUpdate();\n }\n\n return this.input!;\n }\n\n /** @private */\n formResetCallback() {\n // The checked property does not reflect, so the original attribute set by\n // the user is used to determine the default value.\n this.checked = this.hasAttribute('checked');\n }\n\n /** @private */\n formStateRestoreCallback(state: string) {\n this.checked = state === 'true';\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues} from 'lit';\nimport {property, query, state} 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';\nimport {\n dispatchActivationClick,\n isActivationClick,\n redispatchEvent,\n} from '../../internal/controller/events.js';\nimport {\n createValidator,\n getValidityAnchor,\n mixinConstraintValidation,\n} from '../../labs/behaviors/constraint-validation.js';\nimport {mixinElementInternals} from '../../labs/behaviors/element-internals.js';\nimport {\n getFormState,\n getFormValue,\n mixinFormAssociated,\n} from '../../labs/behaviors/form-associated.js';\nimport {CheckboxValidator} from '../../labs/behaviors/validators/checkbox-validator.js';\n\n// Separate variable needed for closure.\nconst checkboxBaseClass = mixinConstraintValidation(\n mixinFormAssociated(mixinElementInternals(LitElement)),\n);\n\n/**\n * A checkbox component.\n *\n *\n * @fires change {Event} The native `change` event on\n * [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)\n * --bubbles\n * @fires input {InputEvent} The native `input` event on\n * [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event)\n * --bubbles --composed\n */\nexport class Checkbox extends checkboxBaseClass {\n static {\n requestUpdateOnAriaChange(Checkbox);\n }\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n /**\n * Whether or not the checkbox is selected.\n */\n @property({type: Boolean}) checked = false;\n\n /**\n * Whether or not the checkbox is indeterminate.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes\n */\n @property({type: Boolean}) indeterminate = false;\n\n /**\n * When true, require the checkbox to be selected when participating in\n * form submission.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation\n */\n @property({type: Boolean}) required = false;\n\n /**\n * The value of the checkbox that is submitted with a form when selected.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value\n */\n @property() value = 'on';\n\n @state() private prevChecked = false;\n @state() private prevDisabled = false;\n @state() private prevIndeterminate = false;\n @query('input') private readonly input!: HTMLInputElement | null;\n\n constructor() {\n super();\n if (!isServer) {\n this.addEventListener('click', (event: MouseEvent) => {\n if (!isActivationClick(event) || !this.input) {\n return;\n }\n this.focus();\n dispatchActivationClick(this.input);\n });\n }\n }\n\n protected override update(changed: PropertyValues<Checkbox>) {\n if (\n changed.has('checked') ||\n changed.has('disabled') ||\n changed.has('indeterminate')\n ) {\n this.prevChecked = changed.get('checked') ?? this.checked;\n this.prevDisabled = changed.get('disabled') ?? this.disabled;\n this.prevIndeterminate =\n changed.get('indeterminate') ?? this.indeterminate;\n }\n\n super.update(changed);\n }\n\n protected override render() {\n const prevNone = !this.prevChecked && !this.prevIndeterminate;\n const prevChecked = this.prevChecked && !this.prevIndeterminate;\n const prevIndeterminate = this.prevIndeterminate;\n const isChecked = this.checked && !this.indeterminate;\n const isIndeterminate = this.indeterminate;\n\n const containerClasses = classMap({\n 'disabled': this.disabled,\n 'selected': isChecked || isIndeterminate,\n 'unselected': !isChecked && !isIndeterminate,\n 'checked': isChecked,\n 'indeterminate': isIndeterminate,\n 'prev-unselected': prevNone,\n 'prev-checked': prevChecked,\n 'prev-indeterminate': prevIndeterminate,\n 'prev-disabled': this.prevDisabled,\n });\n\n // Needed for closure conformance\n const {ariaLabel, ariaInvalid} = this as ARIAMixinStrict;\n // Note: <input> needs to be rendered before the <svg> for\n // form.reportValidity() to work in Chrome.\n return html`\n <div class=\"container ${containerClasses}\">\n <input\n type=\"checkbox\"\n id=\"input\"\n aria-checked=${isIndeterminate ? 'mixed' : nothing}\n aria-label=${ariaLabel || nothing}\n aria-invalid=${ariaInvalid || nothing}\n ?disabled=${this.disabled}\n ?required=${this.required}\n .indeterminate=${this.indeterminate}\n .checked=${this.checked}\n @change=${this.handleChange} />\n\n <div class=\"outline\"></div>\n <div class=\"background\"></div>\n <md-focus-ring part=\"focus-ring\" for=\"input\"></md-focus-ring>\n <md-ripple for=\"input\" ?disabled=${this.disabled}></md-ripple>\n <svg class=\"icon\" viewBox=\"0 0 18 18\" aria-hidden=\"true\">\n <rect class=\"mark short\" />\n <rect class=\"mark long\" />\n </svg>\n </div>\n `;\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLInputElement;\n this.checked = target.checked;\n this.indeterminate = target.indeterminate;\n\n redispatchEvent(this, event);\n }\n\n // Writable mixin properties for lit-html binding, needed for lit-analyzer\n declare disabled: boolean;\n declare name: string;\n\n override [getFormValue]() {\n if (!this.checked || this.indeterminate) {\n return null;\n }\n\n return this.value;\n }\n\n override [getFormState]() {\n return String(this.checked);\n }\n\n override formResetCallback() {\n // The checked property does not reflect, so the original attribute set by\n // the user is used to determine the default value.\n this.checked = this.hasAttribute('checked');\n }\n\n override formStateRestoreCallback(state: string) {\n this.checked = state === 'true';\n }\n\n [createValidator]() {\n return new CheckboxValidator(() => this);\n }\n\n [getValidityAnchor]() {\n return this.input;\n }\n}\n"]}
|
package/chips/filter-chip.js
CHANGED
|
@@ -20,7 +20,11 @@ import { styles as trailingIconStyles } from './internal/trailing-icon-styles.cs
|
|
|
20
20
|
export let MdFilterChip = class MdFilterChip extends FilterChip {
|
|
21
21
|
};
|
|
22
22
|
MdFilterChip.styles = [
|
|
23
|
-
sharedStyles,
|
|
23
|
+
sharedStyles,
|
|
24
|
+
elevatedStyles,
|
|
25
|
+
trailingIconStyles,
|
|
26
|
+
selectableStyles,
|
|
27
|
+
styles,
|
|
24
28
|
];
|
|
25
29
|
MdFilterChip = __decorate([
|
|
26
30
|
customElement('md-filter-chip')
|
package/chips/filter-chip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,EAAC,MAAM,iCAAiC,CAAC;AACvD,OAAO,EAAC,MAAM,IAAI,gBAAgB,EAAC,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,wCAAwC,CAAC;AAQpF;;;;;GAKG;AAEI,WAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG;IACvB,YAAY,
|
|
1
|
+
{"version":3,"file":"filter-chip.js","sourceRoot":"","sources":["filter-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,MAAM,EAAC,MAAM,iCAAiC,CAAC;AACvD,OAAO,EAAC,MAAM,IAAI,gBAAgB,EAAC,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,wCAAwC,CAAC;AAQpF;;;;;GAKG;AAEI,WAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG;IACvB,YAAY;IACZ,cAAc;IACd,kBAAkB;IAClB,gBAAgB;IAChB,MAAM;CACP,AANqB,CAMpB;AAPS,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAQxB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as elevatedStyles} from './internal/elevated-styles.css.js';\nimport {FilterChip} from './internal/filter-chip.js';\nimport {styles} from './internal/filter-styles.css.js';\nimport {styles as selectableStyles} from './internal/selectable-styles.css.js';\nimport {styles as sharedStyles} from './internal/shared-styles.css.js';\nimport {styles as trailingIconStyles} from './internal/trailing-icon-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-filter-chip': MdFilterChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-filter-chip')\nexport class MdFilterChip extends FilterChip {\n static override styles = [\n sharedStyles,\n elevatedStyles,\n trailingIconStyles,\n selectableStyles,\n styles,\n ];\n}\n"]}
|
package/chips/harness.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,OAAa;IAA9C;;QACE,WAAM,
|
|
1
|
+
{"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,WAAY,SAAQ,OAAa;IAA9C;;QACE,WAAM,GAA2B,SAAS,CAAC;IAkC7C,CAAC;IAhCoB,KAAK,CAAC,qBAAqB;QAC5C,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,MAAM,EAAC,SAAS,EAAC,GAAG,IAAI,CAAC,OAAyC,CAAC;QACnE,MAAM,aAAa,GACjB,SAAS;YACT,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAc,IAAI,SAAS,EAAE,CAAC,CAAC;QACtE,4CAA4C;QAC5C,MAAM,EAAC,cAAc,EAAC,GAAG,IAAI,CAAC,OAE7B,CAAC;QAEF,0EAA0E;QAC1E,yEAAyE;QACzE,UAAU;QACV,IAAI,IAAI,CAAC,MAAM,KAAK,UAAU,IAAI,CAAC,aAAa,EAAE;YAChD,IAAI,CAAC,cAAc,EAAE;gBACnB,MAAM,IAAI,KAAK,CACb,mFAAmF,CACpF,CAAC;aACH;YAED,OAAO,cAAc,CAAC;SACvB;QAED,IAAI,CAAC,aAAa,EAAE;YAClB,MAAM,IAAI,KAAK,CACb,iFAAiF,CAClF,CAAC;SACH;QAED,OAAO,aAAa,CAAC;IACvB,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {Chip} from './internal/chip.js';\n\n/**\n * Test harness for chips.\n */\nexport class ChipHarness extends Harness<Chip> {\n action: 'primary' | 'trailing' = 'primary';\n\n protected override async getInteractiveElement() {\n await this.element.updateComplete;\n const {primaryId} = this.element as unknown as {primaryId: string};\n const primaryAction =\n primaryId &&\n this.element.renderRoot.querySelector<HTMLElement>(`#${primaryId}`);\n // Retrieve MultiActionChip's trailingAction\n const {trailingAction} = this.element as {\n trailingAction?: HTMLElement | null;\n };\n\n // Default to trailing action if there isn't a primary action and the user\n // didn't explicitly set `harness.action = 'trailing'` (remove-only input\n // chips).\n if (this.action === 'trailing' || !primaryAction) {\n if (!trailingAction) {\n throw new Error(\n '`ChipHarness.action` is \"trailing\", but the chip does not have a trailing action.',\n );\n }\n\n return trailingAction;\n }\n\n if (!primaryAction) {\n throw new Error(\n '`ChipHarness.action` is \"primary\", but the chip does not have a primary action.',\n );\n }\n\n return primaryAction;\n }\n}\n"]}
|
package/chips/input-chip.js
CHANGED
|
@@ -18,7 +18,12 @@ import { styles as trailingIconStyles } from './internal/trailing-icon-styles.cs
|
|
|
18
18
|
*/
|
|
19
19
|
export let MdInputChip = class MdInputChip extends InputChip {
|
|
20
20
|
};
|
|
21
|
-
MdInputChip.styles = [
|
|
21
|
+
MdInputChip.styles = [
|
|
22
|
+
sharedStyles,
|
|
23
|
+
trailingIconStyles,
|
|
24
|
+
selectableStyles,
|
|
25
|
+
styles,
|
|
26
|
+
];
|
|
22
27
|
MdInputChip = __decorate([
|
|
23
28
|
customElement('md-input-chip')
|
|
24
29
|
], MdInputChip);
|
package/chips/input-chip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-chip.js","sourceRoot":"","sources":["input-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,SAAS,EAAC,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAC,MAAM,EAAC,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAC,MAAM,IAAI,gBAAgB,EAAC,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,wCAAwC,CAAC;AAQpF;;;;;GAKG;AAEI,WAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,SAAS;;AACxB,kBAAM,
|
|
1
|
+
{"version":3,"file":"input-chip.js","sourceRoot":"","sources":["input-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,SAAS,EAAC,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAC,MAAM,EAAC,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAC,MAAM,IAAI,gBAAgB,EAAC,MAAM,qCAAqC,CAAC;AAC/E,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,wCAAwC,CAAC;AAQpF;;;;;GAKG;AAEI,WAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,SAAS;;AACxB,kBAAM,GAAG;IACvB,YAAY;IACZ,kBAAkB;IAClB,gBAAgB;IAChB,MAAM;CACP,AALqB,CAKpB;AANS,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CAOvB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {InputChip} from './internal/input-chip.js';\nimport {styles} from './internal/input-styles.css.js';\nimport {styles as selectableStyles} from './internal/selectable-styles.css.js';\nimport {styles as sharedStyles} from './internal/shared-styles.css.js';\nimport {styles as trailingIconStyles} from './internal/trailing-icon-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-input-chip': MdInputChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-input-chip')\nexport class MdInputChip extends InputChip {\n static override styles = [\n sharedStyles,\n trailingIconStyles,\n selectableStyles,\n styles,\n ];\n}\n"]}
|
|
@@ -38,21 +38,25 @@ export class AssistChip extends Chip {
|
|
|
38
38
|
const { ariaLabel } = this;
|
|
39
39
|
if (this.href) {
|
|
40
40
|
return html `
|
|
41
|
-
<a
|
|
41
|
+
<a
|
|
42
|
+
class="primary action"
|
|
42
43
|
id="link"
|
|
43
44
|
aria-label=${ariaLabel || nothing}
|
|
44
45
|
href=${this.href}
|
|
45
46
|
target=${this.target || nothing}
|
|
46
|
-
|
|
47
|
+
>${content}</a
|
|
48
|
+
>
|
|
47
49
|
`;
|
|
48
50
|
}
|
|
49
51
|
return html `
|
|
50
|
-
<button
|
|
52
|
+
<button
|
|
53
|
+
class="primary action"
|
|
51
54
|
id="button"
|
|
52
55
|
aria-label=${ariaLabel || nothing}
|
|
53
56
|
?disabled=${this.disabled && !this.alwaysFocusable}
|
|
54
57
|
type="button"
|
|
55
|
-
|
|
58
|
+
>${content}</button
|
|
59
|
+
>
|
|
56
60
|
`;
|
|
57
61
|
}
|
|
58
62
|
renderOutline() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"assist-chip.js","sourceRoot":"","sources":["assist-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAClC,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAI3C,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAE/B;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,IAAI;IAApC;;QAC6B,aAAQ,GAAG,KAAK,CAAC;QAChC,SAAI,GAAG,EAAE,CAAC;QACV,WAAM,
|
|
1
|
+
{"version":3,"file":"assist-chip.js","sourceRoot":"","sources":["assist-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAClC,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAI3C,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAC;AAE/B;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,IAAI;IAApC;;QAC6B,aAAQ,GAAG,KAAK,CAAC;QAChC,SAAI,GAAG,EAAE,CAAC;QACV,WAAM,GAAiD,EAAE,CAAC;IAuDxE,CAAC;IArDC,IAAc,SAAS;QACrB,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;IACvC,CAAC;IAED,IAAuB,cAAc;QACnC,gCAAgC;QAChC,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC;IACrC,CAAC;IAEkB,mBAAmB;QACpC,OAAO;YACL,GAAG,KAAK,CAAC,mBAAmB,EAAE;YAC9B,gCAAgC;YAChC,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ;YACrC,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;SAClB,CAAC;IACJ,CAAC;IAEkB,mBAAmB,CAAC,OAAgB;QACrD,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,OAAO,IAAI,CAAA;;;;uBAIM,SAAS,IAAI,OAAO;iBAC1B,IAAI,CAAC,IAAI;mBACP,IAAI,CAAC,MAAM,IAAI,OAAO;aAC5B,OAAO;;OAEb,CAAC;SACH;QAED,OAAO,IAAI,CAAA;;;;qBAIM,SAAS,IAAI,OAAO;oBACrB,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe;;WAE/C,OAAO;;KAEb,CAAC;IACJ,CAAC;IAEkB,aAAa;QAC9B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,IAAI,CAAA,+BAA+B,CAAC;SAC5C;QAED,OAAO,KAAK,CAAC,aAAa,EAAE,CAAC;IAC/B,CAAC;CACF;AAzD4B;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAkB;AAChC;IAAX,QAAQ,EAAE;wCAAW;AACV;IAAX,QAAQ,EAAE;0CAA2D","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../elevation/elevation.js';\n\nimport {html, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\n\nimport {ARIAMixinStrict} from '../../internal/aria/aria.js';\n\nimport {Chip} from './chip.js';\n\n/**\n * An assist chip component.\n */\nexport class AssistChip extends Chip {\n @property({type: Boolean}) elevated = false;\n @property() href = '';\n @property() target: '_blank' | '_parent' | '_self' | '_top' | '' = '';\n\n protected get primaryId() {\n return this.href ? 'link' : 'button';\n }\n\n protected override get rippleDisabled() {\n // Link chips cannot be disabled\n return !this.href && this.disabled;\n }\n\n protected override getContainerClasses() {\n return {\n ...super.getContainerClasses(),\n // Link chips cannot be disabled\n disabled: !this.href && this.disabled,\n elevated: this.elevated,\n link: !!this.href,\n };\n }\n\n protected override renderPrimaryAction(content: unknown) {\n const {ariaLabel} = this as ARIAMixinStrict;\n if (this.href) {\n return html`\n <a\n class=\"primary action\"\n id=\"link\"\n aria-label=${ariaLabel || nothing}\n href=${this.href}\n target=${this.target || nothing}\n >${content}</a\n >\n `;\n }\n\n return html`\n <button\n class=\"primary action\"\n id=\"button\"\n aria-label=${ariaLabel || nothing}\n ?disabled=${this.disabled && !this.alwaysFocusable}\n type=\"button\"\n >${content}</button\n >\n `;\n }\n\n protected override renderOutline() {\n if (this.elevated) {\n return html`<md-elevation></md-elevation>`;\n }\n\n return super.renderOutline();\n }\n}\n"]}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
import { __decorate } from "tslib";
|
|
7
7
|
import { html, isServer, LitElement } from 'lit';
|
|
8
8
|
import { queryAssignedElements } from 'lit/decorators.js';
|
|
9
|
-
import { polyfillElementInternalsAria,
|
|
9
|
+
import { polyfillARIAMixin, polyfillElementInternalsAria, } from '../../internal/aria/aria.js';
|
|
10
10
|
import { Chip } from './chip.js';
|
|
11
11
|
/**
|
|
12
12
|
* A chip set component.
|
|
@@ -17,7 +17,9 @@ export class ChipSet extends LitElement {
|
|
|
17
17
|
}
|
|
18
18
|
constructor() {
|
|
19
19
|
super();
|
|
20
|
-
this.internals = polyfillElementInternalsAria(this,
|
|
20
|
+
this.internals = polyfillElementInternalsAria(this,
|
|
21
|
+
// Cast needed for closure
|
|
22
|
+
this.attachInternals());
|
|
21
23
|
if (!isServer) {
|
|
22
24
|
this.addEventListener('focusin', this.updateTabIndices.bind(this));
|
|
23
25
|
this.addEventListener('update-focus', this.updateTabIndices.bind(this));
|
|
@@ -53,7 +55,7 @@ export class ChipSet extends LitElement {
|
|
|
53
55
|
// Check if moving forwards or backwards
|
|
54
56
|
const isRtl = getComputedStyle(this).direction === 'rtl';
|
|
55
57
|
const forwards = isRtl ? isLeft : isRight;
|
|
56
|
-
const focusedChip = chips.find(chip => chip.matches(':focus-within'));
|
|
58
|
+
const focusedChip = chips.find((chip) => chip.matches(':focus-within'));
|
|
57
59
|
if (!focusedChip) {
|
|
58
60
|
// If there is not already a chip focused, select the first or last chip
|
|
59
61
|
// based on the direction we're traveling.
|
|
@@ -122,7 +124,7 @@ export class ChipSet extends LitElement {
|
|
|
122
124
|
}
|
|
123
125
|
}
|
|
124
126
|
(() => {
|
|
125
|
-
|
|
127
|
+
polyfillARIAMixin(ChipSet);
|
|
126
128
|
})();
|
|
127
129
|
__decorate([
|
|
128
130
|
queryAssignedElements()
|