ngwr 12.0.0 → 12.2.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 (155) hide show
  1. package/README.md +79 -20
  2. package/alert/styles/_index.scss +11 -4
  3. package/badge/styles/_index.scss +30 -0
  4. package/badge/styles/_tag.scss +15 -1
  5. package/descriptions/styles/_index.scss +13 -3
  6. package/drawer/styles/_index.scss +95 -1
  7. package/fesm2022/ngwr-action-sheet.mjs +3 -3
  8. package/fesm2022/ngwr-affix.mjs +3 -3
  9. package/fesm2022/ngwr-alert.mjs +3 -3
  10. package/fesm2022/ngwr-anchor.mjs +3 -3
  11. package/fesm2022/ngwr-aurora.mjs +3 -3
  12. package/fesm2022/ngwr-avatar.mjs +3 -3
  13. package/fesm2022/ngwr-back-top.mjs +3 -3
  14. package/fesm2022/ngwr-badge.mjs +6 -6
  15. package/fesm2022/ngwr-bar-chart.mjs +3 -3
  16. package/fesm2022/ngwr-blur-text.mjs +3 -3
  17. package/fesm2022/ngwr-border-glow.mjs +3 -3
  18. package/fesm2022/ngwr-breadcrumbs.mjs +6 -6
  19. package/fesm2022/ngwr-burger.mjs +3 -3
  20. package/fesm2022/ngwr-button.mjs +6 -6
  21. package/fesm2022/ngwr-calendar-heatmap.mjs +3 -3
  22. package/fesm2022/ngwr-calendar.mjs +3 -3
  23. package/fesm2022/ngwr-card.mjs +9 -9
  24. package/fesm2022/ngwr-carousel.mjs +6 -6
  25. package/fesm2022/ngwr-cascader.mjs +3 -3
  26. package/fesm2022/ngwr-checkbox.mjs +6 -6
  27. package/fesm2022/ngwr-circular-text.mjs +3 -3
  28. package/fesm2022/ngwr-click-spark.mjs +3 -3
  29. package/fesm2022/ngwr-clipboard.mjs +3 -3
  30. package/fesm2022/ngwr-collapse.mjs +9 -9
  31. package/fesm2022/ngwr-color-picker.mjs +6 -6
  32. package/fesm2022/ngwr-color-picker.mjs.map +1 -1
  33. package/fesm2022/ngwr-command-palette.mjs +3 -3
  34. package/fesm2022/ngwr-compare.mjs +3 -3
  35. package/fesm2022/ngwr-confetti.mjs +3 -3
  36. package/fesm2022/ngwr-context-menu.mjs +12 -12
  37. package/fesm2022/ngwr-cookie.mjs +3 -3
  38. package/fesm2022/ngwr-counter.mjs +6 -6
  39. package/fesm2022/ngwr-date-adapters-fns.mjs +3 -3
  40. package/fesm2022/ngwr-date-adapters-luxon.mjs +3 -3
  41. package/fesm2022/ngwr-date-picker.mjs +18 -18
  42. package/fesm2022/ngwr-date.mjs +3 -3
  43. package/fesm2022/ngwr-decrypt-text.mjs +3 -3
  44. package/fesm2022/ngwr-density.mjs +6 -6
  45. package/fesm2022/ngwr-descriptions.mjs +6 -6
  46. package/fesm2022/ngwr-dialog.mjs +15 -15
  47. package/fesm2022/ngwr-directives.mjs +12 -12
  48. package/fesm2022/ngwr-divider.mjs +3 -3
  49. package/fesm2022/ngwr-donut-chart.mjs +3 -3
  50. package/fesm2022/ngwr-drag-drop.mjs +6 -6
  51. package/fesm2022/ngwr-drawer.mjs +24 -18
  52. package/fesm2022/ngwr-drawer.mjs.map +1 -1
  53. package/fesm2022/ngwr-dropdown.mjs +9 -9
  54. package/fesm2022/ngwr-empty.mjs +3 -3
  55. package/fesm2022/ngwr-event-calendar.mjs +6 -6
  56. package/fesm2022/ngwr-falling-text.mjs +3 -3
  57. package/fesm2022/ngwr-file-upload.mjs +3 -3
  58. package/fesm2022/ngwr-form.mjs +9 -9
  59. package/fesm2022/ngwr-fuzzy-text.mjs +3 -3
  60. package/fesm2022/ngwr-gauge.mjs +3 -3
  61. package/fesm2022/ngwr-glitch-text.mjs +3 -3
  62. package/fesm2022/ngwr-gradient-text.mjs +3 -3
  63. package/fesm2022/ngwr-hotkey.mjs +6 -6
  64. package/fesm2022/ngwr-i18n.mjs +9 -9
  65. package/fesm2022/ngwr-icon.mjs +6 -6
  66. package/fesm2022/ngwr-image-cropper.mjs +3 -3
  67. package/fesm2022/ngwr-input-number.mjs +3 -3
  68. package/fesm2022/ngwr-input-otp.mjs +3 -3
  69. package/fesm2022/ngwr-input.mjs +15 -15
  70. package/fesm2022/ngwr-keyboard.mjs +3 -3
  71. package/fesm2022/ngwr-knob.mjs +3 -3
  72. package/fesm2022/ngwr-layout.mjs +15 -15
  73. package/fesm2022/ngwr-lightbox.mjs +3 -3
  74. package/fesm2022/ngwr-line-chart.mjs +3 -3
  75. package/fesm2022/ngwr-list.mjs +6 -6
  76. package/fesm2022/ngwr-loading-bar.mjs +6 -6
  77. package/fesm2022/ngwr-markdown.mjs +6 -6
  78. package/fesm2022/ngwr-marquee.mjs +3 -3
  79. package/fesm2022/ngwr-media.mjs +3 -3
  80. package/fesm2022/ngwr-mention.mjs +6 -6
  81. package/fesm2022/ngwr-meta.mjs +6 -6
  82. package/fesm2022/ngwr-meter-group.mjs +3 -3
  83. package/fesm2022/ngwr-overlay.mjs +6 -6
  84. package/fesm2022/ngwr-page-header.mjs +3 -3
  85. package/fesm2022/ngwr-pagination.mjs +72 -9
  86. package/fesm2022/ngwr-pagination.mjs.map +1 -1
  87. package/fesm2022/ngwr-pipes.mjs +21 -21
  88. package/fesm2022/ngwr-platform.mjs +9 -9
  89. package/fesm2022/ngwr-popconfirm.mjs +6 -6
  90. package/fesm2022/ngwr-popover.mjs +6 -6
  91. package/fesm2022/ngwr-progress.mjs +3 -3
  92. package/fesm2022/ngwr-pull-to-refresh.mjs +3 -3
  93. package/fesm2022/ngwr-qr.mjs +3 -3
  94. package/fesm2022/ngwr-radio.mjs +6 -6
  95. package/fesm2022/ngwr-rating.mjs +3 -3
  96. package/fesm2022/ngwr-result.mjs +12 -12
  97. package/fesm2022/ngwr-rotating-text.mjs +3 -3
  98. package/fesm2022/ngwr-scroll.mjs +3 -3
  99. package/fesm2022/ngwr-segmented-testing.mjs +71 -0
  100. package/fesm2022/ngwr-segmented-testing.mjs.map +1 -1
  101. package/fesm2022/ngwr-segmented.mjs +98 -8
  102. package/fesm2022/ngwr-segmented.mjs.map +1 -1
  103. package/fesm2022/ngwr-select.mjs +22 -12
  104. package/fesm2022/ngwr-select.mjs.map +1 -1
  105. package/fesm2022/ngwr-shiny-text.mjs +6 -6
  106. package/fesm2022/ngwr-sidebar.mjs +3 -3
  107. package/fesm2022/ngwr-skeleton.mjs +3 -3
  108. package/fesm2022/ngwr-slider.mjs +3 -3
  109. package/fesm2022/ngwr-sparkline.mjs +3 -3
  110. package/fesm2022/ngwr-speed-dial.mjs +3 -3
  111. package/fesm2022/ngwr-spinner.mjs +3 -3
  112. package/fesm2022/ngwr-splash-cursor.mjs +3 -3
  113. package/fesm2022/ngwr-split-text.mjs +3 -3
  114. package/fesm2022/ngwr-splitter.mjs +3 -3
  115. package/fesm2022/ngwr-spotlight-card.mjs +6 -6
  116. package/fesm2022/ngwr-squircle.mjs +6 -6
  117. package/fesm2022/ngwr-star-border.mjs +3 -3
  118. package/fesm2022/ngwr-statistic.mjs +9 -9
  119. package/fesm2022/ngwr-stepper.mjs +6 -6
  120. package/fesm2022/ngwr-storage.mjs +3 -3
  121. package/fesm2022/ngwr-switch.mjs +3 -3
  122. package/fesm2022/ngwr-table.mjs +18 -18
  123. package/fesm2022/ngwr-tabs.mjs +6 -6
  124. package/fesm2022/ngwr-textarea.mjs +3 -3
  125. package/fesm2022/ngwr-theme.mjs +3 -3
  126. package/fesm2022/ngwr-tilt-card.mjs +6 -6
  127. package/fesm2022/ngwr-timeline.mjs +6 -6
  128. package/fesm2022/ngwr-toast.mjs +9 -9
  129. package/fesm2022/ngwr-toolbar.mjs +3 -3
  130. package/fesm2022/ngwr-tour.mjs +6 -6
  131. package/fesm2022/ngwr-transfer.mjs +3 -3
  132. package/fesm2022/ngwr-tree.mjs +3 -3
  133. package/fesm2022/ngwr-typewriter.mjs +3 -3
  134. package/fesm2022/ngwr-typography.mjs +3 -3
  135. package/fesm2022/ngwr-version.mjs +1 -1
  136. package/fesm2022/ngwr-version.mjs.map +1 -1
  137. package/fesm2022/ngwr-virtual-scroll.mjs +3 -3
  138. package/fesm2022/ngwr-waves.mjs +3 -3
  139. package/fesm2022/ngwr-window.mjs +12 -12
  140. package/llms-full.txt +1 -1
  141. package/llms.txt +24 -2
  142. package/overlay/styles/_arrow.scss +243 -0
  143. package/package.json +1 -1
  144. package/popconfirm/styles/_index.scss +17 -0
  145. package/popover/styles/_index.scss +49 -207
  146. package/select/styles/_index.scss +30 -4
  147. package/sidebar/styles/_index.scss +4 -1
  148. package/stepper/styles/_index.scss +44 -5
  149. package/theme/styles/_mixins.scss +10 -0
  150. package/tree/styles/_index.scss +10 -2
  151. package/types/ngwr-pagination.d.ts +11 -0
  152. package/types/ngwr-segmented-testing.d.ts +44 -0
  153. package/types/ngwr-segmented.d.ts +86 -4
  154. package/types/ngwr-select.d.ts +12 -2
  155. package/types/ngwr-version.d.ts +1 -1
