@api-client/ui 0.2.13 → 0.3.1

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 (326) hide show
  1. package/.vscode/settings.json +1 -0
  2. package/build/src/core/ModalActivity.d.ts +1 -1
  3. package/build/src/core/ModalActivity.d.ts.map +1 -1
  4. package/build/src/core/ModalActivity.js +6 -5
  5. package/build/src/core/ModalActivity.js.map +1 -1
  6. package/build/src/core/ThemeManager.d.ts +4 -2
  7. package/build/src/core/ThemeManager.d.ts.map +1 -1
  8. package/build/src/core/ThemeManager.js.map +1 -1
  9. package/build/src/demo/DemoPage.d.ts +1 -4
  10. package/build/src/demo/DemoPage.d.ts.map +1 -1
  11. package/build/src/demo/DemoPage.js +2 -5
  12. package/build/src/demo/DemoPage.js.map +1 -1
  13. package/build/src/elements/authorization/ui/CcAuthorization.d.ts +1 -1
  14. package/build/src/elements/authorization/ui/CcAuthorization.d.ts.map +1 -1
  15. package/build/src/elements/authorization/ui/CcAuthorization.js +2 -2
  16. package/build/src/elements/authorization/ui/CcAuthorization.js.map +1 -1
  17. package/build/src/elements/authorization/ui/OAuth2Authorization.d.ts +1 -1
  18. package/build/src/elements/authorization/ui/OAuth2Authorization.d.ts.map +1 -1
  19. package/build/src/elements/authorization/ui/OAuth2Authorization.js +11 -5
  20. package/build/src/elements/authorization/ui/OAuth2Authorization.js.map +1 -1
  21. package/build/src/elements/authorization/ui/OidcAuthorization.d.ts +1 -2
  22. package/build/src/elements/authorization/ui/OidcAuthorization.d.ts.map +1 -1
  23. package/build/src/elements/authorization/ui/OidcAuthorization.js +10 -8
  24. package/build/src/elements/authorization/ui/OidcAuthorization.js.map +1 -1
  25. package/build/src/elements/code/HttpSnippets.d.ts +1 -1
  26. package/build/src/elements/code/HttpSnippets.d.ts.map +1 -1
  27. package/build/src/elements/code/HttpSnippets.js +5 -5
  28. package/build/src/elements/code/HttpSnippets.js.map +1 -1
  29. package/build/src/elements/dialog/internals/ConfirmDelete.d.ts +1 -1
  30. package/build/src/elements/dialog/internals/ConfirmDelete.d.ts.map +1 -1
  31. package/build/src/elements/dialog/internals/ConfirmDelete.js +5 -5
  32. package/build/src/elements/dialog/internals/ConfirmDelete.js.map +1 -1
  33. package/build/src/elements/dialog/internals/Rename.d.ts +1 -1
  34. package/build/src/elements/dialog/internals/Rename.d.ts.map +1 -1
  35. package/build/src/elements/dialog/internals/Rename.js +6 -5
  36. package/build/src/elements/dialog/internals/Rename.js.map +1 -1
  37. package/build/src/elements/environment/EnvironmentEditor.d.ts +1 -1
  38. package/build/src/elements/environment/EnvironmentEditor.d.ts.map +1 -1
  39. package/build/src/elements/environment/EnvironmentEditor.js +5 -4
  40. package/build/src/elements/environment/EnvironmentEditor.js.map +1 -1
  41. package/build/src/elements/http/BodyEditor.d.ts +1 -3
  42. package/build/src/elements/http/BodyEditor.d.ts.map +1 -1
  43. package/build/src/elements/http/BodyEditor.js +25 -20
  44. package/build/src/elements/http/BodyEditor.js.map +1 -1
  45. package/build/src/elements/http/BodyMultipartEditor.d.ts +1 -1
  46. package/build/src/elements/http/BodyMultipartEditor.d.ts.map +1 -1
  47. package/build/src/elements/http/BodyMultipartEditor.js +3 -3
  48. package/build/src/elements/http/BodyMultipartEditor.js.map +1 -1
  49. package/build/src/elements/http/CertificateAdd.element.d.ts +1 -3
  50. package/build/src/elements/http/CertificateAdd.element.d.ts.map +1 -1
  51. package/build/src/elements/http/CertificateAdd.element.js +6 -10
  52. package/build/src/elements/http/CertificateAdd.element.js.map +1 -1
  53. package/build/src/elements/http/HeadersForm.d.ts +1 -1
  54. package/build/src/elements/http/HeadersForm.d.ts.map +1 -1
  55. package/build/src/elements/http/HeadersForm.js +3 -3
  56. package/build/src/elements/http/HeadersForm.js.map +1 -1
  57. package/build/src/elements/http/HttpAssertions.element.d.ts +1 -1
  58. package/build/src/elements/http/HttpAssertions.element.d.ts.map +1 -1
  59. package/build/src/elements/http/HttpAssertions.element.js +2 -2
  60. package/build/src/elements/http/HttpAssertions.element.js.map +1 -1
  61. package/build/src/elements/http/HttpFlows.element.d.ts +1 -1
  62. package/build/src/elements/http/HttpFlows.element.d.ts.map +1 -1
  63. package/build/src/elements/http/HttpFlows.element.js +6 -6
  64. package/build/src/elements/http/HttpFlows.element.js.map +1 -1
  65. package/build/src/elements/http/RequestEditor.d.ts +1 -3
  66. package/build/src/elements/http/RequestEditor.d.ts.map +1 -1
  67. package/build/src/elements/http/RequestEditor.js +10 -11
  68. package/build/src/elements/http/RequestEditor.js.map +1 -1
  69. package/build/src/elements/http/UrlParamsForm.d.ts +1 -1
  70. package/build/src/elements/http/UrlParamsForm.d.ts.map +1 -1
  71. package/build/src/elements/http/UrlParamsForm.js +4 -4
  72. package/build/src/elements/http/UrlParamsForm.js.map +1 -1
  73. package/build/src/elements/project/HttpProjectRequest.d.ts +1 -1
  74. package/build/src/elements/project/HttpProjectRequest.d.ts.map +1 -1
  75. package/build/src/elements/project/HttpProjectRequest.js +3 -3
  76. package/build/src/elements/project/HttpProjectRequest.js.map +1 -1
  77. package/build/src/elements/project/HttpProjectRequestHistory.d.ts +1 -2
  78. package/build/src/elements/project/HttpProjectRequestHistory.d.ts.map +1 -1
  79. package/build/src/elements/project/HttpProjectRequestHistory.js +5 -6
  80. package/build/src/elements/project/HttpProjectRequestHistory.js.map +1 -1
  81. package/build/src/elements/project/ProjectRunReport.d.ts +1 -1
  82. package/build/src/elements/project/ProjectRunReport.d.ts.map +1 -1
  83. package/build/src/elements/project/ProjectRunReport.js +7 -7
  84. package/build/src/elements/project/ProjectRunReport.js.map +1 -1
  85. package/build/src/elements/project/ProjectRunner.d.ts +1 -2
  86. package/build/src/elements/project/ProjectRunner.d.ts.map +1 -1
  87. package/build/src/elements/project/ProjectRunner.js +4 -5
  88. package/build/src/elements/project/ProjectRunner.js.map +1 -1
  89. package/build/src/md/button/internals/base.d.ts +98 -0
  90. package/build/src/md/button/internals/base.d.ts.map +1 -0
  91. package/build/src/md/button/internals/base.js +353 -0
  92. package/build/src/md/button/internals/base.js.map +1 -0
  93. package/build/src/md/button/internals/button.d.ts +7 -75
  94. package/build/src/md/button/internals/button.d.ts.map +1 -1
  95. package/build/src/md/button/internals/button.js +18 -247
  96. package/build/src/md/button/internals/button.js.map +1 -1
  97. package/build/src/md/button/internals/{button-styles.d.ts → button.styles.d.ts} +1 -1
  98. package/build/src/md/button/internals/button.styles.d.ts.map +1 -0
  99. package/build/src/md/button/internals/button.styles.js +319 -0
  100. package/build/src/md/button/internals/button.styles.js.map +1 -0
  101. package/build/src/md/button/internals/group.d.ts +54 -0
  102. package/build/src/md/button/internals/group.d.ts.map +1 -0
  103. package/build/src/md/button/internals/group.js +157 -0
  104. package/build/src/md/button/internals/group.js.map +1 -0
  105. package/build/src/md/button/internals/{text-button.styles.d.ts → group.styles.d.ts} +1 -1
  106. package/build/src/md/button/internals/group.styles.d.ts.map +1 -0
  107. package/build/src/md/button/internals/group.styles.js +102 -0
  108. package/build/src/md/button/internals/group.styles.js.map +1 -0
  109. package/build/src/md/button/ui-button-group.d.ts +11 -0
  110. package/build/src/md/button/ui-button-group.d.ts.map +1 -0
  111. package/build/src/md/{icon-button/ui-filled-icon-button.js → button/ui-button-group.js} +10 -11
  112. package/build/src/md/button/ui-button-group.js.map +1 -0
  113. package/build/src/md/button/ui-button.d.ts +14 -0
  114. package/build/src/md/button/ui-button.d.ts.map +1 -0
  115. package/build/src/md/button/{ui-text-button.js → ui-button.js} +10 -11
  116. package/build/src/md/button/ui-button.js.map +1 -0
  117. package/build/src/md/dialog/internals/Dialog.d.ts +5 -5
  118. package/build/src/md/dialog/internals/Dialog.d.ts.map +1 -1
  119. package/build/src/md/dialog/internals/Dialog.js +14 -9
  120. package/build/src/md/dialog/internals/Dialog.js.map +1 -1
  121. package/build/src/md/dropdown-list/internals/UiDropdownList.d.ts +1 -1
  122. package/build/src/md/dropdown-list/internals/UiDropdownList.js +1 -1
  123. package/build/src/md/dropdown-list/internals/UiDropdownList.js.map +1 -1
  124. package/build/src/md/icon-button/internals/IconButton.d.ts +12 -36
  125. package/build/src/md/icon-button/internals/IconButton.d.ts.map +1 -1
  126. package/build/src/md/icon-button/internals/IconButton.js +32 -144
  127. package/build/src/md/icon-button/internals/IconButton.js.map +1 -1
  128. package/build/src/md/{button/internals/filled-button.styles.d.ts → icon-button/internals/IconButton.styles.d.ts} +1 -1
  129. package/build/src/md/icon-button/internals/IconButton.styles.d.ts.map +1 -0
  130. package/build/src/md/icon-button/internals/IconButton.styles.js +286 -0
  131. package/build/src/md/icon-button/internals/IconButton.styles.js.map +1 -0
  132. package/build/src/md/icon-button/ui-icon-button.d.ts.map +1 -1
  133. package/build/src/md/icon-button/ui-icon-button.js +2 -3
  134. package/build/src/md/icon-button/ui-icon-button.js.map +1 -1
  135. package/build/src/md/input/Input.d.ts +4 -3
  136. package/build/src/md/input/Input.d.ts.map +1 -1
  137. package/build/src/md/input/Input.js +15 -11
  138. package/build/src/md/input/Input.js.map +1 -1
  139. package/build/src/md/ripple/internals/ripple.d.ts +2 -0
  140. package/build/src/md/ripple/internals/ripple.d.ts.map +1 -1
  141. package/build/src/md/ripple/internals/ripple.js +20 -10
  142. package/build/src/md/ripple/internals/ripple.js.map +1 -1
  143. package/build/src/md/ripple/internals/ripple.styles.d.ts.map +1 -1
  144. package/build/src/md/ripple/internals/ripple.styles.js +8 -20
  145. package/build/src/md/ripple/internals/ripple.styles.js.map +1 -1
  146. package/build/src/md/snackbar/internals/Snackbar.d.ts +1 -1
  147. package/build/src/md/snackbar/internals/Snackbar.d.ts.map +1 -1
  148. package/build/src/md/snackbar/internals/Snackbar.js +4 -2
  149. package/build/src/md/snackbar/internals/Snackbar.js.map +1 -1
  150. package/build/src/md/text-field/internals/common.styles.d.ts.map +1 -1
  151. package/build/src/md/text-field/internals/common.styles.js +11 -5
  152. package/build/src/md/text-field/internals/common.styles.js.map +1 -1
  153. package/build/src/md/text-field/internals/filled.styles.d.ts.map +1 -1
  154. package/build/src/md/text-field/internals/filled.styles.js +7 -0
  155. package/build/src/md/text-field/internals/filled.styles.js.map +1 -1
  156. package/build/src/md/text-field/internals/outlined.styles.d.ts.map +1 -1
  157. package/build/src/md/text-field/internals/outlined.styles.js +29 -9
  158. package/build/src/md/text-field/internals/outlined.styles.js.map +1 -1
  159. package/build/src/styles/m3/dialog.module.d.ts +2 -2
  160. package/build/src/styles/m3/dialog.module.js +2 -2
  161. package/build/src/styles/m3/dialog.module.js.map +1 -1
  162. package/build/src/styles/m3/tokens.d.ts.map +1 -1
  163. package/build/src/styles/m3/tokens.js +208 -182
  164. package/build/src/styles/m3/tokens.js.map +1 -1
  165. package/demo/elements/authorization/oauth-authorize.html +1 -1
  166. package/demo/elements/authorization/oauth-authorize.ts +1 -1
  167. package/demo/elements/environment/variables-editor.ts +2 -2
  168. package/demo/elements/http/url-editing.ts +3 -3
  169. package/demo/elements/project/request-editor.ts +4 -4
  170. package/demo/layout/index.ts +5 -5
  171. package/demo/md/buttons/button.html +121 -0
  172. package/demo/md/buttons/button.ts +246 -0
  173. package/demo/md/buttons/{index.html → group.html} +15 -2
  174. package/demo/md/buttons/group.ts +171 -0
  175. package/demo/md/checkbox/index.ts +1 -1
  176. package/demo/md/dialog/dialog.ts +8 -9
  177. package/demo/md/dropdown-list/index.ts +68 -71
  178. package/demo/md/icon-button/index.html +97 -7
  179. package/demo/md/icon-button/index.ts +97 -201
  180. package/demo/md/index.html +3 -1
  181. package/demo/md/inputs/input.html +39 -0
  182. package/demo/md/inputs/input.ts +204 -419
  183. package/demo/md/inputs/radio.ts +1 -1
  184. package/demo/md/inputs/switch.ts +1 -1
  185. package/demo/md/notification/snack.ts +5 -5
  186. package/demo/md/progress/progress.ts +4 -3
  187. package/package.json +2 -2
  188. package/src/core/ModalActivity.ts +6 -5
  189. package/src/core/ThemeManager.ts +5 -4
  190. package/src/demo/DemoPage.ts +2 -5
  191. package/src/elements/authorization/ui/CcAuthorization.ts +2 -2
  192. package/src/elements/authorization/ui/OAuth2Authorization.ts +11 -5
  193. package/src/elements/authorization/ui/OidcAuthorization.ts +10 -8
  194. package/src/elements/code/HttpSnippets.ts +5 -5
  195. package/src/elements/dialog/internals/ConfirmDelete.ts +5 -5
  196. package/src/elements/dialog/internals/Rename.ts +6 -5
  197. package/src/elements/environment/EnvironmentEditor.ts +5 -4
  198. package/src/elements/http/BodyEditor.ts +25 -20
  199. package/src/elements/http/BodyMultipartEditor.ts +3 -3
  200. package/src/elements/http/CertificateAdd.element.ts +6 -10
  201. package/src/elements/http/HeadersForm.ts +3 -3
  202. package/src/elements/http/HttpAssertions.element.ts +2 -2
  203. package/src/elements/http/HttpFlows.element.ts +6 -6
  204. package/src/elements/http/RequestEditor.ts +10 -11
  205. package/src/elements/http/UrlParamsForm.ts +4 -4
  206. package/src/elements/project/HttpProjectRequest.ts +3 -3
  207. package/src/elements/project/HttpProjectRequestHistory.ts +5 -6
  208. package/src/elements/project/ProjectRunReport.ts +7 -7
  209. package/src/elements/project/ProjectRunner.ts +4 -5
  210. package/src/md/button/internals/base.ts +299 -0
  211. package/src/md/button/internals/button.styles.ts +319 -0
  212. package/src/md/button/internals/button.ts +8 -234
  213. package/src/md/button/internals/group.styles.ts +102 -0
  214. package/src/md/button/internals/group.ts +121 -0
  215. package/src/md/button/ui-button-group.ts +15 -0
  216. package/src/md/button/ui-button.ts +18 -0
  217. package/src/md/dialog/internals/Dialog.ts +14 -9
  218. package/src/md/dropdown-list/internals/UiDropdownList.ts +1 -1
  219. package/src/md/icon-button/internals/IconButton.styles.ts +286 -0
  220. package/src/md/icon-button/internals/IconButton.ts +15 -139
  221. package/src/md/icon-button/ui-icon-button.ts +2 -3
  222. package/src/md/input/Input.ts +16 -11
  223. package/src/md/ripple/internals/ripple.styles.ts +8 -20
  224. package/src/md/ripple/internals/ripple.ts +21 -13
  225. package/src/md/snackbar/internals/Snackbar.ts +4 -2
  226. package/src/md/text-field/internals/common.styles.ts +11 -5
  227. package/src/md/text-field/internals/filled.styles.ts +7 -0
  228. package/src/md/text-field/internals/outlined.styles.ts +29 -9
  229. package/src/styles/m3/dialog.module.ts +2 -2
  230. package/src/styles/m3/native.css +270 -0
  231. package/src/styles/m3/tokens.css +208 -182
  232. package/src/styles/m3/tokens.ts +208 -182
  233. package/test/ui/button/UiButton.test.ts +51 -29
  234. package/test/ui/button/UiIconButton.test.ts +25 -19
  235. package/test/ui/dialog/UiDialog.test.ts +10 -10
  236. package/build/src/md/button/internals/button-styles.d.ts.map +0 -1
  237. package/build/src/md/button/internals/button-styles.js +0 -143
  238. package/build/src/md/button/internals/button-styles.js.map +0 -1
  239. package/build/src/md/button/internals/elevated-button.d.ts +0 -4
  240. package/build/src/md/button/internals/elevated-button.d.ts.map +0 -1
  241. package/build/src/md/button/internals/elevated-button.js +0 -4
  242. package/build/src/md/button/internals/elevated-button.js.map +0 -1
  243. package/build/src/md/button/internals/elevated-button.styles.d.ts +0 -3
  244. package/build/src/md/button/internals/elevated-button.styles.d.ts.map +0 -1
  245. package/build/src/md/button/internals/elevated-button.styles.js +0 -38
  246. package/build/src/md/button/internals/elevated-button.styles.js.map +0 -1
  247. package/build/src/md/button/internals/filled-button.d.ts +0 -4
  248. package/build/src/md/button/internals/filled-button.d.ts.map +0 -1
  249. package/build/src/md/button/internals/filled-button.js +0 -4
  250. package/build/src/md/button/internals/filled-button.js.map +0 -1
  251. package/build/src/md/button/internals/filled-button.styles.d.ts.map +0 -1
  252. package/build/src/md/button/internals/filled-button.styles.js +0 -30
  253. package/build/src/md/button/internals/filled-button.styles.js.map +0 -1
  254. package/build/src/md/button/internals/filled-tonal-button.d.ts +0 -4
  255. package/build/src/md/button/internals/filled-tonal-button.d.ts.map +0 -1
  256. package/build/src/md/button/internals/filled-tonal-button.js +0 -4
  257. package/build/src/md/button/internals/filled-tonal-button.js.map +0 -1
  258. package/build/src/md/button/internals/filled-tonal-button.styles.d.ts +0 -3
  259. package/build/src/md/button/internals/filled-tonal-button.styles.d.ts.map +0 -1
  260. package/build/src/md/button/internals/filled-tonal-button.styles.js +0 -30
  261. package/build/src/md/button/internals/filled-tonal-button.styles.js.map +0 -1
  262. package/build/src/md/button/internals/outlined-button.d.ts +0 -4
  263. package/build/src/md/button/internals/outlined-button.d.ts.map +0 -1
  264. package/build/src/md/button/internals/outlined-button.js +0 -4
  265. package/build/src/md/button/internals/outlined-button.js.map +0 -1
  266. package/build/src/md/button/internals/outlined-button.styles.d.ts +0 -3
  267. package/build/src/md/button/internals/outlined-button.styles.d.ts.map +0 -1
  268. package/build/src/md/button/internals/outlined-button.styles.js +0 -31
  269. package/build/src/md/button/internals/outlined-button.styles.js.map +0 -1
  270. package/build/src/md/button/internals/text-button.d.ts +0 -4
  271. package/build/src/md/button/internals/text-button.d.ts.map +0 -1
  272. package/build/src/md/button/internals/text-button.js +0 -4
  273. package/build/src/md/button/internals/text-button.js.map +0 -1
  274. package/build/src/md/button/internals/text-button.styles.d.ts.map +0 -1
  275. package/build/src/md/button/internals/text-button.styles.js +0 -30
  276. package/build/src/md/button/internals/text-button.styles.js.map +0 -1
  277. package/build/src/md/button/ui-elevated-button.d.ts +0 -14
  278. package/build/src/md/button/ui-elevated-button.d.ts.map +0 -1
  279. package/build/src/md/button/ui-elevated-button.js +0 -31
  280. package/build/src/md/button/ui-elevated-button.js.map +0 -1
  281. package/build/src/md/button/ui-filled-button.d.ts +0 -14
  282. package/build/src/md/button/ui-filled-button.d.ts.map +0 -1
  283. package/build/src/md/button/ui-filled-button.js +0 -31
  284. package/build/src/md/button/ui-filled-button.js.map +0 -1
  285. package/build/src/md/button/ui-filled-tonal-button.d.ts +0 -14
  286. package/build/src/md/button/ui-filled-tonal-button.d.ts.map +0 -1
  287. package/build/src/md/button/ui-filled-tonal-button.js +0 -31
  288. package/build/src/md/button/ui-filled-tonal-button.js.map +0 -1
  289. package/build/src/md/button/ui-outlined-button.d.ts +0 -14
  290. package/build/src/md/button/ui-outlined-button.d.ts.map +0 -1
  291. package/build/src/md/button/ui-outlined-button.js +0 -31
  292. package/build/src/md/button/ui-outlined-button.js.map +0 -1
  293. package/build/src/md/button/ui-text-button.d.ts +0 -14
  294. package/build/src/md/button/ui-text-button.d.ts.map +0 -1
  295. package/build/src/md/button/ui-text-button.js.map +0 -1
  296. package/build/src/md/icon-button/ui-filled-icon-button.d.ts +0 -11
  297. package/build/src/md/icon-button/ui-filled-icon-button.d.ts.map +0 -1
  298. package/build/src/md/icon-button/ui-filled-icon-button.js.map +0 -1
  299. package/build/src/md/icon-button/ui-filled-tonal-icon-button.d.ts +0 -11
  300. package/build/src/md/icon-button/ui-filled-tonal-icon-button.d.ts.map +0 -1
  301. package/build/src/md/icon-button/ui-filled-tonal-icon-button.js +0 -28
  302. package/build/src/md/icon-button/ui-filled-tonal-icon-button.js.map +0 -1
  303. package/build/src/md/icon-button/ui-outlined-icon-button.d.ts +0 -11
  304. package/build/src/md/icon-button/ui-outlined-icon-button.d.ts.map +0 -1
  305. package/build/src/md/icon-button/ui-outlined-icon-button.js +0 -28
  306. package/build/src/md/icon-button/ui-outlined-icon-button.js.map +0 -1
  307. package/demo/md/buttons/index.ts +0 -279
  308. package/src/md/button/internals/button-styles.ts +0 -143
  309. package/src/md/button/internals/elevated-button.styles.ts +0 -38
  310. package/src/md/button/internals/elevated-button.ts +0 -3
  311. package/src/md/button/internals/filled-button.styles.ts +0 -30
  312. package/src/md/button/internals/filled-button.ts +0 -3
  313. package/src/md/button/internals/filled-tonal-button.styles.ts +0 -30
  314. package/src/md/button/internals/filled-tonal-button.ts +0 -3
  315. package/src/md/button/internals/outlined-button.styles.ts +0 -31
  316. package/src/md/button/internals/outlined-button.ts +0 -3
  317. package/src/md/button/internals/text-button.styles.ts +0 -30
  318. package/src/md/button/internals/text-button.ts +0 -3
  319. package/src/md/button/ui-elevated-button.ts +0 -19
  320. package/src/md/button/ui-filled-button.ts +0 -19
  321. package/src/md/button/ui-filled-tonal-button.ts +0 -19
  322. package/src/md/button/ui-outlined-button.ts +0 -19
  323. package/src/md/button/ui-text-button.ts +0 -19
  324. package/src/md/icon-button/ui-filled-icon-button.ts +0 -16
  325. package/src/md/icon-button/ui-filled-tonal-icon-button.ts +0 -16
  326. package/src/md/icon-button/ui-outlined-icon-button.ts +0 -16
