ngwr 10.2.1 → 11.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (425) hide show
  1. package/README.md +39 -19
  2. package/anchor/styles/_index.scss +4 -4
  3. package/back-top/styles/_index.scss +6 -1
  4. package/blur-text/styles/_index.scss +13 -0
  5. package/button/styles/_index.scss +11 -6
  6. package/carousel/styles/_index.scss +13 -2
  7. package/cascader/styles/_index.scss +2 -2
  8. package/circular-text/styles/_index.scss +2 -0
  9. package/collapse/styles/_index.scss +1 -1
  10. package/color-picker/styles/_index.scss +6 -1
  11. package/compare/styles/_index.scss +1 -2
  12. package/context-menu/styles/_index.scss +6 -1
  13. package/descriptions/styles/_index.scss +2 -2
  14. package/dialog/styles/_index.scss +7 -0
  15. package/drawer/styles/_index.scss +20 -1
  16. package/dropdown/styles/_index.scss +19 -5
  17. package/empty/styles/_index.scss +10 -0
  18. package/fesm2022/ngwr-action-sheet.mjs +13 -3
  19. package/fesm2022/ngwr-action-sheet.mjs.map +1 -1
  20. package/fesm2022/ngwr-affix.mjs +40 -13
  21. package/fesm2022/ngwr-affix.mjs.map +1 -1
  22. package/fesm2022/ngwr-anchor.mjs +18 -6
  23. package/fesm2022/ngwr-anchor.mjs.map +1 -1
  24. package/fesm2022/ngwr-aurora.mjs +2 -2
  25. package/fesm2022/ngwr-aurora.mjs.map +1 -1
  26. package/fesm2022/ngwr-avatar.mjs +31 -7
  27. package/fesm2022/ngwr-avatar.mjs.map +1 -1
  28. package/fesm2022/ngwr-back-top.mjs +6 -2
  29. package/fesm2022/ngwr-back-top.mjs.map +1 -1
  30. package/fesm2022/ngwr-badge.mjs +1 -1
  31. package/fesm2022/ngwr-badge.mjs.map +1 -1
  32. package/fesm2022/ngwr-bar-chart.mjs +30 -9
  33. package/fesm2022/ngwr-bar-chart.mjs.map +1 -1
  34. package/fesm2022/ngwr-blur-text.mjs +2 -2
  35. package/fesm2022/ngwr-blur-text.mjs.map +1 -1
  36. package/fesm2022/ngwr-border-glow.mjs +2 -2
  37. package/fesm2022/ngwr-border-glow.mjs.map +1 -1
  38. package/fesm2022/ngwr-breadcrumbs.mjs +2 -2
  39. package/fesm2022/ngwr-breadcrumbs.mjs.map +1 -1
  40. package/fesm2022/ngwr-burger.mjs +9 -4
  41. package/fesm2022/ngwr-burger.mjs.map +1 -1
  42. package/fesm2022/ngwr-button-testing.mjs +96 -0
  43. package/fesm2022/ngwr-button-testing.mjs.map +1 -0
  44. package/fesm2022/ngwr-button.mjs +31 -14
  45. package/fesm2022/ngwr-button.mjs.map +1 -1
  46. package/fesm2022/ngwr-calendar-heatmap.mjs +40 -8
  47. package/fesm2022/ngwr-calendar-heatmap.mjs.map +1 -1
  48. package/fesm2022/ngwr-calendar.mjs +20 -1
  49. package/fesm2022/ngwr-calendar.mjs.map +1 -1
  50. package/fesm2022/ngwr-card.mjs +2 -2
  51. package/fesm2022/ngwr-card.mjs.map +1 -1
  52. package/fesm2022/ngwr-carousel-testing.mjs +377 -0
  53. package/fesm2022/ngwr-carousel-testing.mjs.map +1 -0
  54. package/fesm2022/ngwr-carousel.mjs +67 -13
  55. package/fesm2022/ngwr-carousel.mjs.map +1 -1
  56. package/fesm2022/ngwr-cascader-testing.mjs +534 -0
  57. package/fesm2022/ngwr-cascader-testing.mjs.map +1 -0
  58. package/fesm2022/ngwr-cascader.mjs +2 -2
  59. package/fesm2022/ngwr-cascader.mjs.map +1 -1
  60. package/fesm2022/ngwr-checkbox-testing.mjs +90 -0
  61. package/fesm2022/ngwr-checkbox-testing.mjs.map +1 -0
  62. package/fesm2022/ngwr-checkbox.mjs +9 -3
  63. package/fesm2022/ngwr-checkbox.mjs.map +1 -1
  64. package/fesm2022/ngwr-circular-text.mjs +2 -2
  65. package/fesm2022/ngwr-circular-text.mjs.map +1 -1
  66. package/fesm2022/ngwr-click-spark.mjs +2 -2
  67. package/fesm2022/ngwr-click-spark.mjs.map +1 -1
  68. package/fesm2022/ngwr-collapse-testing.mjs +368 -0
  69. package/fesm2022/ngwr-collapse-testing.mjs.map +1 -0
  70. package/fesm2022/ngwr-color-picker.mjs +134 -14
  71. package/fesm2022/ngwr-color-picker.mjs.map +1 -1
  72. package/fesm2022/ngwr-command-palette-testing.mjs +589 -0
  73. package/fesm2022/ngwr-command-palette-testing.mjs.map +1 -0
  74. package/fesm2022/ngwr-command-palette.mjs +58 -8
  75. package/fesm2022/ngwr-command-palette.mjs.map +1 -1
  76. package/fesm2022/ngwr-compare.mjs +103 -13
  77. package/fesm2022/ngwr-compare.mjs.map +1 -1
  78. package/fesm2022/ngwr-config.mjs +106 -0
  79. package/fesm2022/ngwr-config.mjs.map +1 -0
  80. package/fesm2022/ngwr-context-menu-testing.mjs +631 -0
  81. package/fesm2022/ngwr-context-menu-testing.mjs.map +1 -0
  82. package/fesm2022/ngwr-context-menu.mjs +94 -8
  83. package/fesm2022/ngwr-context-menu.mjs.map +1 -1
  84. package/fesm2022/ngwr-cookie.mjs +5 -1
  85. package/fesm2022/ngwr-cookie.mjs.map +1 -1
  86. package/fesm2022/ngwr-counter.mjs +11 -3
  87. package/fesm2022/ngwr-counter.mjs.map +1 -1
  88. package/fesm2022/ngwr-date-adapter-luxon.mjs +52 -4
  89. package/fesm2022/ngwr-date-adapter-luxon.mjs.map +1 -1
  90. package/fesm2022/ngwr-date-adapter.mjs +54 -8
  91. package/fesm2022/ngwr-date-adapter.mjs.map +1 -1
  92. package/fesm2022/ngwr-date-picker-testing.mjs +766 -0
  93. package/fesm2022/ngwr-date-picker-testing.mjs.map +1 -0
  94. package/fesm2022/ngwr-date-picker.mjs +73 -3
  95. package/fesm2022/ngwr-date-picker.mjs.map +1 -1
  96. package/fesm2022/ngwr-decrypt-text.mjs +27 -9
  97. package/fesm2022/ngwr-decrypt-text.mjs.map +1 -1
  98. package/fesm2022/ngwr-dialog-testing.mjs +89 -0
  99. package/fesm2022/ngwr-dialog-testing.mjs.map +1 -0
  100. package/fesm2022/ngwr-directives.mjs +36 -12
  101. package/fesm2022/ngwr-directives.mjs.map +1 -1
  102. package/fesm2022/ngwr-donut-chart.mjs +22 -5
  103. package/fesm2022/ngwr-donut-chart.mjs.map +1 -1
  104. package/fesm2022/ngwr-drag-drop.mjs +2 -2
  105. package/fesm2022/ngwr-drag-drop.mjs.map +1 -1
  106. package/fesm2022/ngwr-drawer-testing.mjs +250 -0
  107. package/fesm2022/ngwr-drawer-testing.mjs.map +1 -0
  108. package/fesm2022/ngwr-dropdown-testing.mjs +291 -0
  109. package/fesm2022/ngwr-dropdown-testing.mjs.map +1 -0
  110. package/fesm2022/ngwr-dropdown.mjs +10 -2
  111. package/fesm2022/ngwr-dropdown.mjs.map +1 -1
  112. package/fesm2022/ngwr-empty.mjs +24 -7
  113. package/fesm2022/ngwr-empty.mjs.map +1 -1
  114. package/fesm2022/ngwr-event-calendar.mjs +57 -10
  115. package/fesm2022/ngwr-event-calendar.mjs.map +1 -1
  116. package/fesm2022/ngwr-falling-text.mjs +2 -2
  117. package/fesm2022/ngwr-falling-text.mjs.map +1 -1
  118. package/fesm2022/ngwr-file-upload-testing.mjs +332 -0
  119. package/fesm2022/ngwr-file-upload-testing.mjs.map +1 -0
  120. package/fesm2022/ngwr-form-testing.mjs +451 -0
  121. package/fesm2022/ngwr-form-testing.mjs.map +1 -0
  122. package/fesm2022/ngwr-form.mjs +19 -3
  123. package/fesm2022/ngwr-form.mjs.map +1 -1
  124. package/fesm2022/ngwr-fuzzy-text.mjs +9 -2
  125. package/fesm2022/ngwr-fuzzy-text.mjs.map +1 -1
  126. package/fesm2022/ngwr-gauge.mjs +19 -5
  127. package/fesm2022/ngwr-gauge.mjs.map +1 -1
  128. package/fesm2022/ngwr-glitch-text.mjs +2 -2
  129. package/fesm2022/ngwr-glitch-text.mjs.map +1 -1
  130. package/fesm2022/ngwr-gradient-text.mjs +2 -2
  131. package/fesm2022/ngwr-gradient-text.mjs.map +1 -1
  132. package/fesm2022/ngwr-i18n-en.mjs +50 -0
  133. package/fesm2022/ngwr-i18n-en.mjs.map +1 -1
  134. package/fesm2022/ngwr-i18n-ru.mjs +48 -0
  135. package/fesm2022/ngwr-i18n-ru.mjs.map +1 -1
  136. package/fesm2022/ngwr-image-cropper.mjs +23 -0
  137. package/fesm2022/ngwr-image-cropper.mjs.map +1 -1
  138. package/fesm2022/ngwr-input-number-testing.mjs +306 -0
  139. package/fesm2022/ngwr-input-number-testing.mjs.map +1 -0
  140. package/fesm2022/ngwr-input-number.mjs +35 -3
  141. package/fesm2022/ngwr-input-number.mjs.map +1 -1
  142. package/fesm2022/ngwr-input-otp-testing.mjs +419 -0
  143. package/fesm2022/ngwr-input-otp-testing.mjs.map +1 -0
  144. package/fesm2022/ngwr-input-otp.mjs +36 -5
  145. package/fesm2022/ngwr-input-otp.mjs.map +1 -1
  146. package/fesm2022/ngwr-input-testing.mjs +102 -0
  147. package/fesm2022/ngwr-input-testing.mjs.map +1 -0
  148. package/fesm2022/ngwr-input.mjs +47 -10
  149. package/fesm2022/ngwr-input.mjs.map +1 -1
  150. package/fesm2022/ngwr-knob.mjs +44 -8
  151. package/fesm2022/ngwr-knob.mjs.map +1 -1
  152. package/fesm2022/ngwr-layout.mjs +21 -5
  153. package/fesm2022/ngwr-layout.mjs.map +1 -1
  154. package/fesm2022/ngwr-lightbox.mjs +33 -6
  155. package/fesm2022/ngwr-lightbox.mjs.map +1 -1
  156. package/fesm2022/ngwr-line-chart.mjs +17 -4
  157. package/fesm2022/ngwr-line-chart.mjs.map +1 -1
  158. package/fesm2022/ngwr-list.mjs +2 -2
  159. package/fesm2022/ngwr-list.mjs.map +1 -1
  160. package/fesm2022/ngwr-loading-bar.mjs +2 -2
  161. package/fesm2022/ngwr-loading-bar.mjs.map +1 -1
  162. package/fesm2022/ngwr-markdown-testing.mjs +516 -0
  163. package/fesm2022/ngwr-markdown-testing.mjs.map +1 -0
  164. package/fesm2022/ngwr-markdown.mjs +1492 -0
  165. package/fesm2022/ngwr-markdown.mjs.map +1 -0
  166. package/fesm2022/ngwr-marquee.mjs +17 -6
  167. package/fesm2022/ngwr-marquee.mjs.map +1 -1
  168. package/fesm2022/ngwr-mention-testing.mjs +513 -0
  169. package/fesm2022/ngwr-mention-testing.mjs.map +1 -0
  170. package/fesm2022/ngwr-mention.mjs +10 -1
  171. package/fesm2022/ngwr-mention.mjs.map +1 -1
  172. package/fesm2022/ngwr-meta.mjs +22 -7
  173. package/fesm2022/ngwr-meta.mjs.map +1 -1
  174. package/fesm2022/ngwr-meter-group.mjs +19 -5
  175. package/fesm2022/ngwr-meter-group.mjs.map +1 -1
  176. package/fesm2022/ngwr-overlay.mjs +41 -1
  177. package/fesm2022/ngwr-overlay.mjs.map +1 -1
  178. package/fesm2022/ngwr-pagination-testing.mjs +389 -0
  179. package/fesm2022/ngwr-pagination-testing.mjs.map +1 -0
  180. package/fesm2022/ngwr-pagination.mjs +14 -2
  181. package/fesm2022/ngwr-pagination.mjs.map +1 -1
  182. package/fesm2022/ngwr-popconfirm-testing.mjs +309 -0
  183. package/fesm2022/ngwr-popconfirm-testing.mjs.map +1 -0
  184. package/fesm2022/ngwr-popconfirm.mjs +95 -17
  185. package/fesm2022/ngwr-popconfirm.mjs.map +1 -1
  186. package/fesm2022/ngwr-popover-testing.mjs +316 -0
  187. package/fesm2022/ngwr-popover-testing.mjs.map +1 -0
  188. package/fesm2022/ngwr-popover.mjs +21 -3
  189. package/fesm2022/ngwr-popover.mjs.map +1 -1
  190. package/fesm2022/ngwr-pull-to-refresh.mjs +17 -2
  191. package/fesm2022/ngwr-pull-to-refresh.mjs.map +1 -1
  192. package/fesm2022/ngwr-qr.mjs +13 -3
  193. package/fesm2022/ngwr-qr.mjs.map +1 -1
  194. package/fesm2022/ngwr-radio-testing.mjs +392 -0
  195. package/fesm2022/ngwr-radio-testing.mjs.map +1 -0
  196. package/fesm2022/ngwr-radio.mjs +10 -3
  197. package/fesm2022/ngwr-radio.mjs.map +1 -1
  198. package/fesm2022/ngwr-rating-testing.mjs +384 -0
  199. package/fesm2022/ngwr-rating-testing.mjs.map +1 -0
  200. package/fesm2022/ngwr-rating.mjs +37 -2
  201. package/fesm2022/ngwr-rating.mjs.map +1 -1
  202. package/fesm2022/ngwr-segmented-testing.mjs +512 -0
  203. package/fesm2022/ngwr-segmented-testing.mjs.map +1 -0
  204. package/fesm2022/ngwr-select-testing.mjs +268 -0
  205. package/fesm2022/ngwr-select-testing.mjs.map +1 -0
  206. package/fesm2022/ngwr-select.mjs +87 -16
  207. package/fesm2022/ngwr-select.mjs.map +1 -1
  208. package/fesm2022/ngwr-shiny-text.mjs +2 -2
  209. package/fesm2022/ngwr-shiny-text.mjs.map +1 -1
  210. package/fesm2022/ngwr-sidebar.mjs +65 -12
  211. package/fesm2022/ngwr-sidebar.mjs.map +1 -1
  212. package/fesm2022/ngwr-slider-testing.mjs +478 -0
  213. package/fesm2022/ngwr-slider-testing.mjs.map +1 -0
  214. package/fesm2022/ngwr-slider.mjs +57 -13
  215. package/fesm2022/ngwr-slider.mjs.map +1 -1
  216. package/fesm2022/ngwr-sparkline.mjs +26 -6
  217. package/fesm2022/ngwr-sparkline.mjs.map +1 -1
  218. package/fesm2022/ngwr-speed-dial.mjs +37 -4
  219. package/fesm2022/ngwr-speed-dial.mjs.map +1 -1
  220. package/fesm2022/ngwr-spinner.mjs +12 -3
  221. package/fesm2022/ngwr-spinner.mjs.map +1 -1
  222. package/fesm2022/ngwr-splash-cursor.mjs +2 -2
  223. package/fesm2022/ngwr-splash-cursor.mjs.map +1 -1
  224. package/fesm2022/ngwr-split-text.mjs +2 -2
  225. package/fesm2022/ngwr-split-text.mjs.map +1 -1
  226. package/fesm2022/ngwr-splitter.mjs +70 -9
  227. package/fesm2022/ngwr-splitter.mjs.map +1 -1
  228. package/fesm2022/ngwr-spotlight-card.mjs +2 -2
  229. package/fesm2022/ngwr-spotlight-card.mjs.map +1 -1
  230. package/fesm2022/ngwr-star-border.mjs +2 -2
  231. package/fesm2022/ngwr-star-border.mjs.map +1 -1
  232. package/fesm2022/ngwr-statistic.mjs +24 -7
  233. package/fesm2022/ngwr-statistic.mjs.map +1 -1
  234. package/fesm2022/ngwr-stepper-testing.mjs +477 -0
  235. package/fesm2022/ngwr-stepper-testing.mjs.map +1 -0
  236. package/fesm2022/ngwr-switch-testing.mjs +77 -0
  237. package/fesm2022/ngwr-switch-testing.mjs.map +1 -0
  238. package/fesm2022/ngwr-switch.mjs +9 -3
  239. package/fesm2022/ngwr-switch.mjs.map +1 -1
  240. package/fesm2022/ngwr-table-testing.mjs +580 -0
  241. package/fesm2022/ngwr-table-testing.mjs.map +1 -0
  242. package/fesm2022/ngwr-table.mjs +87 -14
  243. package/fesm2022/ngwr-table.mjs.map +1 -1
  244. package/fesm2022/ngwr-tabs-testing.mjs +617 -0
  245. package/fesm2022/ngwr-tabs-testing.mjs.map +1 -0
  246. package/fesm2022/ngwr-tabs.mjs +38 -6
  247. package/fesm2022/ngwr-tabs.mjs.map +1 -1
  248. package/fesm2022/ngwr-textarea-testing.mjs +238 -0
  249. package/fesm2022/ngwr-textarea-testing.mjs.map +1 -0
  250. package/fesm2022/ngwr-textarea.mjs +32 -4
  251. package/fesm2022/ngwr-textarea.mjs.map +1 -1
  252. package/fesm2022/ngwr-tilt-card.mjs +2 -2
  253. package/fesm2022/ngwr-tilt-card.mjs.map +1 -1
  254. package/fesm2022/ngwr-toast-testing.mjs +101 -0
  255. package/fesm2022/ngwr-toast-testing.mjs.map +1 -0
  256. package/fesm2022/ngwr-toast.mjs +2 -2
  257. package/fesm2022/ngwr-toast.mjs.map +1 -1
  258. package/fesm2022/ngwr-tour.mjs +61 -9
  259. package/fesm2022/ngwr-tour.mjs.map +1 -1
  260. package/fesm2022/ngwr-transfer-testing.mjs +538 -0
  261. package/fesm2022/ngwr-transfer-testing.mjs.map +1 -0
  262. package/fesm2022/ngwr-transfer.mjs +45 -14
  263. package/fesm2022/ngwr-transfer.mjs.map +1 -1
  264. package/fesm2022/ngwr-tree-testing.mjs +734 -0
  265. package/fesm2022/ngwr-tree-testing.mjs.map +1 -0
  266. package/fesm2022/ngwr-tree.mjs +73 -7
  267. package/fesm2022/ngwr-tree.mjs.map +1 -1
  268. package/fesm2022/ngwr-typewriter.mjs +5 -3
  269. package/fesm2022/ngwr-typewriter.mjs.map +1 -1
  270. package/fesm2022/ngwr-version.mjs +1 -1
  271. package/fesm2022/ngwr-version.mjs.map +1 -1
  272. package/fesm2022/ngwr-virtual-scroll.mjs +31 -5
  273. package/fesm2022/ngwr-virtual-scroll.mjs.map +1 -1
  274. package/fesm2022/ngwr-waves.mjs +3 -3
  275. package/fesm2022/ngwr-waves.mjs.map +1 -1
  276. package/fesm2022/ngwr-window.mjs +8 -0
  277. package/fesm2022/ngwr-window.mjs.map +1 -1
  278. package/gauge/styles/_index.scss +1 -1
  279. package/glitch-text/styles/_index.scss +4 -0
  280. package/i18n/en.json +48 -0
  281. package/i18n/ru.json +48 -0
  282. package/image-cropper/styles/_index.scss +13 -1
  283. package/input/styles/_index.scss +2 -2
  284. package/input-number/styles/_index.scss +7 -2
  285. package/knob/styles/_index.scss +8 -1
  286. package/layout/styles/_index.scss +3 -3
  287. package/lightbox/styles/_index.scss +10 -2
  288. package/line-chart/styles/_index.scss +6 -0
  289. package/llms-full.txt +151 -4
  290. package/llms.txt +57 -8
  291. package/loading-bar/styles/_index.scss +1 -2
  292. package/markdown/styles/_index.scss +296 -0
  293. package/marquee/styles/_index.scss +12 -0
  294. package/mcp/api.js +512 -0
  295. package/mcp/catalog.js +157 -0
  296. package/mcp/server.js +273 -0
  297. package/mcp/tools.js +366 -0
  298. package/meter-group/styles/_index.scss +1 -1
  299. package/package.json +186 -35
  300. package/pagination/styles/_index.scss +6 -6
  301. package/popover/styles/_index.scss +37 -5
  302. package/rating/styles/_index.scss +10 -0
  303. package/schematics/use/symbol-map.json +2 -0
  304. package/segmented/styles/_index.scss +7 -0
  305. package/select/styles/_index.scss +29 -9
  306. package/sidebar/styles/_index.scss +30 -5
  307. package/slider/styles/_index.scss +15 -0
  308. package/speed-dial/styles/_index.scss +20 -0
  309. package/split-text/styles/_index.scss +13 -0
  310. package/star-border/styles/_index.scss +2 -0
  311. package/stepper/styles/_index.scss +1 -1
  312. package/styles/_grid.scss +4 -4
  313. package/styles.scss +1 -0
  314. package/switch/styles/_index.scss +5 -3
  315. package/table/styles/_index.scss +22 -11
  316. package/tabs/styles/_index.scss +11 -1
  317. package/textarea/styles/_index.scss +5 -0
  318. package/theme/styles/_colors.scss +29 -13
  319. package/theme/styles/_dark.scss +11 -3
  320. package/theme/styles/_mixins.scss +3 -0
  321. package/timeline/styles/_index.scss +2 -2
  322. package/toast/styles/_index.scss +17 -8
  323. package/toolbar/styles/_index.scss +3 -3
  324. package/tour/styles/_index.scss +7 -1
  325. package/tree/styles/_index.scss +5 -3
  326. package/types/ngwr-action-sheet.d.ts +9 -1
  327. package/types/ngwr-affix.d.ts +7 -1
  328. package/types/ngwr-anchor.d.ts +8 -1
  329. package/types/ngwr-avatar.d.ts +13 -3
  330. package/types/ngwr-bar-chart.d.ts +16 -0
  331. package/types/ngwr-burger.d.ts +6 -2
  332. package/types/ngwr-button-testing.d.ts +85 -0
  333. package/types/ngwr-button.d.ts +26 -10
  334. package/types/ngwr-calendar-heatmap.d.ts +16 -2
  335. package/types/ngwr-calendar.d.ts +10 -0
  336. package/types/ngwr-carousel-testing.d.ts +257 -0
  337. package/types/ngwr-carousel.d.ts +20 -4
  338. package/types/ngwr-cascader-testing.d.ts +392 -0
  339. package/types/ngwr-checkbox-testing.d.ts +77 -0
  340. package/types/ngwr-checkbox.d.ts +7 -2
  341. package/types/ngwr-collapse-testing.d.ts +290 -0
  342. package/types/ngwr-color-picker.d.ts +20 -11
  343. package/types/ngwr-command-palette-testing.d.ts +437 -0
  344. package/types/ngwr-command-palette.d.ts +25 -2
  345. package/types/ngwr-compare.d.ts +50 -2
  346. package/types/ngwr-config.d.ts +176 -0
  347. package/types/ngwr-context-menu-testing.d.ts +401 -0
  348. package/types/ngwr-context-menu.d.ts +65 -17
  349. package/types/ngwr-counter.d.ts +6 -1
  350. package/types/ngwr-date-adapter-luxon.d.ts +26 -0
  351. package/types/ngwr-date-picker-testing.d.ts +518 -0
  352. package/types/ngwr-date-picker.d.ts +4 -0
  353. package/types/ngwr-dialog-testing.d.ts +79 -0
  354. package/types/ngwr-directives.d.ts +10 -1
  355. package/types/ngwr-donut-chart.d.ts +8 -1
  356. package/types/ngwr-drawer-testing.d.ts +196 -0
  357. package/types/ngwr-dropdown-testing.d.ts +202 -0
  358. package/types/ngwr-dropdown.d.ts +7 -1
  359. package/types/ngwr-empty.d.ts +19 -4
  360. package/types/ngwr-event-calendar.d.ts +26 -1
  361. package/types/ngwr-file-upload-testing.d.ts +194 -0
  362. package/types/ngwr-form-testing.d.ts +379 -0
  363. package/types/ngwr-form.d.ts +17 -0
  364. package/types/ngwr-gauge.d.ts +13 -1
  365. package/types/ngwr-image-cropper.d.ts +10 -0
  366. package/types/ngwr-input-number-testing.d.ts +226 -0
  367. package/types/ngwr-input-number.d.ts +29 -1
  368. package/types/ngwr-input-otp-testing.d.ts +299 -0
  369. package/types/ngwr-input-otp.d.ts +23 -2
  370. package/types/ngwr-input-testing.d.ts +84 -0
  371. package/types/ngwr-input.d.ts +20 -6
  372. package/types/ngwr-knob.d.ts +18 -0
  373. package/types/ngwr-layout.d.ts +1 -0
  374. package/types/ngwr-lightbox.d.ts +17 -3
  375. package/types/ngwr-line-chart.d.ts +9 -2
  376. package/types/ngwr-markdown-testing.d.ts +462 -0
  377. package/types/ngwr-markdown.d.ts +534 -0
  378. package/types/ngwr-marquee.d.ts +12 -2
  379. package/types/ngwr-mention-testing.d.ts +359 -0
  380. package/types/ngwr-meta.d.ts +4 -2
  381. package/types/ngwr-meter-group.d.ts +11 -1
  382. package/types/ngwr-overlay.d.ts +33 -2
  383. package/types/ngwr-pagination-testing.d.ts +291 -0
  384. package/types/ngwr-pagination.d.ts +1 -0
  385. package/types/ngwr-popconfirm-testing.d.ts +235 -0
  386. package/types/ngwr-popconfirm.d.ts +31 -21
  387. package/types/ngwr-popover-testing.d.ts +221 -0
  388. package/types/ngwr-popover.d.ts +9 -0
  389. package/types/ngwr-pull-to-refresh.d.ts +7 -0
  390. package/types/ngwr-qr.d.ts +9 -1
  391. package/types/ngwr-radio-testing.d.ts +296 -0
  392. package/types/ngwr-radio.d.ts +8 -2
  393. package/types/ngwr-rating-testing.d.ts +291 -0
  394. package/types/ngwr-rating.d.ts +23 -0
  395. package/types/ngwr-segmented-testing.d.ts +401 -0
  396. package/types/ngwr-select-testing.d.ts +175 -0
  397. package/types/ngwr-select.d.ts +45 -4
  398. package/types/ngwr-sidebar.d.ts +17 -2
  399. package/types/ngwr-slider-testing.d.ts +329 -0
  400. package/types/ngwr-slider.d.ts +35 -1
  401. package/types/ngwr-sparkline.d.ts +12 -2
  402. package/types/ngwr-speed-dial.d.ts +17 -18
  403. package/types/ngwr-spinner.d.ts +8 -1
  404. package/types/ngwr-splitter.d.ts +24 -1
  405. package/types/ngwr-statistic.d.ts +12 -2
  406. package/types/ngwr-stepper-testing.d.ts +346 -0
  407. package/types/ngwr-switch-testing.d.ts +66 -0
  408. package/types/ngwr-switch.d.ts +7 -2
  409. package/types/ngwr-table-testing.d.ts +423 -0
  410. package/types/ngwr-table.d.ts +42 -0
  411. package/types/ngwr-tabs-testing.d.ts +470 -0
  412. package/types/ngwr-tabs.d.ts +9 -0
  413. package/types/ngwr-textarea-testing.d.ts +184 -0
  414. package/types/ngwr-textarea.d.ts +7 -2
  415. package/types/ngwr-toast-testing.d.ts +80 -0
  416. package/types/ngwr-tour.d.ts +27 -0
  417. package/types/ngwr-transfer-testing.d.ts +444 -0
  418. package/types/ngwr-transfer.d.ts +16 -1
  419. package/types/ngwr-tree-testing.d.ts +501 -0
  420. package/types/ngwr-tree.d.ts +33 -0
  421. package/types/ngwr-version.d.ts +1 -1
  422. package/types/ngwr-virtual-scroll.d.ts +13 -1
  423. package/typewriter/styles/_index.scss +1 -1
  424. package/typography/styles/_index.scss +1 -1
  425. package/window/styles/_index.scss +32 -9