@@ -150,10 +150,10 @@ class WrCircularText {
150
150
  this.rotation = this.spinEl().nativeElement.animate([{ transform: 'rotate(0deg)' }, { transform: 'rotate(360deg)' }], { duration: newDurMs, iterations: Infinity, easing: 'linear' });
151
151
  this.rotation.currentTime = ratio * newDurMs;
152
152
  }
153
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrCircularText, deps: [], target: i0.ɵɵFactoryTarget.Component });
154
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: WrCircularText, isStandalone: true, selector: "wr-circular-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, spinDuration: { classPropertyName: "spinDuration", publicName: "spinDuration", isSignal: true, isRequired: false, transformFunction: null }, onHover: { classPropertyName: "onHover", publicName: "onHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-circular-text--bonkers": "onHover() === 'goBonkers'" }, classAttribute: "wr-circular-text" }, viewQueries: [{ propertyName: "spinEl", first: true, predicate: ["spin"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n The readable text, once: the ring below is per-character spans, which a screen\n reader may read out one letter at a time. Same shape as `wr-blur-text` and\n `wr-decrypt-text` \u2014 the string is carried here and the pieces are taken out of\n the tree with one `aria-hidden` on the wrapper rather than N on the chars, so\n the attribute stays off the nodes the rotation touches. It sits OUTSIDE\n `__spin`, or it would be hidden with the chars and would spin with them.\n-->\n<span class=\"wr-circular-text__sr-only\">{{ text() }}</span>\n<span class=\"wr-circular-text__spin\" aria-hidden=\"true\" #spin>\n @for (c of chars(); track $index) {\n <span class=\"wr-circular-text__char\" [style.transform]=\"c.transform\">{{ c.ch }}</span>\n }\n</span>\n", styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #e21a62;--wr-color-secondary-rgb: 226, 26, 98;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(203.130952381, 23.369047619, 88.0833333333);--wr-color-secondary-darker: rgb(180.2619047619, 20.7380952381, 78.1666666667);--wr-color-secondary-light: rgb(231.0119047619, 46.4880952381, 112.9166666667);--wr-color-secondary-lighter: rgb(233.6428571429, 69.3571428571, 128.5);--wr-color-success: #008800;--wr-color-success-rgb: 0, 136, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 110.5, 0);--wr-color-success-darker: #005500;--wr-color-success-light: rgb(0, 161.5, 0);--wr-color-success-lighter: #00bb00;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #dc3137;--wr-color-danger-rgb: 220, 49, 55;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(208.1369294606, 35.3630705394, 41.4253112033);--wr-color-danger-darker: rgb(186.3402489627, 31.6597510373, 37.0871369295);--wr-color-danger-light: rgb(223.7033195021, 70.7966804979, 76.1618257261);--wr-color-danger-lighter: rgb(227.4066390041, 92.5933609959, 97.3236514523);--wr-color-info: #3472d9;--wr-color-info-rgb: 52, 114, 217;--wr-color-info-contrast: #ffffff;--wr-color-info-dark: rgb(38.3941908714, 101.0373443983, 205.1058091286);--wr-color-info-darker: rgb(34.3734439834, 90.4564315353, 183.6265560166);--wr-color-info-light: rgb(73.479253112, 128.9190871369, 221.020746888);--wr-color-info-lighter: rgb(94.9585062241, 143.8381742739, 225.0414937759);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #6a7683;--wr-color-medium-rgb: 106, 118, 131;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(94.5949367089, 105.3037974684, 116.9050632911);--wr-color-medium-darker: rgb(83.1898734177, 92.6075949367, 102.8101265823);--wr-color-medium-light: rgb(118.1962025316, 130.7278481013, 144.3037974684);--wr-color-medium-lighter: rgb(132.2911392405, 143.5316455696, 155.7088607595);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-disabled-opacity: .6;--wr-focus-ring-width: 2px;--wr-focus-ring-offset: 2px;--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em;--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25)}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #6d7682;--wr-color-medium-rgb: 109, 118, 130;--wr-color-medium-contrast: #ffffff;--wr-color-medium-light: rgb(121.4644351464, 130.7092050209, 143.0355648536);--wr-color-medium-lighter: rgb(135.3347280335, 143.6192468619, 154.6652719665);--wr-color-medium-dark: rgb(97.370292887, 105.410041841, 116.129707113);--wr-color-medium-darker: rgb(85.7405857741, 92.820083682, 102.2594142259);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #3567ff;--wr-color-primary-contrast: #ffffff;--wr-color-primary-rgb: 53, 103, 255;--wr-color-primary-light: #547eff;--wr-color-primary-dark: #2848aa;--wr-color-primary-lighter: #7396ff;--wr-color-primary-darker: #183179;--wr-color-success: #23863c;--wr-color-success-contrast: #ffffff;--wr-color-success-rgb: 35, 134, 60;--wr-color-success-light: rgb(40.2810650888, 154.2189349112, 69.0532544379);--wr-color-success-lighter: rgb(45.5621301775, 174.4378698225, 78.1065088757);--wr-color-success-dark: rgb(29.7189349112, 113.7810650888, 50.9467455621);--wr-color-success-darker: rgb(24.4378698225, 93.5621301775, 41.8934911243);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ca4949;--wr-color-danger-contrast: #ffffff;--wr-color-danger-rgb: 202, 73, 73;--wr-color-danger-light: rgb(207.7510638298, 92.7489361702, 92.7489361702);--wr-color-danger-lighter: rgb(213.5021276596, 112.4978723404, 112.4978723404);--wr-color-danger-dark: rgb(193.229787234, 56.270212766, 56.270212766);--wr-color-danger-darker: rgb(173.4808510638, 50.5191489362, 50.5191489362);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark);--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-sidebar__entry:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-sidebar__item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-anchor__link:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-collapse__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-mention-panel__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-segmented__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-back-top:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-stepper__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-window__chrome-action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-dropdown-item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-alert__close:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-circular-text{--wr-circular-text-size: 12rem;--wr-circular-text-radius: calc(var(--wr-circular-text-size) / 2);position:relative;display:inline-block;width:var(--wr-circular-text-size);height:var(--wr-circular-text-size);border-radius:50%;font-weight:700;text-align:center;-webkit-user-select:none;user-select:none;transition:transform .6s var(--wr-ease-spring)}.wr-circular-text__sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.wr-circular-text__spin{position:absolute;inset:0;will-change:transform}.wr-circular-text__char{position:absolute;top:50%;left:50%;display:inline-block;margin-left:-.5em;margin-top:-.5em;line-height:1}.wr-circular-text--bonkers:hover{transform:scale(.8)}\n"], encapsulation: i0.ViewEncapsulation.None });
153
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCircularText, deps: [], target: i0.ɵɵFactoryTarget.Component });
154
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrCircularText, isStandalone: true, selector: "wr-circular-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, spinDuration: { classPropertyName: "spinDuration", publicName: "spinDuration", isSignal: true, isRequired: false, transformFunction: null }, onHover: { classPropertyName: "onHover", publicName: "onHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-circular-text--bonkers": "onHover() === 'goBonkers'" }, classAttribute: "wr-circular-text" }, viewQueries: [{ propertyName: "spinEl", first: true, predicate: ["spin"], descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n The readable text, once: the ring below is per-character spans, which a screen\n reader may read out one letter at a time. Same shape as `wr-blur-text` and\n `wr-decrypt-text` \u2014 the string is carried here and the pieces are taken out of\n the tree with one `aria-hidden` on the wrapper rather than N on the chars, so\n the attribute stays off the nodes the rotation touches. It sits OUTSIDE\n `__spin`, or it would be hidden with the chars and would spin with them.\n-->\n<span class=\"wr-circular-text__sr-only\">{{ text() }}</span>\n<span class=\"wr-circular-text__spin\" aria-hidden=\"true\" #spin>\n @for (c of chars(); track $index) {\n <span class=\"wr-circular-text__char\" [style.transform]=\"c.transform\">{{ c.ch }}</span>\n }\n</span>\n", styles: ["@charset \"UTF-8\";:where([class^=wr-],[class*=\" wr-\"]),:where([class^=wr-],[class*=\" wr-\"]):before,:where([class^=wr-],[class*=\" wr-\"]):after{box-sizing:border-box}:root{color-scheme:light;--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-muted-text: #5f6c7d;--wr-color-muted-text-rgb: 95, 108, 125;--wr-color-gray-50: #f8fafc;--wr-color-gray-100: #f1f5f9;--wr-color-gray-200: #e2e8f0;--wr-color-gray-300: #cbd5e1;--wr-color-gray-400: #94a3b8;--wr-color-gray-500: #64748b;--wr-color-gray-600: #475569;--wr-color-gray-700: #334155;--wr-color-gray-800: #1e293b;--wr-color-gray-900: #0f172a;--wr-color-gray-950: #020617;--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #e21a62;--wr-color-secondary-rgb: 226, 26, 98;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(203.130952381, 23.369047619, 88.0833333333);--wr-color-secondary-darker: rgb(180.2619047619, 20.7380952381, 78.1666666667);--wr-color-secondary-light: rgb(231.0119047619, 46.4880952381, 112.9166666667);--wr-color-secondary-lighter: rgb(233.6428571429, 69.3571428571, 128.5);--wr-color-success: #008800;--wr-color-success-rgb: 0, 136, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 110.5, 0);--wr-color-success-darker: #005500;--wr-color-success-light: rgb(0, 161.5, 0);--wr-color-success-lighter: #00bb00;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #000000;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #dc3137;--wr-color-danger-rgb: 220, 49, 55;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(208.1369294606, 35.3630705394, 41.4253112033);--wr-color-danger-darker: rgb(186.3402489627, 31.6597510373, 37.0871369295);--wr-color-danger-light: rgb(223.7033195021, 70.7966804979, 76.1618257261);--wr-color-danger-lighter: rgb(227.4066390041, 92.5933609959, 97.3236514523);--wr-color-info: #3472d9;--wr-color-info-rgb: 52, 114, 217;--wr-color-info-contrast: #ffffff;--wr-color-info-dark: rgb(38.3941908714, 101.0373443983, 205.1058091286);--wr-color-info-darker: rgb(34.3734439834, 90.4564315353, 183.6265560166);--wr-color-info-light: rgb(73.479253112, 128.9190871369, 221.020746888);--wr-color-info-lighter: rgb(94.9585062241, 143.8381742739, 225.0414937759);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #000000;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #6a7683;--wr-color-medium-rgb: 106, 118, 131;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(94.5949367089, 105.3037974684, 116.9050632911);--wr-color-medium-darker: rgb(83.1898734177, 92.6075949367, 102.8101265823);--wr-color-medium-light: rgb(118.1962025316, 130.7278481013, 144.3037974684);--wr-color-medium-lighter: rgb(132.2911392405, 143.5316455696, 155.7088607595);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-control-padding-y-sm: .125rem;--wr-control-padding-y-md: .25rem;--wr-control-padding-y-lg: .3125rem;--wr-control-padding-x-sm: .5rem;--wr-control-padding-x-md: .75rem;--wr-control-padding-x-lg: 1rem;--wr-control-line-height-sm: 1rem;--wr-control-line-height-md: 1.25rem;--wr-control-line-height-lg: 1.5rem;--wr-control-font-size-sm: var(--wr-text-xs);--wr-control-font-size-md: var(--wr-text-sm);--wr-control-font-size-lg: var(--wr-text-base);--wr-control-radius-sm: 5px;--wr-control-radius-md: 6px;--wr-control-radius-lg: 7px;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-disabled-opacity: .6;--wr-focus-ring-width: 2px;--wr-focus-ring-offset: 2px;--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em;--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25)}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-dark-light: rgb(247.5, 249, 251.4);--wr-color-dark-lighter: rgb(251.25, 252, 253.2);--wr-color-dark-dark: rgb(212.7702702703, 221.2162162162, 234.7297297297);--wr-color-dark-darker: rgb(195.5405405405, 207.4324324324, 226.4594594595);--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-light-light: rgb(33.429245283, 41.3466981132, 59.820754717);--wr-color-light-dark: rgb(47.141509434, 58.3066037736, 84.358490566);--wr-color-medium: #6d7682;--wr-color-medium-rgb: 109, 118, 130;--wr-color-medium-contrast: #ffffff;--wr-color-medium-light: rgb(121.4644351464, 130.7092050209, 143.0355648536);--wr-color-medium-lighter: rgb(135.3347280335, 143.6192468619, 154.6652719665);--wr-color-medium-dark: rgb(97.370292887, 105.410041841, 116.129707113);--wr-color-medium-darker: rgb(85.7405857741, 92.820083682, 102.2594142259);--wr-color-muted-text: #9aa6b8;--wr-color-muted-text-rgb: 154, 166, 184;--wr-color-primary: #3567ff;--wr-color-primary-contrast: #ffffff;--wr-color-primary-rgb: 53, 103, 255;--wr-color-primary-light: #547eff;--wr-color-primary-dark: #2848aa;--wr-color-primary-lighter: #7396ff;--wr-color-primary-darker: #183179;--wr-color-success: #23863c;--wr-color-success-contrast: #ffffff;--wr-color-success-rgb: 35, 134, 60;--wr-color-success-light: rgb(40.2810650888, 154.2189349112, 69.0532544379);--wr-color-success-lighter: rgb(45.5621301775, 174.4378698225, 78.1065088757);--wr-color-success-dark: rgb(29.7189349112, 113.7810650888, 50.9467455621);--wr-color-success-darker: rgb(24.4378698225, 93.5621301775, 41.8934911243);--wr-color-warning: #ffcc33;--wr-color-warning-contrast: #000000;--wr-color-warning-rgb: 255, 204, 51;--wr-color-warning-light: rgb(255, 210.375, 76.5);--wr-color-warning-lighter: rgb(255, 216.75, 102);--wr-color-warning-dark: rgb(255, 197.625, 25.5);--wr-color-warning-darker: rgb(255, 191.25, 0);--wr-color-danger: #ca4949;--wr-color-danger-contrast: #ffffff;--wr-color-danger-rgb: 202, 73, 73;--wr-color-danger-light: rgb(207.7510638298, 92.7489361702, 92.7489361702);--wr-color-danger-lighter: rgb(213.5021276596, 112.4978723404, 112.4978723404);--wr-color-danger-dark: rgb(193.229787234, 56.270212766, 56.270212766);--wr-color-danger-darker: rgb(173.4808510638, 50.5191489362, 50.5191489362);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);--wr-color-hover: rgba(var(--wr-color-light-rgb), .4);--wr-color-border: rgba(var(--wr-color-light-rgb), .5);--wr-color-border-subtle: rgba(var(--wr-color-light-rgb), .35);--wr-color-border-strong: rgba(var(--wr-color-light-rgb), .6);--wr-color-overlay: rgba(var(--wr-color-backdrop-rgb), .45);--wr-color-fill-subtle: rgba(var(--wr-color-light-rgb), .15);--wr-color-fill: rgba(var(--wr-color-light-rgb), .3);--wr-color-fill-strong: rgba(var(--wr-color-light-rgb), .55);--wr-color-text-muted: rgba(var(--wr-color-muted-text-rgb), .95);--wr-color-text-faint: rgba(var(--wr-color-muted-text-rgb), .6);--wr-color-surface: var(--wr-color-white);--wr-color-surface-rgb: var(--wr-color-white-rgb);--wr-color-on-surface: var(--wr-color-dark);--wr-color-on-surface-rgb: var(--wr-color-dark-rgb);--wr-color-on-surface-muted: var(--wr-color-muted-text);--wr-color-on-surface-muted-rgb: var(--wr-color-muted-text-rgb);--wr-color-outline: var(--wr-color-light);--wr-color-outline-rgb: var(--wr-color-light-rgb);--wr-color-primary-soft: rgba(var(--wr-color-primary-rgb), .12);--wr-color-primary-soft-border: rgba(var(--wr-color-primary-rgb), .3);--wr-color-primary-soft-contrast: color-mix(in srgb, var(--wr-color-primary) 62%, var(--wr-color-dark));--wr-color-primary-active: rgba(var(--wr-color-primary-rgb), .2);--wr-color-secondary-soft: rgba(var(--wr-color-secondary-rgb), .12);--wr-color-secondary-soft-border: rgba(var(--wr-color-secondary-rgb), .3);--wr-color-secondary-soft-contrast: color-mix(in srgb, var(--wr-color-secondary) 62%, var(--wr-color-dark));--wr-color-secondary-active: rgba(var(--wr-color-secondary-rgb), .2);--wr-color-success-soft: rgba(var(--wr-color-success-rgb), .12);--wr-color-success-soft-border: rgba(var(--wr-color-success-rgb), .3);--wr-color-success-soft-contrast: color-mix(in srgb, var(--wr-color-success) 62%, var(--wr-color-dark));--wr-color-success-active: rgba(var(--wr-color-success-rgb), .2);--wr-color-warning-soft: rgba(var(--wr-color-warning-rgb), .12);--wr-color-warning-soft-border: rgba(var(--wr-color-warning-rgb), .3);--wr-color-warning-soft-contrast: color-mix(in srgb, var(--wr-color-warning) 62%, var(--wr-color-dark));--wr-color-warning-active: rgba(var(--wr-color-warning-rgb), .2);--wr-color-danger-soft: rgba(var(--wr-color-danger-rgb), .12);--wr-color-danger-soft-border: rgba(var(--wr-color-danger-rgb), .3);--wr-color-danger-soft-contrast: color-mix(in srgb, var(--wr-color-danger) 62%, var(--wr-color-dark));--wr-color-danger-active: rgba(var(--wr-color-danger-rgb), .2);--wr-color-info-soft: rgba(var(--wr-color-info-rgb), .12);--wr-color-info-soft-border: rgba(var(--wr-color-info-rgb), .3);--wr-color-info-soft-contrast: color-mix(in srgb, var(--wr-color-info) 62%, var(--wr-color-dark));--wr-color-info-active: rgba(var(--wr-color-info-rgb), .2);--wr-color-medium-soft: rgba(var(--wr-color-medium-rgb), .12);--wr-color-medium-soft-border: rgba(var(--wr-color-medium-rgb), .3);--wr-color-medium-soft-contrast: color-mix(in srgb, var(--wr-color-medium) 62%, var(--wr-color-dark));--wr-color-medium-active: rgba(var(--wr-color-medium-rgb), .2);--wr-color-primary-ink: color-mix(in srgb, var(--wr-color-primary) 78%, var(--wr-color-dark));--wr-color-secondary-ink: color-mix(in srgb, var(--wr-color-secondary) 75%, var(--wr-color-dark));--wr-color-success-ink: color-mix(in srgb, var(--wr-color-success) 67%, var(--wr-color-dark));--wr-color-warning-ink: color-mix(in srgb, var(--wr-color-warning) 48%, var(--wr-color-dark));--wr-color-danger-ink: color-mix(in srgb, var(--wr-color-danger) 72%, var(--wr-color-dark));--wr-color-info-ink: color-mix(in srgb, var(--wr-color-info) 71%, var(--wr-color-dark));--wr-color-medium-ink: color-mix(in srgb, var(--wr-color-medium) 65%, var(--wr-color-dark));--wr-color-light-ink: var(--wr-color-on-surface);--wr-color-dark-ink: var(--wr-color-dark);--wr-focus-ring-color: var(--wr-color-primary);--wr-focus-ring-halo: rgba(var(--wr-color-primary-rgb), .25);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-sidebar__entry:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-sidebar__item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-anchor__link:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-collapse__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo);outline-offset:-2px}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-mention-panel__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-segmented__option:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-back-top:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-stepper__header:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-window__chrome-action:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-dropdown-item:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-alert__close:focus-visible{outline:var(--wr-focus-ring-width) solid var(--wr-focus-ring-color);outline-offset:var(--wr-focus-ring-offset);box-shadow:0 0 0 var(--wr-focus-ring-offset) var(--wr-focus-ring-halo)}.wr-circular-text{--wr-circular-text-size: 12rem;--wr-circular-text-radius: calc(var(--wr-circular-text-size) / 2);position:relative;display:inline-block;width:var(--wr-circular-text-size);height:var(--wr-circular-text-size);border-radius:50%;font-weight:700;text-align:center;-webkit-user-select:none;user-select:none;transition:transform .6s var(--wr-ease-spring)}.wr-circular-text__sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.wr-circular-text__spin{position:absolute;inset:0;will-change:transform}.wr-circular-text__char{position:absolute;top:50%;left:50%;display:inline-block;margin-left:-.5em;margin-top:-.5em;line-height:1}.wr-circular-text--bonkers:hover{transform:scale(.8)}\n"], encapsulation: i0.ViewEncapsulation.None });
155
155
  }
