@designsystem-se/af 39.2.1 → 39.2.2

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 (126) hide show
  1. package/components/digi-bar-chart.js +67 -17
  2. package/components/digi-calendar-datepicker.js +1 -1
  3. package/components/digi-calendar-week-view.js +51 -6
  4. package/components/digi-calendar.js +1 -1
  5. package/components/digi-chart-line.js +57 -14
  6. package/components/digi-navigation-vertical-menu.js +27 -13
  7. package/components/digi-tablist.js +36 -13
  8. package/components/{p-CrUxQ9d0.js → p-C5A2t93y.js} +1 -1
  9. package/dist/cjs/{calendar-week-view-heading-level.enum-NEkm5SUq.js → calendar-week-view-heading-level.enum-BI2f9bbk.js} +7 -0
  10. package/dist/cjs/digi-arbetsformedlingen.cjs.js +1 -1
  11. package/dist/cjs/{digi-button_5.cjs.entry.js → digi-badge-notification_8.cjs.entry.js} +436 -7
  12. package/dist/cjs/digi-bar-chart.cjs.entry.js +67 -17
  13. package/dist/cjs/digi-calendar-datepicker.cjs.entry.js +1 -2
  14. package/dist/cjs/digi-calendar_2.cjs.entry.js +1 -1
  15. package/dist/cjs/digi-chart-line.cjs.entry.js +57 -14
  16. package/dist/cjs/digi-code-block_3.cjs.entry.js +1 -2
  17. package/dist/cjs/digi-dialog.cjs.entry.js +1 -2
  18. package/dist/cjs/digi-footer.cjs.entry.js +1 -2
  19. package/dist/cjs/digi-form-error-list.cjs.entry.js +1 -2
  20. package/dist/cjs/digi-form-receipt.cjs.entry.js +1 -2
  21. package/dist/cjs/digi-form-select-filter.cjs.entry.js +1 -2
  22. package/dist/cjs/digi-header-navigation.cjs.entry.js +1 -2
  23. package/dist/cjs/digi-header.cjs.entry.js +1 -2
  24. package/dist/cjs/digi-navigation-pagination.cjs.entry.js +1 -2
  25. package/dist/cjs/digi-navigation-vertical-menu.cjs.entry.js +27 -13
  26. package/dist/cjs/digi-notification-alert.cjs.entry.js +1 -2
  27. package/dist/cjs/digi-notification-error-page.cjs.entry.js +1 -2
  28. package/dist/cjs/digi-title-logo.cjs.entry.js +1 -2
  29. package/dist/cjs/digi-tools-feedback.cjs.entry.js +1 -2
  30. package/dist/cjs/index-Cn1hHaSy.js +2 -14
  31. package/dist/cjs/index.cjs.js +6 -7
  32. package/dist/cjs/loader.cjs.js +1 -1
  33. package/dist/collection/components/_calendar/calendar/calendar.css +5 -6
  34. package/dist/collection/components/_calendar/week-view/calendar-week-view.js +53 -8
  35. package/dist/collection/components/_chart/bar-chart/bar-chart.css +1 -1
  36. package/dist/collection/components/_chart/bar-chart/bar-chart.js +66 -16
  37. package/dist/collection/components/_chart/chart-line/chart-line.js +57 -14
  38. package/dist/collection/components/_navigation/navigation-tablist/navigation-tablist.js +36 -13
  39. package/dist/collection/components/_navigation/navigation-vertical-menu/navigation-vertical-menu.js +27 -13
  40. package/dist/collection/design-tokens/components/_logo.variables.scss +2 -0
  41. package/dist/digi-arbetsformedlingen/digi-arbetsformedlingen.esm.js +1 -1
  42. package/dist/digi-arbetsformedlingen/index.esm.js +1 -1
  43. package/dist/digi-arbetsformedlingen/p-0f7e995a.entry.js +1 -0
  44. package/dist/digi-arbetsformedlingen/p-26f6a310.entry.js +1 -0
  45. package/dist/digi-arbetsformedlingen/p-3b42582a.entry.js +1 -0
  46. package/dist/digi-arbetsformedlingen/p-4384644b.entry.js +1 -0
  47. package/dist/digi-arbetsformedlingen/p-47513f97.entry.js +1 -0
  48. package/dist/digi-arbetsformedlingen/p-569c628c.entry.js +1 -0
  49. package/dist/digi-arbetsformedlingen/p-668d38d9.entry.js +1 -0
  50. package/dist/digi-arbetsformedlingen/p-66f34ca5.entry.js +1 -0
  51. package/dist/digi-arbetsformedlingen/p-6cb1c6ea.entry.js +1 -0
  52. package/dist/digi-arbetsformedlingen/p-6e256f0c.entry.js +1 -0
  53. package/dist/digi-arbetsformedlingen/p-71a8478d.entry.js +1 -0
  54. package/dist/digi-arbetsformedlingen/p-9df345c4.entry.js +1 -0
  55. package/dist/digi-arbetsformedlingen/p-BBOpiDGx.js +1 -0
  56. package/dist/digi-arbetsformedlingen/p-a1deddb1.entry.js +1 -0
  57. package/dist/digi-arbetsformedlingen/p-beebbc90.entry.js +1 -0
  58. package/dist/digi-arbetsformedlingen/{p-ee58a938.entry.js → p-c7ade486.entry.js} +1 -1
  59. package/dist/digi-arbetsformedlingen/p-d065e751.entry.js +1 -0
  60. package/dist/digi-arbetsformedlingen/p-d150094c.entry.js +1 -0
  61. package/dist/digi-arbetsformedlingen/p-df8efa59.entry.js +1 -0
  62. package/dist/digi-arbetsformedlingen/p-e2b0b070.entry.js +1 -0
  63. package/dist/esm/{calendar-week-view-heading-level.enum-DH_-wpLB.js → calendar-week-view-heading-level.enum-BBOpiDGx.js} +8 -1
  64. package/dist/esm/digi-arbetsformedlingen.js +1 -1
  65. package/dist/esm/{digi-button_5.entry.js → digi-badge-notification_8.entry.js} +435 -9
  66. package/dist/esm/digi-bar-chart.entry.js +67 -17
  67. package/dist/esm/digi-calendar-datepicker.entry.js +1 -2
  68. package/dist/esm/digi-calendar_2.entry.js +1 -1
  69. package/dist/esm/digi-chart-line.entry.js +57 -14
  70. package/dist/esm/digi-code-block_3.entry.js +1 -2
  71. package/dist/esm/digi-dialog.entry.js +1 -2
  72. package/dist/esm/digi-footer.entry.js +1 -2
  73. package/dist/esm/digi-form-error-list.entry.js +1 -2
  74. package/dist/esm/digi-form-receipt.entry.js +1 -2
  75. package/dist/esm/digi-form-select-filter.entry.js +1 -2
  76. package/dist/esm/digi-header-navigation.entry.js +1 -2
  77. package/dist/esm/digi-header.entry.js +1 -2
  78. package/dist/esm/digi-navigation-pagination.entry.js +1 -2
  79. package/dist/esm/digi-navigation-vertical-menu.entry.js +27 -13
  80. package/dist/esm/digi-notification-alert.entry.js +1 -2
  81. package/dist/esm/digi-notification-error-page.entry.js +1 -2
  82. package/dist/esm/digi-title-logo.entry.js +1 -2
  83. package/dist/esm/digi-tools-feedback.entry.js +1 -2
  84. package/dist/esm/index-BnKuq1L7.js +2 -14
  85. package/dist/esm/index.js +1 -2
  86. package/dist/esm/loader.js +1 -1
  87. package/dist/types/components/_calendar/week-view/calendar-week-view.d.ts +4 -2
  88. package/dist/types/components/_chart/bar-chart/bar-chart.d.ts +4 -2
  89. package/dist/types/components/_chart/chart-line/chart-line.d.ts +3 -1
  90. package/dist/types/components/_navigation/navigation-tablist/navigation-tablist.d.ts +4 -2
  91. package/dist/types/components/_navigation/navigation-vertical-menu/navigation-vertical-menu.d.ts +7 -2
  92. package/dist/types/components.d.ts +3 -3
  93. package/hydrate/index.js +236 -64
  94. package/hydrate/index.mjs +236 -64
  95. package/package.json +1 -1
  96. package/dist/cjs/badge-notification-shape.enum-CEyEo2G5.js +0 -8
  97. package/dist/cjs/digi-badge-notification.cjs.entry.js +0 -65
  98. package/dist/cjs/digi-tablist-panel.cjs.entry.js +0 -20
  99. package/dist/cjs/digi-tablist.cjs.entry.js +0 -289
  100. package/dist/digi-arbetsformedlingen/p-0394e694.entry.js +0 -1
  101. package/dist/digi-arbetsformedlingen/p-09b52191.entry.js +0 -1
  102. package/dist/digi-arbetsformedlingen/p-0c88f210.entry.js +0 -1
  103. package/dist/digi-arbetsformedlingen/p-151248bf.entry.js +0 -1
  104. package/dist/digi-arbetsformedlingen/p-26099889.entry.js +0 -1
  105. package/dist/digi-arbetsformedlingen/p-52a27991.entry.js +0 -1
  106. package/dist/digi-arbetsformedlingen/p-5ee5766d.entry.js +0 -1
  107. package/dist/digi-arbetsformedlingen/p-626c1bf5.entry.js +0 -1
  108. package/dist/digi-arbetsformedlingen/p-674a7a94.entry.js +0 -1
  109. package/dist/digi-arbetsformedlingen/p-6c1fd994.entry.js +0 -1
  110. package/dist/digi-arbetsformedlingen/p-7682ad6f.entry.js +0 -1
  111. package/dist/digi-arbetsformedlingen/p-7f180ce2.entry.js +0 -1
  112. package/dist/digi-arbetsformedlingen/p-88bec555.entry.js +0 -1
  113. package/dist/digi-arbetsformedlingen/p-CKoZU0-H.js +0 -1
  114. package/dist/digi-arbetsformedlingen/p-DH_-wpLB.js +0 -1
  115. package/dist/digi-arbetsformedlingen/p-a556608d.entry.js +0 -1
  116. package/dist/digi-arbetsformedlingen/p-b3410fbd.entry.js +0 -1
  117. package/dist/digi-arbetsformedlingen/p-e002ceb8.entry.js +0 -1
  118. package/dist/digi-arbetsformedlingen/p-e6ee5a17.entry.js +0 -1
  119. package/dist/digi-arbetsformedlingen/p-ec6dd177.entry.js +0 -1
  120. package/dist/digi-arbetsformedlingen/p-eee1b91f.entry.js +0 -1
  121. package/dist/digi-arbetsformedlingen/p-fea63204.entry.js +0 -1
  122. package/dist/digi-arbetsformedlingen/p-ff73fa2f.entry.js +0 -1
  123. package/dist/esm/badge-notification-shape.enum-CKoZU0-H.js +0 -8
  124. package/dist/esm/digi-badge-notification.entry.js +0 -63
  125. package/dist/esm/digi-tablist-panel.entry.js +0 -18
  126. package/dist/esm/digi-tablist.entry.js +0 -287
