@material/web 1.0.0-pre.14 → 1.0.0-pre.16
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/README.md +24 -19
- package/all.d.ts +4 -8
- package/all.js +4 -8
- package/all.js.map +1 -1
- package/button/{_tonal-button.scss → _filled-tonal-button.scss} +1 -1
- package/button/{tonal-button.d.ts → filled-tonal-button.d.ts} +3 -3
- package/button/{tonal-button.js → filled-tonal-button.js} +9 -9
- package/button/filled-tonal-button.js.map +1 -0
- package/button/internal/_filled-button.scss +0 -1
- package/button/internal/{_tonal-button.scss → _filled-tonal-button.scss} +7 -7
- package/button/internal/_outlined-button.scss +6 -0
- package/button/internal/_shared.scss +19 -8
- package/button/internal/_touch-target.scss +5 -1
- package/button/internal/button.d.ts +19 -22
- package/button/internal/button.js +48 -79
- package/button/internal/button.js.map +1 -1
- package/button/internal/elevated-styles.css.js +1 -1
- package/button/internal/elevated-styles.css.js.map +1 -1
- package/button/internal/filled-styles.css.js +1 -1
- package/button/internal/filled-styles.css.js.map +1 -1
- package/button/internal/{tonal-button.d.ts → filled-tonal-button.d.ts} +2 -2
- package/button/internal/{tonal-button.js → filled-tonal-button.js} +3 -3
- package/button/internal/filled-tonal-button.js.map +1 -0
- package/button/internal/filled-tonal-styles.css.js +9 -0
- package/button/internal/filled-tonal-styles.css.js.map +1 -0
- package/button/internal/{tonal-styles.scss → filled-tonal-styles.scss} +2 -2
- 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/button/internal/text-styles.css.js +1 -1
- package/button/internal/text-styles.css.js.map +1 -1
- package/checkbox/internal/_checkbox.scss +23 -78
- 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 +78 -7
- package/checkbox/internal/checkbox.js +136 -23
- package/checkbox/internal/checkbox.js.map +1 -1
- package/chips/assist-chip.js +1 -2
- package/chips/assist-chip.js.map +1 -1
- package/chips/filter-chip.js +1 -3
- package/chips/filter-chip.js.map +1 -1
- package/chips/input-chip.js +1 -5
- package/chips/input-chip.js.map +1 -1
- package/chips/internal/_assist-chip.scss +6 -0
- package/chips/internal/_elevated.scss +1 -1
- package/chips/internal/_filter-chip.scss +6 -0
- package/chips/internal/_input-chip.scss +32 -0
- package/chips/internal/_selectable.scss +17 -13
- package/chips/internal/_shared.scss +25 -10
- package/chips/internal/_suggestion-chip.scss +6 -0
- package/chips/internal/_trailing-icon.scss +24 -24
- package/chips/internal/assist-styles.css.js +1 -1
- package/chips/internal/assist-styles.css.js.map +1 -1
- package/chips/internal/chip-set.js +1 -3
- package/chips/internal/chip-set.js.map +1 -1
- package/chips/internal/chip.js +1 -3
- package/chips/internal/chip.js.map +1 -1
- package/chips/internal/elevated-styles.css.js +1 -1
- package/chips/internal/elevated-styles.css.js.map +1 -1
- package/chips/internal/filter-chip.d.ts +1 -0
- package/chips/internal/filter-chip.js +12 -6
- package/chips/internal/filter-chip.js.map +1 -1
- package/chips/internal/filter-styles.css.js +1 -1
- package/chips/internal/filter-styles.css.js.map +1 -1
- package/chips/internal/input-styles.css.js +1 -1
- package/chips/internal/input-styles.css.js.map +1 -1
- package/chips/internal/selectable-styles.css.js +1 -1
- package/chips/internal/selectable-styles.css.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/suggestion-styles.css.js +1 -1
- package/chips/internal/suggestion-styles.css.js.map +1 -1
- package/chips/internal/trailing-icon-styles.css.js +1 -1
- package/chips/internal/trailing-icon-styles.css.js.map +1 -1
- package/chips/suggestion-chip.js +1 -2
- package/chips/suggestion-chip.js.map +1 -1
- package/common.d.ts +2 -6
- package/common.js +2 -6
- package/common.js.map +1 -1
- package/dialog/harness.d.ts +1 -6
- package/dialog/harness.js +2 -43
- package/dialog/harness.js.map +1 -1
- package/dialog/internal/_dialog.scss +165 -281
- package/dialog/internal/animations.d.ts +47 -0
- package/dialog/internal/animations.js +117 -0
- package/dialog/internal/animations.js.map +1 -0
- 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 +76 -169
- package/dialog/internal/dialog.js +251 -475
- package/dialog/internal/dialog.js.map +1 -1
- package/elevation/internal/_elevation.scss +14 -7
- package/elevation/internal/elevation-styles.css.js +1 -1
- package/elevation/internal/elevation-styles.css.js.map +1 -1
- package/fab/branded-fab.d.ts +0 -1
- package/fab/internal/_fab.scss +15 -10
- package/fab/internal/_shared.scss +16 -1
- package/fab/internal/fab-styles.css.js +1 -1
- package/fab/internal/fab-styles.css.js.map +1 -1
- package/fab/internal/fab.d.ts +0 -1
- package/fab/internal/shared-styles.css.js +1 -1
- package/fab/internal/shared-styles.css.js.map +1 -1
- package/fab/internal/shared.d.ts +0 -13
- package/fab/internal/shared.js +5 -31
- package/fab/internal/shared.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/focus/internal/_focus-ring.scss +52 -48
- package/focus/internal/focus-ring-styles.css.js +1 -1
- package/focus/internal/focus-ring-styles.css.js.map +1 -1
- package/focus/internal/focus-ring.d.ts +2 -1
- package/focus/internal/focus-ring.js +10 -0
- package/focus/internal/focus-ring.js.map +1 -1
- package/icon/internal/_icon.scss +26 -20
- package/icon/internal/icon-styles.css.js +1 -1
- package/icon/internal/icon-styles.css.js.map +1 -1
- package/icon/internal/icon.d.ts +1 -0
- package/icon/internal/icon.js +9 -0
- package/icon/internal/icon.js.map +1 -1
- package/iconbutton/{_standard-icon-button.scss → _icon-button.scss} +1 -1
- package/iconbutton/{standard-icon-button.d.ts → icon-button.d.ts} +2 -2
- package/iconbutton/{standard-icon-button.js → icon-button.js} +7 -7
- package/iconbutton/icon-button.js.map +1 -0
- package/iconbutton/internal/_filled-icon-button.scss +8 -6
- package/iconbutton/internal/_filled-tonal-icon-button.scss +8 -6
- package/iconbutton/internal/{_standard-icon-button.scss → _icon-button.scss} +12 -8
- package/iconbutton/internal/_outlined-icon-button.scss +14 -14
- package/iconbutton/internal/_shared.scss +15 -9
- package/iconbutton/internal/filled-styles.css.js +1 -1
- package/iconbutton/internal/filled-styles.css.js.map +1 -1
- package/iconbutton/internal/filled-tonal-styles.css.js +1 -1
- package/iconbutton/internal/filled-tonal-styles.css.js.map +1 -1
- package/iconbutton/internal/icon-button.d.ts +25 -3
- package/iconbutton/internal/icon-button.js +45 -6
- package/iconbutton/internal/icon-button.js.map +1 -1
- package/iconbutton/internal/outlined-styles.css.js +1 -1
- package/iconbutton/internal/outlined-styles.css.js.map +1 -1
- package/iconbutton/internal/shared-styles.css.js +1 -1
- package/iconbutton/internal/shared-styles.css.js.map +1 -1
- package/iconbutton/internal/standard-styles.css.js +1 -1
- package/iconbutton/internal/standard-styles.css.js.map +1 -1
- package/iconbutton/internal/standard-styles.scss +2 -2
- package/internal/aria/delegate.d.ts +1 -1
- package/internal/aria/delegate.js +1 -1
- package/internal/aria/delegate.js.map +1 -1
- package/internal/controller/element-internals.d.ts +35 -0
- package/internal/controller/element-internals.js +24 -0
- package/internal/controller/element-internals.js.map +1 -0
- package/internal/controller/form-submitter.d.ts +72 -0
- package/internal/controller/form-submitter.js +71 -0
- package/internal/controller/form-submitter.js.map +1 -0
- package/labs/badge/internal/_badge.scss +11 -8
- package/labs/navigationbar/internal/_navigation-bar.scss +11 -9
- package/labs/navigationbar/internal/navigation-bar-styles.css.js +1 -1
- package/labs/navigationbar/internal/navigation-bar-styles.css.js.map +1 -1
- package/labs/navigationbar/internal/navigation-bar.js +1 -3
- package/labs/navigationbar/internal/navigation-bar.js.map +1 -1
- package/labs/navigationdrawer/internal/_navigation-drawer-modal.scss +11 -8
- package/labs/navigationdrawer/internal/_navigation-drawer.scss +11 -8
- package/labs/navigationdrawer/internal/navigation-drawer-modal-styles.css.js +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-modal-styles.css.js.map +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-modal.js +1 -3
- package/labs/navigationdrawer/internal/navigation-drawer-modal.js.map +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-styles.css.js +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer-styles.css.js.map +1 -1
- package/labs/navigationdrawer/internal/navigation-drawer.js +1 -3
- package/labs/navigationdrawer/internal/navigation-drawer.js.map +1 -1
- package/labs/navigationtab/internal/_navigation-tab.scss +10 -10
- package/labs/navigationtab/internal/navigation-tab.js +1 -3
- package/labs/navigationtab/internal/navigation-tab.js.map +1 -1
- package/labs/segmentedbutton/internal/_outlined-segmented-button.scss +1 -3
- package/labs/segmentedbutton/internal/outlined-styles.css.js +1 -1
- package/labs/segmentedbutton/internal/outlined-styles.css.js.map +1 -1
- package/labs/segmentedbutton/internal/segmented-button.js +1 -3
- package/labs/segmentedbutton/internal/segmented-button.js.map +1 -1
- package/labs/segmentedbuttonset/internal/outlined-styles.css.js +1 -1
- package/labs/segmentedbuttonset/internal/outlined-styles.css.js.map +1 -1
- package/labs/segmentedbuttonset/internal/segmented-button-set.js +1 -3
- package/labs/segmentedbuttonset/internal/segmented-button-set.js.map +1 -1
- package/list/internal/_list.scss +6 -2
- package/list/internal/list-styles.css.js +1 -1
- package/list/internal/list-styles.css.js.map +1 -1
- package/list/internal/list.d.ts +2 -2
- package/list/internal/list.js +1 -3
- package/list/internal/list.js.map +1 -1
- package/list/internal/listitem/_list-item.scss +87 -131
- package/list/internal/listitem/forced-colors-styles.css.js +1 -1
- package/list/internal/listitem/forced-colors-styles.css.js.map +1 -1
- package/list/internal/listitem/forced-colors-styles.scss +6 -6
- 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 +15 -3
- package/list/internal/listitem/list-item.js +43 -10
- package/list/internal/listitem/list-item.js.map +1 -1
- package/menu/internal/_menu.scss +6 -3
- package/menu/internal/menu-styles.css.js +1 -1
- package/menu/internal/menu-styles.css.js.map +1 -1
- package/menu/internal/menu.js +9 -10
- package/menu/internal/menu.js.map +1 -1
- package/menu/internal/menuitem/_menu-item.scss +8 -5
- package/menu/internal/menuitem/forced-colors-styles.css.js +1 -1
- package/menu/internal/menuitem/forced-colors-styles.css.js.map +1 -1
- package/menu/internal/menuitem/forced-colors-styles.scss +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 +9 -0
- package/menu/internal/menuitem/menu-item.js +18 -4
- package/menu/internal/menuitem/menu-item.js.map +1 -1
- package/menu/internal/shared.d.ts +45 -38
- package/menu/internal/shared.js +29 -40
- package/menu/internal/shared.js.map +1 -1
- package/menu/internal/submenuitem/sub-menu-item.d.ts +22 -12
- package/menu/internal/submenuitem/sub-menu-item.js +39 -24
- package/menu/internal/submenuitem/sub-menu-item.js.map +1 -1
- package/menu/menu-item.d.ts +1 -1
- package/menu/menu-item.js +0 -1
- package/menu/menu-item.js.map +1 -1
- package/menu/menu.d.ts +1 -1
- package/menu/menu.js +0 -1
- package/menu/menu.js.map +1 -1
- package/menu/sub-menu-item.d.ts +1 -1
- package/menu/sub-menu-item.js +0 -1
- package/menu/sub-menu-item.js.map +1 -1
- package/package.json +1 -3
- package/progress/harness.js +2 -4
- package/progress/harness.js.map +1 -1
- package/progress/internal/_circular-progress.scss +4 -4
- package/progress/internal/_linear-progress.scss +93 -132
- 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 +1 -1
- 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 +0 -11
- package/progress/internal/linear-progress.js +4 -48
- package/progress/internal/linear-progress.js.map +1 -1
- package/progress/internal/progress.js +1 -3
- package/progress/internal/progress.js.map +1 -1
- package/radio/internal/_radio.scss +38 -24
- package/radio/internal/forced-colors-styles.css.js +1 -1
- package/radio/internal/forced-colors-styles.css.js.map +1 -1
- package/radio/internal/forced-colors-styles.scss +4 -4
- 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 +1 -1
- package/radio/internal/radio.js +7 -6
- package/radio/internal/radio.js.map +1 -1
- package/ripple/internal/_ripple.scss +1 -1
- package/ripple/internal/ripple-styles.css.js +1 -1
- package/ripple/internal/ripple-styles.css.js.map +1 -1
- package/select/internal/_filled-select.scss +2 -3
- package/select/internal/_outlined-select.scss +2 -3
- package/select/internal/_shared.scss +30 -1
- package/select/internal/filled-select-styles.css.js +1 -1
- package/select/internal/filled-select-styles.css.js.map +1 -1
- package/select/internal/outlined-select-styles.css.js +1 -1
- package/select/internal/outlined-select-styles.css.js.map +1 -1
- package/select/internal/select.d.ts +0 -5
- package/select/internal/select.js +11 -16
- package/select/internal/select.js.map +1 -1
- package/select/internal/selectoption/select-option.d.ts +5 -6
- package/select/internal/selectoption/select-option.js +8 -9
- package/select/internal/selectoption/select-option.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/internal/shared.d.ts +5 -9
- package/select/internal/shared.js +13 -11
- package/select/internal/shared.js.map +1 -1
- package/slider/internal/_slider.scss +33 -28
- package/slider/internal/forced-colors-styles.css.js +1 -1
- package/slider/internal/forced-colors-styles.css.js.map +1 -1
- 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 +22 -8
- package/slider/internal/slider.js +114 -25
- package/slider/internal/slider.js.map +1 -1
- package/switch/internal/_handle.scss +12 -12
- package/switch/internal/_icon.scss +8 -8
- package/switch/internal/_switch.scss +9 -1
- package/switch/internal/_track.scss +10 -10
- package/switch/internal/forced-colors-styles.css.js +1 -1
- package/switch/internal/forced-colors-styles.css.js.map +1 -1
- package/switch/internal/forced-colors-styles.scss +12 -12
- 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 +1 -1
- package/switch/internal/switch.js +3 -5
- package/switch/internal/switch.js.map +1 -1
- package/tabs/internal/_tab.scss +77 -21
- package/tabs/internal/_tabs.scss +1 -0
- 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 +3 -9
- package/tabs/internal/tab.js +4 -8
- package/tabs/internal/tab.js.map +1 -1
- package/tabs/internal/tabs.d.ts +1 -4
- package/tabs/internal/tabs.js +5 -10
- package/tabs/internal/tabs.js.map +1 -1
- package/textfield/harness.js +4 -0
- package/textfield/harness.js.map +1 -1
- package/textfield/internal/filled-styles.css.js +1 -1
- package/textfield/internal/filled-styles.css.js.map +1 -1
- package/textfield/internal/outlined-styles.css.js +1 -1
- package/textfield/internal/outlined-styles.css.js.map +1 -1
- package/textfield/internal/text-field.d.ts +11 -10
- package/textfield/internal/text-field.js +60 -35
- package/textfield/internal/text-field.js.map +1 -1
- package/tokens/_index.scss +1 -0
- package/tokens/_md-comp-checkbox.scss +16 -16
- package/tokens/_md-comp-dialog.scss +2 -1
- package/tokens/_md-comp-elevated-button.scss +14 -12
- package/tokens/_md-comp-filled-button.scss +14 -12
- package/tokens/_md-comp-filled-field.scss +2 -2
- package/tokens/_md-comp-filled-icon-button.scss +23 -8
- package/tokens/_md-comp-filled-select.scss +22 -1
- package/tokens/_md-comp-filled-text-field.scss +3 -1
- package/tokens/_md-comp-filled-tonal-button.scss +14 -12
- package/tokens/_md-comp-filled-tonal-icon-button.scss +23 -8
- package/tokens/_md-comp-icon-button.scss +24 -11
- package/tokens/_md-comp-icon.scss +32 -0
- package/tokens/_md-comp-list-item.scss +117 -103
- package/tokens/_md-comp-menu-item.scss +3 -3
- package/tokens/_md-comp-outlined-button.scss +14 -12
- package/tokens/_md-comp-outlined-field.scss +2 -1
- package/tokens/_md-comp-outlined-icon-button.scss +26 -12
- package/tokens/_md-comp-outlined-segmented-button.scss +2 -2
- package/tokens/_md-comp-outlined-select.scss +8 -0
- package/tokens/_md-comp-outlined-text-field.scss +3 -1
- package/tokens/_md-comp-radio-button.scss +20 -9
- package/tokens/_md-comp-switch.scss +66 -32
- package/tokens/_md-comp-text-button.scss +14 -12
- package/button/internal/tonal-button.js.map +0 -1
- package/button/internal/tonal-styles.css.js +0 -9
- package/button/internal/tonal-styles.css.js.map +0 -1
- package/button/tonal-button.js.map +0 -1
- package/chips/internal/assist-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/assist-forced-colors-styles.css.js +0 -9
- package/chips/internal/assist-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/assist-forced-colors-styles.scss +0 -27
- package/chips/internal/filter-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/filter-forced-colors-styles.css.js +0 -9
- package/chips/internal/filter-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/filter-forced-colors-styles.scss +0 -34
- package/chips/internal/input-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/input-forced-colors-styles.css.js +0 -9
- package/chips/internal/input-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/input-forced-colors-styles.scss +0 -39
- package/chips/internal/suggestion-forced-colors-styles.css.d.ts +0 -1
- package/chips/internal/suggestion-forced-colors-styles.css.js +0 -9
- package/chips/internal/suggestion-forced-colors-styles.css.js.map +0 -1
- package/chips/internal/suggestion-forced-colors-styles.scss +0 -27
- package/dialog/internal/_tokens.scss +0 -66
- package/icon/internal/_md-comp-icon.scss +0 -18
- package/iconbutton/standard-icon-button.js.map +0 -1
- package/internal/sass/_theme.scss +0 -249
- package/list/internal/listitemlink/list-item-link-only.d.ts +0 -23
- package/list/internal/listitemlink/list-item-link-only.js +0 -36
- package/list/internal/listitemlink/list-item-link-only.js.map +0 -1
- package/list/internal/listitemlink/list-item-link.d.ts +0 -18
- package/list/internal/listitemlink/list-item-link.js +0 -42
- package/list/internal/listitemlink/list-item-link.js.map +0 -1
- package/list/list-item-link.d.ts +0 -53
- package/list/list-item-link.js +0 -57
- package/list/list-item-link.js.map +0 -1
- package/menu/internal/menuitemlink/menu-item-link.d.ts +0 -23
- package/menu/internal/menuitemlink/menu-item-link.js +0 -49
- package/menu/internal/menuitemlink/menu-item-link.js.map +0 -1
- package/menu/menu-item-link.d.ts +0 -33
- package/menu/menu-item-link.js +0 -38
- package/menu/menu-item-link.js.map +0 -1
- /package/button/internal/{tonal-styles.css.d.ts → filled-tonal-styles.css.d.ts} +0 -0
|
@@ -30,18 +30,20 @@ $supported-tokens: (
|
|
|
30
30
|
'pressed-state-layer-color',
|
|
31
31
|
'pressed-state-layer-opacity',
|
|
32
32
|
'selected-container-color',
|
|
33
|
+
'toggle-focus-icon-color',
|
|
34
|
+
'toggle-hover-icon-color',
|
|
35
|
+
'toggle-hover-state-layer-color',
|
|
36
|
+
'toggle-icon-color',
|
|
37
|
+
'toggle-pressed-icon-color',
|
|
38
|
+
'toggle-pressed-state-layer-color',
|
|
33
39
|
'toggle-selected-focus-icon-color',
|
|
34
40
|
'toggle-selected-hover-icon-color',
|
|
35
41
|
'toggle-selected-hover-state-layer-color',
|
|
36
42
|
'toggle-selected-icon-color',
|
|
37
43
|
'toggle-selected-pressed-icon-color',
|
|
38
44
|
'toggle-selected-pressed-state-layer-color',
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
'toggle-unselected-hover-state-layer-color',
|
|
42
|
-
'toggle-unselected-icon-color',
|
|
43
|
-
'toggle-unselected-pressed-icon-color',
|
|
44
|
-
'toggle-unselected-pressed-state-layer-color',
|
|
45
|
+
// Note: filled icon buttons have three container colors,
|
|
46
|
+
// "container-color" for regular, then selected/unselected for toggle.
|
|
45
47
|
'unselected-container-color',
|
|
46
48
|
// go/keep-sorted end
|
|
47
49
|
);
|
|
@@ -50,8 +52,8 @@ $unsupported-tokens: (
|
|
|
50
52
|
// go/keep-sorted start
|
|
51
53
|
'focus-state-layer-color',
|
|
52
54
|
'focus-state-layer-opacity',
|
|
55
|
+
'toggle-focus-state-layer-color',
|
|
53
56
|
'toggle-selected-focus-state-layer-color',
|
|
54
|
-
'toggle-unselected-focus-state-layer-color',
|
|
55
57
|
// go/keep-sorted end
|
|
56
58
|
);
|
|
57
59
|
|
|
@@ -65,7 +67,20 @@ $_default: (
|
|
|
65
67
|
$tokens: values.validate(
|
|
66
68
|
md-comp-filled-icon-button.values($deps, $exclude-hardcoded-values),
|
|
67
69
|
$supported-tokens: $supported-tokens,
|
|
68
|
-
$unsupported-tokens: $unsupported-tokens
|
|
70
|
+
$unsupported-tokens: $unsupported-tokens,
|
|
71
|
+
$renamed-tokens: (
|
|
72
|
+
// TODO(b/292244480): remove default unselected prefix
|
|
73
|
+
'toggle-unselected-focus-icon-color': 'toggle-focus-icon-color',
|
|
74
|
+
'toggle-unselected-hover-icon-color': 'toggle-hover-icon-color',
|
|
75
|
+
'toggle-unselected-hover-state-layer-color':
|
|
76
|
+
'toggle-hover-state-layer-color',
|
|
77
|
+
'toggle-unselected-icon-color': 'toggle-icon-color',
|
|
78
|
+
'toggle-unselected-pressed-icon-color': 'toggle-pressed-icon-color',
|
|
79
|
+
'toggle-unselected-pressed-state-layer-color':
|
|
80
|
+
'toggle-pressed-state-layer-color',
|
|
81
|
+
'toggle-unselected-focus-state-layer-color':
|
|
82
|
+
'toggle-focus-state-layer-color'
|
|
83
|
+
)
|
|
69
84
|
);
|
|
70
85
|
|
|
71
86
|
@return $tokens;
|
|
@@ -137,9 +137,30 @@ $_default: (
|
|
|
137
137
|
'md-sys-typescale': md-sys-typescale.values(),
|
|
138
138
|
);
|
|
139
139
|
|
|
140
|
+
@function _get-override-tokens($exclude-hardcoded-values) {
|
|
141
|
+
// Values pulled from b/198759625 spreadsheet
|
|
142
|
+
@return (
|
|
143
|
+
// go/keep-sorted start
|
|
144
|
+
// TODO(b/259455114): remove when focus tokens update to 3px
|
|
145
|
+
'text-field-focus-active-indicator-height':
|
|
146
|
+
if($exclude-hardcoded-values, null, 3px),
|
|
147
|
+
// TODO(b/292242500): remove once we upgrade tokens
|
|
148
|
+
'text-field-leading-icon-size': if($exclude-hardcoded-values, null, 24px),
|
|
149
|
+
// go/keep-sorted end
|
|
150
|
+
);
|
|
151
|
+
}
|
|
152
|
+
|
|
140
153
|
@function values($deps: $_default, $exclude-hardcoded-values: false) {
|
|
154
|
+
$original-tokens: md-comp-filled-select.values(
|
|
155
|
+
$deps,
|
|
156
|
+
$exclude-hardcoded-values
|
|
157
|
+
);
|
|
158
|
+
$original-tokens: map.merge(
|
|
159
|
+
$original-tokens,
|
|
160
|
+
_get-override-tokens($exclude-hardcoded-values)
|
|
161
|
+
);
|
|
141
162
|
$tokens: values.validate(
|
|
142
|
-
|
|
163
|
+
$original-tokens,
|
|
143
164
|
$supported-tokens: $supported-tokens,
|
|
144
165
|
$unsupported-tokens: $unsupported-tokens
|
|
145
166
|
);
|
|
@@ -126,13 +126,15 @@ $_default: (
|
|
|
126
126
|
$unsupported-tokens: $unsupported-tokens
|
|
127
127
|
);
|
|
128
128
|
|
|
129
|
-
// TODO(b/271876162): remove when tokens compiler emits typescale tokens
|
|
130
129
|
$tokens: map.merge(
|
|
131
130
|
$tokens,
|
|
132
131
|
(
|
|
132
|
+
// TODO(b/271876162): remove when tokens compiler emits typescale tokens
|
|
133
133
|
'input-text-type': map.get($deps, 'md-sys-typescale', 'body-large'),
|
|
134
134
|
'label-text-type': map.get($deps, 'md-sys-typescale', 'body-large'),
|
|
135
135
|
'supporting-text-type': map.get($deps, 'md-sys-typescale', 'body-small'),
|
|
136
|
+
// TODO(b/259455114): remove when focus tokens update to 3px
|
|
137
|
+
'focus-active-indicator-height': if($exclude-hardcoded-values, null, 3px)
|
|
136
138
|
)
|
|
137
139
|
);
|
|
138
140
|
|
|
@@ -42,17 +42,17 @@ $supported-tokens: (
|
|
|
42
42
|
'icon-size',
|
|
43
43
|
'label-text-color',
|
|
44
44
|
'label-text-type',
|
|
45
|
+
'leading-space',
|
|
45
46
|
'pressed-container-elevation',
|
|
46
47
|
'pressed-icon-color',
|
|
47
48
|
'pressed-label-text-color',
|
|
48
49
|
'pressed-state-layer-color',
|
|
49
50
|
'pressed-state-layer-opacity',
|
|
50
|
-
'
|
|
51
|
-
'
|
|
52
|
-
'with-icon-
|
|
53
|
-
'with-icon-
|
|
54
|
-
'with-trailing-icon-
|
|
55
|
-
'with-trailing-icon-spacing-trailing',
|
|
51
|
+
'trailing-space',
|
|
52
|
+
'with-leading-icon-leading-space',
|
|
53
|
+
'with-leading-icon-trailing-space',
|
|
54
|
+
'with-trailing-icon-leading-space',
|
|
55
|
+
'with-trailing-icon-trailing-space',
|
|
56
56
|
// go/keep-sorted end
|
|
57
57
|
);
|
|
58
58
|
|
|
@@ -84,13 +84,15 @@ $_default: (
|
|
|
84
84
|
$new-tokens: (
|
|
85
85
|
// TODO(b/198759625): Remove once spacing tokens are formally added
|
|
86
86
|
// go/keep-sorted start
|
|
87
|
-
'
|
|
88
|
-
'
|
|
89
|
-
'with-icon-
|
|
90
|
-
|
|
91
|
-
'with-
|
|
87
|
+
'leading-space': if($exclude-hardcoded-values, null, 24px),
|
|
88
|
+
'trailing-space': if($exclude-hardcoded-values, null, 24px),
|
|
89
|
+
'with-leading-icon-leading-space':
|
|
90
|
+
if($exclude-hardcoded-values, null, 16px),
|
|
91
|
+
'with-leading-icon-trailing-space':
|
|
92
|
+
if($exclude-hardcoded-values, null, 24px),
|
|
93
|
+
'with-trailing-icon-leading-space':
|
|
92
94
|
if($exclude-hardcoded-values, null, 24px),
|
|
93
|
-
'with-trailing-icon-
|
|
95
|
+
'with-trailing-icon-trailing-space':
|
|
94
96
|
if($exclude-hardcoded-values, null, 16px),
|
|
95
97
|
// go/keep-sorted end
|
|
96
98
|
),
|
|
@@ -30,18 +30,20 @@ $supported-tokens: (
|
|
|
30
30
|
'pressed-state-layer-color',
|
|
31
31
|
'pressed-state-layer-opacity',
|
|
32
32
|
'selected-container-color',
|
|
33
|
+
'toggle-focus-icon-color',
|
|
34
|
+
'toggle-hover-icon-color',
|
|
35
|
+
'toggle-hover-state-layer-color',
|
|
36
|
+
'toggle-icon-color',
|
|
37
|
+
'toggle-pressed-icon-color',
|
|
38
|
+
'toggle-pressed-state-layer-color',
|
|
33
39
|
'toggle-selected-focus-icon-color',
|
|
34
40
|
'toggle-selected-hover-icon-color',
|
|
35
41
|
'toggle-selected-hover-state-layer-color',
|
|
36
42
|
'toggle-selected-icon-color',
|
|
37
43
|
'toggle-selected-pressed-icon-color',
|
|
38
44
|
'toggle-selected-pressed-state-layer-color',
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
'toggle-unselected-hover-state-layer-color',
|
|
42
|
-
'toggle-unselected-icon-color',
|
|
43
|
-
'toggle-unselected-pressed-icon-color',
|
|
44
|
-
'toggle-unselected-pressed-state-layer-color',
|
|
45
|
+
// Note: filled icon buttons have three container colors,
|
|
46
|
+
// "container-color" for regular, then selected/unselected for toggle.
|
|
45
47
|
'unselected-container-color',
|
|
46
48
|
// go/keep-sorted end
|
|
47
49
|
);
|
|
@@ -50,8 +52,8 @@ $unsupported-tokens: (
|
|
|
50
52
|
// go/keep-sorted start
|
|
51
53
|
'focus-state-layer-color',
|
|
52
54
|
'focus-state-layer-opacity',
|
|
55
|
+
'toggle-focus-state-layer-color',
|
|
53
56
|
'toggle-selected-focus-state-layer-color',
|
|
54
|
-
'toggle-unselected-focus-state-layer-color',
|
|
55
57
|
// go/keep-sorted end
|
|
56
58
|
);
|
|
57
59
|
|
|
@@ -65,7 +67,20 @@ $_default: (
|
|
|
65
67
|
$tokens: values.validate(
|
|
66
68
|
md-comp-filled-tonal-icon-button.values($deps, $exclude-hardcoded-values),
|
|
67
69
|
$supported-tokens: $supported-tokens,
|
|
68
|
-
$unsupported-tokens: $unsupported-tokens
|
|
70
|
+
$unsupported-tokens: $unsupported-tokens,
|
|
71
|
+
$renamed-tokens: (
|
|
72
|
+
// TODO(b/292244480): remove default unselected prefix
|
|
73
|
+
'toggle-unselected-focus-icon-color': 'toggle-focus-icon-color',
|
|
74
|
+
'toggle-unselected-hover-icon-color': 'toggle-hover-icon-color',
|
|
75
|
+
'toggle-unselected-hover-state-layer-color':
|
|
76
|
+
'toggle-hover-state-layer-color',
|
|
77
|
+
'toggle-unselected-icon-color': 'toggle-icon-color',
|
|
78
|
+
'toggle-unselected-pressed-icon-color': 'toggle-pressed-icon-color',
|
|
79
|
+
'toggle-unselected-pressed-state-layer-color':
|
|
80
|
+
'toggle-pressed-state-layer-color',
|
|
81
|
+
'toggle-unselected-focus-state-layer-color':
|
|
82
|
+
'toggle-focus-state-layer-color'
|
|
83
|
+
)
|
|
69
84
|
);
|
|
70
85
|
|
|
71
86
|
@return $tokens;
|
|
@@ -15,7 +15,15 @@ $supported-tokens: (
|
|
|
15
15
|
// go/keep-sorted start
|
|
16
16
|
'disabled-icon-color',
|
|
17
17
|
'disabled-icon-opacity',
|
|
18
|
+
'focus-icon-color',
|
|
19
|
+
'hover-icon-color',
|
|
20
|
+
'hover-state-layer-color',
|
|
21
|
+
'hover-state-layer-opacity',
|
|
22
|
+
'icon-color',
|
|
18
23
|
'icon-size',
|
|
24
|
+
'pressed-icon-color',
|
|
25
|
+
'pressed-state-layer-color',
|
|
26
|
+
'pressed-state-layer-opacity',
|
|
19
27
|
'selected-focus-icon-color',
|
|
20
28
|
'selected-hover-icon-color',
|
|
21
29
|
'selected-hover-state-layer-color',
|
|
@@ -26,23 +34,15 @@ $supported-tokens: (
|
|
|
26
34
|
'selected-pressed-state-layer-opacity',
|
|
27
35
|
'state-layer-shape',
|
|
28
36
|
'state-layer-size',
|
|
29
|
-
'unselected-focus-icon-color',
|
|
30
|
-
'unselected-hover-icon-color',
|
|
31
|
-
'unselected-hover-state-layer-color',
|
|
32
|
-
'unselected-hover-state-layer-opacity',
|
|
33
|
-
'unselected-icon-color',
|
|
34
|
-
'unselected-pressed-icon-color',
|
|
35
|
-
'unselected-pressed-state-layer-color',
|
|
36
|
-
'unselected-pressed-state-layer-opacity',
|
|
37
37
|
// go/keep-sorted end
|
|
38
38
|
);
|
|
39
39
|
|
|
40
40
|
$unsupported-tokens: (
|
|
41
41
|
// go/keep-sorted start
|
|
42
|
+
'focus-state-layer-color',
|
|
43
|
+
'focus-state-layer-opacity',
|
|
42
44
|
'selected-focus-state-layer-color',
|
|
43
45
|
'selected-focus-state-layer-opacity',
|
|
44
|
-
'unselected-focus-state-layer-color',
|
|
45
|
-
'unselected-focus-state-layer-opacity',
|
|
46
46
|
// go/keep-sorted end
|
|
47
47
|
);
|
|
48
48
|
|
|
@@ -56,7 +56,20 @@ $_default: (
|
|
|
56
56
|
$tokens: values.validate(
|
|
57
57
|
md-comp-icon-button.values($deps, $exclude-hardcoded-values),
|
|
58
58
|
$supported-tokens: $supported-tokens,
|
|
59
|
-
$unsupported-tokens: $unsupported-tokens
|
|
59
|
+
$unsupported-tokens: $unsupported-tokens,
|
|
60
|
+
$renamed-tokens: (
|
|
61
|
+
// TODO(b/292244480): remove default unselected prefix
|
|
62
|
+
'unselected-focus-icon-color': 'focus-icon-color',
|
|
63
|
+
'unselected-hover-icon-color': 'hover-icon-color',
|
|
64
|
+
'unselected-hover-state-layer-color': 'hover-state-layer-color',
|
|
65
|
+
'unselected-hover-state-layer-opacity': 'hover-state-layer-opacity',
|
|
66
|
+
'unselected-icon-color': 'icon-color',
|
|
67
|
+
'unselected-pressed-icon-color': 'pressed-icon-color',
|
|
68
|
+
'unselected-pressed-state-layer-color': 'pressed-state-layer-color',
|
|
69
|
+
'unselected-pressed-state-layer-opacity': 'pressed-state-layer-opacity',
|
|
70
|
+
'unselected-focus-state-layer-color': 'focus-state-layer-color',
|
|
71
|
+
'unselected-focus-state-layer-opacity': 'focus-state-layer-opacity'
|
|
72
|
+
)
|
|
60
73
|
);
|
|
61
74
|
|
|
62
75
|
@return $tokens;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
//
|
|
2
|
+
// Copyright 2023 Google LLC
|
|
3
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
4
|
+
//
|
|
5
|
+
|
|
6
|
+
// go/keep-sorted start
|
|
7
|
+
@use './values';
|
|
8
|
+
// go/keep-sorted end
|
|
9
|
+
|
|
10
|
+
$supported-tokens: (
|
|
11
|
+
// go/keep-sorted start
|
|
12
|
+
'font',
|
|
13
|
+
// go/keep-sorted end
|
|
14
|
+
);
|
|
15
|
+
|
|
16
|
+
@function _get-new-tokens($exclude-hardcoded-values) {
|
|
17
|
+
@return (
|
|
18
|
+
// go/keep-sorted start
|
|
19
|
+
font: if($exclude-hardcoded-values, null, 'Material Symbols Outlined'),
|
|
20
|
+
// go/keep-sorted end
|
|
21
|
+
);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
@function values($exclude-hardcoded-values: false) {
|
|
25
|
+
$tokens: values.validate(
|
|
26
|
+
(),
|
|
27
|
+
$supported-tokens: $supported-tokens,
|
|
28
|
+
$new-tokens: _get-new-tokens($exclude-hardcoded-values)
|
|
29
|
+
);
|
|
30
|
+
|
|
31
|
+
@return $tokens;
|
|
32
|
+
}
|
|
@@ -4,7 +4,9 @@
|
|
|
4
4
|
//
|
|
5
5
|
|
|
6
6
|
// go/keep-sorted start
|
|
7
|
+
@use 'sass:list';
|
|
7
8
|
@use 'sass:map';
|
|
9
|
+
@use 'sass:string';
|
|
8
10
|
// go/keep-sorted end
|
|
9
11
|
// go/keep-sorted start
|
|
10
12
|
@use './md-sys-color';
|
|
@@ -18,102 +20,102 @@
|
|
|
18
20
|
|
|
19
21
|
$supported-tokens: (
|
|
20
22
|
// go/keep-sorted start
|
|
21
|
-
'
|
|
22
|
-
'
|
|
23
|
-
'
|
|
24
|
-
'
|
|
25
|
-
'
|
|
26
|
-
'
|
|
27
|
-
'
|
|
28
|
-
'
|
|
29
|
-
'
|
|
30
|
-
'
|
|
31
|
-
'
|
|
32
|
-
'
|
|
33
|
-
'
|
|
34
|
-
'
|
|
35
|
-
'
|
|
36
|
-
'
|
|
37
|
-
'
|
|
38
|
-
'
|
|
39
|
-
'
|
|
40
|
-
'
|
|
41
|
-
'
|
|
42
|
-
'
|
|
43
|
-
'
|
|
44
|
-
'
|
|
45
|
-
'
|
|
46
|
-
'
|
|
47
|
-
'
|
|
48
|
-
'
|
|
49
|
-
'
|
|
50
|
-
'
|
|
51
|
-
'
|
|
52
|
-
'
|
|
53
|
-
'
|
|
54
|
-
'
|
|
55
|
-
'
|
|
56
|
-
'
|
|
57
|
-
'
|
|
58
|
-
'
|
|
59
|
-
'
|
|
60
|
-
'
|
|
61
|
-
'
|
|
62
|
-
'
|
|
63
|
-
'
|
|
64
|
-
'
|
|
65
|
-
'
|
|
66
|
-
'
|
|
67
|
-
'
|
|
68
|
-
'
|
|
69
|
-
'
|
|
70
|
-
'
|
|
71
|
-
'
|
|
72
|
-
'
|
|
73
|
-
'
|
|
23
|
+
'container-color',
|
|
24
|
+
'container-shape',
|
|
25
|
+
'disabled-label-text-color',
|
|
26
|
+
'disabled-label-text-opacity',
|
|
27
|
+
'disabled-leading-icon-color',
|
|
28
|
+
'disabled-leading-icon-opacity',
|
|
29
|
+
'disabled-trailing-icon-color',
|
|
30
|
+
'disabled-trailing-icon-opacity',
|
|
31
|
+
'focus-label-text-color',
|
|
32
|
+
'focus-leading-icon-icon-color',
|
|
33
|
+
'focus-trailing-icon-icon-color',
|
|
34
|
+
'hover-label-text-color',
|
|
35
|
+
'hover-leading-icon-icon-color',
|
|
36
|
+
'hover-state-layer-color',
|
|
37
|
+
'hover-state-layer-opacity',
|
|
38
|
+
'hover-trailing-icon-icon-color',
|
|
39
|
+
'label-text-color',
|
|
40
|
+
'label-text-line-height',
|
|
41
|
+
'label-text-type',
|
|
42
|
+
'large-leading-video-height',
|
|
43
|
+
'leading-avatar-color',
|
|
44
|
+
'leading-avatar-label-color',
|
|
45
|
+
'leading-avatar-label-type',
|
|
46
|
+
'leading-avatar-shape',
|
|
47
|
+
'leading-avatar-size',
|
|
48
|
+
'leading-element-leading-space',
|
|
49
|
+
'leading-icon-color',
|
|
50
|
+
'leading-icon-size',
|
|
51
|
+
'leading-image-height',
|
|
52
|
+
'leading-image-shape',
|
|
53
|
+
'leading-image-width',
|
|
54
|
+
'leading-space',
|
|
55
|
+
'leading-video-leading-space',
|
|
56
|
+
'leading-video-shape',
|
|
57
|
+
'leading-video-width',
|
|
58
|
+
'one-line-container-height',
|
|
59
|
+
'pressed-label-text-color',
|
|
60
|
+
'pressed-leading-icon-icon-color',
|
|
61
|
+
'pressed-state-layer-color',
|
|
62
|
+
'pressed-state-layer-opacity',
|
|
63
|
+
'pressed-trailing-icon-icon-color',
|
|
64
|
+
'small-leading-video-height',
|
|
65
|
+
'supporting-text-color',
|
|
66
|
+
'supporting-text-type',
|
|
67
|
+
'three-line-container-height',
|
|
68
|
+
'trailing-element-headline-trailing-element-space',
|
|
69
|
+
'trailing-icon-color',
|
|
70
|
+
'trailing-icon-size',
|
|
71
|
+
'trailing-space',
|
|
72
|
+
'trailing-supporting-text-color',
|
|
73
|
+
'trailing-supporting-text-line-height',
|
|
74
|
+
'trailing-supporting-text-type',
|
|
75
|
+
'two-line-container-height',
|
|
74
76
|
// go/keep-sorted end
|
|
75
77
|
);
|
|
76
78
|
|
|
77
79
|
$unsupported-tokens: (
|
|
78
80
|
// go/keep-sorted start
|
|
79
|
-
'
|
|
80
|
-
'
|
|
81
|
-
'
|
|
82
|
-
'
|
|
83
|
-
'
|
|
84
|
-
'
|
|
85
|
-
'
|
|
86
|
-
'
|
|
87
|
-
'
|
|
88
|
-
'
|
|
89
|
-
'
|
|
90
|
-
'
|
|
91
|
-
'
|
|
92
|
-
'
|
|
93
|
-
'
|
|
94
|
-
'
|
|
95
|
-
'
|
|
96
|
-
'
|
|
97
|
-
'
|
|
98
|
-
'
|
|
99
|
-
'
|
|
100
|
-
'
|
|
101
|
-
'
|
|
102
|
-
'
|
|
103
|
-
'
|
|
104
|
-
'
|
|
105
|
-
'
|
|
106
|
-
'
|
|
107
|
-
'
|
|
108
|
-
'
|
|
109
|
-
'
|
|
110
|
-
'
|
|
111
|
-
'
|
|
112
|
-
'
|
|
113
|
-
'
|
|
114
|
-
'
|
|
115
|
-
'
|
|
116
|
-
'
|
|
81
|
+
'container-elevation',
|
|
82
|
+
'disabled-state-layer-color',
|
|
83
|
+
'disabled-state-layer-opacity',
|
|
84
|
+
'dragged-container-elevation',
|
|
85
|
+
'dragged-label-text-color',
|
|
86
|
+
'dragged-leading-icon-icon-color',
|
|
87
|
+
'dragged-state-layer-color',
|
|
88
|
+
'dragged-state-layer-opacity',
|
|
89
|
+
'dragged-trailing-icon-icon-color',
|
|
90
|
+
'focus-state-layer-color',
|
|
91
|
+
'focus-state-layer-opacity',
|
|
92
|
+
'label-text-font',
|
|
93
|
+
'label-text-size',
|
|
94
|
+
'label-text-tracking',
|
|
95
|
+
'label-text-weight',
|
|
96
|
+
'leading-avatar-label-font',
|
|
97
|
+
'leading-avatar-label-line-height',
|
|
98
|
+
'leading-avatar-label-size',
|
|
99
|
+
'leading-avatar-label-tracking',
|
|
100
|
+
'leading-avatar-label-weight',
|
|
101
|
+
'overline-color',
|
|
102
|
+
'overline-font',
|
|
103
|
+
'overline-line-height',
|
|
104
|
+
'overline-size',
|
|
105
|
+
'overline-tracking',
|
|
106
|
+
'overline-type',
|
|
107
|
+
'overline-weight',
|
|
108
|
+
'selected-trailing-icon-color',
|
|
109
|
+
'supporting-text-font',
|
|
110
|
+
'supporting-text-line-height',
|
|
111
|
+
'supporting-text-size',
|
|
112
|
+
'supporting-text-tracking',
|
|
113
|
+
'supporting-text-weight',
|
|
114
|
+
'trailing-supporting-text-font',
|
|
115
|
+
'trailing-supporting-text-size',
|
|
116
|
+
'trailing-supporting-text-tracking',
|
|
117
|
+
'trailing-supporting-text-weight',
|
|
118
|
+
'unselected-trailing-icon-color',
|
|
117
119
|
// go/keep-sorted end
|
|
118
120
|
);
|
|
119
121
|
|
|
@@ -133,29 +135,41 @@ $_default: (
|
|
|
133
135
|
$original-tokens,
|
|
134
136
|
$supported-tokens: $supported-tokens,
|
|
135
137
|
$unsupported-tokens: $unsupported-tokens,
|
|
136
|
-
$new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values)
|
|
138
|
+
$new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values),
|
|
139
|
+
$renamed-tokens: _get-renamed-tokens($original-tokens)
|
|
137
140
|
);
|
|
138
141
|
|
|
139
142
|
@return $tokens;
|
|
140
143
|
}
|
|
141
144
|
|
|
145
|
+
// remove list-item prefix from tokens
|
|
146
|
+
@function _get-renamed-tokens($tokens) {
|
|
147
|
+
$keys: map.keys($tokens);
|
|
148
|
+
$renamed-tokens: ();
|
|
149
|
+
|
|
150
|
+
@each $key in $keys {
|
|
151
|
+
$renamed-key: string.slice($key, string.length('list-item-') + 1);
|
|
152
|
+
$renamed-tokens: map.set($renamed-tokens, $key, $renamed-key);
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
@return $renamed-tokens;
|
|
156
|
+
}
|
|
157
|
+
|
|
142
158
|
@function _get-new-tokens($deps, $exclude-hardcoded-values) {
|
|
143
159
|
// Values pulled from b/198759625 spreadsheet
|
|
144
160
|
@return (
|
|
145
161
|
// go/keep-sorted start
|
|
146
|
-
'
|
|
147
|
-
|
|
148
|
-
'
|
|
149
|
-
'list-item-leading-video-leading-space':
|
|
150
|
-
if($exclude-hardcoded-values, null, 0px),
|
|
162
|
+
'leading-element-leading-space': if($exclude-hardcoded-values, null, 16px),
|
|
163
|
+
'leading-space': if($exclude-hardcoded-values, null, 16px),
|
|
164
|
+
'leading-video-leading-space': if($exclude-hardcoded-values, null, 0px),
|
|
151
165
|
// Commented out until the comments in the spreadsheet linked above are
|
|
152
166
|
// resolved regarding vertical alignment.
|
|
153
|
-
// '
|
|
154
|
-
// '
|
|
155
|
-
// '
|
|
156
|
-
// '
|
|
157
|
-
'
|
|
158
|
-
'
|
|
167
|
+
// 'leading-item-top-space': if($exclude-hardcoded-values, null, 8px),
|
|
168
|
+
// 'leading-video-top-space': if($exclude-hardcoded-values, null, 0px),
|
|
169
|
+
// 'leading-item-bottom-space': if($exclude-hardcoded-values, null, 8px),
|
|
170
|
+
// 'leading-video-bottom-space': if($exclude-hardcoded-values, null, 0px),
|
|
171
|
+
'trailing-element-headline-trailing-element-space': 16px,
|
|
172
|
+
'trailing-space': if($exclude-hardcoded-values, null, 24px),
|
|
159
173
|
// go/keep-sorted end
|
|
160
174
|
);
|
|
161
175
|
}
|
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
|
|
19
19
|
$supported-tokens: (
|
|
20
20
|
// go/keep-sorted start
|
|
21
|
-
'
|
|
22
|
-
'
|
|
21
|
+
'container-color',
|
|
22
|
+
'selected-container-color',
|
|
23
23
|
// go/keep-sorted end
|
|
24
24
|
);
|
|
25
25
|
|
|
@@ -43,7 +43,7 @@ $_default: (
|
|
|
43
43
|
$supported-tokens: $supported-tokens,
|
|
44
44
|
$unsupported-tokens: $unsupported-tokens,
|
|
45
45
|
$renamed-tokens: (
|
|
46
|
-
'container-color': '
|
|
46
|
+
'list-item-selected-container-color': 'selected-container-color',
|
|
47
47
|
)
|
|
48
48
|
);
|
|
49
49
|
|
|
@@ -35,6 +35,7 @@ $supported-tokens: (
|
|
|
35
35
|
'icon-size',
|
|
36
36
|
'label-text-color',
|
|
37
37
|
'label-text-type',
|
|
38
|
+
'leading-space',
|
|
38
39
|
'outline-color',
|
|
39
40
|
'outline-width',
|
|
40
41
|
'pressed-icon-color',
|
|
@@ -42,12 +43,11 @@ $supported-tokens: (
|
|
|
42
43
|
'pressed-outline-color',
|
|
43
44
|
'pressed-state-layer-color',
|
|
44
45
|
'pressed-state-layer-opacity',
|
|
45
|
-
'
|
|
46
|
-
'
|
|
47
|
-
'with-icon-
|
|
48
|
-
'with-icon-
|
|
49
|
-
'with-trailing-icon-
|
|
50
|
-
'with-trailing-icon-spacing-trailing',
|
|
46
|
+
'trailing-space',
|
|
47
|
+
'with-leading-icon-leading-space',
|
|
48
|
+
'with-leading-icon-trailing-space',
|
|
49
|
+
'with-trailing-icon-leading-space',
|
|
50
|
+
'with-trailing-icon-trailing-space',
|
|
51
51
|
// go/keep-sorted end
|
|
52
52
|
);
|
|
53
53
|
|
|
@@ -80,13 +80,15 @@ $_default: (
|
|
|
80
80
|
$new-tokens: (
|
|
81
81
|
// TODO(b/198759625): Remove once spacing tokens are formally added
|
|
82
82
|
// go/keep-sorted start
|
|
83
|
-
'
|
|
84
|
-
'
|
|
85
|
-
'with-icon-
|
|
86
|
-
|
|
87
|
-
'with-
|
|
83
|
+
'leading-space': if($exclude-hardcoded-values, null, 24px),
|
|
84
|
+
'trailing-space': if($exclude-hardcoded-values, null, 24px),
|
|
85
|
+
'with-leading-icon-leading-space':
|
|
86
|
+
if($exclude-hardcoded-values, null, 16px),
|
|
87
|
+
'with-leading-icon-trailing-space':
|
|
88
|
+
if($exclude-hardcoded-values, null, 24px),
|
|
89
|
+
'with-trailing-icon-leading-space':
|
|
88
90
|
if($exclude-hardcoded-values, null, 24px),
|
|
89
|
-
'with-trailing-icon-
|
|
91
|
+
'with-trailing-icon-trailing-space':
|
|
90
92
|
if($exclude-hardcoded-values, null, 16px),
|
|
91
93
|
// go/keep-sorted end
|
|
92
94
|
),
|
|
@@ -166,7 +166,8 @@ $_default: (
|
|
|
166
166
|
'focus-leading-content-color':
|
|
167
167
|
map.get($text-field, 'focus-leading-icon-color'),
|
|
168
168
|
'focus-outline-color': map.get($text-field, 'focus-outline-color'),
|
|
169
|
-
|
|
169
|
+
// TODO(b/259455114): remove when focus tokens update to 3px
|
|
170
|
+
'focus-outline-width': if($exclude-hardcoded-values, null, 3px),
|
|
170
171
|
'focus-supporting-text-color':
|
|
171
172
|
map.get($text-field, 'focus-supporting-text-color'),
|
|
172
173
|
'focus-trailing-content-color':
|