ngwr 14.3.0 → 14.4.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 (330) hide show
  1. package/README.md +1 -1
  2. package/avatar/styles/_index.scss +4 -2
  3. package/badge/styles/_index.scss +4 -1
  4. package/badge/styles/_tag.scss +3 -0
  5. package/cascader/styles/_rules.scss +3 -0
  6. package/command-palette/styles/_index.scss +23 -0
  7. package/context-menu/styles/_index.scss +13 -1
  8. package/fesm2022/ngwr-action-sheet.mjs +3 -3
  9. package/fesm2022/ngwr-affix.mjs +17 -4
  10. package/fesm2022/ngwr-affix.mjs.map +1 -1
  11. package/fesm2022/ngwr-alert.mjs +4 -4
  12. package/fesm2022/ngwr-alert.mjs.map +1 -1
  13. package/fesm2022/ngwr-anchor.mjs +3 -3
  14. package/fesm2022/ngwr-aurora.mjs +3 -3
  15. package/fesm2022/ngwr-avatar.mjs +3 -3
  16. package/fesm2022/ngwr-back-top.mjs +3 -3
  17. package/fesm2022/ngwr-badge.mjs +6 -6
  18. package/fesm2022/ngwr-bar-chart-testing.mjs +18 -2
  19. package/fesm2022/ngwr-bar-chart-testing.mjs.map +1 -1
  20. package/fesm2022/ngwr-bar-chart.mjs +3 -3
  21. package/fesm2022/ngwr-blur-text.mjs +3 -3
  22. package/fesm2022/ngwr-border-glow.mjs +3 -3
  23. package/fesm2022/ngwr-breadcrumbs.mjs +6 -6
  24. package/fesm2022/ngwr-burger.mjs +3 -3
  25. package/fesm2022/ngwr-button.mjs +6 -6
  26. package/fesm2022/ngwr-calendar-heatmap-testing.mjs +12 -9
  27. package/fesm2022/ngwr-calendar-heatmap-testing.mjs.map +1 -1
  28. package/fesm2022/ngwr-calendar-heatmap.mjs +35 -7
  29. package/fesm2022/ngwr-calendar-heatmap.mjs.map +1 -1
  30. package/fesm2022/ngwr-calendar.mjs +32 -4
  31. package/fesm2022/ngwr-calendar.mjs.map +1 -1
  32. package/fesm2022/ngwr-card.mjs +9 -9
  33. package/fesm2022/ngwr-carousel.mjs +6 -6
  34. package/fesm2022/ngwr-cascader-testing.mjs +87 -17
  35. package/fesm2022/ngwr-cascader-testing.mjs.map +1 -1
  36. package/fesm2022/ngwr-cascader.mjs +63 -4
  37. package/fesm2022/ngwr-cascader.mjs.map +1 -1
  38. package/fesm2022/ngwr-checkbox-testing.mjs +13 -2
  39. package/fesm2022/ngwr-checkbox-testing.mjs.map +1 -1
  40. package/fesm2022/ngwr-checkbox.mjs +42 -7
  41. package/fesm2022/ngwr-checkbox.mjs.map +1 -1
  42. package/fesm2022/ngwr-circular-text.mjs +3 -3
  43. package/fesm2022/ngwr-click-spark.mjs +3 -3
  44. package/fesm2022/ngwr-clipboard.mjs +3 -3
  45. package/fesm2022/ngwr-collapse.mjs +9 -9
  46. package/fesm2022/ngwr-color-picker.mjs +6 -6
  47. package/fesm2022/ngwr-command-palette.mjs +16 -3
  48. package/fesm2022/ngwr-command-palette.mjs.map +1 -1
  49. package/fesm2022/ngwr-compare.mjs +3 -3
  50. package/fesm2022/ngwr-confetti.mjs +3 -3
  51. package/fesm2022/ngwr-context-menu.mjs +12 -12
  52. package/fesm2022/ngwr-cookie.mjs +3 -3
  53. package/fesm2022/ngwr-counter.mjs +6 -6
  54. package/fesm2022/ngwr-date-adapters-fns.mjs +3 -3
  55. package/fesm2022/ngwr-date-adapters-luxon.mjs +3 -3
  56. package/fesm2022/ngwr-date-picker.mjs +81 -26
  57. package/fesm2022/ngwr-date-picker.mjs.map +1 -1
  58. package/fesm2022/ngwr-date.mjs +3 -3
  59. package/fesm2022/ngwr-decrypt-text.mjs +3 -3
  60. package/fesm2022/ngwr-density.mjs +6 -6
  61. package/fesm2022/ngwr-descriptions.mjs +6 -6
  62. package/fesm2022/ngwr-dialog.mjs +15 -15
  63. package/fesm2022/ngwr-directives.mjs +12 -12
  64. package/fesm2022/ngwr-divider.mjs +3 -3
  65. package/fesm2022/ngwr-donut-chart-testing.mjs +18 -2
  66. package/fesm2022/ngwr-donut-chart-testing.mjs.map +1 -1
  67. package/fesm2022/ngwr-donut-chart.mjs +4 -4
  68. package/fesm2022/ngwr-donut-chart.mjs.map +1 -1
  69. package/fesm2022/ngwr-drag-drop.mjs +6 -6
  70. package/fesm2022/ngwr-drawer.mjs +18 -18
  71. package/fesm2022/ngwr-dropdown.mjs +32 -14
  72. package/fesm2022/ngwr-dropdown.mjs.map +1 -1
  73. package/fesm2022/ngwr-empty.mjs +3 -3
  74. package/fesm2022/ngwr-event-calendar.mjs +6 -6
  75. package/fesm2022/ngwr-falling-text.mjs +3 -3
  76. package/fesm2022/ngwr-file-upload.mjs +18 -5
  77. package/fesm2022/ngwr-file-upload.mjs.map +1 -1
  78. package/fesm2022/ngwr-form.mjs +66 -14
  79. package/fesm2022/ngwr-form.mjs.map +1 -1
  80. package/fesm2022/ngwr-fuzzy-text.mjs +3 -3
  81. package/fesm2022/ngwr-gauge-testing.mjs +16 -2
  82. package/fesm2022/ngwr-gauge-testing.mjs.map +1 -1
  83. package/fesm2022/ngwr-gauge.mjs +3 -3
  84. package/fesm2022/ngwr-glitch-text.mjs +3 -3
  85. package/fesm2022/ngwr-gradient-text.mjs +3 -3
  86. package/fesm2022/ngwr-hotkey.mjs +6 -6
  87. package/fesm2022/ngwr-i18n-ar.mjs +2 -0
  88. package/fesm2022/ngwr-i18n-ar.mjs.map +1 -1
  89. package/fesm2022/ngwr-i18n-cs.mjs +2 -0
  90. package/fesm2022/ngwr-i18n-cs.mjs.map +1 -1
  91. package/fesm2022/ngwr-i18n-de.mjs +2 -0
  92. package/fesm2022/ngwr-i18n-de.mjs.map +1 -1
  93. package/fesm2022/ngwr-i18n-en.mjs +14 -2
  94. package/fesm2022/ngwr-i18n-en.mjs.map +1 -1
  95. package/fesm2022/ngwr-i18n-es.mjs +2 -0
  96. package/fesm2022/ngwr-i18n-es.mjs.map +1 -1
  97. package/fesm2022/ngwr-i18n-fr.mjs +2 -0
  98. package/fesm2022/ngwr-i18n-fr.mjs.map +1 -1
  99. package/fesm2022/ngwr-i18n-he.mjs +2 -0
  100. package/fesm2022/ngwr-i18n-he.mjs.map +1 -1
  101. package/fesm2022/ngwr-i18n-hi.mjs +2 -0
  102. package/fesm2022/ngwr-i18n-hi.mjs.map +1 -1
  103. package/fesm2022/ngwr-i18n-id.mjs +2 -0
  104. package/fesm2022/ngwr-i18n-id.mjs.map +1 -1
  105. package/fesm2022/ngwr-i18n-it.mjs +2 -0
  106. package/fesm2022/ngwr-i18n-it.mjs.map +1 -1
  107. package/fesm2022/ngwr-i18n-ja.mjs +2 -0
  108. package/fesm2022/ngwr-i18n-ja.mjs.map +1 -1
  109. package/fesm2022/ngwr-i18n-ko.mjs +2 -0
  110. package/fesm2022/ngwr-i18n-ko.mjs.map +1 -1
  111. package/fesm2022/ngwr-i18n-nl.mjs +2 -0
  112. package/fesm2022/ngwr-i18n-nl.mjs.map +1 -1
  113. package/fesm2022/ngwr-i18n-pl.mjs +2 -0
  114. package/fesm2022/ngwr-i18n-pl.mjs.map +1 -1
  115. package/fesm2022/ngwr-i18n-pt.mjs +2 -0
  116. package/fesm2022/ngwr-i18n-pt.mjs.map +1 -1
  117. package/fesm2022/ngwr-i18n-ru.mjs +2 -0
  118. package/fesm2022/ngwr-i18n-ru.mjs.map +1 -1
  119. package/fesm2022/ngwr-i18n-sv.mjs +2 -0
  120. package/fesm2022/ngwr-i18n-sv.mjs.map +1 -1
  121. package/fesm2022/ngwr-i18n-tr.mjs +2 -0
  122. package/fesm2022/ngwr-i18n-tr.mjs.map +1 -1
  123. package/fesm2022/ngwr-i18n-uk.mjs +2 -0
  124. package/fesm2022/ngwr-i18n-uk.mjs.map +1 -1
  125. package/fesm2022/ngwr-i18n-vi.mjs +2 -0
  126. package/fesm2022/ngwr-i18n-vi.mjs.map +1 -1
  127. package/fesm2022/ngwr-i18n-zh-TW.mjs +2 -0
  128. package/fesm2022/ngwr-i18n-zh-TW.mjs.map +1 -1
  129. package/fesm2022/ngwr-i18n-zh.mjs +2 -0
  130. package/fesm2022/ngwr-i18n-zh.mjs.map +1 -1
  131. package/fesm2022/ngwr-i18n.mjs +9 -9
  132. package/fesm2022/ngwr-icon.mjs +6 -6
  133. package/fesm2022/ngwr-image-cropper.mjs +3 -3
  134. package/fesm2022/ngwr-input-number.mjs +15 -6
  135. package/fesm2022/ngwr-input-number.mjs.map +1 -1
  136. package/fesm2022/ngwr-input-otp.mjs +38 -6
  137. package/fesm2022/ngwr-input-otp.mjs.map +1 -1
  138. package/fesm2022/ngwr-input.mjs +15 -15
  139. package/fesm2022/ngwr-keyboard.mjs +3 -3
  140. package/fesm2022/ngwr-knob-testing.mjs +11 -3
  141. package/fesm2022/ngwr-knob-testing.mjs.map +1 -1
  142. package/fesm2022/ngwr-knob.mjs +19 -4
  143. package/fesm2022/ngwr-knob.mjs.map +1 -1
  144. package/fesm2022/ngwr-layout.mjs +15 -15
  145. package/fesm2022/ngwr-lightbox.mjs +3 -3
  146. package/fesm2022/ngwr-line-chart-testing.mjs +18 -2
  147. package/fesm2022/ngwr-line-chart-testing.mjs.map +1 -1
  148. package/fesm2022/ngwr-line-chart.mjs +22 -4
  149. package/fesm2022/ngwr-line-chart.mjs.map +1 -1
  150. package/fesm2022/ngwr-list.mjs +6 -6
  151. package/fesm2022/ngwr-loading-bar.mjs +6 -6
  152. package/fesm2022/ngwr-markdown.mjs +6 -6
  153. package/fesm2022/ngwr-marquee.mjs +3 -3
  154. package/fesm2022/ngwr-media.mjs +3 -3
  155. package/fesm2022/ngwr-mention.mjs +6 -6
  156. package/fesm2022/ngwr-meta.mjs +6 -6
  157. package/fesm2022/ngwr-meter-group.mjs +3 -3
  158. package/fesm2022/ngwr-overlay.mjs +6 -6
  159. package/fesm2022/ngwr-page-header.mjs +3 -3
  160. package/fesm2022/ngwr-pagination.mjs +33 -6
  161. package/fesm2022/ngwr-pagination.mjs.map +1 -1
  162. package/fesm2022/ngwr-pipes.mjs +21 -21
  163. package/fesm2022/ngwr-platform.mjs +9 -9
  164. package/fesm2022/ngwr-popconfirm.mjs +6 -6
  165. package/fesm2022/ngwr-popover.mjs +29 -11
  166. package/fesm2022/ngwr-popover.mjs.map +1 -1
  167. package/fesm2022/ngwr-progress.mjs +3 -3
  168. package/fesm2022/ngwr-pull-to-refresh.mjs +3 -3
  169. package/fesm2022/ngwr-qr.mjs +3 -3
  170. package/fesm2022/ngwr-radio.mjs +6 -6
  171. package/fesm2022/ngwr-rating-testing.mjs +12 -3
  172. package/fesm2022/ngwr-rating-testing.mjs.map +1 -1
  173. package/fesm2022/ngwr-rating.mjs +19 -4
  174. package/fesm2022/ngwr-rating.mjs.map +1 -1
  175. package/fesm2022/ngwr-result.mjs +13 -13
  176. package/fesm2022/ngwr-result.mjs.map +1 -1
  177. package/fesm2022/ngwr-rotating-text.mjs +3 -3
  178. package/fesm2022/ngwr-schema-form.mjs +40 -4
  179. package/fesm2022/ngwr-schema-form.mjs.map +1 -1
  180. package/fesm2022/ngwr-scroll.mjs +3 -3
  181. package/fesm2022/ngwr-segmented.mjs +3 -3
  182. package/fesm2022/ngwr-select.mjs +9 -9
  183. package/fesm2022/ngwr-shiny-text.mjs +6 -6
  184. package/fesm2022/ngwr-sidebar.mjs +3 -3
  185. package/fesm2022/ngwr-skeleton.mjs +3 -3
  186. package/fesm2022/ngwr-slider.mjs +18 -5
  187. package/fesm2022/ngwr-slider.mjs.map +1 -1
  188. package/fesm2022/ngwr-sparkline.mjs +3 -3
  189. package/fesm2022/ngwr-speed-dial.mjs +3 -3
  190. package/fesm2022/ngwr-spinner.mjs +3 -3
  191. package/fesm2022/ngwr-splash-cursor.mjs +3 -3
  192. package/fesm2022/ngwr-split-text.mjs +3 -3
  193. package/fesm2022/ngwr-splitter.mjs +3 -3
  194. package/fesm2022/ngwr-spotlight-card.mjs +6 -6
  195. package/fesm2022/ngwr-squircle.mjs +28 -9
  196. package/fesm2022/ngwr-squircle.mjs.map +1 -1
  197. package/fesm2022/ngwr-star-border.mjs +3 -3
  198. package/fesm2022/ngwr-statistic.mjs +20 -13
  199. package/fesm2022/ngwr-statistic.mjs.map +1 -1
  200. package/fesm2022/ngwr-stepper.mjs +6 -6
  201. package/fesm2022/ngwr-storage.mjs +3 -3
  202. package/fesm2022/ngwr-switch.mjs +3 -3
  203. package/fesm2022/ngwr-table.mjs +18 -18
  204. package/fesm2022/ngwr-tabs-router.mjs +3 -3
  205. package/fesm2022/ngwr-tabs.mjs +6 -6
  206. package/fesm2022/ngwr-textarea.mjs +3 -3
  207. package/fesm2022/ngwr-theme.mjs +3 -3
  208. package/fesm2022/ngwr-tilt-card.mjs +6 -6
  209. package/fesm2022/ngwr-timeline.mjs +6 -6
  210. package/fesm2022/ngwr-toast.mjs +10 -10
  211. package/fesm2022/ngwr-toast.mjs.map +1 -1
  212. package/fesm2022/ngwr-toolbar.mjs +3 -3
  213. package/fesm2022/ngwr-tour.mjs +6 -6
  214. package/fesm2022/ngwr-transfer.mjs +88 -11
  215. package/fesm2022/ngwr-transfer.mjs.map +1 -1
  216. package/fesm2022/ngwr-tree-testing.mjs +24 -0
  217. package/fesm2022/ngwr-tree-testing.mjs.map +1 -1
  218. package/fesm2022/ngwr-tree.mjs +72 -7
  219. package/fesm2022/ngwr-tree.mjs.map +1 -1
  220. package/fesm2022/ngwr-typewriter.mjs +3 -3
  221. package/fesm2022/ngwr-typography.mjs +3 -3
  222. package/fesm2022/ngwr-version.mjs +1 -1
  223. package/fesm2022/ngwr-version.mjs.map +1 -1
  224. package/fesm2022/ngwr-virtual-scroll.mjs +3 -3
  225. package/fesm2022/ngwr-waves.mjs +3 -3
  226. package/fesm2022/ngwr-window.mjs +12 -12
  227. package/form/styles/_index.scss +63 -0
  228. package/i18n/ar.json +4 -2
  229. package/i18n/cs.json +4 -2
  230. package/i18n/de.json +4 -2
  231. package/i18n/en.json +6 -4
  232. package/i18n/es.json +4 -2
  233. package/i18n/fr.json +4 -2
  234. package/i18n/he.json +4 -2
  235. package/i18n/hi.json +4 -2
  236. package/i18n/id.json +4 -2
  237. package/i18n/it.json +4 -2
  238. package/i18n/ja.json +4 -2
  239. package/i18n/ko.json +4 -2
  240. package/i18n/nl.json +4 -2
  241. package/i18n/pl.json +4 -2
  242. package/i18n/pt.json +4 -2
  243. package/i18n/ru.json +4 -2
  244. package/i18n/sv.json +4 -2
  245. package/i18n/tr.json +4 -2
  246. package/i18n/uk.json +4 -2
  247. package/i18n/vi.json +4 -2
  248. package/i18n/zh-TW.json +4 -2
  249. package/i18n/zh.json +4 -2
  250. package/input-otp/styles/_index.scss +5 -1
  251. package/line-chart/styles/_index.scss +5 -3
  252. package/llms-full.txt +1 -1
  253. package/markdown/styles/_index.scss +4 -1
  254. package/mention/styles/_index.scss +22 -1
  255. package/package.json +1 -1
  256. package/radio/styles/_index.scss +3 -0
  257. package/result/styles/_index.scss +12 -0
  258. package/schematics/migrations/v14/index.js +6 -3
  259. package/schematics/migrations.json +1 -1
  260. package/schematics/ng-add/index.js +34 -5
  261. package/segmented/styles/_index.scss +4 -1
  262. package/select/styles/_index.scss +20 -1
  263. package/statistic/styles/_index.scss +4 -0
  264. package/stepper/styles/_index.scss +36 -0
  265. package/switch/styles/_index.scss +3 -0
  266. package/table/styles/_index.scss +12 -0
  267. package/tabs/styles/_index.scss +4 -1
  268. package/textarea/styles/_index.scss +6 -1
  269. package/theme/styles/_colors.scss +11 -0
  270. package/theme/styles/_contrast.scss +136 -0
  271. package/theme/styles/_index.scss +1 -0
  272. package/theme/styles/_mixins.scss +15 -8
  273. package/timeline/styles/_index.scss +28 -1
  274. package/toast/styles/_index.scss +11 -0
  275. package/tree/styles/_index.scss +27 -1
  276. package/types/ngwr-badge.d.ts +1 -1
  277. package/types/ngwr-bar-chart-testing.d.ts +11 -1
  278. package/types/ngwr-button.d.ts +1 -1
  279. package/types/ngwr-calendar-heatmap-testing.d.ts +10 -5
  280. package/types/ngwr-calendar-heatmap.d.ts +22 -0
  281. package/types/ngwr-calendar.d.ts +21 -0
  282. package/types/ngwr-cascader-testing.d.ts +74 -17
  283. package/types/ngwr-cascader.d.ts +28 -0
  284. package/types/ngwr-checkbox-testing.d.ts +12 -1
  285. package/types/ngwr-checkbox.d.ts +10 -0
  286. package/types/ngwr-clipboard.d.ts +1 -1
  287. package/types/ngwr-confetti.d.ts +1 -1
  288. package/types/ngwr-cookie.d.ts +1 -1
  289. package/types/ngwr-date-adapters-fns.d.ts +1 -1
  290. package/types/ngwr-date-adapters-luxon.d.ts +1 -1
  291. package/types/ngwr-date.d.ts +9 -3
  292. package/types/ngwr-density.d.ts +1 -1
  293. package/types/ngwr-dialog.d.ts +1 -1
  294. package/types/ngwr-donut-chart-testing.d.ts +11 -1
  295. package/types/ngwr-drawer.d.ts +1 -1
  296. package/types/ngwr-dropdown.d.ts +16 -0
  297. package/types/ngwr-file-upload.d.ts +11 -0
  298. package/types/ngwr-form.d.ts +25 -0
  299. package/types/ngwr-gauge-testing.d.ts +9 -1
  300. package/types/ngwr-hotkey.d.ts +1 -1
  301. package/types/ngwr-i18n.d.ts +1 -1
  302. package/types/ngwr-input-number.d.ts +12 -2
  303. package/types/ngwr-input-otp.d.ts +12 -0
  304. package/types/ngwr-knob-testing.d.ts +11 -3
  305. package/types/ngwr-knob.d.ts +13 -0
  306. package/types/ngwr-line-chart-testing.d.ts +11 -1
  307. package/types/ngwr-line-chart.d.ts +18 -0
  308. package/types/ngwr-loading-bar.d.ts +1 -1
  309. package/types/ngwr-markdown.d.ts +1 -1
  310. package/types/ngwr-media.d.ts +1 -1
  311. package/types/ngwr-meta.d.ts +1 -1
  312. package/types/ngwr-overlay.d.ts +2 -2
  313. package/types/ngwr-pagination.d.ts +16 -0
  314. package/types/ngwr-platform.d.ts +3 -3
  315. package/types/ngwr-popover.d.ts +16 -0
  316. package/types/ngwr-rating-testing.d.ts +12 -3
  317. package/types/ngwr-rating.d.ts +13 -0
  318. package/types/ngwr-scroll.d.ts +1 -1
  319. package/types/ngwr-squircle.d.ts +22 -3
  320. package/types/ngwr-statistic.d.ts +0 -1
  321. package/types/ngwr-storage.d.ts +1 -1
  322. package/types/ngwr-theme.d.ts +1 -1
  323. package/types/ngwr-toast.d.ts +1 -1
  324. package/types/ngwr-tour.d.ts +1 -1
  325. package/types/ngwr-transfer.d.ts +52 -0
  326. package/types/ngwr-tree-testing.d.ts +20 -0
  327. package/types/ngwr-tree.d.ts +41 -0
  328. package/types/ngwr-version.d.ts +1 -1
  329. package/types/ngwr-window.d.ts +1 -1
  330. package/typography/styles/_index.scss +26 -4
