@designsystem-se/af 35.4.1-beta.1 → 35.4.1-beta.2

package/components/digi-bar-chart.js

@@ -4,12 +4,12 @@ import { _ as _t } from './p-08cf2c0e.js';
 import { r as randomIdGenerator } from './p-ffe5c0e8.js';
 import { B as BarChartVariation } from './p-dcdffb3c.js';
 import { d as defineCustomElement$8 } from './p-e8fc33ed.js';
-import { d as defineCustomElement$7 } from './p-2e15f1c6.js';
-import { d as defineCustomElement$6 } from './p-346262e9.js';
-import { d as defineCustomElement$5 } from './p-3a53c26b.js';
-import { d as defineCustomElement$4 } from './p-70a1e53a.js';
-import { d as defineCustomElement$3 } from './p-5e2cf317.js';
-import { d as defineCustomElement$2 } from './p-204a12b0.js';
+import { d as defineCustomElement$7 } from './p-4241698a.js';
+import { d as defineCustomElement$6 } from './p-5ef44852.js';
+import { d as defineCustomElement$5 } from './p-3c9cea93.js';
+import { d as defineCustomElement$4 } from './p-94603530.js';
+import { d as defineCustomElement$3 } from './p-cc5bd9f9.js';
+import { d as defineCustomElement$2 } from './p-cfb33ac7.js';
 
 function band() {
   var scale = ordinal().unknown(undefined),
@@ -91,7 +91,7 @@ function band() {
   return initRange.apply(rescale(), arguments);
 }
 
-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;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 .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}.sc-digi-bar-chart-h .buttonWrapper.sc-digi-bar-chart{--digi--button--padding--medium:4px 4px 0.8125rem 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 .close.sc-digi-bar-chart{display:inline-block;vertical-align:top;--digi--color--icon--primary:#333;cursor:pointer}.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:100%;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}";
+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;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 .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}.sc-digi-bar-chart-h .buttonWrapper.sc-digi-bar-chart{--digi--button--padding--medium:4px 4px 0.8125rem 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 .close.sc-digi-bar-chart{display:inline-block;vertical-align:top;--digi--color--icon--primary:#333;cursor:pointer}.sc-digi-bar-chart-h .close.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}";
 const DigiBarChartStyle0 = barChartCss;
 
 const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
@@ -137,16 +137,78 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
                 .transition('color')
                 .duration(150)
                 .attr('fill', (barData) => {
+                var _a;
                 if (barData.serie === serie)
                     return this.colorFunction(barData.serie);
-                else
+                else {
+                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(barData.serie) > 0) {
+                        return 'url(#prognosisInactive)';
+                    }
                     return this.evalColorVar('--digi--color--background--secondary-accent');
+                }
             });
             select(this.legendDiv).selectAll('.legendChip').transition('colorLegend').duration(150).style('opacity', (title) => title === serie ? 1 : 0.25);
         };
         this.resetBarColor = () => {
             this.barChartContainer.selectAll('.bar').transition('color').duration(150).attr('fill', (barData) => this.colorFunction(barData.serie));
             select(this.legendDiv).selectAll('.legendChip').transition('colorLegend').duration(150).style('opacity', 1);
+            if (this.chartData.data.averageLine) {
+                this.barChartContainer.selectAll('.averageLine').transition('avgLine').style('mix-blend-mode', 'plus-lighter')
+                    .style('filter', 'contrast(0.5)');
+                /*       this.barChartContainer.selectAll('.averageLineText').transition('avgLine').style('mix-blend-mode', 'plus-lighter')
+                        .style('filter', 'contrast(0.5)'); */
+            }
+        };
+        this.highlightAverageLine = (serie) => {
+            this.barChartContainer.selectAll('.bar')
+                .transition('color')
+                .duration(150)
+                .attr('fill', (barData) => {
+                var _a;
+                if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(barData.serie) > 0) {
+                    return 'url(#prognosisInactive)';
+                }
+                else
+                    return this.evalColorVar('--digi--color--background--secondary-accent');
+            });
+            this.barChartContainer.selectAll('.averageLine').transition('avgLine')
+                .duration(150).style('mix-blend-mode', null).style('filter', null);
+            /*     this.barChartContainer.selectAll('.averageLineText').transition('avgLineText')
+                  .duration(150).style('mix-blend-mode', null).style('filter', null) */
+            select(this.legendDiv).selectAll('.legendChip').transition('colorLegend').duration(150).style('opacity', (title) => title === serie ? 1 : 0.25);
+        };
+        // Sets and resizespositions the average line
+        this.averageLine = () => {
+            if (!this.chartData.data.averageLine)
+                return;
+            const avLineGroup = this.barChartContainer.select('.interactiveElements').selectAll('.averageLineGroup').data([this.chartData.data.averageLine]).join('g').attr('class', 'averageLineGroup');
+            /*     avLineGroup.selectAll('.averageLineText')
+                  .data(d => [d])
+                  .join('text')
+                  .attr('class', 'averageLineText')
+                  .text(d => d.text)
+                  .attr('x', this.xScale.range()[0])
+                  .attr('y', (d) => this.yScale(d.value))
+                  .attr('dy', -2)
+                  .attr('font-size', this.fontSize)
+                  .attr('fill', 'var(--digi--color--infographic--lineart)')
+                  .style('mix-blend-mode', 'plus-lighter')
+                  .style('filter', 'contrast(0.5)'); */
+            avLineGroup.selectAll('.averageLine')
+                .data(d => [d.value])
+                .join('line')
+                .attr('class', 'averageLine')
+                .attr('x1', this.xScale.range()[0])
+                .attr('y1', (d) => this.yScale(d))
+                .attr('x2', this.xScale.range()[1])
+                .attr('y2', (d) => this.yScale(d))
+                .attr('stroke', 'var(--digi--color--infographic--lineart)')
+                .attr('stroke-width', 2)
+                .attr('stroke-dasharray', '12, 7')
+                .attr('stroke-linecap', 'round')
+                .style('mix-blend-mode', 'plus-lighter')
+                .style('filter', 'contrast(0.5)')
+                .style('pointer-events', 'none');
         };
         // Resizing chart while loading
         this.loadingResize = () => {
@@ -188,7 +250,12 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
                 this.barChartContainer.select(barGroupID).selectAll('.bar').transition('color')
                     .duration(20)
                     .attr('fill', (d) => {
-                    return this.adjustColor(this.colorFunction(d.serie), 50);
+                    var _a;
+                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(d.serie) > 0) {
+                        return 'url(#prognosisHighlight)';
+                    }
+                    else
+                        return this.adjustColor(this.colorFunction(d.serie), 50);
                 });
             }
         };
@@ -520,20 +587,40 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
                 });
                 return toReturn;
             }