@@ -0,0 +1,102 @@
1
+ import { css } from 'lit';
2
+ /* Material Design 3 Expressive Button - CSS-Native Implementation */
3
+ export default css `
4
+ :host {
5
+ display: flex;
6
+
7
+ --_gap: 8px;
8
+ --_xs-radius: 16px;
9
+ --_s-radius: 20px;
10
+ --_m-radius: 28px;
11
+ --_l-radius: 48px;
12
+ --_xl-radius: 68px;
13
+
14
+ gap: var(--_gap);
15
+ }
16
+
17
+ :host([size='xs'][type='standard']) {
18
+ --_gap: 18px;
19
+ }
20
+ :host([size='xs'][type='connected']) {
21
+ --_gap: 2px;
22
+ }
23
+
24
+ :host([size='s'][type='standard']) {
25
+ --_gap: 12px;
26
+ }
27
+ :host([size='s'][type='connected']) {
28
+ --_gap: 2px;
29
+ }
30
+
31
+ :host([size='m'][type='standard']) {
32
+ --_gap: 8px;
33
+ }
34
+ :host([size='m'][type='connected']) {
35
+ --_gap: 2px;
36
+ }
37
+
38
+ :host([size='l'][type='standard']) {
39
+ --_gap: 8px;
40
+ }
41
+ :host([size='l'][type='connected']) {
42
+ --_gap: 2px;
43
+ }
44
+
45
+ :host([size='xl'][type='standard']) {
46
+ --_gap: 8px;
47
+ }
48
+ :host([size='xl'][type='connected']) {
49
+ --_gap: 2px;
50
+ }
51
+
52
+ :host([type='connected']) ::slotted(ui-button[size='xs']:first-child) {
53
+ --ui-button-shape-start-start: var(--_xs-radius);
54
+ --ui-button-shape-end-start: var(--_xs-radius);
55
+ }
56
+
57
+ :host([type='connected']) ::slotted(ui-button[size='s']:first-child) {
58
+ --ui-button-shape-start-start: var(--_s-radius);
59
+ --ui-button-shape-end-start: var(--_s-radius);
60
+ }
61
+
62
+ :host([type='connected']) ::slotted(ui-button[size='m']:first-child) {
63
+ --ui-button-shape-start-start: var(--_m-radius);
64
+ --ui-button-shape-end-start: var(--_m-radius);
65
+ }
66
+
67
+ :host([type='connected']) ::slotted(ui-button[size='l']:first-child) {
68
+ --ui-button-shape-start-start: var(--_l-radius);
69
+ --ui-button-shape-end-start: var(--_l-radius);
70
+ }
71
+
72
+ :host([type='connected']) ::slotted(ui-button[size='xl']:first-child) {
73
+ --ui-button-shape-start-start: var(--_xl-radius);
74
+ --ui-button-shape-end-start: var(--_xl-radius);
75
+ }
76
+
77
+ :host([type='connected']) ::slotted(ui-button[size='xs']:last-child) {
78
+ --ui-button-shape-start-end: var(--_xs-radius);
79
+ --ui-button-shape-end-end: var(--_xs-radius);
80
+ }
81
+
82
+ :host([type='connected']) ::slotted(ui-button[size='s']:last-child) {
83
+ --ui-button-shape-start-end: var(--_s-radius);
84
+ --ui-button-shape-end-end: var(--_s-radius);
85
+ }
86
+
87
+ :host([type='connected']) ::slotted(ui-button[size='m']:last-child) {
88
+ --ui-button-shape-start-end: var(--_m-radius);
89
+ --ui-button-shape-end-end: var(--_m-radius);
90
+ }
91
+
92
+ :host([type='connected']) ::slotted(ui-button[size='l']:last-child) {
93
+ --ui-button-shape-start-end: var(--_l-radius);
94
+ --ui-button-shape-end-end: var(--_l-radius);
95
+ }
96
+
97
+ :host([type='connected']) ::slotted(ui-button[size='xl']:last-child) {
98
+ --ui-button-shape-start-end: var(--_xl-radius);
99
+ --ui-button-shape-end-end: var(--_xl-radius);
100
+ }
101
+ `;
102
+ //# sourceMappingURL=group.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"group.styles.js","sourceRoot":"","sources":["../../../../../src/md/button/internals/group.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,qEAAqE;AACrE,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkGjB,CAAA","sourcesContent":["import { css } from 'lit'\n\n/* Material Design 3 Expressive Button - CSS-Native Implementation */\nexport default css`\n :host {\n display: flex;\n\n --_gap: 8px;\n --_xs-radius: 16px;\n --_s-radius: 20px;\n --_m-radius: 28px;\n --_l-radius: 48px;\n --_xl-radius: 68px;\n\n gap: var(--_gap);\n }\n\n :host([size='xs'][type='standard']) {\n --_gap: 18px;\n }\n :host([size='xs'][type='connected']) {\n --_gap: 2px;\n }\n\n :host([size='s'][type='standard']) {\n --_gap: 12px;\n }\n :host([size='s'][type='connected']) {\n --_gap: 2px;\n }\n\n :host([size='m'][type='standard']) {\n --_gap: 8px;\n }\n :host([size='m'][type='connected']) {\n --_gap: 2px;\n }\n\n :host([size='l'][type='standard']) {\n --_gap: 8px;\n }\n :host([size='l'][type='connected']) {\n --_gap: 2px;\n }\n\n :host([size='xl'][type='standard']) {\n --_gap: 8px;\n }\n :host([size='xl'][type='connected']) {\n --_gap: 2px;\n }\n\n :host([type='connected']) ::slotted(ui-button[size='xs']:first-child) {\n --ui-button-shape-start-start: var(--_xs-radius);\n --ui-button-shape-end-start: var(--_xs-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='s']:first-child) {\n --ui-button-shape-start-start: var(--_s-radius);\n --ui-button-shape-end-start: var(--_s-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='m']:first-child) {\n --ui-button-shape-start-start: var(--_m-radius);\n --ui-button-shape-end-start: var(--_m-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='l']:first-child) {\n --ui-button-shape-start-start: var(--_l-radius);\n --ui-button-shape-end-start: var(--_l-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='xl']:first-child) {\n --ui-button-shape-start-start: var(--_xl-radius);\n --ui-button-shape-end-start: var(--_xl-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='xs']:last-child) {\n --ui-button-shape-start-end: var(--_xs-radius);\n --ui-button-shape-end-end: var(--_xs-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='s']:last-child) {\n --ui-button-shape-start-end: var(--_s-radius);\n --ui-button-shape-end-end: var(--_s-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='m']:last-child) {\n --ui-button-shape-start-end: var(--_m-radius);\n --ui-button-shape-end-end: var(--_m-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='l']:last-child) {\n --ui-button-shape-start-end: var(--_l-radius);\n --ui-button-shape-end-end: var(--_l-radius);\n }\n\n :host([type='connected']) ::slotted(ui-button[size='xl']:last-child) {\n --ui-button-shape-start-end: var(--_xl-radius);\n --ui-button-shape-end-end: var(--_xl-radius);\n }\n`\n"]}
@@ -0,0 +1,11 @@
1
+ import type { CSSResultOrNative } from 'lit';
2
+ import Element from './internals/group.js';
3
+ export declare class UiButtonGroupElement extends Element {
4
+ static styles: CSSResultOrNative[];
5
+ }
6
+ declare global {
7
+ interface HTMLElementTagNameMap {
8
+ 'ui-button-group': UiButtonGroupElement;
9
+ }
10
+ }
11
+ //# sourceMappingURL=ui-button-group.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ui-button-group.d.ts","sourceRoot":"","sources":["../../../../src/md/button/ui-button-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAA;AAE5C,OAAO,OAAO,MAAM,sBAAsB,CAAA;AAG1C,qBACa,oBAAqB,SAAQ,OAAO;IAC/C,OAAgB,MAAM,EAAE,iBAAiB,EAAE,CAAW;CACvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,oBAAoB,CAAA;KACxC;CACF"}
@@ -1,28 +1,27 @@
1
1
  import { __esDecorate, __runInitializers } from "tslib";