@@ -94,10 +94,10 @@ class WrCollapse {
94
94
  return;
95
95
  this.open.update(v => !v);
96
96
  }
97
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCollapse, deps: [], target: i0.ɵɵFactoryTarget.Component });
98
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: WrCollapse, isStandalone: true, selector: "wr-collapse", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<button\n type=\"button\"\n class=\"wr-collapse__header\"\n [attr.aria-expanded]=\"open()\"\n [attr.aria-controls]=\"bodyId\"\n [disabled]=\"disabled()\"\n (click)=\"toggle()\"\n>\n <span class=\"wr-collapse__title\">{{ title() }}</span>\n <svg\n class=\"wr-icon__svg wr-collapse__chevron\"\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=\"m6 9 6 6 6-6\" />\n </svg>\n</button>\n\n<div\n class=\"wr-collapse__body\"\n [attr.id]=\"bodyId\"\n [class.wr-collapse__body--open]=\"open()\"\n [attr.aria-hidden]=\"!open()\"\n [attr.inert]=\"!open() ? '' : null\"\n>\n <div class=\"wr-collapse__content\">\n <div class=\"wr-collapse__inner\">\n <ng-content />\n </div>\n </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
97
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCollapse, deps: [], target: i0.ɵɵFactoryTarget.Component });
98
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: WrCollapse, isStandalone: true, selector: "wr-collapse", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<button\n type=\"button\"\n class=\"wr-collapse__header\"\n [attr.aria-expanded]=\"open()\"\n [attr.aria-controls]=\"bodyId\"\n [disabled]=\"disabled()\"\n (click)=\"toggle()\"\n>\n <span class=\"wr-collapse__title\">{{ title() }}</span>\n <svg\n class=\"wr-icon__svg wr-collapse__chevron\"\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=\"m6 9 6 6 6-6\" />\n </svg>\n</button>\n\n<div\n class=\"wr-collapse__body\"\n [attr.id]=\"bodyId\"\n [class.wr-collapse__body--open]=\"open()\"\n [attr.aria-hidden]=\"!open()\"\n [attr.inert]=\"!open() ? '' : null\"\n>\n <div class=\"wr-collapse__content\">\n <div class=\"wr-collapse__inner\">\n <ng-content />\n </div>\n </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
99
99
  }