-            this.chartData.data.xValueNames.forEach((key, index) => {
-                const tick = { key: key, series: [] };
-                this.chartData.data.series.forEach((serie) => {
-                    if (serie.yValues[index]) {
-                        tick.series.push({
-                            key: key,
-                            serie: serie.title,
-                            value: serie.yValues[index],
-                            len: serie.yValues[index] ? this.getTextSize(serie.yValues[index].toLocaleString()) : 0
+            else {
+                if (this.chartData.data.xValueNames) {
+                    this.chartData.data.xValueNames.forEach((key, index) => {
+                        const tick = { key: key, series: [] };
+                        this.chartData.data.series.forEach((serie) => {
+                            if (serie.yValues[index]) {
+                                tick.series.push({
+                                    key: key,
+                                    serie: serie.title,
+                                    value: serie.yValues[index],
+                                    len: serie.yValues[index] ? this.getTextSize(serie.yValues[index].toLocaleString()) : 0
+                                });
+                            }
                         });
-                    }
-                });
-                toReturn.push(tick);
-            });
+                        toReturn.push(tick);
+                    });
+                }
+                else {
+                    this.chartData.data.xValues.forEach((key, index) => {
+                        const tick = { key: key.toString(), series: [] };
+                        this.chartData.data.series.forEach((serie) => {
+                            if (serie.yValues[index]) {
+                                tick.series.push({
+                                    key: key.toString(),
+                                    serie: serie.title,
+                                    value: serie.yValues[index],
+                                    len: serie.yValues[index] ? this.getTextSize(serie.yValues[index].toLocaleString()) : 0
+                                });
+                            }
+                        });
+                        toReturn.push(tick);
+                    });
+                }
+            }
             return toReturn;
         };
         this.adjustBarSize = () => {
@@ -813,9 +900,17 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
                 .transition('color')
                 .duration(20)
                 .attr('fill', (d) => {
-                return event.target.tagName === 'rect'
-                    ? this.adjustColor(this.colorFunction(d.serie), 50)
-                    : this.evalColorVar('--digi--color--background--interactive--hover--tertiary');
+                var _a;
+                if (event.target.tagName === 'rect') {
+                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(d.serie) > 0) {
+                        return 'url(#prognosisHighlight)';
+                    }
+                    else
+                        return this.adjustColor(this.colorFunction(d.serie), 50);
+                }
+                else {
+                    return this.evalColorVar('--digi--color--background--interactive--hover--tertiary');
+                }
             });
         };
         // Removing highlight from bar
@@ -835,7 +930,7 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
             else
                 this.tooltipData = d;
             const tooltipBody = this.tooltip.select('.tooltipBody');
-            tooltipBody
+            this.tooltip
                 .select('.tooltipHeading')
                 .html(this.tooltipData.key);
             tooltipBody
@@ -998,6 +1093,7 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
             this.chartData = data;
         else
             this.chartData = JSON.parse(data);
