@watermarkinsights/ripple 3.4.0 → 3.5.0-3

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 (203) hide show
  1. package/README.md +3 -3
  2. package/dist/cjs/functions-653e695c.js +6164 -0
  3. package/dist/cjs/{global-caec45e5.js → global-ee710089.js} +65 -65
  4. package/dist/cjs/{http-service-9e8c4dd5.js → http-service-494d81de.js} +49 -49
  5. package/dist/cjs/{index-921ef454.js → index-cd179539.js} +157 -103
  6. package/dist/cjs/{interfaces-30a74c1f.js → interfaces-a3338581.js} +29 -29
  7. package/dist/cjs/loader.cjs.js +3 -3
  8. package/dist/cjs/priv-chart-popover.cjs.entry.js +79 -79
  9. package/dist/cjs/priv-datepicker.cjs.entry.js +668 -668
  10. package/dist/cjs/priv-navigator-button.cjs.entry.js +19 -19
  11. package/dist/cjs/priv-navigator-item.cjs.entry.js +24 -24
  12. package/dist/cjs/ripple.cjs.js +5 -5
  13. package/dist/cjs/wm-action-menu_2.cjs.entry.js +342 -342
  14. package/dist/cjs/wm-button.cjs.entry.js +219 -219
  15. package/dist/cjs/wm-chart-slice.cjs.entry.js +14 -14
  16. package/dist/cjs/wm-chart.cjs.entry.js +475 -517
  17. package/dist/cjs/wm-datepicker.cjs.entry.js +257 -257
  18. package/dist/cjs/wm-input.cjs.entry.js +134 -134
  19. package/dist/cjs/wm-modal-footer.cjs.entry.js +32 -32
  20. package/dist/cjs/wm-modal-header.cjs.entry.js +35 -35
  21. package/dist/cjs/wm-modal.cjs.entry.js +162 -162
  22. package/dist/cjs/wm-navigator.cjs.entry.js +269 -269
  23. package/dist/cjs/wm-network-uploader.cjs.entry.js +421 -421
  24. package/dist/cjs/wm-option_2.cjs.entry.js +492 -492
  25. package/dist/cjs/wm-pagination.cjs.entry.js +168 -168
  26. package/dist/cjs/wm-search.cjs.entry.js +232 -232
  27. package/dist/cjs/wm-snackbar.cjs.entry.js +171 -171
  28. package/dist/cjs/wm-tab-item_3.cjs.entry.js +301 -301
  29. package/dist/cjs/wm-tag-input.cjs.entry.js +557 -557
  30. package/dist/cjs/wm-timepicker.cjs.entry.js +384 -384
  31. package/dist/cjs/wm-toggletip.cjs.entry.js +125 -125
  32. package/dist/cjs/wm-uploader.cjs.entry.js +347 -347
  33. package/dist/cjs/wm-wrapper.cjs.entry.js +13 -13
  34. package/dist/collection/collection-manifest.json +2 -2
  35. package/dist/collection/components/wm-action-menu/wm-action-menu.js +460 -460
  36. package/dist/collection/components/wm-button/wm-button.js +485 -485
  37. package/dist/collection/components/wm-chart/priv-chart-popover/priv-chart-popover.js +232 -232
  38. package/dist/collection/components/wm-chart/wm-chart-slice.js +64 -64
  39. package/dist/collection/components/wm-chart/wm-chart.css +71 -84
  40. package/dist/collection/components/wm-chart/wm-chart.js +718 -765
  41. package/dist/collection/components/wm-datepicker/priv-datepicker/priv-datepicker.js +1015 -1015
  42. package/dist/collection/components/wm-datepicker/wm-datepicker.js +462 -462
  43. package/dist/collection/components/wm-input/wm-input.js +423 -423
  44. package/dist/collection/components/wm-menuitem/wm-menuitem.js +444 -444
  45. package/dist/collection/components/wm-modal/wm-modal-footer.js +141 -141
  46. package/dist/collection/components/wm-modal/wm-modal-header.js +92 -92
  47. package/dist/collection/components/wm-modal/wm-modal.js +459 -459
  48. package/dist/collection/components/wm-navigator/priv-navigator-button/priv-navigator-button.js +97 -97
  49. package/dist/collection/components/wm-navigator/priv-navigator-item/priv-navigator-item.js +114 -114
  50. package/dist/collection/components/wm-navigator/wm-navigator.js +468 -468
  51. package/dist/collection/components/wm-option/wm-option.js +422 -422
  52. package/dist/collection/components/wm-pagination/wm-pagination.js +368 -368
  53. package/dist/collection/components/wm-search/wm-search.js +479 -479
  54. package/dist/collection/components/wm-select/wm-select.js +717 -717
  55. package/dist/collection/components/wm-snackbar/wm-snackbar.js +297 -297
  56. package/dist/collection/components/wm-tabs/wm-tab-item/wm-tab-item.js +219 -219
  57. package/dist/collection/components/wm-tabs/wm-tab-list/wm-tab-list.js +331 -331
  58. package/dist/collection/components/wm-tabs/wm-tab-panel/wm-tab-panel.js +104 -104
  59. package/dist/collection/components/wm-tag-input/wm-tag-input.js +787 -787
  60. package/dist/collection/components/wm-timepicker/wm-timepicker.js +589 -589
  61. package/dist/collection/components/wm-toggletip/wm-toggletip.js +241 -241
  62. package/dist/collection/components/wm-uploader/wm-network-uploader/wm-network-uploader.js +753 -753
  63. package/dist/collection/components/wm-uploader/wm-uploader.js +748 -748
  64. package/dist/collection/components/wm-wrapper/wm-wrapper.js +27 -27
  65. package/dist/collection/dev/scripts.js +20 -20
  66. package/dist/collection/global/__mocks__/functions.js +6 -6
  67. package/dist/collection/global/functions.js +445 -445
  68. package/dist/collection/global/global.js +72 -72
  69. package/dist/collection/global/interfaces.js +49 -49
  70. package/dist/collection/global/services/__mocks__/http-service.js +130 -130
  71. package/dist/collection/global/services/http-service.js +50 -50
  72. package/dist/collection/lang/lang.js +5 -5
  73. package/dist/collection/lang/piglatin.js +93 -93
  74. package/dist/esm/functions-e528c934.js +6144 -0
  75. package/dist/esm/{global-08ca269c.js → global-b94f59e6.js} +65 -65
  76. package/dist/esm/{http-service-5d037e16.js → http-service-3dc3b3e7.js} +49 -49
  77. package/dist/esm/{index-f8b130b6.js → index-66f8130e.js} +157 -103
  78. package/dist/esm/{interfaces-61c6305b.js → interfaces-2b97fab2.js} +29 -29
  79. package/dist/esm/loader.js +3 -3
  80. package/dist/esm/polyfills/core-js.js +0 -0
  81. package/dist/esm/polyfills/dom.js +0 -0
  82. package/dist/esm/polyfills/es5-html-element.js +0 -0
  83. package/dist/esm/polyfills/index.js +2 -2
  84. package/dist/esm/polyfills/system.js +0 -0
  85. package/dist/esm/priv-chart-popover.entry.js +79 -79
  86. package/dist/esm/priv-datepicker.entry.js +668 -668
  87. package/dist/esm/priv-navigator-button.entry.js +19 -19
  88. package/dist/esm/priv-navigator-item.entry.js +24 -24
  89. package/dist/esm/ripple.js +5 -5
  90. package/dist/esm/wm-action-menu_2.entry.js +342 -342
  91. package/dist/esm/wm-button.entry.js +219 -219
  92. package/dist/esm/wm-chart-slice.entry.js +14 -14
  93. package/dist/esm/wm-chart.entry.js +475 -517
  94. package/dist/esm/wm-datepicker.entry.js +257 -257
  95. package/dist/esm/wm-input.entry.js +134 -134
  96. package/dist/esm/wm-modal-footer.entry.js +32 -32
  97. package/dist/esm/wm-modal-header.entry.js +35 -35
  98. package/dist/esm/wm-modal.entry.js +162 -162
  99. package/dist/esm/wm-navigator.entry.js +269 -269
  100. package/dist/esm/wm-network-uploader.entry.js +421 -421
  101. package/dist/esm/wm-option_2.entry.js +492 -492
  102. package/dist/esm/wm-pagination.entry.js +168 -168
  103. package/dist/esm/wm-search.entry.js +232 -232
  104. package/dist/esm/wm-snackbar.entry.js +171 -171
  105. package/dist/esm/wm-tab-item_3.entry.js +301 -301
  106. package/dist/esm/wm-tag-input.entry.js +557 -557
  107. package/dist/esm/wm-timepicker.entry.js +384 -384
  108. package/dist/esm/wm-toggletip.entry.js +125 -125
  109. package/dist/esm/wm-uploader.entry.js +347 -347
  110. package/dist/esm/wm-wrapper.entry.js +13 -13
  111. package/dist/ripple/p-092b01f3.entry.js +1 -0
  112. package/dist/ripple/{p-c995acbc.entry.js → p-0c58f50d.entry.js} +1 -1
  113. package/dist/ripple/p-11c09317.entry.js +1 -0
  114. package/dist/ripple/p-1e0c41a9.entry.js +1 -0
  115. package/dist/ripple/p-3003d26d.entry.js +1 -0
  116. package/dist/ripple/p-33524565.entry.js +1 -0
  117. package/dist/ripple/{p-888bec42.js → p-43f1298b.js} +0 -0
  118. package/dist/ripple/{p-5e49aba7.entry.js → p-4cc71463.entry.js} +1 -1
  119. package/dist/ripple/p-588b4475.js +16 -0
  120. package/dist/ripple/p-65e3a656.entry.js +1 -0
  121. package/dist/ripple/p-7a96bb97.js +1 -0
  122. package/dist/ripple/p-83b8aaaf.entry.js +1 -0
  123. package/dist/ripple/p-8923b7d0.entry.js +1 -0
  124. package/dist/ripple/{p-d52033d5.entry.js → p-8b0eb05e.entry.js} +1 -1
  125. package/dist/ripple/p-8cd1396e.entry.js +1 -0
  126. package/dist/ripple/{p-22a1a636.entry.js → p-99db8501.entry.js} +1 -1
  127. package/dist/ripple/p-9baa3039.js +1 -0
  128. package/dist/ripple/p-aa973691.entry.js +1 -0
  129. package/dist/ripple/{p-a61977b2.entry.js → p-b3d5ea85.entry.js} +1 -1
  130. package/dist/ripple/{p-7d009793.entry.js → p-b5189f72.entry.js} +1 -1
  131. package/dist/ripple/p-bc27b604.entry.js +1 -0
  132. package/dist/ripple/p-bc9ca97b.entry.js +1 -0
  133. package/dist/ripple/{p-bba99fcd.entry.js → p-cd58a15c.entry.js} +1 -1
  134. package/dist/ripple/p-dc9c9fda.entry.js +1 -0
  135. package/dist/ripple/p-e7616311.entry.js +1 -0
  136. package/dist/ripple/p-e9e8334e.entry.js +1 -0
  137. package/dist/ripple/p-ec9697db.entry.js +1 -0
  138. package/dist/ripple/p-efdaf3b6.entry.js +1 -0
  139. package/dist/ripple/p-fcdc6395.entry.js +1 -0
  140. package/dist/ripple/{p-a6d6eae7.js → p-fd8070fb.js} +0 -0
  141. package/dist/ripple/ripple.esm.js +1 -1
  142. package/dist/types/components/wm-action-menu/wm-action-menu.d.ts +48 -48
  143. package/dist/types/components/wm-button/wm-button.d.ts +44 -44
  144. package/dist/types/components/wm-chart/priv-chart-popover/priv-chart-popover.d.ts +23 -23
  145. package/dist/types/components/wm-chart/wm-chart-slice.d.ts +8 -8
  146. package/dist/types/components/wm-chart/wm-chart.d.ts +81 -80
  147. package/dist/types/components/wm-datepicker/priv-datepicker/priv-datepicker.d.ts +76 -76
  148. package/dist/types/components/wm-datepicker/wm-datepicker.d.ts +41 -41
  149. package/dist/types/components/wm-input/wm-input.d.ts +46 -46
  150. package/dist/types/components/wm-menuitem/wm-menuitem.d.ts +34 -34
  151. package/dist/types/components/wm-modal/wm-modal-footer.d.ts +15 -15
  152. package/dist/types/components/wm-modal/wm-modal-header.d.ts +12 -12
  153. package/dist/types/components/wm-modal/wm-modal.d.ts +41 -41
  154. package/dist/types/components/wm-navigator/priv-navigator-button/priv-navigator-button.d.ts +10 -10
  155. package/dist/types/components/wm-navigator/priv-navigator-item/priv-navigator-item.d.ts +13 -13
  156. package/dist/types/components/wm-navigator/wm-navigator.d.ts +61 -61
  157. package/dist/types/components/wm-option/wm-option.d.ts +32 -32
  158. package/dist/types/components/wm-pagination/wm-pagination.d.ts +32 -32
  159. package/dist/types/components/wm-search/wm-search.d.ts +86 -86
  160. package/dist/types/components/wm-select/wm-select.d.ts +66 -66
  161. package/dist/types/components/wm-snackbar/wm-snackbar.d.ts +35 -35
  162. package/dist/types/components/wm-tabs/wm-tab-item/wm-tab-item.d.ts +38 -38
  163. package/dist/types/components/wm-tabs/wm-tab-list/wm-tab-list.d.ts +53 -53
  164. package/dist/types/components/wm-tabs/wm-tab-panel/wm-tab-panel.d.ts +20 -20
  165. package/dist/types/components/wm-tag-input/wm-tag-input.d.ts +91 -91
  166. package/dist/types/components/wm-timepicker/wm-timepicker.d.ts +62 -62
  167. package/dist/types/components/wm-toggletip/wm-toggletip.d.ts +27 -27
  168. package/dist/types/components/wm-uploader/wm-network-uploader/wm-network-uploader.d.ts +85 -85
  169. package/dist/types/components/wm-uploader/wm-uploader.d.ts +80 -80
  170. package/dist/types/components/wm-wrapper/wm-wrapper.d.ts +7 -7
  171. package/dist/types/components.d.ts +24 -24
  172. package/dist/types/global/__mocks__/functions.d.ts +6 -6
  173. package/dist/types/global/functions.d.ts +40 -0
  174. package/dist/types/global/global.d.ts +1 -1
  175. package/dist/types/global/interfaces.d.ts +34 -34
  176. package/dist/types/global/services/__mocks__/http-service.d.ts +6 -6
  177. package/dist/types/global/services/http-service.d.ts +4 -4
  178. package/dist/types/lang/lang.d.ts +5 -5
  179. package/dist/types/stencil-public-runtime.d.ts +194 -186
  180. package/package.json +46 -46
  181. package/dist/cjs/functions-a6491ba8.js +0 -7943
  182. package/dist/esm/functions-5aebd578.js +0 -7923
  183. package/dist/ripple/p-0865e7cf.js +0 -16
  184. package/dist/ripple/p-0f663e59.entry.js +0 -1
  185. package/dist/ripple/p-1b790a7d.entry.js +0 -1
  186. package/dist/ripple/p-3b4c01b8.entry.js +0 -1
  187. package/dist/ripple/p-54c1f704.entry.js +0 -1
  188. package/dist/ripple/p-76c615e9.entry.js +0 -1
  189. package/dist/ripple/p-7d993d52.js +0 -1
  190. package/dist/ripple/p-8198cc9c.entry.js +0 -1
  191. package/dist/ripple/p-839d35bd.entry.js +0 -1
  192. package/dist/ripple/p-8708b8cb.entry.js +0 -1
  193. package/dist/ripple/p-8bd66955.entry.js +0 -1
  194. package/dist/ripple/p-957e3a05.entry.js +0 -1
  195. package/dist/ripple/p-af6eb4d5.entry.js +0 -1
  196. package/dist/ripple/p-b3f9f575.entry.js +0 -1
  197. package/dist/ripple/p-cd30198d.entry.js +0 -1
  198. package/dist/ripple/p-d9d6bf11.js +0 -1
  199. package/dist/ripple/p-e097c562.entry.js +0 -1
  200. package/dist/ripple/p-e9db6122.entry.js +0 -1
  201. package/dist/ripple/p-eabbd1e9.entry.js +0 -1
  202. package/dist/ripple/p-ec496b8b.entry.js +0 -1
  203. package/dist/ripple/p-fc8ec142.entry.js +0 -1
