@material/web 1.0.0-pre.7 → 1.0.0-pre.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (321) hide show
  1. package/README.md +3 -3
  2. package/aria/aria.js +37 -13
  3. package/aria/aria.js.map +1 -1
  4. package/aria/delegate.d.ts +1 -1
  5. package/aria/delegate.js +1 -1
  6. package/aria/delegate.js.map +1 -1
  7. package/badge/lib/badge.d.ts +0 -3
  8. package/badge/lib/badge.js +4 -6
  9. package/badge/lib/badge.js.map +1 -1
  10. package/button/lib/_elevated-button.scss +35 -6
  11. package/button/lib/_filled-button.scss +35 -3
  12. package/button/lib/_outlined-button.scss +35 -6
  13. package/button/lib/_shared.scss +4 -2
  14. package/button/lib/_text-button.scss +35 -6
  15. package/button/lib/_tonal-button.scss +34 -7
  16. package/button/lib/button.d.ts +23 -26
  17. package/button/lib/button.js +12 -30
  18. package/button/lib/button.js.map +1 -1
  19. package/button/lib/elevated-button.d.ts +6 -4
  20. package/button/lib/elevated-button.js.map +1 -1
  21. package/button/lib/elevated-styles.css.js +1 -1
  22. package/button/lib/elevated-styles.css.js.map +1 -1
  23. package/button/lib/filled-button.d.ts +6 -4
  24. package/button/lib/filled-button.js.map +1 -1
  25. package/button/lib/filled-styles.css.js +1 -1
  26. package/button/lib/filled-styles.css.js.map +1 -1
  27. package/button/lib/outlined-button.d.ts +6 -4
  28. package/button/lib/outlined-button.js.map +1 -1
  29. package/button/lib/outlined-styles.css.js +1 -1
  30. package/button/lib/outlined-styles.css.js.map +1 -1
  31. package/button/lib/shared-styles.css.js +1 -1
  32. package/button/lib/shared-styles.css.js.map +1 -1
  33. package/button/lib/text-button.d.ts +5 -2
  34. package/button/lib/text-button.js.map +1 -1
  35. package/button/lib/text-styles.css.js +1 -1
  36. package/button/lib/text-styles.css.js.map +1 -1
  37. package/button/lib/tonal-button.d.ts +6 -4
  38. package/button/lib/tonal-button.js.map +1 -1
  39. package/button/lib/tonal-styles.css.js +1 -1
  40. package/button/lib/tonal-styles.css.js.map +1 -1
  41. package/checkbox/lib/_checkbox.scss +48 -47
  42. package/checkbox/lib/checkbox-styles.css.js +1 -1
  43. package/checkbox/lib/checkbox-styles.css.js.map +1 -1
  44. package/checkbox/lib/checkbox.d.ts +2 -6
  45. package/checkbox/lib/checkbox.js +3 -20
  46. package/checkbox/lib/checkbox.js.map +1 -1
  47. package/checkbox/lib/forced-colors-styles.css.js +1 -1
  48. package/checkbox/lib/forced-colors-styles.css.js.map +1 -1
  49. package/chips/assist-chip.js +2 -1
  50. package/chips/assist-chip.js.map +1 -1
  51. package/chips/filter-chip.js +2 -1
  52. package/chips/filter-chip.js.map +1 -1
  53. package/chips/lib/_assist-chip.scss +37 -3
  54. package/chips/lib/_elevated.scss +60 -0
  55. package/chips/lib/_filter-chip.scss +43 -9
  56. package/chips/lib/_shared.scss +36 -76
  57. package/chips/lib/_suggestion-chip.scss +36 -5
  58. package/chips/lib/assist-chip.d.ts +12 -0
  59. package/chips/lib/assist-chip.js +64 -0
  60. package/chips/lib/assist-chip.js.map +1 -1
  61. package/chips/lib/assist-styles.css.js +1 -1
  62. package/chips/lib/assist-styles.css.js.map +1 -1
  63. package/chips/lib/chip.d.ts +19 -16
  64. package/chips/lib/chip.js +43 -63
  65. package/chips/lib/chip.js.map +1 -1
  66. package/chips/lib/elevated-styles.css.d.ts +1 -0
  67. package/chips/lib/elevated-styles.css.js +9 -0
  68. package/chips/lib/elevated-styles.css.js.map +1 -0
  69. package/chips/lib/elevated-styles.scss +10 -0
  70. package/chips/lib/filter-chip.d.ts +6 -1
  71. package/chips/lib/filter-chip.js +38 -5
  72. package/chips/lib/filter-chip.js.map +1 -1
  73. package/chips/lib/filter-styles.css.js +1 -1
  74. package/chips/lib/filter-styles.css.js.map +1 -1
  75. package/chips/lib/shared-styles.css.js +1 -1
  76. package/chips/lib/shared-styles.css.js.map +1 -1
  77. package/chips/lib/suggestion-chip.d.ts +2 -2
  78. package/chips/lib/suggestion-chip.js +4 -2
  79. package/chips/lib/suggestion-chip.js.map +1 -1
  80. package/chips/lib/suggestion-styles.css.js +1 -1
  81. package/chips/lib/suggestion-styles.css.js.map +1 -1
  82. package/chips/suggestion-chip.js +2 -1
  83. package/chips/suggestion-chip.js.map +1 -1
  84. package/circularprogress/lib/_circular-progress.scss +13 -7
  85. package/circularprogress/lib/circular-progress-styles.css.js +1 -1
  86. package/circularprogress/lib/circular-progress-styles.css.js.map +1 -1
  87. package/circularprogress/lib/circular-progress.d.ts +5 -6
  88. package/circularprogress/lib/circular-progress.js +1 -2
  89. package/circularprogress/lib/circular-progress.js.map +1 -1
  90. package/dialog/lib/_dialog.scss +0 -1
  91. package/dialog/lib/_tokens.scss +0 -1
  92. package/dialog/lib/dialog.d.ts +10 -10
  93. package/dialog/lib/dialog.js +8 -7
  94. package/dialog/lib/dialog.js.map +1 -1
  95. package/elevation/lib/elevation.d.ts +1 -1
  96. package/elevation/lib/elevation.js.map +1 -1
  97. package/fab/branded-fab.d.ts +3 -0
  98. package/fab/lib/_fab-branded.scss +58 -4
  99. package/fab/lib/_fab.scss +80 -6
  100. package/fab/lib/_shared.scss +8 -3
  101. package/fab/lib/fab-branded-styles.css.js +1 -1
  102. package/fab/lib/fab-branded-styles.css.js.map +1 -1
  103. package/fab/lib/fab-styles.css.js +1 -1
  104. package/fab/lib/fab-styles.css.js.map +1 -1
  105. package/fab/lib/fab.d.ts +4 -0
  106. package/fab/lib/forced-colors-styles.css.js +1 -1
  107. package/fab/lib/forced-colors-styles.css.js.map +1 -1
  108. package/fab/lib/shared-styles.css.js +1 -1
  109. package/fab/lib/shared-styles.css.js.map +1 -1
  110. package/fab/lib/shared.d.ts +12 -15
  111. package/fab/lib/shared.js +2 -26
  112. package/fab/lib/shared.js.map +1 -1
  113. package/field/lib/_filled-field.scss +47 -12
  114. package/field/lib/_outlined-field.scss +39 -12
  115. package/field/lib/filled-styles.css.js +1 -1
  116. package/field/lib/filled-styles.css.js.map +1 -1
  117. package/field/lib/outlined-styles.css.js +1 -1
  118. package/field/lib/outlined-styles.css.js.map +1 -1
  119. package/focus/focus-ring.d.ts +2 -0
  120. package/focus/focus-ring.js +2 -0
  121. package/focus/focus-ring.js.map +1 -1
  122. package/focus/lib/_focus-ring.scss +49 -34
  123. package/focus/lib/focus-ring-styles.css.js +1 -1
  124. package/focus/lib/focus-ring-styles.css.js.map +1 -1
  125. package/focus/lib/focus-ring.d.ts +59 -12
  126. package/focus/lib/focus-ring.js +116 -11
  127. package/focus/lib/focus-ring.js.map +1 -1
  128. package/iconbutton/filled-icon-button.d.ts +6 -2
  129. package/iconbutton/filled-icon-button.js.map +1 -1
  130. package/iconbutton/filled-tonal-icon-button.d.ts +6 -2
  131. package/iconbutton/filled-tonal-icon-button.js.map +1 -1
  132. package/iconbutton/harness.d.ts +1 -1
  133. package/iconbutton/harness.js +4 -1
  134. package/iconbutton/harness.js.map +1 -1
  135. package/iconbutton/lib/_filled-icon-button.scss +38 -13
  136. package/iconbutton/lib/_filled-tonal-icon-button.scss +38 -11
  137. package/iconbutton/lib/_outlined-icon-button.scss +38 -13
  138. package/iconbutton/lib/_shared.scss +4 -6
  139. package/iconbutton/lib/_standard-icon-button.scss +14 -14
  140. package/iconbutton/lib/filled-styles.css.js +1 -1
  141. package/iconbutton/lib/filled-styles.css.js.map +1 -1
  142. package/iconbutton/lib/filled-tonal-styles.css.js +1 -1
  143. package/iconbutton/lib/filled-tonal-styles.css.js.map +1 -1
  144. package/iconbutton/lib/icon-button.d.ts +17 -21
  145. package/iconbutton/lib/icon-button.js +12 -28
  146. package/iconbutton/lib/icon-button.js.map +1 -1
  147. package/iconbutton/lib/outlined-styles.css.js +1 -1
  148. package/iconbutton/lib/outlined-styles.css.js.map +1 -1
  149. package/iconbutton/lib/shared-styles.css.js +1 -1
  150. package/iconbutton/lib/shared-styles.css.js.map +1 -1
  151. package/iconbutton/lib/standard-styles.css.js +1 -1
  152. package/iconbutton/lib/standard-styles.css.js.map +1 -1
  153. package/iconbutton/outlined-icon-button.d.ts +5 -2
  154. package/iconbutton/outlined-icon-button.js.map +1 -1
  155. package/iconbutton/standard-icon-button.d.ts +5 -2
  156. package/iconbutton/standard-icon-button.js.map +1 -1
  157. package/linearprogress/lib/_linear-progress.scss +78 -72
  158. package/linearprogress/lib/linear-progress.d.ts +5 -5
  159. package/linearprogress/lib/linear-progress.js +1 -1
  160. package/linearprogress/lib/linear-progress.js.map +1 -1
  161. package/list/lib/_list.scss +4 -2
  162. package/list/lib/list.d.ts +7 -12
  163. package/list/lib/list.js +2 -11
  164. package/list/lib/list.js.map +1 -1
  165. package/list/lib/listitem/_list-item.scss +8 -4
  166. package/list/lib/listitem/list-item-styles.css.js +1 -1
  167. package/list/lib/listitem/list-item-styles.css.js.map +1 -1
  168. package/list/lib/listitem/list-item.d.ts +27 -27
  169. package/list/lib/listitem/list-item.js +4 -29
  170. package/list/lib/listitem/list-item.js.map +1 -1
  171. package/list/lib/listitemlink/list-item-link.js +1 -3
  172. package/list/lib/listitemlink/list-item-link.js.map +1 -1
  173. package/menu/lib/_menu.scss +4 -2
  174. package/menu/lib/menu-styles.css.js +1 -1
  175. package/menu/lib/menu-styles.css.js.map +1 -1
  176. package/menu/lib/menu.d.ts +31 -39
  177. package/menu/lib/menu.js +14 -20
  178. package/menu/lib/menu.js.map +1 -1
  179. package/menu/lib/menuitem/_menu-item.scss +4 -2
  180. package/menu/lib/shared.d.ts +14 -0
  181. package/menu/lib/shared.js +18 -0
  182. package/menu/lib/shared.js.map +1 -1
  183. package/menu/lib/submenuitem/sub-menu-item.d.ts +16 -11
  184. package/menu/lib/submenuitem/sub-menu-item.js +20 -3
  185. package/menu/lib/submenuitem/sub-menu-item.js.map +1 -1
  186. package/menu/lib/typeaheadController.d.ts +9 -9
  187. package/menu/lib/typeaheadController.js.map +1 -1
  188. package/navigationbar/lib/navigation-bar.d.ts +2 -2
  189. package/navigationbar/lib/navigation-bar.js.map +1 -1
  190. package/navigationdrawer/lib/_navigation-drawer-modal.scss +0 -3
  191. package/navigationdrawer/lib/_navigation-drawer.scss +0 -3
  192. package/navigationdrawer/lib/_shared.scss +1 -4
  193. package/navigationdrawer/lib/navigation-drawer-modal-styles.css.js +1 -1
  194. package/navigationdrawer/lib/navigation-drawer-modal-styles.css.js.map +1 -1
  195. package/navigationdrawer/lib/navigation-drawer-modal.d.ts +3 -3
  196. package/navigationdrawer/lib/navigation-drawer-modal.js.map +1 -1
  197. package/navigationdrawer/lib/navigation-drawer-styles.css.js +1 -1
  198. package/navigationdrawer/lib/navigation-drawer-styles.css.js.map +1 -1
  199. package/navigationdrawer/lib/navigation-drawer.d.ts +2 -2
  200. package/navigationdrawer/lib/navigation-drawer.js.map +1 -1
  201. package/navigationdrawer/lib/shared-styles.css.js +1 -1
  202. package/navigationdrawer/lib/shared-styles.css.js.map +1 -1
  203. package/navigationtab/lib/_navigation-tab.scss +2 -2
  204. package/navigationtab/lib/navigation-tab-styles.css.js +1 -1
  205. package/navigationtab/lib/navigation-tab-styles.css.js.map +1 -1
  206. package/navigationtab/lib/navigation-tab.d.ts +9 -17
  207. package/navigationtab/lib/navigation-tab.js +3 -22
  208. package/navigationtab/lib/navigation-tab.js.map +1 -1
  209. package/navigationtab/lib/state.d.ts +1 -1
  210. package/navigationtab/lib/state.js.map +1 -1
  211. package/package.json +1 -1
  212. package/radio/lib/_radio.scss +1 -1
  213. package/radio/lib/radio-styles.css.js +1 -1
  214. package/radio/lib/radio-styles.css.js.map +1 -1
  215. package/radio/lib/radio.d.ts +2 -7
  216. package/radio/lib/radio.js +2 -22
  217. package/radio/lib/radio.js.map +1 -1
  218. package/ripple/lib/ripple.js +4 -0
  219. package/ripple/lib/ripple.js.map +1 -1
  220. package/segmentedbutton/lib/segmented-button.d.ts +15 -21
  221. package/segmentedbutton/lib/segmented-button.js +3 -24
  222. package/segmentedbutton/lib/segmented-button.js.map +1 -1
  223. package/segmentedbuttonset/lib/_outlined-segmented-button-set.scss +32 -13
  224. package/segmentedbuttonset/lib/outlined-styles.css.js +1 -1
  225. package/segmentedbuttonset/lib/outlined-styles.css.js.map +1 -1
  226. package/segmentedbuttonset/lib/segmented-button-set.d.ts +1 -1
  227. package/segmentedbuttonset/lib/segmented-button-set.js.map +1 -1
  228. package/select/lib/_filled-select.scss +66 -7
  229. package/select/lib/_outlined-select.scss +41 -7
  230. package/select/lib/filled-select-styles.css.js +1 -1
  231. package/select/lib/filled-select-styles.css.js.map +1 -1
  232. package/select/lib/outlined-select-styles.css.js +1 -1
  233. package/select/lib/outlined-select-styles.css.js.map +1 -1
  234. package/select/lib/select.d.ts +46 -48
  235. package/select/lib/select.js +21 -19
  236. package/select/lib/select.js.map +1 -1
  237. package/slider/harness.d.ts +1 -1
  238. package/slider/harness.js +9 -9
  239. package/slider/harness.js.map +1 -1
  240. package/slider/lib/_slider.scss +6 -6
  241. package/slider/lib/slider-styles.css.js +1 -1
  242. package/slider/lib/slider-styles.css.js.map +1 -1
  243. package/slider/lib/slider.d.ts +22 -51
  244. package/slider/lib/slider.js +18 -54
  245. package/slider/lib/slider.js.map +1 -1
  246. package/switch/lib/_switch.scss +63 -18
  247. package/switch/lib/switch-styles.css.js +1 -1
  248. package/switch/lib/switch-styles.css.js.map +1 -1
  249. package/switch/lib/switch.d.ts +0 -5
  250. package/switch/lib/switch.js +2 -27
  251. package/switch/lib/switch.js.map +1 -1
  252. package/textfield/harness.d.ts +1 -1
  253. package/textfield/harness.js.map +1 -1
  254. package/textfield/lib/_filled-text-field.scss +70 -14
  255. package/textfield/lib/_outlined-text-field.scss +60 -35
  256. package/textfield/lib/filled-forced-colors-styles.css.js +1 -1
  257. package/textfield/lib/filled-forced-colors-styles.css.js.map +1 -1
  258. package/textfield/lib/filled-styles.css.js +1 -1
  259. package/textfield/lib/filled-styles.css.js.map +1 -1
  260. package/textfield/lib/outlined-forced-colors-styles.css.js +1 -1
  261. package/textfield/lib/outlined-forced-colors-styles.css.js.map +1 -1
  262. package/textfield/lib/outlined-styles.css.js +1 -1
  263. package/textfield/lib/outlined-styles.css.js.map +1 -1
  264. package/textfield/lib/text-field.d.ts +1 -1
  265. package/textfield/lib/text-field.js.map +1 -1
  266. package/tokens/_index.scss +2 -18
  267. package/tokens/_md-comp-assist-chip.scss +0 -9
  268. package/tokens/_md-comp-checkbox.scss +78 -1
  269. package/tokens/_md-comp-circular-progress-indicator.scss +39 -13
  270. package/tokens/_md-comp-elevated-button.scss +0 -10
  271. package/tokens/_md-comp-fab-branded.scss +6 -31
  272. package/tokens/_md-comp-fab.scss +9 -50
  273. package/tokens/_md-comp-filled-button.scss +0 -10
  274. package/{field/lib → tokens}/_md-comp-filled-field.scss +91 -9
  275. package/tokens/_md-comp-filled-icon-button.scss +46 -1
  276. package/tokens/_md-comp-filled-select.scss +4 -30
  277. package/tokens/_md-comp-filled-text-field.scss +93 -9
  278. package/tokens/_md-comp-filled-tonal-button.scss +0 -11
  279. package/tokens/_md-comp-filled-tonal-icon-button.scss +45 -3
  280. package/tokens/_md-comp-filter-chip.scss +0 -10
  281. package/tokens/_md-comp-focus-ring.scss +23 -24
  282. package/tokens/_md-comp-icon-button.scss +37 -1
  283. package/tokens/_md-comp-input-chip.scss +0 -10
  284. package/tokens/_md-comp-linear-progress-indicator.scss +23 -8
  285. package/tokens/_md-comp-list-item.scss +0 -27
  286. package/tokens/_md-comp-list.scss +3 -29
  287. package/tokens/_md-comp-menu-item.scss +3 -29
  288. package/tokens/_md-comp-menu.scss +0 -23
  289. package/tokens/_md-comp-outlined-button.scss +0 -10
  290. package/{field/lib → tokens}/_md-comp-outlined-field.scss +85 -9
  291. package/tokens/_md-comp-outlined-icon-button.scss +41 -1
  292. package/tokens/_md-comp-outlined-segmented-button.scss +57 -11
  293. package/tokens/_md-comp-outlined-select.scss +1 -28
  294. package/tokens/_md-comp-outlined-text-field.scss +85 -8
  295. package/tokens/_md-comp-suggestion-chip.scss +0 -9
  296. package/tokens/_md-comp-switch.scss +81 -1
  297. package/tokens/_md-comp-text-button.scss +0 -10
  298. package/tokens/_values.scss +2 -7
  299. package/types/aria.d.ts +0 -2
  300. package/focus/strong-focus.d.ts +0 -56
  301. package/focus/strong-focus.js +0 -101
  302. package/focus/strong-focus.js.map +0 -1
  303. package/sass/_shape.scss +0 -154
  304. package/tokens/_md-comp-extended-fab-branded.scss +0 -45
  305. package/tokens/_md-comp-extended-fab-primary.scss +0 -45
  306. package/tokens/_md-comp-extended-fab-secondary.scss +0 -48
  307. package/tokens/_md-comp-extended-fab-surface.scss +0 -45
  308. package/tokens/_md-comp-extended-fab-tertiary.scss +0 -48
  309. package/tokens/_md-comp-fab-branded-large.scss +0 -23
  310. package/tokens/_md-comp-fab-primary-large.scss +0 -23
  311. package/tokens/_md-comp-fab-primary-small.scss +0 -23
  312. package/tokens/_md-comp-fab-primary.scss +0 -23
  313. package/tokens/_md-comp-fab-secondary-large.scss +0 -23
  314. package/tokens/_md-comp-fab-secondary-small.scss +0 -23
  315. package/tokens/_md-comp-fab-secondary.scss +0 -23
  316. package/tokens/_md-comp-fab-surface-large.scss +0 -23
  317. package/tokens/_md-comp-fab-surface-small.scss +0 -23
  318. package/tokens/_md-comp-fab-surface.scss +0 -23
  319. package/tokens/_md-comp-fab-tertiary-large.scss +0 -23
  320. package/tokens/_md-comp-fab-tertiary-small.scss +0 -23
  321. package/tokens/_md-comp-fab-tertiary.scss +0 -23