156
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrCircularText, decorators: [{
156
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCircularText, decorators: [{
157
157
  type: Component,
158
158
  args: [{ selector: 'wr-circular-text', encapsulation: ViewEncapsulation.None, host: {
159
159
  class: 'wr-circular-text',
@@ -184,10 +184,10 @@ class WrClickSpark {
184
184
  this.raf = requestAnimationFrame(draw);
185
185
  this.destroyRef.onDestroy(() => cancelAnimationFrame(this.raf));
186
186
  }
187
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrClickSpark, deps: [], target: i0.ɵɵFactoryTarget.Component });
188
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.2", type: WrClickSpark, isStandalone: true, selector: "wr-click-spark", inputs: { sparkColor: { classPropertyName: "sparkColor", publicName: "sparkColor", isSignal: true, isRequired: false, transformFunction: null }, sparkSize: { classPropertyName: "sparkSize", publicName: "sparkSize", isSignal: true, isRequired: false, transformFunction: null }, sparkRadius: { classPropertyName: "sparkRadius", publicName: "sparkRadius", isSignal: true, isRequired: false, transformFunction: null }, sparkCount: { classPropertyName: "sparkCount", publicName: "sparkCount", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, easing: { classPropertyName: "easing", publicName: "easing", isSignal: true, isRequired: false, transformFunction: null }, extraScale: { classPropertyName: "extraScale", publicName: "extraScale", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "wr-click-spark" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Decoration over the projected content \u2014 the same treatment `WrConfetti`\n gives its own canvas. -->\n<canvas #canvas class=\"wr-click-spark__canvas\" aria-hidden=\"true\"></canvas>\n<ng-content />\n", styles: [".wr-click-spark{position:relative;display:block}.wr-click-spark__canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1}\n"], encapsulation: i0.ViewEncapsulation.None });
187
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrClickSpark, deps: [], target: i0.ɵɵFactoryTarget.Component });
188
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.4", type: WrClickSpark, isStandalone: true, selector: "wr-click-spark", inputs: { sparkColor: { classPropertyName: "sparkColor", publicName: "sparkColor", isSignal: true, isRequired: false, transformFunction: null }, sparkSize: { classPropertyName: "sparkSize", publicName: "sparkSize", isSignal: true, isRequired: false, transformFunction: null }, sparkRadius: { classPropertyName: "sparkRadius", publicName: "sparkRadius", isSignal: true, isRequired: false, transformFunction: null }, sparkCount: { classPropertyName: "sparkCount", publicName: "sparkCount", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, easing: { classPropertyName: "easing", publicName: "easing", isSignal: true, isRequired: false, transformFunction: null }, extraScale: { classPropertyName: "extraScale", publicName: "extraScale", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "wr-click-spark" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Decoration over the projected content \u2014 the same treatment `WrConfetti`\n gives its own canvas. -->\n<canvas #canvas class=\"wr-click-spark__canvas\" aria-hidden=\"true\"></canvas>\n<ng-content />\n", styles: [".wr-click-spark{position:relative;display:block}.wr-click-spark__canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1}\n"], encapsulation: i0.ViewEncapsulation.None });
189
189
  }
