@material/web 1.0.0-pre.6 → 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 (504) hide show
  1. package/README.md +8 -8
  2. package/aria/aria.d.ts +43 -0
  3. package/aria/aria.js +80 -0
  4. package/aria/aria.js.map +1 -0
  5. package/aria/delegate.d.ts +37 -0
  6. package/aria/delegate.js +53 -0
  7. package/aria/delegate.js.map +1 -0
  8. package/badge/badge.d.ts +0 -1
  9. package/badge/badge.js +0 -1
  10. package/badge/badge.js.map +1 -1
  11. package/badge/lib/badge.d.ts +5 -7
  12. package/badge/lib/badge.js +9 -12
  13. package/badge/lib/badge.js.map +1 -1
  14. package/button/lib/_elevated-button.scss +35 -6
  15. package/button/lib/_elevation.scss +13 -3
  16. package/button/lib/_filled-button.scss +35 -3
  17. package/button/lib/_outlined-button.scss +35 -6
  18. package/button/lib/_shared.scss +4 -2
  19. package/button/lib/_text-button.scss +35 -6
  20. package/button/lib/_tonal-button.scss +34 -7
  21. package/button/lib/button.d.ts +24 -38
  22. package/button/lib/button.js +40 -89
  23. package/button/lib/button.js.map +1 -1
  24. package/button/lib/elevated-button.d.ts +6 -4
  25. package/button/lib/elevated-button.js.map +1 -1
  26. package/button/lib/elevated-styles.css.js +1 -1
  27. package/button/lib/elevated-styles.css.js.map +1 -1
  28. package/button/lib/filled-button.d.ts +6 -4
  29. package/button/lib/filled-button.js.map +1 -1
  30. package/button/lib/filled-styles.css.js +1 -1
  31. package/button/lib/filled-styles.css.js.map +1 -1
  32. package/button/lib/outlined-button.d.ts +6 -4
  33. package/button/lib/outlined-button.js.map +1 -1
  34. package/button/lib/outlined-styles.css.js +1 -1
  35. package/button/lib/outlined-styles.css.js.map +1 -1
  36. package/button/lib/shared-elevation-styles.css.js +1 -1
  37. package/button/lib/shared-elevation-styles.css.js.map +1 -1
  38. package/button/lib/shared-styles.css.js +1 -1
  39. package/button/lib/shared-styles.css.js.map +1 -1
  40. package/button/lib/text-button.d.ts +5 -2
  41. package/button/lib/text-button.js.map +1 -1
  42. package/button/lib/text-styles.css.js +1 -1
  43. package/button/lib/text-styles.css.js.map +1 -1
  44. package/button/lib/tonal-button.d.ts +6 -4
  45. package/button/lib/tonal-button.js.map +1 -1
  46. package/button/lib/tonal-styles.css.js +1 -1
  47. package/button/lib/tonal-styles.css.js.map +1 -1
  48. package/checkbox/lib/_checkbox.scss +48 -47
  49. package/checkbox/lib/checkbox-styles.css.js +1 -1
  50. package/checkbox/lib/checkbox-styles.css.js.map +1 -1
  51. package/checkbox/lib/checkbox.d.ts +2 -7
  52. package/checkbox/lib/checkbox.js +35 -62
  53. package/checkbox/lib/checkbox.js.map +1 -1
  54. package/checkbox/lib/forced-colors-styles.css.js +1 -1
  55. package/checkbox/lib/forced-colors-styles.css.js.map +1 -1
  56. package/chips/_filter-chip.scss +6 -0
  57. package/chips/assist-chip.js +2 -1
  58. package/chips/assist-chip.js.map +1 -1
  59. package/chips/filter-chip.d.ts +20 -0
  60. package/chips/filter-chip.js +25 -0
  61. package/chips/filter-chip.js.map +1 -0
  62. package/chips/lib/_assist-chip.scss +37 -3
  63. package/chips/lib/_elevated.scss +60 -0
  64. package/chips/lib/_filter-chip.scss +175 -0
  65. package/chips/lib/_shared.scss +48 -84
  66. package/chips/lib/_suggestion-chip.scss +36 -5
  67. package/chips/lib/assist-chip.d.ts +12 -0
  68. package/chips/lib/assist-chip.js +64 -0
  69. package/chips/lib/assist-chip.js.map +1 -1
  70. package/chips/lib/assist-styles.css.js +1 -1
  71. package/chips/lib/assist-styles.css.js.map +1 -1
  72. package/chips/lib/chip.d.ts +24 -16
  73. package/chips/lib/chip.js +53 -74
  74. package/chips/lib/chip.js.map +1 -1
  75. package/chips/lib/elevated-styles.css.js +9 -0
  76. package/chips/lib/elevated-styles.css.js.map +1 -0
  77. package/{fab/lib/fab-extended-styles.scss → chips/lib/elevated-styles.scss} +3 -3
  78. package/chips/lib/filter-chip.d.ts +26 -0
  79. package/chips/lib/filter-chip.js +80 -0
  80. package/chips/lib/filter-chip.js.map +1 -0
  81. package/chips/lib/filter-styles.css.js +9 -0
  82. package/chips/lib/filter-styles.css.js.map +1 -0
  83. package/chips/lib/filter-styles.scss +10 -0
  84. package/chips/lib/shared-styles.css.js +1 -1
  85. package/chips/lib/shared-styles.css.js.map +1 -1
  86. package/chips/lib/suggestion-chip.d.ts +2 -2
  87. package/chips/lib/suggestion-chip.js +4 -2
  88. package/chips/lib/suggestion-chip.js.map +1 -1
  89. package/chips/lib/suggestion-styles.css.js +1 -1
  90. package/chips/lib/suggestion-styles.css.js.map +1 -1
  91. package/chips/suggestion-chip.js +2 -1
  92. package/chips/suggestion-chip.js.map +1 -1
  93. package/circularprogress/harness.d.ts +1 -0
  94. package/circularprogress/harness.js +4 -0
  95. package/circularprogress/harness.js.map +1 -1
  96. package/circularprogress/lib/_circular-progress.scss +13 -7
  97. package/circularprogress/lib/circular-progress-styles.css.js +1 -1
  98. package/circularprogress/lib/circular-progress-styles.css.js.map +1 -1
  99. package/circularprogress/lib/circular-progress.d.ts +5 -7
  100. package/circularprogress/lib/circular-progress.js +17 -21
  101. package/circularprogress/lib/circular-progress.js.map +1 -1
  102. package/dialog/lib/_dialog.scss +8 -9
  103. package/dialog/lib/_tokens.scss +0 -1
  104. package/dialog/lib/dialog-styles.css.js +1 -1
  105. package/dialog/lib/dialog-styles.css.js.map +1 -1
  106. package/dialog/lib/dialog.d.ts +10 -10
  107. package/dialog/lib/dialog.js +33 -56
  108. package/dialog/lib/dialog.js.map +1 -1
  109. package/divider/lib/divider.js +4 -7
  110. package/divider/lib/divider.js.map +1 -1
  111. package/elevation/lib/_elevation.scss +5 -7
  112. package/elevation/lib/elevation-styles.css.js +1 -1
  113. package/elevation/lib/elevation-styles.css.js.map +1 -1
  114. package/elevation/lib/elevation.d.ts +1 -1
  115. package/elevation/lib/elevation.js.map +1 -1
  116. package/fab/_fab.scss +1 -0
  117. package/fab/branded-fab.d.ts +56 -0
  118. package/fab/branded-fab.js +56 -0
  119. package/fab/branded-fab.js.map +1 -0
  120. package/fab/fab.d.ts +25 -5
  121. package/fab/fab.js +27 -10
  122. package/fab/fab.js.map +1 -1
  123. package/fab/harness.d.ts +1 -2
  124. package/fab/harness.js +1 -1
  125. package/fab/harness.js.map +1 -1
  126. package/fab/lib/_fab-branded.scss +81 -0
  127. package/fab/lib/_fab.scss +221 -19
  128. package/fab/lib/_shared.scss +161 -131
  129. package/fab/lib/fab-branded-styles.css.d.ts +1 -0
  130. package/fab/lib/fab-branded-styles.css.js +9 -0
  131. package/fab/lib/fab-branded-styles.css.js.map +1 -0
  132. package/fab/lib/fab-branded-styles.scss +10 -0
  133. package/fab/lib/fab-styles.css.js +1 -1
  134. package/fab/lib/fab-styles.css.js.map +1 -1
  135. package/fab/lib/fab.d.ts +18 -10
  136. package/fab/lib/fab.js +19 -12
  137. package/fab/lib/fab.js.map +1 -1
  138. package/fab/lib/forced-colors-styles.css.d.ts +1 -0
  139. package/fab/lib/forced-colors-styles.css.js +9 -0
  140. package/fab/lib/forced-colors-styles.css.js.map +1 -0
  141. package/fab/lib/forced-colors-styles.scss +26 -0
  142. package/fab/lib/shared-styles.css.d.ts +1 -0
  143. package/fab/lib/shared-styles.css.js +9 -0
  144. package/fab/lib/shared-styles.css.js.map +1 -0
  145. package/fab/lib/{fab-shared-styles.scss → shared-styles.scss} +1 -1
  146. package/fab/lib/shared.d.ts +49 -0
  147. package/fab/lib/shared.js +113 -0
  148. package/fab/lib/shared.js.map +1 -0
  149. package/field/lib/_filled-field.scss +47 -12
  150. package/field/lib/_outlined-field.scss +39 -12
  151. package/field/lib/field.js +14 -27
  152. package/field/lib/field.js.map +1 -1
  153. package/field/lib/filled-styles.css.js +1 -1
  154. package/field/lib/filled-styles.css.js.map +1 -1
  155. package/field/lib/outlined-styles.css.js +1 -1
  156. package/field/lib/outlined-styles.css.js.map +1 -1
  157. package/focus/focus-ring.d.ts +2 -1
  158. package/focus/focus-ring.js +2 -1
  159. package/focus/focus-ring.js.map +1 -1
  160. package/focus/lib/_focus-ring.scss +49 -34
  161. package/focus/lib/focus-ring-styles.css.js +1 -1
  162. package/focus/lib/focus-ring-styles.css.js.map +1 -1
  163. package/focus/lib/focus-ring.d.ts +59 -12
  164. package/focus/lib/focus-ring.js +118 -14
  165. package/focus/lib/focus-ring.js.map +1 -1
  166. package/icon/icon.d.ts +0 -1
  167. package/icon/icon.js +0 -1
  168. package/icon/icon.js.map +1 -1
  169. package/icon/lib/_icon.scss +2 -0
  170. package/icon/lib/icon-styles.css.js +1 -1
  171. package/icon/lib/icon-styles.css.js.map +1 -1
  172. package/icon/lib/icon.d.ts +5 -4
  173. package/icon/lib/icon.js +3 -2
  174. package/icon/lib/icon.js.map +1 -1
  175. package/iconbutton/filled-icon-button.d.ts +6 -2
  176. package/iconbutton/filled-icon-button.js.map +1 -1
  177. package/iconbutton/filled-tonal-icon-button.d.ts +6 -2
  178. package/iconbutton/filled-tonal-icon-button.js.map +1 -1
  179. package/iconbutton/harness.d.ts +1 -1
  180. package/iconbutton/harness.js +4 -1
  181. package/iconbutton/harness.js.map +1 -1
  182. package/iconbutton/lib/_filled-icon-button.scss +38 -13
  183. package/iconbutton/lib/_filled-tonal-icon-button.scss +38 -11
  184. package/iconbutton/lib/_outlined-icon-button.scss +38 -13
  185. package/iconbutton/lib/_shared.scss +4 -6
  186. package/iconbutton/lib/_standard-icon-button.scss +14 -14
  187. package/iconbutton/lib/filled-styles.css.js +1 -1
  188. package/iconbutton/lib/filled-styles.css.js.map +1 -1
  189. package/iconbutton/lib/filled-tonal-styles.css.js +1 -1
  190. package/iconbutton/lib/filled-tonal-styles.css.js.map +1 -1
  191. package/iconbutton/lib/icon-button.d.ts +17 -25
  192. package/iconbutton/lib/icon-button.js +37 -73
  193. package/iconbutton/lib/icon-button.js.map +1 -1
  194. package/iconbutton/lib/outlined-styles.css.js +1 -1
  195. package/iconbutton/lib/outlined-styles.css.js.map +1 -1
  196. package/iconbutton/lib/shared-styles.css.js +1 -1
  197. package/iconbutton/lib/shared-styles.css.js.map +1 -1
  198. package/iconbutton/lib/standard-styles.css.js +1 -1
  199. package/iconbutton/lib/standard-styles.css.js.map +1 -1
  200. package/iconbutton/outlined-icon-button.d.ts +5 -2
  201. package/iconbutton/outlined-icon-button.js.map +1 -1
  202. package/iconbutton/standard-icon-button.d.ts +5 -2
  203. package/iconbutton/standard-icon-button.js.map +1 -1
  204. package/linearprogress/_linear-progress.scss +6 -0
  205. package/linearprogress/harness.d.ts +13 -0
  206. package/linearprogress/harness.js +18 -0
  207. package/linearprogress/harness.js.map +1 -0
  208. package/linearprogress/lib/_linear-progress.scss +386 -0
  209. package/linearprogress/lib/linear-progress-styles.css.d.ts +1 -0
  210. package/linearprogress/lib/linear-progress-styles.css.js +9 -0
  211. package/linearprogress/lib/linear-progress-styles.css.js.map +1 -0
  212. package/linearprogress/lib/linear-progress-styles.scss +8 -0
  213. package/linearprogress/lib/linear-progress.d.ts +35 -0
  214. package/linearprogress/lib/linear-progress.js +127 -0
  215. package/linearprogress/lib/linear-progress.js.map +1 -0
  216. package/linearprogress/linear-progress.d.ts +23 -0
  217. package/linearprogress/linear-progress.js +26 -0
  218. package/linearprogress/linear-progress.js.map +1 -0
  219. package/list/lib/_list.scss +9 -50
  220. package/list/lib/list-styles.css.js +1 -1
  221. package/list/lib/list-styles.css.js.map +1 -1
  222. package/list/lib/list.d.ts +8 -15
  223. package/list/lib/list.js +20 -45
  224. package/list/lib/list.js.map +1 -1
  225. package/list/lib/listitem/_list-item.scss +17 -72
  226. package/list/lib/listitem/forced-colors-styles.css.js +1 -1
  227. package/list/lib/listitem/forced-colors-styles.css.js.map +1 -1
  228. package/list/lib/listitem/list-item-styles.css.js +1 -1
  229. package/list/lib/listitem/list-item-styles.css.js.map +1 -1
  230. package/list/lib/listitem/list-item.d.ts +29 -31
  231. package/list/lib/listitem/list-item.js +26 -80
  232. package/list/lib/listitem/list-item.js.map +1 -1
  233. package/list/lib/listitemlink/list-item-link.js +5 -9
  234. package/list/lib/listitemlink/list-item-link.js.map +1 -1
  235. package/menu/lib/_menu.scss +9 -29
  236. package/menu/lib/menu-styles.css.js +1 -1
  237. package/menu/lib/menu-styles.css.js.map +1 -1
  238. package/menu/lib/menu.d.ts +32 -41
  239. package/menu/lib/menu.js +51 -82
  240. package/menu/lib/menu.js.map +1 -1
  241. package/menu/lib/menuitem/_menu-item.scss +16 -33
  242. package/menu/lib/menuitem/menu-item-styles.css.js +1 -1
  243. package/menu/lib/menuitem/menu-item-styles.css.js.map +1 -1
  244. package/menu/lib/menuitem/menu-item.d.ts +1 -1
  245. package/menu/lib/menuitem/menu-item.js +4 -6
  246. package/menu/lib/menuitem/menu-item.js.map +1 -1
  247. package/menu/lib/menuitemlink/menu-item-link.d.ts +0 -2
  248. package/menu/lib/menuitemlink/menu-item-link.js +3 -6
  249. package/menu/lib/menuitemlink/menu-item-link.js.map +1 -1
  250. package/menu/lib/shared.d.ts +20 -2
  251. package/menu/lib/shared.js +18 -0
  252. package/menu/lib/shared.js.map +1 -1
  253. package/menu/lib/submenuitem/sub-menu-item.d.ts +16 -13
  254. package/menu/lib/submenuitem/sub-menu-item.js +27 -18
  255. package/menu/lib/submenuitem/sub-menu-item.js.map +1 -1
  256. package/menu/lib/typeaheadController.d.ts +9 -9
  257. package/menu/lib/typeaheadController.js.map +1 -1
  258. package/navigationbar/lib/_navigation-bar.scss +7 -1
  259. package/navigationbar/lib/navigation-bar-styles.css.js +1 -1
  260. package/navigationbar/lib/navigation-bar-styles.css.js.map +1 -1
  261. package/navigationbar/lib/navigation-bar.d.ts +6 -6
  262. package/navigationbar/lib/navigation-bar.js +17 -18
  263. package/navigationbar/lib/navigation-bar.js.map +1 -1
  264. package/navigationbar/navigation-bar.d.ts +0 -1
  265. package/navigationbar/navigation-bar.js +0 -1
  266. package/navigationbar/navigation-bar.js.map +1 -1
  267. package/navigationdrawer/lib/_navigation-drawer-modal.scss +0 -3
  268. package/navigationdrawer/lib/_navigation-drawer.scss +0 -3
  269. package/navigationdrawer/lib/_shared.scss +1 -4
  270. package/navigationdrawer/lib/navigation-drawer-modal-styles.css.js +1 -1
  271. package/navigationdrawer/lib/navigation-drawer-modal-styles.css.js.map +1 -1
  272. package/navigationdrawer/lib/navigation-drawer-modal.d.ts +7 -12
  273. package/navigationdrawer/lib/navigation-drawer-modal.js +19 -41
  274. package/navigationdrawer/lib/navigation-drawer-modal.js.map +1 -1
  275. package/navigationdrawer/lib/navigation-drawer-styles.css.js +1 -1
  276. package/navigationdrawer/lib/navigation-drawer-styles.css.js.map +1 -1
  277. package/navigationdrawer/lib/navigation-drawer.d.ts +6 -10
  278. package/navigationdrawer/lib/navigation-drawer.js +17 -38
  279. package/navigationdrawer/lib/navigation-drawer.js.map +1 -1
  280. package/navigationdrawer/lib/shared-styles.css.js +1 -1
  281. package/navigationdrawer/lib/shared-styles.css.js.map +1 -1
  282. package/navigationdrawer/navigation-drawer-modal.d.ts +0 -1
  283. package/navigationdrawer/navigation-drawer-modal.js +0 -1
  284. package/navigationdrawer/navigation-drawer-modal.js.map +1 -1
  285. package/navigationdrawer/navigation-drawer.d.ts +0 -1
  286. package/navigationdrawer/navigation-drawer.js +0 -1
  287. package/navigationdrawer/navigation-drawer.js.map +1 -1
  288. package/navigationtab/lib/_navigation-tab.scss +2 -2
  289. package/navigationtab/lib/navigation-tab-styles.css.js +1 -1
  290. package/navigationtab/lib/navigation-tab-styles.css.js.map +1 -1
  291. package/navigationtab/lib/navigation-tab.d.ts +16 -29
  292. package/navigationtab/lib/navigation-tab.js +49 -88
  293. package/navigationtab/lib/navigation-tab.js.map +1 -1
  294. package/navigationtab/lib/state.d.ts +1 -1
  295. package/navigationtab/lib/state.js.map +1 -1
  296. package/navigationtab/navigation-tab.d.ts +0 -1
  297. package/navigationtab/navigation-tab.js +0 -1
  298. package/navigationtab/navigation-tab.js.map +1 -1
  299. package/package.json +1 -1
  300. package/radio/lib/_radio.scss +1 -1
  301. package/radio/lib/radio-styles.css.js +1 -1
  302. package/radio/lib/radio-styles.css.js.map +1 -1
  303. package/radio/lib/radio.d.ts +2 -8
  304. package/radio/lib/radio.js +31 -58
  305. package/radio/lib/radio.js.map +1 -1
  306. package/ripple/lib/ripple.js +11 -13
  307. package/ripple/lib/ripple.js.map +1 -1
  308. package/segmentedbutton/lib/outlined-segmented-button.d.ts +16 -7
  309. package/segmentedbutton/lib/outlined-segmented-button.js +3 -3
  310. package/segmentedbutton/lib/outlined-segmented-button.js.map +1 -1
  311. package/segmentedbutton/lib/segmented-button.d.ts +28 -40
  312. package/segmentedbutton/lib/segmented-button.js +42 -96
  313. package/segmentedbutton/lib/segmented-button.js.map +1 -1
  314. package/segmentedbutton/outlined-segmented-button.d.ts +0 -1
  315. package/segmentedbutton/outlined-segmented-button.js +0 -1
  316. package/segmentedbutton/outlined-segmented-button.js.map +1 -1
  317. package/segmentedbuttonset/lib/_outlined-segmented-button-set.scss +32 -13
  318. package/segmentedbuttonset/lib/outlined-segmented-button-set.d.ts +6 -4
  319. package/segmentedbuttonset/lib/outlined-segmented-button-set.js +3 -2
  320. package/segmentedbuttonset/lib/outlined-segmented-button-set.js.map +1 -1
  321. package/segmentedbuttonset/lib/outlined-styles.css.js +1 -1
  322. package/segmentedbuttonset/lib/outlined-styles.css.js.map +1 -1
  323. package/segmentedbuttonset/lib/segmented-button-set.d.ts +3 -9
  324. package/segmentedbuttonset/lib/segmented-button-set.js +14 -20
  325. package/segmentedbuttonset/lib/segmented-button-set.js.map +1 -1
  326. package/segmentedbuttonset/outlined-segmented-button-set.d.ts +0 -1
  327. package/segmentedbuttonset/outlined-segmented-button-set.js +0 -1
  328. package/segmentedbuttonset/outlined-segmented-button-set.js.map +1 -1
  329. package/select/_filled-select.scss +6 -0
  330. package/select/_outlined-select.scss +6 -0
  331. package/select/filled-select.d.ts +41 -0
  332. package/select/filled-select.js +46 -0
  333. package/select/filled-select.js.map +1 -0
  334. package/select/harness.d.ts +24 -0
  335. package/select/harness.js +53 -0
  336. package/select/harness.js.map +1 -0
  337. package/select/lib/_filled-select.scss +222 -0
  338. package/select/lib/_outlined-select.scss +180 -0
  339. package/select/lib/_shared.scss +48 -0
  340. package/select/lib/filled-forced-colors-styles.css.d.ts +1 -0
  341. package/select/lib/filled-forced-colors-styles.css.js +9 -0
  342. package/select/lib/filled-forced-colors-styles.css.js.map +1 -0
  343. package/select/lib/filled-forced-colors-styles.scss +29 -0
  344. package/select/lib/filled-select-styles.css.d.ts +1 -0
  345. package/select/lib/filled-select-styles.css.js +9 -0
  346. package/select/lib/filled-select-styles.css.js.map +1 -0
  347. package/select/lib/filled-select-styles.scss +10 -0
  348. package/select/lib/filled-select.d.ts +10 -0
  349. package/select/lib/filled-select.js +16 -0
  350. package/select/lib/filled-select.js.map +1 -0
  351. package/select/lib/outlined-forced-colors-styles.css.d.ts +1 -0
  352. package/select/lib/outlined-forced-colors-styles.css.js +9 -0
  353. package/select/lib/outlined-forced-colors-styles.css.js.map +1 -0
  354. package/select/lib/outlined-forced-colors-styles.scss +29 -0
  355. package/select/lib/outlined-select-styles.css.d.ts +1 -0
  356. package/select/lib/outlined-select-styles.css.js +9 -0
  357. package/select/lib/outlined-select-styles.css.js.map +1 -0
  358. package/select/lib/outlined-select-styles.scss +10 -0
  359. package/select/lib/outlined-select.d.ts +10 -0
  360. package/select/lib/outlined-select.js +16 -0
  361. package/select/lib/outlined-select.js.map +1 -0
  362. package/select/lib/select.d.ts +216 -0
  363. package/select/lib/select.js +589 -0
  364. package/select/lib/select.js.map +1 -0
  365. package/select/lib/selectoption/harness.d.ts +11 -0
  366. package/select/lib/selectoption/harness.js +12 -0
  367. package/select/lib/selectoption/harness.js.map +1 -0
  368. package/select/lib/selectoption/select-option.d.ts +30 -0
  369. package/select/lib/selectoption/select-option.js +71 -0
  370. package/select/lib/selectoption/select-option.js.map +1 -0
  371. package/select/lib/shared-styles.css.d.ts +1 -0
  372. package/select/lib/shared-styles.css.js +9 -0
  373. package/select/lib/shared-styles.css.js.map +1 -0
  374. package/select/lib/shared-styles.scss +10 -0
  375. package/select/lib/shared.d.ts +52 -0
  376. package/select/lib/shared.js +41 -0
  377. package/select/lib/shared.js.map +1 -0
  378. package/select/outlined-select.d.ts +41 -0
  379. package/select/outlined-select.js +46 -0
  380. package/select/outlined-select.js.map +1 -0
  381. package/select/select-option.d.ts +44 -0
  382. package/select/select-option.js +51 -0
  383. package/select/select-option.js.map +1 -0
  384. package/slider/harness.d.ts +2 -1
  385. package/slider/harness.js +14 -9
  386. package/slider/harness.js.map +1 -1
  387. package/slider/lib/_slider.scss +149 -167
  388. package/slider/lib/forced-colors-styles.css.js +1 -1
  389. package/slider/lib/forced-colors-styles.css.js.map +1 -1
  390. package/slider/lib/forced-colors-styles.scss +2 -2
  391. package/slider/lib/slider-styles.css.js +1 -1
  392. package/slider/lib/slider-styles.css.js.map +1 -1
  393. package/slider/lib/slider.d.ts +23 -57
  394. package/slider/lib/slider.js +77 -167
  395. package/slider/lib/slider.js.map +1 -1
  396. package/switch/lib/_switch.scss +63 -18
  397. package/switch/lib/switch-styles.css.js +1 -1
  398. package/switch/lib/switch-styles.css.js.map +1 -1
  399. package/switch/lib/switch.d.ts +0 -7
  400. package/switch/lib/switch.js +32 -79
  401. package/switch/lib/switch.js.map +1 -1
  402. package/textfield/harness.d.ts +1 -1
  403. package/textfield/harness.js.map +1 -1
  404. package/textfield/lib/_filled-text-field.scss +70 -14
  405. package/textfield/lib/_outlined-text-field.scss +60 -35
  406. package/textfield/lib/filled-forced-colors-styles.css.js +1 -1
  407. package/textfield/lib/filled-forced-colors-styles.css.js.map +1 -1
  408. package/textfield/lib/filled-styles.css.js +1 -1
  409. package/textfield/lib/filled-styles.css.js.map +1 -1
  410. package/textfield/lib/outlined-forced-colors-styles.css.js +1 -1
  411. package/textfield/lib/outlined-forced-colors-styles.css.js.map +1 -1
  412. package/textfield/lib/outlined-styles.css.js +1 -1
  413. package/textfield/lib/outlined-styles.css.js.map +1 -1
  414. package/textfield/lib/text-field.d.ts +1 -11
  415. package/textfield/lib/text-field.js +45 -115
  416. package/textfield/lib/text-field.js.map +1 -1
  417. package/tokens/_index.scss +5 -18
  418. package/tokens/_md-comp-assist-chip.scss +25 -29
  419. package/tokens/_md-comp-checkbox.scss +78 -1
  420. package/tokens/_md-comp-circular-progress-indicator.scss +39 -13
  421. package/tokens/_md-comp-elevated-button.scss +0 -10
  422. package/tokens/_md-comp-elevation.scss +0 -4
  423. package/tokens/_md-comp-fab-branded.scss +84 -1
  424. package/tokens/_md-comp-fab.scss +249 -0
  425. package/tokens/_md-comp-filled-button.scss +0 -10
  426. package/{field/lib → tokens}/_md-comp-filled-field.scss +91 -9
  427. package/tokens/_md-comp-filled-icon-button.scss +46 -1
  428. package/tokens/_md-comp-filled-select.scss +124 -1
  429. package/tokens/_md-comp-filled-text-field.scss +93 -9
  430. package/tokens/_md-comp-filled-tonal-button.scss +0 -11
  431. package/tokens/_md-comp-filled-tonal-icon-button.scss +45 -3
  432. package/tokens/_md-comp-filter-chip.scss +103 -103
  433. package/tokens/_md-comp-focus-ring.scss +23 -24
  434. package/tokens/_md-comp-icon-button.scss +37 -1
  435. package/tokens/_md-comp-input-chip.scss +77 -95
  436. package/tokens/_md-comp-linear-progress-indicator.scss +31 -3
  437. package/tokens/_md-comp-list-item.scss +174 -0
  438. package/tokens/_md-comp-list.scss +81 -26
  439. package/tokens/_md-comp-menu-item.scss +50 -0
  440. package/tokens/_md-comp-menu.scss +29 -2
  441. package/tokens/_md-comp-outlined-button.scss +0 -10
  442. package/{field/lib → tokens}/_md-comp-outlined-field.scss +85 -9
  443. package/tokens/_md-comp-outlined-icon-button.scss +41 -1
  444. package/tokens/_md-comp-outlined-segmented-button.scss +57 -11
  445. package/tokens/_md-comp-outlined-select.scss +123 -1
  446. package/tokens/_md-comp-outlined-text-field.scss +85 -8
  447. package/tokens/_md-comp-slider.scss +13 -1
  448. package/tokens/_md-comp-suggestion-chip.scss +29 -30
  449. package/tokens/_md-comp-switch.scss +81 -1
  450. package/tokens/_md-comp-text-button.scss +0 -10
  451. package/tokens/_values.scss +2 -4
  452. package/types/aria.d.ts +59 -1
  453. package/actionelement/action-element.d.ts +0 -79
  454. package/actionelement/action-element.js +0 -97
  455. package/actionelement/action-element.js.map +0 -1
  456. package/button/lib/state.d.ts +0 -10
  457. package/button/lib/state.js +0 -7
  458. package/button/lib/state.js.map +0 -1
  459. package/controller/action-controller.d.ts +0 -147
  460. package/controller/action-controller.js +0 -286
  461. package/controller/action-controller.js.map +0 -1
  462. package/decorators/aria-property.d.ts +0 -32
  463. package/decorators/aria-property.js +0 -99
  464. package/decorators/aria-property.js.map +0 -1
  465. package/fab/_fab-extended.scss +0 -6
  466. package/fab/fab-extended.d.ts +0 -23
  467. package/fab/fab-extended.js +0 -29
  468. package/fab/fab-extended.js.map +0 -1
  469. package/fab/lib/_fab-extended.scss +0 -73
  470. package/fab/lib/fab-extended-styles.css.js +0 -9
  471. package/fab/lib/fab-extended-styles.css.js.map +0 -1
  472. package/fab/lib/fab-extended.d.ts +0 -19
  473. package/fab/lib/fab-extended.js +0 -28
  474. package/fab/lib/fab-extended.js.map +0 -1
  475. package/fab/lib/fab-shared-styles.css.js +0 -9
  476. package/fab/lib/fab-shared-styles.css.js.map +0 -1
  477. package/fab/lib/fab-shared.d.ts +0 -44
  478. package/fab/lib/fab-shared.js +0 -121
  479. package/fab/lib/fab-shared.js.map +0 -1
  480. package/focus/strong-focus.d.ts +0 -56
  481. package/focus/strong-focus.js +0 -96
  482. package/focus/strong-focus.js.map +0 -1
  483. package/sass/_shape.scss +0 -154
  484. package/slider/lib/_tokens.scss +0 -65
  485. package/tokens/_md-comp-extended-fab-branded.scss +0 -45
  486. package/tokens/_md-comp-extended-fab-primary.scss +0 -45
  487. package/tokens/_md-comp-extended-fab-secondary.scss +0 -48
  488. package/tokens/_md-comp-extended-fab-surface.scss +0 -45
  489. package/tokens/_md-comp-extended-fab-tertiary.scss +0 -48
  490. package/tokens/_md-comp-fab-branded-large.scss +0 -23
  491. package/tokens/_md-comp-fab-primary-large.scss +0 -23
  492. package/tokens/_md-comp-fab-primary-small.scss +0 -23
  493. package/tokens/_md-comp-fab-primary.scss +0 -23
  494. package/tokens/_md-comp-fab-secondary-large.scss +0 -23
  495. package/tokens/_md-comp-fab-secondary-small.scss +0 -23
  496. package/tokens/_md-comp-fab-secondary.scss +0 -23
  497. package/tokens/_md-comp-fab-surface-large.scss +0 -23
  498. package/tokens/_md-comp-fab-surface-small.scss +0 -23
  499. package/tokens/_md-comp-fab-surface.scss +0 -23
  500. package/tokens/_md-comp-fab-tertiary-large.scss +0 -23
  501. package/tokens/_md-comp-fab-tertiary-small.scss +0 -23
  502. package/tokens/_md-comp-fab-tertiary.scss +0 -23
  503. /package/{fab/lib/fab-extended-styles.css.d.ts → chips/lib/elevated-styles.css.d.ts} +0 -0
  504. /package/{fab/lib/fab-shared-styles.css.d.ts → chips/lib/filter-styles.css.d.ts} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"dialog.js","sourceRoot":"","sources":["dialog.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../elevation/elevation.js';\n\nimport {html, LitElement, PropertyValues} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {createThrottle, msFromTimeCSSValue} from '../../motion/animation.js';\n\n// This is required for decorators.\n// tslint:disable:no-new-decorators\n\n/**\n * Default close action.\n */\nexport const CLOSE_ACTION = 'close';\n\nconst OPENING_TRANSITION_PROP = '--_opening-transition-duration';\nconst CLOSING_TRANSITION_PROP = '--_closing-transition-duration';\n\n/**\n * A dialog component.\n */\nexport class Dialog extends LitElement {\n private static preventedScrollingCount = 0;\n private static scrollbarTester: HTMLDivElement;\n\n private static setDocumentScrollingDisabled(disabled = false) {\n let {preventedScrollingCount, scrollbarTester} = Dialog;\n Dialog.preventedScrollingCount = preventedScrollingCount =\n Math.max(preventedScrollingCount + (Number(disabled) || -1), 0);\n const shouldPrevent = Boolean(preventedScrollingCount);\n const {style} = document.body;\n if (shouldPrevent && style.overflow === 'hidden') {\n return;\n }\n if (scrollbarTester === undefined) {\n Dialog.scrollbarTester = scrollbarTester = document.createElement('div');\n scrollbarTester.style.cssText =\n `position: absolute; height: 0; width: 100%; visibility: hidden; pointer-events: none;`;\n }\n // Appends an element to see if its offsetWidth changes when overflow is\n // altered. If it does, then add end inline padding to restore the width to\n // avoid a visible layout shift.\n document.body.append(scrollbarTester);\n const {offsetWidth} = scrollbarTester;\n style.overflow = shouldPrevent ? 'hidden' : '';\n const scrollbarWidth = scrollbarTester.offsetWidth - offsetWidth;\n scrollbarTester.remove();\n style.paddingInlineEnd = shouldPrevent ? `${scrollbarWidth}px` : '';\n }\n\n /**\n * Opens the dialog when set to `true` and closes it when set to `false`.\n */\n @property({type: Boolean}) open = false;\n\n /**\n * Setting fullscreen displays the dialog fullscreen on small screens.\n * This can be customized via the `fullscreenBreakpoint` property.\n * When showing fullscreen, the header will take up less vertical space, and\n * the dialog will have a `showing-fullscreen`attribute, allowing content to\n * be styled in this state.\n *\n * Dialogs can be sized by setting:\n *\n * * --md-dialog-container-min-block-size\n * * --md-dialog-container-max-block-size\n * * --md-dialog-container-min-inline-size\n * * --md-dialog-container-max-inline-size\n *\n * These are typically configured via media queries and are independent of the\n * fullscreen setting.\n */\n @property({type: Boolean}) fullscreen = false;\n\n /**\n * A media query string specifying the breakpoint at which the dialog\n * should be shown fullscreen. Note, this only applies when the `fullscreen`\n * property is set.\n *\n * By default, the dialog is shown fullscreen on screens less than 600px wide\n * or 400px tall.\n */\n @property({type: String})\n fullscreenBreakpoint = '(max-width: 600px), (max-height: 400px)';\n\n /**\n * Hides the dialog footer, making any content slotted into the footer\n * inaccessible.\n */\n @property({type: Boolean}) footerHidden = false;\n\n /**\n * Renders footer content in a vertically stacked alignment rather than the\n * normal horizontal alignment.\n */\n @property({type: Boolean}) stacked = false;\n\n /**\n * When the dialog is closed it disptaches `closing` and `closed` events.\n * These events have an action property which has a default value of\n * the value of this property. Specific actions have explicit values but when\n * a value is not specified, the default is used. For example, clicking the\n * scrim, pressing escape, or clicking a button with an action attribute set\n * produce an explicit action.\n *\n * Defaults to `close`.\n */\n @property() defaultAction = CLOSE_ACTION;\n\n /**\n * The name of an attribute which can be placed on any element slotted into\n * the dialog. If an element has an action attribute set, clicking it will\n * close the dialog and the `closing` and `closed` events dispatched will\n * have their action property set the the value of this attribute on the\n * clicked element.The default valus is `dialogAction`. For example,\n *\n * <md-dialog>\n * Content\n * <md-filled-button slot=\"footer\"dialogAction=\"buy\">\n * Buy\n * </md-filled-button>\n * </md-dialog>\n */\n @property() actionAttribute = 'dialogAction';\n\n /**\n * When the dialog is opened, it will focus the first element which has\n * an attribute name matching this property. The default value is\n * `dialogFocus`. For example:\n *\n * <md-dialog>\n * <md-filled-text-field\n * label=\"Enter some text\"\n * dialogFocus\n * >\n * </md-filled-text-field>\n * </md-dialog>\n */\n @property() focusAttribute = 'dialogFocus';\n\n /**\n * Clicking on the scrim surrounding the dialog closes the dialog.\n * The `closing` and `closed` events this produces have an `action` property\n * which is the value of this property and defaults to `close`.\n */\n @property({type: String}) scrimClickAction = CLOSE_ACTION;\n\n /**\n * Pressing the `escape` key while the dialog is open closes the dialog.\n * The `closing` and `closed` events this produces have an `action` property\n * which is the value of this property and defaults to `close`.\n */\n @property({type: String}) escapeKeyAction = CLOSE_ACTION;\n\n /**\n * When opened, the dialog is displayed modeless or non-modal. This\n * allows users to interact with content outside the dialog without\n * closing the dialog and does not display the scrim around the dialog.\n */\n @property({type: Boolean, reflect: true}) modeless = false;\n\n /**\n * Set to make the dialog position draggable.\n */\n @property({type: Boolean}) override draggable = false;\n\n private readonly throttle = createThrottle();\n\n @query('.dialog', true) private readonly dialogElement!: HTMLDialogElement;\n\n // slots tracked to find focusable elements.\n @query('slot[name=footer]', true)\n private readonly footerSlot!: HTMLSlotElement;\n @query('slot:not([name])', true)\n private readonly contentSlot!: HTMLSlotElement;\n // for scrolling related styling\n @query(`.content`, true) private readonly contentElement!: HTMLDivElement;\n // used to determine container size for dragging\n @query(`.container`, true) private readonly containerElement!: HTMLDivElement;\n // used to determin where users can drag from.\n @query(`.header`, true) private readonly headerElement!: HTMLDivElement;\n\n /**\n * Private properties that reflect for styling manually in `updated`.\n */\n @state() private showingFullscreen = false;\n @state() private showingOpen = false;\n @state() private opening = false;\n @state() private closing = false;\n\n /**\n * Transition kind. Supported options include: grow, shrink, grow-down,\n * grow-up, grow-left, and grow-right.\n *\n * Defaults to grow-down.\n */\n @property({reflect: true}) transition = 'grow-down';\n\n private currentAction: string|undefined;\n\n @state() private dragging = false;\n private readonly dragMargin = 8;\n private dragInfo?: [number, number, number, number]|undefined;\n\n /**\n * Opens and shows the dialog. This is equivalent to setting the `open`\n * property to true.\n */\n show() {\n this.open = true;\n }\n\n /**\n * Closes the dialog. This is equivalent to setting the `open`\n * property to false.\n */\n close(action = '') {\n this.currentAction = action;\n this.open = false;\n }\n\n /**\n * Opens and shows the dialog if it is closed; otherwise closes it.\n */\n toggleShow() {\n if (this.open) {\n this.close(this.currentAction);\n } else {\n this.show();\n }\n }\n\n private getContentScrollInfo() {\n if (!this.hasUpdated) {\n return {isScrollable: false, isAtScrollTop: true, isAtScrollBottom: true};\n }\n const {scrollTop, scrollHeight, offsetHeight, clientHeight} =\n this.contentElement;\n return {\n isScrollable: scrollHeight > offsetHeight,\n isAtScrollTop: scrollTop === 0,\n isAtScrollBottom:\n Math.abs(Math.round(scrollHeight - scrollTop) - clientHeight) <= 2\n };\n }\n\n protected override render() {\n const {isScrollable, isAtScrollTop, isAtScrollBottom} =\n this.getContentScrollInfo();\n return html`\n <dialog\n @close=${this.handleDialogDismiss}\n @cancel=${this.handleDialogDismiss}\n @click=${this.handleDialogClick}\n class=\"dialog ${classMap({\n 'stacked': this.stacked,\n 'scrollable': isScrollable,\n 'scroll-divider-header': !isAtScrollTop,\n 'scroll-divider-footer': !isAtScrollBottom,\n 'footerHidden': this.footerHidden\n })}\"\n aria-labelledby=\"header\"\n aria-describedby=\"content\"\n >\n <div class=\"container ${classMap({\n 'dragging': this.dragging\n })}\"\n @pointermove=${this.handlePointerMove}\n @pointerup=${this.handleDragEnd}\n >\n <md-elevation></md-elevation>\n <header class=\"header\">\n <slot name=\"header\">\n <slot name=\"headline-prefix\"></slot>\n <slot name=\"headline\"></slot>\n <slot name=\"headline-suffix\"></slot>\n </slot>\n </header>\n <section class=\"content\" @scroll=${this.handleContentScroll}>\n <slot></slot>\n </section>\n <footer class=\"footer\">\n <slot name=\"footer\"></slot>\n </footer>\n </div>\n </dialog>`;\n }\n\n protected override willUpdate(changed: PropertyValues) {\n if (changed.has('open')) {\n this.opening = this.open;\n // only closing if was opened previously...\n this.closing = !this.open && changed.get('open');\n }\n if (changed.has('fullscreen') || changed.has('fullscreenBreakpoint')) {\n this.updateFullscreen();\n }\n }\n\n protected override firstUpdated() {\n // Update when content size changes to show/hide scroll dividers.\n new ResizeObserver(() => {\n if (this.showingOpen) {\n this.requestUpdate();\n }\n }).observe(this.contentElement);\n }\n\n protected override updated(changed: PropertyValues) {\n if (changed.get('draggable') && !this.draggable) {\n this.style.removeProperty('--_container-drag-inline-start');\n this.style.removeProperty('--_container-drag-block-start');\n }\n // Reflect internal state to facilitate styling.\n this.reflectStateProp(changed, 'opening', this.opening);\n this.reflectStateProp(changed, 'closing', this.closing);\n this.reflectStateProp(\n changed, 'showingFullscreen', this.showingFullscreen,\n 'showing-fullscreen');\n this.reflectStateProp(\n changed, 'showingOpen', this.showingOpen, 'showing-open');\n if (!changed.has('open')) {\n return;\n }\n // prevent body scrolling early only when opening to avoid layout\n // shift when closing.\n if (!this.modeless && this.open) {\n Dialog.setDocumentScrollingDisabled(this.open);\n }\n if (this.open) {\n this.contentElement.scrollTop = 0;\n if (this.modeless) {\n this.dialogElement.show();\n } else {\n // Note, native focus handling fails when focused element is in an\n // overflow: auto container.\n this.dialogElement.showModal();\n }\n }\n // Avoids dispatching initial state.\n const shouldDispatchAction = changed.get('open') !== undefined;\n this.performTransition(shouldDispatchAction);\n }\n\n /**\n * Internal state is reflected here as attributes to effect styling. This\n * could be done via internal classes, but it's published on the host\n * to facilitate the (currently undocumented) possibility of customizing\n * styling of user content based on these states.\n * Note, in the future this could be done with `:state(...)` when browser\n * support improves.\n */\n private reflectStateProp(\n changed: PropertyValues, key: string, value: unknown,\n attribute?: string) {\n attribute ??= key;\n if (!changed.has(key)) {\n return;\n }\n if (value) {\n this.setAttribute(attribute, '');\n } else {\n this.removeAttribute(attribute);\n }\n }\n\n private dialogClosedResolver?: () => void;\n\n protected async performTransition(shouldDispatchAction: boolean) {\n // TODO: pause here only to avoid a double update warning.\n await this.updateComplete;\n this.showingOpen = this.open;\n if (shouldDispatchAction) {\n this.dispatchActionEvent(this.open ? 'opening' : 'closing');\n }\n // Compute desired transition duration.\n const duration = msFromTimeCSSValue(getComputedStyle(this).getPropertyValue(\n this.open ? OPENING_TRANSITION_PROP : CLOSING_TRANSITION_PROP));\n let promise = this.updateComplete;\n if (duration > 0) {\n promise = new Promise((r) => {\n setTimeout(r, duration);\n });\n }\n await promise;\n this.opening = false;\n this.closing = false;\n if (!this.open && this.dialogElement.open) {\n // Closing the dialog triggers an asynchronous `close` event.\n // It's important to wait for this event to fire since it changes the\n // state of `open` to false.\n // Without waiting, this element's `closed` event can be called before\n // the dialog's `close` event, which is problematic since the user\n // can set `open` in the `closed` event.\n // The timing of the event appears to vary via browser and does *not*\n // seem to resolve by \"task\" timing; therefore an explicit promise is\n // used.\n const closedPromise = new Promise<void>(resolve => {\n this.dialogClosedResolver = resolve;\n });\n this.dialogElement.close(this.currentAction || this.defaultAction);\n await closedPromise;\n // enable scrolling late to avoid layout shift when closing\n if (!this.modeless) {\n Dialog.setDocumentScrollingDisabled(this.open);\n }\n }\n // Focus initial element.\n if (this.open) {\n this.focus();\n }\n if (shouldDispatchAction) {\n this.dispatchActionEvent(this.open ? 'opened' : 'closed');\n }\n this.currentAction = undefined;\n }\n\n protected dispatchActionEvent(type: string) {\n const detail = {action: this.open ? 'none' : this.currentAction};\n this.dispatchEvent(new CustomEvent(type, {detail, bubbles: true}));\n }\n\n /* Live media query for matching user specified fullscreen breakpoint. */\n private fullscreenQuery?: MediaQueryList;\n private fullscreenQueryListener:\n ((e: MediaQueryListEvent) => void)|undefined = undefined;\n protected updateFullscreen() {\n if (this.fullscreenQuery !== undefined) {\n this.fullscreenQuery.removeEventListener(\n 'change', this.fullscreenQueryListener!);\n this.fullscreenQuery = this.fullscreenQueryListener = undefined;\n }\n if (!this.fullscreen) {\n this.showingFullscreen = false;\n return;\n }\n this.fullscreenQuery = window.matchMedia(this.fullscreenBreakpoint);\n this.fullscreenQuery.addEventListener(\n 'change',\n (this.fullscreenQueryListener = (event: MediaQueryListEvent) => {\n this.showingFullscreen = event.matches;\n }));\n this.showingFullscreen = this.fullscreenQuery.matches;\n }\n\n // handles native close/cancel events and we just ensure\n // internal state is in sync.\n protected handleDialogDismiss(e: Event) {\n if (e.type === 'cancel') {\n this.currentAction = this.escapeKeyAction;\n }\n this.dialogClosedResolver?.();\n this.dialogClosedResolver = undefined;\n this.open = false;\n this.opening = false;\n this.closing = false;\n }\n\n protected handleDialogClick(e: Event) {\n if (!this.open) {\n return;\n }\n this.currentAction =\n (e.target as Element).getAttribute(this.actionAttribute) ??\n (!this.modeless && !e.composedPath().includes(this.containerElement) ?\n this.scrimClickAction :\n '');\n if (this.currentAction !== '') {\n this.close(this.currentAction);\n }\n }\n\n /* This allows the dividers to dynamically show based on scrolling. */\n protected handleContentScroll() {\n this.throttle('scroll', () => {\n this.requestUpdate();\n });\n }\n\n protected getFocusElement(): HTMLElement|null {\n const selector = `[${this.focusAttribute}]`;\n const slotted = [this.footerSlot, this.contentSlot].flatMap(\n slot => slot.assignedElements({flatten: true}));\n for (const el of slotted) {\n const focusEl = el.matches(selector) ? el : el.querySelector(selector);\n if (focusEl) {\n return focusEl as HTMLElement;\n }\n }\n return null;\n }\n\n override focus() {\n this.getFocusElement()?.focus();\n }\n\n override blur() {\n this.getFocusElement()?.blur();\n }\n\n protected canStartDrag(e: PointerEvent) {\n if (this.draggable === false || e.defaultPrevented || !(e.buttons & 1) ||\n !e.composedPath().includes(this.headerElement)) {\n return false;\n }\n return true;\n }\n\n protected handlePointerMove(e: PointerEvent) {\n if (!this.dragging && !this.canStartDrag(e)) {\n return;\n }\n const {top, left, height, width} =\n this.containerElement.getBoundingClientRect();\n if (!this.dragging) {\n this.containerElement.setPointerCapture(e.pointerId);\n this.dragging = true;\n const {x, y} = e;\n this.dragInfo = [x, y, top, left];\n }\n const [sx, sy, st, sl] = this.dragInfo ?? [0, 0, 0, 0];\n const dx = e.x - sx;\n const dy = e.y - sy;\n const ml = window.innerWidth - width - this.dragMargin;\n const mt = window.innerHeight - height - this.dragMargin;\n const l = Math.max(this.dragMargin, Math.min(ml, dx + sl));\n const t = Math.max(this.dragMargin, Math.min(mt, dy + st));\n this.style.setProperty('--_container-drag-inline-start', `${l}px`);\n this.style.setProperty('--_container-drag-block-start', `${t}px`);\n }\n\n protected handleDragEnd(e: PointerEvent) {\n if (!this.dragging) {\n return;\n }\n this.containerElement.releasePointerCapture(e.pointerId);\n this.dragging = false;\n this.dragInfo = undefined;\n }\n}\n"]}