2
2
  import { customElement } from 'lit/decorators.js';
3
- import Element from './internals/IconButton.js';
4
- import base from './internals/base.styles.js';
5
- import styles from './internals/filled.styles.js';
6
- let UiFilledIconButtonElement = (() => {
7
- let _classDecorators = [customElement('ui-filled-icon-button')];
3
+ import Element from './internals/group.js';
4
+ import styles from './internals/group.styles.js';
5
+ let UiButtonGroupElement = (() => {
6
+ let _classDecorators = [customElement('ui-button-group')];
8
7
  let _classDescriptor;
9
8
  let _classExtraInitializers = [];
10
9
  let _classThis;
11
10
  let _classSuper = Element;
12
- var UiFilledIconButtonElement = class extends _classSuper {
11
+ var UiButtonGroupElement = class extends _classSuper {
13
12
  static { _classThis = this; }
14
13
  static {
15
14
  const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
16
15
  __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
17
- UiFilledIconButtonElement = _classThis = _classDescriptor.value;
16
+ UiButtonGroupElement = _classThis = _classDescriptor.value;
18
17
  if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
19
18
  }
20
- static styles = [base, styles];
19
+ static styles = [styles];
21
20
  static {
22
21
  __runInitializers(_classThis, _classExtraInitializers);
23
22
  }
24
23
  };
25
- return UiFilledIconButtonElement = _classThis;
24
+ return UiButtonGroupElement = _classThis;
26
25
  })();
27
- export { UiFilledIconButtonElement };
28
- //# sourceMappingURL=ui-filled-icon-button.js.map
26
+ export { UiButtonGroupElement };
27
+ //# sourceMappingURL=ui-button-group.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ui-button-group.js","sourceRoot":"","sources":["../../../../src/md/button/ui-button-group.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,OAAO,MAAM,sBAAsB,CAAA;AAC1C,OAAO,MAAM,MAAM,6BAA6B,CAAA;IAGnC,oBAAoB;4BADhC,aAAa,CAAC,iBAAiB,CAAC;;;;sBACS,OAAO;oCAAf,SAAQ,WAAO;;;;YAAjD,6KAEC;;;;QADC,MAAM,CAAU,MAAM,GAAwB,CAAC,MAAM,CAAC,CAAA;;YAD3C,uDAAoB;;;;;SAApB,oBAAoB","sourcesContent":["import type { CSSResultOrNative } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport Element from './internals/group.js'\nimport styles from './internals/group.styles.js'\n\n@customElement('ui-button-group')\nexport class UiButtonGroupElement extends Element {\n static override styles: CSSResultOrNative[] = [styles]\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ui-button-group': UiButtonGroupElement\n }\n}\n"]}
@@ -0,0 +1,14 @@
1
+ import type { CSSResultOrNative } from 'lit';
2
+ import Element from './internals/button.js';
3
+ /**
4
+ * @attribute {string} form
5
+ */
6
+ export declare class UiButtonElement extends Element {
7
+ static styles: CSSResultOrNative[];
8
+ }
9
+ declare global {
10
+ interface HTMLElementTagNameMap {
11
+ 'ui-button': UiButtonElement;
12
+ }
13
+ }
14
+ //# sourceMappingURL=ui-button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ui-button.d.ts","sourceRoot":"","sources":["../../../../src/md/button/ui-button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAA;AAE5C,OAAO,OAAO,MAAM,uBAAuB,CAAA;AAG3C;;GAEG;AACH,qBACa,eAAgB,SAAQ,OAAO;IAC1C,OAAgB,MAAM,EAAE,iBAAiB,EAAE,CAAW;CACvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,eAAe,CAAA;KAC7B;CACF"}
@@ -1,31 +1,30 @@
1
1
  import { __esDecorate, __runInitializers } from "tslib";
2
2
  import { customElement } from 'lit/decorators.js';
3
- import Element from './internals/text-button.js';
4
- import base from './internals/button-styles.js';
5
- import styles from './internals/text-button.styles.js';
3
+ import Element from './internals/button.js';
4
+ import styles from './internals/button.styles.js';
6
5
  /**
7
6
  * @attribute {string} form
8
7
  */
9
- let UiTextButtonElement = (() => {
10
- let _classDecorators = [customElement('ui-text-button')];
8
+ let UiButtonElement = (() => {
9
+ let _classDecorators = [customElement('ui-button')];
11
10
  let _classDescriptor;
12
11
  let _classExtraInitializers = [];
13
12
  let _classThis;
14
13
  let _classSuper = Element;
15
- var UiTextButtonElement = class extends _classSuper {
14
+ var UiButtonElement = class extends _classSuper {
16
15
  static { _classThis = this; }
17
16
  static {
18
17
  const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
19
18
  __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
20
- UiTextButtonElement = _classThis = _classDescriptor.value;
19
+ UiButtonElement = _classThis = _classDescriptor.value;
21
20
  if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
22
21
  }
23
- static styles = [base, styles];
22
+ static styles = [styles];
24
23
  static {
25
24
  __runInitializers(_classThis, _classExtraInitializers);
26
25
  }
27
26
  };
28
- return UiTextButtonElement = _classThis;
27
+ return UiButtonElement = _classThis;
29
28
  })();
30
- export { UiTextButtonElement };
31
- //# sourceMappingURL=ui-text-button.js.map
29
+ export { UiButtonElement };
30
+ //# sourceMappingURL=ui-button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ui-button.js","sourceRoot":"","sources":["../../../../src/md/button/ui-button.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,OAAO,MAAM,uBAAuB,CAAA;AAC3C,OAAO,MAAM,MAAM,8BAA8B,CAAA;AAEjD;;GAEG;IAEU,eAAe;4BAD3B,aAAa,CAAC,WAAW,CAAC;;;;sBACU,OAAO;+BAAf,SAAQ,WAAO;;;;YAA5C,6KAEC;;;;QADC,MAAM,CAAU,MAAM,GAAwB,CAAC,MAAM,CAAC,CAAA;;YAD3C,uDAAe;;;;;SAAf,eAAe","sourcesContent":["import type { CSSResultOrNative } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport Element from './internals/button.js'\nimport styles from './internals/button.styles.js'\n\n/**\n * @attribute {string} form\n */\n@customElement('ui-button')\nexport class UiButtonElement extends Element {\n static override styles: CSSResultOrNative[] = [styles]\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ui-button': UiButtonElement\n }\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  import { type CSSResultOrNative, type PropertyValues, type TemplateResult } from 'lit';
2
2
  import { UiElement } from '../../UiElement.js';
3
3
  import type { TypedEvents } from '../../../core/types.js';
4
- import '../../button/ui-text-button.js';
4
+ import '../../button/ui-button.js';
5
5
  export interface UiDialogClosingReason {
6
6
  /**
7
7
  * Whether the dialog was cancelled by either activating the `dismiss` button
@@ -30,8 +30,8 @@ export type RenderFunction = () => TemplateResult;
30
30
  * closing reason detail.
31
31
  *
32
32
  * ```javascript
33
- * <ui-text-button value="dismiss">Cancel</ui-text-button>
34
- * <ui-text-button value="confirm">Take action</ui-text-button>
33
+ * <ui-button color="text" value="dismiss">Cancel</ui-button>
34
+ * <ui-button color="text" value="confirm">Take action</ui-button>
35
35
  * ```
36
36
  *
37
37
  * ```javascript
@@ -54,8 +54,8 @@ export type RenderFunction = () => TemplateResult;
54
54
  * <span slot="title">Delete photos?</span>
55
55
  * <p>This action will permanently remove the selected pictures from your account.</p>
56
56
  *
57
- * <ui-text-button slot="button" value="dismiss" type="text">Cancel</ui-text-button>
58
- * <ui-text-button slot="button" value="confirm" type="text">Confirm</ui-text-button>
57
+ * <ui-button color="text" slot="button" value="dismiss" type="text">Cancel</ui-button>
58
+ * <ui-button color="text" slot="button" value="confirm" type="text">Confirm</ui-button>
59
59
  * </ui-dialog>
60
60
  * ```
61
61
  *
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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"}
@@ -6,7 +6,7 @@ import { UiElement } from '../../UiElement.js';
6
6
  import { isDisabled, setDisabled } from '../../../lib/disabled.js';
7
7
  import { ifDefined } from 'lit/directives/if-defined.js';
8
8
  import { SyntheticSubmitEvent } from '../../../events/SyntheticSubmitEvent.js';
9
- import '../../button/ui-text-button.js';
9
+ import '../../button/ui-button.js';
10
10
  let UiDialog = (() => {
11
11
  let _classSuper = UiElement;
12
12
  let _instanceExtraInitializers = [];
@@ -419,8 +419,8 @@ let UiDialog = (() => {
419
419
  return nothing;
420
420
  }
421
421
  return html `
422
- <ui-text-button value="dismiss" class="internal-button" @click="${this.handleDismiss}"
423
- >${dismissLabel}</ui-text-button
422
+ <ui-button color="text" value="dismiss" class="internal-button" @click="${this.handleDismiss}"
423
+ >${dismissLabel}</ui-button
424
424
  >
425
425
  `;
426
426
  }
@@ -431,8 +431,13 @@ let UiDialog = (() => {
431
431
  }
432
432
  const type = useForm ? 'submit' : 'button';
433
433
  return html `
434
- <ui-text-button type="${type}" value="${confirmValue}" class="internal-button" @click="${this.handleConfirm}"
435
- >${confirmLabel}</ui-text-button
434
+ <ui-button
435
+ color="text"
436
+ type="${type}"
437
+ value="${confirmValue}"
438
+ class="internal-button"
439
+ @click="${this.handleConfirm}"
440
+ >${confirmLabel}</ui-button
436
441
  >
437
442
  `;
438
443
  }
@@ -450,8 +455,8 @@ let UiDialog = (() => {
450
455
  * closing reason detail.
451
456
  *
452
457
  * ```javascript
453
- * <ui-text-button value="dismiss">Cancel</ui-text-button>
454
- * <ui-text-button value="confirm">Take action</ui-text-button>
458
+ * <ui-button color="text" value="dismiss">Cancel</ui-button>
459
+ * <ui-button color="text" value="confirm">Take action</ui-button>
455
460
  * ```
456
461
  *
457
462
  * ```javascript
@@ -474,8 +479,8 @@ let UiDialog = (() => {
474
479
  * <span slot="title">Delete photos?</span>
475
480
  * <p>This action will permanently remove the selected pictures from your account.</p>
476
481
  *
477
- * <ui-text-button slot="button" value="dismiss" type="text">Cancel</ui-text-button>
478
- * <ui-text-button slot="button" value="confirm" type="text">Confirm</ui-text-button>
482
+ * <ui-button color="text" slot="button" value="dismiss" type="text">Cancel</ui-button>
483
+ * <ui-button color="text" slot="button" value="confirm" type="text">Confirm</ui-button>
479
484
  * </ui-dialog>
480
485
  * ```
481
486
  *
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { type CSSResultOrNative, html, nothing, type PropertyValues, type TemplateResult, adoptStyles } from 'lit'\nimport { property, query, queryAssignedElements, queryAssignedNodes, state } from 'lit/decorators.js'\nimport { type ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport type UiButton from '../../button/internals/button.js'\nimport type { TypedEvents } from '../../../core/types.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { SyntheticSubmitEvent } from '../../../events/SyntheticSubmitEvent.js'\nimport '../../button/ui-text-button.js'\n\nexport interface UiDialogClosingReason {\n /**\n * Whether the dialog was cancelled by either activating the `dismiss` button\n * or by pressing escape.\n */\n cancelled: boolean\n /**\n * This is used in cases when the dialog has more complex purpose.\n * This is the value expected from the dialog.\n */\n value?: unknown\n}\n\ninterface DialogEventMap {\n close: CustomEvent<UiDialogClosingReason>\n}\n\nexport type RenderFunction = () => TemplateResult\n\n/**\n * Styled dialog using a native `<dialog>` element under the hood.\n * Note, since native dialog renders in the top layer it is not necessary\n * to place the dialog in the `<body>`.\n *\n * **Using Buttons**\n *\n * The dialog automatically recognizes buttons with values `confirm` and `dismiss`\n * to close the dialog and dispatch the `close` event. The event has additional\n * closing reason detail.\n *\n * ```javascript\n * <ui-text-button value=\"dismiss\">Cancel</ui-text-button>\n * <ui-text-button value=\"confirm\">Take action</ui-text-button>\n * ```\n *\n * ```javascript\n * <button value=\"dismiss\">Cancel</button>\n * <button value=\"confirm\">Take action</button>\n * ```\n *\n * The detail object of the `close` event has the following properties:\n * - cancelled - Whether the dialog was cancelled by either activating the `dismiss` button or by pressing escape.\n *\n * The `close` event is only dispatched when the user interact with the dialog. Imperative control of the\n * dialog won't trigger the close button.\n *\n * ** Full example**\n *\n * ```javascript\n * <ui-dialog modal>\n * <ui-icon slot=\"icon\" icon=\"delete\"></ui-icon>\n *\n * <span slot=\"title\">Delete photos?</span>\n * <p>This action will permanently remove the selected pictures from your account.</p>\n *\n * <ui-text-button slot=\"button\" value=\"dismiss\" type=\"text\">Cancel</ui-text-button>\n * <ui-text-button slot=\"button\" value=\"confirm\" type=\"text\">Confirm</ui-text-button>\n * </ui-dialog>\n * ```\n *\n * @slot - The slot for the content of the dialog.\n * @slot icon - The slot to place the dialog icon\n * @slot title - The slot to place the dialog title. Do not put elements here, just the text.\n * @slot button - The slot to place the dialog buttons. Use the `confirm` or `dismiss`\n * buttons to automatically close the dialog.\n * @fires close - A non-bubbling, non-cancellable event with the `UiDialogClosingReason` as the detail.\n */\nexport default class UiDialog extends UiElement implements TypedEvents<DialogEventMap> {\n get disabled(): boolean {\n return isDisabled(this)\n }\n\n /**\n * When set, the button is a disabled state.\n * @attribute\n */\n @property({ reflect: true, type: Boolean })\n set disabled(value: boolean) {\n const old = isDisabled(this)\n setDisabled(this, value)\n this.requestUpdate('disabled', old)\n }\n\n /**\n * Opens the dialog as modal when toggling dialog's open state.\n *\n * Setting this value after the dialog was opened has no effect.\n *\n * @attribute\n */\n @property({ type: Boolean }) accessor modal = false\n\n /**\n * Toggles visibility of the dialog.\n * Note, the dialog is opened asynchronously after the update is performed.\n * @attribute\n */\n @property({ type: Boolean }) accessor open = false\n\n /**\n * Imperative access to create a dismiss button.\n * When set this will render a dismiss button at the end of the buttons line, before the `confirmLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor dismissLabel: string | undefined\n\n /**\n * Imperative access to create a confirm button.\n * When set this will render a confirm button at the end of the buttons line, after the `dismissLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor confirmLabel: string | undefined\n\n /**\n * Part of the imperative access to the element.\n * When set, it wraps the content in a `<form>` element.\n * When this is enabled the following will happen:\n * - The `confirm` button will get `type=\"submit\"`\n * - The form `method` attribute is set to `dialog`\n * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.\n * - The dialog will dispatch the same `submit` event as the form.\n * - When the `submit` event dispatched by the dialog gets cancelled, then:\n * - The original submit event also gets cancelled.\n * - The default confirm action is not invoked\n * - The dialog stays opened\n * - When the submit event is not cancelled, then:\n * - The default confirm action is invoked.\n * - The dialog is closed.\n */\n @property({ type: Boolean }) accessor useForm: boolean | undefined\n\n /**\n * Only when `confirmLabel` is set.\n * Defines the value associated with the button's name when it's submitted with the form data.\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#value}\n * @attribute\n */\n @property({ type: String }) accessor confirmValue: string | undefined\n\n /**\n * A reference to the underlying dialog element.\n */\n @query('dialog') accessor dialog!: HTMLDialogElement\n\n @state() protected accessor hasIcon = false\n\n @state() protected accessor hasTitle = false\n\n @state() protected accessor hasButton = false\n\n @queryAssignedElements({ flatten: true, slot: 'icon' }) protected accessor icons!: HTMLElement[]\n\n @queryAssignedNodes({ flatten: true, slot: 'title' }) protected accessor titles!: HTMLElement[]\n\n @queryAssignedElements({ flatten: true, slot: 'button' }) protected accessor buttons!: HTMLElement[]\n\n /**\n * To be set by a child class when closing the dialog.\n * This is passed to the close event.\n */\n dialogValue?: unknown\n\n #formId?: string\n\n get formId(): string | undefined {\n return this.#formId\n }\n\n @state() accessor #inject: TemplateResult | RenderFunction | undefined\n\n #pendingStyles?: CSSResultOrNative[]\n\n constructor() {\n super()\n\n this.addEventListener('click', this.handleClick)\n this.addEventListener('keydown', this.handleKeyDown)\n }\n\n /**\n * Allows to inject a template into the internals of the element.\n * This is helpful when working with imperative dialogs.\n * @param content The content to inject into the body.\n */\n inject(content?: TemplateResult | RenderFunction, styles?: CSSResultOrNative[]): void {\n this.#inject = content\n if (styles) {\n if (this.shadowRoot) {\n adoptStyles(this.shadowRoot, styles)\n } else {\n if (!this.#pendingStyles) {\n this.#pendingStyles = []\n }\n this.#pendingStyles.push(...styles)\n }\n }\n if (this.shadowRoot && styles) {\n adoptStyles(this.shadowRoot, styles)\n }\n }\n\n protected override firstUpdated(): void {\n const styles = this.#pendingStyles\n if (styles) {\n const root = this.shadowRoot as ShadowRoot\n const all = [...root.adoptedStyleSheets, ...styles]\n adoptStyles(this.shadowRoot as ShadowRoot, all)\n }\n }\n\n override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('useForm') && this.useForm && !this.#formId) {\n const r = (Math.random() + 1).toString(36).substring(7)\n this.#formId = `form-${r}`\n }\n }\n\n override handleClick(e: MouseEvent): void {\n super.handleClick(e)\n const path = e.composedPath()\n const { buttons } = this\n const button = path.find((i) => buttons.includes(i as HTMLElement)) as HTMLButtonElement | UiButton | undefined\n if (!button) {\n return\n }\n if (button.type === 'submit') {\n // Adds support for forms.\n // When a form's submit button is clicked we yield the flow control to the form.\n // This way the form can handle the submit event.\n e.preventDefault()\n return\n }\n const { value = '' } = button\n this.handleInteraction(value as 'dismiss' | 'confirm')\n }\n\n override handleKeyDown(e: KeyboardEvent): void {\n super.handleKeyDown(e)\n if (e.key === 'Escape') {\n this.handleInteraction('dismiss')\n }\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n if (changedProperties.has('open')) {\n this.#controlVisibility()\n }\n super.updated(changedProperties)\n }\n\n #controlVisibility(): void {\n const { dialog, modal, open } = this\n if (!dialog) {\n return\n }\n if (open) {\n if (modal) {\n dialog.showModal()\n } else {\n dialog.show()\n }\n } else {\n dialog.close()\n }\n }\n\n #handleSlotChange(): void {\n const { icons, titles, buttons } = this\n this.hasIcon = !!icons && !!icons.length\n this.hasTitle = !!titles && !!titles.length\n this.hasButton = !!buttons && !!buttons.length\n }\n\n protected handleInteraction(value: 'dismiss' | 'confirm'): void {\n if (!['dismiss', 'confirm'].includes(value)) {\n return\n }\n this.open = false\n const detail: UiDialogClosingReason = {\n cancelled: value === 'dismiss',\n }\n if (this.dialogValue !== undefined) {\n detail.value = this.dialogValue\n }\n this.dispatchEvent(\n new CustomEvent<UiDialogClosingReason>('close', {\n composed: true,\n detail,\n })\n )\n }\n\n protected handleDialogClose(): void {\n if (!this.open) {\n return\n }\n this.open = false\n this.handleInteraction('dismiss')\n }\n\n protected handleDismiss(): void {\n this.handleInteraction('dismiss')\n }\n\n protected handleConfirm(): void {\n if (!this.useForm) {\n this.handleInteraction('confirm')\n }\n }\n\n #handleSubmit(event: SubmitEvent): void {\n const form = event.target as HTMLFormElement\n const copy = new SyntheticSubmitEvent(event.type, form, {\n submitter: event.submitter,\n cancelable: true,\n bubbles: false,\n composed: false,\n })\n const dispatched = this.dispatchEvent(copy)\n if (dispatched) {\n this.handleInteraction('confirm')\n } else {\n event.preventDefault()\n }\n }\n\n override render(): TemplateResult {\n const { useForm } = this\n return html`\n <dialog @close=\"${this.handleDialogClose}\">\n <div class=\"container\">${useForm ? this.#renderFormContent() : this.renderContent()}</div>\n </dialog>\n `\n }\n\n protected renderContent(): TemplateResult[] | TemplateResult {\n return [this.renderIcon(), this.renderTitle(), this.renderBody(), this.renderButtons()]\n }\n\n #renderFormContent(): TemplateResult {\n return html`\n <form id=\"${ifDefined(this.formId)}\" method=\"dialog\" @submit=\"${this.#handleSubmit}\">\n ${this.renderContent()}\n </form>\n `\n }\n\n protected renderIcon(): TemplateResult {\n const classes: ClassInfo = {\n 'icon': true,\n 'with-icon': this.hasIcon,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"icon\">\n <slot name=\"icon\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderTitle(): TemplateResult {\n const classes: ClassInfo = {\n 'title': true,\n 'with-title': this.hasTitle,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"title\">\n <slot name=\"title\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderBody(): TemplateResult {\n let content = this.#inject\n if (typeof content === 'function') {\n content = content()\n }\n const injected = content || nothing\n return html` <div class=\"content\"><slot></slot>${injected}</div> `\n }\n\n protected renderButtons(): TemplateResult {\n const classes: ClassInfo = {\n 'buttons': true,\n 'with-buttons': this.hasButton || !!this.confirmLabel || !!this.dismissLabel,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"button\">\n <slot name=\"button\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n ${this.#renderDismissButton()} ${this.#renderConfirmButton()}\n </div>\n `\n }\n\n #renderDismissButton(): TemplateResult | typeof nothing {\n const { dismissLabel } = this\n if (!dismissLabel) {\n return nothing\n }\n return html`\n <ui-text-button value=\"dismiss\" class=\"internal-button\" @click=\"${this.handleDismiss}\"\n >${dismissLabel}</ui-text-button\n >\n `\n }\n\n #renderConfirmButton(): TemplateResult | typeof nothing {\n const { confirmLabel, confirmValue = 'confirm', useForm } = this\n if (!confirmLabel) {\n return nothing\n }\n const type = useForm ? 'submit' : 'button'\n return html`\n <ui-text-button type=\"${type}\" value=\"${confirmValue}\" class=\"internal-button\" @click=\"${this.handleConfirm}\"\n >${confirmLabel}</ui-text-button\n >\n `\n }\n}\n"]}
1
+ {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../../src/md/dialog/internals/Dialog.ts"],"names":[],"mappings":";AAAA,OAAO,EAA0B,IAAI,EAAE,OAAO,EAA4C,WAAW,EAAE,MAAM,KAAK,CAAA;AAClH,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACrG,OAAO,EAAkB,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAGlE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAA;AAC9E,OAAO,2BAA2B,CAAA;;sBAqEI,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAA1B,QAAS,SAAQ,WAAS;;;wCAS5C,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iCAc1C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gCAO3B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCAO3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAO1B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mCAkB1B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCAQ3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kCAK1B,KAAK,CAAC,QAAQ,CAAC;mCAEf,KAAK,EAAE;oCAEP,KAAK,EAAE;qCAEP,KAAK,EAAE;iCAEP,qBAAqB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kCAEtD,kBAAkB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mCAEpD,qBAAqB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;0CAcxD,KAAK,EAAE;YA3FR,0LAAI,QAAQ,wEAIX;YAS4B,oKAAS,KAAK,6BAAL,KAAK,qFAAQ;YAOtB,iKAAS,IAAI,6BAAJ,IAAI,mFAAQ;YAOtB,yLAAS,YAAY,6BAAZ,YAAY,mGAAoB;YAOzC,yLAAS,YAAY,6BAAZ,YAAY,mGAAoB;YAkBxC,0KAAS,OAAO,6BAAP,OAAO,yFAAqB;YAQtC,yLAAS,YAAY,6BAAZ,YAAY,mGAAoB;YAKpD,uKAAS,MAAM,6BAAN,MAAM,uFAAoB;YAE3C,0KAAmB,OAAO,6BAAP,OAAO,yFAAQ;YAElC,6KAAmB,QAAQ,6BAAR,QAAQ,2FAAQ;YAEnC,gLAAmB,SAAS,6BAAT,SAAS,6FAAQ;YAEW,oKAAmB,KAAK,6BAAL,KAAK,qFAAgB;YAE1C,uKAAmB,MAAM,6BAAN,MAAM,uFAAgB;YAErC,0KAAmB,OAAO,6BAAP,OAAO,yFAAgB;YAc3F,kDAAA,uBAAA,qDAA6D,mBAAA,EAA7D,uBAAA,2DAA6D,mBAAA,yHAApD,OAAO,yBAAP,OAAO,6BAAP,OAAO,uGAA6C;;;QApGtE,IAAI,QAAQ;YACV,OAAO,UAAU,CAAC,IAAI,CAAC,CAAA;QACzB,CAAC;QAED;;;WAGG;QAEH,IAAI,QAAQ,CAAC,KAAc;YACzB,MAAM,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,CAAA;YAC5B,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;YACxB,IAAI,CAAC,aAAa,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;QACrC,CAAC;QAS4B,2BAvBV,mDAAQ,+CAuBmB,KAAK;QAEnD;;;;WAIG;WANgD;QAPnD;;;;;;WAMG;QAC0B,IAAS,KAAK,2CAAQ;QAAtB,IAAS,KAAK,iDAAQ;QAOtB,yHAAgB,KAAK;QAElD;;;;WAIG;WAN+C;QALlD;;;;WAIG;QAC0B,IAAS,IAAI,0CAAQ;QAArB,IAAS,IAAI,gDAAQ;QAOtB,iJAAyC;QALrE;;;;WAIG;QACyB,IAAS,YAAY,kDAAoB;QAAzC,IAAS,YAAY,wDAAoB;QAOzC,yJAAyC;QALrE;;;;WAIG;QACyB,IAAS,YAAY,kDAAoB;QAAzC,IAAS,YAAY,wDAAoB;QAkBxC,+IAAqC;QAhBlE;;;;;;;;;;;;;;;WAeG;QAC0B,IAAS,OAAO,6CAAqB;QAArC,IAAS,OAAO,mDAAqB;QAQtC,oJAAyC;QANrE;;;;;WAKG;QACyB,IAAS,YAAY,kDAAoB;QAAzC,IAAS,YAAY,wDAAoB;QAKpD,6IAAmC;QAHpD;;WAEG;QACc,IAAS,MAAM,4CAAoB;QAAnC,IAAS,MAAM,kDAAoB;QAE3C,gIAA6B,KAAK,GAAA;QAAlC,IAAmB,OAAO,6CAAQ;QAAlC,IAAmB,OAAO,mDAAQ;QAElC,mIAA8B,KAAK,GAAA;QAAnC,IAAmB,QAAQ,8CAAQ;QAAnC,IAAmB,QAAQ,oDAAQ;QAEnC,sIAA+B,KAAK,GAAA;QAApC,IAAmB,SAAS,+CAAQ;QAApC,IAAmB,SAAS,qDAAQ;QAEW,wIAAwC;QAAxC,IAAmB,KAAK,2CAAgB;QAAxC,IAAmB,KAAK,iDAAgB;QAE1C,sIAAyC;QAAzC,IAAmB,MAAM,4CAAgB;QAAzC,IAAmB,MAAM,kDAAgB;QAErC,yIAA0C;QAA1C,IAAmB,OAAO,6CAAgB;QAA1C,IAAmB,OAAO,mDAAgB;QAEpG;;;WAGG;QACH,WAAW,uDAAU;QAErB,OAAO,CAAS;QAEhB,IAAI,MAAM;YACR,OAAO,IAAI,CAAC,OAAO,CAAA;QACrB,CAAC;QAEiB,wBAAO,iEAA6C;QAAtE,IAAkB,OAAO,wDAA6C;QAAtE,IAAkB,OAAO,oEAA6C;QAEtE,cAAc,8DAAsB;QAEpC;YACE,KAAK,EAAE,CAAA;YAEP,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAA;YAChD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAA;QACtD,CAAC;QAED;;;;WAIG;QACH,MAAM,CAAC,OAAyC,EAAE,MAA4B;YAC5E,IAAI,CAAC,OAAO,GAAG,OAAO,CAAA;YACtB,IAAI,MAAM,EAAE,CAAC;gBACX,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;oBACpB,WAAW,CAAC,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,CAAA;gBACtC,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;wBACzB,IAAI,CAAC,cAAc,GAAG,EAAE,CAAA;oBAC1B,CAAC;oBACD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,CAAA;gBACrC,CAAC;YACH,CAAC;YACD,IAAI,IAAI,CAAC,UAAU,IAAI,MAAM,EAAE,CAAC;gBAC9B,WAAW,CAAC,IAAI,CAAC,UAAU,EAAE,MAAM,CAAC,CAAA;YACtC,CAAC;QACH,CAAC;QAEkB,YAAY;YAC7B,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,CAAA;YAClC,IAAI,MAAM,EAAE,CAAC;gBACX,MAAM,IAAI,GAAG,IAAI,CAAC,UAAwB,CAAA;gBAC1C,MAAM,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC,kBAAkB,EAAE,GAAG,MAAM,CAAC,CAAA;gBACnD,WAAW,CAAC,IAAI,CAAC,UAAwB,EAAE,GAAG,CAAC,CAAA;YACjD,CAAC;QACH,CAAC;QAEQ,UAAU,CAAC,EAAwB;YAC1C,IAAI,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;gBACvD,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAA;gBACvD,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,EAAE,CAAA;YAC5B,CAAC;QACH,CAAC;QAEQ,WAAW,CAAC,CAAa;YAChC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAAA;YACpB,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE,CAAA;YAC7B,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;YACxB,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAgB,CAAC,CAA6C,CAAA;YAC/G,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAM;YACR,CAAC;YACD,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;gBAC7B,0BAA0B;gBAC1B,gFAAgF;gBAChF,iDAAiD;gBACjD,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,OAAM;YACR,CAAC;YACD,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,GAAG,MAAM,CAAA;YAC7B,IAAI,CAAC,iBAAiB,CAAC,KAA8B,CAAC,CAAA;QACxD,CAAC;QAEQ,aAAa,CAAC,CAAgB;YACrC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAA;YACtB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBACvB,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAA;YACnC,CAAC;QACH,CAAC;QAEQ,OAAO,CAAC,iBAAuC;YACtD,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;gBAClC,IAAI,CAAC,kBAAkB,EAAE,CAAA;YAC3B,CAAC;YACD,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAA;QAClC,CAAC;QAED,kBAAkB;YAChB,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;YACpC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAM;YACR,CAAC;YACD,IAAI,IAAI,EAAE,CAAC;gBACT,IAAI,KAAK,EAAE,CAAC;oBACV,MAAM,CAAC,SAAS,EAAE,CAAA;gBACpB,CAAC;qBAAM,CAAC;oBACN,MAAM,CAAC,IAAI,EAAE,CAAA;gBACf,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,MAAM,CAAC,KAAK,EAAE,CAAA;YAChB,CAAC;QACH,CAAC;QAED,iBAAiB;YACf,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;YACvC,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAA;YACxC,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAA;YAC3C,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,MAAM,CAAA;QAChD,CAAC;QAES,iBAAiB,CAAC,KAA4B;YACtD,IAAI,CAAC,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC5C,OAAM;YACR,CAAC;YACD,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;YACjB,MAAM,MAAM,GAA0B;gBACpC,SAAS,EAAE,KAAK,KAAK,SAAS;aAC/B,CAAA;YACD,IAAI,IAAI,CAAC,WAAW,KAAK,SAAS,EAAE,CAAC;gBACnC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAA;YACjC,CAAC;YACD,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAwB,OAAO,EAAE;gBAC9C,QAAQ,EAAE,IAAI;gBACd,MAAM;aACP,CAAC,CACH,CAAA;QACH,CAAC;QAES,iBAAiB;YACzB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;gBACf,OAAM;YACR,CAAC;YACD,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;YACjB,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAA;QACnC,CAAC;QAES,aAAa;YACrB,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAA;QACnC,CAAC;QAES,aAAa;YACrB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;gBAClB,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAA;YACnC,CAAC;QACH,CAAC;QAED,aAAa,CAAC,KAAkB;YAC9B,MAAM,IAAI,GAAG,KAAK,CAAC,MAAyB,CAAA;YAC5C,MAAM,IAAI,GAAG,IAAI,oBAAoB,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,EAAE;gBACtD,SAAS,EAAE,KAAK,CAAC,SAAS;gBAC1B,UAAU,EAAE,IAAI;gBAChB,OAAO,EAAE,KAAK;gBACd,QAAQ,EAAE,KAAK;aAChB,CAAC,CAAA;YACF,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;YAC3C,IAAI,UAAU,EAAE,CAAC;gBACf,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAA;YACnC,CAAC;iBAAM,CAAC;gBACN,KAAK,CAAC,cAAc,EAAE,CAAA;YACxB,CAAC;QACH,CAAC;QAEQ,MAAM;YACb,MAAM,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;YACxB,OAAO,IAAI,CAAA;wBACS,IAAI,CAAC,iBAAiB;iCACb,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE;;KAEtF,CAAA;QACH,CAAC;QAES,aAAa;YACrB,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC,CAAA;QACzF,CAAC;QAED,kBAAkB;YAChB,OAAO,IAAI,CAAA;kBACG,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,8BAA8B,IAAI,CAAC,aAAa;UAC9E,IAAI,CAAC,aAAa,EAAE;;KAEzB,CAAA;QACH,CAAC;QAES,UAAU;YAClB,MAAM,OAAO,GAAc;gBACzB,MAAM,EAAE,IAAI;gBACZ,WAAW,EAAE,IAAI,CAAC,OAAO;aAC1B,CAAA;YACD,OAAO,IAAI,CAAA;oBACK,QAAQ,CAAC,OAAO,CAAC;yCACI,IAAI,CAAC,iBAAiB;;KAE1D,CAAA;QACH,CAAC;QAES,WAAW;YACnB,MAAM,OAAO,GAAc;gBACzB,OAAO,EAAE,IAAI;gBACb,YAAY,EAAE,IAAI,CAAC,QAAQ;aAC5B,CAAA;YACD,OAAO,IAAI,CAAA;oBACK,QAAQ,CAAC,OAAO,CAAC;0CACK,IAAI,CAAC,iBAAiB;;KAE3D,CAAA;QACH,CAAC;QAES,UAAU;YAClB,IAAI,OAAO,GAAG,IAAI,CAAC,OAAO,CAAA;YAC1B,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE,CAAC;gBAClC,OAAO,GAAG,OAAO,EAAE,CAAA;YACrB,CAAC;YACD,MAAM,QAAQ,GAAG,OAAO,IAAI,OAAO,CAAA;YACnC,OAAO,IAAI,CAAA,sCAAsC,QAAQ,SAAS,CAAA;QACpE,CAAC;QAES,aAAa;YACrB,MAAM,OAAO,GAAc;gBACzB,SAAS,EAAE,IAAI;gBACf,cAAc,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,IAAI,CAAC,YAAY;aAC7E,CAAA;YACD,OAAO,IAAI,CAAA;oBACK,QAAQ,CAAC,OAAO,CAAC;2CACM,IAAI,CAAC,iBAAiB;UACvD,IAAI,CAAC,oBAAoB,EAAE,IAAI,IAAI,CAAC,oBAAoB,EAAE;;KAE/D,CAAA;QACH,CAAC;QAED,oBAAoB;YAClB,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAA;YAC7B,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,OAAO,OAAO,CAAA;YAChB,CAAC;YACD,OAAO,IAAI,CAAA;gFACiE,IAAI,CAAC,aAAa;WACvF,YAAY;;KAElB,CAAA;QACH,CAAC;QAED,oBAAoB;YAClB,MAAM,EAAE,YAAY,EAAE,YAAY,GAAG,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;YAChE,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,OAAO,OAAO,CAAA;YAChB,CAAC;YACD,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAA;YAC1C,OAAO,IAAI,CAAA;;;gBAGC,IAAI;iBACH,YAAY;;kBAEX,IAAI,CAAC,aAAa;WACzB,YAAY;;KAElB,CAAA;QACH,CAAC;;;AAlZH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,wBAmWC","sourcesContent":["import { type CSSResultOrNative, html, nothing, type PropertyValues, type TemplateResult, adoptStyles } from 'lit'\nimport { property, query, queryAssignedElements, queryAssignedNodes, state } from 'lit/decorators.js'\nimport { type ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { UiElement } from '../../UiElement.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport type UiButton from '../../button/internals/button.js'\nimport type { TypedEvents } from '../../../core/types.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { SyntheticSubmitEvent } from '../../../events/SyntheticSubmitEvent.js'\nimport '../../button/ui-button.js'\n\nexport interface UiDialogClosingReason {\n /**\n * Whether the dialog was cancelled by either activating the `dismiss` button\n * or by pressing escape.\n */\n cancelled: boolean\n /**\n * This is used in cases when the dialog has more complex purpose.\n * This is the value expected from the dialog.\n */\n value?: unknown\n}\n\ninterface DialogEventMap {\n close: CustomEvent<UiDialogClosingReason>\n}\n\nexport type RenderFunction = () => TemplateResult\n\n/**\n * Styled dialog using a native `<dialog>` element under the hood.\n * Note, since native dialog renders in the top layer it is not necessary\n * to place the dialog in the `<body>`.\n *\n * **Using Buttons**\n *\n * The dialog automatically recognizes buttons with values `confirm` and `dismiss`\n * to close the dialog and dispatch the `close` event. The event has additional\n * closing reason detail.\n *\n * ```javascript\n * <ui-button color=\"text\" value=\"dismiss\">Cancel</ui-button>\n * <ui-button color=\"text\" value=\"confirm\">Take action</ui-button>\n * ```\n *\n * ```javascript\n * <button value=\"dismiss\">Cancel</button>\n * <button value=\"confirm\">Take action</button>\n * ```\n *\n * The detail object of the `close` event has the following properties:\n * - cancelled - Whether the dialog was cancelled by either activating the `dismiss` button or by pressing escape.\n *\n * The `close` event is only dispatched when the user interact with the dialog. Imperative control of the\n * dialog won't trigger the close button.\n *\n * ** Full example**\n *\n * ```javascript\n * <ui-dialog modal>\n * <ui-icon slot=\"icon\" icon=\"delete\"></ui-icon>\n *\n * <span slot=\"title\">Delete photos?</span>\n * <p>This action will permanently remove the selected pictures from your account.</p>\n *\n * <ui-button color=\"text\" slot=\"button\" value=\"dismiss\" type=\"text\">Cancel</ui-button>\n * <ui-button color=\"text\" slot=\"button\" value=\"confirm\" type=\"text\">Confirm</ui-button>\n * </ui-dialog>\n * ```\n *\n * @slot - The slot for the content of the dialog.\n * @slot icon - The slot to place the dialog icon\n * @slot title - The slot to place the dialog title. Do not put elements here, just the text.\n * @slot button - The slot to place the dialog buttons. Use the `confirm` or `dismiss`\n * buttons to automatically close the dialog.\n * @fires close - A non-bubbling, non-cancellable event with the `UiDialogClosingReason` as the detail.\n */\nexport default class UiDialog extends UiElement implements TypedEvents<DialogEventMap> {\n get disabled(): boolean {\n return isDisabled(this)\n }\n\n /**\n * When set, the button is a disabled state.\n * @attribute\n */\n @property({ reflect: true, type: Boolean })\n set disabled(value: boolean) {\n const old = isDisabled(this)\n setDisabled(this, value)\n this.requestUpdate('disabled', old)\n }\n\n /**\n * Opens the dialog as modal when toggling dialog's open state.\n *\n * Setting this value after the dialog was opened has no effect.\n *\n * @attribute\n */\n @property({ type: Boolean }) accessor modal = false\n\n /**\n * Toggles visibility of the dialog.\n * Note, the dialog is opened asynchronously after the update is performed.\n * @attribute\n */\n @property({ type: Boolean }) accessor open = false\n\n /**\n * Imperative access to create a dismiss button.\n * When set this will render a dismiss button at the end of the buttons line, before the `confirmLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor dismissLabel: string | undefined\n\n /**\n * Imperative access to create a confirm button.\n * When set this will render a confirm button at the end of the buttons line, after the `dismissLabel` button.\n * @attribute\n */\n @property({ type: String }) accessor confirmLabel: string | undefined\n\n /**\n * Part of the imperative access to the element.\n * When set, it wraps the content in a `<form>` element.\n * When this is enabled the following will happen:\n * - The `confirm` button will get `type=\"submit\"`\n * - The form `method` attribute is set to `dialog`\n * - The form `id` attribute is set to a random string. You can get it from the `formId` getter.\n * - The dialog will dispatch the same `submit` event as the form.\n * - When the `submit` event dispatched by the dialog gets cancelled, then:\n * - The original submit event also gets cancelled.\n * - The default confirm action is not invoked\n * - The dialog stays opened\n * - When the submit event is not cancelled, then:\n * - The default confirm action is invoked.\n * - The dialog is closed.\n */\n @property({ type: Boolean }) accessor useForm: boolean | undefined\n\n /**\n * Only when `confirmLabel` is set.\n * Defines the value associated with the button's name when it's submitted with the form data.\n * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#value}\n * @attribute\n */\n @property({ type: String }) accessor confirmValue: string | undefined\n\n /**\n * A reference to the underlying dialog element.\n */\n @query('dialog') accessor dialog!: HTMLDialogElement\n\n @state() protected accessor hasIcon = false\n\n @state() protected accessor hasTitle = false\n\n @state() protected accessor hasButton = false\n\n @queryAssignedElements({ flatten: true, slot: 'icon' }) protected accessor icons!: HTMLElement[]\n\n @queryAssignedNodes({ flatten: true, slot: 'title' }) protected accessor titles!: HTMLElement[]\n\n @queryAssignedElements({ flatten: true, slot: 'button' }) protected accessor buttons!: HTMLElement[]\n\n /**\n * To be set by a child class when closing the dialog.\n * This is passed to the close event.\n */\n dialogValue?: unknown\n\n #formId?: string\n\n get formId(): string | undefined {\n return this.#formId\n }\n\n @state() accessor #inject: TemplateResult | RenderFunction | undefined\n\n #pendingStyles?: CSSResultOrNative[]\n\n constructor() {\n super()\n\n this.addEventListener('click', this.handleClick)\n this.addEventListener('keydown', this.handleKeyDown)\n }\n\n /**\n * Allows to inject a template into the internals of the element.\n * This is helpful when working with imperative dialogs.\n * @param content The content to inject into the body.\n */\n inject(content?: TemplateResult | RenderFunction, styles?: CSSResultOrNative[]): void {\n this.#inject = content\n if (styles) {\n if (this.shadowRoot) {\n adoptStyles(this.shadowRoot, styles)\n } else {\n if (!this.#pendingStyles) {\n this.#pendingStyles = []\n }\n this.#pendingStyles.push(...styles)\n }\n }\n if (this.shadowRoot && styles) {\n adoptStyles(this.shadowRoot, styles)\n }\n }\n\n protected override firstUpdated(): void {\n const styles = this.#pendingStyles\n if (styles) {\n const root = this.shadowRoot as ShadowRoot\n const all = [...root.adoptedStyleSheets, ...styles]\n adoptStyles(this.shadowRoot as ShadowRoot, all)\n }\n }\n\n override willUpdate(cp: PropertyValues<this>): void {\n if (cp.has('useForm') && this.useForm && !this.#formId) {\n const r = (Math.random() + 1).toString(36).substring(7)\n this.#formId = `form-${r}`\n }\n }\n\n override handleClick(e: MouseEvent): void {\n super.handleClick(e)\n const path = e.composedPath()\n const { buttons } = this\n const button = path.find((i) => buttons.includes(i as HTMLElement)) as HTMLButtonElement | UiButton | undefined\n if (!button) {\n return\n }\n if (button.type === 'submit') {\n // Adds support for forms.\n // When a form's submit button is clicked we yield the flow control to the form.\n // This way the form can handle the submit event.\n e.preventDefault()\n return\n }\n const { value = '' } = button\n this.handleInteraction(value as 'dismiss' | 'confirm')\n }\n\n override handleKeyDown(e: KeyboardEvent): void {\n super.handleKeyDown(e)\n if (e.key === 'Escape') {\n this.handleInteraction('dismiss')\n }\n }\n\n override updated(changedProperties: PropertyValues<this>): void {\n if (changedProperties.has('open')) {\n this.#controlVisibility()\n }\n super.updated(changedProperties)\n }\n\n #controlVisibility(): void {\n const { dialog, modal, open } = this\n if (!dialog) {\n return\n }\n if (open) {\n if (modal) {\n dialog.showModal()\n } else {\n dialog.show()\n }\n } else {\n dialog.close()\n }\n }\n\n #handleSlotChange(): void {\n const { icons, titles, buttons } = this\n this.hasIcon = !!icons && !!icons.length\n this.hasTitle = !!titles && !!titles.length\n this.hasButton = !!buttons && !!buttons.length\n }\n\n protected handleInteraction(value: 'dismiss' | 'confirm'): void {\n if (!['dismiss', 'confirm'].includes(value)) {\n return\n }\n this.open = false\n const detail: UiDialogClosingReason = {\n cancelled: value === 'dismiss',\n }\n if (this.dialogValue !== undefined) {\n detail.value = this.dialogValue\n }\n this.dispatchEvent(\n new CustomEvent<UiDialogClosingReason>('close', {\n composed: true,\n detail,\n })\n )\n }\n\n protected handleDialogClose(): void {\n if (!this.open) {\n return\n }\n this.open = false\n this.handleInteraction('dismiss')\n }\n\n protected handleDismiss(): void {\n this.handleInteraction('dismiss')\n }\n\n protected handleConfirm(): void {\n if (!this.useForm) {\n this.handleInteraction('confirm')\n }\n }\n\n #handleSubmit(event: SubmitEvent): void {\n const form = event.target as HTMLFormElement\n const copy = new SyntheticSubmitEvent(event.type, form, {\n submitter: event.submitter,\n cancelable: true,\n bubbles: false,\n composed: false,\n })\n const dispatched = this.dispatchEvent(copy)\n if (dispatched) {\n this.handleInteraction('confirm')\n } else {\n event.preventDefault()\n }\n }\n\n override render(): TemplateResult {\n const { useForm } = this\n return html`\n <dialog @close=\"${this.handleDialogClose}\">\n <div class=\"container\">${useForm ? this.#renderFormContent() : this.renderContent()}</div>\n </dialog>\n `\n }\n\n protected renderContent(): TemplateResult[] | TemplateResult {\n return [this.renderIcon(), this.renderTitle(), this.renderBody(), this.renderButtons()]\n }\n\n #renderFormContent(): TemplateResult {\n return html`\n <form id=\"${ifDefined(this.formId)}\" method=\"dialog\" @submit=\"${this.#handleSubmit}\">\n ${this.renderContent()}\n </form>\n `\n }\n\n protected renderIcon(): TemplateResult {\n const classes: ClassInfo = {\n 'icon': true,\n 'with-icon': this.hasIcon,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"icon\">\n <slot name=\"icon\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderTitle(): TemplateResult {\n const classes: ClassInfo = {\n 'title': true,\n 'with-title': this.hasTitle,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"title\">\n <slot name=\"title\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n </div>\n `\n }\n\n protected renderBody(): TemplateResult {\n let content = this.#inject\n if (typeof content === 'function') {\n content = content()\n }\n const injected = content || nothing\n return html` <div class=\"content\"><slot></slot>${injected}</div> `\n }\n\n protected renderButtons(): TemplateResult {\n const classes: ClassInfo = {\n 'buttons': true,\n 'with-buttons': this.hasButton || !!this.confirmLabel || !!this.dismissLabel,\n }\n return html`\n <div class=\"${classMap(classes)}\" part=\"button\">\n <slot name=\"button\" @slotchange=\"${this.#handleSlotChange}\"></slot>\n ${this.#renderDismissButton()} ${this.#renderConfirmButton()}\n </div>\n `\n }\n\n #renderDismissButton(): TemplateResult | typeof nothing {\n const { dismissLabel } = this\n if (!dismissLabel) {\n return nothing\n }\n return html`\n <ui-button color=\"text\" value=\"dismiss\" class=\"internal-button\" @click=\"${this.handleDismiss}\"\n >${dismissLabel}</ui-button\n >\n `\n }\n\n #renderConfirmButton(): TemplateResult | typeof nothing {\n const { confirmLabel, confirmValue = 'confirm', useForm } = this\n if (!confirmLabel) {\n return nothing\n }\n const type = useForm ? 'submit' : 'button'\n return html`\n <ui-button\n color=\"text\"\n type=\"${type}\"\n value=\"${confirmValue}\"\n class=\"internal-button\"\n @click=\"${this.handleConfirm}\"\n >${confirmLabel}</ui-button\n >\n `\n }\n}\n"]}
@@ -10,7 +10,7 @@ export interface UiDropdownListSelection {
10
10
  * Examples:
11
11
  *
12
12
  * <ui-dropdown-list>
13
- * <ui-filled-button>Click me</ui-filled-button>
13
+ * <ui-button color="filled">Click me</ui-button>
14
14
  * <ui-list slot="dropdown" role="menu">
15
15
  * <ui-list-item role="menuitem">Item 1</ui-list-item>
16
16
  * <ui-list-item role="menuitem">Item 2</ui-list-item>
@@ -492,7 +492,7 @@ let UiDropdownList = (() => {
492
492
  * Examples:
493
493
  *
494
494
  * <ui-dropdown-list>
495
- * <ui-filled-button>Click me</ui-filled-button>
495
+ * <ui-button color="filled">Click me</ui-button>
496
496
  * <ui-list slot="dropdown" role="menu">
497
497
  * <ui-list-item role="menuitem">Item 1</ui-list-item>
498
498
  * <ui-list-item role="menuitem">Item 2</ui-list-item>
@@ -1 +1 @@
1
- {"version":3,"file":"UiDropdownList.js","sourceRoot":"","sources":["../../../../../src/md/dropdown-list/internals/UiDropdownList.ts"],"names":[],"mappings":"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","sourcesContent":["import { randomString } from '@api-client/core/lib/math/Random.js'\nimport { html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { property, queryAssignedElements, state } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { positionOverlay, type HorizontalAlignment, type VerticalAlignment } from '../../../lib/ElementPositioning.js'\nimport * as ScrollHelper from '../../../lib/ScrollHelper.js'\n\nconst itemRole = ['menuitem', 'menuitemcheckbox', 'menuitemradio']\n\nexport interface UiDropdownListSelection {\n item: HTMLElement\n}\n\n/**\n * An overlay list rendered over a button.\n *\n * Examples:\n *\n * <ui-dropdown-list>\n * <ui-filled-button>Click me</ui-filled-button>\n * <ui-list slot=\"dropdown\" role=\"menu\">\n * <ui-list-item role=\"menuitem\">Item 1</ui-list-item>\n * <ui-list-item role=\"menuitem\">Item 2</ui-list-item>\n * </ui-list>\n * </ui-dropdown-list>\n *\n * @slot - The default slot for the dropdown trigger (button)\n * @slot dropdown - The slot for the list.\n * @fires select - Custom event with the selected item on the `detail.item` when the user selected an item.\n * When the event is cancelled then there's no side effects (closing the dropdown)\n * @fires dropdownopen - An event informing other dropdowns that this one was opened and other should close.\n * @fires open - An event dispatched when the open state change through a user interaction\n */\nexport default class UiDropdownList extends LitElement {\n @queryAssignedElements()\n protected accessor triggers!: HTMLElement[]\n\n @queryAssignedElements({ slot: 'dropdown' })\n protected accessor dropdowns!: HTMLElement[]\n\n @state() protected accessor triggerId = `ui-trigger-${randomString(4)}`\n\n @state() protected accessor menuId = `ui-menu-${randomString(4)}`\n\n /**\n * Whether the menu is opened.\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor open = false\n\n /**\n * The vertical (y-axis) alignment of the dropdown content.\n * - top\n * - bottom\n * - middle\n *\n * No value means the natural position according to the box model.\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor verticalAlign: VerticalAlignment | undefined\n\n /**\n * The horizontal (x-axis) alignment of the dropdown content.\n * - top\n * - bottom\n * - middle\n *\n * No value means the natural position according to the box model.\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor horizontalAlign: HorizontalAlignment | undefined\n\n /**\n * Affects the `horizontal` and `vertical` positioning so that the target element does not overlap with the anchor.\n * For example, when the `vertical` align is `top`, the top edge of the target will be rendered at the bottom\n * of the anchor down to the edge of the viewport.\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor noOverlap: boolean | undefined\n\n /**\n * When set it closes the opened list when registering a click outside the list.\n * @attribute\n */\n @property({ type: Boolean }) accessor closeOnOutsideClick: boolean | undefined\n\n /**\n * When set it makes the drop-down to match the width of the trigger.\n * Be careful as this may crop the content when the trigger is not wide enough.\n * @attribute\n */\n @property({ type: Boolean }) accessor matchTriggerWidth: boolean | undefined\n\n /**\n * When set it closes the drop-down when `tab` button is pressed.\n * This is not a default behavior since the drop-down content can have its own logic\n * related to tab index.\n */\n @property({ type: Boolean }) accessor closeOnTab: boolean | undefined\n\n /**\n * The first element located in the default slot.\n */\n protected get trigger(): HTMLElement | null {\n const { triggers } = this\n if (!triggers || !triggers.length) {\n return null\n }\n const [button] = triggers\n return button\n }\n\n /**\n * The first element located in the \"dropdown\" slot.\n */\n protected get dropdown(): HTMLElement | null {\n const { dropdowns } = this\n if (!dropdowns || !dropdowns.length) {\n return null\n }\n const [content] = dropdowns\n return content\n }\n\n @state() protected accessor overlayPositioning: StyleInfo | undefined\n\n constructor() {\n super()\n this.dropdownOpenHandler = this.dropdownOpenHandler.bind(this)\n this.scrollHandler = this.scrollHandler.bind(this)\n this.clickHandler = this.clickHandler.bind(this)\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n window.addEventListener('dropdownopen', this.dropdownOpenHandler)\n window.addEventListener('click', this.clickHandler, { capture: true })\n ScrollHelper.addListeners(this, this.scrollHandler)\n\n this.setAttribute('aria-haspopup', 'menu')\n this.setAttribute('aria-expanded', 'false')\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n window.removeEventListener('dropdownopen', this.dropdownOpenHandler)\n window.removeEventListener('click', this.clickHandler, { capture: true })\n ScrollHelper.removeListeners(this)\n }\n\n protected dropdownOpenHandler(e: Event): void {\n if (e.composedPath()[0] === this) {\n return\n }\n this.close()\n }\n\n protected override willUpdate(cp: PropertyValues<this>): void {\n super.willUpdate(cp)\n if ((cp.has('noOverlap') || cp.has('verticalAlign') || cp.has('horizontalAlign') || cp.has('open')) && this.open) {\n this.computePositioning()\n }\n }\n\n protected override updated(cp: PropertyValues<this>): void {\n super.updated(cp)\n if (cp.has('open')) {\n this.toggleOpened()\n this.updateExpanded()\n // this.manageTabindex()\n }\n }\n\n protected updateExpanded(): void {\n this.setAttribute('aria-expanded', String(this.open))\n }\n\n protected triggerChanged(): void {\n const { trigger } = this\n if (!trigger) {\n return\n }\n this.decorateTrigger(trigger)\n }\n\n protected dropdownChanged(): void {\n const { dropdown } = this\n if (!dropdown) {\n return\n }\n this.decorateDropdown(dropdown)\n }\n\n /**\n * Decorates the trigger with aria attributes.\n */\n protected decorateTrigger(button: HTMLElement): void {\n button.setAttribute('aria-controls', this.menuId)\n button.setAttribute('tabindex', '0')\n if (button.id) {\n this.triggerId = button.id\n } else {\n button.id = this.triggerId\n }\n }\n\n protected decorateDropdown(list: HTMLElement): void {\n if (!list.hasAttribute('role')) {\n list.setAttribute('role', 'menu')\n }\n if (!list.hasAttribute('aria-labelledby')) {\n list.setAttribute('aria-labelledby', this.triggerId)\n }\n list.setAttribute('tabindex', '-1')\n list.id = this.menuId\n }\n\n protected triggerClickHandler(): void {\n this.open = !this.open\n this.notifyOpen()\n }\n\n protected triggerKeyDownHandler(e: KeyboardEvent): void {\n if (['Enter', 'Space', 'ArrowDown', 'ArrowUp'].includes(e.code)) {\n e.preventDefault()\n this.open = true\n this.notifyOpen()\n }\n }\n\n protected contentKeyDownHandler(e: KeyboardEvent): void {\n if (e.defaultPrevented) {\n return\n }\n if (e.code === 'Escape') {\n this.close()\n } else if (e.code === 'Tab') {\n if (this.closeOnTab) {\n this.close()\n }\n } else if (['Enter', 'Space'].includes(e.code)) {\n this.activate(e)\n }\n }\n\n protected contentClickHandler(e: PointerEvent): void {\n this.activate(e)\n }\n\n close(): void {\n this.open = false\n this.notifyOpen()\n }\n\n protected contentCloseHandler(e: Event): void {\n e.stopPropagation()\n this.close()\n }\n\n /**\n * Since the container for the dropdown content is positioned as fixed\n * we need to position the dropdown according to the configured rules.\n */\n protected computePositioning(): void {\n const { trigger, dropdown } = this\n if (!trigger || !dropdown) {\n return\n }\n this.overlayPositioning = positionOverlay(dropdown, trigger, {\n horizontal: this.horizontalAlign,\n vertical: this.verticalAlign,\n noOverlap: this.noOverlap,\n constrain: true,\n constrainPaddingY: 20,\n matchAnchorWidth: this.matchTriggerWidth,\n })\n }\n\n protected scrollHandler(): void {\n if (this.open) {\n this.computePositioning()\n }\n }\n\n protected clickHandler(e: Event): void {\n if (!this.open || !this.closeOnOutsideClick) {\n return\n }\n const inside = e.composedPath().some((i) => i === this)\n if (inside) {\n return\n }\n this.close()\n }\n\n protected toggleOpened(): void {\n const { open } = this\n if (open) {\n this.handleOpened()\n } else {\n this.handleClosed()\n }\n }\n\n /**\n * When set, it is the last active child of the dropdown\n * before the tabindex was removed from it. It is used to restore focus\n * when the dropdown is re-opened.\n */\n lastActiveChild?: HTMLElement\n\n /**\n * When the list is closed, the tabindex of the dropdown is removed to prevent\n * it from being focused while invisible.\n */\n protected manageTabindex(): void {\n const { dropdown } = this\n if (!dropdown) {\n return\n }\n if (this.open) {\n if (this.lastActiveChild) {\n this.lastActiveChild.setAttribute('tabindex', '0')\n this.lastActiveChild.focus()\n this.lastActiveChild = undefined\n } else {\n // If no last active child, focus the dropdown itself\n dropdown.setAttribute('tabindex', '0')\n }\n } else {\n // const activeChild = dropdown.querySelector(':focus') || dropdown\n // this.lastActiveChild = activeChild as HTMLElement\n // activeChild.removeAttribute('tabindex')\n // this.trigger?.focus()\n }\n }\n\n protected handleOpened(): void {\n const { trigger, dropdown } = this\n if (trigger) {\n trigger.removeAttribute('tabindex')\n }\n if (this.lastActiveChild) {\n this.lastActiveChild.setAttribute('tabindex', '0')\n this.lastActiveChild.focus()\n this.lastActiveChild = undefined\n } else if (dropdown) {\n dropdown.setAttribute('tabindex', '0')\n dropdown.focus()\n }\n }\n\n protected handleClosed(): void {\n const { trigger, dropdown } = this\n if (trigger) {\n trigger.setAttribute('tabindex', '0')\n trigger.focus()\n }\n if (dropdown) {\n const activeChild = dropdown.querySelector('[tabindex=\"0\"]')\n if (activeChild) {\n this.lastActiveChild = activeChild as HTMLElement\n activeChild.removeAttribute('tabindex')\n }\n dropdown.removeAttribute('tabindex')\n }\n }\n\n protected activate(e: Event): void {\n if (e.defaultPrevented) {\n return\n }\n const path = e.composedPath()\n let item: HTMLElement | undefined\n while (!item) {\n const next = path.shift() as Element\n if (next === this) {\n break\n }\n if (next.nodeType !== Node.ELEMENT_NODE) {\n continue\n }\n if (itemRole.includes(next.getAttribute('role') || '')) {\n item = next as HTMLElement\n }\n }\n if (!item) {\n return\n }\n const event = new CustomEvent<UiDropdownListSelection>('select', {\n cancelable: true,\n // composed: true,\n detail: {\n item,\n },\n })\n this.dispatchEvent(event)\n if (event.defaultPrevented) {\n return\n }\n this.close()\n }\n\n protected notifyOpen(): void {\n this.dispatchEvent(new Event('open'))\n if (this.open) {\n this.dispatchEvent(\n new Event('dropdownopen', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n )\n }\n }\n\n protected override render(): TemplateResult {\n const classes: ClassInfo = {\n container: true,\n open: this.open,\n }\n\n return html` <div class=\"${classMap(classes)}\">${this.renderTrigger()} ${this.renderContent()}</div> `\n }\n\n protected renderTrigger(): TemplateResult {\n return html`\n <div class=\"trigger\" @click=\"${this.triggerClickHandler}\" @keydown=\"${this.triggerKeyDownHandler}\">\n <slot @slotchange=\"${this.triggerChanged}\"></slot>\n </div>\n `\n }\n\n protected renderContent(): TemplateResult {\n const contentStyles = this.overlayPositioning || {}\n return html`\n <div class=\"content\" style=\"${styleMap(contentStyles)}\">\n <slot\n name=\"dropdown\"\n @slotchange=\"${this.dropdownChanged}\"\n @keydown=\"${this.contentKeyDownHandler}\"\n @click=\"${this.contentClickHandler}\"\n @close=\"${this.contentCloseHandler}\"\n ></slot>\n </div>\n `\n }\n}\n"]}
1
+ {"version":3,"file":"UiDropdownList.js","sourceRoot":"","sources":["../../../../../src/md/dropdown-list/internals/UiDropdownList.ts"],"names":[],"mappings":"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","sourcesContent":["import { randomString } from '@api-client/core/lib/math/Random.js'\nimport { html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { property, queryAssignedElements, state } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { positionOverlay, type HorizontalAlignment, type VerticalAlignment } from '../../../lib/ElementPositioning.js'\nimport * as ScrollHelper from '../../../lib/ScrollHelper.js'\n\nconst itemRole = ['menuitem', 'menuitemcheckbox', 'menuitemradio']\n\nexport interface UiDropdownListSelection {\n item: HTMLElement\n}\n\n/**\n * An overlay list rendered over a button.\n *\n * Examples:\n *\n * <ui-dropdown-list>\n * <ui-button color=\"filled\">Click me</ui-button>\n * <ui-list slot=\"dropdown\" role=\"menu\">\n * <ui-list-item role=\"menuitem\">Item 1</ui-list-item>\n * <ui-list-item role=\"menuitem\">Item 2</ui-list-item>\n * </ui-list>\n * </ui-dropdown-list>\n *\n * @slot - The default slot for the dropdown trigger (button)\n * @slot dropdown - The slot for the list.\n * @fires select - Custom event with the selected item on the `detail.item` when the user selected an item.\n * When the event is cancelled then there's no side effects (closing the dropdown)\n * @fires dropdownopen - An event informing other dropdowns that this one was opened and other should close.\n * @fires open - An event dispatched when the open state change through a user interaction\n */\nexport default class UiDropdownList extends LitElement {\n @queryAssignedElements()\n protected accessor triggers!: HTMLElement[]\n\n @queryAssignedElements({ slot: 'dropdown' })\n protected accessor dropdowns!: HTMLElement[]\n\n @state() protected accessor triggerId = `ui-trigger-${randomString(4)}`\n\n @state() protected accessor menuId = `ui-menu-${randomString(4)}`\n\n /**\n * Whether the menu is opened.\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor open = false\n\n /**\n * The vertical (y-axis) alignment of the dropdown content.\n * - top\n * - bottom\n * - middle\n *\n * No value means the natural position according to the box model.\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor verticalAlign: VerticalAlignment | undefined\n\n /**\n * The horizontal (x-axis) alignment of the dropdown content.\n * - top\n * - bottom\n * - middle\n *\n * No value means the natural position according to the box model.\n * @attribute\n */\n @property({ type: String, reflect: true }) accessor horizontalAlign: HorizontalAlignment | undefined\n\n /**\n * Affects the `horizontal` and `vertical` positioning so that the target element does not overlap with the anchor.\n * For example, when the `vertical` align is `top`, the top edge of the target will be rendered at the bottom\n * of the anchor down to the edge of the viewport.\n * @attribute\n */\n @property({ type: Boolean, reflect: true }) accessor noOverlap: boolean | undefined\n\n /**\n * When set it closes the opened list when registering a click outside the list.\n * @attribute\n */\n @property({ type: Boolean }) accessor closeOnOutsideClick: boolean | undefined\n\n /**\n * When set it makes the drop-down to match the width of the trigger.\n * Be careful as this may crop the content when the trigger is not wide enough.\n * @attribute\n */\n @property({ type: Boolean }) accessor matchTriggerWidth: boolean | undefined\n\n /**\n * When set it closes the drop-down when `tab` button is pressed.\n * This is not a default behavior since the drop-down content can have its own logic\n * related to tab index.\n */\n @property({ type: Boolean }) accessor closeOnTab: boolean | undefined\n\n /**\n * The first element located in the default slot.\n */\n protected get trigger(): HTMLElement | null {\n const { triggers } = this\n if (!triggers || !triggers.length) {\n return null\n }\n const [button] = triggers\n return button\n }\n\n /**\n * The first element located in the \"dropdown\" slot.\n */\n protected get dropdown(): HTMLElement | null {\n const { dropdowns } = this\n if (!dropdowns || !dropdowns.length) {\n return null\n }\n const [content] = dropdowns\n return content\n }\n\n @state() protected accessor overlayPositioning: StyleInfo | undefined\n\n constructor() {\n super()\n this.dropdownOpenHandler = this.dropdownOpenHandler.bind(this)\n this.scrollHandler = this.scrollHandler.bind(this)\n this.clickHandler = this.clickHandler.bind(this)\n }\n\n override connectedCallback(): void {\n super.connectedCallback()\n window.addEventListener('dropdownopen', this.dropdownOpenHandler)\n window.addEventListener('click', this.clickHandler, { capture: true })\n ScrollHelper.addListeners(this, this.scrollHandler)\n\n this.setAttribute('aria-haspopup', 'menu')\n this.setAttribute('aria-expanded', 'false')\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback()\n window.removeEventListener('dropdownopen', this.dropdownOpenHandler)\n window.removeEventListener('click', this.clickHandler, { capture: true })\n ScrollHelper.removeListeners(this)\n }\n\n protected dropdownOpenHandler(e: Event): void {\n if (e.composedPath()[0] === this) {\n return\n }\n this.close()\n }\n\n protected override willUpdate(cp: PropertyValues<this>): void {\n super.willUpdate(cp)\n if ((cp.has('noOverlap') || cp.has('verticalAlign') || cp.has('horizontalAlign') || cp.has('open')) && this.open) {\n this.computePositioning()\n }\n }\n\n protected override updated(cp: PropertyValues<this>): void {\n super.updated(cp)\n if (cp.has('open')) {\n this.toggleOpened()\n this.updateExpanded()\n // this.manageTabindex()\n }\n }\n\n protected updateExpanded(): void {\n this.setAttribute('aria-expanded', String(this.open))\n }\n\n protected triggerChanged(): void {\n const { trigger } = this\n if (!trigger) {\n return\n }\n this.decorateTrigger(trigger)\n }\n\n protected dropdownChanged(): void {\n const { dropdown } = this\n if (!dropdown) {\n return\n }\n this.decorateDropdown(dropdown)\n }\n\n /**\n * Decorates the trigger with aria attributes.\n */\n protected decorateTrigger(button: HTMLElement): void {\n button.setAttribute('aria-controls', this.menuId)\n button.setAttribute('tabindex', '0')\n if (button.id) {\n this.triggerId = button.id\n } else {\n button.id = this.triggerId\n }\n }\n\n protected decorateDropdown(list: HTMLElement): void {\n if (!list.hasAttribute('role')) {\n list.setAttribute('role', 'menu')\n }\n if (!list.hasAttribute('aria-labelledby')) {\n list.setAttribute('aria-labelledby', this.triggerId)\n }\n list.setAttribute('tabindex', '-1')\n list.id = this.menuId\n }\n\n protected triggerClickHandler(): void {\n this.open = !this.open\n this.notifyOpen()\n }\n\n protected triggerKeyDownHandler(e: KeyboardEvent): void {\n if (['Enter', 'Space', 'ArrowDown', 'ArrowUp'].includes(e.code)) {\n e.preventDefault()\n this.open = true\n this.notifyOpen()\n }\n }\n\n protected contentKeyDownHandler(e: KeyboardEvent): void {\n if (e.defaultPrevented) {\n return\n }\n if (e.code === 'Escape') {\n this.close()\n } else if (e.code === 'Tab') {\n if (this.closeOnTab) {\n this.close()\n }\n } else if (['Enter', 'Space'].includes(e.code)) {\n this.activate(e)\n }\n }\n\n protected contentClickHandler(e: PointerEvent): void {\n this.activate(e)\n }\n\n close(): void {\n this.open = false\n this.notifyOpen()\n }\n\n protected contentCloseHandler(e: Event): void {\n e.stopPropagation()\n this.close()\n }\n\n /**\n * Since the container for the dropdown content is positioned as fixed\n * we need to position the dropdown according to the configured rules.\n */\n protected computePositioning(): void {\n const { trigger, dropdown } = this\n if (!trigger || !dropdown) {\n return\n }\n this.overlayPositioning = positionOverlay(dropdown, trigger, {\n horizontal: this.horizontalAlign,\n vertical: this.verticalAlign,\n noOverlap: this.noOverlap,\n constrain: true,\n constrainPaddingY: 20,\n matchAnchorWidth: this.matchTriggerWidth,\n })\n }\n\n protected scrollHandler(): void {\n if (this.open) {\n this.computePositioning()\n }\n }\n\n protected clickHandler(e: Event): void {\n if (!this.open || !this.closeOnOutsideClick) {\n return\n }\n const inside = e.composedPath().some((i) => i === this)\n if (inside) {\n return\n }\n this.close()\n }\n\n protected toggleOpened(): void {\n const { open } = this\n if (open) {\n this.handleOpened()\n } else {\n this.handleClosed()\n }\n }\n\n /**\n * When set, it is the last active child of the dropdown\n * before the tabindex was removed from it. It is used to restore focus\n * when the dropdown is re-opened.\n */\n lastActiveChild?: HTMLElement\n\n /**\n * When the list is closed, the tabindex of the dropdown is removed to prevent\n * it from being focused while invisible.\n */\n protected manageTabindex(): void {\n const { dropdown } = this\n if (!dropdown) {\n return\n }\n if (this.open) {\n if (this.lastActiveChild) {\n this.lastActiveChild.setAttribute('tabindex', '0')\n this.lastActiveChild.focus()\n this.lastActiveChild = undefined\n } else {\n // If no last active child, focus the dropdown itself\n dropdown.setAttribute('tabindex', '0')\n }\n } else {\n // const activeChild = dropdown.querySelector(':focus') || dropdown\n // this.lastActiveChild = activeChild as HTMLElement\n // activeChild.removeAttribute('tabindex')\n // this.trigger?.focus()\n }\n }\n\n protected handleOpened(): void {\n const { trigger, dropdown } = this\n if (trigger) {\n trigger.removeAttribute('tabindex')\n }\n if (this.lastActiveChild) {\n this.lastActiveChild.setAttribute('tabindex', '0')\n this.lastActiveChild.focus()\n this.lastActiveChild = undefined\n } else if (dropdown) {\n dropdown.setAttribute('tabindex', '0')\n dropdown.focus()\n }\n }\n\n protected handleClosed(): void {\n const { trigger, dropdown } = this\n if (trigger) {\n trigger.setAttribute('tabindex', '0')\n trigger.focus()\n }\n if (dropdown) {\n const activeChild = dropdown.querySelector('[tabindex=\"0\"]')\n if (activeChild) {\n this.lastActiveChild = activeChild as HTMLElement\n activeChild.removeAttribute('tabindex')\n }\n dropdown.removeAttribute('tabindex')\n }\n }\n\n protected activate(e: Event): void {\n if (e.defaultPrevented) {\n return\n }\n const path = e.composedPath()\n let item: HTMLElement | undefined\n while (!item) {\n const next = path.shift() as Element\n if (next === this) {\n break\n }\n if (next.nodeType !== Node.ELEMENT_NODE) {\n continue\n }\n if (itemRole.includes(next.getAttribute('role') || '')) {\n item = next as HTMLElement\n }\n }\n if (!item) {\n return\n }\n const event = new CustomEvent<UiDropdownListSelection>('select', {\n cancelable: true,\n // composed: true,\n detail: {\n item,\n },\n })\n this.dispatchEvent(event)\n if (event.defaultPrevented) {\n return\n }\n this.close()\n }\n\n protected notifyOpen(): void {\n this.dispatchEvent(new Event('open'))\n if (this.open) {\n this.dispatchEvent(\n new Event('dropdownopen', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n )\n }\n }\n\n protected override render(): TemplateResult {\n const classes: ClassInfo = {\n container: true,\n open: this.open,\n }\n\n return html` <div class=\"${classMap(classes)}\">${this.renderTrigger()} ${this.renderContent()}</div> `\n }\n\n protected renderTrigger(): TemplateResult {\n return html`\n <div class=\"trigger\" @click=\"${this.triggerClickHandler}\" @keydown=\"${this.triggerKeyDownHandler}\">\n <slot @slotchange=\"${this.triggerChanged}\"></slot>\n </div>\n `\n }\n\n protected renderContent(): TemplateResult {\n const contentStyles = this.overlayPositioning || {}\n return html`\n <div class=\"content\" style=\"${styleMap(contentStyles)}\">\n <slot\n name=\"dropdown\"\n @slotchange=\"${this.dropdownChanged}\"\n @keydown=\"${this.contentKeyDownHandler}\"\n @click=\"${this.contentClickHandler}\"\n @close=\"${this.contentCloseHandler}\"\n ></slot>\n </div>\n `\n }\n}\n"]}