190
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrClickSpark, decorators: [{
190
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrClickSpark, decorators: [{
191
191
  type: Component,
192
192
  args: [{ selector: 'wr-click-spark', encapsulation: ViewEncapsulation.None, host: {
193
193
  class: 'wr-click-spark',
@@ -150,10 +150,10 @@ class WrClipboard {
150
150
  }
151
151
  }
152
152
  }
153
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrClipboard, deps: [], target: i0.ɵɵFactoryTarget.Service });
154
- static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.2", ngImport: i0, type: WrClipboard });
153
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrClipboard, deps: [], target: i0.ɵɵFactoryTarget.Service });
154
+ static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.4", ngImport: i0, type: WrClipboard });
155
155
  }
156
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrClipboard, decorators: [{
156
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrClipboard, decorators: [{
157
157
  type: Service
158
158
  }] });
159
159
 
@@ -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.2", ngImport: i0, type: WrCollapse, deps: [], target: i0.ɵɵFactoryTarget.Component });
98
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", 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.4", ngImport: i0, type: WrCollapse, deps: [], target: i0.ɵɵFactoryTarget.Component });
98
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", 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.2", ngImport: i0, type: WrCollapse, decorators: [{
100
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", 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.2", ngImport: i0, type: WrCollapseGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
136
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", 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.4", ngImport: i0, type: WrCollapseGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
136
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", 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.2", ngImport: i0, type: WrCollapseGroup, decorators: [{
144
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", 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.2", ngImport: i0, type: WrAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
202
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", 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.4", ngImport: i0, type: WrAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
202
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.4", 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.2", ngImport: i0, type: WrAccordion, decorators: [{
210
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrAccordion, decorators: [{
211
211
  type: Component,
212
212
  args: [{
213
213
  selector: 'wr-accordion',
@@ -692,10 +692,10 @@ class WrColorPicker {
692
692
  this.a.set(hsv.a);
693
693
  this.emit();
694
694
  }
695
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
696
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", 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 }, 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()" } }, 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.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.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'hue')\"\n (keydown)=\"onSliderKeydown($event, 'hue')\"\n (blur)=\"onSurfaceBlur()\"\n>\n <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"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.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'alpha')\"\n (keydown)=\"onSliderKeydown($event, 'alpha')\"\n (blur)=\"onSurfaceBlur()\"\n >\n <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"alphaThumbX()\"></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 (input)=\"onHexInput($event)\"\n (blur)=\"onHexBlur()\"\n />\n <span class=\"wr-color-picker__field-label\">HEX</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 (input)=\"onRgbChannel('r', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">R</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 (input)=\"onRgbChannel('g', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">G</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 (input)=\"onRgbChannel('b', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">B</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 (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">A%</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 (input)=\"onHslChannel('h', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">H</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 (input)=\"onHslChannel('s', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">S%</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 (input)=\"onHslChannel('l', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">L%</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 (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">A%</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()\"\n (click)=\"onSwatchClick(color)\"\n ></button>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled", "size"], outputs: ["valueChange"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
695
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
696
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", 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 }, 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()" } }, 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.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.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'hue')\"\n (keydown)=\"onSliderKeydown($event, 'hue')\"\n (blur)=\"onSurfaceBlur()\"\n>\n <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"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.tabindex]=\"disabled() ? -1 : 0\"\n (pointerdown)=\"onPointerDown($event, 'alpha')\"\n (keydown)=\"onSliderKeydown($event, 'alpha')\"\n (blur)=\"onSurfaceBlur()\"\n >\n <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"alphaThumbX()\"></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 (input)=\"onHexInput($event)\"\n (blur)=\"onHexBlur()\"\n />\n <span class=\"wr-color-picker__field-label\">HEX</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 (input)=\"onRgbChannel('r', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">R</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 (input)=\"onRgbChannel('g', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">G</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 (input)=\"onRgbChannel('b', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">B</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 (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">A%</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 (input)=\"onHslChannel('h', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">H</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 (input)=\"onHslChannel('s', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">S%</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 (input)=\"onHslChannel('l', $event)\"\n />\n <span class=\"wr-color-picker__field-label\">L%</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 (input)=\"onAlphaPercent($event)\"\n />\n <span class=\"wr-color-picker__field-label\">A%</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()\"\n (click)=\"onSwatchClick(color)\"\n ></button>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled", "size"], outputs: ["valueChange", "touch"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
697
697
  }
698
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrColorPicker, decorators: [{
698
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPicker, decorators: [{
699
699
  type: Component,
700
700
  args: [{ selector: 'wr-color-picker', encapsulation: ViewEncapsulation.None, host: {
701
701
  '[class]': 'classes()',
@@ -842,10 +842,10 @@ class WrColorPickerTrigger {
842
842
  this.overlayRef = null;
843
843
  }
844
844
  }
845
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
846
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.2", 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" } }, ngImport: i0 });
845
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
846
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.4", 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" } }, ngImport: i0 });
847
847
  }
848
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
848
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
849
849
  type: Directive,
850
850
  args: [{
851
851
  selector: '[wrColorPickerTrigger]',