@@ -1 +1 @@
1
- {"version":3,"file":"tonal-styles.css.js","sourceRoot":"","sources":["tonal-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-shape-start-start: var(--md-tonal-button-container-shape-start-start, var(--md-tonal-button-container-shape, 9999px));--_container-shape-start-end: var(--md-tonal-button-container-shape-start-end, var(--md-tonal-button-container-shape, 9999px));--_container-shape-end-end: var(--md-tonal-button-container-shape-end-end, var(--md-tonal-button-container-shape, 9999px));--_container-shape-end-start: var(--md-tonal-button-container-shape-end-start, var(--md-tonal-button-container-shape, 9999px));--_container-color: var(--md-tonal-button-container-color, var(--md-sys-color-secondary-container, #e8def8));--_container-elevation: var(--md-tonal-button-container-elevation, 0);--_container-height: var(--md-tonal-button-container-height, 40px);--_container-shadow-color: var(--md-tonal-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_disabled-container-color: var(--md-tonal-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-tonal-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-tonal-button-disabled-container-opacity, 0.12);--_disabled-label-text-color: var(--md-tonal-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-tonal-button-disabled-label-text-opacity, 0.38);--_focus-container-elevation: var(--md-tonal-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-tonal-button-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-state-layer-color: var(--md-tonal-button-focus-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-state-layer-opacity: var(--md-tonal-button-focus-state-layer-opacity, 0.12);--_hover-container-elevation: var(--md-tonal-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-tonal-button-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-color: var(--md-tonal-button-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-opacity: var(--md-tonal-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-tonal-button-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_label-text-type: var(--md-tonal-button-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-container-elevation: var(--md-tonal-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-tonal-button-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-color: var(--md-tonal-button-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-tonal-button-pressed-state-layer-opacity, 0.12);--_with-icon-disabled-icon-color: var(--md-tonal-button-with-icon-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_with-icon-disabled-icon-opacity: var(--md-tonal-button-with-icon-disabled-icon-opacity, 0.38);--_with-icon-focus-icon-color: var(--md-tonal-button-with-icon-focus-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_with-icon-hover-icon-color: var(--md-tonal-button-with-icon-hover-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_with-icon-icon-color: var(--md-tonal-button-with-icon-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_with-icon-icon-size: var(--md-tonal-button-with-icon-icon-size, 18px);--_with-icon-pressed-icon-color: var(--md-tonal-button-with-icon-pressed-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_spacing-leading: var(--md-tonal-button-spacing-leading, 24px);--_spacing-trailing: var(--md-tonal-button-spacing-trailing, 24px);--_with-icon-spacing-leading: var(--md-tonal-button-with-icon-spacing-leading, 16px);--_with-icon-spacing-trailing: var(--md-tonal-button-with-icon-spacing-trailing, 24px);--_with-trailing-icon-spacing-leading: var(--md-tonal-button-with-trailing-icon-spacing-leading, 24px);--_with-trailing-icon-spacing-trailing: var(--md-tonal-button-with-trailing-icon-spacing-trailing, 16px)}/*# sourceMappingURL=tonal-styles.css.map */\n`;\n "]}
1
+ {"version":3,"file":"tonal-styles.css.js","sourceRoot":"","sources":["tonal-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-color: var(--md-tonal-button-container-color, var(--md-sys-color-secondary-container, #e8def8));--_container-elevation: var(--md-tonal-button-container-elevation, 0);--_container-height: var(--md-tonal-button-container-height, 40px);--_container-shadow-color: var(--md-tonal-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-tonal-button-container-shape, 9999px);--_disabled-container-color: var(--md-tonal-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-tonal-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-tonal-button-disabled-container-opacity, 0.12);--_disabled-label-text-color: var(--md-tonal-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-tonal-button-disabled-label-text-opacity, 0.38);--_focus-container-elevation: var(--md-tonal-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-tonal-button-focus-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-state-layer-color: var(--md-tonal-button-focus-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_focus-state-layer-opacity: var(--md-tonal-button-focus-state-layer-opacity, 0.12);--_hover-container-elevation: var(--md-tonal-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-tonal-button-hover-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-color: var(--md-tonal-button-hover-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_hover-state-layer-opacity: var(--md-tonal-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-tonal-button-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_label-text-type: var(--md-tonal-button-label-text-type, var(--md-sys-typescale-label-large, 500 0.875rem / 1.25rem var(--md-ref-typeface-plain, Roboto)));--_pressed-container-elevation: var(--md-tonal-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-tonal-button-pressed-label-text-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-color: var(--md-tonal-button-pressed-state-layer-color, var(--md-sys-color-on-secondary-container, #1d192b));--_pressed-state-layer-opacity: var(--md-tonal-button-pressed-state-layer-opacity, 0.12);--_with-icon-disabled-icon-color: var(--md-tonal-button-with-icon-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_with-icon-disabled-icon-opacity: var(--md-tonal-button-with-icon-disabled-icon-opacity, 0.38);--_with-icon-focus-icon-color: var(--md-tonal-button-with-icon-focus-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_with-icon-hover-icon-color: var(--md-tonal-button-with-icon-hover-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_with-icon-icon-color: var(--md-tonal-button-with-icon-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_with-icon-icon-size: var(--md-tonal-button-with-icon-icon-size, 18px);--_with-icon-pressed-icon-color: var(--md-tonal-button-with-icon-pressed-icon-color, var(--md-sys-color-on-secondary-container, #1d192b));--_spacing-leading: var(--md-tonal-button-spacing-leading, 24px);--_spacing-trailing: var(--md-tonal-button-spacing-trailing, 24px);--_with-icon-spacing-leading: var(--md-tonal-button-with-icon-spacing-leading, 16px);--_with-icon-spacing-trailing: var(--md-tonal-button-with-icon-spacing-trailing, 24px);--_with-trailing-icon-spacing-leading: var(--md-tonal-button-with-trailing-icon-spacing-leading, 24px);--_with-trailing-icon-spacing-trailing: var(--md-tonal-button-with-trailing-icon-spacing-trailing, 16px);--_container-shape-start-start: var( --md-tonal-button-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-tonal-button-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-tonal-button-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-tonal-button-container-shape-end-start, var(--_container-shape) )}/*# sourceMappingURL=tonal-styles.css.map */\n`;\n "]}
@@ -4,13 +4,13 @@
4
4
  //