@@ -1 +1 @@
1
- {"version":3,"file":"ngwr-layout.mjs","sources":["../../../projects/lib/layout/layout-sider.ts","../../../projects/lib/layout/layout.ts","../../../projects/lib/layout/layout-header.ts","../../../projects/lib/layout/layout-content.ts","../../../projects/lib/layout/layout-footer.ts","../../../projects/lib/layout/ngwr-layout.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, input, model, output } from '@angular/core';\n\n/**\n * Collapsible side panel. Lives inside a row `<wr-layout>` next to a\n * `<wr-layout-content>`. Two-way `[(collapsed)]` controls width.\n *\n * @example\n * ```html\n * <wr-layout>\n * <wr-layout-sider [(collapsed)]=\"collapsed\" width=\"14rem\" collapsedWidth=\"3rem\">\n * …\n * </wr-layout-sider>\n * <wr-layout-content>Main</wr-layout-content>\n * </wr-layout>\n * ```\n */\n@Component({\n selector: 'wr-layout-sider',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'classes()',\n '[style.width]': 'collapsed() ? collapsedWidth() : width()',\n role: 'complementary',\n },\n})\nexport class WrLayoutSider {\n /** Two-way bindable collapsed state. @default false */\n readonly collapsed = model(false);\n\n /** Width when expanded. Any CSS length. @default '16rem' */\n readonly width = input<string>('16rem');\n\n /** Width when collapsed. Any CSS length. `0` to fully hide. @default '4rem' */\n readonly collapsedWidth = input<string>('4rem');\n\n /** Place the sider on the right edge instead of the left. @default false */\n readonly reverse = input(false, { transform: coerceBooleanProperty });\n\n /** Emits whenever `collapsed` changes (in addition to the two-way `[(collapsed)]`). */\n readonly collapsedChanged = output<boolean>();\n\n protected readonly classes = computed(() => {\n const parts = ['wr-layout-sider'];\n if (this.collapsed()) parts.push('wr-layout-sider--collapsed');\n if (this.reverse()) parts.push('wr-layout-sider--reverse');\n return parts.join(' ');\n });\n\n /** Imperative toggle helper — `[(collapsed)]` still works alongside this. */\n toggle(): void {\n const next = !this.collapsed();\n this.collapsed.set(next);\n this.collapsedChanged.emit(next);\n }\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation, computed, contentChildren } from '@angular/core';\n\nimport { WrLayoutSider } from './layout-sider';\n\n/**\n * App-shell layout container. Lays its children out as a flex column by\n * default; switches to a row when a `<wr-layout-sider>` is among the\n * direct children (so `header → [sider + content] → footer` falls into\n * place automatically — same convention as ng-zorro / antd Layout).\n *\n * @example\n * ```html\n * <wr-layout>\n * <wr-layout-header>App bar</wr-layout-header>\n * <wr-layout>\n * <wr-layout-sider [(collapsed)]=\"collapsed\">Sidebar</wr-layout-sider>\n * <wr-layout-content>Main</wr-layout-content>\n * </wr-layout>\n * <wr-layout-footer>© 2026</wr-layout-footer>\n * </wr-layout>\n * ```\n *\n * @see https://ngwr.dev/reference/components/layout\n */\n@Component({\n selector: 'wr-layout',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { '[class]': 'classes()' },\n})\nexport class WrLayout {\n protected readonly siders = contentChildren(WrLayoutSider);\n\n protected readonly classes = computed(() => {\n const parts = ['wr-layout'];\n if (this.siders().length > 0) parts.push('wr-layout--has-sider');\n return parts.join(' ');\n });\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Top bar of a {@link WrLayout}. Stretches across the parent;\n * size and stickiness are app-controlled via CSS.\n */\n@Component({\n selector: 'wr-layout-header',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-layout-header', role: 'banner' },\n})\nexport class WrLayoutHeader {}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Main content area of a {@link WrLayout}. Flex-grows to fill\n * remaining space.\n */\n@Component({\n selector: 'wr-layout-content',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-layout-content', role: 'main' },\n})\nexport class WrLayoutContent {}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Bottom bar of a {@link WrLayout}. Doesn't grow — sized by its\n * children.\n */\n@Component({\n selector: 'wr-layout-footer',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-layout-footer', role: 'contentinfo' },\n})\nexport class WrLayoutFooter {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ngwr-layout.mjs","sources":["../../../projects/lib/layout/layout-sider.ts","../../../projects/lib/layout/layout.ts","../../../projects/lib/layout/layout-header.ts","../../../projects/lib/layout/layout-content.ts","../../../projects/lib/layout/layout-footer.ts","../../../projects/lib/layout/ngwr-layout.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Component, ViewEncapsulation, computed, effect, input, model, output, untracked } from '@angular/core';\n\n/**\n * Collapsible side panel. Lives inside a row `<wr-layout>` next to a\n * `<wr-layout-content>`. Two-way `[(collapsed)]` controls width.\n *\n * @example\n * ```html\n * <wr-layout>\n * <wr-layout-sider [(collapsed)]=\"collapsed\" width=\"14rem\" collapsedWidth=\"3rem\">\n * …\n * </wr-layout-sider>\n * <wr-layout-content>Main</wr-layout-content>\n * </wr-layout>\n * ```\n */\n@Component({\n selector: 'wr-layout-sider',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'classes()',\n '[style.width]': 'collapsed() ? collapsedWidth() : width()',\n role: 'complementary',\n },\n})\nexport class WrLayoutSider {\n /** Two-way bindable collapsed state. @default false */\n readonly collapsed = model(false);\n\n /** Width when expanded. Any CSS length. @default '16rem' */\n readonly width = input<string>('16rem');\n\n /** Width when collapsed. Any CSS length. `0` to fully hide. @default '4rem' */\n readonly collapsedWidth = input<string>('4rem');\n\n /** Place the sider on the right edge instead of the left. @default false */\n readonly reverse = input(false, { transform: coerceBooleanProperty });\n\n /** Emits whenever `collapsed` changes (in addition to the two-way `[(collapsed)]`). */\n readonly collapsedChanged = output<boolean>();\n\n constructor() {\n // The output is documented as firing whenever `collapsed` CHANGES, and it\n // only ever fired from `toggle()` — so a `[(collapsed)]` write, which is the\n // documented way to drive this, was silent. Emitting from an effect covers\n // both, and skipping the first run keeps the initial value from reading as a\n // change.\n let first = true;\n effect(() => {\n const collapsed = this.collapsed();\n if (first) {\n first = false;\n return;\n }\n untracked(() => this.collapsedChanged.emit(collapsed));\n });\n }\n\n protected readonly classes = computed(() => {\n const parts = ['wr-layout-sider'];\n if (this.collapsed()) parts.push('wr-layout-sider--collapsed');\n if (this.reverse()) parts.push('wr-layout-sider--reverse');\n return parts.join(' ');\n });\n\n /** Imperative toggle helper — `[(collapsed)]` still works alongside this. */\n toggle(): void {\n // No emit here: the effect above owns that, so a toggle and an external\n // write produce exactly one event each rather than two and none.\n this.collapsed.set(!this.collapsed());\n }\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation, computed, contentChildren } from '@angular/core';\n\nimport { WrLayoutSider } from './layout-sider';\n\n/**\n * App-shell layout container. Lays its children out as a flex column by\n * default; switches to a row when a `<wr-layout-sider>` is among the\n * direct children (so `header → [sider + content] → footer` falls into\n * place automatically — same convention as ng-zorro / antd Layout).\n *\n * @example\n * ```html\n * <wr-layout>\n * <wr-layout-header>App bar</wr-layout-header>\n * <wr-layout>\n * <wr-layout-sider [(collapsed)]=\"collapsed\">Sidebar</wr-layout-sider>\n * <wr-layout-content>Main</wr-layout-content>\n * </wr-layout>\n * <wr-layout-footer>© 2026</wr-layout-footer>\n * </wr-layout>\n * ```\n *\n * @see https://ngwr.dev/reference/components/layout\n */\n@Component({\n selector: 'wr-layout',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { '[class]': 'classes()' },\n})\nexport class WrLayout {\n protected readonly siders = contentChildren(WrLayoutSider);\n\n protected readonly classes = computed(() => {\n const parts = ['wr-layout'];\n if (this.siders().length > 0) parts.push('wr-layout--has-sider');\n return parts.join(' ');\n });\n}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Top bar of a {@link WrLayout}. Stretches across the parent;\n * size and stickiness are app-controlled via CSS.\n */\n@Component({\n selector: 'wr-layout-header',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-layout-header', role: 'banner' },\n})\nexport class WrLayoutHeader {}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Main content area of a {@link WrLayout}. Flex-grows to fill\n * remaining space.\n */\n@Component({\n selector: 'wr-layout-content',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-layout-content', role: 'main' },\n})\nexport class WrLayoutContent {}\n","/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { Component, ViewEncapsulation } from '@angular/core';\n\n/**\n * Bottom bar of a {@link WrLayout}. Doesn't grow — sized by its\n * children.\n */\n@Component({\n selector: 'wr-layout-footer',\n template: '<ng-content />',\n encapsulation: ViewEncapsulation.None,\n host: { class: 'wr-layout-footer', role: 'contentinfo' },\n})\nexport class WrLayoutFooter {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -2,7 +2,7 @@ import { ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';
2
2
  import { coerceBooleanProperty } from '@angular/cdk/coercion';
3
3
  import { TemplatePortal } from '@angular/cdk/portal';
4
4
  import * as i0 from '@angular/core';
5
- import { input, signal, computed, viewChild, inject, ViewContainerRef, DestroyRef, effect, ViewEncapsulation, Component } from '@angular/core';
5
+ import { input, computed, signal, viewChild, inject, ViewContainerRef, DestroyRef, effect, ViewEncapsulation, Component } from '@angular/core';
6
6
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
7
7
  import { useI18nText } from 'ngwr/i18n';
8
8
  import { WR_OVERLAY } from 'ngwr/overlay';
@@ -32,6 +32,9 @@ import { WR_OVERLAY } from 'ngwr/overlay';
32
32
  */
33
33
  class WrLightbox {
34
34
  /** Accessible name. Falls back to `image.close`, then `'Close preview'`. */
35
+ /** Accessible name of the thumbnail button. Falls back to `alt`, then `image.open`. */
36
+ openLabel = input(null, /* @ts-ignore */
37
+ ...(ngDevMode ? [{ debugName: "openLabel" }] : /* istanbul ignore next */ []));
35
38
  closeLabel = input(null, /* @ts-ignore */
36
39
  ...(ngDevMode ? [{ debugName: "closeLabel" }] : /* istanbul ignore next */ []));
37
40
  resolvedCloseLabel = useI18nText(this.closeLabel, 'image.close', 'Close preview');
@@ -41,9 +44,27 @@ class WrLightbox {
41
44
  /** Alt text. Required for a11y; falls back to an empty string. @default '' */
42
45
  alt = input('', /* @ts-ignore */
43
46
  ...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
44
- /** Optional preview src — shown until the full image loads. */
47
+ /**
48
+ * Lighter source for the THUMBNAIL — a small or blurred copy, so the grid does not
49
+ * pull full-size images. The viewer always shows `src`; the thumbnail does not swap
50
+ * to it later.
51
+ */
45
52
  preview = input(null, /* @ts-ignore */
46
53
  ...(ngDevMode ? [{ debugName: "preview" }] : /* istanbul ignore next */ []));
54
+ // Both of these were hard-coded English literals in the template, next to a catalog
55
+ // that already carried `image.open` translated and unread. `useI18nText` already
56
+ // does the whole chain — a non-empty binding wins, then the catalog, then the
57
+ // English default — so the alt text (which describes the actual picture) is what
58
+ // gets forwarded, with `openLabel` ahead of it as the explicit override.
59
+ resolvedOpenLabel = useI18nText(computed(() => {
60
+ // Not `??`: an empty `openLabel` is no label at all, so it has to fall through
61
+ // to the alt text rather than winning as an empty string.
62
+ const explicit = this.openLabel();
63
+ if (explicit)
64
+ return explicit;
65
+ return this.alt();
66
+ }), 'image.open', 'Open preview');
67
+ resolvedViewerLabel = useI18nText(this.alt, 'image.viewer', 'Image preview');
47
68
  /** Disable the click-to-zoom lightbox. @default false */
48
69
  disablePreview = input(false, { ...(ngDevMode ? { debugName: "disablePreview" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
49
70
  /** Caption shown under the full image in the lightbox. */
@@ -146,7 +167,13 @@ class WrLightbox {
146
167
  viewer.style.opacity = '';
147
168
  }
148
169
  }
149
- onLoad() {
170
+ /**
171
+ * The thumbnail has settled, one way or the other. A failure counts: `--loading`
172
+ * animates a shimmer AND sets `opacity: 0` on the image, so a broken `src` with no
173
+ * error path left an invisible box shimmering for ever instead of showing its alt
174
+ * text.
175
+ */
176
+ onSettled() {
150
177
  this.loaded.set(true);
151
178
  }
152
179
  // Overlay
@@ -198,15 +225,15 @@ class WrLightbox {
198
225
  restore.focus();
199
226
  }
200
227
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrLightbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
201
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrLightbox, isStandalone: true, selector: "wr-lightbox", inputs: { closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, preview: { classPropertyName: "preview", publicName: "preview", isSignal: true, isRequired: false, transformFunction: null }, disablePreview: { classPropertyName: "disablePreview", publicName: "disablePreview", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.aspect-ratio": "aspectRatio()" } }, viewQueries: [{ propertyName: "panelTpl", first: true, predicate: ["viewerTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (disablePreview()) {\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onLoad()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n} @else {\n <button type=\"button\" class=\"wr-lightbox__trigger\" [attr.aria-label]=\"alt() || 'Open preview'\" (click)=\"onClick()\">\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onLoad()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n </button>\n}\n\n<ng-template #viewerTpl>\n <div\n #viewer\n class=\"wr-lightbox-viewer\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"alt() || 'Image preview'\"\n (touchstart)=\"onViewerSwipeStart($event)\"\n (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n >\n <button\n type=\"button\"\n class=\"wr-lightbox-viewer__close\"\n [attr.aria-label]=\"resolvedCloseLabel()\"\n (click)=\"onClose()\"\n (keydown.enter)=\"onClose()\"\n (keydown.space)=\"onClose()\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n </button>\n <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" />\n @if (caption()) {\n <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n }\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #f51c6a;--wr-color-secondary-rgb: 245, 28, 106;--wr-color-secondary-contrast: #000000;--wr-color-secondary-dark: rgb(237.0569620253, 10.4430379747, 91.8987341772);--wr-color-secondary-darker: rgb(212.6329113924, 9.3670886076, 82.4303797468);--wr-color-secondary-light: rgb(246.0759493671, 52.4240506329, 122.0316455696);--wr-color-secondary-lighter: rgb(247.1518987342, 76.8481012658, 138.0632911392);--wr-color-success: #00a400;--wr-color-success-rgb: 0, 164, 0;--wr-color-success-contrast: #000000;--wr-color-success-dark: rgb(0, 138.5, 0);--wr-color-success-darker: #007100;--wr-color-success-light: rgb(0, 189.5, 0);--wr-color-success-lighter: #00d700;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #fa383e;--wr-color-danger-rgb: 250, 56, 62;--wr-color-danger-contrast: #000000;--wr-color-danger-dark: rgb(249.375, 31.125, 37.875);--wr-color-danger-darker: rgb(248.75, 6.25, 13.75);--wr-color-danger-light: rgb(250.625, 80.875, 86.125);--wr-color-danger-lighter: rgb(251.25, 105.75, 110.25);--wr-color-info: #3b82f6;--wr-color-info-rgb: 59, 130, 246;--wr-color-info-contrast: #000000;--wr-color-info-dark: rgb(34.6195121951, 114.4512195122, 244.8804878049);--wr-color-info-darker: rgb(11.1512195122, 99.1219512195, 242.8487804878);--wr-color-info-light: rgb(83.3804878049, 145.5487804878, 247.1195121951);--wr-color-info-lighter: rgb(107.7609756098, 161.0975609756, 248.2390243902);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #8594a4;--wr-color-medium-rgb: 133, 148, 164;--wr-color-medium-contrast: #000000;--wr-color-medium-dark: rgb(118.3943661972, 135.1901408451, 153.1056338028);--wr-color-medium-darker: rgb(105.0985915493, 122.4225352113, 140.9014084507);--wr-color-medium-light: rgb(147.6056338028, 160.8098591549, 174.8943661972);--wr-color-medium-lighter: rgb(162.2112676056, 173.6197183099, 185.7887323944);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 86%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #9aa6b8;--wr-color-medium-rgb: 154, 166, 184;--wr-color-medium-contrast: #000000;--wr-color-medium-light: rgb(168.9738372093, 179.1947674419, 194.5261627907);--wr-color-medium-lighter: rgb(183.9476744186, 192.3895348837, 205.0523255814);--wr-color-medium-dark: rgb(139.0261627907, 152.8052325581, 173.4738372093);--wr-color-medium-darker: rgb(124.0523255814, 139.6104651163, 162.9476744186);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #5b85ff;--wr-color-primary-contrast: #000000;--wr-color-primary-rgb: 91, 133, 255;--wr-color-primary-light: #7a9eff;--wr-color-primary-dark: #2f56c9;--wr-color-primary-lighter: #99b6ff;--wr-color-primary-darker: #1f3a99;--wr-color-success: #34c759;--wr-color-success-contrast: #000000;--wr-color-success-rgb: 52, 199, 89;--wr-color-success-light: rgb(69.874501992, 206.625498008, 104.2948207171);--wr-color-success-lighter: rgb(90.0916334661, 211.9083665339, 120.7529880478);--wr-color-success-dark: rgb(46.7171314741, 178.7828685259, 79.9581673307);--wr-color-success-darker: rgb(41.4342629482, 158.5657370518, 70.9163346614);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ff5c5c;--wr-color-danger-contrast: #000000;--wr-color-danger-rgb: 255, 92, 92;--wr-color-danger-light: rgb(255, 117.5, 117.5);--wr-color-danger-lighter: #ff8f8f;--wr-color-danger-dark: rgb(255, 66.5, 66.5);--wr-color-danger-darker: #ff2929;--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-sidebar__entry:focus-visible,.wr-sidebar__item:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-anchor__link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-collapse__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-mention-panel__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-segmented__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-back-top:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-stepper__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-window__chrome-action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-dropdown-item:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-alert__close:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-lightbox{display:inline-block;position:relative;overflow:hidden;border-radius:var(--wr-lightbox-radius, var(--wr-border-radius-base))}@supports (corner-shape: squircle){.wr-lightbox{corner-shape:squircle;border-radius:calc(var(--wr-lightbox-radius, var(--wr-border-radius-base)) * 1.85)}}.wr-lightbox{cursor:zoom-in;background:var(--wr-color-hover)}.wr-lightbox--loading{min-height:var(--wr-lightbox-loading-min-height, 4rem)}.wr-lightbox--loading:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--wr-color-surface-rgb),0),rgba(var(--wr-color-surface-rgb),.45),rgba(var(--wr-color-surface-rgb),0));background-size:200% 100%;animation:wr-lightbox-shimmer 1.4s linear infinite;pointer-events:none;z-index:1}.wr-lightbox__trigger{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent;cursor:zoom-in}.wr-lightbox__trigger:focus-visible{outline:2px solid var(--wr-color-primary);outline-offset:2px}.wr-lightbox__thumb{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;position:relative;z-index:2;opacity:1;transition:opacity .25s ease}.wr-lightbox--loading .wr-lightbox__thumb{opacity:0}@keyframes wr-lightbox-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wr-lightbox-backdrop{background:rgba(var(--wr-color-backdrop-rgb),.85)}.wr-lightbox-overlay{pointer-events:auto}.wr-lightbox-viewer{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:95vw;max-height:95vh;max-height:95dvh;padding:1rem;animation:wr-lightbox-viewer-in .18s ease;outline:none;touch-action:none}.wr-lightbox-viewer__close{--wr-icon-size: 1.25rem;position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;border-radius:999px;background:rgba(var(--wr-color-surface-rgb),.12);color:rgba(var(--wr-color-surface-rgb),.9);cursor:pointer;transition:background .15s ease,transform .15s ease}@media(pointer:coarse){.wr-lightbox-viewer__close:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-lightbox-viewer__close:hover{background:rgba(var(--wr-color-surface-rgb),.2)}.wr-lightbox-viewer__close:active{transform:scale(.95)}.wr-lightbox-viewer__close:focus-visible{outline:2px solid rgba(var(--wr-color-surface-rgb),.9);outline-offset:2px}.wr-lightbox-viewer__full{display:block;max-width:100%;max-height:calc(95vh - 4rem);max-height:calc(95dvh - 4rem);object-fit:contain;cursor:zoom-out;border-radius:.5rem}@supports (corner-shape: squircle){.wr-lightbox-viewer__full{corner-shape:squircle;border-radius:.925rem}}.wr-lightbox-viewer__caption{color:rgba(var(--wr-color-surface-rgb),.85);font-family:var(--wr-font-family-base);font-size:var(--wr-text-sm);text-align:center;max-width:60ch}@keyframes wr-lightbox-viewer-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}\n"], encapsulation: i0.ViewEncapsulation.None });
228
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrLightbox, isStandalone: true, selector: "wr-lightbox", inputs: { openLabel: { classPropertyName: "openLabel", publicName: "openLabel", isSignal: true, isRequired: false, transformFunction: null }, closeLabel: { classPropertyName: "closeLabel", publicName: "closeLabel", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, preview: { classPropertyName: "preview", publicName: "preview", isSignal: true, isRequired: false, transformFunction: null }, disablePreview: { classPropertyName: "disablePreview", publicName: "disablePreview", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.aspect-ratio": "aspectRatio()" } }, viewQueries: [{ propertyName: "panelTpl", first: true, predicate: ["viewerTpl"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (disablePreview()) {\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onSettled()\"\n (error)=\"onSettled()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n} @else {\n <button type=\"button\" class=\"wr-lightbox__trigger\" [attr.aria-label]=\"resolvedOpenLabel()\" (click)=\"onClick()\">\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onSettled()\"\n (error)=\"onSettled()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n </button>\n}\n\n<ng-template #viewerTpl>\n <div\n #viewer\n class=\"wr-lightbox-viewer\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedViewerLabel()\"\n (touchstart)=\"onViewerSwipeStart($event)\"\n (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n >\n <button\n type=\"button\"\n class=\"wr-lightbox-viewer__close\"\n [attr.aria-label]=\"resolvedCloseLabel()\"\n (click)=\"onClose()\"\n (keydown.enter)=\"onClose()\"\n (keydown.space)=\"onClose()\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n </button>\n <!--\n Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n REDUNDANT mouse affordance \u2014 the close button, Escape, the backdrop and\n swipe-down all do the same thing and all reach a keyboard \u2014 so the image stays\n out of the tab order rather than becoming a second close stop.\n -->\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n @if (caption()) {\n <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n }\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #e21a62;--wr-color-secondary-rgb: 226, 26, 98;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(203.130952381, 23.369047619, 88.0833333333);--wr-color-secondary-darker: rgb(180.2619047619, 20.7380952381, 78.1666666667);--wr-color-secondary-light: rgb(231.0119047619, 46.4880952381, 112.9166666667);--wr-color-secondary-lighter: rgb(233.6428571429, 69.3571428571, 128.5);--wr-color-success: #008800;--wr-color-success-rgb: 0, 136, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 110.5, 0);--wr-color-success-darker: #005500;--wr-color-success-light: rgb(0, 161.5, 0);--wr-color-success-lighter: #00bb00;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #dc3137;--wr-color-danger-rgb: 220, 49, 55;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(208.1369294606, 35.3630705394, 41.4253112033);--wr-color-danger-darker: rgb(186.3402489627, 31.6597510373, 37.0871369295);--wr-color-danger-light: rgb(223.7033195021, 70.7966804979, 76.1618257261);--wr-color-danger-lighter: rgb(227.4066390041, 92.5933609959, 97.3236514523);--wr-color-info: #3472d9;--wr-color-info-rgb: 52, 114, 217;--wr-color-info-contrast: #ffffff;--wr-color-info-dark: rgb(38.3941908714, 101.0373443983, 205.1058091286);--wr-color-info-darker: rgb(34.3734439834, 90.4564315353, 183.6265560166);--wr-color-info-light: rgb(73.479253112, 128.9190871369, 221.020746888);--wr-color-info-lighter: rgb(94.9585062241, 143.8381742739, 225.0414937759);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #6a7683;--wr-color-medium-rgb: 106, 118, 131;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(94.5949367089, 105.3037974684, 116.9050632911);--wr-color-medium-darker: rgb(83.1898734177, 92.6075949367, 102.8101265823);--wr-color-medium-light: rgb(118.1962025316, 130.7278481013, 144.3037974684);--wr-color-medium-lighter: rgb(132.2911392405, 143.5316455696, 155.7088607595);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 86%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #6d7682;--wr-color-medium-rgb: 109, 118, 130;--wr-color-medium-contrast: #ffffff;--wr-color-medium-light: rgb(121.4644351464, 130.7092050209, 143.0355648536);--wr-color-medium-lighter: rgb(135.3347280335, 143.6192468619, 154.6652719665);--wr-color-medium-dark: rgb(97.370292887, 105.410041841, 116.129707113);--wr-color-medium-darker: rgb(85.7405857741, 92.820083682, 102.2594142259);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #5b85ff;--wr-color-primary-contrast: #000000;--wr-color-primary-rgb: 91, 133, 255;--wr-color-primary-light: #7a9eff;--wr-color-primary-dark: #2f56c9;--wr-color-primary-lighter: #99b6ff;--wr-color-primary-darker: #1f3a99;--wr-color-success: #23863c;--wr-color-success-contrast: #ffffff;--wr-color-success-rgb: 35, 134, 60;--wr-color-success-light: rgb(40.2810650888, 154.2189349112, 69.0532544379);--wr-color-success-lighter: rgb(45.5621301775, 174.4378698225, 78.1065088757);--wr-color-success-dark: rgb(29.7189349112, 113.7810650888, 50.9467455621);--wr-color-success-darker: rgb(24.4378698225, 93.5621301775, 41.8934911243);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ca4949;--wr-color-danger-contrast: #ffffff;--wr-color-danger-rgb: 202, 73, 73;--wr-color-danger-light: rgb(207.7510638298, 92.7489361702, 92.7489361702);--wr-color-danger-lighter: rgb(213.5021276596, 112.4978723404, 112.4978723404);--wr-color-danger-dark: rgb(193.229787234, 56.270212766, 56.270212766);--wr-color-danger-darker: rgb(173.4808510638, 50.5191489362, 50.5191489362);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-sidebar__entry:focus-visible,.wr-sidebar__item:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-anchor__link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-collapse__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-mention-panel__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-segmented__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-back-top:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-stepper__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-window__chrome-action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-dropdown-item:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-alert__close:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-lightbox{display:inline-block;position:relative;overflow:hidden;border-radius:var(--wr-lightbox-radius, var(--wr-border-radius-base))}@supports (corner-shape: squircle){.wr-lightbox{corner-shape:squircle;border-radius:calc(var(--wr-lightbox-radius, var(--wr-border-radius-base)) * 1.85)}}.wr-lightbox{background:var(--wr-color-hover)}.wr-lightbox--loading{min-height:var(--wr-lightbox-loading-min-height, 4rem)}.wr-lightbox--loading:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--wr-color-surface-rgb),0),rgba(var(--wr-color-surface-rgb),.45),rgba(var(--wr-color-surface-rgb),0));background-size:200% 100%;animation:wr-lightbox-shimmer 1.4s linear infinite;pointer-events:none;z-index:1}.wr-lightbox__trigger{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent;cursor:zoom-in}.wr-lightbox__trigger:focus-visible{outline:2px solid var(--wr-color-primary);outline-offset:2px}.wr-lightbox__thumb{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;position:relative;z-index:2;opacity:1;transition:opacity .25s ease}.wr-lightbox--loading .wr-lightbox__thumb{opacity:0}@keyframes wr-lightbox-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wr-lightbox-backdrop{background:rgba(var(--wr-color-backdrop-rgb),.85)}.wr-lightbox-overlay{pointer-events:auto}.wr-lightbox-viewer{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:95vw;max-height:95vh;max-height:95dvh;padding:1rem;animation:wr-lightbox-viewer-in .18s ease;outline:none;touch-action:none}.wr-lightbox-viewer__close{--wr-icon-size: 1.25rem;position:absolute;top:1rem;inset-inline-end:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;border-radius:999px;background:rgba(var(--wr-color-surface-rgb),.12);color:rgba(var(--wr-color-surface-rgb),.9);cursor:pointer;transition:background .15s ease,transform .15s ease}@media(pointer:coarse){.wr-lightbox-viewer__close:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-lightbox-viewer__close:hover{background:rgba(var(--wr-color-surface-rgb),.2)}.wr-lightbox-viewer__close:active{transform:scale(.95)}.wr-lightbox-viewer__close:focus-visible{outline:2px solid rgba(var(--wr-color-surface-rgb),.9);outline-offset:2px}.wr-lightbox-viewer__full{display:block;max-width:100%;max-height:calc(95vh - 4rem);max-height:calc(95dvh - 4rem);object-fit:contain;cursor:zoom-out;border-radius:.5rem}@supports (corner-shape: squircle){.wr-lightbox-viewer__full{corner-shape:squircle;border-radius:.925rem}}.wr-lightbox-viewer__caption{color:rgba(var(--wr-color-surface-rgb),.85);font-family:var(--wr-font-family-base);font-size:var(--wr-text-sm);text-align:center;max-width:60ch}@keyframes wr-lightbox-viewer-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}\n"], encapsulation: i0.ViewEncapsulation.None });
202
229
  }
203
230
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrLightbox, decorators: [{
204
231
  type: Component,
205
232
  args: [{ selector: 'wr-lightbox', encapsulation: ViewEncapsulation.None, host: {
206
233
  '[class]': 'classes()',
207
234
  '[style.aspect-ratio]': 'aspectRatio()',
208
- }, template: "@if (disablePreview()) {\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onLoad()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n} @else {\n <button type=\"button\" class=\"wr-lightbox__trigger\" [attr.aria-label]=\"alt() || 'Open preview'\" (click)=\"onClick()\">\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onLoad()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n </button>\n}\n\n<ng-template #viewerTpl>\n <div\n #viewer\n class=\"wr-lightbox-viewer\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"alt() || 'Image preview'\"\n (touchstart)=\"onViewerSwipeStart($event)\"\n (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n >\n <button\n type=\"button\"\n class=\"wr-lightbox-viewer__close\"\n [attr.aria-label]=\"resolvedCloseLabel()\"\n (click)=\"onClose()\"\n (keydown.enter)=\"onClose()\"\n (keydown.space)=\"onClose()\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n </button>\n <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" />\n @if (caption()) {\n <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n }\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #f51c6a;--wr-color-secondary-rgb: 245, 28, 106;--wr-color-secondary-contrast: #000000;--wr-color-secondary-dark: rgb(237.0569620253, 10.4430379747, 91.8987341772);--wr-color-secondary-darker: rgb(212.6329113924, 9.3670886076, 82.4303797468);--wr-color-secondary-light: rgb(246.0759493671, 52.4240506329, 122.0316455696);--wr-color-secondary-lighter: rgb(247.1518987342, 76.8481012658, 138.0632911392);--wr-color-success: #00a400;--wr-color-success-rgb: 0, 164, 0;--wr-color-success-contrast: #000000;--wr-color-success-dark: rgb(0, 138.5, 0);--wr-color-success-darker: #007100;--wr-color-success-light: rgb(0, 189.5, 0);--wr-color-success-lighter: #00d700;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #fa383e;--wr-color-danger-rgb: 250, 56, 62;--wr-color-danger-contrast: #000000;--wr-color-danger-dark: rgb(249.375, 31.125, 37.875);--wr-color-danger-darker: rgb(248.75, 6.25, 13.75);--wr-color-danger-light: rgb(250.625, 80.875, 86.125);--wr-color-danger-lighter: rgb(251.25, 105.75, 110.25);--wr-color-info: #3b82f6;--wr-color-info-rgb: 59, 130, 246;--wr-color-info-contrast: #000000;--wr-color-info-dark: rgb(34.6195121951, 114.4512195122, 244.8804878049);--wr-color-info-darker: rgb(11.1512195122, 99.1219512195, 242.8487804878);--wr-color-info-light: rgb(83.3804878049, 145.5487804878, 247.1195121951);--wr-color-info-lighter: rgb(107.7609756098, 161.0975609756, 248.2390243902);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #8594a4;--wr-color-medium-rgb: 133, 148, 164;--wr-color-medium-contrast: #000000;--wr-color-medium-dark: rgb(118.3943661972, 135.1901408451, 153.1056338028);--wr-color-medium-darker: rgb(105.0985915493, 122.4225352113, 140.9014084507);--wr-color-medium-light: rgb(147.6056338028, 160.8098591549, 174.8943661972);--wr-color-medium-lighter: rgb(162.2112676056, 173.6197183099, 185.7887323944);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 86%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #9aa6b8;--wr-color-medium-rgb: 154, 166, 184;--wr-color-medium-contrast: #000000;--wr-color-medium-light: rgb(168.9738372093, 179.1947674419, 194.5261627907);--wr-color-medium-lighter: rgb(183.9476744186, 192.3895348837, 205.0523255814);--wr-color-medium-dark: rgb(139.0261627907, 152.8052325581, 173.4738372093);--wr-color-medium-darker: rgb(124.0523255814, 139.6104651163, 162.9476744186);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #5b85ff;--wr-color-primary-contrast: #000000;--wr-color-primary-rgb: 91, 133, 255;--wr-color-primary-light: #7a9eff;--wr-color-primary-dark: #2f56c9;--wr-color-primary-lighter: #99b6ff;--wr-color-primary-darker: #1f3a99;--wr-color-success: #34c759;--wr-color-success-contrast: #000000;--wr-color-success-rgb: 52, 199, 89;--wr-color-success-light: rgb(69.874501992, 206.625498008, 104.2948207171);--wr-color-success-lighter: rgb(90.0916334661, 211.9083665339, 120.7529880478);--wr-color-success-dark: rgb(46.7171314741, 178.7828685259, 79.9581673307);--wr-color-success-darker: rgb(41.4342629482, 158.5657370518, 70.9163346614);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ff5c5c;--wr-color-danger-contrast: #000000;--wr-color-danger-rgb: 255, 92, 92;--wr-color-danger-light: rgb(255, 117.5, 117.5);--wr-color-danger-lighter: #ff8f8f;--wr-color-danger-dark: rgb(255, 66.5, 66.5);--wr-color-danger-darker: #ff2929;--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-sidebar__entry:focus-visible,.wr-sidebar__item:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-anchor__link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-collapse__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-mention-panel__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-segmented__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-back-top:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-stepper__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-window__chrome-action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-dropdown-item:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-alert__close:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-lightbox{display:inline-block;position:relative;overflow:hidden;border-radius:var(--wr-lightbox-radius, var(--wr-border-radius-base))}@supports (corner-shape: squircle){.wr-lightbox{corner-shape:squircle;border-radius:calc(var(--wr-lightbox-radius, var(--wr-border-radius-base)) * 1.85)}}.wr-lightbox{cursor:zoom-in;background:var(--wr-color-hover)}.wr-lightbox--loading{min-height:var(--wr-lightbox-loading-min-height, 4rem)}.wr-lightbox--loading:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--wr-color-surface-rgb),0),rgba(var(--wr-color-surface-rgb),.45),rgba(var(--wr-color-surface-rgb),0));background-size:200% 100%;animation:wr-lightbox-shimmer 1.4s linear infinite;pointer-events:none;z-index:1}.wr-lightbox__trigger{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent;cursor:zoom-in}.wr-lightbox__trigger:focus-visible{outline:2px solid var(--wr-color-primary);outline-offset:2px}.wr-lightbox__thumb{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;position:relative;z-index:2;opacity:1;transition:opacity .25s ease}.wr-lightbox--loading .wr-lightbox__thumb{opacity:0}@keyframes wr-lightbox-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wr-lightbox-backdrop{background:rgba(var(--wr-color-backdrop-rgb),.85)}.wr-lightbox-overlay{pointer-events:auto}.wr-lightbox-viewer{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:95vw;max-height:95vh;max-height:95dvh;padding:1rem;animation:wr-lightbox-viewer-in .18s ease;outline:none;touch-action:none}.wr-lightbox-viewer__close{--wr-icon-size: 1.25rem;position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;border-radius:999px;background:rgba(var(--wr-color-surface-rgb),.12);color:rgba(var(--wr-color-surface-rgb),.9);cursor:pointer;transition:background .15s ease,transform .15s ease}@media(pointer:coarse){.wr-lightbox-viewer__close:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-lightbox-viewer__close:hover{background:rgba(var(--wr-color-surface-rgb),.2)}.wr-lightbox-viewer__close:active{transform:scale(.95)}.wr-lightbox-viewer__close:focus-visible{outline:2px solid rgba(var(--wr-color-surface-rgb),.9);outline-offset:2px}.wr-lightbox-viewer__full{display:block;max-width:100%;max-height:calc(95vh - 4rem);max-height:calc(95dvh - 4rem);object-fit:contain;cursor:zoom-out;border-radius:.5rem}@supports (corner-shape: squircle){.wr-lightbox-viewer__full{corner-shape:squircle;border-radius:.925rem}}.wr-lightbox-viewer__caption{color:rgba(var(--wr-color-surface-rgb),.85);font-family:var(--wr-font-family-base);font-size:var(--wr-text-sm);text-align:center;max-width:60ch}@keyframes wr-lightbox-viewer-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}\n"] }]
209
- }], ctorParameters: () => [], propDecorators: { closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], preview: [{ type: i0.Input, args: [{ isSignal: true, alias: "preview", required: false }] }], disablePreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "disablePreview", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], aspectRatio: [{ type: i0.Input, args: [{ isSignal: true, alias: "aspectRatio", required: false }] }], panelTpl: [{ type: i0.ViewChild, args: ['viewerTpl', { isSignal: true }] }] } });
235
+ }, template: "@if (disablePreview()) {\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onSettled()\"\n (error)=\"onSettled()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n} @else {\n <button type=\"button\" class=\"wr-lightbox__trigger\" [attr.aria-label]=\"resolvedOpenLabel()\" (click)=\"onClick()\">\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onSettled()\"\n (error)=\"onSettled()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n </button>\n}\n\n<ng-template #viewerTpl>\n <div\n #viewer\n class=\"wr-lightbox-viewer\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedViewerLabel()\"\n (touchstart)=\"onViewerSwipeStart($event)\"\n (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n >\n <button\n type=\"button\"\n class=\"wr-lightbox-viewer__close\"\n [attr.aria-label]=\"resolvedCloseLabel()\"\n (click)=\"onClose()\"\n (keydown.enter)=\"onClose()\"\n (keydown.space)=\"onClose()\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n </button>\n <!--\n Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n REDUNDANT mouse affordance \u2014 the close button, Escape, the backdrop and\n swipe-down all do the same thing and all reach a keyboard \u2014 so the image stays\n out of the tab order rather than becoming a second close stop.\n -->\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n @if (caption()) {\n <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n }\n </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #e21a62;--wr-color-secondary-rgb: 226, 26, 98;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(203.130952381, 23.369047619, 88.0833333333);--wr-color-secondary-darker: rgb(180.2619047619, 20.7380952381, 78.1666666667);--wr-color-secondary-light: rgb(231.0119047619, 46.4880952381, 112.9166666667);--wr-color-secondary-lighter: rgb(233.6428571429, 69.3571428571, 128.5);--wr-color-success: #008800;--wr-color-success-rgb: 0, 136, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 110.5, 0);--wr-color-success-darker: #005500;--wr-color-success-light: rgb(0, 161.5, 0);--wr-color-success-lighter: #00bb00;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #dc3137;--wr-color-danger-rgb: 220, 49, 55;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(208.1369294606, 35.3630705394, 41.4253112033);--wr-color-danger-darker: rgb(186.3402489627, 31.6597510373, 37.0871369295);--wr-color-danger-light: rgb(223.7033195021, 70.7966804979, 76.1618257261);--wr-color-danger-lighter: rgb(227.4066390041, 92.5933609959, 97.3236514523);--wr-color-info: #3472d9;--wr-color-info-rgb: 52, 114, 217;--wr-color-info-contrast: #ffffff;--wr-color-info-dark: rgb(38.3941908714, 101.0373443983, 205.1058091286);--wr-color-info-darker: rgb(34.3734439834, 90.4564315353, 183.6265560166);--wr-color-info-light: rgb(73.479253112, 128.9190871369, 221.020746888);--wr-color-info-lighter: rgb(94.9585062241, 143.8381742739, 225.0414937759);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #6a7683;--wr-color-medium-rgb: 106, 118, 131;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(94.5949367089, 105.3037974684, 116.9050632911);--wr-color-medium-darker: rgb(83.1898734177, 92.6075949367, 102.8101265823);--wr-color-medium-light: rgb(118.1962025316, 130.7278481013, 144.3037974684);--wr-color-medium-lighter: rgb(132.2911392405, 143.5316455696, 155.7088607595);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 86%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #6d7682;--wr-color-medium-rgb: 109, 118, 130;--wr-color-medium-contrast: #ffffff;--wr-color-medium-light: rgb(121.4644351464, 130.7092050209, 143.0355648536);--wr-color-medium-lighter: rgb(135.3347280335, 143.6192468619, 154.6652719665);--wr-color-medium-dark: rgb(97.370292887, 105.410041841, 116.129707113);--wr-color-medium-darker: rgb(85.7405857741, 92.820083682, 102.2594142259);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #5b85ff;--wr-color-primary-contrast: #000000;--wr-color-primary-rgb: 91, 133, 255;--wr-color-primary-light: #7a9eff;--wr-color-primary-dark: #2f56c9;--wr-color-primary-lighter: #99b6ff;--wr-color-primary-darker: #1f3a99;--wr-color-success: #23863c;--wr-color-success-contrast: #ffffff;--wr-color-success-rgb: 35, 134, 60;--wr-color-success-light: rgb(40.2810650888, 154.2189349112, 69.0532544379);--wr-color-success-lighter: rgb(45.5621301775, 174.4378698225, 78.1065088757);--wr-color-success-dark: rgb(29.7189349112, 113.7810650888, 50.9467455621);--wr-color-success-darker: rgb(24.4378698225, 93.5621301775, 41.8934911243);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ca4949;--wr-color-danger-contrast: #ffffff;--wr-color-danger-rgb: 202, 73, 73;--wr-color-danger-light: rgb(207.7510638298, 92.7489361702, 92.7489361702);--wr-color-danger-lighter: rgb(213.5021276596, 112.4978723404, 112.4978723404);--wr-color-danger-dark: rgb(193.229787234, 56.270212766, 56.270212766);--wr-color-danger-darker: rgb(173.4808510638, 50.5191489362, 50.5191489362);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-sidebar__entry:focus-visible,.wr-sidebar__item:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-anchor__link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-collapse__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-mention-panel__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-segmented__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-back-top:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-stepper__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-window__chrome-action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-dropdown-item:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-alert__close:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-lightbox{display:inline-block;position:relative;overflow:hidden;border-radius:var(--wr-lightbox-radius, var(--wr-border-radius-base))}@supports (corner-shape: squircle){.wr-lightbox{corner-shape:squircle;border-radius:calc(var(--wr-lightbox-radius, var(--wr-border-radius-base)) * 1.85)}}.wr-lightbox{background:var(--wr-color-hover)}.wr-lightbox--loading{min-height:var(--wr-lightbox-loading-min-height, 4rem)}.wr-lightbox--loading:after{content:\"\";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--wr-color-surface-rgb),0),rgba(var(--wr-color-surface-rgb),.45),rgba(var(--wr-color-surface-rgb),0));background-size:200% 100%;animation:wr-lightbox-shimmer 1.4s linear infinite;pointer-events:none;z-index:1}.wr-lightbox__trigger{display:block;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent;cursor:zoom-in}.wr-lightbox__trigger:focus-visible{outline:2px solid var(--wr-color-primary);outline-offset:2px}.wr-lightbox__thumb{display:block;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;position:relative;z-index:2;opacity:1;transition:opacity .25s ease}.wr-lightbox--loading .wr-lightbox__thumb{opacity:0}@keyframes wr-lightbox-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.wr-lightbox-backdrop{background:rgba(var(--wr-color-backdrop-rgb),.85)}.wr-lightbox-overlay{pointer-events:auto}.wr-lightbox-viewer{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:95vw;max-height:95vh;max-height:95dvh;padding:1rem;animation:wr-lightbox-viewer-in .18s ease;outline:none;touch-action:none}.wr-lightbox-viewer__close{--wr-icon-size: 1.25rem;position:absolute;top:1rem;inset-inline-end:1rem;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border:0;border-radius:999px;background:rgba(var(--wr-color-surface-rgb),.12);color:rgba(var(--wr-color-surface-rgb),.9);cursor:pointer;transition:background .15s ease,transform .15s ease}@media(pointer:coarse){.wr-lightbox-viewer__close:after{content:\"\";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}}.wr-lightbox-viewer__close:hover{background:rgba(var(--wr-color-surface-rgb),.2)}.wr-lightbox-viewer__close:active{transform:scale(.95)}.wr-lightbox-viewer__close:focus-visible{outline:2px solid rgba(var(--wr-color-surface-rgb),.9);outline-offset:2px}.wr-lightbox-viewer__full{display:block;max-width:100%;max-height:calc(95vh - 4rem);max-height:calc(95dvh - 4rem);object-fit:contain;cursor:zoom-out;border-radius:.5rem}@supports (corner-shape: squircle){.wr-lightbox-viewer__full{corner-shape:squircle;border-radius:.925rem}}.wr-lightbox-viewer__caption{color:rgba(var(--wr-color-surface-rgb),.85);font-family:var(--wr-font-family-base);font-size:var(--wr-text-sm);text-align:center;max-width:60ch}@keyframes wr-lightbox-viewer-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}\n"] }]
236
+ }], ctorParameters: () => [], propDecorators: { openLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "openLabel", required: false }] }], closeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeLabel", required: false }] }], src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], preview: [{ type: i0.Input, args: [{ isSignal: true, alias: "preview", required: false }] }], disablePreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "disablePreview", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], aspectRatio: [{ type: i0.Input, args: [{ isSignal: true, alias: "aspectRatio", required: false }] }], panelTpl: [{ type: i0.ViewChild, args: ['viewerTpl', { isSignal: true }] }] } });
210
237
 
211
238
  /**
212
239
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"ngwr-lightbox.mjs","sources":["../../../projects/lib/lightbox/lightbox.ts","../../../projects/lib/lightbox/lightbox.html","../../../projects/lib/lightbox/ngwr-lightbox.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { type ConfigurableFocusTrap, ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { type OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport type { TemplateRef } from '@angular/core';\nimport {\n Component,\n DestroyRef,\n ViewContainerRef,\n ViewEncapsulation,\n computed,\n effect,\n inject,\n input,\n signal,\n viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { useI18nText } from 'ngwr/i18n';\nimport { WR_OVERLAY } from 'ngwr/overlay';\n\n/**\n * Image with click-to-zoom lightbox. The thumbnail is a plain `<img>`\n * with whatever sizing/`object-fit` you give it; clicking opens a CDK\n * overlay showing the full image, with Escape + close button + backdrop\n * to dismiss.\n *\n * @example\n * ```html\n * <wr-lightbox\n * src=\"/photo.jpg\"\n * alt=\"Mountain\"\n * style=\"width: 16rem; height: 10rem; object-fit: cover\"\n * />\n * ```\n *\n * @see https://ngwr.dev/reference/components/lightbox\n */\n@Component({\n selector: 'wr-lightbox',\n templateUrl: './lightbox.html',\n styleUrl: './lightbox.scss',\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'classes()',\n '[style.aspect-ratio]': 'aspectRatio()',\n },\n})\nexport class WrLightbox {\n /** Accessible name. Falls back to `image.close`, then `'Close preview'`. */\n readonly closeLabel = input<string | null>(null);\n\n protected readonly resolvedCloseLabel = useI18nText(this.closeLabel, 'image.close', 'Close preview');\n\n /** Image source. */\n readonly src = input.required<string>();\n\n /** Alt text. Required for a11y; falls back to an empty string. @default '' */\n readonly alt = input<string>('');\n\n /** Optional preview src — shown until the full image loads. */\n readonly preview = input<string | null>(null);\n\n /** Disable the click-to-zoom lightbox. @default false */\n readonly disablePreview = input(false, { transform: coerceBooleanProperty });\n\n /** Caption shown under the full image in the lightbox. */\n readonly caption = input<string>('');\n\n /**\n * Reserve space before the image resolves by fixing the thumbnail's\n * `aspect-ratio` (e.g. `'16 / 9'`, `'4 / 3'`, or a number like `1.5`).\n * Prevents the layout jump when the intrinsic image size isn't known up\n * front — pair it with a `width` and the box keeps its height from first\n * paint. @default null\n */\n readonly aspectRatio = input<string | number | null>(null);\n\n protected readonly open = signal(false);\n protected readonly loaded = signal(false);\n\n protected readonly classes = computed(() => {\n const parts = ['wr-lightbox'];\n if (this.open()) parts.push('wr-lightbox--open');\n if (!this.loaded()) parts.push('wr-lightbox--loading');\n return parts.join(' ');\n });\n\n // Query by name — `@if` blocks register their own TemplateRefs, so an\n // unqualified TemplateRef query would grab the thumbnail branch instead.\n protected readonly panelTpl = viewChild.required<TemplateRef<unknown>>('viewerTpl');\n\n private readonly overlay = inject(WR_OVERLAY);\n private readonly vcr = inject(ViewContainerRef);\n private readonly destroyRef = inject(DestroyRef);\n private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n private focusTrap: ConfigurableFocusTrap | null = null;\n private previouslyFocused: HTMLElement | null = null;\n private overlayRef: OverlayRef | null = null;\n\n constructor() {\n // Destroying the component while the viewer is open removes the projected\n // content (the portal uses this component's ViewContainerRef) but leaves the\n // overlay pane and its full-screen backdrop behind, with page scroll still\n // blocked. Dispose the overlay explicitly.\n this.destroyRef.onDestroy(() => this.closeOverlay());\n\n effect(() => {\n if (this.open()) this.openOverlay();\n else this.closeOverlay();\n });\n }\n\n protected onClick(): void {\n if (this.disablePreview()) return;\n this.open.set(true);\n }\n\n protected onClose(): void {\n this.open.set(false);\n }\n\n // Swipe-down-to-dismiss on the open viewer. The image follows the finger and\n // fades; releasing past ~20% of the viewer height closes it.\n private viewerStartY = 0;\n private viewerSwiping = false;\n\n protected onViewerSwipeStart(event: TouchEvent): void {\n const touch = event.touches[0];\n if (!touch) return;\n this.viewerStartY = touch.clientY;\n this.viewerSwiping = true;\n }\n\n protected onViewerSwipeMove(event: TouchEvent, viewer: HTMLElement): void {\n if (!this.viewerSwiping) return;\n const touch = event.touches[0];\n if (!touch) return;\n const dy = touch.clientY - this.viewerStartY;\n if (dy <= 0) {\n viewer.style.transform = '';\n viewer.style.opacity = '';\n return;\n }\n event.preventDefault();\n viewer.style.transition = 'none';\n viewer.style.transform = `translateY(${dy}px)`;\n viewer.style.opacity = String(Math.max(0.3, 1 - dy / (viewer.offsetHeight || 1)));\n }\n\n protected onViewerSwipeEnd(event: TouchEvent, viewer: HTMLElement): void {\n if (!this.viewerSwiping) return;\n this.viewerSwiping = false;\n const touch = event.changedTouches[0];\n const dy = touch ? touch.clientY - this.viewerStartY : 0;\n if (dy > (viewer.offsetHeight || 0) * 0.2) {\n this.onClose();\n } else {\n viewer.style.transition = '';\n viewer.style.transform = '';\n viewer.style.opacity = '';\n }\n }\n\n protected onLoad(): void {\n this.loaded.set(true);\n }\n\n // Overlay\n\n private openOverlay(): void {\n if (this.overlayRef) return;\n\n this.overlayRef = this.overlay.create({\n hasBackdrop: true,\n backdropClass: 'wr-lightbox-backdrop',\n positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically(),\n scrollStrategy: this.overlay.scrollStrategies.block(),\n panelClass: 'wr-lightbox-overlay',\n });\n\n const portal = new TemplatePortal(this.panelTpl(), this.vcr);\n this.overlayRef.attach(portal);\n\n // The viewer declares role=\"dialog\" + aria-modal=\"true\", which promises the\n // rest of the page is inert. Without a focus trap that promise is a lie:\n // Tab walks straight out of the viewer into the page behind the backdrop.\n const active = document.activeElement;\n this.previouslyFocused = active instanceof HTMLElement ? active : null;\n this.focusTrap = this.focusTrapFactory.create(this.overlayRef.overlayElement);\n void this.focusTrap.focusInitialElementWhenReady();\n\n this.overlayRef\n .backdropClick()\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => this.open.set(false));\n\n this.overlayRef\n .keydownEvents()\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(event => {\n if (event.key === 'Escape') {\n event.preventDefault();\n this.open.set(false);\n }\n });\n }\n\n private closeOverlay(): void {\n if (!this.overlayRef) return;\n this.focusTrap?.destroy();\n this.focusTrap = null;\n const restore = this.previouslyFocused;\n this.previouslyFocused = null;\n this.overlayRef.dispose();\n this.overlayRef = null;\n // Send focus back where it came from, or it lands on <body> and the user\n // has to tab from the top of the page again.\n if (restore && typeof restore.focus === 'function') restore.focus();\n }\n}\n","@if (disablePreview()) {\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onLoad()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n} @else {\n <button type=\"button\" class=\"wr-lightbox__trigger\" [attr.aria-label]=\"alt() || 'Open preview'\" (click)=\"onClick()\">\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onLoad()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n </button>\n}\n\n<ng-template #viewerTpl>\n <div\n #viewer\n class=\"wr-lightbox-viewer\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"alt() || 'Image preview'\"\n (touchstart)=\"onViewerSwipeStart($event)\"\n (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n >\n <button\n type=\"button\"\n class=\"wr-lightbox-viewer__close\"\n [attr.aria-label]=\"resolvedCloseLabel()\"\n (click)=\"onClose()\"\n (keydown.enter)=\"onClose()\"\n (keydown.space)=\"onClose()\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n </button>\n <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" />\n @if (caption()) {\n <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n }\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ngwr-lightbox.mjs","sources":["../../../projects/lib/lightbox/lightbox.ts","../../../projects/lib/lightbox/lightbox.html","../../../projects/lib/lightbox/ngwr-lightbox.ts"],"sourcesContent":["/**\n * @license\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE\n */\n\nimport { type ConfigurableFocusTrap, ConfigurableFocusTrapFactory } from '@angular/cdk/a11y';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { type OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport type { TemplateRef } from '@angular/core';\nimport {\n Component,\n DestroyRef,\n ViewContainerRef,\n ViewEncapsulation,\n computed,\n effect,\n inject,\n input,\n signal,\n viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { useI18nText } from 'ngwr/i18n';\nimport { WR_OVERLAY } from 'ngwr/overlay';\n\n/**\n * Image with click-to-zoom lightbox. The thumbnail is a plain `<img>`\n * with whatever sizing/`object-fit` you give it; clicking opens a CDK\n * overlay showing the full image, with Escape + close button + backdrop\n * to dismiss.\n *\n * @example\n * ```html\n * <wr-lightbox\n * src=\"/photo.jpg\"\n * alt=\"Mountain\"\n * style=\"width: 16rem; height: 10rem; object-fit: cover\"\n * />\n * ```\n *\n * @see https://ngwr.dev/reference/components/lightbox\n */\n@Component({\n selector: 'wr-lightbox',\n templateUrl: './lightbox.html',\n styleUrl: './lightbox.scss',\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'classes()',\n '[style.aspect-ratio]': 'aspectRatio()',\n },\n})\nexport class WrLightbox {\n /** Accessible name. Falls back to `image.close`, then `'Close preview'`. */\n /** Accessible name of the thumbnail button. Falls back to `alt`, then `image.open`. */\n readonly openLabel = input<string | null>(null);\n\n readonly closeLabel = input<string | null>(null);\n\n protected readonly resolvedCloseLabel = useI18nText(this.closeLabel, 'image.close', 'Close preview');\n\n /** Image source. */\n readonly src = input.required<string>();\n\n /** Alt text. Required for a11y; falls back to an empty string. @default '' */\n readonly alt = input<string>('');\n\n /**\n * Lighter source for the THUMBNAIL — a small or blurred copy, so the grid does not\n * pull full-size images. The viewer always shows `src`; the thumbnail does not swap\n * to it later.\n */\n readonly preview = input<string | null>(null);\n\n // Both of these were hard-coded English literals in the template, next to a catalog\n // that already carried `image.open` translated and unread. `useI18nText` already\n // does the whole chain — a non-empty binding wins, then the catalog, then the\n // English default — so the alt text (which describes the actual picture) is what\n // gets forwarded, with `openLabel` ahead of it as the explicit override.\n protected readonly resolvedOpenLabel = useI18nText(\n computed(() => {\n // Not `??`: an empty `openLabel` is no label at all, so it has to fall through\n // to the alt text rather than winning as an empty string.\n const explicit = this.openLabel();\n if (explicit) return explicit;\n return this.alt();\n }),\n 'image.open',\n 'Open preview'\n );\n\n protected readonly resolvedViewerLabel = useI18nText(this.alt, 'image.viewer', 'Image preview');\n\n /** Disable the click-to-zoom lightbox. @default false */\n readonly disablePreview = input(false, { transform: coerceBooleanProperty });\n\n /** Caption shown under the full image in the lightbox. */\n readonly caption = input<string>('');\n\n /**\n * Reserve space before the image resolves by fixing the thumbnail's\n * `aspect-ratio` (e.g. `'16 / 9'`, `'4 / 3'`, or a number like `1.5`).\n * Prevents the layout jump when the intrinsic image size isn't known up\n * front — pair it with a `width` and the box keeps its height from first\n * paint. @default null\n */\n readonly aspectRatio = input<string | number | null>(null);\n\n protected readonly open = signal(false);\n protected readonly loaded = signal(false);\n\n protected readonly classes = computed(() => {\n const parts = ['wr-lightbox'];\n if (this.open()) parts.push('wr-lightbox--open');\n if (!this.loaded()) parts.push('wr-lightbox--loading');\n return parts.join(' ');\n });\n\n // Query by name — `@if` blocks register their own TemplateRefs, so an\n // unqualified TemplateRef query would grab the thumbnail branch instead.\n protected readonly panelTpl = viewChild.required<TemplateRef<unknown>>('viewerTpl');\n\n private readonly overlay = inject(WR_OVERLAY);\n private readonly vcr = inject(ViewContainerRef);\n private readonly destroyRef = inject(DestroyRef);\n private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n private focusTrap: ConfigurableFocusTrap | null = null;\n private previouslyFocused: HTMLElement | null = null;\n private overlayRef: OverlayRef | null = null;\n\n constructor() {\n // Destroying the component while the viewer is open removes the projected\n // content (the portal uses this component's ViewContainerRef) but leaves the\n // overlay pane and its full-screen backdrop behind, with page scroll still\n // blocked. Dispose the overlay explicitly.\n this.destroyRef.onDestroy(() => this.closeOverlay());\n\n effect(() => {\n if (this.open()) this.openOverlay();\n else this.closeOverlay();\n });\n }\n\n protected onClick(): void {\n if (this.disablePreview()) return;\n this.open.set(true);\n }\n\n protected onClose(): void {\n this.open.set(false);\n }\n\n // Swipe-down-to-dismiss on the open viewer. The image follows the finger and\n // fades; releasing past ~20% of the viewer height closes it.\n private viewerStartY = 0;\n private viewerSwiping = false;\n\n protected onViewerSwipeStart(event: TouchEvent): void {\n const touch = event.touches[0];\n if (!touch) return;\n this.viewerStartY = touch.clientY;\n this.viewerSwiping = true;\n }\n\n protected onViewerSwipeMove(event: TouchEvent, viewer: HTMLElement): void {\n if (!this.viewerSwiping) return;\n const touch = event.touches[0];\n if (!touch) return;\n const dy = touch.clientY - this.viewerStartY;\n if (dy <= 0) {\n viewer.style.transform = '';\n viewer.style.opacity = '';\n return;\n }\n event.preventDefault();\n viewer.style.transition = 'none';\n viewer.style.transform = `translateY(${dy}px)`;\n viewer.style.opacity = String(Math.max(0.3, 1 - dy / (viewer.offsetHeight || 1)));\n }\n\n protected onViewerSwipeEnd(event: TouchEvent, viewer: HTMLElement): void {\n if (!this.viewerSwiping) return;\n this.viewerSwiping = false;\n const touch = event.changedTouches[0];\n const dy = touch ? touch.clientY - this.viewerStartY : 0;\n if (dy > (viewer.offsetHeight || 0) * 0.2) {\n this.onClose();\n } else {\n viewer.style.transition = '';\n viewer.style.transform = '';\n viewer.style.opacity = '';\n }\n }\n\n /**\n * The thumbnail has settled, one way or the other. A failure counts: `--loading`\n * animates a shimmer AND sets `opacity: 0` on the image, so a broken `src` with no\n * error path left an invisible box shimmering for ever instead of showing its alt\n * text.\n */\n protected onSettled(): void {\n this.loaded.set(true);\n }\n\n // Overlay\n\n private openOverlay(): void {\n if (this.overlayRef) return;\n\n this.overlayRef = this.overlay.create({\n hasBackdrop: true,\n backdropClass: 'wr-lightbox-backdrop',\n positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically(),\n scrollStrategy: this.overlay.scrollStrategies.block(),\n panelClass: 'wr-lightbox-overlay',\n });\n\n const portal = new TemplatePortal(this.panelTpl(), this.vcr);\n this.overlayRef.attach(portal);\n\n // The viewer declares role=\"dialog\" + aria-modal=\"true\", which promises the\n // rest of the page is inert. Without a focus trap that promise is a lie:\n // Tab walks straight out of the viewer into the page behind the backdrop.\n const active = document.activeElement;\n this.previouslyFocused = active instanceof HTMLElement ? active : null;\n this.focusTrap = this.focusTrapFactory.create(this.overlayRef.overlayElement);\n void this.focusTrap.focusInitialElementWhenReady();\n\n this.overlayRef\n .backdropClick()\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => this.open.set(false));\n\n this.overlayRef\n .keydownEvents()\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(event => {\n if (event.key === 'Escape') {\n event.preventDefault();\n this.open.set(false);\n }\n });\n }\n\n private closeOverlay(): void {\n if (!this.overlayRef) return;\n this.focusTrap?.destroy();\n this.focusTrap = null;\n const restore = this.previouslyFocused;\n this.previouslyFocused = null;\n this.overlayRef.dispose();\n this.overlayRef = null;\n // Send focus back where it came from, or it lands on <body> and the user\n // has to tab from the top of the page again.\n if (restore && typeof restore.focus === 'function') restore.focus();\n }\n}\n","@if (disablePreview()) {\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onSettled()\"\n (error)=\"onSettled()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n} @else {\n <button type=\"button\" class=\"wr-lightbox__trigger\" [attr.aria-label]=\"resolvedOpenLabel()\" (click)=\"onClick()\">\n <img\n class=\"wr-lightbox__thumb\"\n [src]=\"preview() || src()\"\n [alt]=\"alt()\"\n (load)=\"onSettled()\"\n (error)=\"onSettled()\"\n loading=\"lazy\"\n decoding=\"async\"\n />\n </button>\n}\n\n<ng-template #viewerTpl>\n <div\n #viewer\n class=\"wr-lightbox-viewer\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedViewerLabel()\"\n (touchstart)=\"onViewerSwipeStart($event)\"\n (touchmove)=\"onViewerSwipeMove($event, viewer)\"\n (touchend)=\"onViewerSwipeEnd($event, viewer)\"\n (touchcancel)=\"onViewerSwipeEnd($event, viewer)\"\n >\n <button\n type=\"button\"\n class=\"wr-lightbox-viewer__close\"\n [attr.aria-label]=\"resolvedCloseLabel()\"\n (click)=\"onClose()\"\n (keydown.enter)=\"onClose()\"\n (keydown.space)=\"onClose()\"\n >\n <svg\n class=\"wr-icon__svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n aria-hidden=\"true\"\n >\n <path d=\"M18 6 6 18\" />\n <path d=\"m6 6 12 12\" />\n </svg>\n </button>\n <!--\n Styled `cursor: zoom-out`, which is a promise: clicking the image closes. A\n REDUNDANT mouse affordance — the close button, Escape, the backdrop and\n swipe-down all do the same thing and all reach a keyboard — so the image stays\n out of the tab order rather than becoming a second close stop.\n -->\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events,@angular-eslint/template/interactive-supports-focus -->\n <img class=\"wr-lightbox-viewer__full\" [src]=\"src()\" [alt]=\"alt()\" (click)=\"onClose()\" />\n @if (caption()) {\n <div class=\"wr-lightbox-viewer__caption\">{{ caption() }}</div>\n }\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;AAAA;;;;;AAKG;AAwBH;;;;;;;;;;;;;;;;AAgBG;MAWU,UAAU,CAAA;;;IAGZ,SAAS,GAAG,KAAK,CAAgB,IAAI;kFAAC;IAEtC,UAAU,GAAG,KAAK,CAAgB,IAAI;mFAAC;IAE7B,kBAAkB,GAAG,WAAW,CAAC,IAAI,CAAC,UAAU,EAAE,aAAa,EAAE,eAAe,CAAC;;IAG3F,GAAG,GAAG,KAAK,CAAC,QAAQ;4EAAU;;IAG9B,GAAG,GAAG,KAAK,CAAS,EAAE;4EAAC;AAEhC;;;;AAIG;IACM,OAAO,GAAG,KAAK,CAAgB,IAAI;gFAAC;;;;;;AAO1B,IAAA,iBAAiB,GAAG,WAAW,CAChD,QAAQ,CAAC,MAAK;;;AAGZ,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE;AACjC,QAAA,IAAI,QAAQ;AAAE,YAAA,OAAO,QAAQ;AAC7B,QAAA,OAAO,IAAI,CAAC,GAAG,EAAE;AACnB,IAAA,CAAC,CAAC,EACF,YAAY,EACZ,cAAc,CACf;IAEkB,mBAAmB,GAAG,WAAW,CAAC,IAAI,CAAC,GAAG,EAAE,cAAc,EAAE,eAAe,CAAC;;IAGtF,cAAc,GAAG,KAAK,CAAC,KAAK,sFAAI,SAAS,EAAE,qBAAqB,EAAA,CAAG;;IAGnE,OAAO,GAAG,KAAK,CAAS,EAAE;gFAAC;AAEpC;;;;;;AAMG;IACM,WAAW,GAAG,KAAK,CAAyB,IAAI;oFAAC;IAEvC,IAAI,GAAG,MAAM,CAAC,KAAK;6EAAC;IACpB,MAAM,GAAG,MAAM,CAAC,KAAK;+EAAC;AAEtB,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;AACzC,QAAA,MAAM,KAAK,GAAG,CAAC,aAAa,CAAC;QAC7B,IAAI,IAAI,CAAC,IAAI,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC;AAChD,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;AAAE,YAAA,KAAK,CAAC,IAAI,CAAC,sBAAsB,CAAC;AACtD,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC;IACxB,CAAC;gFAAC;;;AAIiB,IAAA,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAuB,WAAW;iFAAC;AAElE,IAAA,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC;AAC5B,IAAA,GAAG,GAAG,MAAM,CAAC,gBAAgB,CAAC;AAC9B,IAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;AAC/B,IAAA,gBAAgB,GAAG,MAAM,CAAC,4BAA4B,CAAC;IAChE,SAAS,GAAiC,IAAI;IAC9C,iBAAiB,GAAuB,IAAI;IAC5C,UAAU,GAAsB,IAAI;AAE5C,IAAA,WAAA,GAAA;;;;;AAKE,QAAA,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC;QAEpD,MAAM,CAAC,MAAK;YACV,IAAI,IAAI,CAAC,IAAI,EAAE;gBAAE,IAAI,CAAC,WAAW,EAAE;;gBAC9B,IAAI,CAAC,YAAY,EAAE;AAC1B,QAAA,CAAC,CAAC;IACJ;IAEU,OAAO,GAAA;QACf,IAAI,IAAI,CAAC,cAAc,EAAE;YAAE;AAC3B,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC;IACrB;IAEU,OAAO,GAAA;AACf,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC;IACtB;;;IAIQ,YAAY,GAAG,CAAC;IAChB,aAAa,GAAG,KAAK;AAEnB,IAAA,kBAAkB,CAAC,KAAiB,EAAA;QAC5C,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC9B,QAAA,IAAI,CAAC,KAAK;YAAE;AACZ,QAAA,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,OAAO;AACjC,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI;IAC3B;IAEU,iBAAiB,CAAC,KAAiB,EAAE,MAAmB,EAAA;QAChE,IAAI,CAAC,IAAI,CAAC,aAAa;YAAE;QACzB,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC9B,QAAA,IAAI,CAAC,KAAK;YAAE;QACZ,MAAM,EAAE,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,YAAY;AAC5C,QAAA,IAAI,EAAE,IAAI,CAAC,EAAE;AACX,YAAA,MAAM,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE;AAC3B,YAAA,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE;YACzB;QACF;QACA,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;QAChC,MAAM,CAAC,KAAK,CAAC,SAAS,GAAG,CAAA,WAAA,EAAc,EAAE,KAAK;QAC9C,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,IAAI,MAAM,CAAC,YAAY,IAAI,CAAC,CAAC,CAAC,CAAC;IACnF;IAEU,gBAAgB,CAAC,KAAiB,EAAE,MAAmB,EAAA;QAC/D,IAAI,CAAC,IAAI,CAAC,aAAa;YAAE;AACzB,QAAA,IAAI,CAAC,aAAa,GAAG,KAAK;QAC1B,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC;AACrC,QAAA,MAAM,EAAE,GAAG,KAAK,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,YAAY,GAAG,CAAC;AACxD,QAAA,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC,YAAY,IAAI,CAAC,IAAI,GAAG,EAAE;YACzC,IAAI,CAAC,OAAO,EAAE;QAChB;aAAO;AACL,YAAA,MAAM,CAAC,KAAK,CAAC,UAAU,GAAG,EAAE;AAC5B,YAAA,MAAM,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE;AAC3B,YAAA,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,EAAE;QAC3B;IACF;AAEA;;;;;AAKG;IACO,SAAS,GAAA;AACjB,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;IACvB;;IAIQ,WAAW,GAAA;QACjB,IAAI,IAAI,CAAC,UAAU;YAAE;QAErB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;AACpC,YAAA,WAAW,EAAE,IAAI;AACjB,YAAA,aAAa,EAAE,sBAAsB;AACrC,YAAA,gBAAgB,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,kBAAkB,EAAE,CAAC,gBAAgB,EAAE;YAC1F,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,KAAK,EAAE;AACrD,YAAA,UAAU,EAAE,qBAAqB;AAClC,SAAA,CAAC;AAEF,QAAA,MAAM,MAAM,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC;AAC5D,QAAA,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC;;;;AAK9B,QAAA,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa;AACrC,QAAA,IAAI,CAAC,iBAAiB,GAAG,MAAM,YAAY,WAAW,GAAG,MAAM,GAAG,IAAI;AACtE,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,cAAc,CAAC;AAC7E,QAAA,KAAK,IAAI,CAAC,SAAS,CAAC,4BAA4B,EAAE;AAElD,QAAA,IAAI,CAAC;AACF,aAAA,aAAa;AACb,aAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;AACxC,aAAA,SAAS,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AAExC,QAAA,IAAI,CAAC;AACF,aAAA,aAAa;AACb,aAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC;aACxC,SAAS,CAAC,KAAK,IAAG;AACjB,YAAA,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;gBAC1B,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC;YACtB;AACF,QAAA,CAAC,CAAC;IACN;IAEQ,YAAY,GAAA;QAClB,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE;AACtB,QAAA,IAAI,CAAC,SAAS,EAAE,OAAO,EAAE;AACzB,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI;AACrB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,iBAAiB;AACtC,QAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;AAC7B,QAAA,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE;AACzB,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI;;;AAGtB,QAAA,IAAI,OAAO,IAAI,OAAO,OAAO,CAAC,KAAK,KAAK,UAAU;YAAE,OAAO,CAAC,KAAK,EAAE;IACrE;uGA3MW,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAU,wyCCxDvB,y0EAwEA,EAAA,MAAA,EAAA,CAAA,oojBAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDhBa,UAAU,EAAA,UAAA,EAAA,CAAA;kBAVtB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,aAAA,EAGR,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,SAAS,EAAE,WAAW;AACtB,wBAAA,sBAAsB,EAAE,eAAe;AACxC,qBAAA,EAAA,QAAA,EAAA,y0EAAA,EAAA,MAAA,EAAA,CAAA,oojBAAA,CAAA,EAAA;+1BAsEsE,WAAW,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE5HpF;;AAEG;;;;"}
@@ -1,6 +1,7 @@
1
1
  import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
2
2
  import * as i0 from '@angular/core';
3
3
  import { input, inject, ElementRef, signal, computed, ViewEncapsulation, Component } from '@angular/core';
4
+ import { useI18nText } from 'ngwr/i18n';
4
5
 
5
6
  /**
6
7
  * @license
@@ -35,6 +36,14 @@ const FALLBACK_COLORS = [
35
36
  class WrLineChart {
36
37
  series = input([], /* @ts-ignore */
37
38
  ...(ngDevMode ? [{ debugName: "series" }] : /* istanbul ignore next */ []));