100
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCollapse, decorators: [{
100
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCollapse, decorators: [{
101
101
  type: Component,
102
102
  args: [{ selector: 'wr-collapse', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<button\n type=\"button\"\n class=\"wr-collapse__header\"\n [attr.aria-expanded]=\"open()\"\n [attr.aria-controls]=\"bodyId\"\n [disabled]=\"disabled()\"\n (click)=\"toggle()\"\n>\n <span class=\"wr-collapse__title\">{{ title() }}</span>\n <svg\n class=\"wr-icon__svg wr-collapse__chevron\"\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=\"m6 9 6 6 6-6\" />\n </svg>\n</button>\n\n<div\n class=\"wr-collapse__body\"\n [attr.id]=\"bodyId\"\n [class.wr-collapse__body--open]=\"open()\"\n [attr.aria-hidden]=\"!open()\"\n [attr.inert]=\"!open() ? '' : null\"\n>\n <div class=\"wr-collapse__content\">\n <div class=\"wr-collapse__inner\">\n <ng-content />\n </div>\n </div>\n</div>\n" }]
103
103
  }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
@@ -132,8 +132,8 @@ class WrCollapseGroup {
132
132
  member.close();
133
133
  }
134
134
  }
135
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCollapseGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
136
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: WrCollapseGroup, isStandalone: true, selector: "wr-collapse-group", inputs: { accordion: { classPropertyName: "accordion", publicName: "accordion", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-collapse-group" }, providers: [
135
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCollapseGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
136
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.6", type: WrCollapseGroup, isStandalone: true, selector: "wr-collapse-group", inputs: { accordion: { classPropertyName: "accordion", publicName: "accordion", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-collapse-group" }, providers: [
137
137
  {
138
138
  provide: WR_COLLAPSE_GROUP,
139
139
  // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -141,7 +141,7 @@ class WrCollapseGroup {
141
141
  },
142
142
  ], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
143
143
  }
144
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCollapseGroup, decorators: [{
144
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCollapseGroup, decorators: [{
145
145
  type: Component,
146
146
  args: [{
147
147
  selector: 'wr-collapse-group',
@@ -198,8 +198,8 @@ class WrAccordion {
198
198
  member.close();
199
199
  }
200
200
  }
201
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
202
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: WrAccordion, isStandalone: true, selector: "wr-accordion", host: { classAttribute: "wr-collapse-group wr-collapse-group--accordion" }, providers: [
201
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
202
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: WrAccordion, isStandalone: true, selector: "wr-accordion", host: { classAttribute: "wr-collapse-group wr-collapse-group--accordion" }, providers: [
203
203
  {
204
204
  provide: WR_COLLAPSE_GROUP,
205
205
  // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -207,7 +207,7 @@ class WrAccordion {
207
207
  },
208
208
  ], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
209
209
  }
210
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrAccordion, decorators: [{
210
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrAccordion, decorators: [{
211
211
  type: Component,
212
212
  args: [{
213
213
  selector: 'wr-accordion',
@@ -798,10 +798,10 @@ class WrColorPicker {
798
798
  this.a.set(hsv.a);
799
799
  this.emit();
800
800
  }
801
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
802
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrColorPicker, isStandalone: true, selector: "wr-color-picker", inputs: { alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { properties: { "class": "classes()", "style.--wr-color-picker-hue": "hueCss()", "style.--wr-color-picker-rgb": "rgbCss()" } }, providers: [{ provide: WR_FORM_FIELD, useValue: null }], ngImport: i0, template: "<!--\n `role=\"group\"` rather than `role=\"slider\"`, because this surface holds TWO\n values and a slider has one `aria-valuenow`; and rather than\n `role=\"application\"`, which would switch the reader out of its own browse mode\n for the whole subtree \u2014 the call `wr-image-cropper` already made. A group has\n no value of its own, so the two percentages ride in its accessible name, which\n is where a reader querying the focused element finds them.\n-->\n<div\n class=\"wr-color-picker__sv\"\n role=\"group\"\n [attr.aria-label]=\"resolvedAreaLabel()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'sv')\"\n (keydown)=\"onAreaKeydown($event)\"\n (blur)=\"onSurfaceBlur()\"\n>\n <span class=\"wr-color-picker__thumb\" [style.left.%]=\"svThumbX()\" [style.top.%]=\"svThumbY()\"></span>\n</div>\n\n<div\n class=\"wr-color-picker__slider wr-color-picker__slider--hue\"\n role=\"slider\"\n aria-valuemin=\"0\"\n aria-valuemax=\"360\"\n [attr.aria-label]=\"resolvedHueLabel()\"\n [attr.aria-valuenow]=\"hueValue()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'hue')\"\n (keydown)=\"onSliderKeydown($event, 'hue')\"\n (blur)=\"onSurfaceBlur()\"\n>\n <!--\n `inset-inline-start`, not `left`: this is a one-value track, so it mirrors\n under `dir=\"rtl\"` the way `wr-slider` does. The SV thumb above keeps `left` \u2014\n the canvas is a picture and does not flip.\n -->\n <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.inset-inline-start.%]=\"hueThumbX()\"></span>\n</div>\n\n@if (alpha()) {\n <div\n class=\"wr-color-picker__slider wr-color-picker__slider--alpha\"\n role=\"slider\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n [attr.aria-label]=\"resolvedAlphaLabel()\"\n [attr.aria-valuenow]=\"alphaPercent()\"\n [attr.aria-valuetext]=\"`${alphaPercent()}%`\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'alpha')\"\n (keydown)=\"onSliderKeydown($event, 'alpha')\"\n (blur)=\"onSurfaceBlur()\"\n >\n <span\n class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\"\n [style.inset-inline-start.%]=\"alphaThumbX()\"\n ></span>\n </div>\n}\n\n<div class=\"wr-color-picker__chrome\">\n <span class=\"wr-color-picker__preview\" [style.background]=\"hex()\"></span>\n <wr-segmented\n class=\"wr-color-picker__tabs\"\n [options]=\"tabOptions()\"\n [value]=\"activeTab()\"\n (valueChange)=\"onTabChange($event)\"\n />\n</div>\n\n@switch (activeTab()) {\n @case ('hex') {\n <div class=\"wr-color-picker__inputs wr-color-picker__inputs--hex\">\n <label class=\"wr-color-picker__field wr-color-picker__field--wide\">\n <input\n type=\"text\"\n spellcheck=\"false\"\n autocomplete=\"off\"\n [value]=\"hexInput()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHexInput($event)\"\n (blur)=\"onHexBlur()\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelHexLabel() }}</span>\n </label>\n </div>\n }\n @case ('rgb') {\n <div class=\"wr-color-picker__inputs\">\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"255\"\n [value]=\"rgb().r\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onRgbChannel('r', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelRedLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"255\"\n [value]=\"rgb().g\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onRgbChannel('g', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelGreenLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"255\"\n [value]=\"rgb().b\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onRgbChannel('b', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelBlueLabel() }}</span>\n </label>\n @if (alpha()) {\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"alphaPercent()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n </label>\n }\n </div>\n }\n @case ('hsl') {\n <div class=\"wr-color-picker__inputs\">\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"360\"\n [value]=\"hslView().h | number: '1.0-0'\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHslChannel('h', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelHueLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"hslView().s * 100 | number: '1.0-0'\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHslChannel('s', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelSaturationLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"hslView().l * 100 | number: '1.0-0'\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHslChannel('l', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelLightnessLabel() }}</span>\n </label>\n @if (alpha()) {\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"alphaPercent()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n </label>\n }\n </div>\n }\n}\n\n@if (swatches().length > 0) {\n <div class=\"wr-color-picker__swatches\">\n @for (color of swatches(); track color) {\n <button\n type=\"button\"\n class=\"wr-color-picker__swatch\"\n [style.background]=\"color\"\n [attr.aria-label]=\"color\"\n [disabled]=\"disabled() || readonly()\"\n (click)=\"onSwatchClick(color)\"\n ></button>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled", "readonly", "size"], outputs: ["valueChange", "touch"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
801
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
802
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrColorPicker, isStandalone: true, selector: "wr-color-picker", inputs: { alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { properties: { "class": "classes()", "style.--wr-color-picker-hue": "hueCss()", "style.--wr-color-picker-rgb": "rgbCss()" } }, providers: [{ provide: WR_FORM_FIELD, useValue: null }], ngImport: i0, template: "<!--\n `role=\"group\"` rather than `role=\"slider\"`, because this surface holds TWO\n values and a slider has one `aria-valuenow`; and rather than\n `role=\"application\"`, which would switch the reader out of its own browse mode\n for the whole subtree \u2014 the call `wr-image-cropper` already made. A group has\n no value of its own, so the two percentages ride in its accessible name, which\n is where a reader querying the focused element finds them.\n-->\n<div\n class=\"wr-color-picker__sv\"\n role=\"group\"\n [attr.aria-label]=\"resolvedAreaLabel()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'sv')\"\n (keydown)=\"onAreaKeydown($event)\"\n (blur)=\"onSurfaceBlur()\"\n>\n <span class=\"wr-color-picker__thumb\" [style.left.%]=\"svThumbX()\" [style.top.%]=\"svThumbY()\"></span>\n</div>\n\n<div\n class=\"wr-color-picker__slider wr-color-picker__slider--hue\"\n role=\"slider\"\n aria-valuemin=\"0\"\n aria-valuemax=\"360\"\n [attr.aria-label]=\"resolvedHueLabel()\"\n [attr.aria-valuenow]=\"hueValue()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'hue')\"\n (keydown)=\"onSliderKeydown($event, 'hue')\"\n (blur)=\"onSurfaceBlur()\"\n>\n <!--\n `inset-inline-start`, not `left`: this is a one-value track, so it mirrors\n under `dir=\"rtl\"` the way `wr-slider` does. The SV thumb above keeps `left` \u2014\n the canvas is a picture and does not flip.\n -->\n <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.inset-inline-start.%]=\"hueThumbX()\"></span>\n</div>\n\n@if (alpha()) {\n <div\n class=\"wr-color-picker__slider wr-color-picker__slider--alpha\"\n role=\"slider\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n [attr.aria-label]=\"resolvedAlphaLabel()\"\n [attr.aria-valuenow]=\"alphaPercent()\"\n [attr.aria-valuetext]=\"`${alphaPercent()}%`\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.aria-readonly]=\"readonly() || null\"\n [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n [attr.aria-describedby]=\"fieldAria.describedBy()\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'alpha')\"\n (keydown)=\"onSliderKeydown($event, 'alpha')\"\n (blur)=\"onSurfaceBlur()\"\n >\n <span\n class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\"\n [style.inset-inline-start.%]=\"alphaThumbX()\"\n ></span>\n </div>\n}\n\n<div class=\"wr-color-picker__chrome\">\n <span class=\"wr-color-picker__preview\" [style.background]=\"hex()\"></span>\n <wr-segmented\n class=\"wr-color-picker__tabs\"\n [options]=\"tabOptions()\"\n [value]=\"activeTab()\"\n (valueChange)=\"onTabChange($event)\"\n />\n</div>\n\n@switch (activeTab()) {\n @case ('hex') {\n <div class=\"wr-color-picker__inputs wr-color-picker__inputs--hex\">\n <label class=\"wr-color-picker__field wr-color-picker__field--wide\">\n <input\n type=\"text\"\n spellcheck=\"false\"\n autocomplete=\"off\"\n [value]=\"hexInput()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHexInput($event)\"\n (blur)=\"onHexBlur()\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelHexLabel() }}</span>\n </label>\n </div>\n }\n @case ('rgb') {\n <div class=\"wr-color-picker__inputs\">\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"255\"\n [value]=\"rgb().r\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onRgbChannel('r', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelRedLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"255\"\n [value]=\"rgb().g\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onRgbChannel('g', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelGreenLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"255\"\n [value]=\"rgb().b\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onRgbChannel('b', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelBlueLabel() }}</span>\n </label>\n @if (alpha()) {\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"alphaPercent()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n </label>\n }\n </div>\n }\n @case ('hsl') {\n <div class=\"wr-color-picker__inputs\">\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"360\"\n [value]=\"hslView().h | number: '1.0-0'\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHslChannel('h', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelHueLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"hslView().s * 100 | number: '1.0-0'\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHslChannel('s', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelSaturationLabel() }}</span>\n </label>\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"hslView().l * 100 | number: '1.0-0'\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onHslChannel('l', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelLightnessLabel() }}</span>\n </label>\n @if (alpha()) {\n <label class=\"wr-color-picker__field\">\n <input\n type=\"number\"\n min=\"0\"\n max=\"100\"\n [value]=\"alphaPercent()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n </label>\n }\n </div>\n }\n}\n\n@if (swatches().length > 0) {\n <div class=\"wr-color-picker__swatches\">\n @for (color of swatches(); track color) {\n <button\n type=\"button\"\n class=\"wr-color-picker__swatch\"\n [style.background]=\"color\"\n [attr.aria-label]=\"color\"\n [disabled]=\"disabled() || readonly()\"\n (click)=\"onSwatchClick(color)\"\n ></button>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled", "readonly", "size"], outputs: ["valueChange", "touch"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
803
803
  }
804
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPicker, decorators: [{
804
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrColorPicker, decorators: [{
805
805
  type: Component,
806
806
  args: [{ selector: 'wr-color-picker', encapsulation: ViewEncapsulation.None, host: {
807
807
  '[class]': 'classes()',
@@ -970,10 +970,10 @@ class WrColorPickerTrigger {
970
970
  this.overlayRef = null;
971
971
  }
972
972
  }
973
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
974
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.5", type: WrColorPickerTrigger, isStandalone: true, selector: "[wrColorPickerTrigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", opened: "opened", closed: "closed" }, host: { listeners: { "click": "toggle()" }, properties: { "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "isOpen()", "attr.aria-controls": "isOpen() ? panelId : null", "attr.aria-disabled": "disabled() ? true : null" } }, exportAs: ["wrColorPickerTrigger"], ngImport: i0 });
973
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
974
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrColorPickerTrigger, isStandalone: true, selector: "[wrColorPickerTrigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", opened: "opened", closed: "closed" }, host: { listeners: { "click": "toggle()" }, properties: { "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "isOpen()", "attr.aria-controls": "isOpen() ? panelId : null", "attr.aria-disabled": "disabled() ? true : null" } }, exportAs: ["wrColorPickerTrigger"], ngImport: i0 });
975
975
  }
976
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
976
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
977
977
  type: Directive,
978
978
  args: [{
979
979
  selector: '[wrColorPickerTrigger]',
@@ -324,6 +324,19 @@ class WrCommandPalette {
324
324
  onQueryInput(event) {
325
325
  this.query.set(event.target.value);
326
326
  this.activeIndex.set(0);
327
+ // The highlight goes back to the first row, and the SCROLLER has to go with
328
+ // it. Nothing moved it otherwise: the options are not focusable, so the
329
+ // browser scrolls nothing on its own, and `revealActive` is called only from
330
+ // the arrow keys. Edit the query after arrowing down a long list and the
331
+ // highlight sat at the top, out of sight, while the rows on screen were
332
+ // something else — and Enter ran the command the user could not see.
333
+ //
334
+ // `scrollTop = 0` rather than `revealActive()`: the list has just been
335
+ // re-filtered, so under zoneless CD the row at index 0 is still the OLD one
336
+ // until change detection runs, and the destination is the top either way.
337
+ const body = this.panelEl()?.nativeElement.querySelector('.wr-command-palette__body');
338
+ if (body)
339
+ body.scrollTop = 0;
327
340
  }
328
341
  onKeydown(event) {
329
342
  // Every key below belongs to the input method while it is converting: Enter
@@ -421,10 +434,10 @@ class WrCommandPalette {
421
434
  if (this.closeOnPick())
422
435
  this.close();
423
436
  }
424
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
425
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { paletteLabel: { classPropertyName: "paletteLabel", publicName: "paletteLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, loadingText: { classPropertyName: "loadingText", publicName: "loadingText", isSignal: true, isRequired: false, transformFunction: null }, closeOnPick: { classPropertyName: "closeOnPick", publicName: "closeOnPick", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, serverSearch: { classPropertyName: "serverSearch", publicName: "serverSearch", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, debounceMs: { classPropertyName: "debounceMs", publicName: "debounceMs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", picked: "picked", query: "queryChange", searchChange: "searchChange" }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }, { propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n <div\n class=\"wr-command-palette\"\n [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedPaletteLabel()\"\n >\n <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n Esc on the panel below. -->\n\n <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Keydown is delegated from the search input; tabindex enables Esc when\n the input is unfocused. -->\n <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n <div class=\"wr-command-palette__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n </svg>\n <input\n #input\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-expanded]=\"true\"\n [attr.aria-activedescendant]=\"activeOptionId() || null\"\n [placeholder]=\"resolvedPlaceholder()\"\n [value]=\"query()\"\n (input)=\"onQueryInput($event)\"\n />\n <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n </div>\n\n <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n A listbox may only own `option` and `group` children \u2014 the same rule\n the buckets already follow \u2014 so this row inside it was an\n `aria-required-children` critical for every query that matched\n nothing, and an empty listbox on its own is not. `role=\"status\"` also\n gets the message spoken while focus stays in the search input. -->\n @if (loading()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedLoading() }}</div>\n } @else if (filtered().length === 0 && !awaitingQuery()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n }\n\n <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n <!-- A listbox may only own `option` and `group` children, so a titled\n bucket is a labelled group and an untitled one leaves the tree with\n `role=\"none\"`, promoting its options to the listbox's own. -->\n <div\n class=\"wr-command-palette__group\"\n [attr.role]=\"bucket.title ? 'group' : 'none'\"\n [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n >\n @if (bucket.title) {\n <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n {{ bucket.title }}\n </div>\n }\n @for (item of bucket.items; track item.id) {\n <div\n class=\"wr-command-palette__option\"\n role=\"option\"\n [attr.id]=\"optionId(indexOf(item))\"\n [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n (mouseenter)=\"onItemHover(item)\"\n (mousedown)=\"onItemClick(item, $event)\"\n >\n @if (item.icon) {\n <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n } @else {\n <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n }\n <div class=\"wr-command-palette__option-body\">\n <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n }\n </div>\n @if (item.shortcut) {\n <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Footer slot. A real palette carries something under the list \u2014 a key\n legend, a result count, a provider's required attribution \u2014 and there\n was nowhere to put it. Projected rather than an input, because the\n content is markup (a link, a logo) rather than a string.\n\n Outside the listbox on purpose: a `role=\"listbox\"` may own only\n `option` and `group` children, the same rule the buckets and the empty\n row already follow. -->\n <div class=\"wr-command-palette__footer\">\n <ng-content select=\"[wrCommandPaletteFooter]\" />\n </div>\n </div>\n </div>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
437
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
438
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { paletteLabel: { classPropertyName: "paletteLabel", publicName: "paletteLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, loadingText: { classPropertyName: "loadingText", publicName: "loadingText", isSignal: true, isRequired: false, transformFunction: null }, closeOnPick: { classPropertyName: "closeOnPick", publicName: "closeOnPick", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, serverSearch: { classPropertyName: "serverSearch", publicName: "serverSearch", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, debounceMs: { classPropertyName: "debounceMs", publicName: "debounceMs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", picked: "picked", query: "queryChange", searchChange: "searchChange" }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }, { propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n <div\n class=\"wr-command-palette\"\n [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedPaletteLabel()\"\n >\n <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n Esc on the panel below. -->\n\n <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Keydown is delegated from the search input; tabindex enables Esc when\n the input is unfocused. -->\n <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n <div class=\"wr-command-palette__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n </svg>\n <input\n #input\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-expanded]=\"true\"\n [attr.aria-activedescendant]=\"activeOptionId() || null\"\n [placeholder]=\"resolvedPlaceholder()\"\n [value]=\"query()\"\n (input)=\"onQueryInput($event)\"\n />\n <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n </div>\n\n <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n A listbox may only own `option` and `group` children \u2014 the same rule\n the buckets already follow \u2014 so this row inside it was an\n `aria-required-children` critical for every query that matched\n nothing, and an empty listbox on its own is not. `role=\"status\"` also\n gets the message spoken while focus stays in the search input. -->\n @if (loading()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedLoading() }}</div>\n } @else if (filtered().length === 0 && !awaitingQuery()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n }\n\n <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n <!-- A listbox may only own `option` and `group` children, so a titled\n bucket is a labelled group and an untitled one leaves the tree with\n `role=\"none\"`, promoting its options to the listbox's own. -->\n <div\n class=\"wr-command-palette__group\"\n [attr.role]=\"bucket.title ? 'group' : 'none'\"\n [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n >\n @if (bucket.title) {\n <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n {{ bucket.title }}\n </div>\n }\n @for (item of bucket.items; track item.id) {\n <div\n class=\"wr-command-palette__option\"\n role=\"option\"\n [attr.id]=\"optionId(indexOf(item))\"\n [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n (mouseenter)=\"onItemHover(item)\"\n (mousedown)=\"onItemClick(item, $event)\"\n >\n @if (item.icon) {\n <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n } @else {\n <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n }\n <div class=\"wr-command-palette__option-body\">\n <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n }\n </div>\n @if (item.shortcut) {\n <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Footer slot. A real palette carries something under the list \u2014 a key\n legend, a result count, a provider's required attribution \u2014 and there\n was nowhere to put it. Projected rather than an input, because the\n content is markup (a link, a logo) rather than a string.\n\n Outside the listbox on purpose: a `role=\"listbox\"` may own only\n `option` and `group` children, the same rule the buckets and the empty\n row already follow. -->\n <div class=\"wr-command-palette__footer\">\n <ng-content select=\"[wrCommandPaletteFooter]\" />\n </div>\n </div>\n </div>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
426
439
  }
427
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCommandPalette, decorators: [{
440
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCommandPalette, decorators: [{
428
441
  type: Component,
429
442
  args: [{ selector: 'wr-command-palette', encapsulation: ViewEncapsulation.None, imports: [WrIcon], template: "@if (open()) {\n <div\n class=\"wr-command-palette\"\n [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedPaletteLabel()\"\n >\n <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n Esc on the panel below. -->\n\n <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Keydown is delegated from the search input; tabindex enables Esc when\n the input is unfocused. -->\n <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n <div class=\"wr-command-palette__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n </svg>\n <input\n #input\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-expanded]=\"true\"\n [attr.aria-activedescendant]=\"activeOptionId() || null\"\n [placeholder]=\"resolvedPlaceholder()\"\n [value]=\"query()\"\n (input)=\"onQueryInput($event)\"\n />\n <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n </div>\n\n <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n A listbox may only own `option` and `group` children \u2014 the same rule\n the buckets already follow \u2014 so this row inside it was an\n `aria-required-children` critical for every query that matched\n nothing, and an empty listbox on its own is not. `role=\"status\"` also\n gets the message spoken while focus stays in the search input. -->\n @if (loading()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedLoading() }}</div>\n } @else if (filtered().length === 0 && !awaitingQuery()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n }\n\n <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n <!-- A listbox may only own `option` and `group` children, so a titled\n bucket is a labelled group and an untitled one leaves the tree with\n `role=\"none\"`, promoting its options to the listbox's own. -->\n <div\n class=\"wr-command-palette__group\"\n [attr.role]=\"bucket.title ? 'group' : 'none'\"\n [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n >\n @if (bucket.title) {\n <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n {{ bucket.title }}\n </div>\n }\n @for (item of bucket.items; track item.id) {\n <div\n class=\"wr-command-palette__option\"\n role=\"option\"\n [attr.id]=\"optionId(indexOf(item))\"\n [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n (mouseenter)=\"onItemHover(item)\"\n (mousedown)=\"onItemClick(item, $event)\"\n >\n @if (item.icon) {\n <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n } @else {\n <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n }\n <div class=\"wr-command-palette__option-body\">\n <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n }\n </div>\n @if (item.shortcut) {\n <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Footer slot. A real palette carries something under the list \u2014 a key\n legend, a result count, a provider's required attribution \u2014 and there\n was nowhere to put it. Projected rather than an input, because the\n content is markup (a link, a logo) rather than a string.\n\n Outside the listbox on purpose: a `role=\"listbox\"` may own only\n `option` and `group` children, the same rule the buckets and the empty\n row already follow. -->\n <div class=\"wr-command-palette__footer\">\n <ng-content select=\"[wrCommandPaletteFooter]\" />\n </div>\n </div>\n </div>\n}\n" }]
430
443
  }], ctorParameters: () => [], propDecorators: { paletteLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "paletteLabel", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], loadingText: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingText", required: false }] }], closeOnPick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnPick", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], picked: [{ type: i0.Output, args: ["picked"] }], query: [{ type: i0.Input, args: [{ isSignal: true, alias: "query", required: false }] }, { type: i0.Output, args: ["queryChange"] }], serverSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "serverSearch", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], debounceMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounceMs", required: false }] }], searchChange: [{ type: i0.Output, args: ["searchChange"] }], inputEl: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }], panelEl: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
@@ -1 +1 @@
1
- {"version":3,"file":"ngwr-command-palette.mjs","sources":["../../../projects/lib/command-palette/command-palette.ts","../../../projects/lib/command-palette/command-palette.html","../../../projects/lib/command-palette/ngwr-command-palette.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 { type BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n Component,\n DestroyRef,\n type ElementRef,\n PLATFORM_ID,\n ViewEncapsulation,\n afterNextRender,\n computed,\n effect,\n inject,\n input,\n model,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\n\nimport { debounce, skip, timer } from 'rxjs';\n\nimport { WrHotkey, type WrHotkeyHandle, type WrHotkeySpec } from 'ngwr/hotkey';\nimport { readI18nText, useI18nText } from 'ngwr/i18n';\nimport { WrIcon } from 'ngwr/icon';\nimport { WR_RESPONSIVE_OVERLAYS, wrPresentAsSheet } from 'ngwr/overlay';\nimport { isComposing } from 'ngwr/utils';\n\nimport type { WrCommandItem } from './interfaces';\n\ninterface Bucket {\n readonly title: string | null;\n readonly items: readonly WrCommandItem[];\n}\n\nlet listboxUid = 0;\n\nfunction bucketize(items: readonly WrCommandItem[]): readonly Bucket[] {\n const map = new Map<string | null, WrCommandItem[]>();\n for (const item of items) {\n const key = item.group ?? null;\n const bucket = map.get(key);\n if (bucket) bucket.push(item);\n else map.set(key, [item]);\n }\n return [...map.entries()].map(([title, items]) => ({ title, items }));\n}\n\nfunction matches(item: WrCommandItem, query: string): boolean {\n if (!query) return true;\n const q = query.toLowerCase();\n if (item.label.toLowerCase().includes(q)) return true;\n if (item.description?.toLowerCase().includes(q)) return true;\n if (item.group?.toLowerCase().includes(q)) return true;\n if (item.keywords?.some(k => k.toLowerCase().includes(q))) return true;\n return false;\n}\n\n/**\n * `⌘K`-style command palette — a centred modal with a search input and\n * filtered list of actions. Items can be grouped, have icons, descriptions,\n * and visual shortcut hints.\n *\n * Drop one at the root of the app, pass it the list of commands, and bind\n * a global hotkey (default `'mod+k'`). Use `[(open)]` for controlled\n * visibility, or let it manage itself.\n *\n * @example\n * ```html\n * <wr-command-palette [items]=\"commands\" trigger=\"mod+k\" (picked)=\"onPicked($event)\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/command-palette\n */\n@Component({\n selector: 'wr-command-palette',\n templateUrl: './command-palette.html',\n encapsulation: ViewEncapsulation.None,\n imports: [WrIcon],\n})\nexport class WrCommandPalette {\n /** Accessible name. Falls back to `commandPalette.label`, then `'Command palette'`. */\n readonly paletteLabel = input<string | null>(null);\n\n protected readonly resolvedPaletteLabel = useI18nText(this.paletteLabel, 'commandPalette.label', 'Command palette');\n\n /** Items shown in the palette. */\n readonly items = input<readonly WrCommandItem[]>([]);\n\n /** Controlled open state (two-way bindable). @default false */\n readonly open = model(false);\n\n /** Global hotkey that opens the palette. `null` disables auto-binding. @default 'mod+k' */\n readonly trigger = input<WrHotkeySpec | null>('mod+k');\n\n /** Search input placeholder. Falls back to `commandPalette.placeholder`. */\n readonly placeholder = input<string | null>(null);\n\n /** Text shown when no items match. Falls back to `commandPalette.noResults`. */\n readonly emptyText = input<string | null>(null);\n\n /**\n * Overrides the `commandPalette.loading` catalog string, shown instead of\n * {@link emptyText} while {@link loading} is true.\n */\n readonly loadingText = input<string | null>(null);\n\n protected readonly resolvedPlaceholder = useI18nText(\n this.placeholder,\n 'commandPalette.placeholder',\n 'Type a command or search…'\n );\n protected readonly resolvedEmpty = useI18nText(this.emptyText, 'commandPalette.noResults', 'No results');\n protected readonly resolvedLoading = useI18nText(this.loadingText, 'commandPalette.loading', 'Searching…');\n\n /**\n * The key-cap chip beside the search field. It was the literal `esc` in the\n * template — the one string on this component no catalog could reach, so a\n * fully Russian palette still hinted in English.\n */\n protected readonly resolvedEscHint = readI18nText('commandPalette.escHint', 'esc');\n\n /** Auto-close on `(picked)`. Set false to keep open. @default true */\n readonly closeOnPick = input(true, { transform: coerceBooleanProperty });\n\n /**\n * Present the palette full-screen on small viewports instead of a centred\n * modal. `undefined` follows the app-wide `provideWrResponsiveOverlays()`\n * setting; `true`/`false` overrides it. The palette docks to the top (it\n * auto-focuses its input, so the on-screen keyboard stays clear).\n * @default undefined\n */\n readonly responsive = input<boolean | undefined, BooleanInput>(undefined, {\n transform: (v: BooleanInput): boolean | undefined => (v == null ? undefined : coerceBooleanProperty(v)),\n });\n\n /** Fires when the user commits an item (Enter / click). */\n readonly picked = output<WrCommandItem>();\n\n /**\n * The search text. Two-way, so a host can seed it, clear it, or read what the\n * user is looking for — the palette used to keep this to itself, which is what\n * made it impossible to back with anything but a static `items` array.\n *\n * Writing it does NOT re-run a host's search on its own: the debounced\n * {@link searchChange} output is what fires, on exactly the cadence\n * {@link debounceMs} sets.\n */\n readonly query = model('');\n\n /**\n * The item list is already scoped to the query upstream — skip the built-in\n * client-side filter. Set it when `[items]` is fed from a server via the\n * {@link searchChange} output.\n *\n * Without this, a backend that ranks or tolerates typos (returning rows whose\n * labels do not literally contain the query) would have those rows hidden\n * again on the client — the same rule `wr-select` follows, and the same\n * reason. @default false\n */\n readonly serverSearch = input(false, { transform: coerceBooleanProperty });\n\n /**\n * A host-driven search is in flight. Swaps the empty row for\n * {@link loadingText} — an async palette that says \"No results\" between every\n * keystroke and its answer is stating something false. @default false\n */\n readonly loading = input(false, { transform: coerceBooleanProperty });\n\n /**\n * How long the query must settle before {@link searchChange} fires, in ms.\n * A search request per keystroke is what exhausts a metered search backend:\n * typing `select` is six requests at 0 and roughly one at 250. @default 250\n */\n readonly debounceMs = input(250, { transform: (v: unknown): number => Math.max(0, Number(v) || 0) });\n\n /**\n * The settled query. This is the hook for a server-backed palette: dispatch\n * on it, then feed the result into `[items]` with `[serverSearch]` set.\n *\n * Fires on the {@link debounceMs} cadence, NOT per keystroke — `queryChange`\n * is the per-keystroke signal if that is what you want.\n */\n readonly searchChange = output<string>();\n\n protected readonly activeIndex = signal(0);\n\n /** Whether the current opening is presented full-screen. Decided on open. */\n protected readonly presentAsSheet = signal(false);\n protected readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('input');\n protected readonly panelEl = viewChild<ElementRef<HTMLElement>>('panel');\n\n /** Listbox id (referenced by the input's `aria-controls`). */\n protected readonly listboxId = `wr-command-palette-listbox-${++listboxUid}`;\n\n /** @internal Build a stable option id for a given flat index. */\n protected optionId(i: number): string {\n return `${this.listboxId}-opt-${i}`;\n }\n\n /**\n * A `role=\"listbox\"` may only own `option` and `group` children, so a titled\n * bucket becomes a labelled group and an untitled one drops out of the tree\n * entirely — leaving its options as the listbox's own children rather than as\n * role-less wrappers ARIA has no rule for.\n */\n protected groupTitleId(index: number): string {\n return `${this.listboxId}-group-${index}`;\n }\n\n /** Id of the active option for `aria-activedescendant`. */\n protected readonly activeOptionId = computed<string | null>(() => {\n const i = this.activeIndex();\n return i >= 0 && i < this.filtered().length ? this.optionId(i) : null;\n });\n\n private readonly hotkeys = inject(WrHotkey);\n private readonly responsiveConfig = inject(WR_RESPONSIVE_OVERLAYS);\n private readonly destroyRef = inject(DestroyRef);\n private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n private bindingHandle: WrHotkeyHandle | null = null;\n private focusTrap: ConfigurableFocusTrap | null = null;\n private previouslyFocused: HTMLElement | null = null;\n\n /**\n * The open branch below builds the trap inside a `queueMicrotask`, so a\n * palette destroyed while open — in the same task that opened it — runs its\n * destroy hook first and then constructs a fresh trap nothing will ever\n * destroy. A `ConfigurableFocusTrap` plants two anchor elements in the panel\n * and holds it, so that is retained DOM, not just a stray object.\n */\n private destroyed = false;\n\n /** Whether this palette filters `items` itself. */\n protected readonly clientFilter = computed(() => !this.serverSearch());\n\n /**\n * Nothing has been asked yet, so there is nothing to report as missing.\n *\n * A client-filtered palette cannot reach this state — an empty query matches\n * every item, so the list is never empty on open. A server-backed one opens\n * with no items by construction, and saying \"No results\" before a single\n * keystroke answers a question nobody asked.\n */\n protected readonly awaitingQuery = computed(() => this.serverSearch() && this.query().trim().length === 0);\n\n /** Grouped view — what the template renders. */\n protected readonly buckets = computed<readonly Bucket[]>(() =>\n bucketize(this.clientFilter() ? this.items().filter(item => matches(item, this.query())) : this.items())\n );\n\n /**\n * Flat list in RENDER order — what keyboard navigation walks, and what every\n * index in this component means. Derived FROM the buckets rather than from the\n * filter: `bucketize` collects each group as it first appears, so a flat\n * source-order list disagrees with the screen the moment two groups interleave.\n * It did, and one ArrowDown moved the highlight two rows while Enter fired the\n * command below the one that looked selected.\n */\n protected readonly filtered = computed<readonly WrCommandItem[]>(() =>\n this.buckets().flatMap(bucket => bucket.items)\n );\n\n constructor() {\n // The settled query, for a host-driven search. `debounce(() => timer(...))`\n // rather than `debounceTime(this.debounceMs())`: this runs in the\n // constructor, where inputs are not bound yet, so reading the input eagerly\n // would pin the delay to the default and ignore `[debounceMs]` for good.\n //\n // `skip(1)` sits BEFORE the debounce so it drops the mount-time replay of\n // the empty query and nothing else. Downstream it would instead drop the\n // first SETTLED emission — and when a fast typist's opening keystrokes\n // coalesce with that initial `''`, the dropped emission is their query.\n //\n // Both rules are `wr-select`'s, arrived at there the hard way; this is the\n // same pipeline minus the async loader, which the palette does not own.\n toObservable(this.query)\n .pipe(\n skip(1),\n debounce(() => timer(this.debounceMs())),\n takeUntilDestroyed(this.destroyRef)\n )\n .subscribe(query => this.searchChange.emit(query));\n\n // Bind / re-bind the global trigger whenever the spec changes.\n effect(() => {\n this.bindingHandle?.unbind();\n const spec = this.trigger();\n if (!spec) return;\n this.bindingHandle = this.hotkeys.bind(\n spec,\n event => {\n // CLAIM the chord, and the distinction is the whole point: the\n // `preventDefault` OPTION suppresses the browser, while a handler\n // calling `preventDefault()` is how `WrHotkey` is documented to learn\n // that a binding took the chord and the lower-priority ones should be\n // skipped. A palette that only toggled left the chord unclaimed, so\n // two palettes on one page would both open on `mod+k`.\n event.preventDefault();\n this.open.update(v => !v);\n },\n { allowInInput: true }\n );\n });\n\n // Reset query + active index whenever we open.\n effect(() => {\n if (!this.open()) return;\n this.query.set('');\n this.activeIndex.set(0);\n });\n\n // Sheet presentation, kept OUT of the reset above: reading `responsive()` there\n // made the reset depend on it, so a `[responsive]` bound to a signal that\n // flipped while the palette was open wiped whatever the user had typed.\n effect(() => {\n this.presentAsSheet.set(wrPresentAsSheet(this.responsive(), this.responsiveConfig));\n });\n\n // Focus trap + restore.\n effect(() => {\n if (!this.isBrowser) return;\n if (this.open()) {\n const active = document.activeElement;\n this.previouslyFocused = active instanceof HTMLElement ? active : null;\n queueMicrotask(() => {\n if (this.destroyed) return;\n const host = this.panelEl()?.nativeElement;\n if (!host) return;\n this.focusTrap?.destroy();\n this.focusTrap = this.focusTrapFactory.create(host);\n void this.focusTrap.focusInitialElementWhenReady();\n });\n } else {\n this.focusTrap?.destroy();\n this.focusTrap = null;\n const restore = this.previouslyFocused;\n this.previouslyFocused = null;\n if (restore && typeof restore.focus === 'function') restore.focus();\n }\n });\n\n afterNextRender(() => {\n if (this.open()) this.inputEl()?.nativeElement.focus();\n });\n\n // Auto-focus the input when opened.\n effect(() => {\n if (!this.open()) return;\n queueMicrotask(() => this.inputEl()?.nativeElement.focus());\n });\n\n // Clamp the active index when the filtered list shrinks.\n effect(() => {\n const max = Math.max(0, this.filtered().length - 1);\n if (this.activeIndex() > max) this.activeIndex.set(max);\n });\n\n this.destroyRef.onDestroy(() => {\n this.destroyed = true;\n this.bindingHandle?.unbind();\n // The trap is torn down in the close branch of the effect above, which never\n // runs when the component itself goes away while still open — leaving a live\n // trap holding the removed panel and its document listeners.\n this.focusTrap?.destroy();\n this.focusTrap = null;\n });\n }\n\n // Template handlers\n\n protected onQueryInput(event: Event): void {\n this.query.set((event.target as HTMLInputElement).value);\n this.activeIndex.set(0);\n }\n\n protected onKeydown(event: KeyboardEvent): void {\n // Every key below belongs to the input method while it is converting: Enter\n // accepts a candidate, Escape cancels the conversion, the arrows walk the\n // candidate list. Acting on them closed the palette — and threw the query\n // away — the first time a Japanese user pressed Escape to undo a reading.\n if (isComposing(event)) return;\n\n const list = this.filtered();\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (list.length > 0) this.activeIndex.set((this.activeIndex() + 1) % list.length);\n this.revealActive();\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (list.length > 0) this.activeIndex.set((this.activeIndex() - 1 + list.length) % list.length);\n this.revealActive();\n break;\n case 'Home':\n event.preventDefault();\n this.activeIndex.set(0);\n this.revealActive();\n break;\n case 'End':\n event.preventDefault();\n this.activeIndex.set(Math.max(0, list.length - 1));\n this.revealActive();\n break;\n case 'Enter': {\n event.preventDefault();\n const item = list[this.activeIndex()];\n if (item) this.commit(item);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.close();\n break;\n default:\n break;\n }\n }\n\n protected onBackdropClick(): void {\n this.close();\n }\n\n protected onItemClick(item: WrCommandItem, event: MouseEvent): void {\n event.preventDefault();\n this.commit(item);\n }\n\n protected onItemHover(item: WrCommandItem): void {\n const i = this.filtered().indexOf(item);\n if (i >= 0) this.activeIndex.set(i);\n }\n\n /** Flat index of an item within the filtered list — for highlight checks. */\n protected indexOf(item: WrCommandItem): number {\n return this.filtered().indexOf(item);\n }\n\n // Public API\n\n /** Open the palette. */\n show(): void {\n this.open.set(true);\n }\n\n /** Close the palette. */\n close(): void {\n this.open.set(false);\n }\n\n // Internals\n\n /**\n * Keep the highlighted option on screen. The body is a fixed-height scroller and\n * the options are not focusable, so nothing moves it on the browser's behalf —\n * arrow keys walked the highlight straight off the bottom and out of sight.\n * Keyboard only: doing it on hover would fight the pointer that caused it.\n * `wr-select` and `wr-tree` keep the same promise through their own\n * `ensureVisible`; theirs is index maths because they are virtualized.\n */\n private revealActive(): void {\n if (!this.isBrowser) return;\n const id = this.activeOptionId();\n if (!id) return;\n // Ids are position-based and stable, so the element is findable straight away —\n // no need to wait for change detection to re-mark the active row.\n this.panelEl()?.nativeElement.querySelector<HTMLElement>(`#${id}`)?.scrollIntoView({ block: 'nearest' });\n }\n\n private commit(item: WrCommandItem): void {\n item.action?.();\n this.picked.emit(item);\n if (this.closeOnPick()) this.close();\n }\n}\n","@if (open()) {\n <div\n class=\"wr-command-palette\"\n [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedPaletteLabel()\"\n >\n <!-- Backdrop captures clicks to close. Not focusable — keyboard users use\n Esc on the panel below. -->\n\n <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Keydown is delegated from the search input; tabindex enables Esc when\n the input is unfocused. -->\n <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n <div class=\"wr-command-palette__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n </svg>\n <input\n #input\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-expanded]=\"true\"\n [attr.aria-activedescendant]=\"activeOptionId() || null\"\n [placeholder]=\"resolvedPlaceholder()\"\n [value]=\"query()\"\n (input)=\"onQueryInput($event)\"\n />\n <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n </div>\n\n <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n A listbox may only own `option` and `group` children — the same rule\n the buckets already follow — so this row inside it was an\n `aria-required-children` critical for every query that matched\n nothing, and an empty listbox on its own is not. `role=\"status\"` also\n gets the message spoken while focus stays in the search input. -->\n @if (loading()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedLoading() }}</div>\n } @else if (filtered().length === 0 && !awaitingQuery()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n }\n\n <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n <!-- A listbox may only own `option` and `group` children, so a titled\n bucket is a labelled group and an untitled one leaves the tree with\n `role=\"none\"`, promoting its options to the listbox's own. -->\n <div\n class=\"wr-command-palette__group\"\n [attr.role]=\"bucket.title ? 'group' : 'none'\"\n [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n >\n @if (bucket.title) {\n <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n {{ bucket.title }}\n </div>\n }\n @for (item of bucket.items; track item.id) {\n <div\n class=\"wr-command-palette__option\"\n role=\"option\"\n [attr.id]=\"optionId(indexOf(item))\"\n [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n (mouseenter)=\"onItemHover(item)\"\n (mousedown)=\"onItemClick(item, $event)\"\n >\n @if (item.icon) {\n <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n } @else {\n <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n }\n <div class=\"wr-command-palette__option-body\">\n <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n }\n </div>\n @if (item.shortcut) {\n <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Footer slot. A real palette carries something under the list — a key\n legend, a result count, a provider's required attribution — and there\n was nowhere to put it. Projected rather than an input, because the\n content is markup (a link, a logo) rather than a string.\n\n Outside the listbox on purpose: a `role=\"listbox\"` may own only\n `option` and `group` children, the same rule the buckets and the empty\n row already follow. -->\n <div class=\"wr-command-palette__footer\">\n <ng-content select=\"[wrCommandPaletteFooter]\" />\n </div>\n </div>\n </div>\n}\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-command-palette.mjs","sources":["../../../projects/lib/command-palette/command-palette.ts","../../../projects/lib/command-palette/command-palette.html","../../../projects/lib/command-palette/ngwr-command-palette.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 { type BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { isPlatformBrowser } from '@angular/common';\nimport {\n Component,\n DestroyRef,\n type ElementRef,\n PLATFORM_ID,\n ViewEncapsulation,\n afterNextRender,\n computed,\n effect,\n inject,\n input,\n model,\n output,\n signal,\n viewChild,\n} from '@angular/core';\nimport { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';\n\nimport { debounce, skip, timer } from 'rxjs';\n\nimport { WrHotkey, type WrHotkeyHandle, type WrHotkeySpec } from 'ngwr/hotkey';\nimport { readI18nText, useI18nText } from 'ngwr/i18n';\nimport { WrIcon } from 'ngwr/icon';\nimport { WR_RESPONSIVE_OVERLAYS, wrPresentAsSheet } from 'ngwr/overlay';\nimport { isComposing } from 'ngwr/utils';\n\nimport type { WrCommandItem } from './interfaces';\n\ninterface Bucket {\n readonly title: string | null;\n readonly items: readonly WrCommandItem[];\n}\n\nlet listboxUid = 0;\n\nfunction bucketize(items: readonly WrCommandItem[]): readonly Bucket[] {\n const map = new Map<string | null, WrCommandItem[]>();\n for (const item of items) {\n const key = item.group ?? null;\n const bucket = map.get(key);\n if (bucket) bucket.push(item);\n else map.set(key, [item]);\n }\n return [...map.entries()].map(([title, items]) => ({ title, items }));\n}\n\nfunction matches(item: WrCommandItem, query: string): boolean {\n if (!query) return true;\n const q = query.toLowerCase();\n if (item.label.toLowerCase().includes(q)) return true;\n if (item.description?.toLowerCase().includes(q)) return true;\n if (item.group?.toLowerCase().includes(q)) return true;\n if (item.keywords?.some(k => k.toLowerCase().includes(q))) return true;\n return false;\n}\n\n/**\n * `⌘K`-style command palette — a centred modal with a search input and\n * filtered list of actions. Items can be grouped, have icons, descriptions,\n * and visual shortcut hints.\n *\n * Drop one at the root of the app, pass it the list of commands, and bind\n * a global hotkey (default `'mod+k'`). Use `[(open)]` for controlled\n * visibility, or let it manage itself.\n *\n * @example\n * ```html\n * <wr-command-palette [items]=\"commands\" trigger=\"mod+k\" (picked)=\"onPicked($event)\" />\n * ```\n *\n * @see https://ngwr.dev/reference/components/command-palette\n */\n@Component({\n selector: 'wr-command-palette',\n templateUrl: './command-palette.html',\n encapsulation: ViewEncapsulation.None,\n imports: [WrIcon],\n})\nexport class WrCommandPalette {\n /** Accessible name. Falls back to `commandPalette.label`, then `'Command palette'`. */\n readonly paletteLabel = input<string | null>(null);\n\n protected readonly resolvedPaletteLabel = useI18nText(this.paletteLabel, 'commandPalette.label', 'Command palette');\n\n /** Items shown in the palette. */\n readonly items = input<readonly WrCommandItem[]>([]);\n\n /** Controlled open state (two-way bindable). @default false */\n readonly open = model(false);\n\n /** Global hotkey that opens the palette. `null` disables auto-binding. @default 'mod+k' */\n readonly trigger = input<WrHotkeySpec | null>('mod+k');\n\n /** Search input placeholder. Falls back to `commandPalette.placeholder`. */\n readonly placeholder = input<string | null>(null);\n\n /** Text shown when no items match. Falls back to `commandPalette.noResults`. */\n readonly emptyText = input<string | null>(null);\n\n /**\n * Overrides the `commandPalette.loading` catalog string, shown instead of\n * {@link emptyText} while {@link loading} is true.\n */\n readonly loadingText = input<string | null>(null);\n\n protected readonly resolvedPlaceholder = useI18nText(\n this.placeholder,\n 'commandPalette.placeholder',\n 'Type a command or search…'\n );\n protected readonly resolvedEmpty = useI18nText(this.emptyText, 'commandPalette.noResults', 'No results');\n protected readonly resolvedLoading = useI18nText(this.loadingText, 'commandPalette.loading', 'Searching…');\n\n /**\n * The key-cap chip beside the search field. It was the literal `esc` in the\n * template — the one string on this component no catalog could reach, so a\n * fully Russian palette still hinted in English.\n */\n protected readonly resolvedEscHint = readI18nText('commandPalette.escHint', 'esc');\n\n /** Auto-close on `(picked)`. Set false to keep open. @default true */\n readonly closeOnPick = input(true, { transform: coerceBooleanProperty });\n\n /**\n * Present the palette full-screen on small viewports instead of a centred\n * modal. `undefined` follows the app-wide `provideWrResponsiveOverlays()`\n * setting; `true`/`false` overrides it. The palette docks to the top (it\n * auto-focuses its input, so the on-screen keyboard stays clear).\n * @default undefined\n */\n readonly responsive = input<boolean | undefined, BooleanInput>(undefined, {\n transform: (v: BooleanInput): boolean | undefined => (v == null ? undefined : coerceBooleanProperty(v)),\n });\n\n /** Fires when the user commits an item (Enter / click). */\n readonly picked = output<WrCommandItem>();\n\n /**\n * The search text. Two-way, so a host can seed it, clear it, or read what the\n * user is looking for — the palette used to keep this to itself, which is what\n * made it impossible to back with anything but a static `items` array.\n *\n * Writing it does NOT re-run a host's search on its own: the debounced\n * {@link searchChange} output is what fires, on exactly the cadence\n * {@link debounceMs} sets.\n */\n readonly query = model('');\n\n /**\n * The item list is already scoped to the query upstream — skip the built-in\n * client-side filter. Set it when `[items]` is fed from a server via the\n * {@link searchChange} output.\n *\n * Without this, a backend that ranks or tolerates typos (returning rows whose\n * labels do not literally contain the query) would have those rows hidden\n * again on the client — the same rule `wr-select` follows, and the same\n * reason. @default false\n */\n readonly serverSearch = input(false, { transform: coerceBooleanProperty });\n\n /**\n * A host-driven search is in flight. Swaps the empty row for\n * {@link loadingText} — an async palette that says \"No results\" between every\n * keystroke and its answer is stating something false. @default false\n */\n readonly loading = input(false, { transform: coerceBooleanProperty });\n\n /**\n * How long the query must settle before {@link searchChange} fires, in ms.\n * A search request per keystroke is what exhausts a metered search backend:\n * typing `select` is six requests at 0 and roughly one at 250. @default 250\n */\n readonly debounceMs = input(250, { transform: (v: unknown): number => Math.max(0, Number(v) || 0) });\n\n /**\n * The settled query. This is the hook for a server-backed palette: dispatch\n * on it, then feed the result into `[items]` with `[serverSearch]` set.\n *\n * Fires on the {@link debounceMs} cadence, NOT per keystroke — `queryChange`\n * is the per-keystroke signal if that is what you want.\n */\n readonly searchChange = output<string>();\n\n protected readonly activeIndex = signal(0);\n\n /** Whether the current opening is presented full-screen. Decided on open. */\n protected readonly presentAsSheet = signal(false);\n protected readonly inputEl = viewChild<ElementRef<HTMLInputElement>>('input');\n protected readonly panelEl = viewChild<ElementRef<HTMLElement>>('panel');\n\n /** Listbox id (referenced by the input's `aria-controls`). */\n protected readonly listboxId = `wr-command-palette-listbox-${++listboxUid}`;\n\n /** @internal Build a stable option id for a given flat index. */\n protected optionId(i: number): string {\n return `${this.listboxId}-opt-${i}`;\n }\n\n /**\n * A `role=\"listbox\"` may only own `option` and `group` children, so a titled\n * bucket becomes a labelled group and an untitled one drops out of the tree\n * entirely — leaving its options as the listbox's own children rather than as\n * role-less wrappers ARIA has no rule for.\n */\n protected groupTitleId(index: number): string {\n return `${this.listboxId}-group-${index}`;\n }\n\n /** Id of the active option for `aria-activedescendant`. */\n protected readonly activeOptionId = computed<string | null>(() => {\n const i = this.activeIndex();\n return i >= 0 && i < this.filtered().length ? this.optionId(i) : null;\n });\n\n private readonly hotkeys = inject(WrHotkey);\n private readonly responsiveConfig = inject(WR_RESPONSIVE_OVERLAYS);\n private readonly destroyRef = inject(DestroyRef);\n private readonly focusTrapFactory = inject(ConfigurableFocusTrapFactory);\n private readonly isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n private bindingHandle: WrHotkeyHandle | null = null;\n private focusTrap: ConfigurableFocusTrap | null = null;\n private previouslyFocused: HTMLElement | null = null;\n\n /**\n * The open branch below builds the trap inside a `queueMicrotask`, so a\n * palette destroyed while open — in the same task that opened it — runs its\n * destroy hook first and then constructs a fresh trap nothing will ever\n * destroy. A `ConfigurableFocusTrap` plants two anchor elements in the panel\n * and holds it, so that is retained DOM, not just a stray object.\n */\n private destroyed = false;\n\n /** Whether this palette filters `items` itself. */\n protected readonly clientFilter = computed(() => !this.serverSearch());\n\n /**\n * Nothing has been asked yet, so there is nothing to report as missing.\n *\n * A client-filtered palette cannot reach this state — an empty query matches\n * every item, so the list is never empty on open. A server-backed one opens\n * with no items by construction, and saying \"No results\" before a single\n * keystroke answers a question nobody asked.\n */\n protected readonly awaitingQuery = computed(() => this.serverSearch() && this.query().trim().length === 0);\n\n /** Grouped view — what the template renders. */\n protected readonly buckets = computed<readonly Bucket[]>(() =>\n bucketize(this.clientFilter() ? this.items().filter(item => matches(item, this.query())) : this.items())\n );\n\n /**\n * Flat list in RENDER order — what keyboard navigation walks, and what every\n * index in this component means. Derived FROM the buckets rather than from the\n * filter: `bucketize` collects each group as it first appears, so a flat\n * source-order list disagrees with the screen the moment two groups interleave.\n * It did, and one ArrowDown moved the highlight two rows while Enter fired the\n * command below the one that looked selected.\n */\n protected readonly filtered = computed<readonly WrCommandItem[]>(() =>\n this.buckets().flatMap(bucket => bucket.items)\n );\n\n constructor() {\n // The settled query, for a host-driven search. `debounce(() => timer(...))`\n // rather than `debounceTime(this.debounceMs())`: this runs in the\n // constructor, where inputs are not bound yet, so reading the input eagerly\n // would pin the delay to the default and ignore `[debounceMs]` for good.\n //\n // `skip(1)` sits BEFORE the debounce so it drops the mount-time replay of\n // the empty query and nothing else. Downstream it would instead drop the\n // first SETTLED emission — and when a fast typist's opening keystrokes\n // coalesce with that initial `''`, the dropped emission is their query.\n //\n // Both rules are `wr-select`'s, arrived at there the hard way; this is the\n // same pipeline minus the async loader, which the palette does not own.\n toObservable(this.query)\n .pipe(\n skip(1),\n debounce(() => timer(this.debounceMs())),\n takeUntilDestroyed(this.destroyRef)\n )\n .subscribe(query => this.searchChange.emit(query));\n\n // Bind / re-bind the global trigger whenever the spec changes.\n effect(() => {\n this.bindingHandle?.unbind();\n const spec = this.trigger();\n if (!spec) return;\n this.bindingHandle = this.hotkeys.bind(\n spec,\n event => {\n // CLAIM the chord, and the distinction is the whole point: the\n // `preventDefault` OPTION suppresses the browser, while a handler\n // calling `preventDefault()` is how `WrHotkey` is documented to learn\n // that a binding took the chord and the lower-priority ones should be\n // skipped. A palette that only toggled left the chord unclaimed, so\n // two palettes on one page would both open on `mod+k`.\n event.preventDefault();\n this.open.update(v => !v);\n },\n { allowInInput: true }\n );\n });\n\n // Reset query + active index whenever we open.\n effect(() => {\n if (!this.open()) return;\n this.query.set('');\n this.activeIndex.set(0);\n });\n\n // Sheet presentation, kept OUT of the reset above: reading `responsive()` there\n // made the reset depend on it, so a `[responsive]` bound to a signal that\n // flipped while the palette was open wiped whatever the user had typed.\n effect(() => {\n this.presentAsSheet.set(wrPresentAsSheet(this.responsive(), this.responsiveConfig));\n });\n\n // Focus trap + restore.\n effect(() => {\n if (!this.isBrowser) return;\n if (this.open()) {\n const active = document.activeElement;\n this.previouslyFocused = active instanceof HTMLElement ? active : null;\n queueMicrotask(() => {\n if (this.destroyed) return;\n const host = this.panelEl()?.nativeElement;\n if (!host) return;\n this.focusTrap?.destroy();\n this.focusTrap = this.focusTrapFactory.create(host);\n void this.focusTrap.focusInitialElementWhenReady();\n });\n } else {\n this.focusTrap?.destroy();\n this.focusTrap = null;\n const restore = this.previouslyFocused;\n this.previouslyFocused = null;\n if (restore && typeof restore.focus === 'function') restore.focus();\n }\n });\n\n afterNextRender(() => {\n if (this.open()) this.inputEl()?.nativeElement.focus();\n });\n\n // Auto-focus the input when opened.\n effect(() => {\n if (!this.open()) return;\n queueMicrotask(() => this.inputEl()?.nativeElement.focus());\n });\n\n // Clamp the active index when the filtered list shrinks.\n effect(() => {\n const max = Math.max(0, this.filtered().length - 1);\n if (this.activeIndex() > max) this.activeIndex.set(max);\n });\n\n this.destroyRef.onDestroy(() => {\n this.destroyed = true;\n this.bindingHandle?.unbind();\n // The trap is torn down in the close branch of the effect above, which never\n // runs when the component itself goes away while still open — leaving a live\n // trap holding the removed panel and its document listeners.\n this.focusTrap?.destroy();\n this.focusTrap = null;\n });\n }\n\n // Template handlers\n\n protected onQueryInput(event: Event): void {\n this.query.set((event.target as HTMLInputElement).value);\n this.activeIndex.set(0);\n // The highlight goes back to the first row, and the SCROLLER has to go with\n // it. Nothing moved it otherwise: the options are not focusable, so the\n // browser scrolls nothing on its own, and `revealActive` is called only from\n // the arrow keys. Edit the query after arrowing down a long list and the\n // highlight sat at the top, out of sight, while the rows on screen were\n // something else — and Enter ran the command the user could not see.\n //\n // `scrollTop = 0` rather than `revealActive()`: the list has just been\n // re-filtered, so under zoneless CD the row at index 0 is still the OLD one\n // until change detection runs, and the destination is the top either way.\n const body = this.panelEl()?.nativeElement.querySelector<HTMLElement>('.wr-command-palette__body');\n if (body) body.scrollTop = 0;\n }\n\n protected onKeydown(event: KeyboardEvent): void {\n // Every key below belongs to the input method while it is converting: Enter\n // accepts a candidate, Escape cancels the conversion, the arrows walk the\n // candidate list. Acting on them closed the palette — and threw the query\n // away — the first time a Japanese user pressed Escape to undo a reading.\n if (isComposing(event)) return;\n\n const list = this.filtered();\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (list.length > 0) this.activeIndex.set((this.activeIndex() + 1) % list.length);\n this.revealActive();\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (list.length > 0) this.activeIndex.set((this.activeIndex() - 1 + list.length) % list.length);\n this.revealActive();\n break;\n case 'Home':\n event.preventDefault();\n this.activeIndex.set(0);\n this.revealActive();\n break;\n case 'End':\n event.preventDefault();\n this.activeIndex.set(Math.max(0, list.length - 1));\n this.revealActive();\n break;\n case 'Enter': {\n event.preventDefault();\n const item = list[this.activeIndex()];\n if (item) this.commit(item);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.close();\n break;\n default:\n break;\n }\n }\n\n protected onBackdropClick(): void {\n this.close();\n }\n\n protected onItemClick(item: WrCommandItem, event: MouseEvent): void {\n event.preventDefault();\n this.commit(item);\n }\n\n protected onItemHover(item: WrCommandItem): void {\n const i = this.filtered().indexOf(item);\n if (i >= 0) this.activeIndex.set(i);\n }\n\n /** Flat index of an item within the filtered list — for highlight checks. */\n protected indexOf(item: WrCommandItem): number {\n return this.filtered().indexOf(item);\n }\n\n // Public API\n\n /** Open the palette. */\n show(): void {\n this.open.set(true);\n }\n\n /** Close the palette. */\n close(): void {\n this.open.set(false);\n }\n\n // Internals\n\n /**\n * Keep the highlighted option on screen. The body is a fixed-height scroller and\n * the options are not focusable, so nothing moves it on the browser's behalf —\n * arrow keys walked the highlight straight off the bottom and out of sight.\n * Keyboard only: doing it on hover would fight the pointer that caused it.\n * `wr-select` and `wr-tree` keep the same promise through their own\n * `ensureVisible`; theirs is index maths because they are virtualized.\n */\n private revealActive(): void {\n if (!this.isBrowser) return;\n const id = this.activeOptionId();\n if (!id) return;\n // Ids are position-based and stable, so the element is findable straight away —\n // no need to wait for change detection to re-mark the active row.\n this.panelEl()?.nativeElement.querySelector<HTMLElement>(`#${id}`)?.scrollIntoView({ block: 'nearest' });\n }\n\n private commit(item: WrCommandItem): void {\n item.action?.();\n this.picked.emit(item);\n if (this.closeOnPick()) this.close();\n }\n}\n","@if (open()) {\n <div\n class=\"wr-command-palette\"\n [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n role=\"dialog\"\n aria-modal=\"true\"\n [attr.aria-label]=\"resolvedPaletteLabel()\"\n >\n <!-- Backdrop captures clicks to close. Not focusable — keyboard users use\n Esc on the panel below. -->\n\n <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n <!-- Keydown is delegated from the search input; tabindex enables Esc when\n the input is unfocused. -->\n <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n <div class=\"wr-command-palette__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n </svg>\n <input\n #input\n type=\"text\"\n role=\"combobox\"\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-expanded]=\"true\"\n [attr.aria-activedescendant]=\"activeOptionId() || null\"\n [placeholder]=\"resolvedPlaceholder()\"\n [value]=\"query()\"\n (input)=\"onQueryInput($event)\"\n />\n <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n </div>\n\n <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n A listbox may only own `option` and `group` children — the same rule\n the buckets already follow — so this row inside it was an\n `aria-required-children` critical for every query that matched\n nothing, and an empty listbox on its own is not. `role=\"status\"` also\n gets the message spoken while focus stays in the search input. -->\n @if (loading()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedLoading() }}</div>\n } @else if (filtered().length === 0 && !awaitingQuery()) {\n <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n }\n\n <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n <!-- A listbox may only own `option` and `group` children, so a titled\n bucket is a labelled group and an untitled one leaves the tree with\n `role=\"none\"`, promoting its options to the listbox's own. -->\n <div\n class=\"wr-command-palette__group\"\n [attr.role]=\"bucket.title ? 'group' : 'none'\"\n [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n >\n @if (bucket.title) {\n <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n {{ bucket.title }}\n </div>\n }\n @for (item of bucket.items; track item.id) {\n <div\n class=\"wr-command-palette__option\"\n role=\"option\"\n [attr.id]=\"optionId(indexOf(item))\"\n [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n (mouseenter)=\"onItemHover(item)\"\n (mousedown)=\"onItemClick(item, $event)\"\n >\n @if (item.icon) {\n <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n } @else {\n <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n }\n <div class=\"wr-command-palette__option-body\">\n <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n }\n </div>\n @if (item.shortcut) {\n <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n }\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Footer slot. A real palette carries something under the list — a key\n legend, a result count, a provider's required attribution — and there\n was nowhere to put it. Projected rather than an input, because the\n content is markup (a link, a logo) rather than a string.\n\n Outside the listbox on purpose: a `role=\"listbox\"` may own only\n `option` and `group` children, the same rule the buckets and the empty\n row already follow. -->\n <div class=\"wr-command-palette__footer\">\n <ng-content select=\"[wrCommandPaletteFooter]\" />\n </div>\n </div>\n </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
@@ -211,10 +211,10 @@ class WrCompare {
211
211
  inlineFraction(clientX, rect) {
212
212
  return this.rtl() ? (rect.right - clientX) / rect.width : (clientX - rect.left) / rect.width;
213
213
  }
214
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCompare, deps: [], target: i0.ɵɵFactoryTarget.Component });
215
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrCompare, isStandalone: true, selector: "wr-compare", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, showHandle: { classPropertyName: "showHandle", publicName: "showHandle", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minPosition: { classPropertyName: "minPosition", publicName: "minPosition", isSignal: true, isRequired: false, transformFunction: null }, maxPosition: { classPropertyName: "maxPosition", publicName: "maxPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { position: "positionChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<div\n class=\"wr-compare__surface\"\n role=\"slider\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [attr.aria-orientation]=\"orientation()\"\n [attr.aria-valuemin]=\"minPosition()\"\n [attr.aria-valuemax]=\"maxPosition()\"\n [attr.aria-valuenow]=\"position()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event)\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerup)=\"onPointerUp($event)\"\n (pointercancel)=\"onPointerUp($event)\"\n (keydown)=\"onKeydown($event)\"\n>\n <div class=\"wr-compare__layers\">\n <div class=\"wr-compare__layer wr-compare__layer--before\">\n <ng-content select=\"[wrCompareBefore]\" />\n </div>\n <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n <ng-content select=\"[wrCompareAfter]\" />\n </div>\n </div>\n\n <div\n class=\"wr-compare__divider\"\n [style.left.%]=\"orientation() === 'horizontal' ? dividerLeft() : null\"\n [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n aria-hidden=\"true\"\n >\n @if (showHandle()) {\n <span class=\"wr-compare__handle\">\n @if (orientation() === 'horizontal') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <path\n d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n } @else {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <path\n d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n }\n </span>\n }\n </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
214
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCompare, deps: [], target: i0.ɵɵFactoryTarget.Component });
215
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrCompare, isStandalone: true, selector: "wr-compare", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, showHandle: { classPropertyName: "showHandle", publicName: "showHandle", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minPosition: { classPropertyName: "minPosition", publicName: "minPosition", isSignal: true, isRequired: false, transformFunction: null }, maxPosition: { classPropertyName: "maxPosition", publicName: "maxPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { position: "positionChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<div\n class=\"wr-compare__surface\"\n role=\"slider\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [attr.aria-orientation]=\"orientation()\"\n [attr.aria-valuemin]=\"minPosition()\"\n [attr.aria-valuemax]=\"maxPosition()\"\n [attr.aria-valuenow]=\"position()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event)\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerup)=\"onPointerUp($event)\"\n (pointercancel)=\"onPointerUp($event)\"\n (keydown)=\"onKeydown($event)\"\n>\n <div class=\"wr-compare__layers\">\n <div class=\"wr-compare__layer wr-compare__layer--before\">\n <ng-content select=\"[wrCompareBefore]\" />\n </div>\n <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n <ng-content select=\"[wrCompareAfter]\" />\n </div>\n </div>\n\n <div\n class=\"wr-compare__divider\"\n [style.left.%]=\"orientation() === 'horizontal' ? dividerLeft() : null\"\n [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n aria-hidden=\"true\"\n >\n @if (showHandle()) {\n <span class=\"wr-compare__handle\">\n @if (orientation() === 'horizontal') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <path\n d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n } @else {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <path\n d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n }\n </span>\n }\n </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
216
216
  }
217
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCompare, decorators: [{
217
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCompare, decorators: [{
218
218
  type: Component,
219
219
  args: [{ selector: 'wr-compare', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<div\n class=\"wr-compare__surface\"\n role=\"slider\"\n [attr.aria-label]=\"resolvedAriaLabel()\"\n [attr.aria-orientation]=\"orientation()\"\n [attr.aria-valuemin]=\"minPosition()\"\n [attr.aria-valuemax]=\"maxPosition()\"\n [attr.aria-valuenow]=\"position()\"\n [attr.aria-disabled]=\"disabled() || null\"\n [attr.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event)\"\n (pointermove)=\"onPointerMove($event)\"\n (pointerup)=\"onPointerUp($event)\"\n (pointercancel)=\"onPointerUp($event)\"\n (keydown)=\"onKeydown($event)\"\n>\n <div class=\"wr-compare__layers\">\n <div class=\"wr-compare__layer wr-compare__layer--before\">\n <ng-content select=\"[wrCompareBefore]\" />\n </div>\n <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n <ng-content select=\"[wrCompareAfter]\" />\n </div>\n </div>\n\n <div\n class=\"wr-compare__divider\"\n [style.left.%]=\"orientation() === 'horizontal' ? dividerLeft() : null\"\n [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n aria-hidden=\"true\"\n >\n @if (showHandle()) {\n <span class=\"wr-compare__handle\">\n @if (orientation() === 'horizontal') {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <path\n d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n } @else {\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n <path\n d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"1.5\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n }\n </span>\n }\n </div>\n</div>\n" }]
220
220
  }], ctorParameters: () => [], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }, { type: i0.Output, args: ["positionChange"] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], showHandle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHandle", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], minPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "minPosition", required: false }] }], maxPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxPosition", required: false }] }] } });
@@ -170,10 +170,10 @@ class WrConfetti {
170
170
  this.rafId = null;
171
171
  }
172
172
  }
173
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrConfetti, deps: [], target: i0.ɵɵFactoryTarget.Service });
174
- static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: WrConfetti });
173
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrConfetti, deps: [], target: i0.ɵɵFactoryTarget.Service });
174
+ static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: WrConfetti });
175
175
  }
176
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrConfetti, decorators: [{
176
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrConfetti, decorators: [{
177
177
  type: Service
178
178
  }], ctorParameters: () => [] });
179
179
 
@@ -499,10 +499,10 @@ class WrContextMenuItem {
499
499
  isRtl() {
500
500
  return this.dir?.value === 'rtl';
501
501
  }
502
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
503
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrContextMenuItem, isStandalone: true, selector: "wr-context-menu-item", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, submenu: { classPropertyName: "submenu", publicName: "submenu", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem" }, listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave($event)", "click": "onClick()", "keydown.enter": "activate($event)", "keydown.space": "activate($event)", "keydown.arrowRight": "onArrowRight($event)", "keydown.arrowLeft": "onArrowLeft($event)" }, properties: { "class": "classes()", "attr.tabindex": "-1", "attr.aria-disabled": "disabled() ? true : null", "attr.aria-haspopup": "submenu() ? \"menu\" : null", "attr.aria-expanded": "submenu() ? (submenuOpen ? \"true\" : \"false\") : null", "attr.aria-controls": "submenuId()" } }, ngImport: i0, template: "@if (icon(); as name) {\n <wr-icon class=\"wr-context-menu-item__icon\" [name]=\"name\" size=\"14\" />\n}\n<span class=\"wr-context-menu-item__label\"><ng-content /></span>\n@if (submenu()) {\n <svg\n class=\"wr-icon__svg wr-context-menu-item__chevron\"\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=\"m9 18 6-6-6-6\" />\n </svg>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
502
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
503
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: WrContextMenuItem, isStandalone: true, selector: "wr-context-menu-item", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, submenu: { classPropertyName: "submenu", publicName: "submenu", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem" }, listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave($event)", "click": "onClick()", "keydown.enter": "activate($event)", "keydown.space": "activate($event)", "keydown.arrowRight": "onArrowRight($event)", "keydown.arrowLeft": "onArrowLeft($event)" }, properties: { "class": "classes()", "attr.tabindex": "-1", "attr.aria-disabled": "disabled() ? true : null", "attr.aria-haspopup": "submenu() ? \"menu\" : null", "attr.aria-expanded": "submenu() ? (submenuOpen ? \"true\" : \"false\") : null", "attr.aria-controls": "submenuId()" } }, ngImport: i0, template: "@if (icon(); as name) {\n <wr-icon class=\"wr-context-menu-item__icon\" [name]=\"name\" size=\"14\" />\n}\n<span class=\"wr-context-menu-item__label\"><ng-content /></span>\n@if (submenu()) {\n <svg\n class=\"wr-icon__svg wr-context-menu-item__chevron\"\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=\"m9 18 6-6-6-6\" />\n </svg>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
504
504
  }
505
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuItem, decorators: [{
505
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenuItem, decorators: [{
506
506
  type: Component,
507
507
  args: [{ selector: 'wr-context-menu-item', encapsulation: ViewEncapsulation.None, host: {
508
508
  role: 'menuitem',
@@ -1040,10 +1040,10 @@ class WrContextMenu {
1040
1040
  this.closeOverlay();
1041
1041
  }, WrContextMenu.LEAVE_DELAY);
1042
1042
  }
1043
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1044
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.5", type: WrContextMenu, isStandalone: true, selector: "[wrContextMenu]", inputs: { menu: { classPropertyName: "menu", publicName: "wrContextMenu", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "contextmenu": "onContextMenu($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointerup": "onPointerUp()", "pointercancel": "onPointerUp()" }, properties: { "attr.aria-controls": "openMenuId()" }, classAttribute: "wr-context-menu-host" }, exportAs: ["wrContextMenuTrigger"], ngImport: i0 });
1043
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
1044
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.6", type: WrContextMenu, isStandalone: true, selector: "[wrContextMenu]", inputs: { menu: { classPropertyName: "menu", publicName: "wrContextMenu", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "contextmenu": "onContextMenu($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointerup": "onPointerUp()", "pointercancel": "onPointerUp()" }, properties: { "attr.aria-controls": "openMenuId()" }, classAttribute: "wr-context-menu-host" }, exportAs: ["wrContextMenuTrigger"], ngImport: i0 });
1045
1045
  }
1046
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenu, decorators: [{
1046
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenu, decorators: [{
1047
1047
  type: Directive,
1048
1048
  args: [{
1049
1049
  selector: '[wrContextMenu]',
@@ -1089,10 +1089,10 @@ class WrContextMenuPanel {
1089
1089
  /** The internal template the directive portals into the overlay. @internal */
1090
1090
  contentTpl = viewChild.required(TemplateRef, /* @ts-ignore */
1091
1091
  ...(ngDevMode ? [{ debugName: "contentTpl" }] : /* istanbul ignore next */ []));
1092
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
1093
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.5", type: WrContextMenuPanel, isStandalone: true, selector: "wr-context-menu", host: { properties: { "style.display": "'none'" } }, viewQueries: [{ propertyName: "contentTpl", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], exportAs: ["wrContextMenu"], ngImport: i0, template: '<ng-template><div class="wr-context-menu" role="menu"><ng-content /></div></ng-template>', isInline: true, encapsulation: i0.ViewEncapsulation.None });
1092
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenuPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
1093
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.6", type: WrContextMenuPanel, isStandalone: true, selector: "wr-context-menu", host: { properties: { "style.display": "'none'" } }, viewQueries: [{ propertyName: "contentTpl", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], exportAs: ["wrContextMenu"], ngImport: i0, template: '<ng-template><div class="wr-context-menu" role="menu"><ng-content /></div></ng-template>', isInline: true, encapsulation: i0.ViewEncapsulation.None });
1094
1094
  }
1095
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuPanel, decorators: [{
1095
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenuPanel, decorators: [{
1096
1096
  type: Component,
1097
1097
  args: [{
1098
1098
  selector: 'wr-context-menu',
@@ -1129,10 +1129,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
1129
1129
  * ```
1130
1130
  */
1131
1131
  class WrContextMenuDivider {
1132
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
1133
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: WrContextMenuDivider, isStandalone: true, selector: "wr-context-menu-divider", host: { attributes: { "role": "separator", "aria-orientation": "horizontal" }, classAttribute: "wr-context-menu-divider" }, ngImport: i0, template: '', isInline: true, encapsulation: i0.ViewEncapsulation.None });
1132
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenuDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
1133
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.6", type: WrContextMenuDivider, isStandalone: true, selector: "wr-context-menu-divider", host: { attributes: { "role": "separator", "aria-orientation": "horizontal" }, classAttribute: "wr-context-menu-divider" }, ngImport: i0, template: '', isInline: true, encapsulation: i0.ViewEncapsulation.None });
1134
1134
  }
1135
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuDivider, decorators: [{
1135
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrContextMenuDivider, decorators: [{
1136
1136
  type: Component,
1137
1137
  args: [{
1138
1138
  selector: 'wr-context-menu-divider',
@@ -129,10 +129,10 @@ class WrCookie {
129
129
  for (const k of this.keys())
130
130
  this.remove(k);
131
131
  }
132
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCookie, deps: [], target: i0.ɵɵFactoryTarget.Service });
133
- static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: WrCookie });
132
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCookie, deps: [], target: i0.ɵɵFactoryTarget.Service });
133
+ static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.6", ngImport: i0, type: WrCookie });
134
134
  }
135
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCookie, decorators: [{
135
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: WrCookie, decorators: [{
136
136
  type: Service
137
137
  }] });
138
138