1
+ {"version":3,"file":"dialog.js","sourceRoot":"","sources":["dialog.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AACrD,OAAO,EAAC,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,cAAc,EAAE,kBAAkB,EAAC,MAAM,2BAA2B,CAAC;AAE7E,mCAAmC;AACnC,mCAAmC;AAEnC;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,OAAO,CAAC;AAEpC,MAAM,uBAAuB,GAAG,gCAAgC,CAAC;AACjE,MAAM,uBAAuB,GAAG,gCAAgC,CAAC;AAEjE;;GAEG;AACH,MAAM,OAAO,MAAO,SAAQ,UAAU;IAAtC;;QA6BE;;WAEG;QACwB,SAAI,GAAG,KAAK,CAAC;QAExC;;;;;;;;;;;;;;;;WAgBG;QACwB,eAAU,GAAG,KAAK,CAAC;QAE9C;;;;;;;WAOG;QACS,yBAAoB,GAAG,yCAAyC,CAAC;QAE7E;;;WAGG;QACwB,iBAAY,GAAG,KAAK,CAAC;QAEhD;;;WAGG;QACwB,YAAO,GAAG,KAAK,CAAC;QAE3C;;;;;;;;;WASG;QACS,kBAAa,GAAG,YAAY,CAAC;QAEzC;;;;;;;;;;;;;WAaG;QACS,oBAAe,GAAG,cAAc,CAAC;QAE7C;;;;;;;;;;;;WAYG;QACS,mBAAc,GAAG,aAAa,CAAC;QAE3C;;;;WAIG;QACS,qBAAgB,GAAG,YAAY,CAAC;QAE5C;;;;WAIG;QACS,oBAAe,GAAG,YAAY,CAAC;QAE3C;;;;WAIG;QACuC,aAAQ,GAAG,KAAK,CAAC;QAE3D;;WAEG;QACiC,cAAS,GAAG,KAAK,CAAC;QAErC,aAAQ,GAAG,cAAc,EAAE,CAAC;QAmB7C;;WAEG;QACc,sBAAiB,GAAG,KAAK,CAAC;QAC1B,gBAAW,GAAG,KAAK,CAAC;QACpB,YAAO,GAAG,KAAK,CAAC;QAChB,YAAO,GAAG,KAAK,CAAC;QAEjC;;;;;WAKG;QACwB,eAAU,GAAG,WAAW,CAAC;QAInC,aAAQ,GAAG,KAAK,CAAC;QACjB,eAAU,GAAG,CAAC,CAAC;QA+NxB,4BAAuB,GACoB,SAAS,CAAC;IAmH/D,CAAC;IArgBS,MAAM,CAAC,4BAA4B,CAAC,QAAQ,GAAG,KAAK;QAC1D,IAAI,EAAC,uBAAuB,EAAE,eAAe,EAAC,GAAG,MAAM,CAAC;QACxD,MAAM,CAAC,uBAAuB,GAAG,uBAAuB;YACpD,IAAI,CAAC,GAAG,CAAC,uBAAuB,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACpE,MAAM,aAAa,GAAG,OAAO,CAAC,uBAAuB,CAAC,CAAC;QACvD,MAAM,EAAC,KAAK,EAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;QAC9B,IAAI,aAAa,IAAI,KAAK,CAAC,QAAQ,KAAK,QAAQ,EAAE;YAChD,OAAO;SACR;QACD,IAAI,eAAe,KAAK,SAAS,EAAE;YACjC,MAAM,CAAC,eAAe,GAAG,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YACzE,eAAe,CAAC,KAAK,CAAC,OAAO;gBACzB,uFAAuF,CAAC;SAC7F;QACD,wEAAwE;QACxE,2EAA2E;QAC3E,gCAAgC;QAChC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;QACtC,MAAM,EAAC,WAAW,EAAC,GAAG,eAAe,CAAC;QACtC,KAAK,CAAC,QAAQ,GAAG,aAAa,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;QAC/C,MAAM,cAAc,GAAG,eAAe,CAAC,WAAW,GAAG,WAAW,CAAC;QACjE,eAAe,CAAC,MAAM,EAAE,CAAC;QACzB,KAAK,CAAC,gBAAgB,GAAG,aAAa,CAAC,CAAC,CAAC,GAAG,cAAc,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;IACtE,CAAC;IA8JD;;;OAGG;IACH,IAAI;QACF,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED;;;OAGG;IACH,KAAK,CAAC,MAAM,GAAG,EAAE;QACf,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;QAC5B,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAED;;OAEG;IACH,UAAU;QACR,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;SAChC;aAAM;YACL,IAAI,CAAC,IAAI,EAAE,CAAC;SACb;IACH,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YAC5C,OAAO,EAAC,YAAY,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,gBAAgB,EAAE,IAAI,EAAC,CAAC;SAC3E;QACD,MAAM,EAAC,SAAS,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAC,GACvD,IAAI,CAAC,cAAc,CAAC;QACxB,OAAO;YACL,YAAY,EAAE,YAAY,GAAG,YAAY;YACzC,aAAa,EAAE,SAAS,KAAK,CAAC;YAC9B,gBAAgB,EACZ,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,SAAS,CAAC,GAAG,YAAY,CAAC,IAAI,CAAC;SACvE,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,MAAM,EAAC,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAC,GACjD,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAChC,OAAO,IAAI,CAAA;;eAEA,IAAI,CAAC,mBAAmB;gBACvB,IAAI,CAAC,mBAAmB;eACzB,IAAI,CAAC,iBAAiB;sBACf,QAAQ,CAAC;YACzB,SAAS,EAAE,IAAI,CAAC,OAAO;YACvB,YAAY,EAAE,YAAY;YAC1B,uBAAuB,EAAE,CAAC,aAAa;YACvC,uBAAuB,EAAE,CAAC,gBAAgB;YAC1C,cAAc,EAAE,IAAI,CAAC,YAAY;SAClC,CAAC;;;;8BAIwB,QAAQ,CAAC;YACjC,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;uBACiB,IAAI,CAAC,iBAAiB;qBACxB,IAAI,CAAC,aAAa;;;;;;;;;;2CAUI,IAAI,CAAC,mBAAmB;;;;;;;cAOrD,CAAC;IACb,CAAC;IAEkB,UAAU,CAAC,OAAuB;QACnD,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACvB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;YACzB,2CAA2C;YAC3C,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,IAAI,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;SAClD;QACD,IAAI,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,sBAAsB,CAAC,EAAE;YACpE,IAAI,CAAC,gBAAgB,EAAE,CAAC;SACzB;IACH,CAAC;IAEkB,YAAY;QAC7B,iEAAiE;QACjE,IAAI,cAAc,CAAC,GAAG,EAAE;YACtB,IAAI,IAAI,CAAC,WAAW,EAAE;gBACpB,IAAI,CAAC,aAAa,EAAE,CAAC;aACtB;QACH,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,cAAe,CAAC,CAAC;IACnC,CAAC;IAEkB,OAAO,CAAC,OAAuB;QAChD,IAAI,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;YAC/C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gCAAgC,CAAC,CAAC;YAC5D,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,+BAA+B,CAAC,CAAC;SAC5D;QACD,gDAAgD;QAChD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QACxD,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QACxD,IAAI,CAAC,gBAAgB,CACjB,OAAO,EAAE,mBAAmB,EAAE,IAAI,CAAC,iBAAiB,EACpD,oBAAoB,CAAC,CAAC;QAC1B,IAAI,CAAC,gBAAgB,CACjB,OAAO,EAAE,aAAa,EAAE,IAAI,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC;QAC9D,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACxB,OAAO;SACR;QACD,iEAAiE;QACjE,sBAAsB;QACtB,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE;YAC/B,MAAM,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SAChD;QACD,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,cAAe,CAAC,SAAS,GAAG,CAAC,CAAC;YACnC,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,IAAI,CAAC,aAAc,CAAC,IAAI,EAAE,CAAC;aAC5B;iBAAM;gBACL,kEAAkE;gBAClE,4BAA4B;gBAC5B,IAAI,CAAC,aAAc,CAAC,SAAS,EAAE,CAAC;aACjC;SACF;QACD,oCAAoC;QACpC,MAAM,oBAAoB,GAAG,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,SAAS,CAAC;QAC/D,IAAI,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;IAC/C,CAAC;IAED;;;;;;;OAOG;IACK,gBAAgB,CACpB,OAAuB,EAAE,GAAW,EAAE,KAAc,EACpD,SAAkB;QACpB,SAAS,KAAT,SAAS,GAAK,GAAG,EAAC;QAClB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;YACrB,OAAO;SACR;QACD,IAAI,KAAK,EAAE;YACT,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;SAClC;aAAM;YACL,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;SACjC;IACH,CAAC;IAIO,KAAK,CAAC,iBAAiB,CAAC,oBAA6B;QAC3D,0DAA0D;QAC1D,MAAM,IAAI,CAAC,cAAc,CAAC;QAC1B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC;QAC7B,IAAI,oBAAoB,EAAE;YACxB,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;SAC7D;QACD,uCAAuC;QACvC,MAAM,QAAQ,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,gBAAgB,CACvE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC;QACpE,IAAI,OAAO,GAAG,IAAI,CAAC,cAAc,CAAC;QAClC,IAAI,QAAQ,GAAG,CAAC,EAAE;YAChB,OAAO,GAAG,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE;gBAC1B,UAAU,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;YAC1B,CAAC,CAAC,CAAC;SACJ;QACD,MAAM,OAAO,CAAC;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,aAAa,EAAE,IAAI,EAAE;YAC1C,6DAA6D;YAC7D,qEAAqE;YACrE,4BAA4B;YAC5B,sEAAsE;YACtE,kEAAkE;YAClE,wCAAwC;YACxC,qEAAqE;YACrE,qEAAqE;YACrE,QAAQ;YACR,MAAM,aAAa,GAAG,IAAI,OAAO,CAAO,OAAO,CAAC,EAAE;gBAChD,IAAI,CAAC,oBAAoB,GAAG,OAAO,CAAC;YACtC,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,aAAa,EAAE,KAAK,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC;YACpE,MAAM,aAAa,CAAC;YACpB,2DAA2D;YAC3D,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAClB,MAAM,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAChD;SACF;QACD,yBAAyB;QACzB,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,IAAI,CAAC,KAAK,EAAE,CAAC;SACd;QACD,IAAI,oBAAoB,EAAE;YACxB,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;SAC3D;QACD,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC;IACjC,CAAC;IAEO,mBAAmB,CAAC,IAAY;QACtC,MAAM,MAAM,GAAG,EAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAC,CAAC;QACjE,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,IAAI,EAAE,EAAC,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;IACrE,CAAC;IAMO,gBAAgB;QACtB,IAAI,IAAI,CAAC,eAAe,KAAK,SAAS,EAAE;YACtC,IAAI,CAAC,eAAe,CAAC,mBAAmB,CACpC,QAAQ,EAAE,IAAI,CAAC,uBAAwB,CAAC,CAAC;YAC7C,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,uBAAuB,GAAG,SAAS,CAAC;SACjE;QACD,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YACpB,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;YAC/B,OAAO;SACR;QACD,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QACpE,IAAI,CAAC,eAAe,CAAC,gBAAgB,CACjC,QAAQ,EACR,CAAC,IAAI,CAAC,uBAAuB,GAAG,CAAC,KAA0B,EAAE,EAAE;YAC7D,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,OAAO,CAAC;QACzC,CAAC,CAAC,CAAC,CAAC;QACR,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;IACxD,CAAC;IAED,wDAAwD;IACxD,6BAA6B;IACrB,mBAAmB,CAAC,CAAQ;QAClC,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,EAAE;YACvB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,eAAe,CAAC;SAC3C;QACD,IAAI,CAAC,oBAAoB,EAAE,EAAE,CAAC;QAC9B,IAAI,CAAC,oBAAoB,GAAG,SAAS,CAAC;QACtC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAClB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC;IAEO,iBAAiB,CAAC,CAAQ;QAChC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,OAAO;SACR;QACD,IAAI,CAAC,aAAa;YACb,CAAC,CAAC,MAAkB,CAAC,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC;gBACxD,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,gBAAgB;oBAC/B,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC;oBACvD,IAAI,CAAC,gBAAgB,CAAC,CAAC;oBACvB,EAAE,CAAC,CAAC;QACb,IAAI,IAAI,CAAC,aAAa,KAAK,EAAE,EAAE;YAC7B,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;SAChC;IACH,CAAC;IAED,sEAAsE;IAC9D,mBAAmB;QACzB,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;YAC3B,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,eAAe;QACrB,MAAM,QAAQ,GAAG,IAAI,IAAI,CAAC,cAAc,GAAG,CAAC;QAC5C,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,OAAO,CACvD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;QACpD,KAAK,MAAM,EAAE,IAAI,OAAO,EAAE;YACxB,MAAM,OAAO,GAAG,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YACvE,IAAI,OAAO,EAAE;gBACX,OAAO,OAAsB,CAAC;aAC/B;SACF;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAEQ,KAAK;QACZ,IAAI,CAAC,eAAe,EAAE,EAAE,KAAK,EAAE,CAAC;IAClC,CAAC;IAEQ,IAAI;QACX,IAAI,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC;IACjC,CAAC;IAEO,YAAY,CAAC,CAAe;QAClC,IAAI,IAAI,CAAC,SAAS,KAAK,KAAK,IAAI,CAAC,CAAC,gBAAgB,IAAI,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC;YAClE,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE;YACzE,OAAO,KAAK,CAAC;SACd;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAEO,iBAAiB,CAAC,CAAe;QACvC,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;YACrE,OAAO;SACR;QACD,MAAM,EAAC,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAC,GAC5B,IAAI,CAAC,gBAAgB,CAAC,qBAAqB,EAAE,CAAC;QAClD,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;YACrD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,MAAM,EAAC,CAAC,EAAE,CAAC,EAAC,GAAG,CAAC,CAAC;YACjB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;SACnC;QACD,MAAM,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QACvD,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;QACpB,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;QACpB,MAAM,EAAE,GAAG,MAAM,CAAC,UAAU,GAAG,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC;QACvD,MAAM,EAAE,GAAG,MAAM,CAAC,WAAW,GAAG,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC;QACzD,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;QAC3D,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;QAC3D,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,gCAAgC,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;QACnE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,+BAA+B,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;IACpE,CAAC;IAEO,aAAa,CAAC,CAAe;QACnC,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO;SACR;QACD,IAAI,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;QAC1D,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACtB,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;;AAvgBc,8BAAuB,GAAG,CAAC,CAAC;AA+BhB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;oCAAc;AAmBb;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;0CAAoB;AAUlC;IAAX,QAAQ,EAAE;oDAAkE;AAMlD;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAsB;AAMrB;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;uCAAiB;AAY/B;IAAX,QAAQ,EAAE;6CAA8B;AAgB7B;IAAX,QAAQ,EAAE;+CAAkC;AAejC;IAAX,QAAQ,EAAE;8CAAgC;AAO/B;IAAX,QAAQ,EAAE;gDAAiC;AAOhC;IAAX,QAAQ,EAAE;+CAAgC;AAOD;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;wCAAkB;AAKhC;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;yCAA4B;AAKtD;IADC,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC;6CACiC;AAIxD;IADC,KAAK,CAAC,mBAAmB,EAAE,IAAI,CAAC;0CACa;AAE9C;IADC,KAAK,CAAC,kBAAkB,EAAE,IAAI,CAAC;2CACe;AAG/C;IADC,KAAK,CAAC,UAAU,EAAE,IAAI,CAAC;8CAC8B;AAGtD;IADC,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC;gDAC8B;AAEhC;IAAvB,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC;6CAAsD;AAKpE;IAAR,KAAK,EAAE;iDAAmC;AAClC;IAAR,KAAK,EAAE;2CAA6B;AAC5B;IAAR,KAAK,EAAE;uCAAyB;AACxB;IAAR,KAAK,EAAE;uCAAyB;AAQN;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;0CAA0B;AAI3C;IAAR,KAAK,EAAE;wCAA0B","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../elevation/elevation.js';\n\nimport {html, LitElement, PropertyValues} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {createThrottle, msFromTimeCSSValue} from '../../motion/animation.js';\n\n// This is required for decorators.\n// tslint:disable:no-new-decorators\n\n/**\n * Default close action.\n */\nexport const CLOSE_ACTION = 'close';\n\nconst OPENING_TRANSITION_PROP = '--_opening-transition-duration';\nconst CLOSING_TRANSITION_PROP = '--_closing-transition-duration';\n\n/**\n * A dialog component.\n */\nexport class Dialog extends LitElement {\n private static preventedScrollingCount = 0;\n private static scrollbarTester: HTMLDivElement;\n\n private static setDocumentScrollingDisabled(disabled = false) {\n let {preventedScrollingCount, scrollbarTester} = Dialog;\n Dialog.preventedScrollingCount = preventedScrollingCount =\n Math.max(preventedScrollingCount + (Number(disabled) || -1), 0);\n const shouldPrevent = Boolean(preventedScrollingCount);\n const {style} = document.body;\n if (shouldPrevent && style.overflow === 'hidden') {\n return;\n }\n if (scrollbarTester === undefined) {\n Dialog.scrollbarTester = scrollbarTester = document.createElement('div');\n scrollbarTester.style.cssText =\n `position: absolute; height: 0; width: 100%; visibility: hidden; pointer-events: none;`;\n }\n // Appends an element to see if its offsetWidth changes when overflow is\n // altered. If it does, then add end inline padding to restore the width to\n // avoid a visible layout shift.\n document.body.append(scrollbarTester);\n const {offsetWidth} = scrollbarTester;\n style.overflow = shouldPrevent ? 'hidden' : '';\n const scrollbarWidth = scrollbarTester.offsetWidth - offsetWidth;\n scrollbarTester.remove();\n style.paddingInlineEnd = shouldPrevent ? `${scrollbarWidth}px` : '';\n }\n\n /**\n * Opens the dialog when set to `true` and closes it when set to `false`.\n */\n @property({type: Boolean}) open = false;\n\n /**\n * Setting fullscreen displays the dialog fullscreen on small screens.\n * This can be customized via the `fullscreenBreakpoint` property.\n * When showing fullscreen, the header will take up less vertical space, and\n * the dialog will have a `showing-fullscreen`attribute, allowing content to\n * be styled in this state.\n *\n * Dialogs can be sized by setting:\n *\n * * --md-dialog-container-min-block-size\n * * --md-dialog-container-max-block-size\n * * --md-dialog-container-min-inline-size\n * * --md-dialog-container-max-inline-size\n *\n * These are typically configured via media queries and are independent of the\n * fullscreen setting.\n */\n @property({type: Boolean}) fullscreen = false;\n\n /**\n * A media query string specifying the breakpoint at which the dialog\n * should be shown fullscreen. Note, this only applies when the `fullscreen`\n * property is set.\n *\n * By default, the dialog is shown fullscreen on screens less than 600px wide\n * or 400px tall.\n */\n @property() fullscreenBreakpoint = '(max-width: 600px), (max-height: 400px)';\n\n /**\n * Hides the dialog footer, making any content slotted into the footer\n * inaccessible.\n */\n @property({type: Boolean}) footerHidden = false;\n\n /**\n * Renders footer content in a vertically stacked alignment rather than the\n * normal horizontal alignment.\n */\n @property({type: Boolean}) stacked = false;\n\n /**\n * When the dialog is closed it disptaches `closing` and `closed` events.\n * These events have an action property which has a default value of\n * the value of this property. Specific actions have explicit values but when\n * a value is not specified, the default is used. For example, clicking the\n * scrim, pressing escape, or clicking a button with an action attribute set\n * produce an explicit action.\n *\n * Defaults to `close`.\n */\n @property() defaultAction = CLOSE_ACTION;\n\n /**\n * The name of an attribute which can be placed on any element slotted into\n * the dialog. If an element has an action attribute set, clicking it will\n * close the dialog and the `closing` and `closed` events dispatched will\n * have their action property set the the value of this attribute on the\n * clicked element.The default valus is `dialogAction`. For example,\n *\n * <md-dialog>\n * Content\n * <md-filled-button slot=\"footer\"dialogAction=\"buy\">\n * Buy\n * </md-filled-button>\n * </md-dialog>\n */\n @property() actionAttribute = 'dialogAction';\n\n /**\n * When the dialog is opened, it will focus the first element which has\n * an attribute name matching this property. The default value is\n * `dialogFocus`. For example:\n *\n * <md-dialog>\n * <md-filled-text-field\n * label=\"Enter some text\"\n * dialogFocus\n * >\n * </md-filled-text-field>\n * </md-dialog>\n */\n @property() focusAttribute = 'dialogFocus';\n\n /**\n * Clicking on the scrim surrounding the dialog closes the dialog.\n * The `closing` and `closed` events this produces have an `action` property\n * which is the value of this property and defaults to `close`.\n */\n @property() scrimClickAction = CLOSE_ACTION;\n\n /**\n * Pressing the `escape` key while the dialog is open closes the dialog.\n * The `closing` and `closed` events this produces have an `action` property\n * which is the value of this property and defaults to `close`.\n */\n @property() escapeKeyAction = CLOSE_ACTION;\n\n /**\n * When opened, the dialog is displayed modeless or non-modal. This\n * allows users to interact with content outside the dialog without\n * closing the dialog and does not display the scrim around the dialog.\n */\n @property({type: Boolean, reflect: true}) modeless = false;\n\n /**\n * Set to make the dialog position draggable.\n */\n @property({type: Boolean}) override draggable = false;\n\n private readonly throttle = createThrottle();\n\n @query('.dialog', true)\n private readonly dialogElement!: HTMLDialogElement|null;\n\n // slots tracked to find focusable elements.\n @query('slot[name=footer]', true)\n private readonly footerSlot!: HTMLSlotElement;\n @query('slot:not([name])', true)\n private readonly contentSlot!: HTMLSlotElement;\n // for scrolling related styling\n @query(`.content`, true)\n private readonly contentElement!: HTMLDivElement|null;\n // used to determine container size for dragging\n @query(`.container`, true)\n private readonly containerElement!: HTMLDivElement|null;\n // used to determin where users can drag from.\n @query(`.header`, true) private readonly headerElement!: HTMLDivElement|null;\n\n /**\n * Private properties that reflect for styling manually in `updated`.\n */\n @state() private showingFullscreen = false;\n @state() private showingOpen = false;\n @state() private opening = false;\n @state() private closing = false;\n\n /**\n * Transition kind. Supported options include: grow, shrink, grow-down,\n * grow-up, grow-left, and grow-right.\n *\n * Defaults to grow-down.\n */\n @property({reflect: true}) transition = 'grow-down';\n\n private currentAction: string|undefined;\n\n @state() private dragging = false;\n private readonly dragMargin = 8;\n private dragInfo?: [number, number, number, number]|undefined;\n\n /**\n * Opens and shows the dialog. This is equivalent to setting the `open`\n * property to true.\n */\n show() {\n this.open = true;\n }\n\n /**\n * Closes the dialog. This is equivalent to setting the `open`\n * property to false.\n */\n close(action = '') {\n this.currentAction = action;\n this.open = false;\n }\n\n /**\n * Opens and shows the dialog if it is closed; otherwise closes it.\n */\n toggleShow() {\n if (this.open) {\n this.close(this.currentAction);\n } else {\n this.show();\n }\n }\n\n private getContentScrollInfo() {\n if (!this.hasUpdated || !this.contentElement) {\n return {isScrollable: false, isAtScrollTop: true, isAtScrollBottom: true};\n }\n const {scrollTop, scrollHeight, offsetHeight, clientHeight} =\n this.contentElement;\n return {\n isScrollable: scrollHeight > offsetHeight,\n isAtScrollTop: scrollTop === 0,\n isAtScrollBottom:\n Math.abs(Math.round(scrollHeight - scrollTop) - clientHeight) <= 2\n };\n }\n\n protected override render() {\n const {isScrollable, isAtScrollTop, isAtScrollBottom} =\n this.getContentScrollInfo();\n return html`\n <dialog\n @close=${this.handleDialogDismiss}\n @cancel=${this.handleDialogDismiss}\n @click=${this.handleDialogClick}\n class=\"dialog ${classMap({\n 'stacked': this.stacked,\n 'scrollable': isScrollable,\n 'scroll-divider-header': !isAtScrollTop,\n 'scroll-divider-footer': !isAtScrollBottom,\n 'footerHidden': this.footerHidden\n })}\"\n aria-labelledby=\"header\"\n aria-describedby=\"content\"\n >\n <div class=\"container ${classMap({\n 'dragging': this.dragging\n })}\"\n @pointermove=${this.handlePointerMove}\n @pointerup=${this.handleDragEnd}\n >\n <md-elevation></md-elevation>\n <header class=\"header\">\n <slot name=\"header\">\n <slot name=\"headline-prefix\"></slot>\n <slot name=\"headline\"></slot>\n <slot name=\"headline-suffix\"></slot>\n </slot>\n </header>\n <section class=\"content\" @scroll=${this.handleContentScroll}>\n <slot></slot>\n </section>\n <footer class=\"footer\">\n <slot name=\"footer\"></slot>\n </footer>\n </div>\n </dialog>`;\n }\n\n protected override willUpdate(changed: PropertyValues) {\n if (changed.has('open')) {\n this.opening = this.open;\n // only closing if was opened previously...\n this.closing = !this.open && changed.get('open');\n }\n if (changed.has('fullscreen') || changed.has('fullscreenBreakpoint')) {\n this.updateFullscreen();\n }\n }\n\n protected override firstUpdated() {\n // Update when content size changes to show/hide scroll dividers.\n new ResizeObserver(() => {\n if (this.showingOpen) {\n this.requestUpdate();\n }\n }).observe(this.contentElement!);\n }\n\n protected override updated(changed: PropertyValues) {\n if (changed.get('draggable') && !this.draggable) {\n this.style.removeProperty('--_container-drag-inline-start');\n this.style.removeProperty('--_container-drag-block-start');\n }\n // Reflect internal state to facilitate styling.\n this.reflectStateProp(changed, 'opening', this.opening);\n this.reflectStateProp(changed, 'closing', this.closing);\n this.reflectStateProp(\n changed, 'showingFullscreen', this.showingFullscreen,\n 'showing-fullscreen');\n this.reflectStateProp(\n changed, 'showingOpen', this.showingOpen, 'showing-open');\n if (!changed.has('open')) {\n return;\n }\n // prevent body scrolling early only when opening to avoid layout\n // shift when closing.\n if (!this.modeless && this.open) {\n Dialog.setDocumentScrollingDisabled(this.open);\n }\n if (this.open) {\n this.contentElement!.scrollTop = 0;\n if (this.modeless) {\n this.dialogElement!.show();\n } else {\n // Note, native focus handling fails when focused element is in an\n // overflow: auto container.\n this.dialogElement!.showModal();\n }\n }\n // Avoids dispatching initial state.\n const shouldDispatchAction = changed.get('open') !== undefined;\n this.performTransition(shouldDispatchAction);\n }\n\n /**\n * Internal state is reflected here as attributes to effect styling. This\n * could be done via internal classes, but it's published on the host\n * to facilitate the (currently undocumented) possibility of customizing\n * styling of user content based on these states.\n * Note, in the future this could be done with `:state(...)` when browser\n * support improves.\n */\n private reflectStateProp(\n changed: PropertyValues, key: string, value: unknown,\n attribute?: string) {\n attribute ??= key;\n if (!changed.has(key)) {\n return;\n }\n if (value) {\n this.setAttribute(attribute, '');\n } else {\n this.removeAttribute(attribute);\n }\n }\n\n private dialogClosedResolver?: () => void;\n\n private async performTransition(shouldDispatchAction: boolean) {\n // TODO: pause here only to avoid a double update warning.\n await this.updateComplete;\n this.showingOpen = this.open;\n if (shouldDispatchAction) {\n this.dispatchActionEvent(this.open ? 'opening' : 'closing');\n }\n // Compute desired transition duration.\n const duration = msFromTimeCSSValue(getComputedStyle(this).getPropertyValue(\n this.open ? OPENING_TRANSITION_PROP : CLOSING_TRANSITION_PROP));\n let promise = this.updateComplete;\n if (duration > 0) {\n promise = new Promise((r) => {\n setTimeout(r, duration);\n });\n }\n await promise;\n this.opening = false;\n this.closing = false;\n if (!this.open && this.dialogElement?.open) {\n // Closing the dialog triggers an asynchronous `close` event.\n // It's important to wait for this event to fire since it changes the\n // state of `open` to false.\n // Without waiting, this element's `closed` event can be called before\n // the dialog's `close` event, which is problematic since the user\n // can set `open` in the `closed` event.\n // The timing of the event appears to vary via browser and does *not*\n // seem to resolve by \"task\" timing; therefore an explicit promise is\n // used.\n const closedPromise = new Promise<void>(resolve => {\n this.dialogClosedResolver = resolve;\n });\n this.dialogElement?.close(this.currentAction || this.defaultAction);\n await closedPromise;\n // enable scrolling late to avoid layout shift when closing\n if (!this.modeless) {\n Dialog.setDocumentScrollingDisabled(this.open);\n }\n }\n // Focus initial element.\n if (this.open) {\n this.focus();\n }\n if (shouldDispatchAction) {\n this.dispatchActionEvent(this.open ? 'opened' : 'closed');\n }\n this.currentAction = undefined;\n }\n\n private dispatchActionEvent(type: string) {\n const detail = {action: this.open ? 'none' : this.currentAction};\n this.dispatchEvent(new CustomEvent(type, {detail, bubbles: true}));\n }\n\n /* Live media query for matching user specified fullscreen breakpoint. */\n private fullscreenQuery?: MediaQueryList;\n private fullscreenQueryListener:\n ((e: MediaQueryListEvent) => void)|undefined = undefined;\n private updateFullscreen() {\n if (this.fullscreenQuery !== undefined) {\n this.fullscreenQuery.removeEventListener(\n 'change', this.fullscreenQueryListener!);\n this.fullscreenQuery = this.fullscreenQueryListener = undefined;\n }\n if (!this.fullscreen) {\n this.showingFullscreen = false;\n return;\n }\n this.fullscreenQuery = window.matchMedia(this.fullscreenBreakpoint);\n this.fullscreenQuery.addEventListener(\n 'change',\n (this.fullscreenQueryListener = (event: MediaQueryListEvent) => {\n this.showingFullscreen = event.matches;\n }));\n this.showingFullscreen = this.fullscreenQuery.matches;\n }\n\n // handles native close/cancel events and we just ensure\n // internal state is in sync.\n private handleDialogDismiss(e: Event) {\n if (e.type === 'cancel') {\n this.currentAction = this.escapeKeyAction;\n }\n this.dialogClosedResolver?.();\n this.dialogClosedResolver = undefined;\n this.open = false;\n this.opening = false;\n this.closing = false;\n }\n\n private handleDialogClick(e: Event) {\n if (!this.open) {\n return;\n }\n this.currentAction =\n (e.target as Element).getAttribute(this.actionAttribute) ??\n (!this.modeless && this.containerElement &&\n !e.composedPath().includes(this.containerElement) ?\n this.scrimClickAction :\n '');\n if (this.currentAction !== '') {\n this.close(this.currentAction);\n }\n }\n\n /* This allows the dividers to dynamically show based on scrolling. */\n private handleContentScroll() {\n this.throttle('scroll', () => {\n this.requestUpdate();\n });\n }\n\n private getFocusElement(): HTMLElement|null {\n const selector = `[${this.focusAttribute}]`;\n const slotted = [this.footerSlot, this.contentSlot].flatMap(\n slot => slot.assignedElements({flatten: true}));\n for (const el of slotted) {\n const focusEl = el.matches(selector) ? el : el.querySelector(selector);\n if (focusEl) {\n return focusEl as HTMLElement;\n }\n }\n return null;\n }\n\n override focus() {\n this.getFocusElement()?.focus();\n }\n\n override blur() {\n this.getFocusElement()?.blur();\n }\n\n private canStartDrag(e: PointerEvent) {\n if (this.draggable === false || e.defaultPrevented || !(e.buttons & 1) ||\n !this.headerElement || !e.composedPath().includes(this.headerElement)) {\n return false;\n }\n return true;\n }\n\n private handlePointerMove(e: PointerEvent) {\n if (!this.dragging && !this.canStartDrag(e) || !this.containerElement) {\n return;\n }\n const {top, left, height, width} =\n this.containerElement.getBoundingClientRect();\n if (!this.dragging) {\n this.containerElement.setPointerCapture(e.pointerId);\n this.dragging = true;\n const {x, y} = e;\n this.dragInfo = [x, y, top, left];\n }\n const [sx, sy, st, sl] = this.dragInfo ?? [0, 0, 0, 0];\n const dx = e.x - sx;\n const dy = e.y - sy;\n const ml = window.innerWidth - width - this.dragMargin;\n const mt = window.innerHeight - height - this.dragMargin;\n const l = Math.max(this.dragMargin, Math.min(ml, dx + sl));\n const t = Math.max(this.dragMargin, Math.min(mt, dy + st));\n this.style.setProperty('--_container-drag-inline-start', `${l}px`);\n this.style.setProperty('--_container-drag-block-start', `${t}px`);\n }\n\n private handleDragEnd(e: PointerEvent) {\n if (!this.dragging) {\n return;\n }\n this.containerElement?.releasePointerCapture(e.pointerId);\n this.dragging = false;\n this.dragInfo = undefined;\n }\n}\n"]}
@@ -3,7 +3,7 @@
3
3
  * Copyright 2023 Google LLC
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import { __decorate, __metadata } from "tslib";
6
+ import { __decorate } from "tslib";
7
7
  import { LitElement } from 'lit';