@@ -1,34 +1,34 @@
1
1
  'use strict';
2
2
 
3
- //List of icon codes with more indicative descriptors to create labels for icon-only buttons
4
- function getIconCodeFromName(icon) {
5
- return iconCodes[icon] || icon;
6
- }
7
- const iconCodes = {
8
- close: "f156",
9
- pencil: "f3eb",
10
- cancel: "f739",
11
- check: "f12c",
12
- delete: "f1c0",
13
- magnify: "f349",
14
- export: "f207",
15
- "dots-vertical": "f1d9",
16
- "arrow-left": "f04d",
17
- "arrow-right": "f054",
18
- "chevron-left": "f141",
19
- "chevron-right": "f142",
20
- "menu-left": "f35e",
21
- "menu-down": "f35d",
22
- "keyboard-backspace": "f30d",
23
- "file-tree": "f645",
24
- "sort-alphabetical": "f4bb",
25
- "checkbox-marked-circle": "f133",
26
- "account-settings": "f630",
27
- "backup-restore": "f06f",
28
- };
29
- const defaultMode = "planning";
30
- const getWmMode = (ref) => {
31
- return ref.getAttribute("mode") || document.documentElement.getAttribute("mode") || defaultMode;
3
+ //List of icon codes with more indicative descriptors to create labels for icon-only buttons
4
+ function getIconCodeFromName(icon) {
5
+ return iconCodes[icon] || icon;
6
+ }
7
+ const iconCodes = {
8
+ close: "f156",
9
+ pencil: "f3eb",
10
+ cancel: "f739",
11
+ check: "f12c",
12
+ delete: "f1c0",
13
+ magnify: "f349",
14
+ export: "f207",
15
+ "dots-vertical": "f1d9",
16
+ "arrow-left": "f04d",
17
+ "arrow-right": "f054",
18
+ "chevron-left": "f141",
19
+ "chevron-right": "f142",
20
+ "menu-left": "f35e",
21
+ "menu-down": "f35d",
22
+ "keyboard-backspace": "f30d",
23
+ "file-tree": "f645",
24
+ "sort-alphabetical": "f4bb",
25
+ "checkbox-marked-circle": "f133",
26
+ "account-settings": "f630",
27
+ "backup-restore": "f06f",
28
+ };
29
+ const defaultMode = "planning";
30
+ const getWmMode = (ref) => {
31
+ return ref.getAttribute("mode") || document.documentElement.getAttribute("mode") || defaultMode;
32
32
  };
33
33
 
34
34
  exports.getIconCodeFromName = getIconCodeFromName;
@@ -2,11 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-921ef454.js');
6
- require('./global-caec45e5.js');
5
+ const index = require('./index-cd179539.js');
6
+ require('./global-ee710089.js');
7
7
 
8
8
  /*
9
- Stencil Client Patch Esm v2.3.0 | MIT Licensed | https://stenciljs.com
9
+ Stencil Client Patch Esm v2.8.1 | MIT Licensed | https://stenciljs.com
10
10
  */
11
11
  const patchEsm = () => {
12
12
  return index.promiseResolve();
@@ -2,88 +2,88 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-921ef454.js');
6
- const functions = require('./functions-a6491ba8.js');
5
+ const index = require('./index-cd179539.js');
6
+ const functions = require('./functions-653e695c.js');
7
7
 
8
8
  const privChartPopoverCss = "priv-chart-popover{position:fixed;z-index:10;border-radius:0.1875rem;-webkit-box-shadow:0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12);-moz-box-shadow:0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12);box-shadow:0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12);background-color:#fff;font-size:0.875rem;text-align:left}priv-chart-popover.user-is-tabbing .button-text{background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.popover{width:10.5rem;padding:0.625rem 0.9375rem;box-sizing:border-box}.popover h1.title{font-size:1em;font-weight:500;margin:0;padding-top:0;padding-left:0;padding-bottom:0.25rem}.popover .text{margin:0;margin-bottom:0.5rem}.popover .popover-button{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;position:relative;display:inline-block;margin-left:1rem;padding-left:0;padding-right:0;height:auto;border:none;background:transparent;text-decoration:none;letter-spacing:0;text-transform:none;text-align:initial;font-size:0.875rem;font-weight:700;color:#575195;line-height:normal}.popover .popover-button .btn-icon{position:absolute;top:0.1875rem;left:-1rem}.popover .popover-button:focus{outline:none}.popover .popover-button::-moz-focus-inner{border:0;outline:none}.popover .popover-button:hover{text-decoration:none;background:none;color:#454077}.popover .popover-button:hover span{text-decoration:underline}";
9
9
 
10
- const ChartPopover = class {
11
- constructor(hostRef) {
12
- index.registerInstance(this, hostRef);
13
- this.wmChartPopoverButtonTriggered = index.createEvent(this, "wmChartPopoverButtonTriggered", 7);
14
- this.open = false;
15
- this.coords = {};
16
- this.popoverWidth = 168;
17
- this.popoverClicked = false;
18
- }
19
- handleClickOnDocument() {
20
- // because this listener is set document-wide, whenever something inside it is clicked
21
- // the event target returned will always be the host (wm-chart)
22
- // the element within wm-chart is determined by the other listener and saved as var popoverClicked for use here
23
- // capture = false in @Listen ensures order of execution
24
- this.open = this.popoverClicked;
25
- this.popoverClicked = false;
26
- }
27
- handleClick(ev) {
28
- let popoverBtnClicked = false;
29
- if (this.btnEl) {
30
- popoverBtnClicked = ev.target === this.btnEl || this.btnEl.contains(ev.target);
31
- }
32
- // if the click is on the popover (except the popover button),
33
- // set popoverClicked to true. It will be used by the other listener above
34
- this.popoverClicked = !popoverBtnClicked && (ev.target === this.el || this.el.contains(ev.target));
35
- }
36
- renderLiveRegion() {
37
- if (this.liveRegion) {
38
- this.liveRegion.innerHTML = "";
39
- const wrapper = document.createElement("div");
40
- const titleEl = document.createElement("span");
41
- titleEl.innerHTML = this.popoverTitle + " " || "";
42
- wrapper.appendChild(titleEl);
43
- const textEl = document.createElement("span");
44
- textEl.innerHTML = this.popoverText + " " || "";
45
- wrapper.appendChild(textEl);
46
- if (this.buttonText) {
47
- const buttonEl = document.createElement("span");
48
- buttonEl.innerHTML =
49
- this.buttonText +
50
- " " +
51
- functions.intl.formatMessage({
52
- id: "chart.infoButton",
53
- defaultMessage: "Button. Click for more information.",
54
- });
55
- wrapper.appendChild(buttonEl);
56
- }
57
- this.liveRegion.appendChild(wrapper);
58
- }
59
- }
60
- positionPopover() {
61
- this.el.style.top = this.coords.y + "px";
62
- if (window.innerWidth - this.coords.x >= this.popoverWidth + 10) {
63
- this.el.style.left = this.coords.x + "px"; // opens on the right
64
- }
65
- else {
66
- this.el.style.left = this.coords.x - this.popoverWidth + "px"; // opens on the left
67
- }
68
- }
69
- render() {
70
- return (index.h(index.Host, null, !!this.open ? (index.h("div", { "aria-hidden": "true", class: "popover" }, index.h("h1", { class: "title" }, this.popoverTitle), index.h("p", { class: "text" }, this.popoverText), this.buttonText ? (
71
- // @ts-ignore
72
- index.h("button", { tabindex: "-1",
73
- // @ts-ignore
74
- focusable: "false", ref: (el) => (this.btnEl = el), class: "popover-button", onClick: () => {
75
- if (this.sliceRef) {
76
- this.sliceRef.click();
77
- this.wmChartPopoverButtonTriggered.emit(this.sliceRef);
78
- }
79
- this.open = false;
80
- } }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.buttonText))) : (""))) : (""), index.h("div", { ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
81
- }
82
- get el() { return index.getElement(this); }
83
- static get watchers() { return {
84
- "coords": ["positionPopover"]
85
- }; }
86
- };
10
+ const ChartPopover = class {
11
+ constructor(hostRef) {
12
+ index.registerInstance(this, hostRef);
13
+ this.wmChartPopoverButtonTriggered = index.createEvent(this, "wmChartPopoverButtonTriggered", 7);
14
+ this.open = false;
15
+ this.coords = {};
16
+ this.popoverWidth = 168;
17
+ this.popoverClicked = false;
18
+ }
19
+ handleClickOnDocument() {
20
+ // because this listener is set document-wide, whenever something inside it is clicked
21
+ // the event target returned will always be the host (wm-chart)
22
+ // the element within wm-chart is determined by the other listener and saved as var popoverClicked for use here
23
+ // capture = false in @Listen ensures order of execution
24
+ this.open = this.popoverClicked;
25
+ this.popoverClicked = false;
26
+ }
27
+ handleClick(ev) {
28
+ let popoverBtnClicked = false;
29
+ if (this.btnEl) {
30
+ popoverBtnClicked = ev.target === this.btnEl || this.btnEl.contains(ev.target);
31
+ }
32
+ // if the click is on the popover (except the popover button),
33
+ // set popoverClicked to true. It will be used by the other listener above
34
+ this.popoverClicked = !popoverBtnClicked && (ev.target === this.el || this.el.contains(ev.target));
35
+ }
36
+ renderLiveRegion() {
37
+ if (this.liveRegion) {
38
+ this.liveRegion.innerHTML = "";
39
+ const wrapper = document.createElement("div");
40
+ const titleEl = document.createElement("span");
41
+ titleEl.innerHTML = this.popoverTitle + " " || "";
42
+ wrapper.appendChild(titleEl);
43
+ const textEl = document.createElement("span");
44
+ textEl.innerHTML = this.popoverText + " " || "";
45
+ wrapper.appendChild(textEl);
46
+ if (this.buttonText) {
47
+ const buttonEl = document.createElement("span");
48
+ buttonEl.innerHTML =
49
+ this.buttonText +
50
+ " " +
51
+ functions.intl.formatMessage({
52
+ id: "chart.infoButton",
53
+ defaultMessage: "Button. Click for more information.",
54
+ });
55
+ wrapper.appendChild(buttonEl);
56
+ }
57
+ this.liveRegion.appendChild(wrapper);
58
+ }
59
+ }
60
+ positionPopover() {
61
+ this.el.style.top = this.coords.y + "px";
62
+ if (window.innerWidth - this.coords.x >= this.popoverWidth + 10) {
63
+ this.el.style.left = this.coords.x + "px"; // opens on the right
64
+ }
65
+ else {
66
+ this.el.style.left = this.coords.x - this.popoverWidth + "px"; // opens on the left
67
+ }
68
+ }
69
+ render() {
70
+ return (index.h(index.Host, null, !!this.open ? (index.h("div", { "aria-hidden": "true", class: "popover" }, index.h("h1", { class: "title" }, this.popoverTitle), index.h("p", { class: "text" }, this.popoverText), this.buttonText ? (
71
+ // @ts-ignore
72
+ index.h("button", { tabindex: "-1",
73
+ // @ts-ignore
74
+ focusable: "false", ref: (el) => (this.btnEl = el), class: "popover-button", onClick: () => {
75
+ if (this.sliceRef) {
76
+ this.sliceRef.click();
77
+ this.wmChartPopoverButtonTriggered.emit(this.sliceRef);
78
+ }
79
+ this.open = false;
80
+ } }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.buttonText))) : (""))) : (""), index.h("div", { ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
81
+ }
82
+ get el() { return index.getElement(this); }
83
+ static get watchers() { return {
84
+ "coords": ["positionPopover"]
85
+ }; }
86
+ };
87
87
  ChartPopover.style = privChartPopoverCss;
88
88
 
89
89
  exports.priv_chart_popover = ChartPopover;