39
+ /**
40
+ * Accessible name of the chart. The legend carries the series NAMES only — the numbers
41
+ * are nowhere in text — so without this the plot is nothing at all to a screen reader.
42
+ * Falls back to `lineChart.label`.
43
+ */
44
+ ariaLabel = input(null, /* @ts-ignore */
45
+ ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
46
+ resolvedAriaLabel = useI18nText(this.ariaLabel, 'lineChart.label', 'Line chart');
38
47
  /** Labels for the X axis (one per data point). */
39
48
  xLabels = input([], /* @ts-ignore */
40
49
  ...(ngDevMode ? [{ debugName: "xLabels" }] : /* istanbul ignore next */ []));
@@ -56,7 +65,11 @@ class WrLineChart {
56
65
  ...(ngDevMode ? [{ debugName: "hoveredIndex" }] : /* istanbul ignore next */ []));
57
66
  resolvedSeries = computed(() => this.series().map((s, i) => ({
58
67
  label: s.label,
59
- data: s.data,
68
+ // Non-finite points are dropped, not scaled. `Math.min`/`Math.max` over the pooled
69
+ // data are both NaN as soon as one datum is, so every coordinate in EVERY series
70
+ // became `NaN` — invalid path geometry, and the whole chart vanished rather than the
71
+ // one bad point.
72
+ data: s.data.filter(v => Number.isFinite(v)),
60
73
  color: s.color ?? FALLBACK_COLORS[i % FALLBACK_COLORS.length],
61
74
  })), /* @ts-ignore */
62
75
  ...(ngDevMode ? [{ debugName: "resolvedSeries" }] : /* istanbul ignore next */ []));
@@ -161,12 +174,12 @@ class WrLineChart {
161
174
  // Convenience accessor so the host can be referenced from the template.
162
175
  hostEl = this.host.nativeElement;
163
176
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrLineChart, deps: [], target: i0.ɵɵFactoryTarget.Component });
164
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrLineChart, isStandalone: true, selector: "wr-line-chart", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, xLabels: { classPropertyName: "xLabels", publicName: "xLabels", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, showGrid: { classPropertyName: "showGrid", publicName: "showGrid", isSignal: true, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: true, isRequired: false, transformFunction: null }, showDots: { classPropertyName: "showDots", publicName: "showDots", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-line-chart" }, ngImport: i0, template: "@let hovered = hoveredIndex();\n@if (showLegend() && resolvedSeries().length > 0) {\n <ul class=\"wr-line-chart__legend\">\n @for (s of resolvedSeries(); track s.label) {\n <li class=\"wr-line-chart__legend-item\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"s.color\"></span>\n <span>{{ s.label }}</span>\n </li>\n }\n </ul>\n}\n\n<div class=\"wr-line-chart__plot\" [style.height.px]=\"height()\">\n <svg\n [attr.viewBox]=\"viewBox()\"\n preserveAspectRatio=\"none\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerleave)=\"onPointerLeave()\"\n >\n @if (showGrid()) {\n @for (tick of yTicks(); track tick.value) {\n <line\n [attr.x1]=\"padding.left\"\n [attr.x2]=\"vbW - padding.right\"\n [attr.y1]=\"tick.y\"\n [attr.y2]=\"tick.y\"\n stroke=\"rgba(var(--wr-color-light-rgb), 0.7)\"\n stroke-width=\"1\"\n vector-effect=\"non-scaling-stroke\"\n />\n <text\n [attr.x]=\"padding.left - 6\"\n [attr.y]=\"tick.y + 4\"\n text-anchor=\"end\"\n fill=\"var(--wr-color-on-surface-muted)\"\n font-size=\"10\"\n font-family=\"var(--wr-font-family-base)\"\n >\n {{ formatTick(tick.value) }}\n </text>\n }\n }\n\n @for (s of resolvedSeries(); track s.label) {\n <path\n [attr.d]=\"pathFor(s)\"\n fill=\"none\"\n [attr.stroke]=\"s.color\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n vector-effect=\"non-scaling-stroke\"\n />\n @if (showDots()) {\n @for (v of s.data; track $index; let i = $index) {\n <circle [attr.cx]=\"pointX(i)\" [attr.cy]=\"pointY(v)\" r=\"3\" [attr.fill]=\"s.color\" />\n }\n }\n }\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <line\n [attr.x1]=\"pointX(hovered)\"\n [attr.x2]=\"pointX(hovered)\"\n [attr.y1]=\"padding.top\"\n [attr.y2]=\"vbH - padding.bottom\"\n stroke=\"var(--wr-color-medium)\"\n stroke-width=\"1\"\n stroke-dasharray=\"3 3\"\n vector-effect=\"non-scaling-stroke\"\n />\n @for (p of hoverPoints(); track p.label) {\n <circle\n [attr.cx]=\"p.x\"\n [attr.cy]=\"p.y\"\n r=\"5\"\n fill=\"var(--wr-color-white)\"\n [attr.stroke]=\"p.color\"\n stroke-width=\"2\"\n />\n }\n }\n </svg>\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <div class=\"wr-line-chart__tooltip\" [style.left.%]=\"(pointX(hovered) / vbW) * 100\" [style.top.px]=\"padding.top\">\n <div class=\"wr-line-chart__tooltip-label\">{{ hoverLabel() }}</div>\n @for (p of hoverPoints(); track p.label) {\n <div class=\"wr-line-chart__tooltip-row\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"p.color\"></span>\n <span class=\"wr-line-chart__tooltip-name\">{{ p.label }}</span>\n <span class=\"wr-line-chart__tooltip-value\">{{ p.value }}</span>\n </div>\n }\n </div>\n }\n</div>\n\n@if (xLabels().length > 0) {\n <div class=\"wr-line-chart__x-labels\">\n @for (label of xLabels(); track $index) {\n <span class=\"wr-line-chart__x-label\">{{ label }}</span>\n }\n </div>\n}\n", encapsulation: i0.ViewEncapsulation.None });
177
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: WrLineChart, isStandalone: true, selector: "wr-line-chart", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, xLabels: { classPropertyName: "xLabels", publicName: "xLabels", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, showGrid: { classPropertyName: "showGrid", publicName: "showGrid", isSignal: true, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: true, isRequired: false, transformFunction: null }, showDots: { classPropertyName: "showDots", publicName: "showDots", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-line-chart" }, ngImport: i0, template: "@let hovered = hoveredIndex();\n@if (showLegend() && resolvedSeries().length > 0) {\n <ul class=\"wr-line-chart__legend\">\n @for (s of resolvedSeries(); track s.label) {\n <li class=\"wr-line-chart__legend-item\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"s.color\"></span>\n <span>{{ s.label }}</span>\n </li>\n }\n </ul>\n}\n\n<div class=\"wr-line-chart__plot\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\" [style.height.px]=\"height()\">\n <svg\n [attr.viewBox]=\"viewBox()\"\n preserveAspectRatio=\"none\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerleave)=\"onPointerLeave()\"\n >\n @if (showGrid()) {\n @for (tick of yTicks(); track tick.value) {\n <line\n class=\"wr-line-chart__grid-line\"\n [attr.x1]=\"padding.left\"\n [attr.x2]=\"vbW - padding.right\"\n [attr.y1]=\"tick.y\"\n [attr.y2]=\"tick.y\"\n stroke=\"rgba(var(--wr-color-light-rgb), 0.7)\"\n stroke-width=\"1\"\n vector-effect=\"non-scaling-stroke\"\n />\n <text\n class=\"wr-line-chart__tick\"\n [attr.x]=\"padding.left - 6\"\n [attr.y]=\"tick.y + 4\"\n text-anchor=\"end\"\n fill=\"var(--wr-color-on-surface-muted)\"\n font-size=\"10\"\n font-family=\"var(--wr-font-family-base)\"\n >\n {{ formatTick(tick.value) }}\n </text>\n }\n }\n\n @for (s of resolvedSeries(); track s.label) {\n <path\n class=\"wr-line-chart__line\"\n [attr.d]=\"pathFor(s)\"\n fill=\"none\"\n [attr.stroke]=\"s.color\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n vector-effect=\"non-scaling-stroke\"\n />\n @if (showDots()) {\n @for (v of s.data; track $index; let i = $index) {\n <circle class=\"wr-line-chart__dot\" [attr.cx]=\"pointX(i)\" [attr.cy]=\"pointY(v)\" r=\"3\" [attr.fill]=\"s.color\" />\n }\n }\n }\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <line\n class=\"wr-line-chart__crosshair\"\n [attr.x1]=\"pointX(hovered)\"\n [attr.x2]=\"pointX(hovered)\"\n [attr.y1]=\"padding.top\"\n [attr.y2]=\"vbH - padding.bottom\"\n stroke=\"var(--wr-color-medium)\"\n stroke-width=\"1\"\n stroke-dasharray=\"3 3\"\n vector-effect=\"non-scaling-stroke\"\n />\n @for (p of hoverPoints(); track p.label) {\n <circle\n [attr.cx]=\"p.x\"\n [attr.cy]=\"p.y\"\n r=\"5\"\n fill=\"var(--wr-color-white)\"\n [attr.stroke]=\"p.color\"\n stroke-width=\"2\"\n />\n }\n }\n </svg>\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <div class=\"wr-line-chart__tooltip\" [style.left.%]=\"(pointX(hovered) / vbW) * 100\" [style.top.px]=\"padding.top\">\n <div class=\"wr-line-chart__tooltip-label\">{{ hoverLabel() }}</div>\n @for (p of hoverPoints(); track p.label) {\n <div class=\"wr-line-chart__tooltip-row\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"p.color\"></span>\n <span class=\"wr-line-chart__tooltip-name\">{{ p.label }}</span>\n <span class=\"wr-line-chart__tooltip-value\">{{ p.value }}</span>\n </div>\n }\n </div>\n }\n</div>\n\n@if (xLabels().length > 0) {\n <div class=\"wr-line-chart__x-labels\">\n @for (label of xLabels(); track $index) {\n <span class=\"wr-line-chart__x-label\">{{ label }}</span>\n }\n </div>\n}\n", encapsulation: i0.ViewEncapsulation.None });
165
178
  }
166
179
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: WrLineChart, decorators: [{
167
180
  type: Component,
168
- args: [{ selector: 'wr-line-chart', encapsulation: ViewEncapsulation.None, host: { class: 'wr-line-chart' }, template: "@let hovered = hoveredIndex();\n@if (showLegend() && resolvedSeries().length > 0) {\n <ul class=\"wr-line-chart__legend\">\n @for (s of resolvedSeries(); track s.label) {\n <li class=\"wr-line-chart__legend-item\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"s.color\"></span>\n <span>{{ s.label }}</span>\n </li>\n }\n </ul>\n}\n\n<div class=\"wr-line-chart__plot\" [style.height.px]=\"height()\">\n <svg\n [attr.viewBox]=\"viewBox()\"\n preserveAspectRatio=\"none\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerleave)=\"onPointerLeave()\"\n >\n @if (showGrid()) {\n @for (tick of yTicks(); track tick.value) {\n <line\n [attr.x1]=\"padding.left\"\n [attr.x2]=\"vbW - padding.right\"\n [attr.y1]=\"tick.y\"\n [attr.y2]=\"tick.y\"\n stroke=\"rgba(var(--wr-color-light-rgb), 0.7)\"\n stroke-width=\"1\"\n vector-effect=\"non-scaling-stroke\"\n />\n <text\n [attr.x]=\"padding.left - 6\"\n [attr.y]=\"tick.y + 4\"\n text-anchor=\"end\"\n fill=\"var(--wr-color-on-surface-muted)\"\n font-size=\"10\"\n font-family=\"var(--wr-font-family-base)\"\n >\n {{ formatTick(tick.value) }}\n </text>\n }\n }\n\n @for (s of resolvedSeries(); track s.label) {\n <path\n [attr.d]=\"pathFor(s)\"\n fill=\"none\"\n [attr.stroke]=\"s.color\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n vector-effect=\"non-scaling-stroke\"\n />\n @if (showDots()) {\n @for (v of s.data; track $index; let i = $index) {\n <circle [attr.cx]=\"pointX(i)\" [attr.cy]=\"pointY(v)\" r=\"3\" [attr.fill]=\"s.color\" />\n }\n }\n }\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <line\n [attr.x1]=\"pointX(hovered)\"\n [attr.x2]=\"pointX(hovered)\"\n [attr.y1]=\"padding.top\"\n [attr.y2]=\"vbH - padding.bottom\"\n stroke=\"var(--wr-color-medium)\"\n stroke-width=\"1\"\n stroke-dasharray=\"3 3\"\n vector-effect=\"non-scaling-stroke\"\n />\n @for (p of hoverPoints(); track p.label) {\n <circle\n [attr.cx]=\"p.x\"\n [attr.cy]=\"p.y\"\n r=\"5\"\n fill=\"var(--wr-color-white)\"\n [attr.stroke]=\"p.color\"\n stroke-width=\"2\"\n />\n }\n }\n </svg>\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <div class=\"wr-line-chart__tooltip\" [style.left.%]=\"(pointX(hovered) / vbW) * 100\" [style.top.px]=\"padding.top\">\n <div class=\"wr-line-chart__tooltip-label\">{{ hoverLabel() }}</div>\n @for (p of hoverPoints(); track p.label) {\n <div class=\"wr-line-chart__tooltip-row\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"p.color\"></span>\n <span class=\"wr-line-chart__tooltip-name\">{{ p.label }}</span>\n <span class=\"wr-line-chart__tooltip-value\">{{ p.value }}</span>\n </div>\n }\n </div>\n }\n</div>\n\n@if (xLabels().length > 0) {\n <div class=\"wr-line-chart__x-labels\">\n @for (label of xLabels(); track $index) {\n <span class=\"wr-line-chart__x-label\">{{ label }}</span>\n }\n </div>\n}\n" }]
169
- }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], xLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "xLabels", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], showGrid: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGrid", required: false }] }], showLegend: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLegend", required: false }] }], showDots: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDots", required: false }] }] } });
181
+ args: [{ selector: 'wr-line-chart', encapsulation: ViewEncapsulation.None, host: { class: 'wr-line-chart' }, template: "@let hovered = hoveredIndex();\n@if (showLegend() && resolvedSeries().length > 0) {\n <ul class=\"wr-line-chart__legend\">\n @for (s of resolvedSeries(); track s.label) {\n <li class=\"wr-line-chart__legend-item\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"s.color\"></span>\n <span>{{ s.label }}</span>\n </li>\n }\n </ul>\n}\n\n<div class=\"wr-line-chart__plot\" role=\"img\" [attr.aria-label]=\"resolvedAriaLabel()\" [style.height.px]=\"height()\">\n <svg\n [attr.viewBox]=\"viewBox()\"\n preserveAspectRatio=\"none\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerleave)=\"onPointerLeave()\"\n >\n @if (showGrid()) {\n @for (tick of yTicks(); track tick.value) {\n <line\n class=\"wr-line-chart__grid-line\"\n [attr.x1]=\"padding.left\"\n [attr.x2]=\"vbW - padding.right\"\n [attr.y1]=\"tick.y\"\n [attr.y2]=\"tick.y\"\n stroke=\"rgba(var(--wr-color-light-rgb), 0.7)\"\n stroke-width=\"1\"\n vector-effect=\"non-scaling-stroke\"\n />\n <text\n class=\"wr-line-chart__tick\"\n [attr.x]=\"padding.left - 6\"\n [attr.y]=\"tick.y + 4\"\n text-anchor=\"end\"\n fill=\"var(--wr-color-on-surface-muted)\"\n font-size=\"10\"\n font-family=\"var(--wr-font-family-base)\"\n >\n {{ formatTick(tick.value) }}\n </text>\n }\n }\n\n @for (s of resolvedSeries(); track s.label) {\n <path\n class=\"wr-line-chart__line\"\n [attr.d]=\"pathFor(s)\"\n fill=\"none\"\n [attr.stroke]=\"s.color\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n vector-effect=\"non-scaling-stroke\"\n />\n @if (showDots()) {\n @for (v of s.data; track $index; let i = $index) {\n <circle class=\"wr-line-chart__dot\" [attr.cx]=\"pointX(i)\" [attr.cy]=\"pointY(v)\" r=\"3\" [attr.fill]=\"s.color\" />\n }\n }\n }\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <line\n class=\"wr-line-chart__crosshair\"\n [attr.x1]=\"pointX(hovered)\"\n [attr.x2]=\"pointX(hovered)\"\n [attr.y1]=\"padding.top\"\n [attr.y2]=\"vbH - padding.bottom\"\n stroke=\"var(--wr-color-medium)\"\n stroke-width=\"1\"\n stroke-dasharray=\"3 3\"\n vector-effect=\"non-scaling-stroke\"\n />\n @for (p of hoverPoints(); track p.label) {\n <circle\n [attr.cx]=\"p.x\"\n [attr.cy]=\"p.y\"\n r=\"5\"\n fill=\"var(--wr-color-white)\"\n [attr.stroke]=\"p.color\"\n stroke-width=\"2\"\n />\n }\n }\n </svg>\n\n @if (hovered !== null && hoverPoints().length > 0) {\n <div class=\"wr-line-chart__tooltip\" [style.left.%]=\"(pointX(hovered) / vbW) * 100\" [style.top.px]=\"padding.top\">\n <div class=\"wr-line-chart__tooltip-label\">{{ hoverLabel() }}</div>\n @for (p of hoverPoints(); track p.label) {\n <div class=\"wr-line-chart__tooltip-row\">\n <span class=\"wr-line-chart__swatch\" [style.background]=\"p.color\"></span>\n <span class=\"wr-line-chart__tooltip-name\">{{ p.label }}</span>\n <span class=\"wr-line-chart__tooltip-value\">{{ p.value }}</span>\n </div>\n }\n </div>\n }\n</div>\n\n@if (xLabels().length > 0) {\n <div class=\"wr-line-chart__x-labels\">\n @for (label of xLabels(); track $index) {\n <span class=\"wr-line-chart__x-label\">{{ label }}</span>\n }\n </div>\n}\n" }]
182
+ }], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], xLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "xLabels", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], showGrid: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGrid", required: false }] }], showLegend: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLegend", required: false }] }], showDots: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDots", required: false }] }] } });
170
183
 
171
184
  /**
172
185
  * Generated bundle index. Do not edit.