8
8
  import { property } from 'lit/decorators.js';
9
9
  /**
@@ -27,15 +27,12 @@ export class Divider extends LitElement {
27
27
  }
28
28
  }
29
29
  __decorate([
30
- property({ type: Boolean, reflect: true }),
31
- __metadata("design:type", Object)
30
+ property({ type: Boolean, reflect: true })
32
31
  ], Divider.prototype, "inset", void 0);
33
32
  __decorate([
34
- property({ type: Boolean, reflect: true, attribute: 'inset-start' }),
35
- __metadata("design:type", Object)
33
+ property({ type: Boolean, reflect: true, attribute: 'inset-start' })
36
34
  ], Divider.prototype, "insetStart", void 0);
37
35
  __decorate([
38
- property({ type: Boolean, reflect: true, attribute: 'inset-end' }),
39
- __metadata("design:type", Object)
36
+ property({ type: Boolean, reflect: true, attribute: 'inset-end' })
40
37
  ], Divider.prototype, "insetEnd", void 0);
41
38
  //# sourceMappingURL=divider.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"divider.js","sourceRoot":"","sources":["divider.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,UAAU,EAAC,MAAM,KAAK,CAAC;AAC/B,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAE3C;;GAEG;AACH,MAAM,OAAO,OAAQ,SAAQ,UAAU;IAAvC;;QACE;;WAEG;QACuC,UAAK,GAAG,KAAK,CAAC;QAExD;;WAEG;QAEH,eAAU,GAAG,KAAK,CAAC;QAEnB;;WAEG;QAEH,aAAQ,GAAG,KAAK,CAAC;IACnB,CAAC;CAAA;AAbC;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;;sCAAe;AAKxD;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAC,CAAC;;2CAChD;AAKnB;IAAC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAC,CAAC;;yCAChD","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {LitElement} from 'lit';\nimport {property} from 'lit/decorators.js';\n\n/**\n * A divider component.\n */\nexport class Divider extends LitElement {\n /**\n * Indents the divider with equal padding on both sides.\n */\n @property({type: Boolean, reflect: true}) inset = false;\n\n /**\n * Indents the divider with padding on the leading side.\n */\n @property({type: Boolean, reflect: true, attribute: 'inset-start'})\n insetStart = false;\n\n /**\n * Indents the divider with padding on the trailing side.\n */\n @property({type: Boolean, reflect: true, attribute: 'inset-end'})\n insetEnd = false;\n}\n"]}
