@kirbydesign/designsystem 5.0.13 → 5.0.17

package/fesm2015/kirbydesign-designsystem.js

@@ -3337,16 +3337,6 @@ const CHART_TYPES_CONFIG = {
                         },
                     },
                 },
-                // A failed attempt to get local typings working.
-                // The chartjs-plugin-marker is rewritten to not
-                // having to rely on own plugin settings, but using
-                // x-axis type time instead.
-                // @todo candidate for refactor once solved.
-                // marker: {
-                //   line: {
-                //     color: getThemeColorHexString('black-base'),
-                //   }
-                // },
                 datalabels: {
                     backgroundColor: (context) => context.dataset.borderColor,
                     color: getThemeColorHexString$1('white'),
@@ -3394,7 +3384,11 @@ ChartConfigService.decorators = [
     { type: Injectable }
 ];
 
-// The marker pluin was heavily inspired by https://chartjs-plugin-crosshair.netlify.app
+/*
+  The marker plugin is heavily inspired by https://chartjs-plugin-crosshair.netlify.app
+  The project appears stale and only the vertical line feature is needed
+   part of the plugin that was actually needed is implemented here.
+*/
 var defaultOptions = {
     line: {
         color: 'black',
@@ -3406,14 +3400,10 @@ var defaultOptions = {
     },
 };
 const hasMarkerConfiguration = (chart) => {
-    var _a, _b, _c;
-    // using another plugins options is not ideal, so the issue with marker plugin
-    // should be resolved. As of right now the only chart that uses
-    // tooltip is stock charts.
-    return chart.config.options.scales.x && ((_c = (_b = (_a = chart.config.options) === null || _a === void 0 ? void 0 : _a.plugins) === null || _b === void 0 ? void 0 : _b.tooltip) === null || _c === void 0 ? void 0 : _c.enabled);
-    // @todo when resolving the typings issue with the markerplugin,
-    // this is a better conditional.
-    // return chart.config.options.scales.x && chart.config.options.plugins.marker
+    /*
+      Hacky solution. Should be fixed in this issue: https://github.com/kirbydesign/designsystem/issues/1967
+    */
+    return chart.data.datasets.some((dataset) => { var _a; return !!((_a = dataset === null || dataset === void 0 ? void 0 : dataset.kirbyOptions) === null || _a === void 0 ? void 0 : _a.isStockChart); });
 };
 const ɵ0$7 = hasMarkerConfiguration;
 var MarkerPlugin = {
@@ -3904,6 +3894,15 @@ class ChartJSService {
         let datasets = isNumberArray(data) ? [{ data }] : data;
         if (this.highlightedElements)
             this.addHighlightedElementsToDatasets(this.highlightedElements, datasets);
+        /*
+           Hacky solution. Should be fixed in this issue:
+          https://github.com/kirbydesign/designsystem/issues/1967
+        */
+        if (this.chartType === 'stock') {
+            datasets.forEach((dataset) => {
+                dataset.kirbyOptions = Object.assign(Object.assign({}, dataset.kirbyOptions), { isStockChart: true });
+            });
+        }
         return datasets;
     }
     /**
@@ -5576,7 +5575,7 @@ DropdownComponent.OPEN_DELAY_IN_MS = 100;
 DropdownComponent.decorators = [
     { type: Component, args: [{
                 selector: 'kirby-dropdown',
-                template: "<button\n  kirby-button\n  [size]=\"size\"\n  [attentionLevel]=\"isOpen ? attentionLevelOpen : attentionLevel\"\n  tabindex=\"-1\"\n  (click)=\"onToggle($event)\"\n  (mousedown)=\"onButtonMouseEvent($event)\"\n  [disabled]=\"disabled\"\n>\n  <span class=\"text\">{{ selectedText || placeholder }}</span>\n  <kirby-icon [name]=\"isOpen ? 'arrow-up' : 'arrow-down'\"></kirby-icon>\n</button>\n\n<ng-container *ngTemplateOutlet=\"usePopover ? popoverTemplate : itemWrapperTemplate\"></ng-container>\n\n<ng-template #popoverTemplate>\n  <kirby-popover [target]=\"buttonElement\" [popout]=\"popout\" (willHide)=\"_onPopoverWillHide()\">\n    <ng-container *ngTemplateOutlet=\"itemWrapperTemplate\"></ng-container>\n  </kirby-popover>\n</ng-template>\n\n<ng-template #itemWrapperTemplate>\n  <kirby-card>\n    <ng-container *ngFor=\"let item of items; let i = index\">\n      <ng-container\n        *ngTemplateOutlet=\"\n          itemTemplate || defaultItemTemplate;\n          context: { $implicit: item, selected: i === selectedIndex, index: i }\n        \"\n      ></ng-container>\n    </ng-container>\n  </kirby-card>\n</ng-template>\n\n<ng-template #defaultItemTemplate let-item let-selected=\"selected\" let-index=\"index\">\n  <kirby-item [selectable]=\"true\" [selected]=\"selected\" (click)=\"onItemSelect(index)\" role=\"option\">\n    <!-- Tabindex fixes issue with popover dropdown not working in safari -->\n    <h3 tabindex=\"0\">{{ getTextFromItem(item) }}</h3>\n    <kirby-icon *ngIf=\"selected\" name=\"checkmark-selected\" slot=\"end\"></kirby-icon>\n  </kirby-item>\n</ng-template>\n",
+                template: "<button\n  kirby-button\n  [size]=\"size\"\n  [attentionLevel]=\"isOpen ? attentionLevelOpen : attentionLevel\"\n  tabindex=\"-1\"\n  (click)=\"onToggle($event)\"\n  (mousedown)=\"onButtonMouseEvent($event)\"\n  [disabled]=\"disabled\"\n  type=\"button\"\n>\n  <span class=\"text\">{{ selectedText || placeholder }}</span>\n  <kirby-icon [name]=\"isOpen ? 'arrow-up' : 'arrow-down'\"></kirby-icon>\n</button>\n\n<ng-container *ngTemplateOutlet=\"usePopover ? popoverTemplate : itemWrapperTemplate\"></ng-container>\n\n<ng-template #popoverTemplate>\n  <kirby-popover [target]=\"buttonElement\" [popout]=\"popout\" (willHide)=\"_onPopoverWillHide()\">\n    <ng-container *ngTemplateOutlet=\"itemWrapperTemplate\"></ng-container>\n  </kirby-popover>\n</ng-template>\n\n<ng-template #itemWrapperTemplate>\n  <kirby-card>\n    <ng-container *ngFor=\"let item of items; let i = index\">\n      <ng-container\n        *ngTemplateOutlet=\"\n          itemTemplate || defaultItemTemplate;\n          context: { $implicit: item, selected: i === selectedIndex, index: i }\n        \"\n      ></ng-container>\n    </ng-container>\n  </kirby-card>\n</ng-template>\n\n<ng-template #defaultItemTemplate let-item let-selected=\"selected\" let-index=\"index\">\n  <kirby-item [selectable]=\"true\" [selected]=\"selected\" (click)=\"onItemSelect(index)\" role=\"option\">\n    <!-- Tabindex fixes issue with popover dropdown not working in safari -->\n    <h3 tabindex=\"0\">{{ getTextFromItem(item) }}</h3>\n    <kirby-icon *ngIf=\"selected\" name=\"checkmark-selected\" slot=\"end\"></kirby-icon>\n  </kirby-item>\n</ng-template>\n",
                 providers: [
                     {
                         provide: NG_VALUE_ACCESSOR,