5
5
 
6
6
  // go/keep-sorted start
7
+ @use 'sass:list';
7
8
  @use 'sass:map';
8
9
  @use 'sass:math';
9
10
  // go/keep-sorted end
10
11
  // go/keep-sorted start
11
12
  @use '../../focus/focus-ring';
12
13
  @use '../../ripple/ripple';
13
- @use '../../sass/theme';
14
14
  @use '../../tokens';
15
15
  // go/keep-sorted end
16
16
 
@@ -26,32 +26,69 @@ $_indeterminate-bottom-left: 4px, -10px;
26
26
  $_checkmark-bottom-left: 7px, -14px;
27
27
 
28
28
  @mixin theme($tokens) {
29
- $tokens: _resolve-tokens($tokens);
30
- $tokens: theme.validate-theme(
31
- _resolve-tokens(tokens.md-comp-checkbox-values()),
32
- $tokens
29
+ $supported-tokens: list.join(
30
+ tokens.$md-comp-checkbox-supported-tokens,
31
+ (
32
+ 'container-shape-start-start',
33
+ 'container-shape-start-end',
34
+ 'container-shape-end-end',
35
+ 'container-shape-end-start'
36
+ )
33
37
  );
34
- $tokens: theme.create-theme-vars($tokens, checkbox);
35
38
 
36
- @include theme.emit-theme-vars($tokens);
39
+ @each $token, $value in $tokens {
40
+ @if list.index($supported-tokens, $token) == null {
41
+ @error 'Token `#{$token}` is not a supported token.';
42
+ }
43
+
44
+ @if $value {
45
+ --md-checkbox-#{$token}: #{$value};
46
+ }
47
+ }
37
48
  }
38
49
 
39
50
  @mixin styles() {
40
- $tokens: _resolve-tokens(tokens.md-comp-checkbox-values());
41
- $tokens: theme.create-theme-vars($tokens, checkbox);
51
+ $tokens: tokens.md-comp-checkbox-values();
42
52
 
43
53
  :host {
44
54
  @each $token, $value in $tokens {
45
- --_#{$token}: #{$value};
55
+ --_#{$token}: var(--md-checkbox-#{$token}, #{$value});
46
56
  }
47
57
 
48
- border-radius: var(--_container-shape);
58
+ // Support logical shape properties
59
+ --_container-shape-start-start: var(
60
+ --md-checkbox-container-shape-start-start,
61
+ var(--_container-shape)
62
+ );
63
+ --_container-shape-start-end: var(
64
+ --md-checkbox-container-shape-start-end,
65
+ var(--_container-shape)
66
+ );
67
+ --_container-shape-end-end: var(
68
+ --md-checkbox-container-shape-end-end,
69
+ var(--_container-shape)
70
+ );
71
+ --_container-shape-end-start: var(
72
+ --md-checkbox-container-shape-end-start,
73
+ var(--_container-shape)
74
+ );
75
+
76
+ border-start-start-radius: var(--_container-shape-start-start);
77
+ border-start-end-radius: var(--_container-shape-start-end);
78
+ border-end-end-radius: var(--_container-shape-end-end);
79
+ border-end-start-radius: var(--_container-shape-end-start);
49
80
  display: inline-flex;
50
81
  height: 48px;
51
82
  position: relative;
52
83
  vertical-align: top; // Fix extra space when placed inside display: block
53
84
  width: 48px;
54
85
  -webkit-tap-highlight-color: transparent;
86
+
87
+ @include focus-ring.theme(
88
+ (
89
+ 'offset': -2px,
90
+ )
91
+ );
55
92
  }
56
93
 
57
94
  input {
@@ -129,17 +166,6 @@ $_checkmark-bottom-left: 7px, -14px;
129
166
  transform: scale(1);
130
167
  }
131
168
 
132
- // Focus ring
133
-
134
- md-focus-ring {
135
- @include focus-ring.theme(
136
- (
137
- offset: -2px,
138
- shape: map.get(tokens.md-sys-shape-values(), corner-full),
139
- )
140
- );
141
- }
142
-
143
169
  // Ripple
144
170
 
145
171
  md-ripple {
@@ -429,28 +455,3 @@ $_checkmark-bottom-left: 7px, -14px;
429
455
  fill: var(--_selected-disabled-icon-color);
430
456
  }
431
457
  }
432
-
433
- @function _resolve-tokens($tokens) {
434
- // Remove deprecated tokens
435
- $tokens: map.remove(
436
- $tokens,
437
- 'disabled-unselected-icon-color',
438
- 'disabled-unselected-icon-opacity',
439
- 'disabled-selected-icon-color',
440
- 'disabled-selected-icon-opacity',
441
- 'unselected-icon-color',
442
- 'unselected-focus-icon-color',
443
- 'unselected-hover-icon-color',
444
- 'unselected-pressed-icon-color'
445
- );
446
- // Remove unsupported tokens
447
- $tokens: map.remove(
448
- $tokens,
449
- 'selected-disabled-container-outline-width',
450
- 'selected-focus-outline-width',
451
- 'selected-hover-outline-width',
452
- 'selected-outline-width',
453
- 'selected-pressed-outline-width'
454
- );
455
- @return $tokens;
456
- }
@@ -4,6 +4,6 @@
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
6
  import { css } from 'lit';
7
- export const styles = css `:host{--_container-shape: var(--md-checkbox-container-shape, 2px);--_container-size: var(--md-checkbox-container-size, 18px);--_error-focus-state-layer-color: var(--md-checkbox-error-focus-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-focus-state-layer-opacity: var(--md-checkbox-error-focus-state-layer-opacity, 0.12);--_error-hover-state-layer-color: var(--md-checkbox-error-hover-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-hover-state-layer-opacity: var(--md-checkbox-error-hover-state-layer-opacity, 0.08);--_error-pressed-state-layer-color: var(--md-checkbox-error-pressed-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-pressed-state-layer-opacity: var(--md-checkbox-error-pressed-state-layer-opacity, 0.12);--_icon-size: var(--md-checkbox-icon-size, 18px);--_selected-container-color: var(--md-checkbox-selected-container-color, var(--md-sys-color-primary, #6750a4));--_selected-disabled-container-color: var(--md-checkbox-selected-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-disabled-container-opacity: var(--md-checkbox-selected-disabled-container-opacity, 0.38);--_selected-disabled-icon-color: var(--md-checkbox-selected-disabled-icon-color, var(--md-sys-color-surface, #fef7ff));--_selected-error-container-color: var(--md-checkbox-selected-error-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-container-color: var(--md-checkbox-selected-error-focus-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-icon-color: var(--md-checkbox-selected-error-focus-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-hover-container-color: var(--md-checkbox-selected-error-hover-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-hover-icon-color: var(--md-checkbox-selected-error-hover-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-icon-color: var(--md-checkbox-selected-error-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-pressed-container-color: var(--md-checkbox-selected-error-pressed-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-pressed-icon-color: var(--md-checkbox-selected-error-pressed-icon-color, var(--md-sys-color-on-error, #fff));--_selected-focus-container-color: var(--md-checkbox-selected-focus-container-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-icon-color: var(--md-checkbox-selected-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-focus-state-layer-color: var(--md-checkbox-selected-focus-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-state-layer-opacity: var(--md-checkbox-selected-focus-state-layer-opacity, 0.12);--_selected-hover-container-color: var(--md-checkbox-selected-hover-container-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-checkbox-selected-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-hover-state-layer-color: var(--md-checkbox-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-checkbox-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-checkbox-selected-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-container-color: var(--md-checkbox-selected-pressed-container-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-checkbox-selected-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-state-layer-color: var(--md-checkbox-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-pressed-state-layer-opacity: var(--md-checkbox-selected-pressed-state-layer-opacity, 0.12);--_state-layer-shape: var(--md-checkbox-state-layer-shape, 9999px);--_state-layer-size: var(--md-checkbox-state-layer-size, 40px);--_unselected-disabled-container-opacity: var(--md-checkbox-unselected-disabled-container-opacity, 0.38);--_unselected-disabled-outline-color: var(--md-checkbox-unselected-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-disabled-outline-width: var(--md-checkbox-unselected-disabled-outline-width, 2px);--_unselected-error-focus-outline-color: var(--md-checkbox-unselected-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-hover-outline-color: var(--md-checkbox-unselected-error-hover-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-outline-color: var(--md-checkbox-unselected-error-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-pressed-outline-color: var(--md-checkbox-unselected-error-pressed-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-focus-outline-color: var(--md-checkbox-unselected-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-outline-width: var(--md-checkbox-unselected-focus-outline-width, 2px);--_unselected-focus-state-layer-color: var(--md-checkbox-unselected-focus-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-state-layer-opacity: var(--md-checkbox-unselected-focus-state-layer-opacity, 0.12);--_unselected-hover-outline-color: var(--md-checkbox-unselected-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-outline-width: var(--md-checkbox-unselected-hover-outline-width, 2px);--_unselected-hover-state-layer-color: var(--md-checkbox-unselected-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-state-layer-opacity: var(--md-checkbox-unselected-hover-state-layer-opacity, 0.08);--_unselected-outline-color: var(--md-checkbox-unselected-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_unselected-outline-width: var(--md-checkbox-unselected-outline-width, 2px);--_unselected-pressed-outline-color: var(--md-checkbox-unselected-pressed-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-pressed-outline-width: var(--md-checkbox-unselected-pressed-outline-width, 2px);--_unselected-pressed-state-layer-color: var(--md-checkbox-unselected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_unselected-pressed-state-layer-opacity: var(--md-checkbox-unselected-pressed-state-layer-opacity, 0.12);border-radius:var(--_container-shape);display:inline-flex;height:48px;position:relative;vertical-align:top;width:48px;-webkit-tap-highlight-color:rgba(0,0,0,0)}input{appearance:none;inset:0;margin:0;outline:none;position:absolute;opacity:0;block-size:100%;inline-size:100%}.container{border-radius:inherit;height:100%;position:relative;width:100%}.outline,.background,md-ripple,.icon{inset:0;margin:auto;position:absolute}.outline,.background{border-radius:inherit;height:var(--_container-size);width:var(--_container-size)}.outline{border-color:var(--_unselected-outline-color);border-style:solid;border-width:var(--_unselected-outline-width);box-sizing:border-box}.background{background-color:var(--_selected-container-color)}.background,.icon{opacity:0;transition-duration:150ms,50ms;transition-property:transform,opacity;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15),linear;transform:scale(0.6)}.selected .background,.selected .icon{opacity:1;transition-duration:350ms,50ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1),linear;transform:scale(1)}md-focus-ring{--md-focus-ring-shape-start-start:var(--md-focus-ring-shape, 9999px);--md-focus-ring-shape-start-end:var(--md-focus-ring-shape, 9999px);--md-focus-ring-shape-end-end:var(--md-focus-ring-shape, 9999px);--md-focus-ring-shape-end-start:var(--md-focus-ring-shape, 9999px);--md-focus-ring-offset:-2px}md-ripple{height:var(--_state-layer-size);width:var(--_state-layer-size);--md-ripple-focus-color:var(--_unselected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_unselected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_unselected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_unselected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_unselected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_unselected-pressed-state-layer-opacity);--md-ripple-shape:var(--_state-layer-shape)}.selected md-ripple{--md-ripple-focus-color:var(--_selected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_selected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_selected-pressed-state-layer-opacity)}.error md-ripple{--md-ripple-focus-color:var(--_error-focus-state-layer-color);--md-ripple-focus-opacity:var(--_error-focus-state-layer-opacity);--md-ripple-hover-color:var(--_error-hover-state-layer-color);--md-ripple-hover-opacity:var(--_error-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_error-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_error-pressed-state-layer-opacity)}.icon{fill:var(--_selected-icon-color);height:var(--_icon-size);width:var(--_icon-size)}.mark.short{height:2px;transition-property:transform,height;width:2px}.mark.long{height:2px;transition-property:transform,width;width:10px}.mark{animation-duration:150ms;animation-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15);transition-duration:150ms;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15)}.selected .mark{animation-duration:350ms;animation-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1);transition-duration:350ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1)}.checked .mark,.prev-checked.unselected .mark{transform:scaleY(-1) translate(7px, -14px) rotate(45deg)}.checked .mark.short,.prev-checked.unselected .mark.short{height:5.6568542495px}.checked .mark.long,.prev-checked.unselected .mark.long{width:11.313708499px}.indeterminate .mark,.prev-indeterminate.unselected .mark{transform:scaleY(-1) translate(4px, -10px) rotate(0deg)}.prev-unselected .mark{transition-property:none}.prev-unselected.checked .mark.long{animation-name:prev-unselected-to-checked}@keyframes prev-unselected-to-checked{from{width:0}}.error .outline{border-color:var(--_unselected-error-outline-color)}.error .background{background:var(--_selected-error-container-color)}.error .icon{fill:var(--_selected-error-icon-color)}:host(:hover) .outline{border-color:var(--_unselected-hover-outline-color);border-width:var(--_unselected-hover-outline-width)}:host(:hover) .background{background:var(--_selected-hover-container-color)}:host(:hover) .icon{fill:var(--_selected-hover-icon-color)}:host(:hover) .error .outline{border-color:var(--_unselected-error-hover-outline-color)}:host(:hover) .error .background{background:var(--_selected-error-hover-container-color)}:host(:hover) .error .icon{fill:var(--_selected-error-hover-icon-color)}:host(:focus-within) .outline{border-color:var(--_unselected-focus-outline-color);border-width:var(--_unselected-focus-outline-width)}:host(:focus-within) .background{background:var(--_selected-focus-container-color)}:host(:focus-within) .icon{fill:var(--_selected-focus-icon-color)}:host(:focus-within) .error .outline{border-color:var(--_unselected-error-focus-outline-color)}:host(:focus-within) .error .background{background:var(--_selected-error-focus-container-color)}:host(:focus-within) .error .icon{fill:var(--_selected-error-focus-icon-color)}:host(:active) .outline{border-color:var(--_unselected-pressed-outline-color);border-width:var(--_unselected-pressed-outline-width)}:host(:active) .background{background:var(--_selected-pressed-container-color)}:host(:active) .icon{fill:var(--_selected-pressed-icon-color)}:host(:active) .error .outline{border-color:var(--_unselected-error-pressed-outline-color)}:host(:active) .error .background{background:var(--_selected-error-pressed-container-color)}:host(:active) .error .icon{fill:var(--_selected-error-pressed-icon-color)}:host([disabled]) .background,:host([disabled]) .icon,:host([disabled]) .mark,.prev-disabled .background,.prev-disabled .icon,.prev-disabled .mark{animation-duration:0s;transition-duration:0s}:host([disabled]) .outline{border-color:var(--_unselected-disabled-outline-color);border-width:var(--_unselected-disabled-outline-width);opacity:var(--_unselected-disabled-container-opacity)}:host([disabled]) .selected .outline{visibility:hidden}:host([disabled]) .selected .background{background:var(--_selected-disabled-container-color);opacity:var(--_selected-disabled-container-opacity)}:host([disabled]) .icon{fill:var(--_selected-disabled-icon-color)}/*# sourceMappingURL=checkbox-styles.css.map */
7
+ export const styles = css `:host{--_container-shape: var(--md-checkbox-container-shape, 2px);--_container-size: var(--md-checkbox-container-size, 18px);--_error-focus-state-layer-color: var(--md-checkbox-error-focus-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-focus-state-layer-opacity: var(--md-checkbox-error-focus-state-layer-opacity, 0.12);--_error-hover-state-layer-color: var(--md-checkbox-error-hover-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-hover-state-layer-opacity: var(--md-checkbox-error-hover-state-layer-opacity, 0.08);--_error-pressed-state-layer-color: var(--md-checkbox-error-pressed-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-pressed-state-layer-opacity: var(--md-checkbox-error-pressed-state-layer-opacity, 0.12);--_icon-size: var(--md-checkbox-icon-size, 18px);--_selected-container-color: var(--md-checkbox-selected-container-color, var(--md-sys-color-primary, #6750a4));--_selected-disabled-container-color: var(--md-checkbox-selected-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-disabled-container-opacity: var(--md-checkbox-selected-disabled-container-opacity, 0.38);--_selected-disabled-icon-color: var(--md-checkbox-selected-disabled-icon-color, var(--md-sys-color-surface, #fef7ff));--_selected-error-container-color: var(--md-checkbox-selected-error-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-container-color: var(--md-checkbox-selected-error-focus-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-icon-color: var(--md-checkbox-selected-error-focus-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-hover-container-color: var(--md-checkbox-selected-error-hover-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-hover-icon-color: var(--md-checkbox-selected-error-hover-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-icon-color: var(--md-checkbox-selected-error-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-pressed-container-color: var(--md-checkbox-selected-error-pressed-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-pressed-icon-color: var(--md-checkbox-selected-error-pressed-icon-color, var(--md-sys-color-on-error, #fff));--_selected-focus-container-color: var(--md-checkbox-selected-focus-container-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-icon-color: var(--md-checkbox-selected-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-focus-state-layer-color: var(--md-checkbox-selected-focus-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-state-layer-opacity: var(--md-checkbox-selected-focus-state-layer-opacity, 0.12);--_selected-hover-container-color: var(--md-checkbox-selected-hover-container-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-checkbox-selected-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-hover-state-layer-color: var(--md-checkbox-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-checkbox-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-checkbox-selected-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-container-color: var(--md-checkbox-selected-pressed-container-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-checkbox-selected-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-state-layer-color: var(--md-checkbox-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-pressed-state-layer-opacity: var(--md-checkbox-selected-pressed-state-layer-opacity, 0.12);--_state-layer-shape: var(--md-checkbox-state-layer-shape, 9999px);--_state-layer-size: var(--md-checkbox-state-layer-size, 40px);--_unselected-disabled-container-opacity: var(--md-checkbox-unselected-disabled-container-opacity, 0.38);--_unselected-disabled-outline-color: var(--md-checkbox-unselected-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-disabled-outline-width: var(--md-checkbox-unselected-disabled-outline-width, 2px);--_unselected-error-focus-outline-color: var(--md-checkbox-unselected-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-hover-outline-color: var(--md-checkbox-unselected-error-hover-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-outline-color: var(--md-checkbox-unselected-error-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-pressed-outline-color: var(--md-checkbox-unselected-error-pressed-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-focus-outline-color: var(--md-checkbox-unselected-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-outline-width: var(--md-checkbox-unselected-focus-outline-width, 2px);--_unselected-focus-state-layer-color: var(--md-checkbox-unselected-focus-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-state-layer-opacity: var(--md-checkbox-unselected-focus-state-layer-opacity, 0.12);--_unselected-hover-outline-color: var(--md-checkbox-unselected-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-outline-width: var(--md-checkbox-unselected-hover-outline-width, 2px);--_unselected-hover-state-layer-color: var(--md-checkbox-unselected-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-state-layer-opacity: var(--md-checkbox-unselected-hover-state-layer-opacity, 0.08);--_unselected-outline-color: var(--md-checkbox-unselected-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_unselected-outline-width: var(--md-checkbox-unselected-outline-width, 2px);--_unselected-pressed-outline-color: var(--md-checkbox-unselected-pressed-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-pressed-outline-width: var(--md-checkbox-unselected-pressed-outline-width, 2px);--_unselected-pressed-state-layer-color: var(--md-checkbox-unselected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_unselected-pressed-state-layer-opacity: var(--md-checkbox-unselected-pressed-state-layer-opacity, 0.12);--_container-shape-start-start: var( --md-checkbox-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-checkbox-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-checkbox-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-checkbox-container-shape-end-start, var(--_container-shape) );border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:inline-flex;height:48px;position:relative;vertical-align:top;width:48px;-webkit-tap-highlight-color:rgba(0,0,0,0);--md-focus-ring-offset: -2px}input{appearance:none;inset:0;margin:0;outline:none;position:absolute;opacity:0;block-size:100%;inline-size:100%}.container{border-radius:inherit;height:100%;position:relative;width:100%}.outline,.background,md-ripple,.icon{inset:0;margin:auto;position:absolute}.outline,.background{border-radius:inherit;height:var(--_container-size);width:var(--_container-size)}.outline{border-color:var(--_unselected-outline-color);border-style:solid;border-width:var(--_unselected-outline-width);box-sizing:border-box}.background{background-color:var(--_selected-container-color)}.background,.icon{opacity:0;transition-duration:150ms,50ms;transition-property:transform,opacity;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15),linear;transform:scale(0.6)}.selected .background,.selected .icon{opacity:1;transition-duration:350ms,50ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1),linear;transform:scale(1)}md-ripple{height:var(--_state-layer-size);width:var(--_state-layer-size);--md-ripple-focus-color:var(--_unselected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_unselected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_unselected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_unselected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_unselected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_unselected-pressed-state-layer-opacity);--md-ripple-shape:var(--_state-layer-shape)}.selected md-ripple{--md-ripple-focus-color:var(--_selected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_selected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_selected-pressed-state-layer-opacity)}.error md-ripple{--md-ripple-focus-color:var(--_error-focus-state-layer-color);--md-ripple-focus-opacity:var(--_error-focus-state-layer-opacity);--md-ripple-hover-color:var(--_error-hover-state-layer-color);--md-ripple-hover-opacity:var(--_error-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_error-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_error-pressed-state-layer-opacity)}.icon{fill:var(--_selected-icon-color);height:var(--_icon-size);width:var(--_icon-size)}.mark.short{height:2px;transition-property:transform,height;width:2px}.mark.long{height:2px;transition-property:transform,width;width:10px}.mark{animation-duration:150ms;animation-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15);transition-duration:150ms;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15)}.selected .mark{animation-duration:350ms;animation-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1);transition-duration:350ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1)}.checked .mark,.prev-checked.unselected .mark{transform:scaleY(-1) translate(7px, -14px) rotate(45deg)}.checked .mark.short,.prev-checked.unselected .mark.short{height:5.6568542495px}.checked .mark.long,.prev-checked.unselected .mark.long{width:11.313708499px}.indeterminate .mark,.prev-indeterminate.unselected .mark{transform:scaleY(-1) translate(4px, -10px) rotate(0deg)}.prev-unselected .mark{transition-property:none}.prev-unselected.checked .mark.long{animation-name:prev-unselected-to-checked}@keyframes prev-unselected-to-checked{from{width:0}}.error .outline{border-color:var(--_unselected-error-outline-color)}.error .background{background:var(--_selected-error-container-color)}.error .icon{fill:var(--_selected-error-icon-color)}:host(:hover) .outline{border-color:var(--_unselected-hover-outline-color);border-width:var(--_unselected-hover-outline-width)}:host(:hover) .background{background:var(--_selected-hover-container-color)}:host(:hover) .icon{fill:var(--_selected-hover-icon-color)}:host(:hover) .error .outline{border-color:var(--_unselected-error-hover-outline-color)}:host(:hover) .error .background{background:var(--_selected-error-hover-container-color)}:host(:hover) .error .icon{fill:var(--_selected-error-hover-icon-color)}:host(:focus-within) .outline{border-color:var(--_unselected-focus-outline-color);border-width:var(--_unselected-focus-outline-width)}:host(:focus-within) .background{background:var(--_selected-focus-container-color)}:host(:focus-within) .icon{fill:var(--_selected-focus-icon-color)}:host(:focus-within) .error .outline{border-color:var(--_unselected-error-focus-outline-color)}:host(:focus-within) .error .background{background:var(--_selected-error-focus-container-color)}:host(:focus-within) .error .icon{fill:var(--_selected-error-focus-icon-color)}:host(:active) .outline{border-color:var(--_unselected-pressed-outline-color);border-width:var(--_unselected-pressed-outline-width)}:host(:active) .background{background:var(--_selected-pressed-container-color)}:host(:active) .icon{fill:var(--_selected-pressed-icon-color)}:host(:active) .error .outline{border-color:var(--_unselected-error-pressed-outline-color)}:host(:active) .error .background{background:var(--_selected-error-pressed-container-color)}:host(:active) .error .icon{fill:var(--_selected-error-pressed-icon-color)}:host([disabled]) .background,:host([disabled]) .icon,:host([disabled]) .mark,.prev-disabled .background,.prev-disabled .icon,.prev-disabled .mark{animation-duration:0s;transition-duration:0s}:host([disabled]) .outline{border-color:var(--_unselected-disabled-outline-color);border-width:var(--_unselected-disabled-outline-width);opacity:var(--_unselected-disabled-container-opacity)}:host([disabled]) .selected .outline{visibility:hidden}:host([disabled]) .selected .background{background:var(--_selected-disabled-container-color);opacity:var(--_selected-disabled-container-opacity)}:host([disabled]) .icon{fill:var(--_selected-disabled-icon-color)}/*# sourceMappingURL=checkbox-styles.css.map */
8
8
  `;
9
9
  //# sourceMappingURL=checkbox-styles.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox-styles.css.js","sourceRoot":"","sources":["checkbox-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-shape: var(--md-checkbox-container-shape, 2px);--_container-size: var(--md-checkbox-container-size, 18px);--_error-focus-state-layer-color: var(--md-checkbox-error-focus-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-focus-state-layer-opacity: var(--md-checkbox-error-focus-state-layer-opacity, 0.12);--_error-hover-state-layer-color: var(--md-checkbox-error-hover-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-hover-state-layer-opacity: var(--md-checkbox-error-hover-state-layer-opacity, 0.08);--_error-pressed-state-layer-color: var(--md-checkbox-error-pressed-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-pressed-state-layer-opacity: var(--md-checkbox-error-pressed-state-layer-opacity, 0.12);--_icon-size: var(--md-checkbox-icon-size, 18px);--_selected-container-color: var(--md-checkbox-selected-container-color, var(--md-sys-color-primary, #6750a4));--_selected-disabled-container-color: var(--md-checkbox-selected-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-disabled-container-opacity: var(--md-checkbox-selected-disabled-container-opacity, 0.38);--_selected-disabled-icon-color: var(--md-checkbox-selected-disabled-icon-color, var(--md-sys-color-surface, #fef7ff));--_selected-error-container-color: var(--md-checkbox-selected-error-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-container-color: var(--md-checkbox-selected-error-focus-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-icon-color: var(--md-checkbox-selected-error-focus-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-hover-container-color: var(--md-checkbox-selected-error-hover-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-hover-icon-color: var(--md-checkbox-selected-error-hover-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-icon-color: var(--md-checkbox-selected-error-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-pressed-container-color: var(--md-checkbox-selected-error-pressed-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-pressed-icon-color: var(--md-checkbox-selected-error-pressed-icon-color, var(--md-sys-color-on-error, #fff));--_selected-focus-container-color: var(--md-checkbox-selected-focus-container-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-icon-color: var(--md-checkbox-selected-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-focus-state-layer-color: var(--md-checkbox-selected-focus-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-state-layer-opacity: var(--md-checkbox-selected-focus-state-layer-opacity, 0.12);--_selected-hover-container-color: var(--md-checkbox-selected-hover-container-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-checkbox-selected-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-hover-state-layer-color: var(--md-checkbox-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-checkbox-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-checkbox-selected-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-container-color: var(--md-checkbox-selected-pressed-container-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-checkbox-selected-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-state-layer-color: var(--md-checkbox-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-pressed-state-layer-opacity: var(--md-checkbox-selected-pressed-state-layer-opacity, 0.12);--_state-layer-shape: var(--md-checkbox-state-layer-shape, 9999px);--_state-layer-size: var(--md-checkbox-state-layer-size, 40px);--_unselected-disabled-container-opacity: var(--md-checkbox-unselected-disabled-container-opacity, 0.38);--_unselected-disabled-outline-color: var(--md-checkbox-unselected-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-disabled-outline-width: var(--md-checkbox-unselected-disabled-outline-width, 2px);--_unselected-error-focus-outline-color: var(--md-checkbox-unselected-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-hover-outline-color: var(--md-checkbox-unselected-error-hover-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-outline-color: var(--md-checkbox-unselected-error-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-pressed-outline-color: var(--md-checkbox-unselected-error-pressed-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-focus-outline-color: var(--md-checkbox-unselected-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-outline-width: var(--md-checkbox-unselected-focus-outline-width, 2px);--_unselected-focus-state-layer-color: var(--md-checkbox-unselected-focus-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-state-layer-opacity: var(--md-checkbox-unselected-focus-state-layer-opacity, 0.12);--_unselected-hover-outline-color: var(--md-checkbox-unselected-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-outline-width: var(--md-checkbox-unselected-hover-outline-width, 2px);--_unselected-hover-state-layer-color: var(--md-checkbox-unselected-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-state-layer-opacity: var(--md-checkbox-unselected-hover-state-layer-opacity, 0.08);--_unselected-outline-color: var(--md-checkbox-unselected-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_unselected-outline-width: var(--md-checkbox-unselected-outline-width, 2px);--_unselected-pressed-outline-color: var(--md-checkbox-unselected-pressed-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-pressed-outline-width: var(--md-checkbox-unselected-pressed-outline-width, 2px);--_unselected-pressed-state-layer-color: var(--md-checkbox-unselected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_unselected-pressed-state-layer-opacity: var(--md-checkbox-unselected-pressed-state-layer-opacity, 0.12);border-radius:var(--_container-shape);display:inline-flex;height:48px;position:relative;vertical-align:top;width:48px;-webkit-tap-highlight-color:rgba(0,0,0,0)}input{appearance:none;inset:0;margin:0;outline:none;position:absolute;opacity:0;block-size:100%;inline-size:100%}.container{border-radius:inherit;height:100%;position:relative;width:100%}.outline,.background,md-ripple,.icon{inset:0;margin:auto;position:absolute}.outline,.background{border-radius:inherit;height:var(--_container-size);width:var(--_container-size)}.outline{border-color:var(--_unselected-outline-color);border-style:solid;border-width:var(--_unselected-outline-width);box-sizing:border-box}.background{background-color:var(--_selected-container-color)}.background,.icon{opacity:0;transition-duration:150ms,50ms;transition-property:transform,opacity;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15),linear;transform:scale(0.6)}.selected .background,.selected .icon{opacity:1;transition-duration:350ms,50ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1),linear;transform:scale(1)}md-focus-ring{--md-focus-ring-shape-start-start:var(--md-focus-ring-shape, 9999px);--md-focus-ring-shape-start-end:var(--md-focus-ring-shape, 9999px);--md-focus-ring-shape-end-end:var(--md-focus-ring-shape, 9999px);--md-focus-ring-shape-end-start:var(--md-focus-ring-shape, 9999px);--md-focus-ring-offset:-2px}md-ripple{height:var(--_state-layer-size);width:var(--_state-layer-size);--md-ripple-focus-color:var(--_unselected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_unselected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_unselected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_unselected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_unselected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_unselected-pressed-state-layer-opacity);--md-ripple-shape:var(--_state-layer-shape)}.selected md-ripple{--md-ripple-focus-color:var(--_selected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_selected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_selected-pressed-state-layer-opacity)}.error md-ripple{--md-ripple-focus-color:var(--_error-focus-state-layer-color);--md-ripple-focus-opacity:var(--_error-focus-state-layer-opacity);--md-ripple-hover-color:var(--_error-hover-state-layer-color);--md-ripple-hover-opacity:var(--_error-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_error-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_error-pressed-state-layer-opacity)}.icon{fill:var(--_selected-icon-color);height:var(--_icon-size);width:var(--_icon-size)}.mark.short{height:2px;transition-property:transform,height;width:2px}.mark.long{height:2px;transition-property:transform,width;width:10px}.mark{animation-duration:150ms;animation-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15);transition-duration:150ms;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15)}.selected .mark{animation-duration:350ms;animation-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1);transition-duration:350ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1)}.checked .mark,.prev-checked.unselected .mark{transform:scaleY(-1) translate(7px, -14px) rotate(45deg)}.checked .mark.short,.prev-checked.unselected .mark.short{height:5.6568542495px}.checked .mark.long,.prev-checked.unselected .mark.long{width:11.313708499px}.indeterminate .mark,.prev-indeterminate.unselected .mark{transform:scaleY(-1) translate(4px, -10px) rotate(0deg)}.prev-unselected .mark{transition-property:none}.prev-unselected.checked .mark.long{animation-name:prev-unselected-to-checked}@keyframes prev-unselected-to-checked{from{width:0}}.error .outline{border-color:var(--_unselected-error-outline-color)}.error .background{background:var(--_selected-error-container-color)}.error .icon{fill:var(--_selected-error-icon-color)}:host(:hover) .outline{border-color:var(--_unselected-hover-outline-color);border-width:var(--_unselected-hover-outline-width)}:host(:hover) .background{background:var(--_selected-hover-container-color)}:host(:hover) .icon{fill:var(--_selected-hover-icon-color)}:host(:hover) .error .outline{border-color:var(--_unselected-error-hover-outline-color)}:host(:hover) .error .background{background:var(--_selected-error-hover-container-color)}:host(:hover) .error .icon{fill:var(--_selected-error-hover-icon-color)}:host(:focus-within) .outline{border-color:var(--_unselected-focus-outline-color);border-width:var(--_unselected-focus-outline-width)}:host(:focus-within) .background{background:var(--_selected-focus-container-color)}:host(:focus-within) .icon{fill:var(--_selected-focus-icon-color)}:host(:focus-within) .error .outline{border-color:var(--_unselected-error-focus-outline-color)}:host(:focus-within) .error .background{background:var(--_selected-error-focus-container-color)}:host(:focus-within) .error .icon{fill:var(--_selected-error-focus-icon-color)}:host(:active) .outline{border-color:var(--_unselected-pressed-outline-color);border-width:var(--_unselected-pressed-outline-width)}:host(:active) .background{background:var(--_selected-pressed-container-color)}:host(:active) .icon{fill:var(--_selected-pressed-icon-color)}:host(:active) .error .outline{border-color:var(--_unselected-error-pressed-outline-color)}:host(:active) .error .background{background:var(--_selected-error-pressed-container-color)}:host(:active) .error .icon{fill:var(--_selected-error-pressed-icon-color)}:host([disabled]) .background,:host([disabled]) .icon,:host([disabled]) .mark,.prev-disabled .background,.prev-disabled .icon,.prev-disabled .mark{animation-duration:0s;transition-duration:0s}:host([disabled]) .outline{border-color:var(--_unselected-disabled-outline-color);border-width:var(--_unselected-disabled-outline-width);opacity:var(--_unselected-disabled-container-opacity)}:host([disabled]) .selected .outline{visibility:hidden}:host([disabled]) .selected .background{background:var(--_selected-disabled-container-color);opacity:var(--_selected-disabled-container-opacity)}:host([disabled]) .icon{fill:var(--_selected-disabled-icon-color)}/*# sourceMappingURL=checkbox-styles.css.map */\n`;\n "]}
1
+ {"version":3,"file":"checkbox-styles.css.js","sourceRoot":"","sources":["checkbox-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-shape: var(--md-checkbox-container-shape, 2px);--_container-size: var(--md-checkbox-container-size, 18px);--_error-focus-state-layer-color: var(--md-checkbox-error-focus-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-focus-state-layer-opacity: var(--md-checkbox-error-focus-state-layer-opacity, 0.12);--_error-hover-state-layer-color: var(--md-checkbox-error-hover-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-hover-state-layer-opacity: var(--md-checkbox-error-hover-state-layer-opacity, 0.08);--_error-pressed-state-layer-color: var(--md-checkbox-error-pressed-state-layer-color, var(--md-sys-color-error, #b3261e));--_error-pressed-state-layer-opacity: var(--md-checkbox-error-pressed-state-layer-opacity, 0.12);--_icon-size: var(--md-checkbox-icon-size, 18px);--_selected-container-color: var(--md-checkbox-selected-container-color, var(--md-sys-color-primary, #6750a4));--_selected-disabled-container-color: var(--md-checkbox-selected-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-disabled-container-opacity: var(--md-checkbox-selected-disabled-container-opacity, 0.38);--_selected-disabled-icon-color: var(--md-checkbox-selected-disabled-icon-color, var(--md-sys-color-surface, #fef7ff));--_selected-error-container-color: var(--md-checkbox-selected-error-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-container-color: var(--md-checkbox-selected-error-focus-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-focus-icon-color: var(--md-checkbox-selected-error-focus-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-hover-container-color: var(--md-checkbox-selected-error-hover-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-hover-icon-color: var(--md-checkbox-selected-error-hover-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-icon-color: var(--md-checkbox-selected-error-icon-color, var(--md-sys-color-on-error, #fff));--_selected-error-pressed-container-color: var(--md-checkbox-selected-error-pressed-container-color, var(--md-sys-color-error, #b3261e));--_selected-error-pressed-icon-color: var(--md-checkbox-selected-error-pressed-icon-color, var(--md-sys-color-on-error, #fff));--_selected-focus-container-color: var(--md-checkbox-selected-focus-container-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-icon-color: var(--md-checkbox-selected-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-focus-state-layer-color: var(--md-checkbox-selected-focus-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-focus-state-layer-opacity: var(--md-checkbox-selected-focus-state-layer-opacity, 0.12);--_selected-hover-container-color: var(--md-checkbox-selected-hover-container-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-checkbox-selected-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-hover-state-layer-color: var(--md-checkbox-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-checkbox-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-checkbox-selected-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-container-color: var(--md-checkbox-selected-pressed-container-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-checkbox-selected-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_selected-pressed-state-layer-color: var(--md-checkbox-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_selected-pressed-state-layer-opacity: var(--md-checkbox-selected-pressed-state-layer-opacity, 0.12);--_state-layer-shape: var(--md-checkbox-state-layer-shape, 9999px);--_state-layer-size: var(--md-checkbox-state-layer-size, 40px);--_unselected-disabled-container-opacity: var(--md-checkbox-unselected-disabled-container-opacity, 0.38);--_unselected-disabled-outline-color: var(--md-checkbox-unselected-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-disabled-outline-width: var(--md-checkbox-unselected-disabled-outline-width, 2px);--_unselected-error-focus-outline-color: var(--md-checkbox-unselected-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-hover-outline-color: var(--md-checkbox-unselected-error-hover-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-outline-color: var(--md-checkbox-unselected-error-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-error-pressed-outline-color: var(--md-checkbox-unselected-error-pressed-outline-color, var(--md-sys-color-error, #b3261e));--_unselected-focus-outline-color: var(--md-checkbox-unselected-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-outline-width: var(--md-checkbox-unselected-focus-outline-width, 2px);--_unselected-focus-state-layer-color: var(--md-checkbox-unselected-focus-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-focus-state-layer-opacity: var(--md-checkbox-unselected-focus-state-layer-opacity, 0.12);--_unselected-hover-outline-color: var(--md-checkbox-unselected-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-outline-width: var(--md-checkbox-unselected-hover-outline-width, 2px);--_unselected-hover-state-layer-color: var(--md-checkbox-unselected-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-hover-state-layer-opacity: var(--md-checkbox-unselected-hover-state-layer-opacity, 0.08);--_unselected-outline-color: var(--md-checkbox-unselected-outline-color, var(--md-sys-color-on-surface-variant, #49454f));--_unselected-outline-width: var(--md-checkbox-unselected-outline-width, 2px);--_unselected-pressed-outline-color: var(--md-checkbox-unselected-pressed-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_unselected-pressed-outline-width: var(--md-checkbox-unselected-pressed-outline-width, 2px);--_unselected-pressed-state-layer-color: var(--md-checkbox-unselected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_unselected-pressed-state-layer-opacity: var(--md-checkbox-unselected-pressed-state-layer-opacity, 0.12);--_container-shape-start-start: var( --md-checkbox-container-shape-start-start, var(--_container-shape) );--_container-shape-start-end: var( --md-checkbox-container-shape-start-end, var(--_container-shape) );--_container-shape-end-end: var( --md-checkbox-container-shape-end-end, var(--_container-shape) );--_container-shape-end-start: var( --md-checkbox-container-shape-end-start, var(--_container-shape) );border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:inline-flex;height:48px;position:relative;vertical-align:top;width:48px;-webkit-tap-highlight-color:rgba(0,0,0,0);--md-focus-ring-offset: -2px}input{appearance:none;inset:0;margin:0;outline:none;position:absolute;opacity:0;block-size:100%;inline-size:100%}.container{border-radius:inherit;height:100%;position:relative;width:100%}.outline,.background,md-ripple,.icon{inset:0;margin:auto;position:absolute}.outline,.background{border-radius:inherit;height:var(--_container-size);width:var(--_container-size)}.outline{border-color:var(--_unselected-outline-color);border-style:solid;border-width:var(--_unselected-outline-width);box-sizing:border-box}.background{background-color:var(--_selected-container-color)}.background,.icon{opacity:0;transition-duration:150ms,50ms;transition-property:transform,opacity;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15),linear;transform:scale(0.6)}.selected .background,.selected .icon{opacity:1;transition-duration:350ms,50ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1),linear;transform:scale(1)}md-ripple{height:var(--_state-layer-size);width:var(--_state-layer-size);--md-ripple-focus-color:var(--_unselected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_unselected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_unselected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_unselected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_unselected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_unselected-pressed-state-layer-opacity);--md-ripple-shape:var(--_state-layer-shape)}.selected md-ripple{--md-ripple-focus-color:var(--_selected-focus-state-layer-color);--md-ripple-focus-opacity:var(--_selected-focus-state-layer-opacity);--md-ripple-hover-color:var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity:var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_selected-pressed-state-layer-opacity)}.error md-ripple{--md-ripple-focus-color:var(--_error-focus-state-layer-color);--md-ripple-focus-opacity:var(--_error-focus-state-layer-opacity);--md-ripple-hover-color:var(--_error-hover-state-layer-color);--md-ripple-hover-opacity:var(--_error-hover-state-layer-opacity);--md-ripple-pressed-color:var(--_error-pressed-state-layer-color);--md-ripple-pressed-opacity:var(--_error-pressed-state-layer-opacity)}.icon{fill:var(--_selected-icon-color);height:var(--_icon-size);width:var(--_icon-size)}.mark.short{height:2px;transition-property:transform,height;width:2px}.mark.long{height:2px;transition-property:transform,width;width:10px}.mark{animation-duration:150ms;animation-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15);transition-duration:150ms;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15)}.selected .mark{animation-duration:350ms;animation-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1);transition-duration:350ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1)}.checked .mark,.prev-checked.unselected .mark{transform:scaleY(-1) translate(7px, -14px) rotate(45deg)}.checked .mark.short,.prev-checked.unselected .mark.short{height:5.6568542495px}.checked .mark.long,.prev-checked.unselected .mark.long{width:11.313708499px}.indeterminate .mark,.prev-indeterminate.unselected .mark{transform:scaleY(-1) translate(4px, -10px) rotate(0deg)}.prev-unselected .mark{transition-property:none}.prev-unselected.checked .mark.long{animation-name:prev-unselected-to-checked}@keyframes prev-unselected-to-checked{from{width:0}}.error .outline{border-color:var(--_unselected-error-outline-color)}.error .background{background:var(--_selected-error-container-color)}.error .icon{fill:var(--_selected-error-icon-color)}:host(:hover) .outline{border-color:var(--_unselected-hover-outline-color);border-width:var(--_unselected-hover-outline-width)}:host(:hover) .background{background:var(--_selected-hover-container-color)}:host(:hover) .icon{fill:var(--_selected-hover-icon-color)}:host(:hover) .error .outline{border-color:var(--_unselected-error-hover-outline-color)}:host(:hover) .error .background{background:var(--_selected-error-hover-container-color)}:host(:hover) .error .icon{fill:var(--_selected-error-hover-icon-color)}:host(:focus-within) .outline{border-color:var(--_unselected-focus-outline-color);border-width:var(--_unselected-focus-outline-width)}:host(:focus-within) .background{background:var(--_selected-focus-container-color)}:host(:focus-within) .icon{fill:var(--_selected-focus-icon-color)}:host(:focus-within) .error .outline{border-color:var(--_unselected-error-focus-outline-color)}:host(:focus-within) .error .background{background:var(--_selected-error-focus-container-color)}:host(:focus-within) .error .icon{fill:var(--_selected-error-focus-icon-color)}:host(:active) .outline{border-color:var(--_unselected-pressed-outline-color);border-width:var(--_unselected-pressed-outline-width)}:host(:active) .background{background:var(--_selected-pressed-container-color)}:host(:active) .icon{fill:var(--_selected-pressed-icon-color)}:host(:active) .error .outline{border-color:var(--_unselected-error-pressed-outline-color)}:host(:active) .error .background{background:var(--_selected-error-pressed-container-color)}:host(:active) .error .icon{fill:var(--_selected-error-pressed-icon-color)}:host([disabled]) .background,:host([disabled]) .icon,:host([disabled]) .mark,.prev-disabled .background,.prev-disabled .icon,.prev-disabled .mark{animation-duration:0s;transition-duration:0s}:host([disabled]) .outline{border-color:var(--_unselected-disabled-outline-color);border-width:var(--_unselected-disabled-outline-width);opacity:var(--_unselected-disabled-container-opacity)}:host([disabled]) .selected .outline{visibility:hidden}:host([disabled]) .selected .background{background:var(--_selected-disabled-container-color);opacity:var(--_selected-disabled-container-opacity)}:host([disabled]) .icon{fill:var(--_selected-disabled-icon-color)}/*# sourceMappingURL=checkbox-styles.css.map */\n`;\n "]}
@@ -5,7 +5,7 @@
5
5
  */
6
6
  import '../../focus/focus-ring.js';
7
7
  import '../../ripple/ripple.js';
8
- import { LitElement, PropertyValues, TemplateResult } from 'lit';
8
+ import { LitElement, PropertyValues } from 'lit';
9
9
  import { getFormValue } from '../../controller/form-controller.js';
10
10
  /**
11
11
  * A checkbox component.
@@ -52,17 +52,13 @@ export declare class Checkbox extends LitElement {
52
52
  private prevIndeterminate;
53
53
  private readonly ripple;
54
54
  private readonly input;
55
- private showFocusRing;
56
55
  private showRipple;
57
56
  constructor();
58
57
  focus(): void;
59
58
  [getFormValue](): string;
60
59
  protected update(changed: PropertyValues<Checkbox>): void;
61
- protected render(): TemplateResult;
62
- private handleBlur;
60
+ protected render(): import("lit-html").TemplateResult<1>;
63
61
  private handleChange;
64
- private handleFocus;
65
- private handlePointerDown;
66
62
  private readonly getRipple;
67
63
  private readonly renderRipple;
68
64
  }
@@ -15,7 +15,6 @@ import { requestUpdateOnAriaChange } from '../../aria/delegate.js';
15
15
  import { dispatchActivationClick, isActivationClick, redispatchEvent } from '../../controller/events.js';
16
16
  import { FormController, getFormValue } from '../../controller/form-controller.js';
17
17
  import { stringConverter } from '../../controller/string-converter.js';
18
- import { pointerPress, shouldShowStrongFocus } from '../../focus/strong-focus.js';
19
18
  import { ripple } from '../../ripple/directive.js';
20
19
  /**
21
20
  * A checkbox component.
@@ -60,7 +59,6 @@ export class Checkbox extends LitElement {
60
59
  this.prevChecked = false;
61
60
  this.prevDisabled = false;
62
61
  this.prevIndeterminate = false;
63
- this.showFocusRing = false;
64
62
  this.showRipple = false;
65
63
  this.getRipple = () => {
66
64
  this.showRipple = true;
@@ -119,7 +117,7 @@ export class Checkbox extends LitElement {
119
117
  <div class="container ${containerClasses}">
120
118
  <div class="outline"></div>
121
119
  <div class="background"></div>
122
- <md-focus-ring .visible=${this.showFocusRing}></md-focus-ring>
120
+ <md-focus-ring for="input"></md-focus-ring>
123
121
  ${when(this.showRipple, this.renderRipple)}
124
122
  <svg class="icon" viewBox="0 0 18 18">
125
123
  <rect class="mark short" />
@@ -127,21 +125,16 @@ export class Checkbox extends LitElement {
127
125
  </svg>
128
126
  </div>
129
127
  <input type="checkbox"
128
+ id="input"
130
129
  aria-checked=${isIndeterminate ? 'mixed' : nothing}
131
130
  aria-label=${ariaLabel || nothing}
132
131
  ?disabled=${this.disabled}
133
132
  .indeterminate=${this.indeterminate}
134
133
  .checked=${this.checked}
135
- @blur=${this.handleBlur}
136
134
  @change=${this.handleChange}
137
- @focus=${this.handleFocus}
138
- @pointerdown=${this.handlePointerDown}
139
135
  ${ripple(this.getRipple)}
140
136
  >
141
- `;
142
- }
143
- handleBlur() {
144
- this.showFocusRing = false;
137
+ `;
145
138
  }
146
139
  handleChange(event) {
147
140
  const target = event.target;
@@ -149,13 +142,6 @@ export class Checkbox extends LitElement {
149
142
  this.indeterminate = target.indeterminate;
150
143
  redispatchEvent(this, event);
151
144
  }
152
- handleFocus() {
153
- this.showFocusRing = shouldShowStrongFocus();
154
- }
155
- handlePointerDown() {
156
- pointerPress();
157
- this.showFocusRing = shouldShowStrongFocus();
158
- }
159
145
  }
160
146
  _a = Checkbox;
161
147
  (() => {
@@ -198,9 +184,6 @@ __decorate([
198
184
  __decorate([
199
185
  query('input')
200
186
  ], Checkbox.prototype, "input", void 0);
201
- __decorate([
202
- state()
203
- ], Checkbox.prototype, "showFocusRing", void 0);
204
187
  __decorate([
205
188
  state()
206
189
  ], Checkbox.prototype, "showRipple", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox.js","sourceRoot":"","sources":["checkbox.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;;AAEH,OAAO,2BAA2B,CAAC;AACnC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAiC,MAAM,KAAK,CAAC;AACxF,OAAO,EAAC,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AACrE,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAE5C,OAAO,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAC,uBAAuB,EAAE,iBAAiB,EAAE,eAAe,EAAC,MAAM,4BAA4B,CAAC;AACvG,OAAO,EAAC,cAAc,EAAE,YAAY,EAAC,MAAM,qCAAqC,CAAC;AACjF,OAAO,EAAC,eAAe,EAAC,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAC,YAAY,EAAE,qBAAqB,EAAC,MAAM,6BAA6B,CAAC;AAChF,OAAO,EAAC,MAAM,EAAC,MAAM,2BAA2B,CAAC;AAIjD;;GAEG;AACH,MAAM,OAAO,QAAS,SAAQ,UAAU;IA4CtC;;OAEG;IACH,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAC9B,CAAC;IAUD;QACE,KAAK,EAAE,CAAC;QAlDV;;WAEG;QACuC,YAAO,GAAG,KAAK,CAAC;QAE1D;;WAEG;QACuC,aAAQ,GAAG,KAAK,CAAC;QAE3D;;WAEG;QACuC,UAAK,GAAG,KAAK,CAAC;QAExD;;;;WAIG;QACuC,kBAAa,GAAG,KAAK,CAAC;QAEhE;;;;WAIG;QACS,UAAK,GAAG,IAAI,CAAC;QAEzB;;WAEG;QACoD,SAAI,GAAG,EAAE,CAAC;QAShD,gBAAW,GAAG,KAAK,CAAC;QACpB,iBAAY,GAAG,KAAK,CAAC;QACrB,sBAAiB,GAAG,KAAK,CAAC;QAG1B,kBAAa,GAAG,KAAK,CAAC;QACtB,eAAU,GAAG,KAAK,CAAC;QAwGnB,cAAS,GAAG,GAAG,EAAE;YAChC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,OAAO,IAAI,CAAC,MAAM,CAAC;QACrB,CAAC,CAAC;QAEe,iBAAY,GAAG,GAAG,EAAE;YACnC,OAAO,IAAI,CAAA,wBAAwB,IAAI,CAAC,QAAQ,yBAAyB,CAAC;QAC5E,CAAC,CAAC;QA3GA,IAAI,CAAC,aAAa,CAAC,IAAI,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC;QAC7C,IAAI,CAAC,QAAQ,EAAE;YACb,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,KAAiB,EAAE,EAAE;gBACnD,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE;oBAC7B,OAAO;iBACR;gBACD,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,uBAAuB,CAAC,IAAI,CAAC,KAAM,CAAC,CAAC;YACvC,CAAC,CAAC,CAAC;SACJ;IACH,CAAC;IAEQ,KAAK;QACZ,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,CAAC;IACtB,CAAC;IAED,CAAC,YAAY,CAAC;QACZ,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IAC1C,CAAC;IAEkB,MAAM,CAAC,OAAiC;QACzD,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC;YACjD,OAAO,CAAC,GAAG,CAAC,eAAe,CAAC,EAAE;YAChC,IAAI,CAAC,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC;YAC1D,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC;YAC7D,IAAI,CAAC,iBAAiB;gBAClB,OAAO,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC;SACxD;QAED,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,CAAC;IAEkB,MAAM;QACvB,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC;QAC9D,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC;QAChE,MAAM,iBAAiB,GAAG,IAAI,CAAC,iBAAiB,CAAC;QACjD,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;QACtD,MAAM,eAAe,GAAG,IAAI,CAAC,aAAa,CAAC;QAE3C,MAAM,gBAAgB,GAAG,QAAQ,CAAC;YAChC,UAAU,EAAE,SAAS,IAAI,eAAe;YACxC,YAAY,EAAE,CAAC,SAAS,IAAI,CAAC,eAAe;YAC5C,SAAS,EAAE,SAAS;YACpB,eAAe,EAAE,eAAe;YAChC,OAAO,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ;YACrC,iBAAiB,EAAE,QAAQ;YAC3B,cAAc,EAAE,WAAW;YAC3B,oBAAoB,EAAE,iBAAiB;YACvC,eAAe,EAAE,IAAI,CAAC,YAAY;SACnC,CAAC,CAAC;QAEH,iCAAiC;QACjC,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,IAAI,CAAA;8BACe,gBAAgB;;;kCAGZ,IAAI,CAAC,aAAa;UAC1C,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,YAAY,CAAC;;;;;;;uBAO3B,eAAe,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO;qBACrC,SAAS,IAAI,OAAO;oBACrB,IAAI,CAAC,QAAQ;yBACR,IAAI,CAAC,aAAa;mBACxB,IAAI,CAAC,OAAO;gBACf,IAAI,CAAC,UAAU;kBACb,IAAI,CAAC,YAAY;iBAClB,IAAI,CAAC,WAAW;uBACV,IAAI,CAAC,iBAAiB;UACnC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;;MAE1B,CAAC;IACL,CAAC;IAEO,UAAU;QAChB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC7B,CAAC;IAEO,YAAY,CAAC,KAAY;QAC/B,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAChD,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;QAC9B,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,aAAa,CAAC;QAE1C,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC/B,CAAC;IAEO,WAAW;QACjB,IAAI,CAAC,aAAa,GAAG,qBAAqB,EAAE,CAAC;IAC/C,CAAC;IAEO,iBAAiB;QACvB,YAAY,EAAE,CAAC;QACf,IAAI,CAAC,aAAa,GAAG,qBAAqB,EAAE,CAAC;IAC/C,CAAC;;;AA9JD;IACE,yBAAyB,CAAC,EAAI,CAAC,CAAC;AAClC,CAAC,GAAA,CAAA;AAED;;GAEG;AACI,uBAAc,GAAG,IAAI,CAAC;AAKa;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;yCAAiB;AAKhB;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;0CAAkB;AAKjB;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;uCAAe;AAOd;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;+CAAuB;AAOpD;IAAX,QAAQ,EAAE;uCAAc;AAK8B;IAAtD,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,eAAe,EAAC,CAAC;sCAAW;AASxD;IAAR,KAAK,EAAE;6CAA6B;AAC5B;IAAR,KAAK,EAAE;8CAA8B;AAC7B;IAAR,KAAK,EAAE;mDAAmC;AAClB;IAAxB,UAAU,CAAC,WAAW,CAAC;wCAAkD;AAC1D;IAAf,KAAK,CAAC,OAAO,CAAC;uCAAgD;AACtD;IAAR,KAAK,EAAE;+CAA+B;AAC9B;IAAR,KAAK,EAAE;4CAA4B","sourcesContent":["/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues, TemplateResult} from 'lit';\nimport {property, query, queryAsync, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {when} from 'lit/directives/when.js';\n\nimport {requestUpdateOnAriaChange} from '../../aria/delegate.js';\nimport {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../controller/events.js';\nimport {FormController, getFormValue} from '../../controller/form-controller.js';\nimport {stringConverter} from '../../controller/string-converter.js';\nimport {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';\nimport {ripple} from '../../ripple/directive.js';\nimport {MdRipple} from '../../ripple/ripple.js';\nimport {ARIAMixinStrict} from '../../types/aria.js';\n\n/**\n * A checkbox component.\n */\nexport class Checkbox extends LitElement {\n static {\n requestUpdateOnAriaChange(this);\n }\n\n /**\n * @nocollapse\n */\n static formAssociated = true;\n\n /**\n * Whether or not the checkbox is selected.\n */\n @property({type: Boolean, reflect: true}) 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 invalid.\n */\n @property({type: Boolean, reflect: true}) error = 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, reflect: true}) indeterminate = 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 @property({reflect: true, converter: stringConverter}) name = '';\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.closest('form');\n }\n\n @state() private prevChecked = false;\n @state() private prevDisabled = false;\n @state() private prevIndeterminate = false;\n @queryAsync('md-ripple') private readonly ripple!: Promise<MdRipple|null>;\n @query('input') private readonly input!: HTMLInputElement|null;\n @state() private showFocusRing = false;\n @state() private showRipple = false;\n\n constructor() {\n super();\n this.addController(new FormController(this));\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 override focus() {\n this.input?.focus();\n }\n\n [getFormValue]() {\n return this.checked ? this.value : null;\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 super.update(changed);\n }\n\n protected override render(): TemplateResult {\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 'selected': isChecked || isIndeterminate,\n 'unselected': !isChecked && !isIndeterminate,\n 'checked': isChecked,\n 'indeterminate': isIndeterminate,\n 'error': this.error && !this.disabled,\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} = this as ARIAMixinStrict;\n return html`\n <div class=\"container ${containerClasses}\">\n <div class=\"outline\"></div>\n <div class=\"background\"></div>\n <md-focus-ring .visible=${this.showFocusRing}></md-focus-ring>\n ${when(this.showRipple, this.renderRipple)}\n <svg class=\"icon\" viewBox=\"0 0 18 18\">\n <rect class=\"mark short\" />\n <rect class=\"mark long\" />\n </svg>\n </div>\n <input type=\"checkbox\"\n aria-checked=${isIndeterminate ? 'mixed' : nothing}\n aria-label=${ariaLabel || nothing}\n ?disabled=${this.disabled}\n .indeterminate=${this.indeterminate}\n .checked=${this.checked}\n @blur=${this.handleBlur}\n @change=${this.handleChange}\n @focus=${this.handleFocus}\n @pointerdown=${this.handlePointerDown}\n ${ripple(this.getRipple)}\n >\n `;\n }\n\n private handleBlur() {\n this.showFocusRing = false;\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 handleFocus() {\n this.showFocusRing = shouldShowStrongFocus();\n }\n\n private handlePointerDown() {\n pointerPress();\n this.showFocusRing = shouldShowStrongFocus();\n }\n\n private readonly getRipple = () => { // bind to this\n this.showRipple = true;\n return this.ripple;\n };\n\n private readonly renderRipple = () => { // bind to this\n return html`<md-ripple ?disabled=${this.disabled} unbounded></md-ripple>`;\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/focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues} from 'lit';\nimport {property, query, queryAsync, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {when} from 'lit/directives/when.js';\n\nimport {requestUpdateOnAriaChange} from '../../aria/delegate.js';\nimport {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../controller/events.js';\nimport {FormController, getFormValue} from '../../controller/form-controller.js';\nimport {stringConverter} from '../../controller/string-converter.js';\nimport {ripple} from '../../ripple/directive.js';\nimport {MdRipple} from '../../ripple/ripple.js';\nimport {ARIAMixinStrict} from '../../types/aria.js';\n\n/**\n * A checkbox component.\n */\nexport class Checkbox extends LitElement {\n static {\n requestUpdateOnAriaChange(this);\n }\n\n /**\n * @nocollapse\n */\n static formAssociated = true;\n\n /**\n * Whether or not the checkbox is selected.\n */\n @property({type: Boolean, reflect: true}) 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 invalid.\n */\n @property({type: Boolean, reflect: true}) error = 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, reflect: true}) indeterminate = 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 @property({reflect: true, converter: stringConverter}) name = '';\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.closest('form');\n }\n\n @state() private prevChecked = false;\n @state() private prevDisabled = false;\n @state() private prevIndeterminate = false;\n @queryAsync('md-ripple') private readonly ripple!: Promise<MdRipple|null>;\n @query('input') private readonly input!: HTMLInputElement|null;\n @state() private showRipple = false;\n\n constructor() {\n super();\n this.addController(new FormController(this));\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 override focus() {\n this.input?.focus();\n }\n\n [getFormValue]() {\n return this.checked ? this.value : null;\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 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 'selected': isChecked || isIndeterminate,\n 'unselected': !isChecked && !isIndeterminate,\n 'checked': isChecked,\n 'indeterminate': isIndeterminate,\n 'error': this.error && !this.disabled,\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} = this as ARIAMixinStrict;\n return html`\n <div class=\"container ${containerClasses}\">\n <div class=\"outline\"></div>\n <div class=\"background\"></div>\n <md-focus-ring for=\"input\"></md-focus-ring>\n ${when(this.showRipple, this.renderRipple)}\n <svg class=\"icon\" viewBox=\"0 0 18 18\">\n <rect class=\"mark short\" />\n <rect class=\"mark long\" />\n </svg>\n </div>\n <input type=\"checkbox\"\n id=\"input\"\n aria-checked=${isIndeterminate ? 'mixed' : nothing}\n aria-label=${ariaLabel || nothing}\n ?disabled=${this.disabled}\n .indeterminate=${this.indeterminate}\n .checked=${this.checked}\n @change=${this.handleChange}\n ${ripple(this.getRipple)}\n >\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 private readonly getRipple = () => { // bind to this\n this.showRipple = true;\n return this.ripple;\n };\n\n private readonly renderRipple = () => { // bind to this\n return html`<md-ripple ?disabled=${this.disabled} unbounded></md-ripple>`;\n };\n}\n"]}
@@ -4,6 +4,6 @@
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
6
  import { css } from 'lit';
7
- export const styles = css `@media(forced-colors: active){:host{--md-checkbox-selected-container-color:CanvasText;--md-checkbox-selected-disabled-container-color:GrayText;--md-checkbox-selected-disabled-container-opacity:1;--md-checkbox-selected-disabled-icon-color:Canvas;--md-checkbox-selected-error-container-color:CanvasText;--md-checkbox-selected-error-focus-container-color:CanvasText;--md-checkbox-selected-error-focus-icon-color:Canvas;--md-checkbox-selected-error-hover-container-color:CanvasText;--md-checkbox-selected-error-hover-icon-color:Canvas;--md-checkbox-selected-error-icon-color:Canvas;--md-checkbox-selected-error-pressed-container-color:CanvasText;--md-checkbox-selected-error-pressed-icon-color:Canvas;--md-checkbox-selected-focus-container-color:CanvasText;--md-checkbox-selected-focus-icon-color:Canvas;--md-checkbox-selected-hover-container-color:CanvasText;--md-checkbox-selected-hover-icon-color:Canvas;--md-checkbox-selected-icon-color:Canvas;--md-checkbox-selected-pressed-container-color:CanvasText;--md-checkbox-selected-pressed-icon-color:Canvas;--md-checkbox-unselected-disabled-container-opacity:1;--md-checkbox-unselected-disabled-outline-color:GrayText;--md-checkbox-unselected-error-focus-outline-color:CanvasText;--md-checkbox-unselected-error-hover-outline-color:CanvasText;--md-checkbox-unselected-error-outline-color:CanvasText;--md-checkbox-unselected-error-pressed-outline-color:CanvasText;--md-checkbox-unselected-focus-outline-color:CanvasText;--md-checkbox-unselected-hover-outline-color:CanvasText;--md-checkbox-unselected-outline-color:CanvasText;--md-checkbox-unselected-pressed-outline-color:CanvasText}}/*# sourceMappingURL=forced-colors-styles.css.map */
7
+ export const styles = css `@media(forced-colors: active){:host{--md-checkbox-selected-container-color: CanvasText;--md-checkbox-selected-disabled-container-color: GrayText;--md-checkbox-selected-disabled-container-opacity: 1;--md-checkbox-selected-disabled-icon-color: Canvas;--md-checkbox-selected-error-container-color: CanvasText;--md-checkbox-selected-error-focus-container-color: CanvasText;--md-checkbox-selected-error-focus-icon-color: Canvas;--md-checkbox-selected-error-hover-container-color: CanvasText;--md-checkbox-selected-error-hover-icon-color: Canvas;--md-checkbox-selected-error-icon-color: Canvas;--md-checkbox-selected-error-pressed-container-color: CanvasText;--md-checkbox-selected-error-pressed-icon-color: Canvas;--md-checkbox-selected-focus-container-color: CanvasText;--md-checkbox-selected-focus-icon-color: Canvas;--md-checkbox-selected-hover-container-color: CanvasText;--md-checkbox-selected-hover-icon-color: Canvas;--md-checkbox-selected-icon-color: Canvas;--md-checkbox-selected-pressed-container-color: CanvasText;--md-checkbox-selected-pressed-icon-color: Canvas;--md-checkbox-unselected-disabled-container-opacity: 1;--md-checkbox-unselected-disabled-outline-color: GrayText;--md-checkbox-unselected-error-focus-outline-color: CanvasText;--md-checkbox-unselected-error-hover-outline-color: CanvasText;--md-checkbox-unselected-error-outline-color: CanvasText;--md-checkbox-unselected-error-pressed-outline-color: CanvasText;--md-checkbox-unselected-focus-outline-color: CanvasText;--md-checkbox-unselected-hover-outline-color: CanvasText;--md-checkbox-unselected-outline-color: CanvasText;--md-checkbox-unselected-pressed-outline-color: CanvasText}}/*# sourceMappingURL=forced-colors-styles.css.map */
8
8
  `;
9
9
  //# sourceMappingURL=forced-colors-styles.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"forced-colors-styles.css.js","sourceRoot":"","sources":["forced-colors-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`@media(forced-colors: active){:host{--md-checkbox-selected-container-color:CanvasText;--md-checkbox-selected-disabled-container-color:GrayText;--md-checkbox-selected-disabled-container-opacity:1;--md-checkbox-selected-disabled-icon-color:Canvas;--md-checkbox-selected-error-container-color:CanvasText;--md-checkbox-selected-error-focus-container-color:CanvasText;--md-checkbox-selected-error-focus-icon-color:Canvas;--md-checkbox-selected-error-hover-container-color:CanvasText;--md-checkbox-selected-error-hover-icon-color:Canvas;--md-checkbox-selected-error-icon-color:Canvas;--md-checkbox-selected-error-pressed-container-color:CanvasText;--md-checkbox-selected-error-pressed-icon-color:Canvas;--md-checkbox-selected-focus-container-color:CanvasText;--md-checkbox-selected-focus-icon-color:Canvas;--md-checkbox-selected-hover-container-color:CanvasText;--md-checkbox-selected-hover-icon-color:Canvas;--md-checkbox-selected-icon-color:Canvas;--md-checkbox-selected-pressed-container-color:CanvasText;--md-checkbox-selected-pressed-icon-color:Canvas;--md-checkbox-unselected-disabled-container-opacity:1;--md-checkbox-unselected-disabled-outline-color:GrayText;--md-checkbox-unselected-error-focus-outline-color:CanvasText;--md-checkbox-unselected-error-hover-outline-color:CanvasText;--md-checkbox-unselected-error-outline-color:CanvasText;--md-checkbox-unselected-error-pressed-outline-color:CanvasText;--md-checkbox-unselected-focus-outline-color:CanvasText;--md-checkbox-unselected-hover-outline-color:CanvasText;--md-checkbox-unselected-outline-color:CanvasText;--md-checkbox-unselected-pressed-outline-color:CanvasText}}/*# sourceMappingURL=forced-colors-styles.css.map */\n`;\n "]}
1
+ {"version":3,"file":"forced-colors-styles.css.js","sourceRoot":"","sources":["forced-colors-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`@media(forced-colors: active){:host{--md-checkbox-selected-container-color: CanvasText;--md-checkbox-selected-disabled-container-color: GrayText;--md-checkbox-selected-disabled-container-opacity: 1;--md-checkbox-selected-disabled-icon-color: Canvas;--md-checkbox-selected-error-container-color: CanvasText;--md-checkbox-selected-error-focus-container-color: CanvasText;--md-checkbox-selected-error-focus-icon-color: Canvas;--md-checkbox-selected-error-hover-container-color: CanvasText;--md-checkbox-selected-error-hover-icon-color: Canvas;--md-checkbox-selected-error-icon-color: Canvas;--md-checkbox-selected-error-pressed-container-color: CanvasText;--md-checkbox-selected-error-pressed-icon-color: Canvas;--md-checkbox-selected-focus-container-color: CanvasText;--md-checkbox-selected-focus-icon-color: Canvas;--md-checkbox-selected-hover-container-color: CanvasText;--md-checkbox-selected-hover-icon-color: Canvas;--md-checkbox-selected-icon-color: Canvas;--md-checkbox-selected-pressed-container-color: CanvasText;--md-checkbox-selected-pressed-icon-color: Canvas;--md-checkbox-unselected-disabled-container-opacity: 1;--md-checkbox-unselected-disabled-outline-color: GrayText;--md-checkbox-unselected-error-focus-outline-color: CanvasText;--md-checkbox-unselected-error-hover-outline-color: CanvasText;--md-checkbox-unselected-error-outline-color: CanvasText;--md-checkbox-unselected-error-pressed-outline-color: CanvasText;--md-checkbox-unselected-focus-outline-color: CanvasText;--md-checkbox-unselected-hover-outline-color: CanvasText;--md-checkbox-unselected-outline-color: CanvasText;--md-checkbox-unselected-pressed-outline-color: CanvasText}}/*# sourceMappingURL=forced-colors-styles.css.map */\n`;\n "]}
@@ -7,6 +7,7 @@ import { __decorate } from "tslib";
7
7
  import { customElement } from 'lit/decorators.js';
8
8
  import { AssistChip } from './lib/assist-chip.js';
9
9
  import { styles } from './lib/assist-styles.css.js';
10
+ import { styles as elevatedStyles } from './lib/elevated-styles.css.js';
10
11
  import { styles as sharedStyles } from './lib/shared-styles.css.js';
11
12
  /**
12
13
  * TODO(b/243982145): add docs
@@ -16,7 +17,7 @@ import { styles as sharedStyles } from './lib/shared-styles.css.js';
16
17
  */
17
18
  let MdAssistChip = class MdAssistChip extends AssistChip {
18
19
  };
19
- MdAssistChip.styles = [sharedStyles, styles];
20
+ MdAssistChip.styles = [sharedStyles, elevatedStyles, styles];
20
21
  MdAssistChip = __decorate([
21
22
  customElement('md-assist-chip')
22
23
  ], MdAssistChip);
@@ -1 +1 @@
1
- {"version":3,"file":"assist-chip.js","sourceRoot":"","sources":["assist-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAC,MAAM,EAAC,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAQlE;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;AADrC,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB;SAFY,YAAY","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 {AssistChip} from './lib/assist-chip.js';\nimport {styles} from './lib/assist-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-assist-chip': MdAssistChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-assist-chip')\nexport class MdAssistChip extends AssistChip {\n static override styles = [sharedStyles, styles];\n}\n"]}
1
+ {"version":3,"file":"assist-chip.js","sourceRoot":"","sources":["assist-chip.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAC,MAAM,EAAC,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,8BAA8B,CAAC;AACtE,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAQlE;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG,CAAC,YAAY,EAAE,cAAc,EAAE,MAAM,CAAC,CAAC;AADrD,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB;SAFY,YAAY","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 {AssistChip} from './lib/assist-chip.js';\nimport {styles} from './lib/assist-styles.css.js';\nimport {styles as elevatedStyles} from './lib/elevated-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-assist-chip': MdAssistChip;\n }\n}\n\n/**\n * TODO(b/243982145): add docs\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-assist-chip')\nexport class MdAssistChip extends AssistChip {\n static override styles = [sharedStyles, elevatedStyles, styles];\n}\n"]}
@@ -5,6 +5,7 @@
5
5
  */
6
6
  import { __decorate } from "tslib";
7
7
  import { customElement } from 'lit/decorators.js';
8
+ import { styles as elevatedStyles } from './lib/elevated-styles.css.js';
8
9
  import { FilterChip } from './lib/filter-chip.js';
9
10
  import { styles } from './lib/filter-styles.css.js';
10
11
  import { styles as sharedStyles } from './lib/shared-styles.css.js';
@@ -16,7 +17,7 @@ import { styles as sharedStyles } from './lib/shared-styles.css.js';
16
17
  */
17
18
  let MdFilterChip = class MdFilterChip extends FilterChip {
18
19
  };
19
- MdFilterChip.styles = [sharedStyles, styles];
20
+ MdFilterChip.styles = [sharedStyles, elevatedStyles, styles];
20
21
  MdFilterChip = __decorate([
21
22
  customElement('md-filter-chip')
22
23
  ], MdFilterChip);
@@ -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,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAC,MAAM,EAAC,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAQlE;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;AADrC,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB;SAFY,YAAY","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 {FilterChip} from './lib/filter-chip.js';\nimport {styles} from './lib/filter-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-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 = [sharedStyles, styles];\n}\n"]}
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,8BAA8B,CAAC;AACtE,OAAO,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAChD,OAAO,EAAC,MAAM,EAAC,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAQlE;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;;AAC1B,mBAAM,GAAG,CAAC,YAAY,EAAE,cAAc,EAAE,MAAM,CAAC,CAAC;AADrD,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAExB;SAFY,YAAY","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 './lib/elevated-styles.css.js';\nimport {FilterChip} from './lib/filter-chip.js';\nimport {styles} from './lib/filter-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-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 = [sharedStyles, elevatedStyles, styles];\n}\n"]}
@@ -4,15 +4,31 @@
4
4
  //
5
5
 
6
6
  // go/keep-sorted start
7
- @use '../../sass/theme';
7
+ @use 'sass:list';
8
+ // go/keep-sorted end
9
+ // go/keep-sorted start
8
10
  @use '../../tokens';
9
11
  // go/keep-sorted end
10
12
 
11
13
  @mixin theme($tokens) {
12
- $tokens: theme.validate-theme(tokens.md-comp-assist-chip-values(), $tokens);
14
+ $supported-tokens: list.join(
15
+ tokens.$md-comp-assist-chip-supported-tokens,
16
+ (
17
+ 'container-shape-start-start',
18
+ 'container-shape-start-end',
19
+ 'container-shape-end-end',
20
+ 'container-shape-end-start'
21
+ )
22
+ );
13
23
 
14
24
  @each $token, $value in $tokens {
15
- --md-assist-chip-#{$token}: #{$value};
25
+ @if list.index($supported-tokens, $token) == null {
26
+ @error 'Token `#{$token}` is not a supported token.';
27
+ }
28
+
29
+ @if $value {
30
+ --md-assist-chip-#{$token}: #{$value};
31
+ }
16
32
  }
17
33
  }
18
34
 
@@ -23,5 +39,23 @@
23
39
  @each $token, $value in $tokens {
24
40
  --_#{$token}: #{$value};
25
41
  }
42
+
43
+ // Support logical shape properties
44
+ --_container-shape-start-start: var(
45
+ --md-assist-chip-container-shape-start-start,
46
+ var(--_container-shape)
47
+ );
48
+ --_container-shape-start-end: var(
49
+ --md-assist-chip-container-shape-start-end,
50
+ var(--_container-shape)
51
+ );
52
+ --_container-shape-end-end: var(
53
+ --md-assist-chip-container-shape-end-end,
54
+ var(--_container-shape)
55
+ );
56
+ --_container-shape-end-start: var(
57
+ --md-assist-chip-container-shape-end-start,
58
+ var(--_container-shape)
59
+ );
26
60
  }
27
61
  }