1
+ {"version":3,"file":"divider.js","sourceRoot":"","sources":["divider.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,UAAU,EAAC,MAAM,KAAK,CAAC;AAC/B,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAE3C;;GAEG;AACH,MAAM,OAAO,OAAQ,SAAQ,UAAU;IAAvC;;QACE;;WAEG;QACuC,UAAK,GAAG,KAAK,CAAC;QAExD;;WAEG;QAEH,eAAU,GAAG,KAAK,CAAC;QAEnB;;WAEG;QAEH,aAAQ,GAAG,KAAK,CAAC;IACnB,CAAC;CAAA;AAb2C;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;sCAAe;AAMxD;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAC,CAAC;2CAChD;AAMnB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAC,CAAC;yCAChD","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {LitElement} from 'lit';\nimport {property} from 'lit/decorators.js';\n\n/**\n * A divider component.\n */\nexport class Divider extends LitElement {\n /**\n * Indents the divider with equal padding on both sides.\n */\n @property({type: Boolean, reflect: true}) inset = false;\n\n /**\n * Indents the divider with padding on the leading side.\n */\n @property({type: Boolean, reflect: true, attribute: 'inset-start'})\n insetStart = false;\n\n /**\n * Indents the divider with padding on the trailing side.\n */\n @property({type: Boolean, reflect: true, attribute: 'inset-end'})\n insetEnd = false;\n}\n"]}
@@ -29,8 +29,6 @@
29
29
 
