@xiriframework/xiri-ng 0.2.39 → 0.2.41

package/fesm2022/xiriframework-xiri-ng.mjs

@@ -5154,11 +5154,11 @@ class XiriInfopointComponent {
         this.compact = computed(() => !!this.settings().compact, ...(ngDevMode ? [{ debugName: "compact" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriInfopointComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: XiriInfopointComponent, isStandalone: true, selector: "xiri-infopoint", inputs: { settings: { classPropertyName: "settings", publicName: "settings", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.compact": "compact()" } }, ngImport: i0, template: "<div class=\"point\" [class.isLink]=\"settings().url\" [routerLink]=\"settings().url\" [queryParams]=\"settings().urlParams\">\n\t@if (compact()) {\n\t\t<div class=\"card xiri-infopoint-flat\" [class.dense]=\"settings().dense\">\n\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t} @else {\n\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div class=\"right\">\n\t\t\t\t@if (settings().text) {\n\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t}\n\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t</div>\n\t\t</div>\n\t} @else {\n\t\t<mat-card class=\"card mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t<mat-card-content [class.dense]=\"settings().dense\">\n\t\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<div class=\"right\">\n\t\t\t\t\t@if (settings().text) {\n\t\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t\t}\n\t\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t\t</div>\n\t\t\t</mat-card-content>\n\t\t</mat-card>\n\t}\n</div>\n", styles: [".point mat-card{background-color:var(--surface, #FFFFFF)}.point mat-card-content{display:flex;flex-direction:row;align-items:center;overflow:hidden}.point mat-card-content.dense{padding:6px 16px}:host(.compact) .point .xiri-infopoint-flat{display:flex;flex-direction:row;align-items:center;overflow:hidden;background:transparent;box-shadow:none;padding:var(--xiri-spacing-sm, 8px)}:host(.compact) .point .xiri-infopoint-flat.dense{padding:4px 8px}.point.isLink{cursor:pointer}.point.isLink mat-card{transition:background-color var(--xiri-duration-fast, .15s) var(--xiri-easing-standard, cubic-bezier(.4, 0, .2, 1))}.point.isLink:hover mat-card{background-color:var(--surface-variant, #DEE3EB)}.right{text-align:right;flex-grow:1;display:flex;flex-direction:column;justify-content:center;padding-left:7px}.right .text{color:var(--on-surface-variant, rgba(0, 0, 0, .54));font-size:var(--xiri-font-size-label)}.right .info{font-size:var(--xiri-font-size-display);font-weight:500}.icon{width:64px;min-width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center}.icon mat-icon{transform:scale(1.5)}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: MatCardContent, selector: "mat-card-content" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: XiriInfopointComponent, isStandalone: true, selector: "xiri-infopoint", inputs: { settings: { classPropertyName: "settings", publicName: "settings", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.compact": "compact()" } }, ngImport: i0, template: "<div class=\"point\" [class.isLink]=\"settings().url\" [routerLink]=\"settings().url\" [queryParams]=\"settings().urlParams\">\n\t@if (compact()) {\n\t\t<div class=\"card xiri-infopoint-flat\" [class.dense]=\"settings().dense\">\n\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t} @else {\n\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div class=\"right\">\n\t\t\t\t@if (settings().text) {\n\t\t\t\t\t@if (settings().html) {\n\t\t\t\t\t\t<div class=\"text\" [innerHtml]=\"settings().text | safeHtml\"></div>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@if (settings().html) {\n\t\t\t\t\t<div class=\"info\" [innerHtml]=\"settings().info | safeHtml\"></div>\n\t\t\t\t} @else {\n\t\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t} @else {\n\t\t<mat-card class=\"card mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t<mat-card-content [class.dense]=\"settings().dense\">\n\t\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<div class=\"right\">\n\t\t\t\t\t@if (settings().text) {\n\t\t\t\t\t\t@if (settings().html) {\n\t\t\t\t\t\t\t<div class=\"text\" [innerHtml]=\"settings().text | safeHtml\"></div>\n\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t@if (settings().html) {\n\t\t\t\t\t\t<div class=\"info\" [innerHtml]=\"settings().info | safeHtml\"></div>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</mat-card-content>\n\t\t</mat-card>\n\t}\n</div>\n", styles: [".point mat-card{background-color:var(--surface, #FFFFFF)}.point mat-card-content{display:flex;flex-direction:row;align-items:center;overflow:hidden}.point mat-card-content.dense{padding:6px 16px}:host(.compact) .point .xiri-infopoint-flat{display:flex;flex-direction:row;align-items:center;overflow:hidden;background:transparent;box-shadow:none;padding:var(--xiri-spacing-sm, 8px)}:host(.compact) .point .xiri-infopoint-flat.dense{padding:4px 8px}.point.isLink{cursor:pointer}.point.isLink mat-card{transition:background-color var(--xiri-duration-fast, .15s) var(--xiri-easing-standard, cubic-bezier(.4, 0, .2, 1))}.point.isLink:hover mat-card{background-color:var(--surface-variant, #DEE3EB)}.right{text-align:right;flex-grow:1;display:flex;flex-direction:column;justify-content:center;padding-left:7px}.right .text{color:var(--on-surface-variant, rgba(0, 0, 0, .54));font-size:var(--xiri-font-size-label)}.right .info{font-size:var(--xiri-font-size-display);font-weight:500}.icon{width:64px;min-width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center}.icon mat-icon{transform:scale(1.5)}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: MatCardContent, selector: "mat-card-content" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: SafehtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriInfopointComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'xiri-infopoint', imports: [RouterLink, MatCard, MatCardContent, MatIcon], changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class.compact]': 'compact()' }, template: "<div class=\"point\" [class.isLink]=\"settings().url\" [routerLink]=\"settings().url\" [queryParams]=\"settings().urlParams\">\n\t@if (compact()) {\n\t\t<div class=\"card xiri-infopoint-flat\" [class.dense]=\"settings().dense\">\n\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t} @else {\n\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div class=\"right\">\n\t\t\t\t@if (settings().text) {\n\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t}\n\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t</div>\n\t\t</div>\n\t} @else {\n\t\t<mat-card class=\"card mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t<mat-card-content [class.dense]=\"settings().dense\">\n\t\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<div class=\"right\">\n\t\t\t\t\t@if (settings().text) {\n\t\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t\t}\n\t\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t\t</div>\n\t\t\t</mat-card-content>\n\t\t</mat-card>\n\t}\n</div>\n", styles: [".point mat-card{background-color:var(--surface, #FFFFFF)}.point mat-card-content{display:flex;flex-direction:row;align-items:center;overflow:hidden}.point mat-card-content.dense{padding:6px 16px}:host(.compact) .point .xiri-infopoint-flat{display:flex;flex-direction:row;align-items:center;overflow:hidden;background:transparent;box-shadow:none;padding:var(--xiri-spacing-sm, 8px)}:host(.compact) .point .xiri-infopoint-flat.dense{padding:4px 8px}.point.isLink{cursor:pointer}.point.isLink mat-card{transition:background-color var(--xiri-duration-fast, .15s) var(--xiri-easing-standard, cubic-bezier(.4, 0, .2, 1))}.point.isLink:hover mat-card{background-color:var(--surface-variant, #DEE3EB)}.right{text-align:right;flex-grow:1;display:flex;flex-direction:column;justify-content:center;padding-left:7px}.right .text{color:var(--on-surface-variant, rgba(0, 0, 0, .54));font-size:var(--xiri-font-size-label)}.right .info{font-size:var(--xiri-font-size-display);font-weight:500}.icon{width:64px;min-width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center}.icon mat-icon{transform:scale(1.5)}\n"] }]
+            args: [{ selector: 'xiri-infopoint', imports: [RouterLink, MatCard, MatCardContent, MatIcon, SafehtmlPipe], changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class.compact]': 'compact()' }, template: "<div class=\"point\" [class.isLink]=\"settings().url\" [routerLink]=\"settings().url\" [queryParams]=\"settings().urlParams\">\n\t@if (compact()) {\n\t\t<div class=\"card xiri-infopoint-flat\" [class.dense]=\"settings().dense\">\n\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t} @else {\n\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div class=\"right\">\n\t\t\t\t@if (settings().text) {\n\t\t\t\t\t@if (settings().html) {\n\t\t\t\t\t\t<div class=\"text\" [innerHtml]=\"settings().text | safeHtml\"></div>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@if (settings().html) {\n\t\t\t\t\t<div class=\"info\" [innerHtml]=\"settings().info | safeHtml\"></div>\n\t\t\t\t} @else {\n\t\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t</div>\n\t} @else {\n\t\t<mat-card class=\"card mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t<mat-card-content [class.dense]=\"settings().dense\">\n\t\t\t\t<div class=\"icon\" [class]=\"settings().iconColor\">\n\t\t\t\t\t@if (settings().iconSet) {\n\t\t\t\t\t\t<mat-icon [fontSet]=\"settings().iconSet\">{{ settings().icon }}</mat-icon>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<mat-icon>{{ settings().icon }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<div class=\"right\">\n\t\t\t\t\t@if (settings().text) {\n\t\t\t\t\t\t@if (settings().html) {\n\t\t\t\t\t\t\t<div class=\"text\" [innerHtml]=\"settings().text | safeHtml\"></div>\n\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t<div class=\"text\">{{ settings().text }}</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t@if (settings().html) {\n\t\t\t\t\t\t<div class=\"info\" [innerHtml]=\"settings().info | safeHtml\"></div>\n\t\t\t\t\t} @else {\n\t\t\t\t\t\t<div class=\"info\">{{ settings().info }}</div>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</mat-card-content>\n\t\t</mat-card>\n\t}\n</div>\n", styles: [".point mat-card{background-color:var(--surface, #FFFFFF)}.point mat-card-content{display:flex;flex-direction:row;align-items:center;overflow:hidden}.point mat-card-content.dense{padding:6px 16px}:host(.compact) .point .xiri-infopoint-flat{display:flex;flex-direction:row;align-items:center;overflow:hidden;background:transparent;box-shadow:none;padding:var(--xiri-spacing-sm, 8px)}:host(.compact) .point .xiri-infopoint-flat.dense{padding:4px 8px}.point.isLink{cursor:pointer}.point.isLink mat-card{transition:background-color var(--xiri-duration-fast, .15s) var(--xiri-easing-standard, cubic-bezier(.4, 0, .2, 1))}.point.isLink:hover mat-card{background-color:var(--surface-variant, #DEE3EB)}.right{text-align:right;flex-grow:1;display:flex;flex-direction:column;justify-content:center;padding-left:7px}.right .text{color:var(--on-surface-variant, rgba(0, 0, 0, .54));font-size:var(--xiri-font-size-label)}.right .info{font-size:var(--xiri-font-size-display);font-weight:500}.icon{width:64px;min-width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center}.icon mat-icon{transform:scale(1.5)}\n"] }]
         }], propDecorators: { settings: [{ type: i0.Input, args: [{ isSignal: true, alias: "settings", required: true }] }] } });
 
 class XiriListComponent {
@@ -5617,7 +5617,7 @@ class XiriDynComponentComponent {
         }, ...(ngDevMode ? [{ debugName: "dataInt" }] : /* istanbul ignore next */ []));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriDynComponentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: XiriDynComponentComponent, isStandalone: true, selector: "xiri-dyncomponent", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, filterData: { classPropertyName: "filterData", publicName: "filterData", isSignal: true, isRequired: false, transformFunction: null }, dyncomponent: { classPropertyName: "dyncomponent", publicName: "dyncomponent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@for (obj of dataInt(); track obj.id) {\n\n\t@switch (obj.type) {\n\t\t@case ('card') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-card [settings]=\"obj.data\"></xiri-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('buttonline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-buttonline [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-buttonline>\n\t\t\t</div>\n\t\t}\n\t\t@case ('table') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-table [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-table>\n\t\t\t</div>\n\t\t}\n\t\t@case ('cardlink') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-cardlink [settings]=\"obj.data\"></xiri-cardlink>\n\t\t\t</div>\n\t\t}\n\t\t@case ('links') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-links [settings]=\"obj.data\"></xiri-links>\n\t\t\t</div>\n\t\t}\n\t\t@case ('form') {\n\t\t\t<div [class]=\"obj.display || 'xcol form'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<mat-card class=\"mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t\t\t@if (obj.data.header) {\n\t\t\t\t\t\t<mat-card-header>\n\t\t\t\t\t\t\t<mat-card-title>{{ obj.data.header }}</mat-card-title>\n\t\t\t\t\t\t</mat-card-header>\n\t\t\t\t\t}\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<xiri-form [settings]=\"obj.data\"></xiri-form>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</mat-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('query') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-query [settings]=\"obj.data\" [dyncomponent]=\"selfdyncomponent\"></xiri-query>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stepper') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stepper [settings]=\"obj.data\"></xiri-stepper>\n\t\t\t</div>\n\t\t}\n\t\t@case ('header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-header [settings]=\"obj.data\"></xiri-header>\n\t\t\t</div>\n\t\t}\n\t\t@case ('list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-list [settings]=\"obj.data\"></xiri-list>\n\t\t\t</div>\n\t\t}\n\t\t@case ('spacer') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('container') {\n\t\t\t@if (obj.data) {\n\t\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t\t<xiri-dyncomponent [data]=\"obj.data\" [dyncomponent]=\"dyncomponent()\" class=\"row\"></xiri-dyncomponent>\n\t\t\t\t</div>\n\t\t\t}\n\t\t}\n\t\t@case ('infopoint') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-infopoint [settings]=\"obj.data\"></xiri-infopoint>\n\t\t\t</div>\n\t\t}\n\t\t@case ('multiprogress') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-multiprogress [settings]=\"obj.data\"></xiri-multiprogress> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('imagetext') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-imagetext [settings]=\"obj.data\"></xiri-imagetext> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tabs') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-tabs [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-tabs>\n\t\t\t</div>\n\t\t}\n\t\t@case ('expansion') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-expansion [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-expansion>\n\t\t\t</div>\n\t\t}\n\t\t@case ('infotext') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"infotext\">{{ obj.data.text }}</div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('html') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"html\" [innerHtml]=\"obj.data.html | safeHtml\"></div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stat [settings]=\"obj.data\"></xiri-stat>\n\t\t\t</div>\n\t\t}\n\t\t@case ('empty-state') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-empty-state [settings]=\"obj.data\"></xiri-empty-state>\n\t\t\t</div>\n\t\t}\n\t\t@case ('timeline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-timeline [settings]=\"obj.data\"></xiri-timeline> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('page-header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-page-header [settings]=\"obj.data\"></xiri-page-header> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('section') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-section [settings]=\"obj.data\" [dyncomponent]=\"dyncomponent()\"></xiri-section>\n\t\t\t</div>\n\t\t}\n\t\t@case ('divider') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-divider [settings]=\"obj.data\"></xiri-divider> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat-grid') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-stat-grid [settings]=\"obj.data\"></xiri-stat-grid> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('toolbar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-toolbar [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-toolbar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('description-list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-description-list [settings]=\"obj.data\"></xiri-description-list> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('barchart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-barchart [mode]=\"obj.mode\" [settings]=\"obj.data\"></xiri-barchart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('linechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-linechart [settings]=\"obj.data\"></xiri-linechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('piechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-piechart [settings]=\"obj.data\"></xiri-piechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gaugechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gaugechart [settings]=\"obj.data\"></xiri-gaugechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('heatmap') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-heatmap [settings]=\"obj.data\"></xiri-heatmap> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('calendar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-calendar [settings]=\"obj.data\"></xiri-calendar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tree') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-tree [settings]=\"obj.data\"></xiri-tree> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('sankey') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-sankey [settings]=\"obj.data\"></xiri-sankey> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gantt') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gantt [settings]=\"obj.data\"></xiri-gantt> }\n\t\t\t</div>\n\t\t}\n\t\t@default {\n\t\t\t<ng-container *ngTemplateOutlet=\"dyncomponent() || defaultComponentUnknown; context: { $implicit: obj, filterData: filterData() }\"></ng-container>\n\t\t}\n\t}\n}\n\n<ng-template #selfdyncomponent let-obj>\n\t<xiri-dyncomponent [data]=\"obj.data\" [filterData]=\"obj.filterData\" [dyncomponent]=\"dyncomponent()\" class=\"xrow\"></xiri-dyncomponent>\n</ng-template>\n<ng-template #defaultComponentUnknown let-obj>\n\t<div class=\"xcol\">unknown type: {{ obj.type }}</div>\n</ng-template>\n", styles: [".spacer.double{padding-top:1rem}.form mat-card-header{padding-bottom:1rem}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => XiriDynComponentComponent), selector: "xiri-dyncomponent", inputs: ["data", "filterData", "dyncomponent"] }, { kind: "component", type: i0.forwardRef(() => XiriCardComponent), selector: "xiri-card", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriButtonlineComponent), selector: "xiri-buttonline", inputs: ["settings", "disabled", "filterData"], outputs: ["result"] }, { kind: "component", type: i0.forwardRef(() => XiriTableComponent), selector: "xiri-table", inputs: ["dyncomponent", "settings", "filterData"], outputs: ["clickedRow"] }, { kind: "component", type: i0.forwardRef(() => XiriCardlinkComponent), selector: "xiri-cardlink", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriLinksComponent), selector: "xiri-links", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => MatCard), selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i0.forwardRef(() => MatCardHeader), selector: "mat-card-header" }, { kind: "directive", type: i0.forwardRef(() => MatCardTitle), selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i0.forwardRef(() => MatCardContent), selector: "mat-card-content" }, { kind: "component", type: i0.forwardRef(() => XiriFormComponent), selector: "xiri-form", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriQueryComponent), selector: "xiri-query", inputs: ["settings", "dyncomponent"], outputs: ["change"] }, { kind: "component", type: i0.forwardRef(() => XiriStepperComponent), selector: "xiri-stepper", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriHeaderComponent), selector: "xiri-header", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriListComponent), selector: "xiri-list", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriInfopointComponent), selector: "xiri-infopoint", inputs: ["settings"] }, { kind: "directive", type: i0.forwardRef(() => NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => XiriTabsComponent), selector: "xiri-tabs", inputs: ["settings", "filterData", "dyncomponent"] }, { kind: "component", type: i0.forwardRef(() => XiriExpansionComponent), selector: "xiri-expansion", inputs: ["settings", "filterData", "dyncomponent"] }, { kind: "component", type: i0.forwardRef(() => XiriStatComponent), selector: "xiri-stat", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriEmptyStateComponent), selector: "xiri-empty-state", inputs: ["settings"], outputs: ["buttonResult"] }, { kind: "component", type: i0.forwardRef(() => XiriSectionComponent), selector: "xiri-section", inputs: ["settings", "dyncomponent"] }, { kind: "pipe", type: i0.forwardRef(() => SafehtmlPipe), name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [Promise.resolve().then(function () { return multiprogress_component; }).then(m => m.XiriMultiprogressComponent)], () => [Promise.resolve().then(function () { return imagetext_component; }).then(m => m.XiriImagetextComponent)], () => [Promise.resolve().then(function () { return timeline_component; }).then(m => m.XiriTimelineComponent)], () => [Promise.resolve().then(function () { return pageHeader_component; }).then(m => m.XiriPageHeaderComponent)], () => [Promise.resolve().then(function () { return divider_component; }).then(m => m.XiriDividerComponent)], () => [Promise.resolve().then(function () { return statGrid_component; }).then(m => m.XiriStatGridComponent)], () => [Promise.resolve().then(function () { return toolbar_component; }).then(m => m.XiriToolbarComponent)], () => [Promise.resolve().then(function () { return descriptionList_component; }).then(m => m.XiriDescriptionListComponent)], () => [Promise.resolve().then(function () { return barchart_component; }).then(m => m.XiriBarChartComponent)], () => [Promise.resolve().then(function () { return linechart_component; }).then(m => m.XiriLineChartComponent)], () => [Promise.resolve().then(function () { return piechart_component; }).then(m => m.XiriPieChartComponent)], () => [Promise.resolve().then(function () { return gaugechart_component; }).then(m => m.XiriGaugeChartComponent)], () => [Promise.resolve().then(function () { return heatmap_component; }).then(m => m.XiriHeatmapComponent)], () => [Promise.resolve().then(function () { return calendar_component; }).then(m => m.XiriCalendarComponent)], () => [Promise.resolve().then(function () { return tree_component; }).then(m => m.XiriTreeComponent)], () => [Promise.resolve().then(function () { return sankey_component; }).then(m => m.XiriSankeyComponent)], () => [Promise.resolve().then(function () { return gantt_component; }).then(m => m.XiriGanttComponent)]] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: XiriDynComponentComponent, isStandalone: true, selector: "xiri-dyncomponent", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, filterData: { classPropertyName: "filterData", publicName: "filterData", isSignal: true, isRequired: false, transformFunction: null }, dyncomponent: { classPropertyName: "dyncomponent", publicName: "dyncomponent", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@for (obj of dataInt(); track obj.id) {\n\n\t@switch (obj.type) {\n\t\t@case ('card') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-card [settings]=\"obj.data\"></xiri-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('buttonline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-buttonline [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-buttonline>\n\t\t\t</div>\n\t\t}\n\t\t@case ('table') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-table [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-table>\n\t\t\t</div>\n\t\t}\n\t\t@case ('cardlink') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-cardlink [settings]=\"obj.data\"></xiri-cardlink>\n\t\t\t</div>\n\t\t}\n\t\t@case ('links') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-links [settings]=\"obj.data\"></xiri-links>\n\t\t\t</div>\n\t\t}\n\t\t@case ('form') {\n\t\t\t<div [class]=\"obj.display || 'xcol form'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<mat-card class=\"mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t\t\t@if (obj.data.header) {\n\t\t\t\t\t\t<mat-card-header>\n\t\t\t\t\t\t\t<mat-card-title>{{ obj.data.header }}</mat-card-title>\n\t\t\t\t\t\t</mat-card-header>\n\t\t\t\t\t}\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<xiri-form [settings]=\"obj.data\"></xiri-form>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</mat-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('query') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-query [settings]=\"obj.data\" [dyncomponent]=\"selfdyncomponent\"></xiri-query>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stepper') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stepper [settings]=\"obj.data\"></xiri-stepper>\n\t\t\t</div>\n\t\t}\n\t\t@case ('header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-header [settings]=\"obj.data\"></xiri-header>\n\t\t\t</div>\n\t\t}\n\t\t@case ('list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-list [settings]=\"obj.data\"></xiri-list>\n\t\t\t</div>\n\t\t}\n\t\t@case ('spacer') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('container') {\n\t\t\t@if (obj.data) {\n\t\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t\t<xiri-dyncomponent [data]=\"obj.data\" [dyncomponent]=\"dyncomponent()\" class=\"row\"></xiri-dyncomponent>\n\t\t\t\t</div>\n\t\t\t}\n\t\t}\n\t\t@case ('infopoint') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-infopoint [settings]=\"obj.data\"></xiri-infopoint>\n\t\t\t</div>\n\t\t}\n\t\t@case ('multiprogress') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-multiprogress [settings]=\"obj.data\"></xiri-multiprogress> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('imagetext') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-imagetext [settings]=\"obj.data\"></xiri-imagetext> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tabs') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-tabs [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-tabs>\n\t\t\t</div>\n\t\t}\n\t\t@case ('expansion') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-expansion [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-expansion>\n\t\t\t</div>\n\t\t}\n\t\t@case ('infotext') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@if (obj.data.html) {\n\t\t\t\t\t<div class=\"infotext\" [innerHtml]=\"obj.data.text | safeHtml\"></div>\n\t\t\t\t} @else {\n\t\t\t\t\t<div class=\"infotext\">{{ obj.data.text }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@case ('html') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"html\" [innerHtml]=\"obj.data.html | safeHtml\"></div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stat [settings]=\"obj.data\"></xiri-stat>\n\t\t\t</div>\n\t\t}\n\t\t@case ('empty-state') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-empty-state [settings]=\"obj.data\"></xiri-empty-state>\n\t\t\t</div>\n\t\t}\n\t\t@case ('timeline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-timeline [settings]=\"obj.data\"></xiri-timeline> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('page-header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-page-header [settings]=\"obj.data\"></xiri-page-header> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('section') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-section [settings]=\"obj.data\" [dyncomponent]=\"dyncomponent()\"></xiri-section>\n\t\t\t</div>\n\t\t}\n\t\t@case ('divider') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-divider [settings]=\"obj.data\"></xiri-divider> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat-grid') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-stat-grid [settings]=\"obj.data\"></xiri-stat-grid> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('toolbar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-toolbar [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-toolbar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('description-list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-description-list [settings]=\"obj.data\"></xiri-description-list> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('barchart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-barchart [mode]=\"obj.mode\" [settings]=\"obj.data\"></xiri-barchart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('linechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-linechart [settings]=\"obj.data\"></xiri-linechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('piechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-piechart [settings]=\"obj.data\"></xiri-piechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gaugechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gaugechart [settings]=\"obj.data\"></xiri-gaugechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('heatmap') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-heatmap [settings]=\"obj.data\"></xiri-heatmap> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('calendar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-calendar [settings]=\"obj.data\"></xiri-calendar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tree') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-tree [settings]=\"obj.data\"></xiri-tree> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('sankey') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-sankey [settings]=\"obj.data\"></xiri-sankey> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gantt') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gantt [settings]=\"obj.data\"></xiri-gantt> }\n\t\t\t</div>\n\t\t}\n\t\t@default {\n\t\t\t<ng-container *ngTemplateOutlet=\"dyncomponent() || defaultComponentUnknown; context: { $implicit: obj, filterData: filterData() }\"></ng-container>\n\t\t}\n\t}\n}\n\n<ng-template #selfdyncomponent let-obj>\n\t<xiri-dyncomponent [data]=\"obj.data\" [filterData]=\"obj.filterData\" [dyncomponent]=\"dyncomponent()\" class=\"xrow\"></xiri-dyncomponent>\n</ng-template>\n<ng-template #defaultComponentUnknown let-obj>\n\t<div class=\"xcol\">unknown type: {{ obj.type }}</div>\n</ng-template>\n", styles: [".spacer.double{padding-top:1rem}.form mat-card-header{padding-bottom:1rem}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => XiriDynComponentComponent), selector: "xiri-dyncomponent", inputs: ["data", "filterData", "dyncomponent"] }, { kind: "component", type: i0.forwardRef(() => XiriCardComponent), selector: "xiri-card", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriButtonlineComponent), selector: "xiri-buttonline", inputs: ["settings", "disabled", "filterData"], outputs: ["result"] }, { kind: "component", type: i0.forwardRef(() => XiriTableComponent), selector: "xiri-table", inputs: ["dyncomponent", "settings", "filterData"], outputs: ["clickedRow"] }, { kind: "component", type: i0.forwardRef(() => XiriCardlinkComponent), selector: "xiri-cardlink", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriLinksComponent), selector: "xiri-links", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => MatCard), selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i0.forwardRef(() => MatCardHeader), selector: "mat-card-header" }, { kind: "directive", type: i0.forwardRef(() => MatCardTitle), selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "directive", type: i0.forwardRef(() => MatCardContent), selector: "mat-card-content" }, { kind: "component", type: i0.forwardRef(() => XiriFormComponent), selector: "xiri-form", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriQueryComponent), selector: "xiri-query", inputs: ["settings", "dyncomponent"], outputs: ["change"] }, { kind: "component", type: i0.forwardRef(() => XiriStepperComponent), selector: "xiri-stepper", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriHeaderComponent), selector: "xiri-header", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriListComponent), selector: "xiri-list", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriInfopointComponent), selector: "xiri-infopoint", inputs: ["settings"] }, { kind: "directive", type: i0.forwardRef(() => NgTemplateOutlet), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(() => XiriTabsComponent), selector: "xiri-tabs", inputs: ["settings", "filterData", "dyncomponent"] }, { kind: "component", type: i0.forwardRef(() => XiriExpansionComponent), selector: "xiri-expansion", inputs: ["settings", "filterData", "dyncomponent"] }, { kind: "component", type: i0.forwardRef(() => XiriStatComponent), selector: "xiri-stat", inputs: ["settings"] }, { kind: "component", type: i0.forwardRef(() => XiriEmptyStateComponent), selector: "xiri-empty-state", inputs: ["settings"], outputs: ["buttonResult"] }, { kind: "component", type: i0.forwardRef(() => XiriSectionComponent), selector: "xiri-section", inputs: ["settings", "dyncomponent"] }, { kind: "pipe", type: i0.forwardRef(() => SafehtmlPipe), name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [Promise.resolve().then(function () { return multiprogress_component; }).then(m => m.XiriMultiprogressComponent)], () => [Promise.resolve().then(function () { return imagetext_component; }).then(m => m.XiriImagetextComponent)], () => [Promise.resolve().then(function () { return timeline_component; }).then(m => m.XiriTimelineComponent)], () => [Promise.resolve().then(function () { return pageHeader_component; }).then(m => m.XiriPageHeaderComponent)], () => [Promise.resolve().then(function () { return divider_component; }).then(m => m.XiriDividerComponent)], () => [Promise.resolve().then(function () { return statGrid_component; }).then(m => m.XiriStatGridComponent)], () => [Promise.resolve().then(function () { return toolbar_component; }).then(m => m.XiriToolbarComponent)], () => [Promise.resolve().then(function () { return descriptionList_component; }).then(m => m.XiriDescriptionListComponent)], () => [Promise.resolve().then(function () { return barchart_component; }).then(m => m.XiriBarChartComponent)], () => [Promise.resolve().then(function () { return linechart_component; }).then(m => m.XiriLineChartComponent)], () => [Promise.resolve().then(function () { return piechart_component; }).then(m => m.XiriPieChartComponent)], () => [Promise.resolve().then(function () { return gaugechart_component; }).then(m => m.XiriGaugeChartComponent)], () => [Promise.resolve().then(function () { return heatmap_component; }).then(m => m.XiriHeatmapComponent)], () => [Promise.resolve().then(function () { return calendar_component; }).then(m => m.XiriCalendarComponent)], () => [Promise.resolve().then(function () { return tree_component; }).then(m => m.XiriTreeComponent)], () => [Promise.resolve().then(function () { return sankey_component; }).then(m => m.XiriSankeyComponent)], () => [Promise.resolve().then(function () { return gantt_component; }).then(m => m.XiriGanttComponent)]] }); }
 }
 i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.2.14", ngImport: i0, type: XiriDynComponentComponent, resolveDeferredDeps: () => [Promise.resolve().then(function () { return multiprogress_component; }).then(m => m.XiriMultiprogressComponent), Promise.resolve().then(function () { return imagetext_component; }).then(m => m.XiriImagetextComponent), Promise.resolve().then(function () { return timeline_component; }).then(m => m.XiriTimelineComponent), Promise.resolve().then(function () { return pageHeader_component; }).then(m => m.XiriPageHeaderComponent), Promise.resolve().then(function () { return divider_component; }).then(m => m.XiriDividerComponent), Promise.resolve().then(function () { return statGrid_component; }).then(m => m.XiriStatGridComponent), Promise.resolve().then(function () { return toolbar_component; }).then(m => m.XiriToolbarComponent), Promise.resolve().then(function () { return descriptionList_component; }).then(m => m.XiriDescriptionListComponent), Promise.resolve().then(function () { return barchart_component; }).then(m => m.XiriBarChartComponent), Promise.resolve().then(function () { return linechart_component; }).then(m => m.XiriLineChartComponent), Promise.resolve().then(function () { return piechart_component; }).then(m => m.XiriPieChartComponent), Promise.resolve().then(function () { return gaugechart_component; }).then(m => m.XiriGaugeChartComponent), Promise.resolve().then(function () { return heatmap_component; }).then(m => m.XiriHeatmapComponent), Promise.resolve().then(function () { return calendar_component; }).then(m => m.XiriCalendarComponent), Promise.resolve().then(function () { return tree_component; }).then(m => m.XiriTreeComponent), Promise.resolve().then(function () { return sankey_component; }).then(m => m.XiriSankeyComponent), Promise.resolve().then(function () { return gantt_component; }).then(m => m.XiriGanttComponent)], resolveMetadata: (XiriMultiprogressComponent, XiriImagetextComponent, XiriTimelineComponent, XiriPageHeaderComponent, XiriDividerComponent, XiriStatGridComponent, XiriToolbarComponent, XiriDescriptionListComponent, XiriBarChartComponent, XiriLineChartComponent, XiriPieChartComponent, XiriGaugeChartComponent, XiriHeatmapComponent, XiriCalendarComponent, XiriTreeComponent, XiriSankeyComponent, XiriGanttComponent) => ({ decorators: [{
                 type: Component,
@@ -5659,7 +5659,7 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.2.14", n
                             XiriCalendarComponent,
                             XiriTreeComponent,
                             XiriSankeyComponent,
-                            XiriGanttComponent], template: "@for (obj of dataInt(); track obj.id) {\n\n\t@switch (obj.type) {\n\t\t@case ('card') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-card [settings]=\"obj.data\"></xiri-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('buttonline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-buttonline [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-buttonline>\n\t\t\t</div>\n\t\t}\n\t\t@case ('table') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-table [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-table>\n\t\t\t</div>\n\t\t}\n\t\t@case ('cardlink') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-cardlink [settings]=\"obj.data\"></xiri-cardlink>\n\t\t\t</div>\n\t\t}\n\t\t@case ('links') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-links [settings]=\"obj.data\"></xiri-links>\n\t\t\t</div>\n\t\t}\n\t\t@case ('form') {\n\t\t\t<div [class]=\"obj.display || 'xcol form'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<mat-card class=\"mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t\t\t@if (obj.data.header) {\n\t\t\t\t\t\t<mat-card-header>\n\t\t\t\t\t\t\t<mat-card-title>{{ obj.data.header }}</mat-card-title>\n\t\t\t\t\t\t</mat-card-header>\n\t\t\t\t\t}\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<xiri-form [settings]=\"obj.data\"></xiri-form>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</mat-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('query') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-query [settings]=\"obj.data\" [dyncomponent]=\"selfdyncomponent\"></xiri-query>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stepper') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stepper [settings]=\"obj.data\"></xiri-stepper>\n\t\t\t</div>\n\t\t}\n\t\t@case ('header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-header [settings]=\"obj.data\"></xiri-header>\n\t\t\t</div>\n\t\t}\n\t\t@case ('list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-list [settings]=\"obj.data\"></xiri-list>\n\t\t\t</div>\n\t\t}\n\t\t@case ('spacer') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('container') {\n\t\t\t@if (obj.data) {\n\t\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t\t<xiri-dyncomponent [data]=\"obj.data\" [dyncomponent]=\"dyncomponent()\" class=\"row\"></xiri-dyncomponent>\n\t\t\t\t</div>\n\t\t\t}\n\t\t}\n\t\t@case ('infopoint') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-infopoint [settings]=\"obj.data\"></xiri-infopoint>\n\t\t\t</div>\n\t\t}\n\t\t@case ('multiprogress') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-multiprogress [settings]=\"obj.data\"></xiri-multiprogress> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('imagetext') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-imagetext [settings]=\"obj.data\"></xiri-imagetext> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tabs') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-tabs [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-tabs>\n\t\t\t</div>\n\t\t}\n\t\t@case ('expansion') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-expansion [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-expansion>\n\t\t\t</div>\n\t\t}\n\t\t@case ('infotext') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"infotext\">{{ obj.data.text }}</div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('html') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"html\" [innerHtml]=\"obj.data.html | safeHtml\"></div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stat [settings]=\"obj.data\"></xiri-stat>\n\t\t\t</div>\n\t\t}\n\t\t@case ('empty-state') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-empty-state [settings]=\"obj.data\"></xiri-empty-state>\n\t\t\t</div>\n\t\t}\n\t\t@case ('timeline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-timeline [settings]=\"obj.data\"></xiri-timeline> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('page-header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-page-header [settings]=\"obj.data\"></xiri-page-header> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('section') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-section [settings]=\"obj.data\" [dyncomponent]=\"dyncomponent()\"></xiri-section>\n\t\t\t</div>\n\t\t}\n\t\t@case ('divider') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-divider [settings]=\"obj.data\"></xiri-divider> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat-grid') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-stat-grid [settings]=\"obj.data\"></xiri-stat-grid> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('toolbar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-toolbar [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-toolbar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('description-list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-description-list [settings]=\"obj.data\"></xiri-description-list> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('barchart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-barchart [mode]=\"obj.mode\" [settings]=\"obj.data\"></xiri-barchart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('linechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-linechart [settings]=\"obj.data\"></xiri-linechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('piechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-piechart [settings]=\"obj.data\"></xiri-piechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gaugechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gaugechart [settings]=\"obj.data\"></xiri-gaugechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('heatmap') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-heatmap [settings]=\"obj.data\"></xiri-heatmap> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('calendar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-calendar [settings]=\"obj.data\"></xiri-calendar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tree') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-tree [settings]=\"obj.data\"></xiri-tree> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('sankey') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-sankey [settings]=\"obj.data\"></xiri-sankey> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gantt') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gantt [settings]=\"obj.data\"></xiri-gantt> }\n\t\t\t</div>\n\t\t}\n\t\t@default {\n\t\t\t<ng-container *ngTemplateOutlet=\"dyncomponent() || defaultComponentUnknown; context: { $implicit: obj, filterData: filterData() }\"></ng-container>\n\t\t}\n\t}\n}\n\n<ng-template #selfdyncomponent let-obj>\n\t<xiri-dyncomponent [data]=\"obj.data\" [filterData]=\"obj.filterData\" [dyncomponent]=\"dyncomponent()\" class=\"xrow\"></xiri-dyncomponent>\n</ng-template>\n<ng-template #defaultComponentUnknown let-obj>\n\t<div class=\"xcol\">unknown type: {{ obj.type }}</div>\n</ng-template>\n", styles: [".spacer.double{padding-top:1rem}.form mat-card-header{padding-bottom:1rem}\n"] }]
+                            XiriGanttComponent], template: "@for (obj of dataInt(); track obj.id) {\n\n\t@switch (obj.type) {\n\t\t@case ('card') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-card [settings]=\"obj.data\"></xiri-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('buttonline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-buttonline [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-buttonline>\n\t\t\t</div>\n\t\t}\n\t\t@case ('table') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-table [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-table>\n\t\t\t</div>\n\t\t}\n\t\t@case ('cardlink') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-cardlink [settings]=\"obj.data\"></xiri-cardlink>\n\t\t\t</div>\n\t\t}\n\t\t@case ('links') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4 xcol-lg-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-links [settings]=\"obj.data\"></xiri-links>\n\t\t\t</div>\n\t\t}\n\t\t@case ('form') {\n\t\t\t<div [class]=\"obj.display || 'xcol form'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<mat-card class=\"mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t\t\t\t@if (obj.data.header) {\n\t\t\t\t\t\t<mat-card-header>\n\t\t\t\t\t\t\t<mat-card-title>{{ obj.data.header }}</mat-card-title>\n\t\t\t\t\t\t</mat-card-header>\n\t\t\t\t\t}\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<xiri-form [settings]=\"obj.data\"></xiri-form>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</mat-card>\n\t\t\t</div>\n\t\t}\n\t\t@case ('query') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-query [settings]=\"obj.data\" [dyncomponent]=\"selfdyncomponent\"></xiri-query>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stepper') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stepper [settings]=\"obj.data\"></xiri-stepper>\n\t\t\t</div>\n\t\t}\n\t\t@case ('header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-header [settings]=\"obj.data\"></xiri-header>\n\t\t\t</div>\n\t\t}\n\t\t@case ('list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-list [settings]=\"obj.data\"></xiri-list>\n\t\t\t</div>\n\t\t}\n\t\t@case ('spacer') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"spacer\">&nbsp;</div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('container') {\n\t\t\t@if (obj.data) {\n\t\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t\t<xiri-dyncomponent [data]=\"obj.data\" [dyncomponent]=\"dyncomponent()\" class=\"row\"></xiri-dyncomponent>\n\t\t\t\t</div>\n\t\t\t}\n\t\t}\n\t\t@case ('infopoint') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-infopoint [settings]=\"obj.data\"></xiri-infopoint>\n\t\t\t</div>\n\t\t}\n\t\t@case ('multiprogress') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-multiprogress [settings]=\"obj.data\"></xiri-multiprogress> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('imagetext') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-imagetext [settings]=\"obj.data\"></xiri-imagetext> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tabs') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-tabs [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-tabs>\n\t\t\t</div>\n\t\t}\n\t\t@case ('expansion') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-expansion [settings]=\"obj.data\" [filterData]=\"filterData()\" [dyncomponent]=\"selfdyncomponent\"></xiri-expansion>\n\t\t\t</div>\n\t\t}\n\t\t@case ('infotext') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@if (obj.data.html) {\n\t\t\t\t\t<div class=\"infotext\" [innerHtml]=\"obj.data.text | safeHtml\"></div>\n\t\t\t\t} @else {\n\t\t\t\t\t<div class=\"infotext\">{{ obj.data.text }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t@case ('html') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<div class=\"html\" [innerHtml]=\"obj.data.html | safeHtml\"></div>\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-4'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-stat [settings]=\"obj.data\"></xiri-stat>\n\t\t\t</div>\n\t\t}\n\t\t@case ('empty-state') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-empty-state [settings]=\"obj.data\"></xiri-empty-state>\n\t\t\t</div>\n\t\t}\n\t\t@case ('timeline') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-timeline [settings]=\"obj.data\"></xiri-timeline> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('page-header') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-page-header [settings]=\"obj.data\"></xiri-page-header> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('section') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t<xiri-section [settings]=\"obj.data\" [dyncomponent]=\"dyncomponent()\"></xiri-section>\n\t\t\t</div>\n\t\t}\n\t\t@case ('divider') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-divider [settings]=\"obj.data\"></xiri-divider> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('stat-grid') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-stat-grid [settings]=\"obj.data\"></xiri-stat-grid> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('toolbar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-toolbar [settings]=\"obj.data\" [filterData]=\"filterData()\"></xiri-toolbar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('description-list') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-description-list [settings]=\"obj.data\"></xiri-description-list> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('barchart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-barchart [mode]=\"obj.mode\" [settings]=\"obj.data\"></xiri-barchart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('linechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-linechart [settings]=\"obj.data\"></xiri-linechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('piechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-piechart [settings]=\"obj.data\"></xiri-piechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gaugechart') {\n\t\t\t<div [class]=\"obj.display || 'xcol xcol-md-6 xcol-xl-3'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gaugechart [settings]=\"obj.data\"></xiri-gaugechart> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('heatmap') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-heatmap [settings]=\"obj.data\"></xiri-heatmap> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('calendar') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-calendar [settings]=\"obj.data\"></xiri-calendar> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('tree') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-tree [settings]=\"obj.data\"></xiri-tree> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('sankey') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-sankey [settings]=\"obj.data\"></xiri-sankey> }\n\t\t\t</div>\n\t\t}\n\t\t@case ('gantt') {\n\t\t\t<div [class]=\"obj.display || 'xcol'\" [class.xcol-start]=\"obj.newRow\">\n\t\t\t\t@defer { <xiri-gantt [settings]=\"obj.data\"></xiri-gantt> }\n\t\t\t</div>\n\t\t}\n\t\t@default {\n\t\t\t<ng-container *ngTemplateOutlet=\"dyncomponent() || defaultComponentUnknown; context: { $implicit: obj, filterData: filterData() }\"></ng-container>\n\t\t}\n\t}\n}\n\n<ng-template #selfdyncomponent let-obj>\n\t<xiri-dyncomponent [data]=\"obj.data\" [filterData]=\"obj.filterData\" [dyncomponent]=\"dyncomponent()\" class=\"xrow\"></xiri-dyncomponent>\n</ng-template>\n<ng-template #defaultComponentUnknown let-obj>\n\t<div class=\"xcol\">unknown type: {{ obj.type }}</div>\n</ng-template>\n", styles: [".spacer.double{padding-top:1rem}.form mat-card-header{padding-bottom:1rem}\n"] }]
             }], ctorParameters: null, propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], filterData: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterData", required: false }] }], dyncomponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "dyncomponent", required: false }] }] } }) });
 
 var dyncomponent_component = /*#__PURE__*/Object.freeze({
@@ -6038,6 +6038,8 @@ class XiriEchartsHostComponent {
         this.headerIcon = input(undefined, ...(ngDevMode ? [{ debugName: "headerIcon" }] : /* istanbul ignore next */ []));
         this.headerIconColor = input(undefined, ...(ngDevMode ? [{ debugName: "headerIconColor" }] : /* istanbul ignore next */ []));
         this.chartHeight = input('200px', ...(ngDevMode ? [{ debugName: "chartHeight" }] : /* istanbul ignore next */ []));
+        // Emitted when a data item (bar, slice, point, …) is clicked.
+        this.itemClick = output();
         this.chartHostRef = viewChild.required('chartHost');
         this.zone = inject(NgZone);
         this.destroyRef = inject(DestroyRef);
@@ -6065,6 +6067,18 @@ class XiriEchartsHostComponent {
         }
         this.zone.runOutsideAngular(() => {
             this.chart = this.echarts.init(this.chartHostRef().nativeElement);
+            this.chart.on('click', (p) => {
+                if (p.componentType !== 'series')
+                    return;
+                this.zone.run(() => this.itemClick.emit({
+                    componentType: p.componentType,
+                    seriesType: p.seriesType,
+                    seriesIndex: p.seriesIndex,
+                    dataIndex: p.dataIndex,
+                    name: p.name,
+                    value: p.value,
+                }));
+            });
             this.render();
             this.resizeObserver = new ResizeObserver(() => this.chart?.resize());
             this.resizeObserver.observe(this.chartHostRef().nativeElement);
@@ -6089,12 +6103,12 @@ class XiriEchartsHostComponent {
         this.chart.setOption(opt, true);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriEchartsHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: XiriEchartsHostComponent, isStandalone: true, selector: "xiri-echarts-host", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, headerIcon: { classPropertyName: "headerIcon", publicName: "headerIcon", isSignal: true, isRequired: false, transformFunction: null }, headerIconColor: { classPropertyName: "headerIconColor", publicName: "headerIconColor", isSignal: true, isRequired: false, transformFunction: null }, chartHeight: { classPropertyName: "chartHeight", publicName: "chartHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.compact": "compact()" } }, viewQueries: [{ propertyName: "chartHostRef", first: true, predicate: ["chartHost"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (compact()) {\n\t<div class=\"xiri-echarts xiri-echarts-flat\">\n\t\t@if (hasHeader()) {\n\t\t\t<div class=\"xiri-echarts-header\">\n\t\t\t\t@if (headerIcon()) {\n\t\t\t\t\t<mat-icon [class]=\"headerIconColor() || 'primary'\">{{ headerIcon() }}</mat-icon>\n\t\t\t\t}\n\t\t\t\t@if (title()) {\n\t\t\t\t\t<div class=\"xiri-echarts-title\">{{ title() }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t<div #chartHost class=\"xiri-echarts-host\" [style.height]=\"chartHeight()\"></div>\n\t\t@if (error()) {\n\t\t\t<div class=\"xiri-echarts-error\">{{ error() }}</div>\n\t\t}\n\t</div>\n} @else {\n\t<mat-card class=\"xiri-echarts mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t<mat-card-content>\n\t\t\t@if (hasHeader()) {\n\t\t\t\t<div class=\"xiri-echarts-header\">\n\t\t\t\t\t@if (headerIcon()) {\n\t\t\t\t\t\t<mat-icon [class]=\"headerIconColor() || 'primary'\">{{ headerIcon() }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t\t@if (title()) {\n\t\t\t\t\t\t<div class=\"xiri-echarts-title\">{{ title() }}</div>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t<div #chartHost class=\"xiri-echarts-host\" [style.height]=\"chartHeight()\"></div>\n\t\t\t@if (error()) {\n\t\t\t\t<div class=\"xiri-echarts-error\">{{ error() }}</div>\n\t\t\t}\n\t\t</mat-card-content>\n\t</mat-card>\n}\n", styles: [".xiri-echarts{height:100%}.xiri-echarts .xiri-echarts-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.xiri-echarts .xiri-echarts-header mat-icon{font-size:var(--xiri-icon-size-md, 24px);width:var(--xiri-icon-size-md, 24px);height:var(--xiri-icon-size-md, 24px)}.xiri-echarts .xiri-echarts-title{font-size:14px;font-weight:500;color:var(--mat-sys-on-surface-variant, #555)}.xiri-echarts .xiri-echarts-host{width:100%;min-height:160px}.xiri-echarts .xiri-echarts-error{font-size:12px;color:var(--mat-sys-error, #b00020);padding:8px 0}.xiri-echarts-flat{background:transparent;box-shadow:none;padding:0}\n"], dependencies: [{ kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: MatCardContent, selector: "mat-card-content" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: XiriEchartsHostComponent, isStandalone: true, selector: "xiri-echarts-host", inputs: { option: { classPropertyName: "option", publicName: "option", isSignal: true, isRequired: true, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, headerIcon: { classPropertyName: "headerIcon", publicName: "headerIcon", isSignal: true, isRequired: false, transformFunction: null }, headerIconColor: { classPropertyName: "headerIconColor", publicName: "headerIconColor", isSignal: true, isRequired: false, transformFunction: null }, chartHeight: { classPropertyName: "chartHeight", publicName: "chartHeight", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { properties: { "class.compact": "compact()" } }, viewQueries: [{ propertyName: "chartHostRef", first: true, predicate: ["chartHost"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (compact()) {\n\t<div class=\"xiri-echarts xiri-echarts-flat\">\n\t\t@if (hasHeader()) {\n\t\t\t<div class=\"xiri-echarts-header\">\n\t\t\t\t@if (headerIcon()) {\n\t\t\t\t\t<mat-icon [class]=\"headerIconColor() || 'primary'\">{{ headerIcon() }}</mat-icon>\n\t\t\t\t}\n\t\t\t\t@if (title()) {\n\t\t\t\t\t<div class=\"xiri-echarts-title\">{{ title() }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t<div #chartHost class=\"xiri-echarts-host\" [style.height]=\"chartHeight()\"></div>\n\t\t@if (error()) {\n\t\t\t<div class=\"xiri-echarts-error\">{{ error() }}</div>\n\t\t}\n\t</div>\n} @else {\n\t<mat-card class=\"xiri-echarts mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t<mat-card-content>\n\t\t\t@if (hasHeader()) {\n\t\t\t\t<div class=\"xiri-echarts-header\">\n\t\t\t\t\t@if (headerIcon()) {\n\t\t\t\t\t\t<mat-icon [class]=\"headerIconColor() || 'primary'\">{{ headerIcon() }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t\t@if (title()) {\n\t\t\t\t\t\t<div class=\"xiri-echarts-title\">{{ title() }}</div>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t<div #chartHost class=\"xiri-echarts-host\" [style.height]=\"chartHeight()\"></div>\n\t\t\t@if (error()) {\n\t\t\t\t<div class=\"xiri-echarts-error\">{{ error() }}</div>\n\t\t\t}\n\t\t</mat-card-content>\n\t</mat-card>\n}\n", styles: [".xiri-echarts{height:100%}.xiri-echarts .xiri-echarts-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.xiri-echarts .xiri-echarts-header mat-icon{font-size:var(--xiri-icon-size-md, 24px);width:var(--xiri-icon-size-md, 24px);height:var(--xiri-icon-size-md, 24px)}.xiri-echarts .xiri-echarts-title{font-size:14px;font-weight:500;color:var(--mat-sys-on-surface-variant, #555)}.xiri-echarts .xiri-echarts-host{width:100%;min-height:160px}.xiri-echarts .xiri-echarts-error{font-size:12px;color:var(--mat-sys-error, #b00020);padding:8px 0}.xiri-echarts-flat{background:transparent;box-shadow:none;padding:0}\n"], dependencies: [{ kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: MatCardContent, selector: "mat-card-content" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriEchartsHostComponent, decorators: [{
             type: Component,
             args: [{ selector: 'xiri-echarts-host', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [MatCard, MatCardContent, MatIcon], host: { '[class.compact]': 'compact()' }, template: "@if (compact()) {\n\t<div class=\"xiri-echarts xiri-echarts-flat\">\n\t\t@if (hasHeader()) {\n\t\t\t<div class=\"xiri-echarts-header\">\n\t\t\t\t@if (headerIcon()) {\n\t\t\t\t\t<mat-icon [class]=\"headerIconColor() || 'primary'\">{{ headerIcon() }}</mat-icon>\n\t\t\t\t}\n\t\t\t\t@if (title()) {\n\t\t\t\t\t<div class=\"xiri-echarts-title\">{{ title() }}</div>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t\t<div #chartHost class=\"xiri-echarts-host\" [style.height]=\"chartHeight()\"></div>\n\t\t@if (error()) {\n\t\t\t<div class=\"xiri-echarts-error\">{{ error() }}</div>\n\t\t}\n\t</div>\n} @else {\n\t<mat-card class=\"xiri-echarts mat-mdc-elevation-specific mat-elevation-z2\">\n\t\t<mat-card-content>\n\t\t\t@if (hasHeader()) {\n\t\t\t\t<div class=\"xiri-echarts-header\">\n\t\t\t\t\t@if (headerIcon()) {\n\t\t\t\t\t\t<mat-icon [class]=\"headerIconColor() || 'primary'\">{{ headerIcon() }}</mat-icon>\n\t\t\t\t\t}\n\t\t\t\t\t@if (title()) {\n\t\t\t\t\t\t<div class=\"xiri-echarts-title\">{{ title() }}</div>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t<div #chartHost class=\"xiri-echarts-host\" [style.height]=\"chartHeight()\"></div>\n\t\t\t@if (error()) {\n\t\t\t\t<div class=\"xiri-echarts-error\">{{ error() }}</div>\n\t\t\t}\n\t\t</mat-card-content>\n\t</mat-card>\n}\n", styles: [".xiri-echarts{height:100%}.xiri-echarts .xiri-echarts-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.xiri-echarts .xiri-echarts-header mat-icon{font-size:var(--xiri-icon-size-md, 24px);width:var(--xiri-icon-size-md, 24px);height:var(--xiri-icon-size-md, 24px)}.xiri-echarts .xiri-echarts-title{font-size:14px;font-weight:500;color:var(--mat-sys-on-surface-variant, #555)}.xiri-echarts .xiri-echarts-host{width:100%;min-height:160px}.xiri-echarts .xiri-echarts-error{font-size:12px;color:var(--mat-sys-error, #b00020);padding:8px 0}.xiri-echarts-flat{background:transparent;box-shadow:none;padding:0}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { option: [{ type: i0.Input, args: [{ isSignal: true, alias: "option", required: true }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], headerIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerIcon", required: false }] }], headerIconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerIconColor", required: false }] }], chartHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "chartHeight", required: false }] }], chartHostRef: [{ type: i0.ViewChild, args: ['chartHost', { isSignal: true }] }] } });
+        }], ctorParameters: () => [], propDecorators: { option: [{ type: i0.Input, args: [{ isSignal: true, alias: "option", required: true }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], headerIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerIcon", required: false }] }], headerIconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerIconColor", required: false }] }], chartHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "chartHeight", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], chartHostRef: [{ type: i0.ViewChild, args: ['chartHost', { isSignal: true }] }] } });
 
 /**
  * Maps semantic XiriColor names to concrete CSS color values.
@@ -6147,6 +6161,7 @@ class XiriBarChartComponent {
     constructor() {
         this.mode = input('simple', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
         this.settings = input.required(...(ngDevMode ? [{ debugName: "settings" }] : /* istanbul ignore next */ []));
+        this.router = inject(Router);
         this.compact = computed(() => !!this.settings().compact, ...(ngDevMode ? [{ debugName: "compact" }] : /* istanbul ignore next */ []));
         this.option = computed(() => {
             const m = this.mode();
@@ -6157,6 +6172,17 @@ class XiriBarChartComponent {
             }
         }, ...(ngDevMode ? [{ debugName: "option" }] : /* istanbul ignore next */ []));
     }
+    onItemClick(e) {
+        const s = this.settings();
+        const coll = this.mode() === 'heatmap' ? s.points : s.bars;
+        const url = coll?.[e.dataIndex]?.url;
+        if (!url)
+            return;
+        if (/^https?:\/\//.test(url))
+            window.open(url, '_blank');
+        else
+            this.router.navigateByUrl(url);
+    }
     baseGrid() {
         // Compact mode: outer card already provides padding — shrink the
         // echarts grid so we don't get a "double margin".
@@ -6197,7 +6223,10 @@ class XiriBarChartComponent {
             },
             series: [{
                     type: 'bar',
-                    data: bars.map(b => b.value ?? 0),
+                    data: bars.map(b => ({
+                        value: b.value ?? 0,
+                        itemStyle: { cursor: b.url ? 'pointer' : 'default' }
+                    })),
                     itemStyle: { color, borderRadius: [3, 3, 0, 0] },
                     barCategoryGap: '40%'
                 }]
@@ -6227,7 +6256,7 @@ class XiriBarChartComponent {
                     return {
                         value: seg.value,
                         name: seg.name ?? seriesNames[i] ?? '',
-                        itemStyle: { color: resolveColor(seg.color, '#9e9e9e') }
+                        itemStyle: { color: resolveColor(seg.color, '#9e9e9e'), cursor: b.url ? 'pointer' : 'default' }
                     };
                 })
             });
@@ -6306,7 +6335,10 @@ class XiriBarChartComponent {
                     type: 'bar',
                     barMinWidth: 1,
                     barMaxWidth: 3,
-                    data: points.map(p => [p.time, p.value]),
+                    data: points.map(p => ({
+                        value: [p.time, p.value],
+                        itemStyle: { cursor: p.url ? 'pointer' : 'default' }
+                    })),
                     itemStyle: { color }
                 }]
         };
@@ -6316,9 +6348,10 @@ class XiriBarChartComponent {
 		<xiri-echarts-host
 			[option]="option()"
 			[compact]="compact()"
-			[title]="settings().title">
+			[title]="settings().title"
+			(itemClick)="onItemClick($event)">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriBarChartComponent, decorators: [{
             type: Component,
@@ -6328,7 +6361,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
 		<xiri-echarts-host
 			[option]="option()"
 			[compact]="compact()"
-			[title]="settings().title">
+			[title]="settings().title"
+			(itemClick)="onItemClick($event)">
 		</xiri-echarts-host>
 	`,
                     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -6410,7 +6444,7 @@ class XiriLineChartComponent {
 			[compact]="compact()"
 			[title]="settings().title">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriLineChartComponent, decorators: [{
             type: Component,
@@ -6485,7 +6519,7 @@ class XiriPieChartComponent {
 			[compact]="compact()"
 			[title]="settings().title">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriPieChartComponent, decorators: [{
             type: Component,
@@ -6560,7 +6594,7 @@ class XiriGaugeChartComponent {
 			[compact]="compact()"
 			[title]="settings().title">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriGaugeChartComponent, decorators: [{
             type: Component,
@@ -6652,7 +6686,7 @@ class XiriHeatmapComponent {
 			[title]="settings().title"
 			[chartHeight]="height()">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriHeatmapComponent, decorators: [{
             type: Component,
@@ -6739,7 +6773,7 @@ class XiriCalendarComponent {
 			[title]="settings().title"
 			[chartHeight]="height()">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriCalendarComponent, decorators: [{
             type: Component,
@@ -6829,7 +6863,7 @@ class XiriTreeComponent {
 			[title]="settings().title"
 			[chartHeight]="height()">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriTreeComponent, decorators: [{
             type: Component,
@@ -6901,7 +6935,7 @@ class XiriSankeyComponent {
 			[title]="settings().title"
 			[chartHeight]="height()">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriSankeyComponent, decorators: [{
             type: Component,
@@ -7007,7 +7041,7 @@ class XiriGanttComponent {
 			[title]="settings().title"
 			[chartHeight]="height()">
 		</xiri-echarts-host>
-	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+	`, isInline: true, dependencies: [{ kind: "component", type: XiriEchartsHostComponent, selector: "xiri-echarts-host", inputs: ["option", "compact", "title", "headerIcon", "headerIconColor", "chartHeight"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: XiriGanttComponent, decorators: [{
             type: Component,