+        this.series = this.chartData.data.series.map(serie => serie.title);
         this.mappedData = this.reshapeData();
         // checking for width of each tick
         this.mappedData.forEach((elem) => {
@@ -1039,10 +1135,13 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
     }
     initLegend() {
         const rectSize = 18;
+        const legendData = this.chartData.data.series.map(serie => serie.title);
+        if (this.chartData.data.averageLine)
+            legendData.push(this.chartData.data.averageLine.text);
         const legendChips = select(this.legendDiv).select('.legend')
             .style('margin-left', `${this.margin.left + this.tickPadding + this.yTickSize}px`)
             .selectAll('.legendChip')
-            .data(this.chartData.data.series.map(serie => serie.title))
+            .data(legendData)
             .join('div')
             .attr('class', 'legendChip')
             .style('display', 'flex')
@@ -1063,7 +1162,23 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
             .attr('rx', 4)
             .attr('ry', 4)
             .attr('fill', (title) => this.colorFunction(title));
-        legendChips.append('span').text((d) => d);
+        legendChips.append('span').style('text-wrap', 'nowrap').text((d) => d);
+        if (this.chartData.data.averageLine) {
+            const averageLine = legendChips.filter(':last-child')
+                .on('mouseenter', (_event, serie) => this.highlightAverageLine(serie));
+            const miniSVG = averageLine
+                .select('svg')
+                .attr('width', rectSize * 2);
+            miniSVG.select('rect').remove();
+            miniSVG.append('line')
+                .attr('x1', 1)
+                .attr('x2', rectSize * 2 - 1)
+                .attr('y1', rectSize / 2 + 1)
+                .attr('y2', rectSize / 2 + 1)
+                .attr('stroke', 'var(--digi--color--infographic--lineart)')
+                .attr('stroke-linecap', 'round')
+                .attr('stroke-dasharray', '12, 7');
+        }
     }
     initToolTip() {
         // Getting handle for tooltip
@@ -1071,8 +1186,8 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
         this.tooltip.select('.close').on('click', this.closeTooltip);
         // Add heading placeholder for heading
         this.tooltip
-            .select('.tooltipBody')
-            .append('h' + (parseInt(this.afHeadingLevel.replace(/\D/g, '')) + 1)) // increment heading level by one
+            .select('.tooltipHead')
+            .insert('h' + (parseInt(this.afHeadingLevel.replace(/\D/g, '')) + 1), ':first-child') // increment heading level by one
             .attr('class', 'tooltipHeading') // Adding class to try to dodge global css classes
             .style('font-size', '1rem')
             .style('margin', '0 0.75rem 0.5rem 0 ')
@@ -1272,6 +1387,9 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
     // Initializing bars, can only handle one series of bars for now
     initBars() {
         this.barSelection = this.barChartContainer
+            .append('g')
+            .attr('class', 'interactiveElements')
+            .style('isolation', 'isolate')
             .selectAll('barGroup')
             .data(this.mappedData)
             .join('g')
@@ -1328,6 +1446,7 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
         this.initYAxis();
         this.initXAxis();
         this.initBars();
+        this.averageLine();
         this.initBarText();
     }
     async updateChain() {
@@ -1442,12 +1561,18 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
     }
     // Getting correct color given index or name of data serie
     colorFunction(input) {
-        if (typeof input === 'number')
+        var _a;
+        if (typeof input === 'number') {
             return this.evalColorVar(this.colorPalettes[input]);
+        }
         else {
             const index = this.chartData.data.series.findIndex((serie) => serie.title === input);
-            if (index > 0)
-                return this.evalColorVar(this.colorPalettes[index]);
+            if (index > 0) {
+                if ((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern)
+                    return 'url(#prognosis)';
+                else
+                    return this.evalColorVar(this.colorPalettes[index]);
+            }
             else
                 return this.evalColorVar(this.colorPalettes[0]);
         }
@@ -1483,6 +1608,7 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
         this.setNamedTicks();
         this.setValueTicks();
         this.setTickInteraction();
+        this.averageLine();
         this.adjustBarSize();
         this.adjustBarText();
         if (this.tooltip.style('visibility') !== 'hidden')
@@ -1605,7 +1731,7 @@ const barChart = /*@__PURE__*/ proxyCustomElement(class barChart extends H {
 				<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></p>`;
             }
         }
-        return (h(Host, { key: 'adbf9f1c26a8816a8d4b585b0fc7a0b9100bf252', ref: (el) => (this.host = el) }, h("div", { key: 'ee28dc5914be751e08c73253b80fd257c2e17bbb', class: "topWrapper", ref: (el) => (this.titleDiv = el) }, h("digi-typography", { key: '6a0b051d3c26e9c34fb59d4ee323a10d1cb542e1', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '9e11623f0b35f394dc3655067625a37771f648d1', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_b = this.chartData) === null || _b === void 0 ? void 0 : _b.title) ? (_c = this.chartData) === null || _c === void 0 ? void 0 : _c.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '6e00e771521a10c0213ae6267ea2879c7ccc4b3c', slot: "icon" }), "Visa tabell"), h("digi-button", { key: 'a1eec7299c9cd273ceffa1f1689ee0c6297ce0a1', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_d = this.chartData) === null || _d === void 0 ? void 0 : _d.title) ? (_e = this.chartData) === null || _e === void 0 ? void 0 : _e.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: '5361af6d17e4cd7d6217afd48c4a474fd905c8de', slot: "icon" }), "Visa diagram"), h("div", { key: '2efe2244c2105390580779f60a7c1accd5135d49', class: "scChartStatus", role: "status", ref: (el) => (this.status = el) })), h("div", { key: '48f2316efe396309fd73510a2eea011c137e24ed', class: "svgWrap", ref: (el) => (this.chartDiv = el) }, h("div", { key: '4f2f494517979cbb9de43945d5ffe17acbe6c814', class: "chartTooltip", id: this.afId }, h("div", { key: '36db97d0dcd4e2009cd33b4125b631eddae039ae', class: "tooltipBody" }), h("digi-icon-x", { key: 'b3ac9ec4b6cd6c2c666d475929c10c0aaba2b9e1', class: "close" }), this.afVariation === BarChartVariation.Horizontal ? (h("digi-icon-caret-up", { class: "caret" })) : (h("digi-icon-caret-down", { class: "caret" })))), h("div", { key: 'f96ed8b4c527ba32de5dd5bdb58c367435ecbc04', class: "legendWrap", ref: (el) => (this.legendDiv = el) }, h("div", { key: '3911352915f02a33231c2e0604a5073fb7203bd3', class: "legend" })), h("div", { key: '29c613f6af6e23b05748e230bad4c00156f30fd6', class: "table", ref: (el) => (this.tableDiv = el) }, ' ')));
+        return (h(Host, { key: '54667697f174d4094b521c81dc772b599c262c29', ref: (el) => (this.host = el) }, h("svg", { key: 'df7e852f09b0c7b142154024444a8cc694b3a34a', xmlns: "http://www.w3.org/2000/svg", width: "0", height: "0" }, h("defs", { key: '036603fe008473d87dac2c97e7d4106aca962cc6' }, h("pattern", { key: '4d69d72862f411f0c1d115613ef21b449467a8cf', id: "prognosis", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("line", { key: '75f26f0b57f83546f5b0a788f14be2daebe4c1f9', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar(this.colorPalettes[0]), "stroke-width": "8" })), h("pattern", { key: '93a47ceac0fb59103486e974e63325b31672e89d', id: "prognosisInactive", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("line", { key: '90e8ca1a698db50f0711ede271c6d5357fb26c42', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar('--digi--color--background--secondary-accent'), "stroke-width": "8" })), h("pattern", { key: 'cc034a851b624f5c2107b15f29d63a224601e0c9', id: "prognosisHighlight", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, h("line", { key: '248034ecb86d548ceafe837341dabbae07b6c753', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.adjustColor(this.colorFunction(0), 50), "stroke-width": "8" })))), h("div", { key: '51b7a0e2f9ff0f85d3abde08ab3f3cf346cdd4aa', class: "topWrapper", ref: (el) => (this.titleDiv = el) }, h("digi-typography", { key: '880b7b7a2fde8eccbd4c24878cc7b3b9b9c6497a', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: 'f374ae56dc6d13906d27bbb76fba63128bc6b704', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_b = this.chartData) === null || _b === void 0 ? void 0 : _b.title) ? (_c = this.chartData) === null || _c === void 0 ? void 0 : _c.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '3c8dcd209ffd76fb97cdb14232996136ff3a0387', slot: "icon" }), "Visa tabell"), h("digi-button", { key: '89e5a3a838efd0e2c21abb88141e7e455c1c5b7a', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_d = this.chartData) === null || _d === void 0 ? void 0 : _d.title) ? (_e = this.chartData) === null || _e === void 0 ? void 0 : _e.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: '8c3debb222d5079506dee4f9cdacf85128ead251', slot: "icon" }), "Visa diagram"), h("div", { key: '0c1916ce68d02ab2b567ed20ea25c17076497aaf', class: "scChartStatus", role: "status", ref: (el) => (this.status = el) })), h("div", { key: '143cc5ecbc3bbf3d085eb0426bca9b3bf66ecc7b', class: "svgWrap", ref: (el) => (this.chartDiv = el) }, h("div", { key: 'eabbfd6c62996ae237014bd0e4754fb857e0f518', class: "chartTooltip", id: this.afId }, h("div", { key: '97c7c2e479acb9a6f4658768870c1484baa59f01', class: "tooltipHead" }, h("digi-icon-x", { key: 'ec08ba3c764cb66ed0ecac0afdd6b4d16bc84b84', class: "close" })), h("div", { key: '6d80b2cb7bf94c492eaed42a80a8252394fe92b9', class: "tooltipBody" }), this.afVariation === BarChartVariation.Horizontal ? (h("digi-icon-caret-up", { class: "caret" })) : (h("digi-icon-caret-down", { class: "caret" })))), h("div", { key: '7a22b0e07deb81e3e566f60e5e8e2d2f3056a2a2', class: "legendWrap", ref: (el) => (this.legendDiv = el) }, h("div", { key: '40d906b37ea0a69cb7fcfe310e612e8a5cba2928', class: "legend" })), h("div", { key: '24802d1363812b9d50bd98216f36c7c3f44856d2', class: "table", ref: (el) => (this.tableDiv = el) }, ' ')));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/components/digi-calendar-datepicker.js

@@ -48,19 +48,19 @@ import './p-b0e88537.js';
 import './p-cdcaf0eb.js';
 import { r as randomIdGenerator } from './p-ffe5c0e8.js';
 import { d as detectClickOutside } from './p-430607cb.js';
-import { i as isBefore, a as isAfter, d as defineCustomElement$f } from './p-5d16bf8e.js';
-import { d as defineCustomElement$e } from './p-4be31ab9.js';
-import { d as defineCustomElement$d } from './p-0b4d2d83.js';
-import { d as defineCustomElement$c } from './p-b6b7ca97.js';
-import { d as defineCustomElement$b } from './p-14ca5b70.js';
-import { d as defineCustomElement$a } from './p-f3c0bfd0.js';
-import { d as defineCustomElement$9 } from './p-ea3ca139.js';
-import { d as defineCustomElement$8 } from './p-21cd8c48.js';
-import { d as defineCustomElement$7 } from './p-2889897c.js';
-import { d as defineCustomElement$6 } from './p-039ae2b0.js';
-import { d as defineCustomElement$5 } from './p-04d40c11.js';
-import { d as defineCustomElement$4 } from './p-6105626d.js';
-import { d as defineCustomElement$3 } from './p-ecf4d8ee.js';
+import { i as isBefore, a as isAfter, d as defineCustomElement$f } from './p-52fe1a97.js';
+import { d as defineCustomElement$e } from './p-d0884709.js';
+import { d as defineCustomElement$d } from './p-d1fc55fd.js';
+import { d as defineCustomElement$c } from './p-7811ea5a.js';
+import { d as defineCustomElement$b } from './p-f630b5d3.js';
+import { d as defineCustomElement$a } from './p-2bcbe128.js';
+import { d as defineCustomElement$9 } from './p-c90fed99.js';
+import { d as defineCustomElement$8 } from './p-2c01b4f7.js';
+import { d as defineCustomElement$7 } from './p-11278347.js';
+import { d as defineCustomElement$6 } from './p-e6a40b0a.js';
+import { d as defineCustomElement$5 } from './p-013b272d.js';
+import { d as defineCustomElement$4 } from './p-5bbb5a67.js';
+import { d as defineCustomElement$3 } from './p-33f08ec3.js';
 import { d as defineCustomElement$2 } from './p-2f619b66.js';
 import { r as requiredArgs, t as toDate, i as isValid } from './p-7aacd45f.js';
 import { t as toInteger, g as getUTCISOWeek, a as getUTCWeek, b as getUTCWeekYear, s as startOfUTCWeek, c as startOfUTCISOWeek, i as isProtectedWeekYearToken, d as throwProtectedError, e as isProtectedDayOfYearToken, f as subMilliseconds, h as getTimezoneOffsetInMilliseconds, j as defaultLocale, l as longFormatters } from './p-c7949525.js';

package/components/digi-calendar-week-view.js

@@ -5,9 +5,9 @@ import { r as randomIdGenerator } from './p-ffe5c0e8.js';
 import { b as ButtonVariation } from './p-f518a4cf.js';
 import { C as CalendarWeekViewHeadingLevel } from './p-7e32c40b.js';
 import { d as defineCustomElement$5 } from './p-e8fc33ed.js';
-import { d as defineCustomElement$4 } from './p-ea3ca139.js';
-import { d as defineCustomElement$3 } from './p-21cd8c48.js';
-import { d as defineCustomElement$2 } from './p-204a12b0.js';
+import { d as defineCustomElement$4 } from './p-c90fed99.js';
+import { d as defineCustomElement$3 } from './p-2c01b4f7.js';
+import { d as defineCustomElement$2 } from './p-cfb33ac7.js';
 import { r as requiredArgs, t as toDate, i as isValid } from './p-7aacd45f.js';
 
 /**

package/components/digi-calendar.js

@@ -1,4 +1,4 @@
-import { C as Calendar, d as defineCustomElement$1 } from './p-5d16bf8e.js';
+import { C as Calendar, d as defineCustomElement$1 } from './p-52fe1a97.js';
 
 const DigiCalendar = Calendar;
 const defineCustomElement = defineCustomElement$1;

package/components/digi-chart-line.js

@@ -3,10 +3,10 @@ import { _ as _t } from './p-08cf2c0e.js';
 import { s as select, f as dispatch, r as range, a as axisLeft, g as formatLocale, p as polyInOut, b as axisBottom, l as linear, m as max, d as min, o as ordinal, c as interpolate, e as linear$1 } from './p-a47b6b5c.js';
 import { r as randomIdGenerator } from './p-ffe5c0e8.js';
 import { d as defineCustomElement$6 } from './p-e8fc33ed.js';
-import { d as defineCustomElement$5 } from './p-3a53c26b.js';
-import { d as defineCustomElement$4 } from './p-70a1e53a.js';
-import { d as defineCustomElement$3 } from './p-5e2cf317.js';
-import { d as defineCustomElement$2 } from './p-204a12b0.js';
+import { d as defineCustomElement$5 } from './p-3c9cea93.js';
+import { d as defineCustomElement$4 } from './p-94603530.js';
+import { d as defineCustomElement$3 } from './p-cc5bd9f9.js';
+import { d as defineCustomElement$2 } from './p-cfb33ac7.js';
 
 function sourceEvent(event) {
   let sourceEvent;
@@ -2307,7 +2307,7 @@ const ChartLine = /*@__PURE__*/ proxyCustomElement(class ChartLine extends H {
             heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}>`;
         else
             heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}><p>${this._chartData.subTitle}</p>`;
-        return (h("host", { key: 'e5e8fdc58756850c9efa7cbb07b9e1e381dea725', ref: (el) => (this._host = el) }, h("div", { key: 'be9a2e7be1153eca0ac094b6af9697978caac397', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: 'cb5ef87503157d2b6fde4faa88146482c4b35263', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '70fae20a2cbc88c3d196b4b397c60c6a7af017d5', 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: '4a8d8c1975a90a6479e48995b850bdb9de303e4b', slot: "icon" }), "Visa tabell"), h("digi-button", { key: 'b54b1cde8415d450ce8d8f1381eea7a730629a69', 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: 'c59f756df0b6baf807bbcafc4f5043b732731db5', slot: "icon" }), "Visa diagram"), h("div", { key: '4782e1922b6e45665d237516ad8340d00e1f9b45', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: 'e5543d8919613a9fb3ff1c3f5d5f84fd4059b076', class: "chartTooltip", id: this.afId }, h("div", { key: '236b2644e8052cc68c388210bd517e329d52ca21', class: "tooltipHead" }, h("digi-icon-x", { key: 'fb6f0881aeedd04414157ff95484a2d32fa34b38', class: "close" }), ' '), h("div", { key: 'fb9bddebfb38768a8402a59a71551b95270e3305', class: "tooltipBody" })), h("div", { key: '469dac4bc1ab51f4d4cb0b97e7e4a216cd1cc4fe', class: "chart", ref: (el) => (this._chartDiv = el) }), h("div", { key: '48bcfdc1eae947708bd2f7414f189bd1339db2d3', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: 'd3dc96e2710194b6e66848f663d7517b33dd5926', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
+        return (h("host", { key: '2660390a27d10e08cede6fbc9baa2f6f2c23b598', ref: (el) => (this._host = el) }, h("div", { key: '28f684dbcf23122b496b506979da55556c7441d9', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: '1790454fa384ac0f0443462f4f307108dc3950ac', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: 'ede9024c57dd001053645e052326e36caca932c0', 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: 'a8ff4b212951ea76a3bca93e7ffacb08053ebf35', slot: "icon" }), "Visa tabell"), h("digi-button", { key: 'e97d0302da660694c7ec5d451c794d9ae3d187c6', 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: '2ca654591868fb8ef85016b2fcaec0655f53ea3f', slot: "icon" }), "Visa diagram"), h("div", { key: '409521a949a75753d8ad998861e8f53f8f2cda62', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: '19b8343c5039da7ead9a50ac7de74d0ce0324681', class: "chartTooltip", id: this.afId }, h("div", { key: '28767d138814122bdec3c0f83d67772f3eb2be79', class: "tooltipHead" }, h("digi-icon-x", { key: '0bb56bb3793b1a686b6f9adc4fb511fac02b2be8', class: "close" }), ' '), h("div", { key: '8c26e79ac3581ea677b483f56830c9d410cf88a9', class: "tooltipBody" })), h("div", { key: 'b52f49ec54de82fe47903b3d02951b4067989e86', class: "chart", ref: (el) => (this._chartDiv = el) }), h("div", { key: 'd203c6a181d727459e2832392adaf9474c10d2ce', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: 'f4f0302c22507f874e5916b4ce11a706d54de1d5', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
     }
     get element() { return this; }
     static get watchers() { return {

package/components/digi-code-block.js

@@ -1,4 +1,4 @@
-import { C as CodeBlock, d as defineCustomElement$1 } from './p-f080d24e.js';
+import { C as CodeBlock, d as defineCustomElement$1 } from './p-03338211.js';
 
 const DigiCodeBlock = CodeBlock;
 const defineCustomElement = defineCustomElement$1;

package/components/digi-code-example.js

@@ -4,11 +4,11 @@ import { b as ButtonVariation, B as ButtonSize } from './p-f518a4cf.js';
 import { _ as _t } from './p-08cf2c0e.js';
 import { r as randomIdGenerator } from './p-ffe5c0e8.js';
 import { d as defineCustomElement$7 } from './p-e8fc33ed.js';
-import { d as defineCustomElement$6 } from './p-f080d24e.js';
-import { d as defineCustomElement$5 } from './p-beda5948.js';
-import { d as defineCustomElement$4 } from './p-e22a938c.js';
-import { d as defineCustomElement$3 } from './p-1585a4be.js';
-import { d as defineCustomElement$2 } from './p-6e6c2153.js';
+import { d as defineCustomElement$6 } from './p-03338211.js';
+import { d as defineCustomElement$5 } from './p-df47eea9.js';
+import { d as defineCustomElement$4 } from './p-3344671c.js';
+import { d as defineCustomElement$3 } from './p-34685ea4.js';
+import { d as defineCustomElement$2 } from './p-c139a46c.js';
 
 const codeExampleCss = ".sc-digi-code-example-h{--digi--code-example--background:var(--digi--color--background--primary);--digi--code-example--controls--width:16.25rem;display:block}.digi-code-example.sc-digi-code-example{background-size:20px 20px;background-position:0 0, 0 10px, 10px -10px, -10px 0px;border:var(--digi--border-width--primary) solid var(--digi--color--divider--primary--light);height:100%;display:flex;flex-direction:row;border-radius:0.3rem;position:relative}@media (max-width: 35.9375rem){.digi-code-example.sc-digi-code-example{min-width:360px}}.digi-code-example--light.sc-digi-code-example{background-color:#ffffff;background-image:linear-gradient(45deg, #efefef 25%, transparent 25%), linear-gradient(-45deg, #efefef 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #efefef 75%), linear-gradient(-45deg, transparent 75%, #efefef 75%)}.digi-code-example--dark.sc-digi-code-example{background-color:#787777;background-image:linear-gradient(45deg, #666666 25%, transparent 25%), linear-gradient(-45deg, #666666 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #666666 75%), linear-gradient(-45deg, transparent 75%, #666666 75%)}.digi-code-example__container.sc-digi-code-example{display:flex;flex-direction:column;justify-content:space-between;flex-grow:1;position:relative}.digi-code-example--no-controls.sc-digi-code-example{flex-direction:column}.digi-code-example--no-controls.sc-digi-code-example .digi-code-example__copy-button.sc-digi-code-example{margin-top:0;align-self:flex-end;margin-bottom:0.2rem;z-index:1;position:absolute;bottom:0;right:0}.digi-code-example--no-controls.sc-digi-code-example .digi-code-example__copy-button--dark.sc-digi-code-example{--digi--button--color--text--function--default:var(--digi--color--text--secondary);--digi--button--color--text--function--hover:var(--digi--color--text--secondary);--digi--button--color--icon--function--default:var(--digi--color--text--secondary);--digi--button--color--icon--function--hover:var(--digi--color--text--secondary)}.digi-code-example__example.sc-digi-code-example{padding:var(--digi--padding--largest-2);overflow-x:auto}@media (max-width: 48rem){.digi-code-example__example.sc-digi-code-example{padding:var(--digi--padding--medium)}}@media (max-width: 35.9375rem){.digi-code-example__example.sc-digi-code-example{padding:var(--digi--padding--small)}}.digi-code-example__copy-button.sc-digi-code-example{align-self:start;margin-top:var(--digi--padding--large);margin-right:var(--digi--padding--small)}.digi-code-example__codeblock.sc-digi-code-example digi-code-block.sc-digi-code-example{--digi--code-block--border-radius:0;--digi--code-block--border:none}.digi-code-example__controls.sc-digi-code-example{padding:var(--digi--padding--medium);background:var(--digi--color--background--secondary);display:flex;flex:0 var(--digi--code-example--controls--width);flex-direction:column;align-self:stretch;flex-shrink:0;justify-content:space-between;gap:var(--digi--gutter--medium)}@media (max-width: 48rem){.digi-code-example__controls.sc-digi-code-example{padding:var(--digi--padding--smaller)}}.digi-code-example__controls[hidden].sc-digi-code-example{display:none}.digi-code-example--inactive.sc-digi-code-example .digi-code-example__code.sc-digi-code-example{display:flex;flex-direction:column;flex-grow:1}.digi-code-example--inactive.sc-digi-code-example .digi-code-example__codeblock.sc-digi-code-example{flex-grow:1;height:64px;overflow-y:hidden;position:relative}.digi-code-example__code-expand.sc-digi-code-example{display:flex;align-items:center;justify-content:center;gap:var(--digi--gutter--icon);width:100%;padding:0.875rem 0;background:#272727;color:var(--digi--color--text--secondary);font-size:var(--digi--typography--body--font-size--desktop);font-family:var(--digi--global--typography--font-family--default);cursor:pointer;border:none}.digi-code-example__code-expand.sc-digi-code-example:hover{background:var(--digi--grayscale--900);text-decoration:underline}.digi-code-example__code-expand.sc-digi-code-example:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.digi-code-example--no-controls.digi-code-example--inactive.sc-digi-code-example .digi-code-example__codeblock.sc-digi-code-example{height:64px}.digi-code-example__copy-button.sc-digi-code-example{--digi--button--padding--small:0;--digi--button--padding--medium:0;--digi--button--padding--large:0}.digi-code-example__code-expand-icon.sc-digi-code-example{--digi--icon--color:var(--digi--color--text--secondary);transition:ease-in-out var(--digi--animation--duration--base) all}.digi-code-example__code-expand-icon--open.sc-digi-code-example{transform:rotate(180deg)}.digi-code-example__fade.sc-digi-code-example{position:absolute;width:100%;bottom:0;height:var(--digi--padding--largest-2)}.digi-code-example__fade--light.sc-digi-code-example{background-image:linear-gradient(0deg, white, transparent)}.digi-code-example__fade--dark.sc-digi-code-example{--digi--color--background--inverted-3:#272727;background-image:linear-gradient(0deg, var(--digi--grayscale--900), transparent)}.slot__controls.sc-digi-code-example{margin-bottom:var(--digi--padding--smaller)}.sc-digi-code-example-s .slot__controls{display:flex;flex-direction:column;gap:var(--digi--padding--smaller)}.sc-digi-code-example-s .slot__controls[hidden]{display:none}.sc-digi-code-example-s .slot__controls digi-form-fieldset,.sc-digi-code-example-s .slot__controls digi-form-select,.sc-digi-code-example-s .slot__controls digi-form-fieldset+digi-form-checkbox,.sc-digi-code-example-s .slot__controls .divider{display:block;border-bottom:1px solid var(--digi--color--divider--primary--light);padding-bottom:var(--digi--padding--smaller);margin-bottom:var(--digi--padding--medium)}";
 const DigiCodeExampleStyle0 = codeExampleCss;
@@ -139,17 +139,17 @@ const CodeExample = /*@__PURE__*/ proxyCustomElement(class CodeExample extends H
             .replace(/\w/, (firstLetter) => firstLetter.toUpperCase());
     }
     render() {
-        return (h("div", { key: '0aac88062d18bb191c2404520006a2f5b8c33ae5', class: Object.assign({ 'digi-code-example': true }, this.cssModifiers), ref: (el) => (this.containerElement = el) }, h("div", { key: 'b6d609bb0bfc8bd7056a712ff482737c7226bd4c', class: {
+        return (h("div", { key: '2ef6570a3577fc8e68971f09151dec2bd86bdc18', class: Object.assign({ 'digi-code-example': true }, this.cssModifiers), ref: (el) => (this.containerElement = el) }, h("div", { key: '94e1dfbf94a1b7b90a770c86c4c309c02a5d682a', class: {
                 'digi-code-example__container': true
-            } }, h("div", { key: '1d1c2f8bfbc25d98bb6075e80ffc2d795de8ae12', class: "digi-code-example__example" }, h("slot", { key: 'cba52c172ea1a353d955c2126097ec54f6e0ff3d' })), !this.afHideCode && (h("div", { key: 'f50222cfb99ed37838a8170c9a749c818c867b79', class: "digi-code-example__code" }, this.showMoreButton && (h("button", { key: 'e845e695285530ffb9f3eb9bdf62d3084363bced', class: "digi-code-example__code-expand", "aria-label": this.isActive ? _t.code.show_less : _t.code.show_more, "aria-expanded": this.isActive ? `true` : `false`, onClick: () => this.toggleButtonClickHandler() }, this.isActive ? _t.code.show_less : _t.code.show_more, ' ', h("digi-icon-chevron-down", { key: '6d19ac2f5a8a543a71438eea512d3a866bc55a19', class: {
+            } }, h("div", { key: '2a56800cc263782d8bbbf3962eaacaa1df341067', class: "digi-code-example__example" }, h("slot", { key: 'c11c6a395e412c64291261fc9c849b22960e685b' })), !this.afHideCode && (h("div", { key: 'd230e73ee09938b258675aae499eb5d0f20cb6da', class: "digi-code-example__code" }, this.showMoreButton && (h("button", { key: 'bc334ed8052f21302dc1abd9402974938d3b11ae', class: "digi-code-example__code-expand", "aria-label": this.isActive ? _t.code.show_less : _t.code.show_more, "aria-expanded": this.isActive ? `true` : `false`, onClick: () => this.toggleButtonClickHandler() }, this.isActive ? _t.code.show_less : _t.code.show_more, ' ', h("digi-icon-chevron-down", { key: 'e1d2f3d0908f13abffdda78f83fa008af09f0cb8', class: {
                 'digi-code-example__code-expand-icon': true,
                 'digi-code-example__code-expand-icon--open': this.isActive
-            }, "aria-hidden": "true" }))), h("div", { key: 'c1c45315383b313f9419ed9088cccfc11545f85f', class: {
+            }, "aria-hidden": "true" }))), h("div", { key: 'a7fe982261026080d861cda236a555a50aee199d', class: {
                 'digi-code-example__codeblock': true,
                 'digi-code-example__codeblock--light': this.afCodeBlockVariation === 'light',
                 'digi-code-example__codeblock--dark': this.afCodeBlockVariation === 'dark',
                 'digi-code-example__codeblock--fade': !this.isActive && this.showMoreButton
-            } }, h("digi-code-block", { key: 'aca64a8b41e403fda4cd8727efc2d53294c2ed6e', afCode: this.codeExample || '', afLanguage: this.afLanguage.toLowerCase(), afVariation: this.afCodeBlockVariation, "af-hide-toolbar": true }), !this.isActive ? (h("div", { class: {
+            } }, h("digi-code-block", { key: '35e29b95fbe734f9823b39d34e91b78e338189b0', afCode: this.codeExample || '', afLanguage: this.afLanguage.toLowerCase(), afVariation: this.afCodeBlockVariation, "af-hide-toolbar": true }), !this.isActive ? (h("div", { class: {
                 'digi-code-example__fade': true,
                 'digi-code-example__fade--dark': this.afCodeBlockVariation === 'dark',
                 'digi-code-example__fade--light': this.afCodeBlockVariation === 'light'

package/components/digi-code.js

@@ -31,7 +31,7 @@ const Code = /*@__PURE__*/ proxyCustomElement(class Code extends H {
         };
     }
     render() {
-        return (h("span", { key: '7c1ef98c36152df078e8bedcb71742d8bf1ee567', class: Object.assign({ 'digi-code': true }, this.cssModifiers) }, h("code", { key: '851c4c6ff5a7475543f2e5bef68946103f1dce17', class: `digi-code__code language-${this.afLanguage}`, lang: this.afLang, innerHTML: this.highlightedCode })));
+        return (h("span", { key: 'e4ccd883dae3019da944b14792cb2f435396317c', class: Object.assign({ 'digi-code': true }, this.cssModifiers) }, h("code", { key: 'ea2b50ef49a1cd75a452701f31f2b9ccbb2e5a6d', class: `digi-code__code language-${this.afLanguage}`, lang: this.afLang, innerHTML: this.highlightedCode })));
     }
     static get watchers() { return {
         "afCode": ["formatCode"]

package/components/digi-context-menu.js

@@ -3,8 +3,8 @@ import { d as detectClickOutside } from './p-430607cb.js';
 import { d as detectFocusOutside } from './p-ee33960b.js';
 import { r as randomIdGenerator } from './p-ffe5c0e8.js';
 import { d as defineCustomElement$4 } from './p-e8fc33ed.js';
-import { d as defineCustomElement$3 } from './p-e048c005.js';
-import { d as defineCustomElement$2 } from './p-1585a4be.js';
+import { d as defineCustomElement$3 } from './p-b2ff86cf.js';
+import { d as defineCustomElement$2 } from './p-34685ea4.js';
 
 const navigationContextMenuCss = ".sc-digi-context-menu-h{--digi--navigation-context-menu--toggle-icon--transition:ease-in-out 0.2s all;--digi--navigation-context-menu--toggle-icon--transform:rotate(-180deg);--digi--navigation-context-menu--content--background-color:var(--digi--color--background--primary);--digi--navigation-context-menu--content--border-radius:var(--digi--border-radius--secondary);--digi--navigation-context-menu--content--max-width:90vw;--digi--navigation-context-menu--content--max-height:15rem;--digi--navigation-context-menu--button-icon--width:0.875rem;--digi--navigation-context-menu--button-trigger--font-size:var(--digi--typography--body--font-size--desktop);--digi--navigation-context-menu--button-trigger--padding:0;--digi--navigation-context-menu--item--font-size:var(--digi--typography--body--font-size--desktop);--digi--navigation-context-menu--item--background-color--active:var(--digi--color--background--interactive--selected--tertiary);--digi--navigation-context-menu--item--display:flex;--digi--navigation-context-menu--item--font-family:var(--digi--global--typography--font-family--default);--digi--navigation-context-menu--item--font-color:var(--digi--color--text--primary);display:block;box-sizing:border-box;width:fit-content}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu{display:grid}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__toggle-icon.sc-digi-context-menu{transition:var(--digi--navigation-context-menu--toggle-icon--transition)}.sc-digi-context-menu-h .digi-navigation-context-menu--active.sc-digi-context-menu .digi-navigation-context-menu__toggle-icon.sc-digi-context-menu{transform:var(--digi--navigation-context-menu--toggle-icon--transform)}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__trigger-button.sc-digi-context-menu{display:block;--digi--button--padding--medium:var(--digi--navigation-context-menu--button-trigger--padding);width:fit-content;--digi--button--font-size--medium:var(--digi--navigation-context-menu--button-trigger--font-size)}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__list.sc-digi-context-menu{width:100%;position:relative;display:none}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__list--active.sc-digi-context-menu{display:inline-grid}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__list.sc-digi-context-menu .dropdown-wrapper.sc-digi-context-menu{padding:0.5rem 0;display:none;width:max-content;min-width:100%;max-width:var(--digi--navigation-context-menu--content--max-width);max-height:var(--digi--navigation-context-menu--content--max-height);overflow-y:auto;box-sizing:border-box;z-index:10;margin-top:0.5rem;background-color:var(--digi--navigation-context-menu--content--background-color);border-radius:var(--digi--navigation-context-menu--content--border-radius);box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.7);position:absolute}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__list.sc-digi-context-menu .dropdown-wrapper--visible.sc-digi-context-menu{display:block}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__list.sc-digi-context-menu .dropdown-wrapper--position-right.sc-digi-context-menu{right:0}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__list.sc-digi-context-menu .dropdown-wrapper--position-center.sc-digi-context-menu{left:50%;transform:translateX(-50%)}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .content-wrapper.sc-digi-context-menu{display:flex;flex-direction:row;align-items:baseline;padding-left:1rem;padding-right:1rem;gap:0.5rem}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item.sc-digi-context-menu{font-size:var(--digi--navigation-context-menu--item--font-size);display:var(--digi--navigation-context-menu--item--display);font-family:var(--digi--navigation-context-menu--item--font-family);padding:0.625rem 0;max-width:max-content;min-width:100%;width:100%;position:relative;cursor:pointer}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item.sc-digi-context-menu:hover{background-color:var(--digi--navigation-context-menu--item--background-color--active)}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item.sc-digi-context-menu:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item--active.sc-digi-context-menu{font-weight:600;background-color:var(--digi--navigation-context-menu--item--background-color--active)}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item--link.sc-digi-context-menu{list-style:none;margin:0;padding:0}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item--link.sc-digi-context-menu a.sc-digi-context-menu{padding:0.625rem 1rem;color:var(--digi--navigation-context-menu--item--font-color, #333333);text-decoration:none;margin:0;width:100%}.sc-digi-context-menu-h .digi-navigation-context-menu.sc-digi-context-menu .digi-navigation-context-menu__item.sc-digi-context-menu .digi-navigation-context-menu__button-icon.sc-digi-context-menu{--digi--icon--width:var(--digi--navigation-context-menu--button-icon--width)}";
 const DigiContextMenuStyle0 = navigationContextMenuCss;
@@ -205,13 +205,13 @@ const ContextMenu = /*@__PURE__*/ proxyCustomElement(class ContextMenu extends H
     }
     render() {
         const menuItems = this.afMenuItems;
-        return (h(Host, { key: '27f60fd191d2c9175e013e7afd9dfdba948f4a90' }, h("div", { key: '4ec618c6dbe05b96e082b91eaf2dc32d14ffb2c3', id: `${this.afId}-identifier`, class: {
+        return (h(Host, { key: 'd9024d6373cbed4e449d880eb5999921941311c8' }, h("div", { key: '2e71d1de06967dee77553c0e171338f0ec2a16b2', id: `${this.afId}-identifier`, class: {
                 'digi-navigation-context-menu': true,
                 'digi-navigation-context-menu--active': this.visible
-            } }, h("digi-button", { key: '5f49f1eb94a5c42d562c0067d6beb898f5a01a54', id: `${this.afId}-trigger`, ref: (ref) => (this.buttonRef = ref), onClick: () => this.handleToggle(), afVariation: "function", afAriaControls: `${this.afId}-dropdown`, afAriaExpanded: this.visible, afAriaLabel: this.afAriaLabel || null, class: "digi-navigation-context-menu__trigger-button" }, !!this.afIcon && h(this.digiIcon, { key: 'b79d9d251a68a80eae57f39d62eabf80aca94352', slot: "icon" }), this.afTitle, h("digi-icon-chevron-down", { key: 'a42b38184640fae48efdc059cfeb9126d4427392', class: "digi-navigation-context-menu__toggle-icon", slot: "icon-secondary" })), h("div", { key: '2ba1c9aa2b682f1af8fbe0017061dc7253557b1a', class: {
+            } }, h("digi-button", { key: 'f72ca1811f2c10873bff2cf6c6edfb6d690909b3', id: `${this.afId}-trigger`, ref: (ref) => (this.buttonRef = ref), onClick: () => this.handleToggle(), afVariation: "function", afAriaControls: `${this.afId}-dropdown`, afAriaExpanded: this.visible, afAriaLabel: this.afAriaLabel || null, class: "digi-navigation-context-menu__trigger-button" }, !!this.afIcon && h(this.digiIcon, { key: 'a7d28de1604540f5bc90ac45f92c11db03c9e3f4', slot: "icon" }), this.afTitle, h("digi-icon-chevron-down", { key: '39a9b3cc9d61b8a43f6b32391f20fdf183e620c4', class: "digi-navigation-context-menu__toggle-icon", slot: "icon-secondary" })), h("div", { key: 'f9a7c9014f2683e69c30fef9a586e0ff929d589f', class: {
                 'digi-navigation-context-menu__list': true,
                 'digi-navigation-context-menu__list--active': this.visible
-            } }, h("div", { key: 'ece4a0cdac48cd372c7d8a755351c8f424abf50a', onKeyDown: (e) => {
+            } }, h("div", { key: 'c31531d586d8214c2287f9c5d98902a0bd98c0a2', onKeyDown: (e) => {
                 this.handleKey(e);
             }, id: `${this.afId}-dropdown`, style: {
                 visibility: this.visible ? 'visible' : 'hidden'

package/components/digi-dialog.js

@@ -47,9 +47,9 @@ import './p-a6ca40fc.js';
 import './p-b0e88537.js';
 import './p-cdcaf0eb.js';
 import { d as defineCustomElement$5 } from './p-e8fc33ed.js';
-import { d as defineCustomElement$4 } from './p-5e2cf317.js';
-import { d as defineCustomElement$3 } from './p-204a12b0.js';
-import { d as defineCustomElement$2 } from './p-ecf4d8ee.js';
+import { d as defineCustomElement$4 } from './p-cc5bd9f9.js';
+import { d as defineCustomElement$3 } from './p-cfb33ac7.js';
+import { d as defineCustomElement$2 } from './p-33f08ec3.js';
 
 const dialogCss = ":host{--digi--dialog--backdrop--position:fixed;--digi--dialog--backdrop--opacity:1;--digi--dialog--backdrop--z--index:999;--digi--dialog--backdrop--left:0;--digi--dialog--backdrop--top:0;--digi--dialog--backdrop--width:100vw;--digi--dialog--backdrop--height:100vh;--digi--dialog--backdrop--display:flex;--digi--dialog--backdrop--justify--content:center;--digi--dialog--backdrop--align--items:center;--digi--dialog--close--button--display:grid;--digi--dialog--close--button--justify--content:end;--digi--dialog--close--button--margin--right:-1rem;--digi--dialog--button--container--display:flex;--digi--dialog--button--container--flex-wrap:wrap;--digi--dialog--button--container--gap:var(--digi--gutter--large);--digi--dialog--button--container--padding--top:var(--digi--gutter--largest-2);--digi--dialog--button--text--align--mobile:center;--digi--dialog--content--gutter:var(--digi--gutter--largest);--digi--dialog--content--margin:var(--digi--margin--large) auto;--digi--dialog--content--padding:var(--digi--padding--large);--digi--dialog--content--width--small:28.75rem;--digi--dialog--content--width--medium:42.1875rem;--digi--dialog--content--width--large:56.25rem;--digi--dialog--content--color--primary:var(--digi--color--text--primary);--digi--dialog--content--color--background--primary:var(--digi--color--background--primary);--digi--dialog--icon--color--primary:var(--digi--color--icon--primary);--digi--dialog--icon--color--primary--hover:var(--digi--color--icon--primary)}:host .digi-dialog{background:rgba(0, 0, 0, 0.7);overflow-x:hidden;overflow-y:auto;position:var(--digi--dialog--backdrop--position);opacity:var(--digi--dialog--backdrop--opacity);z-index:var(--digi--dialog--backdrop--z--index);left:var(--digi--dialog--backdrop--left);top:var(--digi--dialog--backdrop--top);width:var(--digi--dialog--backdrop--width);height:var(--digi--dialog--backdrop--height);display:var(--digi--dialog--backdrop--display);justify-content:var(--digi--dialog--backdrop--justify--content);align-items:var(--digi--dialog--backdrop--align--items);padding:var(--digi--padding--medium);box-sizing:border-box}:host .digi-dialog--primary{--DIGI--DIALOG--COLOR--BACKGROUND:var(\n    --digi--dialog--content--color--background--primary\n  );--DIGI--DIALOG--COLOR:var(--digi--dialog--content--color--primary);--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY:initial}:host .digi-dialog--secondary{--digi--dialog--content--color--secondary:var(\n    --digi--global--color--profile--white--base\n  );--digi--dialog--content--color--background--secondary:var(\n    --digi--global--color--profile--blue--base\n  );--DIGI--DIALOG--COLOR--BACKGROUND:var(\n    --digi--dialog--content--color--background--secondary\n  );--DIGI--DIALOG--COLOR:var(--digi--dialog--content--color--secondary);--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY:#b7b7ff;--digi--color--text--primary:var(--digi--dialog--content--color--secondary)}:host .digi-dialog--small{--DIGI--DIALOG--CONTENT--WIDTH:var(--digi--dialog--content--width--small)}:host .digi-dialog--medium{--DIGI--DIALOG--CONTENT--WIDTH:var(--digi--dialog--content--width--medium)}:host .digi-dialog--large{--DIGI--DIALOG--CONTENT--WIDTH:var(--digi--dialog--content--width--large)}:host .digi-dialog__keydown-handler{width:100%;max-height:100%}:host .digi-dialog__content{background:var(--DIGI--DIALOG--COLOR--BACKGROUND);color:var(--DIGI--DIALOG--COLOR);max-width:var(--DIGI--DIALOG--CONTENT--WIDTH);width:100%;margin:var(--digi--dialog--content--margin);padding:var(--digi--padding--smaller) var(--digi--dialog--content--padding) var(--digi--dialog--content--padding) var(--digi--dialog--content--padding);box-sizing:border-box}:host .digi-dialog__close-button{--digi--button--color--text--function--default:var(--DIGI--DIALOG--COLOR);--digi--button--color--text--function--hover:var(--DIGI--DIALOG--COLOR);--digi--button--color--icon--function--default:var(--digi--dialog--icon--color--primary);--digi--button--color--icon--function--hover:var(--digi--dialog--icon--color--primary--hover);display:var(--digi--dialog--close--button--display);justify-content:var(--digi--dialog--close--button--justify--content);margin-right:var(--digi--dialog--close--button--margin--right)}:host .digi-dialog__button-container{display:var(--digi--dialog--button--container--display);flex-wrap:var(--digi--dialog--button--container--flex-wrap);gap:var(--digi--dialog--button--container--gap);padding-top:var(--digi--dialog--button--container--padding--top)}:host .digi-dialog__button-container digi-button,:host .digi-dialog__button-container .digi-button--medium{text-align:var(--digi--dialog--button--text--align--mobile)}:host .digi-dialog__button-container digi-button :first-of-type,:host .digi-dialog__button-container .digi-button--medium :first-of-type{--digi--button--color--border--primary--default:var(--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY);--digi--button--color--border--primary--hover:var(--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY)}";
 const DigiDialogStyle0 = dialogCss;
@@ -282,11 +282,11 @@ const Dialog = /*@__PURE__*/ proxyCustomElement(class Dialog extends H {
         };
     }
     render() {
-        return (h(Host, { key: '6f74c149ed1d3265d436e22a1b115352b7860c0c', ref: (el) => {
+        return (h(Host, { key: '7645cdea8aa64030e5cdacc13d2b657ced71694d', ref: (el) => {
                 this._host = el;
-            } }, this.afShowDialog && (h("div", { key: '4f7895c5f43e0faef2c06826e555c55c50aa8af5', class: Object.assign({ 'digi-dialog': true }, this.cssModifiers) }, h("digi-util-keydown-handler", { key: '881985dd349d3f975e9680a5eb844ec046bf628d', onAfOnEsc: (e) => this.escHandler(e), onAfOnTab: (e) => this.tabHandler(e), onAfOnShiftTab: (e) => this.shiftHandler(e), class: "digi-dialog__keydown-handler" }, h("div", { key: '02ad87c54658da3c3adfbaac7768a87cc8e0d3c3', ref: (el) => {
+            } }, this.afShowDialog && (h("div", { key: '7956ce0de7909b54bd51a2a203f34239eea43f38', class: Object.assign({ 'digi-dialog': true }, this.cssModifiers) }, h("digi-util-keydown-handler", { key: 'd032d1a8b27b5cd88558c06d1a044dced2c0287c', onAfOnEsc: (e) => this.escHandler(e), onAfOnTab: (e) => this.tabHandler(e), onAfOnShiftTab: (e) => this.shiftHandler(e), class: "digi-dialog__keydown-handler" }, h("div", { key: '5eaa4f82217a657b8a956ca19620ce5ee4058651', ref: (el) => {
                 this._wrapper = el;
-            }, role: "dialog", "aria-modal": "true", class: "digi-dialog__content" }, h("digi-typography", { key: 'bcf1d9fa5f4594e6ebe544c65587e49872dcd65f' }, this.afCloseButtonText && (h("digi-button", { key: '0a3b2adbc992d1a79f36c055709bd5ac24e29e94', ref: (el) => (this._closeButton = el), class: "digi-dialog__close-button", afAriaLabel: this.afCloseButtonText, afSize: ButtonSize.MEDIUM, "af-variation": "function", onAfOnClick: (e) => this.closeDialog(e) }, this.afCloseButtonText, h("digi-icon-x", { key: 'ec51a6c5d7af7ae4a965211a96dac8c273fe608c', class: "digi-dialog__close-icon", slot: "icon-secondary" }))), h("slot", { key: 'e133694ca3fddaa700ce4e5693ad592e4f62f92d', name: "over-heading" }), this.afHeadingLevel && this.afHeading && (h(this.afHeadingLevel, { key: '3a77beeb5cb20112a78598e28df6f05d8ad7d84f', tabindex: "-1", ref: (el) => (this._dialogHeading = el) }, this.afHeading)), h("slot", { key: '80e5e86fe0fdaa6594a866ce9a5be09c35406e9f' }), h("div", { key: 'd80c83821f6da6e1211f15fbd15cba56224325ee', ref: (el) => (this._buttonContainer = el), class: "digi-dialog__button-container" }, this.afSecondaryButtonText && (h("digi-button", { key: 'fc15801b25df9926bb0dbbb00edfded78300ec81', ref: (el) => (this._secondaryButton = el), afVariation: ButtonVariation.SECONDARY, onAfOnClick: (e) => this.secondaryClickHandler(e) }, this.afSecondaryButtonText)), this.afPrimaryButtonText && (h("digi-button", { key: '34c614b44e69353c59539510db04e8f8c3894ff1', ref: (el) => (this._primaryButton = el), afVariation: ButtonVariation.PRIMARY, onAfOnClick: (e) => this.primaryClickHandler(e) }, this.afPrimaryButtonText))))))))));
+            }, role: "dialog", "aria-modal": "true", class: "digi-dialog__content" }, h("digi-typography", { key: '08f9045a7fedc3127593a92e85dbdb08243cd7aa' }, this.afCloseButtonText && (h("digi-button", { key: '297e28a9840d4365a98b41d7ce0b704ba20c3632', ref: (el) => (this._closeButton = el), class: "digi-dialog__close-button", afAriaLabel: this.afCloseButtonText, afSize: ButtonSize.MEDIUM, "af-variation": "function", onAfOnClick: (e) => this.closeDialog(e) }, this.afCloseButtonText, h("digi-icon-x", { key: 'b21d15d15f96f30cfeba0cc952c99918dbe92f0d', class: "digi-dialog__close-icon", slot: "icon-secondary" }))), h("slot", { key: '9a17c4c0accd79502cd53d4f1a9b40bd24aa8f63', name: "over-heading" }), this.afHeadingLevel && this.afHeading && (h(this.afHeadingLevel, { key: '797db07e133f8e424972a22dc4cd9c0fff87c1ca', tabindex: "-1", ref: (el) => (this._dialogHeading = el) }, this.afHeading)), h("slot", { key: '228d808404637c354e80264d9a16accd07ef7038' }), h("div", { key: '3026af7da362dae66103f8bee7d0cf82d4b9d9bc', ref: (el) => (this._buttonContainer = el), class: "digi-dialog__button-container" }, this.afSecondaryButtonText && (h("digi-button", { key: '5799f15bee8a093981c7a2ee1746c3ebf5bcaaa4', ref: (el) => (this._secondaryButton = el), afVariation: ButtonVariation.SECONDARY, onAfOnClick: (e) => this.secondaryClickHandler(e) }, this.afSecondaryButtonText)), this.afPrimaryButtonText && (h("digi-button", { key: '78aa226ed8b00565138cdc52c50dbfc719c7775a', ref: (el) => (this._primaryButton = el), afVariation: ButtonVariation.PRIMARY, onAfOnClick: (e) => this.primaryClickHandler(e) }, this.afPrimaryButtonText))))))))));
     }
     get hostElement() { return this; }
     static get style() { return DigiDialogStyle0; }