30
30
  display: flex;
31
31
  pointer-events: none;
32
- transition-duration: var(--_duration);
33
- transition-timing-function: var(--_easing);
34
32
  }
35
33
 
36
34
  :host,
@@ -40,17 +38,17 @@
40
38
  border-radius: inherit;
41
39
  inset: 0;
42
40
  position: absolute;
41
+ transition-duration: inherit;
42
+ transition-timing-function: inherit;
43
43
  }
44
44
 
45
45
  .shadow::before,
46
46
  .shadow::after {
47
47
  content: '';
48
- transition-duration: inherit;
49
48
  transition-property: box-shadow, opacity;
50
- transition-timing-function: inherit;
51
49
  }
52
50
 
53
- // Key box shadows
51
+ // Key box shadow
54
52
  .shadow::before {
55
53
  // level0: box-shadow: 0px 0px 0px 0px;
56
54
  // level1: box-shadow: 0px 1px 2px 0px;
@@ -96,7 +94,7 @@
96
94
  opacity: 0.3;
97
95
  }
98
96
 
99
- // Ambient box shadows
97
+ // Ambient box shadow
100
98
  .shadow::after {
101
99
  // level0: box-shadow: 0px 0px 0px 0px;
102
100
  // level1: box-shadow: 0px 1px 3px 1px;
@@ -161,7 +159,7 @@
161
159
  // Convert to px.
162
160
  $spread: calc(1px * ($level1to4-spread + $level5-spread));
163
161
 
164
- opacity: 0.15;
165
162
  box-shadow: 0px $y $blur $spread var(--_shadow-color);
163
+ opacity: 0.15;
166
164
  }