@@ -2,6 +2,7 @@ import { r as registerInstance, h, a as Host, d as getElement } from './index-Bn
2
2
  import { o as ordinal, i as initRange, r as range, s as select, a as axisLeft, l as linear, b as axisBottom, m as max, p as polyInOut, c as min, d as linear$1 } from './transform-lPbx4RHH.js';
3
3
  import { _ as _t } from './text-DsO1BTml.js';
4
4
  import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
5
+ import { l as logger } from './logger.util-DdB9j8uV.js';
5
6
  import { B as BarChartVariation } from './bar-chart-variation.enum-DPeoHh1J.js';
6
7
 
7
8
  function band() {
@@ -84,7 +85,7 @@ function band() {
84
85
  return initRange.apply(rescale(), arguments);
85
86
  }
86
87
 
87
- const barChartCss = () => `.sc-digi-bar-chart-h{width:100%;display:flex;flex-direction:column;min-width:0}.sc-digi-bar-chart-h .digi-bar-chart.sc-digi-bar-chart{font-family:var(--digi--global--typography--font-family--default)}.sc-digi-bar-chart-h .svgWrap.sc-digi-bar-chart{position:relative;display:flex;min-height:20px;min-width:20px;width:100%;height:100%}.sc-digi-bar-chart-h .topWrapper.sc-digi-bar-chart,.sc-digi-bar-chart-h .chartTitle.sc-digi-bar-chart .digi-typography.sc-digi-bar-chart{display:flex;flex-direction:column;gap:0.75rem}.sc-digi-bar-chart-h .topWrapper.sc-digi-bar-chart{margin-bottom:0.75rem}.sc-digi-bar-chart-h .chartTitle.sc-digi-bar-chart{--MARGIN--HEADING-2:0;--MARGIN--HEADING-3:0;--MARGIN--HEADING-4:0;--MARGIN--HEADING-5:0;--MARGIN--HEADING-6:0;--MARGIN--BODY:0}.sc-digi-bar-chart-h .buttonWrapper.sc-digi-bar-chart{--digi--button--padding--medium:0 0 0.75rem 0}.sc-digi-bar-chart-h .chartTooltip.sc-digi-bar-chart{top:-5px;position:absolute;background-color:var(--digi--color--background--primary);color:black;padding:5px 10px;padding-right:5px;border-radius:4px;display:block;width:max-content;white-space:nowrap;filter:drop-shadow(rgba(0, 0, 0, 0.8) 0px 0px 1px);font-size:0.875rem}.sc-digi-bar-chart-h .tooltipBody.sc-digi-bar-chart{display:inline-block}.sc-digi-bar-chart-h .tooltipHead.sc-digi-bar-chart{display:flex;flex-direction:row;justify-content:space-between}.sc-digi-bar-chart-h .tooltipClose.sc-digi-bar-chart{display:inline-block;vertical-align:top;--digi--color--icon--primary:#333;cursor:pointer}.sc-digi-bar-chart-h .tooltipClose.sc-digi-bar-chart:hover{--digi--color--icon--primary:gray}.sc-digi-bar-chart-h .legendWrap.sc-digi-bar-chart{display:grid}.sc-digi-bar-chart-h .legend.sc-digi-bar-chart{display:flex;flex-direction:row;gap:1rem;min-width:0;overflow-x:auto;scrollbar-gutter:stable}.sc-digi-bar-chart-h .caret.sc-digi-bar-chart{--digi--icon--color:var(--digi--color--background--primary)}.sc-digi-bar-chart-h .scChartStatus.sc-digi-bar-chart{border:0;clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sc-digi-bar-chart-h .table.sc-digi-bar-chart{display:none;overflow-y:auto;height:auto;border-radius:4px;background:linear-gradient(white 30%, rgba(255, 255, 255, 0)) center top, linear-gradient(rgba(255, 255, 255, 0), white 70%) center bottom, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center top, radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center bottom;background-repeat:no-repeat;background-size:100% 40px, 100% 40px, 100% 14px, 100% 14px;background-attachment:local, local, scroll, scroll}`;
88
+ const barChartCss = () => `.sc-digi-bar-chart-h{height:100%;display:flex;flex-direction:column;min-width:0}.sc-digi-bar-chart-h .digi-bar-chart.sc-digi-bar-chart{font-family:var(--digi--global--typography--font-family--default)}.sc-digi-bar-chart-h .svgWrap.sc-digi-bar-chart{position:relative;display:flex;min-height:20px;min-width:20px;width:100%;height:100%}.sc-digi-bar-chart-h .topWrapper.sc-digi-bar-chart,.sc-digi-bar-chart-h .chartTitle.sc-digi-bar-chart .digi-typography.sc-digi-bar-chart{display:flex;flex-direction:column;gap:0.75rem}.sc-digi-bar-chart-h .topWrapper.sc-digi-bar-chart{margin-bottom:0.75rem}.sc-digi-bar-chart-h .chartTitle.sc-digi-bar-chart{--MARGIN--HEADING-2:0;--MARGIN--HEADING-3:0;--MARGIN--HEADING-4:0;--MARGIN--HEADING-5:0;--MARGIN--HEADING-6:0;--MARGIN--BODY:0}.sc-digi-bar-chart-h .buttonWrapper.sc-digi-bar-chart{--digi--button--padding--medium:0 0 0.75rem 0}.sc-digi-bar-chart-h .chartTooltip.sc-digi-bar-chart{top:-5px;position:absolute;background-color:var(--digi--color--background--primary);color:black;padding:5px 10px;padding-right:5px;border-radius:4px;display:block;width:max-content;white-space:nowrap;filter:drop-shadow(rgba(0, 0, 0, 0.8) 0px 0px 1px);font-size:0.875rem}.sc-digi-bar-chart-h .tooltipBody.sc-digi-bar-chart{display:inline-block}.sc-digi-bar-chart-h .tooltipHead.sc-digi-bar-chart{display:flex;flex-direction:row;justify-content:space-between}.sc-digi-bar-chart-h .tooltipClose.sc-digi-bar-chart{display:inline-block;vertical-align:top;--digi--color--icon--primary:#333;cursor:pointer}.sc-digi-bar-chart-h .tooltipClose.sc-digi-bar-chart:hover{--digi--color--icon--primary:gray}.sc-digi-bar-chart-h .legendWrap.sc-digi-bar-chart{display:grid}.sc-digi-bar-chart-h .legend.sc-digi-bar-chart{display:flex;flex-direction:row;gap:1rem;min-width:0;overflow-x:auto;scrollbar-gutter:stable}.sc-digi-bar-chart-h .caret.sc-digi-bar-chart{--digi--icon--color:var(--digi--color--background--primary)}.sc-digi-bar-chart-h .scChartStatus.sc-digi-bar-chart{border:0;clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sc-digi-bar-chart-h .table.sc-digi-bar-chart{display:none;overflow-y:auto;height:auto;border-radius:4px;background:linear-gradient(white 30%, rgba(255, 255, 255, 0)) center top, linear-gradient(rgba(255, 255, 255, 0), white 70%) center bottom, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center top, radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) center bottom;background-repeat:no-repeat;background-size:100% 40px, 100% 40px, 100% 14px, 100% 14px;background-attachment:local, local, scroll, scroll}`;
88
89
 
89
90
  const barChart = class {
90
91
  constructor(hostRef) {
@@ -254,6 +255,8 @@ const barChart = class {
254
255
  };
255
256
  // Resizing chart while loading
256
257
  this.loadingResize = () => {
258
+ if (!this.barSelection || !this.xScale)
259
+ return;
257
260
  const newHeight = this.setDims();
258
261
  this.barChartContainer.attr('transform', `translate(${this.margin.left + this.tickPadding + this.yTickSize},0)`);
259
262
  this.margin.right =
@@ -515,6 +518,8 @@ const barChart = class {
515
518
  return toReturn;
516
519
  };
517
520
  this.adjustBarSize = () => {
521
+ if (!this.barSelection)
522
+ return;
518
523
  this.barSelection
519
524
  .selectAll('.bar')
520
525
  .attr('x', this.xFunction)
@@ -947,13 +952,13 @@ const barChart = class {
947
952
  this.initBarText();
948
953
  };
949
954
  // Removes resize observer for chart and inits table
950
- this.activateTable = (event) => {
955
+ this.activateTable = () => {
951
956
  this.closeTooltip();
952
957
  this.barChartObserver.disconnect();
953
958
  this.status.innerHTML = '<p>Visas som tabell</p>';
954
959
  select(this.host).select('.tableButton').style('display', 'none');
955
960
  select(this.host).select('.chartButton').style('display', null);
956
- event.target.nextSibling.lastChild.focus();
961
+ this.focusHostButton('.chartButton');
957
962
  const duration = 150;
958
963
  this.svg
959
964
  .attr('opacity', 1)
@@ -984,11 +989,11 @@ const barChart = class {
984
989
  .style('opacity', 0);
985
990
  };
986
991
  // Removes observer and calls init functions for line chart
987
- this.reInitChart = (event) => {
992
+ this.reInitChart = () => {
988
993
  this.status.innerHTML = '<p>Visas som diagram</p>';
989
994
  select(this.host).select('.tableButton').style('display', null);
990
995
  select(this.host).select('.chartButton').style('display', 'none');
991
- event.target.previousSibling.lastChild.focus();
996
+ this.focusHostButton('.tableButton');
992
997
  const table = select(this.tableDiv);
993
998
  const duration = 150;
994
999
  table
@@ -1014,14 +1019,33 @@ const barChart = class {
1014
1019
  });
1015
1020
  };
1016
1021
  }
1017
- afChartDataUpdate(data) {
1018
- if ((typeof data === 'string' && Object.keys(JSON.parse(data)).length > 0) ||
1019
- (typeof data !== 'string' && Object.keys(data).length > 0)) {
1020
- if (typeof data != 'string')
1021
- this.chartData = data;
1022
- else
1023
- this.chartData = JSON.parse(data);
1024
- this.series = this.chartData.data.series.map((serie) => serie.title);
1022
+ afChartDataUpdate() {
1023
+ const data = this.afChartData;
1024
+ // Angular/React can connect the element before afChartData is set.
1025
+ if (data == null || data === '') {
1026
+ this.mappedData = this.reshapeData();
1027
+ return;
1028
+ }
1029
+ try {
1030
+ let parsed;
1031
+ if (typeof data === 'string') {
1032
+ parsed = JSON.parse(data);
1033
+ }
1034
+ else if (typeof data === 'object') {
1035
+ parsed = data;
1036
+ }
1037
+ else {
1038
+ this.mappedData = this.reshapeData();
1039
+ return;
1040
+ }
1041
+ if (parsed && Object.keys(parsed).length > 0) {
1042
+ this.chartData = parsed;
1043
+ this.series = this.chartData.data.series.map((serie) => serie.title);
1044
+ }
1045
+ }
1046
+ catch (_a) {
1047
+ logger.warn(`Invalid JSON in "af-chart-data" attribute`, this.hostElement);
1048
+ return;
1025
1049
  }
1026
1050
  this.mappedData = this.reshapeData();
1027
1051
  // checking for width of each tick
@@ -1032,6 +1056,17 @@ const barChart = class {
1032
1056
  if (this.dataWidth > 1)
1033
1057
  this.barGap = 1;
1034
1058
  }
1059
+ hasChartData() {
1060
+ return !!this.chartData && Object.keys(this.chartData).length > 0;
1061
+ }
1062
+ focusHostButton(selector) {
1063
+ var _a, _b;
1064
+ const host = this.host;
1065
+ const button = (_b = (_a = host === null || host === void 0 ? void 0 : host.querySelector(selector)) === null || _a === void 0 ? void 0 : _a.querySelector('button')) !== null && _b !== void 0 ? _b : host === null || host === void 0 ? void 0 : host.querySelector(selector);
1066
+ if (button && typeof button.focus === 'function') {
1067
+ button.focus();
1068
+ }
1069
+ }
1035
1070
  initSvg() {
1036
1071
  var _a, _b, _c, _d, _e, _f, _g;
1037
1072
  // Fetch number formatting
@@ -1593,10 +1628,25 @@ const barChart = class {
1593
1628
  Math.min(255, Math.max(0, parseInt(color, 16) + amount)).toString(16)).substr(-2)));
1594
1629
  }
1595
1630
  componentWillLoad() {
1596
- this.afChartDataUpdate(this.afChartData);
1631
+ this.afChartDataUpdate();
1632
+ // Angular attaches the host first and binds `[afChartData]` on the next
1633
+ // frame (Stencil 4.36+). @Watch skips that first assignment, so if chart
1634
+ // data is not here yet, wait one frame. React/vanilla that already set
1635
+ // the prop skip the delay.
1636
+ if (!this.hasChartData()) {
1637
+ return new Promise((resolve) => {
1638
+ requestAnimationFrame(() => {
1639
+ this.afChartDataUpdate();
1640
+ resolve();
1641
+ });
1642
+ });
1643
+ }
1597
1644
  }
1598
1645
  componentDidLoad() {
1599
- if (!this.chartData || Object.keys(this.chartData).length === 0) {
1646
+ if (!this.hasChartData()) {
1647
+ this.afChartDataUpdate();
1648
+ }
1649
+ if (!this.hasChartData()) {
1600
1650
  this.loading = true;
1601
1651
  return this.initEmpty();
1602
1652
  }
@@ -1615,7 +1665,7 @@ const barChart = class {
1615
1665
  }
1616
1666
  componentDidUpdate() {
1617
1667
  if (this.tableDiv.style['display'] != 'block' &&
1618
- Object.keys(this.chartData).length === 0) {
1668
+ !this.hasChartData()) {
1619
1669
  // Disconnect old barchartobserver while doing resizing
1620
1670
  this.barChartObserver.disconnect();
1621
1671
  return this.loadingState();
@@ -1695,7 +1745,7 @@ const barChart = class {
1695
1745
  if (this.chartData.infoText)
1696
1746
  heading = `${heading}<span style="display:block;margin-top:0.25rem;font-size:0.875rem;color:var(--digi--global--color--neutral--grayscale--darkest-3)">${this.chartData.infoText}</span>`;
1697
1747
  }
1698
- return (h(Host, { key: 'cb70095467051cf1142891bc63694623e707d92f', ref: (el) => (this.host = el) }, h("svg", { key: 'c040fe2f27d9a5e3de1471fe7e4d853757f6a754', xmlns: "http://www.w3.org/2000/svg", width: "0", height: "0" }, h("defs", { key: '17fd52f2cac5a3225e097aee80e8dc1a99909840' }, h("pattern", { key: '2940e729359dad1acc4635363cd5a8f3ee4d8ea1', id: "prognosis", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("rect", { key: '4b47d41ea9f4699a4bcc7b0f04d00b8bbd124946', width: "8", height: "8", fill: "white" }), h("line", { key: 'd5c3a32fb715a5271a784771d9812ea599390fc3', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar(this.colorPalettes[0]), "stroke-width": "8" })), h("pattern", { key: '8038bb4d62fd87a118e0bcf4e750165eed48f789', id: "prognosisInactive", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("rect", { key: 'b1247b7d27e73836c7b5a05fb77a872e89853d3b', width: "8", height: "8", fill: "white" }), h("line", { key: '14265bcba469f08b890654315a86d6278271d64d', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar('--digi--color--background--secondary-accent'), "stroke-width": "8" })), h("pattern", { key: '4069999fd742795379f093c83c00cca488b6139c', id: "prognosisHighlight", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("rect", { key: 'c525ae39e05acf3e7522f1b92feffdfe5221e528', width: "8", height: "8", fill: "white" }), h("line", { key: 'fa183e0678f6f3794e094b97975fe96955b49e0a', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.adjustColor(this.colorFunction(0), 50), "stroke-width": "8" })))), h("div", { key: 'b6e46d7f4701775a177b02a98f46ca40308e9938', class: "topWrapper", ref: (el) => (this.titleDiv = el) }, h("digi-typography", { key: '88d49833d43776a2bc23d7f73bb8cc9442350634', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '75e2ef09c3f9f91a08b3596d02ad308b244586bb', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_a = this.chartData) === null || _a === void 0 ? void 0 : _a.title) ? (_b = this.chartData) === null || _b === void 0 ? void 0 : _b.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '7712b56f991bb5214aa3bebb9e380221156b6bbf', slot: "icon" }), "Visa tabell"), h("digi-button", { key: 'b9d442ea0b62303c2bf1018651ce3206063f3b35', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_c = this.chartData) === null || _c === void 0 ? void 0 : _c.title) ? (_d = this.chartData) === null || _d === void 0 ? void 0 : _d.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: '260c432d04f8ea00216cd485b5ec3a29df4b4db1', slot: "icon" }), "Visa diagram"), h("div", { key: 'a7fd6276b5738e9cf040f0e9b99e983b27ec25cf', class: "scChartStatus", role: "status", ref: (el) => (this.status = el) })), h("div", { key: '705ec9e3931b91009ff565bbd8f4ba300bd8dbd7', class: "svgWrap", ref: (el) => (this.chartDiv = el) }, h("div", { key: '242fd5b7afba36df00aa7fb256bd8578712d25e7', class: "chartTooltip", id: this.afId }, h("div", { key: '6417cc30962396164fe4840ecfef62c4ef7591d6', class: "tooltipHead" }, h("digi-icon-x", { key: 'dc4edb442bfb342fbdb64b06e70f1e19ccc5ffb1', class: "tooltipClose" })), h("div", { key: 'da625c879d4c0eebffa02193dc36d794c755b768', class: "tooltipBody" }), this.afVariation === BarChartVariation.Horizontal ? (h("digi-icon-caret-up", { class: "caret" })) : (h("digi-icon-caret-down", { class: "caret" })))), h("div", { key: 'a003a616c2ee8b848d402b38009261539ebf0c50', class: "legendWrap", ref: (el) => (this.legendDiv = el) }, h("div", { key: '44a6db8daa836ccf910aafd6fd996f153c337bf4', class: "legend" })), h("div", { key: 'a872281035f2799fe8aa9128a953d0c5d9f6b2cc', class: "table", ref: (el) => (this.tableDiv = el) }, ' ')));
1748
+ return (h(Host, { key: '003845ddc03e2027721d5e75c82816faae5bde63', ref: (el) => (this.host = el) }, h("svg", { key: '054049009c8618211f9009961d238992c3d03c0e', xmlns: "http://www.w3.org/2000/svg", width: "0", height: "0" }, h("defs", { key: '16f32628ffd79e24b66e749666eccd6ae283a5b8' }, h("pattern", { key: '8aa5e0923086f740eeb02d71690ed16086205b0a', id: "prognosis", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("rect", { key: '237569e79095a4a7c084aa91fd637dfbe385ca8b', width: "8", height: "8", fill: "white" }), h("line", { key: '6edeac6a60cef51561c8fd803b2e277b19b740bf', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar(this.colorPalettes[0]), "stroke-width": "8" })), h("pattern", { key: 'bd40402b6fd33d50fc4dca709380108fe054f74c', id: "prognosisInactive", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("rect", { key: 'a5dcf48112b024982f3410bc51eb05002c8c8dcc', width: "8", height: "8", fill: "white" }), h("line", { key: 'b76b6ae15b8a0ee9c37c28bf3f66613c9df1e9b8', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar('--digi--color--background--secondary-accent'), "stroke-width": "8" })), h("pattern", { key: 'ef4782b914f2599424d5f3e6715cb69c4f0e4728', id: "prognosisHighlight", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("rect", { key: '6501ba8a46f53b6c3309486d0795d348a8ec1fff', width: "8", height: "8", fill: "white" }), h("line", { key: 'b184212878587e1e15ebf40a472333851270b287', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.adjustColor(this.colorFunction(0), 50), "stroke-width": "8" })))), h("div", { key: '02b5c9c63c327995f9603ffc84ab0455137ff43d', class: "topWrapper", ref: (el) => (this.titleDiv = el) }, h("digi-typography", { key: 'd8944066ab1a86ed71af7de4a018ef422cea75e9', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '6bc1e5870432720980fc8dad25abc5f2cb474daf', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_a = this.chartData) === null || _a === void 0 ? void 0 : _a.title) ? (_b = this.chartData) === null || _b === void 0 ? void 0 : _b.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '5a8b44b3a201b4866b89fc4328ff0b46ac47c6e1', slot: "icon" }), "Visa tabell"), h("digi-button", { key: 'cd0d60a025d5fa0e62cb5f6a322cf3f97c0bd02e', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_c = this.chartData) === null || _c === void 0 ? void 0 : _c.title) ? (_d = this.chartData) === null || _d === void 0 ? void 0 : _d.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: '8f4e4f1bdabffd7ffd1532453b534a823ef65006', slot: "icon" }), "Visa diagram"), h("div", { key: '22535e8bfb69f96152e61295019d463cb69b70c3', class: "scChartStatus", role: "status", ref: (el) => (this.status = el) })), h("div", { key: '55e25140585469497ec501cd133cfc710bb88b43', class: "svgWrap", ref: (el) => (this.chartDiv = el) }, h("div", { key: '4d8cd2eb832770f94fdff5eec2f084e4ba5c96b8', class: "chartTooltip", id: this.afId }, h("div", { key: 'b805b20b746ce940ae5c20ef34898c3409cffecd', class: "tooltipHead" }, h("digi-icon-x", { key: 'c162d2b1e6e7aafddf0ac194705b436a5b02b392', class: "tooltipClose" })), h("div", { key: 'cdc876d4c88f50c7d95c22f4d0f683c2a5564235', class: "tooltipBody" }), this.afVariation === BarChartVariation.Horizontal ? (h("digi-icon-caret-up", { class: "caret" })) : (h("digi-icon-caret-down", { class: "caret" })))), h("div", { key: '8cb986f7466fdb42f6dc840c1371b25978ae4c66', class: "legendWrap", ref: (el) => (this.legendDiv = el) }, h("div", { key: '6761a567c03c8ade4206fb89cf9e7bd792c36e71', class: "legend" })), h("div", { key: 'ac251b6078602f9319447cfaa6444f0129e46c0f', class: "table", ref: (el) => (this.tableDiv = el) }, ' ')));
1699
1749
  }
1700
1750
  get hostElement() { return getElement(this); }
1701
1751
  static get watchers() { return {
@@ -1,11 +1,10 @@
1
1
  import { r as registerInstance, c as createEvent, h, a as Host, d as getElement } from './index-BnKuq1L7.js';
2
2
  import { _ as _t } from './text-DsO1BTml.js';
3
- import './badge-notification-shape.enum-CKoZU0-H.js';
3
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
4
4
  import { C as CalendarDatepickerValidation } from './typography-variation.enum-4smNltRI.js';
5
5
  import './badge-status-variation.enum-C0A-p3cU.js';
6
6
  import './button-variation.enum-BMQm4N5I.js';
7
7
  import './button-type.enum-DShzaNrQ.js';
8
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
9
8
  import './bar-chart-variation.enum-DPeoHh1J.js';
10
9
  import './code-example-variation.enum-DGI7Jkg2.js';
11
10
  import './code-variation.enum-qc6KRZue.js';
@@ -8,7 +8,7 @@ import { i as isValid } from './index-BixPaBHw.js';
8
8
  import { i as isBefore, a as isAfter } from './index-BsIL3T_0.js';
9
9
  import './detectClosest.util-DwBvm-Nc.js';
10
10
 
11
- const calendarCss = () => `.sc-digi-calendar-h{--digi--calendar--display:inline-block;--digi--calendar--header--font-family:var(--digi--global--typography--font-family--default);--digi--calendar--header--font-weight:var(--digi--global--typography--font-weight--semibold);--digi--calendar--header--display:flex;--digi--calendar--header--align-items:center;--digi--calendar--header--justify-content:space-between;--digi--calendar--header--text-align:center;--digi--calendar--header--button--padding:var(--digi--gutter--medium) var(--digi--gutter--largest);--digi--calendar--header--button--background:transparent;--digi--calendar--header--button--box-shadow:none;--digi--calendar--header--button--background--hover:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--table--border-spacing:0;--digi--calendar--table--border-collapse:collapse;--digi--calendar--table--font-family:var(--digi--global--typography--font-family--default);--digi--calendar--table--font-weight:var(--digi--global--typography--font-weight--semibold);--digi--calendar--table-header--padding:var(--digi--gutter--larger) 0;--digi--calendar--table-header--font-weight-normal:var(--digi--typography--body--font-weight--desktop);--digi--calendar--date--border-color:none;--digi--calendar--date--box-shadow:none;--digi--calendar--date--background-color:var(--digi--color--background--interactive--default--secondary);--digi--calendar--date--background-color--hover:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--date--padding:var(--digi--gutter--large);--digi--calendar--date--color:var(--digi--color--text--primary);--digi--calendar--date--focused--background-color:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--date--today--circle-border:2px solid var(--digi--color--marking--indication--secondary);--digi--calendar--date--today--circle-margin:10%;--digi--calendar--date--selected--color:var(--digi--color--text--interactive--secondary);--digi--calendar--date--selected--background-color:var(--digi--color--background--interactive--selected--primary);--digi--calendar--date--not-selectable-strike--color:var(--digi--color--marking--indication--tertiary);--digi--calendar--week--font-style:italic;--digi--calendar--week--font-size:var(--digi--global--typography--font-size--small);--digi--calendar--week--border-color:var(--digi--color--divider--primary);--digi--calendar--week--border-width:var(--digi--border-width--primary)}.sc-digi-calendar-h .digi-calendar.sc-digi-calendar{display:var(--digi--calendar--display);background:var(--digi--calendar--header--button--background);padding:0px 1px 3px 1px;overflow:hidden;max-width:23.4375rem}.sc-digi-calendar-h .digi-calendar--hide.sc-digi-calendar{--digi--calendar--display:none}.sc-digi-calendar-h .digi-calendar__header.sc-digi-calendar{display:var(--digi--calendar--header--display);align-items:var(--digi--calendar--header--align-items);justify-content:var(--digi--calendar--header--justify-content);text-align:var(--digi--calendar--header--text-align);font-size:var(--digi--global--typography--font-size--base);font-family:var(--digi--calendar--header--font-family);font-weight:var(--digi--calendar--header--font-weight)}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar{display:inherit;justify-content:center;margin:0 auto}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar:first-child{margin-right:var(--digi--padding--smaller)}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar:last-child{width:5rem}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar select.sc-digi-calendar{padding-inline-end:2rem}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar{flex:auto;display:inherit;align-items:inherit;justify-content:inherit}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-name.sc-digi-calendar{padding-inline:var(--digi--padding--smaller)}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar{font-family:inherit;font-size:inherit;font-weight:inherit;color:var(--digi--calendar--date--color);display:flex;align-items:center;background:var(--digi--calendar--header--button--background);border:var(--digi--calendar--date--box-shadow);padding:var(--digi--calendar--header--button--padding)}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:last-child{border-radius:0 4px 0 0}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:first-child{border-radius:4px 0 0 0}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:focus-visible:not(.digi-calendar__date--not-selectable),.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:active:not(.digi-calendar__date--not-selectable){--digi--calendar--header--button--background:var( --digi--calendar--header--button--background--hover );text-decoration:underline;cursor:pointer}@media (any-hover: hover){.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable){--digi--calendar--header--button--background:var( --digi--calendar--header--button--background--hover );text-decoration:underline;cursor:pointer}}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-h .digi-calendar__table.sc-digi-calendar{border-collapse:var(--digi--calendar--table--border-collapse);border-spacing:var(--digi--calendar--table--border-spacing);font-family:var(--digi--calendar--table--font-family);table-layout:fixed;margin-bottom:var(--digi--margin--medium)}.sc-digi-calendar-h .digi-calendar__table-header-week.sc-digi-calendar{font-style:italic;padding:var(--digi--calendar--table-header--padding);font-weight:var(--digi--calendar--table-header--font-weight-normal);width:50px}.sc-digi-calendar-h .digi-calendar__table-header.sc-digi-calendar{padding:var(--digi--calendar--table-header--padding);font-weight:var(--digi--calendar--table--font-weight);width:46px}.sc-digi-calendar-h .digi-calendar__td-week.sc-digi-calendar{border-right:var(--digi--calendar--week--border-width) solid var(--digi--calendar--week--border-color)}.sc-digi-calendar-h .digi-calendar__td.sc-digi-calendar{text-align:right}.sc-digi-calendar-h .digi-calendar__date--week-number.sc-digi-calendar{font-style:var(--digi--calendar--week--font-style);font-size:var(--digi--calendar--week--font-size);display:table-cell;text-align:center}.sc-digi-calendar-h .digi-calendar__date--week-number.sc-digi-calendar:hover{cursor:default}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar{position:relative;padding:var(--digi--calendar--date--padding);color:var(--digi--calendar--date--color);background-color:var(--digi--calendar--date--background-color);border-color:var(--digi--calendar--date--border-color);border-radius:var(--digi--border-radius--secondary);font-family:inherit;font-size:inherit;font-weight:inherit;text-align:center;border:none;width:44px;height:44px}.sc-digi-calendar-h .digi-calendar__date--disabled.sc-digi-calendar{--digi--calendar--date--color:transparent;pointer-events:none}.sc-digi-calendar-h .digi-calendar__date--today.sc-digi-calendar{position:relative}.sc-digi-calendar-h .digi-calendar__date--today.sc-digi-calendar::after{display:block;content:" ";position:absolute;top:var(--digi--calendar--date--today--circle-margin);bottom:var(--digi--calendar--date--today--circle-margin);left:var(--digi--calendar--date--today--circle-margin);right:var(--digi--calendar--date--today--circle-margin);border:var(--digi--calendar--date--today--circle-border);border-radius:50%}.sc-digi-calendar-h .digi-calendar__date--today.digi-calendar__date--selected.sc-digi-calendar::after{border-color:var(--digi--color--icon--secondary)}@media (any-hover: hover){.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable){cursor:pointer}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable):not(.digi-calendar__date--selected){--digi--calendar--date--box-shadow:var(--digi--calendar--date--box-shadow--hover);--digi--calendar--date--background-color:var(--digi--calendar--date--background-color--hover)}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable) span.sc-digi-calendar{text-decoration:underline}}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar{--digi--calendar--date--background-color:var(--digi--calendar--date--selected--background-color);--digi--calendar--date--color:var(--digi--calendar--date--selected--color)}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:hover{--digi--calendar--date--background-color:var(--digi--calendar--date--selected--background-color)}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:hover span.sc-digi-calendar{text-decoration:none}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-h .digi-calendar__date--not-selectable.sc-digi-calendar{cursor:not-allowed}.sc-digi-calendar-h .digi-calendar__date--not-selectable.sc-digi-calendar::after{display:block;content:" ";width:0px;height:100%;border:1px solid #757575;transform:rotate(-45deg);position:absolute;top:0%;left:50%}.sc-digi-calendar-h .digi-calendar__date--focused.sc-digi-calendar:focus-visible:not(.digi-calendar__date--selected):not(.digi-calendar__date--not-selectable){--digi--calendar--date--background-color:var(--digi--calendar--date--focused--background-color);outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-s digi-form-label{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}`;
11
+ const calendarCss = () => `.sc-digi-calendar-h{--digi--calendar--display:inline-block;--digi--calendar--header--font-family:var(--digi--global--typography--font-family--default);--digi--calendar--header--font-weight:var(--digi--global--typography--font-weight--semibold);--digi--calendar--header--display:flex;--digi--calendar--header--align-items:center;--digi--calendar--header--justify-content:space-between;--digi--calendar--header--text-align:center;--digi--calendar--header--button--padding:var(--digi--gutter--medium) var(--digi--gutter--largest);--digi--calendar--header--button--background:transparent;--digi--calendar--header--button--box-shadow:none;--digi--calendar--header--button--background--hover:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--table--border-spacing:0;--digi--calendar--table--border-collapse:collapse;--digi--calendar--table--font-family:var(--digi--global--typography--font-family--default);--digi--calendar--table--font-weight:var(--digi--global--typography--font-weight--semibold);--digi--calendar--table-header--padding:var(--digi--gutter--larger) 0;--digi--calendar--table-header--font-weight-normal:var(--digi--typography--body--font-weight--desktop);--digi--calendar--date--border-color:none;--digi--calendar--date--box-shadow:none;--digi--calendar--date--background-color:var(--digi--color--background--interactive--default--secondary);--digi--calendar--date--background-color--hover:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--date--padding:var(--digi--gutter--large);--digi--calendar--date--color:var(--digi--color--text--primary);--digi--calendar--date--focused--background-color:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--date--today--circle-border:2px solid var(--digi--color--marking--indication--secondary);--digi--calendar--date--today--circle-margin:10%;--digi--calendar--date--selected--color:var(--digi--color--text--interactive--secondary);--digi--calendar--date--selected--background-color:var(--digi--color--background--interactive--selected--primary);--digi--calendar--date--not-selectable-strike--color:var(--digi--color--marking--indication--tertiary);--digi--calendar--week--font-style:italic;--digi--calendar--week--font-size:var(--digi--global--typography--font-size--small);--digi--calendar--week--border-color:var(--digi--color--divider--primary);--digi--calendar--week--border-width:var(--digi--border-width--primary)}.sc-digi-calendar-h .digi-calendar.sc-digi-calendar{display:var(--digi--calendar--display);background:var(--digi--calendar--header--button--background);padding:0px 1px 3px 1px;overflow:hidden;max-width:23.4375rem}.sc-digi-calendar-h .digi-calendar--hide.sc-digi-calendar{--digi--calendar--display:none}.sc-digi-calendar-h .digi-calendar__header.sc-digi-calendar{display:var(--digi--calendar--header--display);align-items:var(--digi--calendar--header--align-items);justify-content:var(--digi--calendar--header--justify-content);text-align:var(--digi--calendar--header--text-align);font-size:var(--digi--global--typography--font-size--base);font-family:var(--digi--calendar--header--font-family);font-weight:var(--digi--calendar--header--font-weight)}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar{display:inherit;justify-content:center;margin:0 auto}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar:first-child{margin-right:var(--digi--padding--smaller)}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar:last-child{width:5rem}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar select.sc-digi-calendar{padding-inline-end:2rem}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar{flex:auto;display:inherit;align-items:inherit;justify-content:inherit}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-name.sc-digi-calendar{padding-inline:var(--digi--padding--smaller)}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar{font-family:inherit;font-size:inherit;font-weight:inherit;color:var(--digi--calendar--date--color);display:flex;align-items:center;background:var(--digi--calendar--header--button--background);border:var(--digi--calendar--date--box-shadow);padding:var(--digi--calendar--header--button--padding)}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:last-child{border-radius:0 4px 0 0}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:first-child{border-radius:4px 0 0 0}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:focus-visible:not(.digi-calendar__date--not-selectable),.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:active:not(.digi-calendar__date--not-selectable){--digi--calendar--header--button--background:var(--digi--calendar--header--button--background--hover);text-decoration:underline;cursor:pointer}@media (any-hover: hover){.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable){--digi--calendar--header--button--background:var(--digi--calendar--header--button--background--hover);text-decoration:underline;cursor:pointer}}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-h .digi-calendar__table.sc-digi-calendar{border-collapse:var(--digi--calendar--table--border-collapse);border-spacing:var(--digi--calendar--table--border-spacing);font-family:var(--digi--calendar--table--font-family);table-layout:fixed;margin-bottom:var(--digi--margin--medium)}.sc-digi-calendar-h .digi-calendar__table.sc-digi-calendar th.sc-digi-calendar{text-align:center}.sc-digi-calendar-h .digi-calendar__table-header-week.sc-digi-calendar{font-style:italic;padding:var(--digi--calendar--table-header--padding);font-weight:var(--digi--calendar--table-header--font-weight-normal);width:50px}.sc-digi-calendar-h .digi-calendar__table-header.sc-digi-calendar{padding:var(--digi--calendar--table-header--padding);font-weight:var(--digi--calendar--table--font-weight);width:46px}.sc-digi-calendar-h .digi-calendar__td-week.sc-digi-calendar{border-right:var(--digi--calendar--week--border-width) solid var(--digi--calendar--week--border-color)}.sc-digi-calendar-h .digi-calendar__td.sc-digi-calendar{text-align:right}.sc-digi-calendar-h .digi-calendar__date--week-number.sc-digi-calendar{font-style:var(--digi--calendar--week--font-style);font-size:var(--digi--calendar--week--font-size);display:table-cell;text-align:center}.sc-digi-calendar-h .digi-calendar__date--week-number.sc-digi-calendar:hover{cursor:default}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar{position:relative;padding:var(--digi--calendar--date--padding);color:var(--digi--calendar--date--color);background-color:var(--digi--calendar--date--background-color);border-color:var(--digi--calendar--date--border-color);border-radius:var(--digi--border-radius--secondary);font-family:inherit;font-size:inherit;font-weight:inherit;text-align:center;border:none;width:44px;height:44px}.sc-digi-calendar-h .digi-calendar__date--disabled.sc-digi-calendar{--digi--calendar--date--color:transparent;pointer-events:none}.sc-digi-calendar-h .digi-calendar__date--today.sc-digi-calendar{position:relative}.sc-digi-calendar-h .digi-calendar__date--today.sc-digi-calendar::after{display:block;content:" ";position:absolute;top:var(--digi--calendar--date--today--circle-margin);bottom:var(--digi--calendar--date--today--circle-margin);left:var(--digi--calendar--date--today--circle-margin);right:var(--digi--calendar--date--today--circle-margin);border:var(--digi--calendar--date--today--circle-border);border-radius:50%}.sc-digi-calendar-h .digi-calendar__date--today.digi-calendar__date--selected.sc-digi-calendar::after{border-color:var(--digi--color--icon--secondary)}@media (any-hover: hover){.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable){cursor:pointer}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable):not(.digi-calendar__date--selected){--digi--calendar--date--box-shadow:var(--digi--calendar--date--box-shadow--hover);--digi--calendar--date--background-color:var(--digi--calendar--date--background-color--hover)}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable) span.sc-digi-calendar{text-decoration:underline}}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar{--digi--calendar--date--background-color:var(--digi--calendar--date--selected--background-color);--digi--calendar--date--color:var(--digi--calendar--date--selected--color)}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:hover{--digi--calendar--date--background-color:var(--digi--calendar--date--selected--background-color)}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:hover span.sc-digi-calendar{text-decoration:none}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-h .digi-calendar__date--not-selectable.sc-digi-calendar{cursor:not-allowed}.sc-digi-calendar-h .digi-calendar__date--not-selectable.sc-digi-calendar::after{display:block;content:" ";width:0px;height:100%;border:1px solid #757575;transform:rotate(-45deg);position:absolute;top:0%;left:50%}.sc-digi-calendar-h .digi-calendar__date--focused.sc-digi-calendar:focus-visible:not(.digi-calendar__date--selected):not(.digi-calendar__date--not-selectable){--digi--calendar--date--background-color:var(--digi--calendar--date--focused--background-color);outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-s digi-form-label{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}`;
12
12
 
13
13
  const Calendar = class {
14
14
  constructor(hostRef) {
@@ -2,6 +2,7 @@ import { r as registerInstance, h, d as getElement } from './index-BnKuq1L7.js';
2
2
  import { _ as _t } from './text-DsO1BTml.js';
3
3
  import { s as select, e as dispatch, r as range, a as axisLeft, f as formatLocale, p as polyInOut, b as axisBottom, l as linear, m as max, c as min, o as ordinal, g as interpolate, d as linear$1 } from './transform-lPbx4RHH.js';
4
4
  import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
5
+ import { l as logger } from './logger.util-DdB9j8uV.js';
5
6
 
6
7
  function sourceEvent(event) {
7
8
  let sourceEvent;
@@ -1581,14 +1582,14 @@ const ChartLine = class {
1581
1582
  });
1582
1583
  };
1583
1584
  // Removes resize observer for chart and inits table
1584
- this.activateTable = (event) => {
1585
+ this.activateTable = () => {
1585
1586
  this.closeTooltip();
1586
1587
  this.lineChartObserver.disconnect();
1587
1588
  this.tableObserver.observe(this._chartDiv);
1588
1589
  this._status.innerHTML = '<p>Visas som tabell</p>';
1589
1590
  select(this._host).select('.tableButton').style('display', 'none');
1590
1591
  select(this._host).select('.chartButton').style('display', null);
1591
- event.target.nextSibling.lastChild.focus();
1592
+ this.focusHostButton('.chartButton');
1592
1593
  const duration = 150;
1593
1594
  this._svg
1594
1595
  .attr('opacity', 1)
@@ -1619,12 +1620,12 @@ const ChartLine = class {
1619
1620
  this.setTableDimensions();
1620
1621
  };
1621
1622
  // Removes observer and calls init functions for line chart
1622
- this.reInitChart = (event) => {
1623
+ this.reInitChart = () => {
1623
1624
  this.tableObserver.disconnect();
1624
1625
  this._status.innerHTML = '<p>Visas som diagram</p>';
1625
1626
  select(this._host).select('.tableButton').style('display', null);
1626
1627
  select(this._host).select('.chartButton').style('display', 'none');
1627
- event.target.previousSibling.lastChild.focus();
1628
+ this.focusHostButton('.tableButton');
1628
1629
  const table = select(this._tableDiv);
1629
1630
  table
1630
1631
  .style('opacity', 1)
@@ -1651,15 +1652,40 @@ const ChartLine = class {
1651
1652
  }
1652
1653
  afChartDataUpdate() {
1653
1654
  const data = this.afChartData;
1654
- if (typeof data === 'object') {
1655
- this._chartData = Object.assign({}, data);
1655
+ // Angular/React can connect the element before afChartData is set.
1656
+ if (data == null || data === '') {
1657
+ return;
1658
+ }
1659
+ try {
1660
+ if (typeof data === 'object') {
1661
+ this._chartData = Object.assign({}, data);
1662
+ }
1663
+ else if (typeof data === 'string') {
1664
+ this._chartData = JSON.parse(data);
1665
+ }
1666
+ else {
1667
+ return;
1668
+ }
1669
+ }
1670
+ catch (_a) {
1671
+ logger.warn(`Invalid JSON in "af-chart-data" attribute`, this.element);
1656
1672
  return;
1657
1673
  }
1658
- this._chartData = JSON.parse(data);
1659
1674
  // Making deep copy of this
1660
1675
  if (this._chartData.data)
1661
1676
  this._coreSeries = JSON.parse(JSON.stringify(this._chartData.data.series));
1662
1677
  }
1678
+ hasChartData() {
1679
+ return !!this._chartData && Object.keys(this._chartData).length > 0;
1680
+ }
1681
+ focusHostButton(selector) {
1682
+ var _a, _b;
1683
+ const host = this._host;
1684
+ const button = (_b = (_a = host === null || host === void 0 ? void 0 : host.querySelector(selector)) === null || _a === void 0 ? void 0 : _a.querySelector('button')) !== null && _b !== void 0 ? _b : host === null || host === void 0 ? void 0 : host.querySelector(selector);
1685
+ if (button && typeof button.focus === 'function') {
1686
+ button.focus();
1687
+ }
1688
+ }
1663
1689
  initSvg() {
1664
1690
  this.margin.bottom =
1665
1691
  Number(window
@@ -2123,9 +2149,24 @@ const ChartLine = class {
2123
2149
  }
2124
2150
  componentWillLoad() {
2125
2151
  this.afChartDataUpdate();
2152
+ // Angular attaches the host first and binds `[afChartData]` on the next
2153
+ // frame (Stencil 4.36+). @Watch skips that first assignment, so if chart
2154
+ // data is not here yet, wait one frame. React/vanilla that already set
2155
+ // the prop skip the delay.
2156
+ if (!this.hasChartData()) {
2157
+ return new Promise((resolve) => {
2158
+ requestAnimationFrame(() => {
2159
+ this.afChartDataUpdate();
2160
+ resolve();
2161
+ });
2162
+ });
2163
+ }
2126
2164
  }
2127
2165
  componentDidLoad() {
2128
- if (Object.keys(this._chartData).length === 0)
2166
+ if (!this.hasChartData()) {
2167
+ this.afChartDataUpdate();
2168
+ }
2169
+ if (!this.hasChartData())
2129
2170
  return this.initEmpty();
2130
2171
  // clearing selection
2131
2172
  this._selectedLines = [];
@@ -2141,7 +2182,7 @@ const ChartLine = class {
2141
2182
  this._prevHeight = select(this._titleDiv).style('height');
2142
2183
  }
2143
2184
  componentDidUpdate() {
2144
- if (Object.keys(this._chartData).length === 0)
2185
+ if (!this.hasChartData())
2145
2186
  return this.loadingState();
2146
2187
  // clearing selection
2147
2188
  this._selectedLines = [];
@@ -2298,11 +2339,13 @@ const ChartLine = class {
2298
2339
  }
2299
2340
  render() {
2300
2341
  let heading = '';
2301
- if (!this._chartData.subTitle)
2302
- heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}>`;
2303
- else
2304
- heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}><p>${this._chartData.subTitle}</p>`;
2305
- return (h("host", { key: 'a21c09ee91ccabf90f91d2344d301d26710f9a60', ref: (el) => (this._host = el) }, h("div", { key: 'c97af6a0bbc28675a19c843a3c355b35397e5804', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: '76085c6924fd317d4a281e93ca4623b85f0fb867', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '241e30b3094e8eea86c7c24bb2a90f67ea04ef6f', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '5cc0d03d40d076481d14d0478390b131cdaa61f7', slot: "icon" }), "Visa tabell"), h("digi-button", { key: '241d3e97b9a21f556b3e46cebc63c77ce106d26c', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: 'f0a5c78bc5e04db994559f2ce1a13c0e7285c36d', slot: "icon" }), "Visa diagram"), h("div", { key: 'f7ebab0f90d1a9f9a306470c93ccaaaf0461a9a7', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: '75672c02d61a14741348dc183782df71f3a4db19', class: "chartTooltip", id: this.afId }, h("div", { key: 'b4e03381d825d68af2bdbf859458896c639b6559', class: "tooltipHead" }, h("digi-icon-x", { key: '1301ab00ff3818e0940e69f17aa09b296c04a86c', class: "close" }), ' '), h("div", { key: 'eb01d362db4495c0a3d4396ad4c71c2a952114ad', class: "tooltipBody" })), h("div", { key: 'accd6776d3db14c662ff84b2e826f6cf713ff38d', class: "chart", ref: (el) => (this._chartDiv = el) }), h("div", { key: '507dfba00c88d5b371fd8304053b9b7762506d25', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: 'cb3fc091c6a557bfd62e8f7d59863e973da0ee53', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
2342
+ if (this._chartData) {
2343
+ if (!this._chartData.subTitle)
2344
+ heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}>`;
2345
+ else
2346
+ heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}><p>${this._chartData.subTitle}</p>`;
2347
+ }
2348
+ return (h("host", { key: '93603df9b78fcce8b5735b4a874f879cf7b2326e', ref: (el) => (this._host = el) }, h("div", { key: '094a790864b72bbb9a802b461db06ce312c627c8', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: '5f4bd51fdfef816b0e127d1177c60f8310952173', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '8ae72950c5cf052ed71c2ba4e91b254b8d36cfd0', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '750f1b621eb0a1a54ec810aa63624237bd98f9ea', slot: "icon" }), "Visa tabell"), h("digi-button", { key: '1cf33daaaa8adf9c5352286d6172d7c258098c29', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: '9dce5df1a96d4b818597854f7ee238fefda2c686', slot: "icon" }), "Visa diagram"), h("div", { key: '204f5824b2f34b3a1a1401ed4434e1fcb16a2549', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: 'b164f59f1c741db5493af57510eab2987cabefc6', class: "chartTooltip", id: this.afId }, h("div", { key: 'e84bf8a85a745977006d50f296d1afee2ee35698', class: "tooltipHead" }, h("digi-icon-x", { key: '77bcd0342c828dbcbe020a9ffefe4ae6f3086572', class: "close" }), ' '), h("div", { key: '330f69a58082f72b528095ef49a2371fc8b0d8e5', class: "tooltipBody" })), h("div", { key: '62eb27ac8f184476d50332344711ca381e8adf59', class: "chart", ref: (el) => (this._chartDiv = el) }), h("div", { key: 'ad70790d3a2fd5851c4351e41f2436a34169a819', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: '30d4791a9b808555f03d1830aaec0221c1bc3b37', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
2306
2349
  }
2307
2350
  get element() { return getElement(this); }
2308
2351
  static get watchers() { return {
@@ -2,11 +2,10 @@ import { r as registerInstance, h, c as createEvent, a as Host, d as getElement
2
2
  import { C as CodeBlockVariation } from './code-example-variation.enum-DGI7Jkg2.js';
3
3
  import { a as CodeBlockLanguage, e as FormFieldsetValidation, h as FormRadiobuttonVariation, f as FormRadiobuttonLayout, g as FormRadiobuttonValidation } from './typography-variation.enum-4smNltRI.js';
4
4
  import { P as Prism } from './prism-git-CdcGvoTs.js';
5
- import './badge-notification-shape.enum-CKoZU0-H.js';
5
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
6
6
  import './badge-status-variation.enum-C0A-p3cU.js';
7
7
  import { B as ButtonSize, a as ButtonVariation } from './button-variation.enum-BMQm4N5I.js';
8
8
  import './button-type.enum-DShzaNrQ.js';
9
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
10
9
  import './bar-chart-variation.enum-DPeoHh1J.js';
11
10
  import './code-variation.enum-qc6KRZue.js';
12
11
  import './expandable-accordion-header-level.enum-DwNlf6Sh.js';
@@ -1,11 +1,10 @@
1
1
  import { r as registerInstance, c as createEvent, h, a as Host, d as getElement } from './index-BnKuq1L7.js';
2
2
  import { c as DialogVariation, b as DialogSize, D as DialogHeadingLevel } from './typography-variation.enum-4smNltRI.js';
3
3
  import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
4
- import './badge-notification-shape.enum-CKoZU0-H.js';
4
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
5
5
  import './badge-status-variation.enum-C0A-p3cU.js';
6
6
  import { B as ButtonSize, a as ButtonVariation } from './button-variation.enum-BMQm4N5I.js';
7
7
  import './button-type.enum-DShzaNrQ.js';
8
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
9
8
  import './bar-chart-variation.enum-DPeoHh1J.js';
10
9
  import './code-example-variation.enum-DGI7Jkg2.js';
11
10
  import './code-variation.enum-qc6KRZue.js';
@@ -1,10 +1,9 @@
1
1
  import { r as registerInstance, h, a as Host, d as getElement } from './index-BnKuq1L7.js';
2
2
  import { F as FooterVariation } from './typography-variation.enum-4smNltRI.js';
3
- import './badge-notification-shape.enum-CKoZU0-H.js';
3
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
4
4
  import './badge-status-variation.enum-C0A-p3cU.js';
5
5
  import './button-variation.enum-BMQm4N5I.js';
6
6
  import './button-type.enum-DShzaNrQ.js';
7
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
8
7
  import './bar-chart-variation.enum-DPeoHh1J.js';
9
8
  import './code-example-variation.enum-DGI7Jkg2.js';
10
9
  import './code-variation.enum-qc6KRZue.js';
@@ -1,11 +1,10 @@
1
1
  import { r as registerInstance, c as createEvent, h, d as getElement } from './index-BnKuq1L7.js';
2
2
  import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
3
3
  import { d as FormErrorListHeadingLevel, q as NotificationAlertVariation, u as TypographyVariation } from './typography-variation.enum-4smNltRI.js';
4
- import './badge-notification-shape.enum-CKoZU0-H.js';
4
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
5
5
  import './badge-status-variation.enum-C0A-p3cU.js';
6
6
  import './button-variation.enum-BMQm4N5I.js';
7
7
  import './button-type.enum-DShzaNrQ.js';
8
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
9
8
  import './bar-chart-variation.enum-DPeoHh1J.js';
10
9
  import './code-example-variation.enum-DGI7Jkg2.js';
11
10
  import './code-variation.enum-qc6KRZue.js';
@@ -1,10 +1,9 @@
1
1
  import { r as registerInstance, h, d as getElement } from './index-BnKuq1L7.js';
2
2
  import { k as FormReceiptVariation, j as FormReceiptType, i as FormReceiptHeadingLevel } from './typography-variation.enum-4smNltRI.js';
3
- import './badge-notification-shape.enum-CKoZU0-H.js';
3
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
4
4
  import './badge-status-variation.enum-C0A-p3cU.js';
5
5
  import './button-variation.enum-BMQm4N5I.js';
6
6
  import './button-type.enum-DShzaNrQ.js';
7
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
8
7
  import './bar-chart-variation.enum-DPeoHh1J.js';
9
8
  import './code-example-variation.enum-DGI7Jkg2.js';
10
9
  import './code-variation.enum-qc6KRZue.js';
@@ -4,12 +4,11 @@ import { l as logger } from './logger.util-DdB9j8uV.js';
4
4
  import { d as detectClickOutside } from './detectClickOutside.util-ROzp1Ej2.js';
5
5
  import { d as detectFocusOutside } from './detectFocusOutside.util-aFLLVVle.js';
6
6
  import { _ as _t } from './text-DsO1BTml.js';
7
- import './badge-notification-shape.enum-CKoZU0-H.js';
7
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
8
8
  import { l as FormSelectFilterValidation } from './typography-variation.enum-4smNltRI.js';
9
9
  import './badge-status-variation.enum-C0A-p3cU.js';
10
10
  import './button-variation.enum-BMQm4N5I.js';
11
11
  import './button-type.enum-DShzaNrQ.js';
12
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
13
12
  import './bar-chart-variation.enum-DPeoHh1J.js';
14
13
  import './code-example-variation.enum-DGI7Jkg2.js';
15
14
  import './code-variation.enum-qc6KRZue.js';
@@ -1,10 +1,9 @@
1
1
  import { r as registerInstance, c as createEvent, h, d as getElement } from './index-BnKuq1L7.js';
2
- import './badge-notification-shape.enum-CKoZU0-H.js';
2
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
3
3
  import { H as HeaderCenterContentWidth } from './typography-variation.enum-4smNltRI.js';
4
4
  import './badge-status-variation.enum-C0A-p3cU.js';
5
5
  import './button-variation.enum-BMQm4N5I.js';
6
6
  import './button-type.enum-DShzaNrQ.js';
7
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
8
7
  import './bar-chart-variation.enum-DPeoHh1J.js';
9
8
  import './code-example-variation.enum-DGI7Jkg2.js';
10
9
  import './code-variation.enum-qc6KRZue.js';
@@ -1,10 +1,9 @@
1
1
  import { r as registerInstance, h, d as getElement } from './index-BnKuq1L7.js';
2
- import './badge-notification-shape.enum-CKoZU0-H.js';
2
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
3
3
  import { H as HeaderCenterContentWidth } from './typography-variation.enum-4smNltRI.js';
4
4
  import './badge-status-variation.enum-C0A-p3cU.js';
5
5
  import './button-variation.enum-BMQm4N5I.js';
6
6
  import './button-type.enum-DShzaNrQ.js';
7
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
8
7
  import './bar-chart-variation.enum-DPeoHh1J.js';
9
8
  import './code-example-variation.enum-DGI7Jkg2.js';
10
9
  import './code-variation.enum-qc6KRZue.js';
@@ -1,11 +1,10 @@
1
1
  import { r as registerInstance, c as createEvent, h } from './index-BnKuq1L7.js';
2
2
  import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
3
- import './badge-notification-shape.enum-CKoZU0-H.js';
3
+ import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
4
4
  import './typography-variation.enum-4smNltRI.js';
5
5
  import './badge-status-variation.enum-C0A-p3cU.js';
6
6
  import { a as ButtonVariation } from './button-variation.enum-BMQm4N5I.js';
7
7
  import './button-type.enum-DShzaNrQ.js';
8
- import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
9
8
  import './bar-chart-variation.enum-DPeoHh1J.js';
10
9
  import './code-example-variation.enum-DGI7Jkg2.js';
11
10
  import './code-variation.enum-qc6KRZue.js';
@@ -76,16 +76,28 @@ const NavigationVerticalMenu = class {
76
76
  }
77
77
  }
78
78
  componentWillLoad() {
79
- this.getListItems();
80
- this.initNav();
81
- this.setLevelClass();
79
+ this.syncNav();
80
+ // Angular attaches the host first and slots children on the next frame
81
+ // (Stencil 4.36+). React/vanilla that already have slotted nodes skip
82
+ // the delay. Do not warn here — Angular/React may still be projecting.
83
+ if (!this.hostElement.children.length) {
84
+ return new Promise((resolve) => {
85
+ requestAnimationFrame(() => {
86
+ this.syncNav();
87
+ resolve();
88
+ });
89
+ });
90
+ }
82
91
  }
83
92
  componentDidLoad() {
84
93
  this.initCurrentActiveLevel();
85
94
  this.afOnReady.emit();
86
95
  }
87
96
  componentWillUpdate() {
88
- this.getListItems();
97
+ this.syncNav();
98
+ }
99
+ syncNav(options) {
100
+ this.getListItems(options);
89
101
  this.initNav();
90
102
  this.setLevelClass();
91
103
  }
@@ -135,12 +147,12 @@ const NavigationVerticalMenu = class {
135
147
  }
136
148
  }
137
149
  setLevelClass() {
138
- this.hostElement
139
- .querySelector('ul')
140
- .classList.remove('primary', 'secondary');
141
- this.hostElement
142
- .querySelector('ul')
143
- .classList.add('digi-navigation-vertical-menu__list--root', this.afVariation);
150
+ const rootList = this.hostElement.querySelector('ul');
151
+ if (!rootList) {
152
+ return;
153
+ }
154
+ rootList.classList.remove('primary', 'secondary');
155
+ rootList.classList.add('digi-navigation-vertical-menu__list--root', this.afVariation);
144
156
  }
145
157
  initNav() {
146
158
  const $ul = this.hostElement.querySelectorAll('ul');
@@ -153,10 +165,12 @@ const NavigationVerticalMenu = class {
153
165
  this.initNav();
154
166
  this.setClasses(e);
155
167
  }
156
- getListItems() {
168
+ getListItems(options) {
157
169
  const menuItems = this.hostElement.children;
158
170
  if (!menuItems || menuItems.length <= 0) {
159
- logger.warn(`The slot contains no children elements.`, this.hostElement);
171
+ if (options === null || options === void 0 ? void 0 : options.warnIfEmpty) {
172
+ logger.warn(`The slot contains no children elements.`, this.hostElement);
173
+ }
160
174
  return;
161
175
  }
162
176
  this.listItems = [...Array.from(menuItems)].map((filter) => {
@@ -175,7 +189,7 @@ const NavigationVerticalMenu = class {
175
189
  };
176
190
  }
177
191
  render() {
178
- return (h("nav", { key: '0c7b96501a70d813b8d8f5b8014dc420d472f4a9', class: Object.assign({ 'digi-navigation-vertical-menu': true }, this.cssModifiers), id: this.afId, "aria-label": this.afAriaLabel }, h("slot", { key: '2b5d92cada1cde5bb5155257be77a584c2e708ec' })));
192
+ return (h("nav", { key: 'df2239de80363247c33eadf6995331a74a40966f', class: Object.assign({ 'digi-navigation-vertical-menu': true }, this.cssModifiers), id: this.afId, "aria-label": this.afAriaLabel }, h("slot", { key: 'dc2e22c2cfd00786964855ea3bc2b7271879510c', onSlotchange: () => this.syncNav() })));
179
193
  }
180
194
  get hostElement() { return getElement(this); }
181
195
  };