@testgorilla/tgo-ui 2.26.11 → 2.26.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/components/universal-skills-spider-charts/universal-skills-spider-charts.component.d.ts +8 -1
  2. package/esm2022/components/spider-chart/spider-chart.component.mjs +2 -2
  3. package/esm2022/components/universal-skills-spider-charts/universal-skills-spider-charts.component.mjs +12 -3
  4. package/fesm2022/testgorilla-tgo-ui.mjs +13 -4
  5. package/fesm2022/testgorilla-tgo-ui.mjs.map +1 -1
  6. package/package.json +1 -1
package/components/universal-skills-spider-charts/universal-skills-spider-charts.component.d.ts CHANGED
@@ -29,6 +29,13 @@ export declare class UniversalSkillsSpiderChartsComponent implements OnInit {
29
29
  * @memberof UniversalSkillsSpiderChartsComponent
30
30
  */
31
31
  loading: boolean;
32
+ /**
33
+ * Defines the size of the spider chart
34
+ * @property size
35
+ * @type {'small' | 'large'}
36
+ * @memberof UniversalSkillsSpiderChartsComponent
37
+ */
38
+ size: 'small' | 'large';
32
39
  readonly translationContext = "UNIVERSAL_SKILLS_REPORT.";
33
40
  skillAreaGroupMap: Record<SkillAreaGroupTypes, SkillAreaGroup>;
34
41
  skillAreaSpiderChartData: SkillAreaSpiderChartData[];
@@ -36,5 +43,5 @@ export declare class UniversalSkillsSpiderChartsComponent implements OnInit {
36
43
  ngOnInit(): void;
37
44
  prepareSpiderChartData(): void;
38
45
  static ɵfac: i0.ɵɵFactoryDeclaration<UniversalSkillsSpiderChartsComponent, [{ optional: true; }, null, null]>;
39
- static ɵcmp: i0.ɵɵComponentDeclaration<UniversalSkillsSpiderChartsComponent, "ui-universal-skills-spider-charts", never, { "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "skillAreaDataList": { "alias": "skillAreaDataList"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; }, {}, never, never, false, never>;
46
+ static ɵcmp: i0.ɵɵComponentDeclaration<UniversalSkillsSpiderChartsComponent, "ui-universal-skills-spider-charts", never, { "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "skillAreaDataList": { "alias": "skillAreaDataList"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, false, never>;
40
47
  }
package/esm2022/components/spider-chart/spider-chart.component.mjs CHANGED
@@ -407,11 +407,11 @@ export class SpiderChartComponent {
407
407
  return label.substring(firstLine.length).trim();
408
408
  }
409
409
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpiderChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
410
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: SpiderChartComponent, selector: "ui-spider-chart", inputs: { size: "size", spiderChartData: "spiderChartData", stepSize: "stepSize", ariaLabel: "ariaLabel", loading: "loading", applicationTheme: "applicationTheme" }, viewQueries: [{ propertyName: "chart", first: true, predicate: BaseChartDirective, descendants: true }, { propertyName: "labelContainers", predicate: ["labelContainer"], descendants: true }, { propertyName: "fakeDataPoints", predicate: ["fakeDataPoints"], descendants: true }, { propertyName: "fakeDataPointsSecondary", predicate: ["fakeDataPointsSecondary"], descendants: true }, { propertyName: "legendItems", predicate: ["legendItem"], descendants: true }], ngImport: i0, template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.BaseChartDirective, selector: "canvas[baseChart]", inputs: ["type", "legend", "data", "options", "plugins", "labels", "datasets"], outputs: ["chartClick", "chartHover"], exportAs: ["base-chart"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4.SpinnerComponent, selector: "ui-spinner", inputs: ["size", "isLoader", "applicationTheme"] }, { kind: "pipe", type: i5.UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: i6.MemoizeFuncPipe, name: "memoizeFunc" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
410
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: SpiderChartComponent, selector: "ui-spider-chart", inputs: { size: "size", spiderChartData: "spiderChartData", stepSize: "stepSize", ariaLabel: "ariaLabel", loading: "loading", applicationTheme: "applicationTheme" }, viewQueries: [{ propertyName: "chart", first: true, predicate: BaseChartDirective, descendants: true }, { propertyName: "labelContainers", predicate: ["labelContainer"], descendants: true }, { propertyName: "fakeDataPoints", predicate: ["fakeDataPoints"], descendants: true }, { propertyName: "fakeDataPointsSecondary", predicate: ["fakeDataPointsSecondary"], descendants: true }, { propertyName: "legendItems", predicate: ["legendItem"], descendants: true }], ngImport: i0, template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}:host ::ng-deep .spider-chart-container .spinner-container.loader{position:absolute}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.BaseChartDirective, selector: "canvas[baseChart]", inputs: ["type", "legend", "data", "options", "plugins", "labels", "datasets"], outputs: ["chartClick", "chartHover"], exportAs: ["base-chart"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4.SpinnerComponent, selector: "ui-spinner", inputs: ["size", "isLoader", "applicationTheme"] }, { kind: "pipe", type: i5.UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: i6.MemoizeFuncPipe, name: "memoizeFunc" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
411
411
  }
412
412
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpiderChartComponent, decorators: [{
413
413
  type: Component,
414
- args: [{ selector: 'ui-spider-chart', template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}\n"] }]
414
+ args: [{ selector: 'ui-spider-chart', template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}:host ::ng-deep .spider-chart-container .spinner-container.loader{position:absolute}\n"] }]
415
415
  }], propDecorators: { size: [{
416
416
  type: Input
417
417
  }], spiderChartData: [{
package/esm2022/components/universal-skills-spider-charts/universal-skills-spider-charts.component.mjs CHANGED
@@ -26,6 +26,13 @@ export class UniversalSkillsSpiderChartsComponent {
26
26
  * @memberof UniversalSkillsSpiderChartsComponent
27
27
  */
28
28
  this.loading = false;
29
+ /**
30
+ * Defines the size of the spider chart
31
+ * @property size
32
+ * @type {'small' | 'large'}
33
+ * @memberof UniversalSkillsSpiderChartsComponent
34
+ */
35
+ this.size = 'large';
29
36
  this.translationContext = 'UNIVERSAL_SKILLS_REPORT.';
30
37
  this.skillAreaSpiderChartData = [];
31
38
  if (defaultAppTheme) {
@@ -80,11 +87,11 @@ export class UniversalSkillsSpiderChartsComponent {
80
87
  });
81
88
  }
82
89
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UniversalSkillsSpiderChartsComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i1.UniversalSkillsService }, { token: i2.UiTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
83
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: UniversalSkillsSpiderChartsComponent, selector: "ui-universal-skills-spider-charts", inputs: { applicationTheme: "applicationTheme", skillAreaDataList: "skillAreaDataList", loading: "loading" }, ngImport: i0, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: i3.AccordionComponent, selector: "ui-accordion", inputs: ["label", "open", "disabled", "showPremiumIcon", "premiumTooltipText", "applicationTheme", "labelIcon", "variant", "allowCustomHeader", "noBackgroundColor", "toggleIconPosition"], outputs: ["closed", "opened"] }, { kind: "component", type: i4.SpiderChartComponent, selector: "ui-spider-chart", inputs: ["size", "spiderChartData", "stepSize", "ariaLabel", "loading", "applicationTheme"] }, { kind: "component", type: i5.DividerComponent, selector: "ui-divider", inputs: ["size", "companyColor", "applicationTheme", "label"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
90
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: UniversalSkillsSpiderChartsComponent, selector: "ui-universal-skills-spider-charts", inputs: { applicationTheme: "applicationTheme", skillAreaDataList: "skillAreaDataList", loading: "loading", size: "size" }, ngImport: i0, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\" [size]=\"size\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: i3.AccordionComponent, selector: "ui-accordion", inputs: ["label", "open", "disabled", "showPremiumIcon", "premiumTooltipText", "applicationTheme", "labelIcon", "variant", "allowCustomHeader", "noBackgroundColor", "toggleIconPosition"], outputs: ["closed", "opened"] }, { kind: "component", type: i4.SpiderChartComponent, selector: "ui-spider-chart", inputs: ["size", "spiderChartData", "stepSize", "ariaLabel", "loading", "applicationTheme"] }, { kind: "component", type: i5.DividerComponent, selector: "ui-divider", inputs: ["size", "companyColor", "applicationTheme", "label"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
84
91
  }
85
92
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UniversalSkillsSpiderChartsComponent, decorators: [{
86
93
  type: Component,
87
- args: [{ selector: 'ui-universal-skills-spider-charts', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"] }]
94
+ args: [{ selector: 'ui-universal-skills-spider-charts', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\" [size]=\"size\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"] }]
88
95
  }], ctorParameters: () => [{ type: undefined, decorators: [{
89
96
  type: Optional
90
97
  }, {
@@ -96,5 +103,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
96
103
  type: Input
97
104
  }], loading: [{
98
105
  type: Input
106
+ }], size: [{
107
+ type: Input
99
108
  }] } });
100
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Rnby1jYW5vcHktdWkvY29tcG9uZW50cy91bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMvdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Rnby1jYW5vcHktdWkvY29tcG9uZW50cy91bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMvdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBVSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFVcEcsT0FBTyxFQUFZLElBQUksRUFBRSxNQUFNLE1BQU0sQ0FBQzs7Ozs7Ozs7QUFRdEMsTUFBTSxPQUFPLG9DQUFvQztJQThCL0MsWUFDNkUsZUFBaUMsRUFDcEcsc0JBQThDLEVBQzlDLGVBQWdDO1FBRm1DLG9CQUFlLEdBQWYsZUFBZSxDQUFrQjtRQUNwRywyQkFBc0IsR0FBdEIsc0JBQXNCLENBQXdCO1FBQzlDLG9CQUFlLEdBQWYsZUFBZSxDQUFpQjtRQWhDMUM7Ozs7O1dBS0c7UUFDTSxxQkFBZ0IsR0FBcUIsT0FBTyxDQUFDO1FBVXREOzs7OztXQUtHO1FBQ00sWUFBTyxHQUFZLEtBQUssQ0FBQztRQUV6Qix1QkFBa0IsR0FBRywwQkFBMEIsQ0FBQztRQUd6RCw2QkFBd0IsR0FBK0IsRUFBRSxDQUFDO1FBT3hELElBQUksZUFBZSxFQUFFLENBQUM7WUFDcEIsSUFBSSxDQUFDLGdCQUFnQixHQUFHLGVBQWUsQ0FBQztRQUMxQyxDQUFDO0lBQ0gsQ0FBQztJQUVELFFBQVE7UUFDTixJ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aUJBQ1I7YUFDRixDQUFDLENBQUM7UUFDTCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7K0dBakdVLG9DQUFvQyxrQkErQnpCLG9DQUFvQzttR0EvQi9DLG9DQUFvQyx1TENsQmpELG9nQkFRQTs7NEZEVWEsb0NBQW9DO2tCQU5oRCxTQUFTOytCQUNFLG1DQUFtQyxtQkFHNUIsdUJBQXVCLENBQUMsTUFBTTs7MEJBaUM1QyxRQUFROzswQkFBSSxNQUFNOzJCQUFDLG9DQUFvQzs0R0F4QmpELGdCQUFnQjtzQkFBeEIsS0FBSztnQkFRRyxpQkFBaUI7c0JBQXpCLEtBQUs7Z0JBUUcsT0FBTztzQkFBZixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSW5qZWN0LCBJbnB1dCwgT25Jbml0LCBPcHRpb25hbCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQXBwbGljYXRpb25UaGVtZSB9IGZyb20gJy4uLy4uL21vZGVscy9hcHBsaWNhdGlvbi10aGVtZS5tb2RlbCc7XG5pbXBvcnQge1xuICBTa2lsbEFyZWFEYXRhLFxuICBTa2lsbEFyZWFHcm91cCxcbiAgU2tpbGxBcmVhR3JvdXBUeXBlcyxcbiAgU2tpbGxBcmVhU3BpZGVyQ2hhcnREYXRhLFxufSBmcm9tICcuLi8uLi9tb2RlbHMvdW5pdmVyc2FsLXNraWxscy1yZXBvcnQubW9kZWwnO1xuaW1wb3J0IHsgVW5pdmVyc2FsU2tpbGxzU2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL3VuaXZlcnNhbC1za2lsbHMuc2VydmljZSc7XG5pbXBvcnQgeyBVaVRyYW5zbGF0ZVBpcGUgfSBmcm9tICcuLi8uLi9waXBlcy91aS10cmFuc2xhdGUucGlwZSc7XG5pbXBvcnQgeyBmb3JrSm9pbiwgdGFrZSB9IGZyb20gJ3J4anMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd1aS11bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMnLFxuICB0ZW1wbGF0ZVVybDogJy4vdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBVbml2ZXJzYWxTa2lsbHNTcGlkZXJDaGFydHNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICAvKipcbiAgICogRGVmaW5lcyB0aGUgYXBwbGljYXRpb24gdGhlbWVcbiAgICogQHByb3BlcnR5IGFwcGxpY2F0aW9uVGhlbWVcbiAgICogQHR5cGUge0FwcGxpY2F0aW9uVGhlbWV9XG4gICAqIEBtZW1iZXJvZiBVbml2ZXJzYWxTa2lsbHNTcGlkZXJDaGFydHNDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGFwcGxpY2F0aW9uVGhlbWU6IEFwcGxpY2F0aW9uVGhlbWUgPSAnbGlnaHQnO1xuXG4gIC8qKlxuICAgKiBUaGUgbGlzdCBvZiBpdGVtcyB0byBiZSB1c2VkXG4gICAqIEBwcm9wZXJ0eSBpdGVtc1xuICAgKiBAdHlwZSB7U2tpbGxBcmVhRGF0YVtdfVxuICAgKiBAbWVtYmVyb2YgVW5pdmVyc2FsU2tpbGxzUmVwb3J0Q29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBza2lsbEFyZWFEYXRhTGlzdDogU2tpbGxBcmVhRGF0YVtdO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIGlmIHRoZSBjb21wb25lbnQgaXMgbG9hZGluZ1xuICAgKiBAcHJvcGVydHkgbG9hZGluZ1xuICAgKiBAdHlwZSB7Ym9vbGVhbn1cbiAgICogQG1lbWJlcm9mIFVuaXZlcnNhbFNraWxsc1NwaWRlckNoYXJ0c0NvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgbG9hZGluZzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIHJlYWRvbmx5IHRyYW5zbGF0aW9uQ29udGV4dCA9ICdVTklWRVJTQUxfU0tJTExTX1JFUE9SVC4nO1xuXG4gIHNraWxsQXJlYUdyb3VwTWFwOiBSZWNvcmQ8U2tpbGxBcmVhR3JvdXBUeXBlcywgU2tpbGxBcmVhR3JvdXA+O1xuICBza2lsbEFyZWFTcGlkZXJDaGFydERhdGE6IFNraWxsQXJlYVNwaWRlckNoYXJ0RGF0YVtdID0gW107XG5cbiAgY29uc3RydWN0b3IoXG4gICAgQE9wdGlvbmFsKCkgQEluamVjdCgnQ0FOT1BZVUlfREVGQVVMVF9BUFBMSUNBVElPTl9USEVNRScpIHByaXZhdGUgcmVhZG9ubHkgZGVmYXVsdEFwcFRoZW1lOiBBcHBsaWNhdGlvblRoZW1lLFxuICAgIHByaXZhdGUgdW5pdmVyc2FsU2tpbGxzU2VydmljZTogVW5pdmVyc2FsU2tpbGxzU2VydmljZSxcbiAgICBwcml2YXRlIHVpVHJhbnNsYXRlUGlwZTogVWlUcmFuc2xhdGVQaXBlXG4gICkge1xuICAgIGlmIChkZWZhdWx0QXBwVGhlbWUpIHtcbiAgICAgIHRoaXMuYXBwbGljYXRpb25UaGVtZSA9IGRlZmF1bHRBcHBUaGVtZTtcbiAgICB9XG4gIH1cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLnVuaXZlcnNhbFNraWxsc1NlcnZpY2UuaW5pdGlhbGl6ZVNraWxsQXJlYUdyb3VwTWFwKCk7XG4gICAgdGhpcy51bml2ZXJzYWxTa2lsbHNTZXJ2aWNlLnByZXBhcmVTa2lsbEFyZWFHcm91cE1hcCh0aGlzLnNraWxsQXJlYURhdGFMaXN0KTtcbiAgICB0aGlzLnNraWxsQXJlYUdyb3VwTWFwID0gdGhpcy51bml2ZXJzYWxTa2lsbHNTZXJ2aWNlLmdldFNraWxsQXJlYUdyb3VwTWFwKCk7XG4gICAgdGhpcy5wcmVwYXJlU3BpZGVyQ2hhcnREYXRhKCk7XG4gIH1cblxuICBwcmVwYXJlU3BpZGVyQ2hhcnREYXRhKCk6IHZvaWQge1xuICAgIHRoaXMuc2tpbGxBcmVhU3BpZGVyQ2hhcnREYXRhID0gW107XG4gICAgT2JqZWN0LnZhbHVlcyh0aGlzLnNraWxsQXJlYUdyb3VwTWFwKS5mb3JFYWNoKHNraWxsQXJlYUdyb3VwID0+IHtcbiAgICAgIGNvbnN0IGxhYmVsT2JzZXJ2YWJsZXMgPSBza2lsbEFyZWFHcm91cC5za2lsbEFyZWFMaXN0Lm1hcChza2lsbEFyZWEgPT5cbiAgICAgICAgdGhpcy51aVRyYW5zbGF0ZVBpcGUudHJhbnNmb3JtKGAke3RoaXMudHJhbnNsYXRpb25Db250ZXh0fVNLSUxMX0FSRUFfVFlQRVMuJHtza2lsbEFyZWEuc2tpbGxBcmVhTmFtZX0uVElUTEVgKVxuICAgICAgKTtcblxuICAgICAgY29uc3QgbGFiZWxEZXNjcmlwdGlvbk9ic2VydmFibGVzID0gc2tpbGxBcmVhR3JvdXAuc2tpbGxBcmVhTGlzdC5tYXAoc2tpbGxBcmVhID0+XG4gICAgICAgIHRoaXMudWlUcmFuc2xhdGVQaXBlLnRyYW5zZm9ybShcbiAgICAgICAgICBgJHt0aGlzLnRyYW5zbGF0aW9uQ29udGV4dH1TS0lMTF9BUkVBX1RZUEVTLiR7c2tpbGxBcmVhLnNraWxsQXJlYU5hbWV9LkRFU0NSSVBUSU9OYFxuICAgICAgICApXG4gICAgICApO1xuXG4gICAgICBjb25zdCBhbGxPYnNlcnZhYmxlcyA9IFsuLi5sYWJlbE9ic2VydmFibGVzLCAuLi5sYWJlbERlc2NyaXB0aW9uT2JzZXJ2YWJsZXNdO1xuICAgICAgY29uc3QgdHJhbnNsYXRpb25zOiBzdHJpbmdbXSA9IFtdO1xuICAgICAgYWxsT2JzZXJ2YWJsZXMuZm9yRWFjaChvYnNlcnZhYmxlID0+IHtcbiAgICAgICAgb2JzZXJ2YWJsZS5waXBlKHRha2UoMSkpLnN1YnNjcmliZSh0cmFuc2xhdGlvbiA9PiB7XG4gICAgICAgICAgdHJhbnNsYXRpb25zLnB1c2godHJhbnNsYXRpb24pO1xuICAgICAgICB9KTtcbiAgICAgIH0pO1xuICAgICAgY29uc3QgbGFiZWxzID0gdHJhbnNsYXRpb25zLnNsaWNlKDAsIGxhYmVsT2JzZXJ2YWJsZXMubGVuZ3RoKTtcbiAgICAgIGNvbnN0IGxhYmVsRGVzY3JpcHRpb25zID0gdHJhbnNsYXRpb25zLnNsaWNlKGxhYmVsT2JzZXJ2YWJsZXMubGVuZ3RoKTtcblxuICAgICAgdGhpcy5za2lsbEFyZWFTcGlkZXJDaGFydERhdGEucHVzaCh7XG4gICAgICAgIHRpdGxlOiBza2lsbEFyZWFHcm91cC50aXRsZSxcbiAgICAgICAgZGVzY3JpcHRpb246IHNraWxsQXJlYUdyb3VwLmRlc2NyaXB0aW9uLFxuICAgICAgICBzcGlkZXJDaGFydERhdGE6IHtcbiAgICAgICAgICBsYWJlbHM6IGxhYmVscyxcbiAgICAgICAgICBsYWJlbERlc2NyaXB0aW9uOiBsYWJlbERlc2NyaXB0aW9ucyxcbiAgICAgICAgICBwbG90RGF0YTpcbiAgICAgICAgICAgIHNraWxsQXJlYUdyb3VwLnNraWxsQXJlYUxpc3Q/LlswXT8ucG9vbFBlcmNlbnRpbGVTY29yaW5nICE9PSB1bmRlZmluZWRcbiAgICAgICAgICAgICAgPyBbXG4gICAgICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAgICAgIGRhdGE6IHNraWxsQXJlYUdyb3VwLnNraWxsQXJlYUxpc3QubWFwKHNraWxsQXJlYSA9PiBza2lsbEFyZWEucGVyY2VudGlsZVNjb3JpbmcpLFxuICAgICAgICAgICAgICAgICAgICBkYXRhYmFzZUxhYmVsOiBcIlRoaXMgY2FuZGlkYXRlJ3Mgc2NvcmVcIixcbiAgICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAgICAgIGRhdGE6IHNraWxsQXJlYUdyb3VwLnNraWxsQXJlYUxpc3QubWFwKHNraWxsQXJlYSA9PiBza2lsbEFyZWEucG9vbFBlcmNlbnRpbGVTY29yaW5nID8/IDApLFxuICAgICAgICAgICAgICAgICAgICBkYXRhYmFzZUxhYmVsOiAnQXZlcmFnZSBzY29yZSBvZiBhbGwgY2FuZGlkYXRlcycsXG4gICAgICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICAgIF1cbiAgICAgICAgICAgICAgOiBbXG4gICAgICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAgICAgIGRhdGE6IHNraWxsQXJlYUdyb3VwLnNraWxsQXJlYUxpc3QubWFwKHNraWxsQXJlYSA9PiBza2lsbEFyZWEucGVyY2VudGlsZVNjb3JpbmcpLFxuICAgICAgICAgICAgICAgICAgICBkYXRhYmFzZUxhYmVsOiBcIlRoaXMgY2FuZGlkYXRlJ3Mgc2NvcmVcIixcbiAgICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgICAgXSxcbiAgICAgICAgfSxcbiAgICAgIH0pO1xuICAgIH0pO1xuICB9XG59XG4iLCJAZm9yIChzcGlkZXJDaGFydERhdGEgb2Ygc2tpbGxBcmVhU3BpZGVyQ2hhcnREYXRhOyB0cmFjayBzcGlkZXJDaGFydERhdGEpIHtcbiAgPHVpLWFjY29yZGlvbiBjbGFzcz1cInVuaXZlcnNhbC1za2lsbHMtc3BpZGVyLWNoYXJ0c1wiIFtsYWJlbF09XCIoc3BpZGVyQ2hhcnREYXRhLnRpdGxlIHwgdWlUcmFuc2xhdGUgfCBhc3luYykgfHwgJydcIiB2YXJpYW50PVwiZmlsdGVyXCI+XG4gICAgPHVpLXNwaWRlci1jaGFydCBbc3BpZGVyQ2hhcnREYXRhXT1cInNwaWRlckNoYXJ0RGF0YS5zcGlkZXJDaGFydERhdGFcIiBbbG9hZGluZ109XCJsb2FkaW5nXCI+PC91aS1zcGlkZXItY2hhcnQ+XG4gIDwvdWktYWNjb3JkaW9uPlxuICBAaWYgKCRpbmRleCA8IHNraWxsQXJlYVNwaWRlckNoYXJ0RGF0YS5sZW5ndGggLSAxKSB7XG4gICAgPHVpLWRpdmlkZXIgY2xhc3M9XCJ1bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMtZGl2aWRlclwiIHNpemU9XCJzbWFsbFwiPjwvdWktZGl2aWRlcj5cbiAgfVxufVxuIl19
109
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Rnby1jYW5vcHktdWkvY29tcG9uZW50cy91bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMvdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Rnby1jYW5vcHktdWkvY29tcG9uZW50cy91bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMvdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBVSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFVcEcsT0FBTyxFQUFZLElBQUksRUFBRSxNQUFNLE1BQU0sQ0FBQzs7Ozs7Ozs7QUFRdEMsTUFBTSxPQUFPLG9DQUFvQztJQXNDL0MsWUFDNkUsZUFBaUMsRUFDcEcsc0JBQThDLEVBQzlDLGVBQWdDO1FBRm1DLG9CQUFlLEdBQWYsZUFBZSxDQUFrQjtRQUNwRywyQkFBc0IsR0FBdEIsc0JBQXNCLENBQXdCO1FBQzlDLG9CQUFlLEdBQWYsZUFBZSxDQUFpQjtRQXhDMUM7Ozs7O1dBS0c7UUFDTSxxQkFBZ0IsR0FBcUIsT0FBTyxDQUFDO1FBVXREOzs7OztXQUtHO1FBQ00sWUFBTyxHQUFZLEtBQUssQ0FBQztRQUVsQzs7Ozs7V0FLRztRQUNNLFNBQUksR0FBc0IsT0FBTyxDQUFDO1FBRWxDLHVCQUFrQixHQUFHLDBCQUEwQixDQUFDO1FBR3pELDZCQUF3QixHQUErQixFQUFFLENBQUM7UUFPeEQsSUFBSSxlQUFlLEVBQUUsQ0FBQztZQUNwQixJQUFJLENBQUMsZ0JBQWdCLEdBQUcsZUFBZSxD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QUFDO2dDQUNoRixhQUFhLEVBQUUsd0JBQXdCOzZCQUN4Qzt5QkFDRjtpQkFDUjthQUNGLENBQUMsQ0FBQztRQUNMLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0F6R1Usb0NBQW9DLGtCQXVDekIsb0NBQW9DO21HQXZDL0Msb0NBQW9DLHFNQ2xCakQsb2hCQVFBOzs0RkRVYSxvQ0FBb0M7a0JBTmhELFNBQVM7K0JBQ0UsbUNBQW1DLG1CQUc1Qix1QkFBdUIsQ0FBQyxNQUFNOzswQkF5QzVDLFFBQVE7OzBCQUFJLE1BQU07MkJBQUMsb0NBQW9DOzRHQWhDakQsZ0JBQWdCO3NCQUF4QixLQUFLO2dCQVFHLGlCQUFpQjtzQkFBekIsS0FBSztnQkFRRyxPQUFPO3NCQUFmLEtBQUs7Z0JBUUcsSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSW5qZWN0LCBJbnB1dCwgT25Jbml0LCBPcHRpb25hbCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQXBwbGljYXRpb25UaGVtZSB9IGZyb20gJy4uLy4uL21vZGVscy9hcHBsaWNhdGlvbi10aGVtZS5tb2RlbCc7XG5pbXBvcnQge1xuICBTa2lsbEFyZWFEYXRhLFxuICBTa2lsbEFyZWFHcm91cCxcbiAgU2tpbGxBcmVhR3JvdXBUeXBlcyxcbiAgU2tpbGxBcmVhU3BpZGVyQ2hhcnREYXRhLFxufSBmcm9tICcuLi8uLi9tb2RlbHMvdW5pdmVyc2FsLXNraWxscy1yZXBvcnQubW9kZWwnO1xuaW1wb3J0IHsgVW5pdmVyc2FsU2tpbGxzU2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL3VuaXZlcnNhbC1za2lsbHMuc2VydmljZSc7XG5pbXBvcnQgeyBVaVRyYW5zbGF0ZVBpcGUgfSBmcm9tICcuLi8uLi9waXBlcy91aS10cmFuc2xhdGUucGlwZSc7XG5pbXBvcnQgeyBmb3JrSm9pbiwgdGFrZSB9IGZyb20gJ3J4anMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd1aS11bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMnLFxuICB0ZW1wbGF0ZVVybDogJy4vdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzLmNvbXBvbmVudC5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBVbml2ZXJzYWxTa2lsbHNTcGlkZXJDaGFydHNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICAvKipcbiAgICogRGVmaW5lcyB0aGUgYXBwbGljYXRpb24gdGhlbWVcbiAgICogQHByb3BlcnR5IGFwcGxpY2F0aW9uVGhlbWVcbiAgICogQHR5cGUge0FwcGxpY2F0aW9uVGhlbWV9XG4gICAqIEBtZW1iZXJvZiBVbml2ZXJzYWxTa2lsbHNTcGlkZXJDaGFydHNDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGFwcGxpY2F0aW9uVGhlbWU6IEFwcGxpY2F0aW9uVGhlbWUgPSAnbGlnaHQnO1xuXG4gIC8qKlxuICAgKiBUaGUgbGlzdCBvZiBpdGVtcyB0byBiZSB1c2VkXG4gICAqIEBwcm9wZXJ0eSBpdGVtc1xuICAgKiBAdHlwZSB7U2tpbGxBcmVhRGF0YVtdfVxuICAgKiBAbWVtYmVyb2YgVW5pdmVyc2FsU2tpbGxzUmVwb3J0Q29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBza2lsbEFyZWFEYXRhTGlzdDogU2tpbGxBcmVhRGF0YVtdO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIGlmIHRoZSBjb21wb25lbnQgaXMgbG9hZGluZ1xuICAgKiBAcHJvcGVydHkgbG9hZGluZ1xuICAgKiBAdHlwZSB7Ym9vbGVhbn1cbiAgICogQG1lbWJlcm9mIFVuaXZlcnNhbFNraWxsc1NwaWRlckNoYXJ0c0NvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgbG9hZGluZzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBEZWZpbmVzIHRoZSBzaXplIG9mIHRoZSBzcGlkZXIgY2hhcnRcbiAgICogQHByb3BlcnR5IHNpemVcbiAgICogQHR5cGUgeydzbWFsbCcgfCAnbGFyZ2UnfVxuICAgKiBAbWVtYmVyb2YgVW5pdmVyc2FsU2tpbGxzU3BpZGVyQ2hhcnRzQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBzaXplOiAnc21hbGwnIHwgJ2xhcmdlJyA9ICdsYXJnZSc7XG5cbiAgcmVhZG9ubHkgdHJhbnNsYXRpb25Db250ZXh0ID0gJ1VOSVZFUlNBTF9TS0lMTFNfUkVQT1JULic7XG5cbiAgc2tpbGxBcmVhR3JvdXBNYXA6IFJlY29yZDxTa2lsbEFyZWFHcm91cFR5cGVzLCBTa2lsbEFyZWFHcm91cD47XG4gIHNraWxsQXJlYVNwaWRlckNoYXJ0RGF0YTogU2tpbGxBcmVhU3BpZGVyQ2hhcnREYXRhW10gPSBbXTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBAT3B0aW9uYWwoKSBASW5qZWN0KCdDQU5PUFlVSV9ERUZBVUxUX0FQUExJQ0FUSU9OX1RIRU1FJykgcHJpdmF0ZSByZWFkb25seSBkZWZhdWx0QXBwVGhlbWU6IEFwcGxpY2F0aW9uVGhlbWUsXG4gICAgcHJpdmF0ZSB1bml2ZXJzYWxTa2lsbHNTZXJ2aWNlOiBVbml2ZXJzYWxTa2lsbHNTZXJ2aWNlLFxuICAgIHByaXZhdGUgdWlUcmFuc2xhdGVQaXBlOiBVaVRyYW5zbGF0ZVBpcGVcbiAgKSB7XG4gICAgaWYgKGRlZmF1bHRBcHBUaGVtZSkge1xuICAgICAgdGhpcy5hcHBsaWNhdGlvblRoZW1lID0gZGVmYXVsdEFwcFRoZW1lO1xuICAgIH1cbiAgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMudW5pdmVyc2FsU2tpbGxzU2VydmljZS5pbml0aWFsaXplU2tpbGxBcmVhR3JvdXBNYXAoKTtcbiAgICB0aGlzLnVuaXZlcnNhbFNraWxsc1NlcnZpY2UucHJlcGFyZVNraWxsQXJlYUdyb3VwTWFwKHRoaXMuc2tpbGxBcmVhRGF0YUxpc3QpO1xuICAgIHRoaXMuc2tpbGxBcmVhR3JvdXBNYXAgPSB0aGlzLnVuaXZlcnNhbFNraWxsc1NlcnZpY2UuZ2V0U2tpbGxBcmVhR3JvdXBNYXAoKTtcbiAgICB0aGlzLnByZXBhcmVTcGlkZXJDaGFydERhdGEoKTtcbiAgfVxuXG4gIHByZXBhcmVTcGlkZXJDaGFydERhdGEoKTogdm9pZCB7XG4gICAgdGhpcy5za2lsbEFyZWFTcGlkZXJDaGFydERhdGEgPSBbXTtcbiAgICBPYmplY3QudmFsdWVzKHRoaXMuc2tpbGxBcmVhR3JvdXBNYXApLmZvckVhY2goc2tpbGxBcmVhR3JvdXAgPT4ge1xuICAgICAgY29uc3QgbGFiZWxPYnNlcnZhYmxlcyA9IHNraWxsQXJlYUdyb3VwLnNraWxsQXJlYUxpc3QubWFwKHNraWxsQXJlYSA9PlxuICAgICAgICB0aGlzLnVpVHJhbnNsYXRlUGlwZS50cmFuc2Zvcm0oYCR7dGhpcy50cmFuc2xhdGlvbkNvbnRleHR9U0tJTExfQVJFQV9UWVBFUy4ke3NraWxsQXJlYS5za2lsbEFyZWFOYW1lfS5USVRMRWApXG4gICAgICApO1xuXG4gICAgICBjb25zdCBsYWJlbERlc2NyaXB0aW9uT2JzZXJ2YWJsZXMgPSBza2lsbEFyZWFHcm91cC5za2lsbEFyZWFMaXN0Lm1hcChza2lsbEFyZWEgPT5cbiAgICAgICAgdGhpcy51aVRyYW5zbGF0ZVBpcGUudHJhbnNmb3JtKFxuICAgICAgICAgIGAke3RoaXMudHJhbnNsYXRpb25Db250ZXh0fVNLSUxMX0FSRUFfVFlQRVMuJHtza2lsbEFyZWEuc2tpbGxBcmVhTmFtZX0uREVTQ1JJUFRJT05gXG4gICAgICAgIClcbiAgICAgICk7XG5cbiAgICAgIGNvbnN0IGFsbE9ic2VydmFibGVzID0gWy4uLmxhYmVsT2JzZXJ2YWJsZXMsIC4uLmxhYmVsRGVzY3JpcHRpb25PYnNlcnZhYmxlc107XG4gICAgICBjb25zdCB0cmFuc2xhdGlvbnM6IHN0cmluZ1tdID0gW107XG4gICAgICBhbGxPYnNlcnZhYmxlcy5mb3JFYWNoKG9ic2VydmFibGUgPT4ge1xuICAgICAgICBvYnNlcnZhYmxlLnBpcGUodGFrZSgxKSkuc3Vic2NyaWJlKHRyYW5zbGF0aW9uID0+IHtcbiAgICAgICAgICB0cmFuc2xhdGlvbnMucHVzaCh0cmFuc2xhdGlvbik7XG4gICAgICAgIH0pO1xuICAgICAgfSk7XG4gICAgICBjb25zdCBsYWJlbHMgPSB0cmFuc2xhdGlvbnMuc2xpY2UoMCwgbGFiZWxPYnNlcnZhYmxlcy5sZW5ndGgpO1xuICAgICAgY29uc3QgbGFiZWxEZXNjcmlwdGlvbnMgPSB0cmFuc2xhdGlvbnMuc2xpY2UobGFiZWxPYnNlcnZhYmxlcy5sZW5ndGgpO1xuXG4gICAgICB0aGlzLnNraWxsQXJlYVNwaWRlckNoYXJ0RGF0YS5wdXNoKHtcbiAgICAgICAgdGl0bGU6IHNraWxsQXJlYUdyb3VwLnRpdGxlLFxuICAgICAgICBkZXNjcmlwdGlvbjogc2tpbGxBcmVhR3JvdXAuZGVzY3JpcHRpb24sXG4gICAgICAgIHNwaWRlckNoYXJ0RGF0YToge1xuICAgICAgICAgIGxhYmVsczogbGFiZWxzLFxuICAgICAgICAgIGxhYmVsRGVzY3JpcHRpb246IGxhYmVsRGVzY3JpcHRpb25zLFxuICAgICAgICAgIHBsb3REYXRhOlxuICAgICAgICAgICAgc2tpbGxBcmVhR3JvdXAuc2tpbGxBcmVhTGlzdD8uWzBdPy5wb29sUGVyY2VudGlsZVNjb3JpbmcgIT09IHVuZGVmaW5lZFxuICAgICAgICAgICAgICA/IFtcbiAgICAgICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICAgICAgZGF0YTogc2tpbGxBcmVhR3JvdXAuc2tpbGxBcmVhTGlzdC5tYXAoc2tpbGxBcmVhID0+IHNraWxsQXJlYS5wZXJjZW50aWxlU2NvcmluZyksXG4gICAgICAgICAgICAgICAgICAgIGRhdGFiYXNlTGFiZWw6IFwiVGhpcyBjYW5kaWRhdGUncyBzY29yZVwiLFxuICAgICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICAgICAgZGF0YTogc2tpbGxBcmVhR3JvdXAuc2tpbGxBcmVhTGlzdC5tYXAoc2tpbGxBcmVhID0+IHNraWxsQXJlYS5wb29sUGVyY2VudGlsZVNjb3JpbmcgPz8gMCksXG4gICAgICAgICAgICAgICAgICAgIGRhdGFiYXNlTGFiZWw6ICdBdmVyYWdlIHNjb3JlIG9mIGFsbCBjYW5kaWRhdGVzJyxcbiAgICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgICAgXVxuICAgICAgICAgICAgICA6IFtcbiAgICAgICAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICAgICAgZGF0YTogc2tpbGxBcmVhR3JvdXAuc2tpbGxBcmVhTGlzdC5tYXAoc2tpbGxBcmVhID0+IHNraWxsQXJlYS5wZXJjZW50aWxlU2NvcmluZyksXG4gICAgICAgICAgICAgICAgICAgIGRhdGFiYXNlTGFiZWw6IFwiVGhpcyBjYW5kaWRhdGUncyBzY29yZVwiLFxuICAgICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgICBdLFxuICAgICAgICB9LFxuICAgICAgfSk7XG4gICAgfSk7XG4gIH1cbn1cbiIsIkBmb3IgKHNwaWRlckNoYXJ0RGF0YSBvZiBza2lsbEFyZWFTcGlkZXJDaGFydERhdGE7IHRyYWNrIHNwaWRlckNoYXJ0RGF0YSkge1xuICA8dWktYWNjb3JkaW9uIGNsYXNzPVwidW5pdmVyc2FsLXNraWxscy1zcGlkZXItY2hhcnRzXCIgW2xhYmVsXT1cIihzcGlkZXJDaGFydERhdGEudGl0bGUgfCB1aVRyYW5zbGF0ZSB8IGFzeW5jKSB8fCAnJ1wiIHZhcmlhbnQ9XCJmaWx0ZXJcIj5cbiAgICA8dWktc3BpZGVyLWNoYXJ0IFtzcGlkZXJDaGFydERhdGFdPVwic3BpZGVyQ2hhcnREYXRhLnNwaWRlckNoYXJ0RGF0YVwiIFtsb2FkaW5nXT1cImxvYWRpbmdcIiBbc2l6ZV09XCJzaXplXCI+PC91aS1zcGlkZXItY2hhcnQ+XG4gIDwvdWktYWNjb3JkaW9uPlxuICBAaWYgKCRpbmRleCA8IHNraWxsQXJlYVNwaWRlckNoYXJ0RGF0YS5sZW5ndGggLSAxKSB7XG4gICAgPHVpLWRpdmlkZXIgY2xhc3M9XCJ1bml2ZXJzYWwtc2tpbGxzLXNwaWRlci1jaGFydHMtZGl2aWRlclwiIHNpemU9XCJzbWFsbFwiPjwvdWktZGl2aWRlcj5cbiAgfVxufVxuIl19
package/fesm2022/testgorilla-tgo-ui.mjs CHANGED
@@ -16348,11 +16348,11 @@ class SpiderChartComponent {
16348
16348
  return label.substring(firstLine.length).trim();
16349
16349
  }
16350
16350
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpiderChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
16351
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: SpiderChartComponent, selector: "ui-spider-chart", inputs: { size: "size", spiderChartData: "spiderChartData", stepSize: "stepSize", ariaLabel: "ariaLabel", loading: "loading", applicationTheme: "applicationTheme" }, viewQueries: [{ propertyName: "chart", first: true, predicate: BaseChartDirective, descendants: true }, { propertyName: "labelContainers", predicate: ["labelContainer"], descendants: true }, { propertyName: "fakeDataPoints", predicate: ["fakeDataPoints"], descendants: true }, { propertyName: "fakeDataPointsSecondary", predicate: ["fakeDataPointsSecondary"], descendants: true }, { propertyName: "legendItems", predicate: ["legendItem"], descendants: true }], ngImport: i0, template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$b.BaseChartDirective, selector: "canvas[baseChart]", inputs: ["type", "legend", "data", "options", "plugins", "labels", "datasets"], outputs: ["chartClick", "chartHover"], exportAs: ["base-chart"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: SpinnerComponent, selector: "ui-spinner", inputs: ["size", "isLoader", "applicationTheme"] }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: MemoizeFuncPipe, name: "memoizeFunc" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
16351
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: SpiderChartComponent, selector: "ui-spider-chart", inputs: { size: "size", spiderChartData: "spiderChartData", stepSize: "stepSize", ariaLabel: "ariaLabel", loading: "loading", applicationTheme: "applicationTheme" }, viewQueries: [{ propertyName: "chart", first: true, predicate: BaseChartDirective, descendants: true }, { propertyName: "labelContainers", predicate: ["labelContainer"], descendants: true }, { propertyName: "fakeDataPoints", predicate: ["fakeDataPoints"], descendants: true }, { propertyName: "fakeDataPointsSecondary", predicate: ["fakeDataPointsSecondary"], descendants: true }, { propertyName: "legendItems", predicate: ["legendItem"], descendants: true }], ngImport: i0, template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}:host ::ng-deep .spider-chart-container .spinner-container.loader{position:absolute}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$b.BaseChartDirective, selector: "canvas[baseChart]", inputs: ["type", "legend", "data", "options", "plugins", "labels", "datasets"], outputs: ["chartClick", "chartHover"], exportAs: ["base-chart"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: SpinnerComponent, selector: "ui-spinner", inputs: ["size", "isLoader", "applicationTheme"] }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: MemoizeFuncPipe, name: "memoizeFunc" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
16352
16352
  }
16353
16353
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SpiderChartComponent, decorators: [{
16354
16354
  type: Component,
16355
- args: [{ selector: 'ui-spider-chart', template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}\n"] }]
16355
+ args: [{ selector: 'ui-spider-chart', template: "<div class=\"spider-chart-container\"\n tabindex=\"0\"\n [attr.aria-label]=\"ariaLabel\">\n <div class=\"spacing-container\"\n [ngClass]=\"{'small-spacing': radarChartData.labels && radarChartData.labels.length % 2 === 1 && !loading}\">\n <div class=\"chart-container\"\n [style.width]=\"size === 'large' ? '280px' : '200px'\"\n [style.height]=\"size === 'large' ? '280px' : '200px'\">\n @if (!loading) {\n <canvas\n baseChart\n [data]=\"radarChartData\"\n [options]=\"radarChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n } @else {\n <canvas\n baseChart\n [data]=\"loadingChartData\"\n [options]=\"loadingChartOptions\"\n type=\"radar\"\n class=\"chart\"\n >\n </canvas>\n <ui-spinner></ui-spinner>\n }\n\n @if (labelPositionsVisible) {\n <div class=\"overlay-container\">\n @for (label of spiderChartData.labels; track label) {\n <div class=\"label-container\" #labelContainer\n [matTooltip]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n (keydown)=\"onLabelKeyDown($event, $index)\"\n [attr.aria-label]=\"label + ': ' + spiderChartData.labelDescription[$index]\"\n [style.left]=\"getCenteredLabelLeftPosition(label, labelContainer.offsetWidth)\"\n [style.bottom]=\"getCenteredLabelBottomPosition(label, labelContainer.offsetHeight)\">\n @if (!(label.length > 20 && size === 'large' && spiderChartData.labels.length < 9)) {\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">\n {{ label }}\n </div>\n } @else {\n <div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getFirstLine }}</div>\n <div class=\"label\" [style.max-width]=\"size === 'large' ? '135px' : '100px'\">{{ label | memoizeFunc : getSecondLine : this }}</div>\n </div>\n }\n <span class=\"value\">{{ spiderChartData.plotData[0].data[$index] }}</span>\n </div>\n <span class=\"fake-data-points\" #fakeDataPoints\n [tabindex]=\"focusedLabelIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedLabelIndex ? showTooltipForDataPoint($index) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index)\">\n </span>\n @if (radarChartData.datasets.length > 1) {\n <span class=\"fake-data-points-secondary\" #fakeDataPointsSecondary\n [tabindex]=\"focusedFakeDataPointIndex === $index ? '0' : '-1'\"\n (focus)=\"$index === focusedFakeDataPointIndex ? showTooltipForDataPoint($index, true) : null\"\n (keydown)=\"onFakeDataPointsKeyDown($event, $index, true)\">\n </span>\n }\n }\n </div>\n }\n </div>\n </div>\n @if (radarChartData.datasets.length > 0) {\n <div class=\"legend-container\">\n @for (dataset of radarChartData.datasets; track dataset.label) {\n <div class=\"legend-item\"\n (click)=\"toggleDatasetVisibility($index)\"\n [tabindex]=\"$index === 0 ? '0' : '-1'\"\n role=\"button\"\n [attr.aria-pressed]=\"isDatasetVisible($index) ? false : true\"\n [attr.aria-label]=\"isDatasetVisible($index) ?\n ((translationContext + 'DATASET_VISIBLE') | uiTranslate : { dataset: dataset.label } | async) :\n ((translationContext + 'DATASET_HIDDEN') | uiTranslate : { dataset: dataset.label } | async)\"\n (keydown)=\"onLegendItemKeyDown($event, $index)\"\n #legendItem>\n <span class=\"legend-line\" [ngClass]=\"{'solid-line': $index === 0, 'dashed-line': $index === 1}\"></span>\n <span class=\"legend-label\" [style.text-decoration]=\"isDatasetVisible($index) ? 'none' : 'line-through'\">\n {{ dataset.label }}\n </span>\n </div>\n }\n </div>\n }\n</div>\n\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.spider-chart-container{display:flex;flex-direction:column;align-items:center}.spider-chart-container .spacing-container{padding:40px 140px}.spider-chart-container .spacing-container.small-spacing{padding:0 80px}.spider-chart-container .spacing-container .chart-container{position:relative}.spider-chart-container .spacing-container .chart-container .overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container{display:flex;gap:4px;position:absolute;pointer-events:all;cursor:pointer}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .fake-data-points{visibility:hidden}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container:focus{outline:none}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .label{font-size:12px;border-bottom:1px dashed #D3D3D3;white-space:nowrap;overflow:hidden;width:fit-content;text-overflow:ellipsis}.spider-chart-container .spacing-container .chart-container .overlay-container .label-container .value{font-weight:700}.spider-chart-container .legend-container{display:flex;gap:16px;cursor:pointer}.spider-chart-container .legend-container .legend-item{display:flex;align-items:center;gap:8px}.spider-chart-container .legend-container .legend-item .legend-line{display:inline-block;width:11px;height:4px}.spider-chart-container .legend-container .legend-item .solid-line{background-color:#d410aa}.spider-chart-container .legend-container .legend-item .dashed-line{border-top:2px dashed #242424}:host ::ng-deep .spider-chart-container .spinner-container.loader{position:absolute}\n"] }]
16356
16356
  }], propDecorators: { size: [{
16357
16357
  type: Input
16358
16358
  }], spiderChartData: [{
@@ -16873,6 +16873,13 @@ class UniversalSkillsSpiderChartsComponent {
16873
16873
  * @memberof UniversalSkillsSpiderChartsComponent
16874
16874
  */
16875
16875
  this.loading = false;
16876
+ /**
16877
+ * Defines the size of the spider chart
16878
+ * @property size
16879
+ * @type {'small' | 'large'}
16880
+ * @memberof UniversalSkillsSpiderChartsComponent
16881
+ */
16882
+ this.size = 'large';
16876
16883
  this.translationContext = 'UNIVERSAL_SKILLS_REPORT.';
16877
16884
  this.skillAreaSpiderChartData = [];
16878
16885
  if (defaultAppTheme) {
@@ -16927,11 +16934,11 @@ class UniversalSkillsSpiderChartsComponent {
16927
16934
  });
16928
16935
  }
16929
16936
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UniversalSkillsSpiderChartsComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: UniversalSkillsService }, { token: UiTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
16930
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: UniversalSkillsSpiderChartsComponent, selector: "ui-universal-skills-spider-charts", inputs: { applicationTheme: "applicationTheme", skillAreaDataList: "skillAreaDataList", loading: "loading" }, ngImport: i0, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: AccordionComponent, selector: "ui-accordion", inputs: ["label", "open", "disabled", "showPremiumIcon", "premiumTooltipText", "applicationTheme", "labelIcon", "variant", "allowCustomHeader", "noBackgroundColor", "toggleIconPosition"], outputs: ["closed", "opened"] }, { kind: "component", type: SpiderChartComponent, selector: "ui-spider-chart", inputs: ["size", "spiderChartData", "stepSize", "ariaLabel", "loading", "applicationTheme"] }, { kind: "component", type: DividerComponent, selector: "ui-divider", inputs: ["size", "companyColor", "applicationTheme", "label"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
16937
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: UniversalSkillsSpiderChartsComponent, selector: "ui-universal-skills-spider-charts", inputs: { applicationTheme: "applicationTheme", skillAreaDataList: "skillAreaDataList", loading: "loading", size: "size" }, ngImport: i0, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\" [size]=\"size\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: AccordionComponent, selector: "ui-accordion", inputs: ["label", "open", "disabled", "showPremiumIcon", "premiumTooltipText", "applicationTheme", "labelIcon", "variant", "allowCustomHeader", "noBackgroundColor", "toggleIconPosition"], outputs: ["closed", "opened"] }, { kind: "component", type: SpiderChartComponent, selector: "ui-spider-chart", inputs: ["size", "spiderChartData", "stepSize", "ariaLabel", "loading", "applicationTheme"] }, { kind: "component", type: DividerComponent, selector: "ui-divider", inputs: ["size", "companyColor", "applicationTheme", "label"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
16931
16938
  }
16932
16939
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UniversalSkillsSpiderChartsComponent, decorators: [{
16933
16940
  type: Component,
16934
- args: [{ selector: 'ui-universal-skills-spider-charts', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"] }]
16941
+ args: [{ selector: 'ui-universal-skills-spider-charts', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (spiderChartData of skillAreaSpiderChartData; track spiderChartData) {\n <ui-accordion class=\"universal-skills-spider-charts\" [label]=\"(spiderChartData.title | uiTranslate | async) || ''\" variant=\"filter\">\n <ui-spider-chart [spiderChartData]=\"spiderChartData.spiderChartData\" [loading]=\"loading\" [size]=\"size\"></ui-spider-chart>\n </ui-accordion>\n @if ($index < skillAreaSpiderChartData.length - 1) {\n <ui-divider class=\"universal-skills-spider-charts-divider\" size=\"small\"></ui-divider>\n }\n}\n", styles: [".universal-skills-spider-charts ::ng-deep .accordion-wrapper[theme=light] .mat-expansion-panel .mat-expansion-panel-header .accordion-label{font-weight:700}.universal-skills-spider-charts-divider ::ng-deep .ui-divider-wrapper{margin-top:8px;margin-bottom:8px}\n"] }]
16935
16942
  }], ctorParameters: () => [{ type: undefined, decorators: [{
16936
16943
  type: Optional
16937
16944
  }, {
@@ -16943,6 +16950,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
16943
16950
  type: Input
16944
16951
  }], loading: [{
16945
16952
  type: Input
16953
+ }], size: [{
16954
+ type: Input
16946
16955
  }] } });
16947
16956
 
16948
16957
  class UniversalSkillsSpiderChartsComponentModule {