167
165
  }
@@ -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{--_duration: var(--md-elevation-duration, 0s);--_easing: var(--md-elevation-easing, cubic-bezier(0.2, 0, 0, 1));--_level: var(--md-elevation-level, 0);--_shadow-color: var(--md-elevation-shadow-color, var(--md-sys-color-shadow, #000));display:flex;pointer-events:none;transition-duration:var(--_duration);transition-timing-function:var(--_easing)}:host,.shadow,.shadow::before,.shadow::after{border-radius:inherit;inset:0;position:absolute}.shadow::before,.shadow::after{content:"";transition-duration:inherit;transition-property:box-shadow,opacity;transition-timing-function:inherit}.shadow::before{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 3,1) + 2*clamp(0,var(--_level) - 4,1))) calc(1px*(2*clamp(0,var(--_level),1) + clamp(0,var(--_level) - 2,1) + clamp(0,var(--_level) - 4,1))) 0px var(--_shadow-color);opacity:.3}.shadow::after{opacity:.15;box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 1,1) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(3*clamp(0,var(--_level),2) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(clamp(0,var(--_level),4) + 2*clamp(0,var(--_level) - 4,1))) var(--_shadow-color)}/*# sourceMappingURL=elevation-styles.css.map */
7
+ export const styles = css `:host{--_level: var(--md-elevation-level, 0);--_shadow-color: var(--md-elevation-shadow-color, var(--md-sys-color-shadow, #000));display:flex;pointer-events:none}:host,.shadow,.shadow::before,.shadow::after{border-radius:inherit;inset:0;position:absolute;transition-duration:inherit;transition-timing-function:inherit}.shadow::before,.shadow::after{content:"";transition-property:box-shadow,opacity}.shadow::before{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 3,1) + 2*clamp(0,var(--_level) - 4,1))) calc(1px*(2*clamp(0,var(--_level),1) + clamp(0,var(--_level) - 2,1) + clamp(0,var(--_level) - 4,1))) 0px var(--_shadow-color);opacity:.3}.shadow::after{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 1,1) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(3*clamp(0,var(--_level),2) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(clamp(0,var(--_level),4) + 2*clamp(0,var(--_level) - 4,1))) var(--_shadow-color);opacity:.15}/*# sourceMappingURL=elevation-styles.css.map */
8
8
  `;
9
9
  //# sourceMappingURL=elevation-styles.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"elevation-styles.css.js","sourceRoot":"","sources":["elevation-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{--_duration: var(--md-elevation-duration, 0s);--_easing: var(--md-elevation-easing, cubic-bezier(0.2, 0, 0, 1));--_level: var(--md-elevation-level, 0);--_shadow-color: var(--md-elevation-shadow-color, var(--md-sys-color-shadow, #000));display:flex;pointer-events:none;transition-duration:var(--_duration);transition-timing-function:var(--_easing)}:host,.shadow,.shadow::before,.shadow::after{border-radius:inherit;inset:0;position:absolute}.shadow::before,.shadow::after{content:\"\";transition-duration:inherit;transition-property:box-shadow,opacity;transition-timing-function:inherit}.shadow::before{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 3,1) + 2*clamp(0,var(--_level) - 4,1))) calc(1px*(2*clamp(0,var(--_level),1) + clamp(0,var(--_level) - 2,1) + clamp(0,var(--_level) - 4,1))) 0px var(--_shadow-color);opacity:.3}.shadow::after{opacity:.15;box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 1,1) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(3*clamp(0,var(--_level),2) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(clamp(0,var(--_level),4) + 2*clamp(0,var(--_level) - 4,1))) var(--_shadow-color)}/*# sourceMappingURL=elevation-styles.css.map */\n`;\n "]}
1
+ {"version":3,"file":"elevation-styles.css.js","sourceRoot":"","sources":["elevation-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{--_level: var(--md-elevation-level, 0);--_shadow-color: var(--md-elevation-shadow-color, var(--md-sys-color-shadow, #000));display:flex;pointer-events:none}:host,.shadow,.shadow::before,.shadow::after{border-radius:inherit;inset:0;position:absolute;transition-duration:inherit;transition-timing-function:inherit}.shadow::before,.shadow::after{content:\"\";transition-property:box-shadow,opacity}.shadow::before{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 3,1) + 2*clamp(0,var(--_level) - 4,1))) calc(1px*(2*clamp(0,var(--_level),1) + clamp(0,var(--_level) - 2,1) + clamp(0,var(--_level) - 4,1))) 0px var(--_shadow-color);opacity:.3}.shadow::after{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 1,1) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(3*clamp(0,var(--_level),2) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(clamp(0,var(--_level),4) + 2*clamp(0,var(--_level) - 4,1))) var(--_shadow-color);opacity:.15}/*# sourceMappingURL=elevation-styles.css.map */\n`;\n "]}
@@ -8,5 +8,5 @@ import { LitElement } from 'lit';
8
8
  * A component for elevation.
9
9
  */
10
10
  export declare class Elevation extends LitElement {
11
- render(): import("lit-html").TemplateResult<1>;
11
+ protected render(): import("lit-html").TemplateResult<1>;
12
12
  }
@@ -1 +1 @@
1
- {"version":3,"file":"elevation.js","sourceRoot":"","sources":["elevation.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAE,UAAU,EAAC,MAAM,KAAK,CAAC;AAErC;;GAEG;AACH,MAAM,OAAO,SAAU,SAAQ,UAAU;IAC9B,MAAM;QACb,OAAO,IAAI,CAAA,8BAA8B,CAAC;IAC5C,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, LitElement} from 'lit';\n\n/**\n * A component for elevation.\n */\nexport class Elevation extends LitElement {\n override render() {\n return html`<span class=\"shadow\"></span>`;\n }\n}\n"]}
1
+ {"version":3,"file":"elevation.js","sourceRoot":"","sources":["elevation.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,IAAI,EAAE,UAAU,EAAC,MAAM,KAAK,CAAC;AAErC;;GAEG;AACH,MAAM,OAAO,SAAU,SAAQ,UAAU;IACpB,MAAM;QACvB,OAAO,IAAI,CAAA,8BAA8B,CAAC;IAC5C,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, LitElement} from 'lit';\n\n/**\n * A component for elevation.\n */\nexport class Elevation extends LitElement {\n protected override render() {\n return html`<span class=\"shadow\"></span>`;\n }\n}\n"]}
package/fab/_fab.scss CHANGED
@@ -3,4 +3,5 @@
3
3
  // SPDX-License-Identifier: Apache-2.0
4
4
  //
5
5
 
6
+ @forward './lib/fab-branded' as branded-* show branded-theme;
6
7
  @forward './lib/fab' show theme;
@@ -0,0 +1,56 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2023 Google LLC
4
+ * SPDX-License-Identifier: Apache-2.0
5
+ */
6
+ import { Fab, Variant } from './lib/fab.js';
7
+ export { FabSize } from './lib/shared.js';
8
+ declare global {
9
+ interface HTMLElementTagNameMap {
10
+ 'md-branded-fab': MdBrandedFab;
11
+ }
12
+ }
13
+ /**
14
+ * @summary Floating action buttons (FABs) help people take primary actions.
15
+ * They’re used to represent the most important action on a screen, such as
16
+ * Create or Reply.
17
+ *
18
+ * @description
19
+ * __Emphasis:__ High emphasis – For the primary, most important, or most common
20
+ * action on a screen
21
+ *
22
+ * __Rationale:__ The FAB remains the default component for a screen’s primary
23
+ * action. It comes in three sizes: small FAB, FAB, and large FAB. The extended
24
+ * FAB’s wider format and text label give it more visual prominence than a FAB.
25
+ * It’s often used on larger screens where a FAB would seem too small. Branded
26
+ * FABs are used to specifically call attention to branded logo icons.
27
+ *
28
+ * __Example usages:__
29
+ * - FAB
30
+ * - Create
31
+ * - Compose
32
+ * - Extended FAB
33
+ * - Create
34
+ * - Compose
35
+ * - New Thread
36
+ * - New File
37
+ *
38
+ * @final
39
+ * @suppress {visibility}
40
+ */
41
+ export declare class MdBrandedFab extends Fab {
42
+ /**
43
+ * Branded FABs have no variants
44
+ */
45
+ variant: Variant;
46
+ getRenderClasses(): {
47
+ primary: boolean;
48
+ secondary: boolean;
49
+ tertiary: boolean;
50
+ small: boolean;
51
+ lowered: boolean;
52
+ large: boolean;
53
+ extended: boolean;
54
+ };
55
+ static styles: import("lit").CSSResult[];
56
+ }
@@ -0,0 +1,56 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2023 Google LLC
4
+ * SPDX-License-Identifier: Apache-2.0
5
+ */
6
+ import { __decorate } from "tslib";
7
+ import { customElement } from 'lit/decorators.js';
8
+ import { Fab } from './lib/fab.js';
9
+ import { styles } from './lib/fab-branded-styles.css.js';
10
+ import { styles as forcedColors } from './lib/forced-colors-styles.css.js';
11
+ import { styles as sharedStyles } from './lib/shared-styles.css.js';
12
+ /**
13
+ * @summary Floating action buttons (FABs) help people take primary actions.
14
+ * They’re used to represent the most important action on a screen, such as
15
+ * Create or Reply.
16
+ *
17
+ * @description
18
+ * __Emphasis:__ High emphasis – For the primary, most important, or most common
19
+ * action on a screen
20
+ *
21
+ * __Rationale:__ The FAB remains the default component for a screen’s primary
22
+ * action. It comes in three sizes: small FAB, FAB, and large FAB. The extended
23
+ * FAB’s wider format and text label give it more visual prominence than a FAB.
24
+ * It’s often used on larger screens where a FAB would seem too small. Branded
25
+ * FABs are used to specifically call attention to branded logo icons.
26
+ *
27
+ * __Example usages:__
28
+ * - FAB
29
+ * - Create
30
+ * - Compose
31
+ * - Extended FAB
32
+ * - Create
33
+ * - Compose
34
+ * - New Thread
35
+ * - New File
36
+ *
37
+ * @final
38
+ * @suppress {visibility}
39
+ */
40
+ let MdBrandedFab = class MdBrandedFab extends Fab {
41
+ getRenderClasses() {
42
+ return {
43
+ ...super.getRenderClasses(),
44
+ 'primary': false,
45
+ 'secondary': false,
46
+ 'tertiary': false,
47
+ 'small': false,
48
+ };
49
+ }
50
+ };
51
+ MdBrandedFab.styles = [sharedStyles, styles, forcedColors];
52
+ MdBrandedFab = __decorate([
53
+ customElement('md-branded-fab')
54
+ ], MdBrandedFab);
55
+ export { MdBrandedFab };
56
+ //# sourceMappingURL=branded-fab.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"branded-fab.js","sourceRoot":"","sources":["branded-fab.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,GAAG,EAAU,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAC,MAAM,EAAC,MAAM,iCAAiC,CAAC;AACvD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAUlE;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,GAAG;IAM1B,gBAAgB;QACvB,OAAO;YACL,GAAG,KAAK,CAAC,gBAAgB,EAAE;YAC3B,SAAS,EAAE,KAAK;YAChB,WAAW,EAAE,KAAK;YAClB,UAAU,EAAE,KAAK;YACjB,OAAO,EAAE,KAAK;SACf,CAAC;IACJ,CAAC;;AACe,mBAAM,GAClB,CAAC,YAAY,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC;AAhB9B,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAiBxB;SAjBY,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 {Fab, Variant} from './lib/fab.js';\nimport {styles} from './lib/fab-branded-styles.css.js';\nimport {styles as forcedColors} from './lib/forced-colors-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-styles.css.js';\n\nexport {FabSize} from './lib/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-branded-fab': MdBrandedFab;\n }\n}\n\n/**\n * @summary Floating action buttons (FABs) help people take primary actions.\n * They’re used to represent the most important action on a screen, such as\n * Create or Reply.\n *\n * @description\n * __Emphasis:__ High emphasis – For the primary, most important, or most common\n * action on a screen\n *\n * __Rationale:__ The FAB remains the default component for a screen’s primary\n * action. It comes in three sizes: small FAB, FAB, and large FAB. The extended\n * FAB’s wider format and text label give it more visual prominence than a FAB.\n * It’s often used on larger screens where a FAB would seem too small. Branded\n * FABs are used to specifically call attention to branded logo icons.\n *\n * __Example usages:__\n * - FAB\n * - Create\n * - Compose\n * - Extended FAB\n * - Create\n * - Compose\n * - New Thread\n * - New File\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-branded-fab')\nexport class MdBrandedFab extends Fab {\n /**\n * Branded FABs have no variants\n */\n override variant!: Variant;\n\n override getRenderClasses() {\n return {\n ...super.getRenderClasses(),\n 'primary': false,\n 'secondary': false,\n 'tertiary': false,\n 'small': false,\n };\n }\n static override styles =\n [sharedStyles, styles, forcedColors];\n}\n"]}
package/fab/fab.d.ts CHANGED
@@ -3,21 +3,41 @@
3
3
  * Copyright 2022 Google LLC
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
- import '../icon/icon.js';
7
- import { TemplateResult } from 'lit';
8
6
  import { Fab } from './lib/fab.js';
7
+ export { Variant } from './lib/fab.js';
8
+ export { FabSize } from './lib/shared.js';
9
9
  declare global {
10
10
  interface HTMLElementTagNameMap {
11
11
  'md-fab': MdFab;
12
12
  }
13
13
  }
14
14
  /**
15
- * @soyCompatible
15
+ * @summary Floating action buttons (FABs) help people take primary actions.
16
+ * They’re used to represent the most important action on a screen, such as
17
+ * Create or Reply.
18
+ *
19
+ * @description
20
+ * __Emphasis:__ High emphasis – For the primary, most important, or most common
21
+ * action on a screen
22
+ *
23
+ * __Rationale:__ The FAB remains the default component for a screen’s primary
24
+ * action. It comes in three sizes: small FAB, FAB, and large FAB. The extended
25
+ * FAB’s wider format and text label give it more visual prominence than a FAB.
26
+ * It’s often used on larger screens where a FAB would seem too small.
27
+ *
28
+ * __Example usages:__
29
+ * - FAB
30
+ * - Create
31
+ * - Compose
32
+ * - Extended FAB
33
+ * - Create
34
+ * - Compose
35
+ * - New Thread
36
+ * - New File
37
+ *
16
38
  * @final
17
39
  * @suppress {visibility}
18
40
  */
19
41
  export declare class MdFab extends Fab {
20
42
  static styles: import("lit").CSSResult[];
21
- /** @soyTemplate */
22
- protected renderIcon(icon: string): TemplateResult | string;
23
43
  }
package/fab/fab.js CHANGED
@@ -4,24 +4,41 @@
4
4
  * SPDX-License-Identifier: Apache-2.0
5
5
  */
6
6
  import { __decorate } from "tslib";
7
- import '../icon/icon.js';
8
- import { html } from 'lit';
9
7
  import { customElement } from 'lit/decorators.js';
10
8
  import { Fab } from './lib/fab.js';
11
- import { styles as sharedStyles } from './lib/fab-shared-styles.css.js';
12
- import { styles as fabStyles } from './lib/fab-styles.css.js';
9
+ import { styles } from './lib/fab-styles.css.js';
10
+ import { styles as forcedColors } from './lib/forced-colors-styles.css.js';
11
+ import { styles as sharedStyles } from './lib/shared-styles.css.js';
13
12
  /**
14
- * @soyCompatible
13
+ * @summary Floating action buttons (FABs) help people take primary actions.
14
+ * They’re used to represent the most important action on a screen, such as
15
+ * Create or Reply.
16
+ *
17
+ * @description
18
+ * __Emphasis:__ High emphasis – For the primary, most important, or most common
19
+ * action on a screen
20
+ *
21
+ * __Rationale:__ The FAB remains the default component for a screen’s primary
22
+ * action. It comes in three sizes: small FAB, FAB, and large FAB. The extended
23
+ * FAB’s wider format and text label give it more visual prominence than a FAB.
24
+ * It’s often used on larger screens where a FAB would seem too small.
25
+ *
26
+ * __Example usages:__
27
+ * - FAB
28
+ * - Create
29
+ * - Compose
30
+ * - Extended FAB
31
+ * - Create
32
+ * - Compose
33
+ * - New Thread
34
+ * - New File
35
+ *
15
36
  * @final
16
37
  * @suppress {visibility}
17
38
  */
18
39
  let MdFab = class MdFab extends Fab {
19
- /** @soyTemplate */
20
- renderIcon(icon) {
21
- return icon ? html `<md-icon class="md3-fab__icon">${icon}</md-icon>` : '';
22
- }
23
40
  };
24
- MdFab.styles = [sharedStyles, fabStyles];
41
+ MdFab.styles = [sharedStyles, styles, forcedColors];
25
42
  MdFab = __decorate([
26
43
  customElement('md-fab')
27
44
  ], MdFab);
package/fab/fab.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"fab.js","sourceRoot":"","sources":["fab.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,iBAAiB,CAAC;AAEzB,OAAO,EAAC,IAAI,EAAiB,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,GAAG,EAAC,MAAM,cAAc,CAAC;AACjC,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAC,MAAM,IAAI,SAAS,EAAC,MAAM,yBAAyB,CAAC;AAQ5D;;;;GAIG;AAEI,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,GAAG;IAG5B,mBAAmB;IACA,UAAU,CAAC,IAAY;QACxC,OAAO,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,kCAAkC,IAAI,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5E,CAAC;;AALe,YAAM,GAAG,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;AADxC,KAAK;IADjB,aAAa,CAAC,QAAQ,CAAC;GACX,KAAK,CAOjB;SAPY,KAAK","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../icon/icon.js';\n\nimport {html, TemplateResult} from 'lit';\nimport {customElement} from 'lit/decorators.js';\n\nimport {Fab} from './lib/fab.js';\nimport {styles as sharedStyles} from './lib/fab-shared-styles.css.js';\nimport {styles as fabStyles} from './lib/fab-styles.css.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-fab': MdFab;\n }\n}\n\n/**\n * @soyCompatible\n * @final\n * @suppress {visibility}\n */\n@customElement('md-fab')\nexport class MdFab extends Fab {\n static override styles = [sharedStyles, fabStyles];\n\n /** @soyTemplate */\n protected override renderIcon(icon: string): TemplateResult|string {\n return icon ? html`<md-icon class=\"md3-fab__icon\">${icon}</md-icon>` : '';\n }\n}\n"]}
1
+ {"version":3,"file":"fab.js","sourceRoot":"","sources":["fab.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,GAAG,EAAC,MAAM,cAAc,CAAC;AACjC,OAAO,EAAC,MAAM,EAAC,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,4BAA4B,CAAC;AAWlE;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEI,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,GAAG;;AACZ,YAAM,GAClB,CAAC,YAAY,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC;AAF9B,KAAK;IADjB,aAAa,CAAC,QAAQ,CAAC;GACX,KAAK,CAGjB;SAHY,KAAK","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {Fab} from './lib/fab.js';\nimport {styles} from './lib/fab-styles.css.js';\nimport {styles as forcedColors} from './lib/forced-colors-styles.css.js';\nimport {styles as sharedStyles} from './lib/shared-styles.css.js';\n\nexport {Variant} from './lib/fab.js';\nexport {FabSize} from './lib/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-fab': MdFab;\n }\n}\n\n/**\n * @summary Floating action buttons (FABs) help people take primary actions.\n * They’re used to represent the most important action on a screen, such as\n * Create or Reply.\n *\n * @description\n * __Emphasis:__ High emphasis – For the primary, most important, or most common\n * action on a screen\n *\n * __Rationale:__ The FAB remains the default component for a screen’s primary\n * action. It comes in three sizes: small FAB, FAB, and large FAB. The extended\n * FAB’s wider format and text label give it more visual prominence than a FAB.\n * It’s often used on larger screens where a FAB would seem too small.\n *\n * __Example usages:__\n * - FAB\n * - Create\n * - Compose\n * - Extended FAB\n * - Create\n * - Compose\n * - New Thread\n * - New File\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-fab')\nexport class MdFab extends Fab {\n static override styles =\n [sharedStyles, styles, forcedColors];\n}\n"]}
package/fab/harness.d.ts CHANGED
@@ -5,10 +5,9 @@
5
5
  */
6
6
  import { Harness } from '../testing/harness.js';
7
7
  import { Fab } from './lib/fab.js';
8
- import { FabExtended } from './lib/fab-extended.js';
9
8
  /**
10
9
  * Test harness for floating action buttons.
11
10
  */
12
- export declare class FabHarness extends Harness<Fab | FabExtended> {
11
+ export declare class FabHarness extends Harness<Fab> {
13
12
  getInteractiveElement(): Promise<HTMLButtonElement>;
14
13
  }
package/fab/harness.js CHANGED
@@ -10,7 +10,7 @@ import { Harness } from '../testing/harness.js';
10
10
  export class FabHarness extends Harness {
11
11
  async getInteractiveElement() {
12
12
  await this.element.updateComplete;
13
- return this.element.renderRoot.querySelector('.md3-fab');
13
+ return this.element.renderRoot.querySelector('.fab');
14
14
  }
15
15
  }
16
16
  //# sourceMappingURL=harness.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAM9C;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,OAAwB;IAC7C,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAClC,CAAC;IACxB,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {Fab} from './lib/fab.js';\nimport {FabExtended} from './lib/fab-extended.js';\n\n\n/**\n * Test harness for floating action buttons.\n */\nexport class FabHarness extends Harness<Fab|FabExtended> {\n override async getInteractiveElement() {\n await this.element.updateComplete;\n return this.element.renderRoot.querySelector('.md3-fab') as\n HTMLButtonElement;\n }\n}\n"]}
1
+ {"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAI9C;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,OAAY;IACjC,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAC9B,CAAC;IACxB,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {Fab} from './lib/fab.js';\n\n/**\n * Test harness for floating action buttons.\n */\nexport class FabHarness extends Harness<Fab> {\n override async getInteractiveElement() {\n await this.element.updateComplete;\n return this.element.renderRoot.querySelector('.fab') as\n HTMLButtonElement;\n }\n}\n"]}
@@ -0,0 +1,81 @@
1
+ //
2
+ // Copyright 2023 Google LLC
3
+ // SPDX-License-Identifier: Apache-2.0
4
+ //
5
+
6
+ // go/keep-sorted start
7
+ @use 'sass:list';
8
+ // go/keep-sorted end
9
+ // go/keep-sorted start
10
+ @use '../../tokens';
11
+ // go/keep-sorted end
12
+
13
+ @mixin theme($tokens) {
14
+ $supported-tokens: list.join(
15
+ tokens.$md-comp-fab-branded-supported-tokens,
16
+ (
17
+ 'container-shape-start-start',
18
+ 'container-shape-start-end',
19
+ 'container-shape-end-end',
20
+ 'container-shape-end-start',
21
+ 'large-container-shape-start-start',
22
+ 'large-container-shape-start-end',
23
+ 'large-container-shape-end-end',
24
+ 'large-container-shape-end-start'
25
+ )
26
+ );
27
+
28
+ @each $token, $value in $tokens {
29
+ @if list.index($supported-tokens, $token) == null {
30
+ @error 'Token `#{$token}` is not a supported token.';
31
+ }
32
+
33
+ @if $value {
34
+ --md-fab-branded-#{$token}: #{$value};
35
+ }
36
+ }
37
+ }
38
+
39
+ @mixin styles() {
40
+ $tokens: tokens.md-comp-fab-branded-values();
41
+
42
+ :host {
43
+ @each $token, $value in $tokens {
44
+ --_#{$token}: var(--md-fab-branded-#{$token}, #{$value});
45
+ }
46
+
47
+ // Support logical shape properties
48
+ --_container-shape-start-start: var(
49
+ --md-fab-branded-container-shape-start-start,
50
+ var(--_container-shape)
51
+ );
52
+ --_container-shape-start-end: var(
53
+ --md-fab-branded-container-shape-start-end,
54
+ var(--_container-shape)
55
+ );
56
+ --_container-shape-end-end: var(
57
+ --md-fab-branded-container-shape-end-end,
58
+ var(--_container-shape)
59
+ );
60
+ --_container-shape-end-start: var(
61
+ --md-fab-branded-container-shape-end-start,
62
+ var(--_container-shape)
63
+ );
64
+ --_large-container-shape-start-start: var(
65
+ --md-fab-branded-large-container-shape-start-start,
66
+ var(--_large-container-shape)
67
+ );
68
+ --_large-container-shape-start-end: var(
69
+ --md-fab-branded-large-container-shape-start-end,
70
+ var(--_large-container-shape)
71
+ );
72
+ --_large-container-shape-end-end: var(
73
+ --md-fab-branded-large-container-shape-end-end,
74
+ var(--_large-container-shape)
75
+ );
76
+ --_large-container-shape-end-start: var(
77
+ --md-fab-branded-large-container-shape-end-start,
78
+ var(--_large-container-shape)
79
+ );
80
+ }
81
+ }