cps-ui-kit 21.15.0 → 21.17.0
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.
- package/fesm2022/cps-ui-kit.mjs +207 -207
- package/fesm2022/cps-ui-kit.mjs.map +1 -1
- package/package.json +1 -1
- package/styles/styles.scss +0 -12
package/fesm2022/cps-ui-kit.mjs
CHANGED
|
@@ -333,10 +333,10 @@ class CpsIconComponent {
|
|
|
333
333
|
break;
|
|
334
334
|
}
|
|
335
335
|
}
|
|
336
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
337
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
336
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsIconComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
337
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsIconComponent, isStandalone: true, selector: "cps-icon", inputs: { icon: "icon", size: "size", color: "color" }, usesOnChanges: true, ngImport: i0, template: "@if (icon) {\n <i\n [ngClass]=\"classesList\"\n [style.color]=\"iconColor\"\n [ngStyle]=\"{\n width: cvtSize || 'none',\n height: cvtSize || 'none',\n display: 'flex'\n }\">\n <svg>\n <use attr.xlink:href=\"{{ url }}icons.svg#{{ icon }}\"></use>\n </svg>\n </i>\n}\n", styles: [":host{display:inline-flex}:host .cps-icon--fill{width:100%;height:100%}:host .cps-icon--xsmall{width:.75rem;height:.75rem}:host .cps-icon--small{width:1rem;height:1rem}:host .cps-icon--normal{width:1.5rem;height:1.5rem}:host .cps-icon--large{width:2rem;height:2rem}:host svg{color:inherit;fill:currentColor;height:100%;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
338
338
|
}
|
|
339
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
339
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsIconComponent, decorators: [{
|
|
340
340
|
type: Component,
|
|
341
341
|
args: [{ imports: [CommonModule], selector: 'cps-icon', template: "@if (icon) {\n <i\n [ngClass]=\"classesList\"\n [style.color]=\"iconColor\"\n [ngStyle]=\"{\n width: cvtSize || 'none',\n height: cvtSize || 'none',\n display: 'flex'\n }\">\n <svg>\n <use attr.xlink:href=\"{{ url }}icons.svg#{{ icon }}\"></use>\n </svg>\n </i>\n}\n", styles: [":host{display:inline-flex}:host .cps-icon--fill{width:100%;height:100%}:host .cps-icon--xsmall{width:.75rem;height:.75rem}:host .cps-icon--small{width:1rem;height:1rem}:host .cps-icon--normal{width:1.5rem;height:1.5rem}:host .cps-icon--large{width:2rem;height:2rem}:host svg{color:inherit;fill:currentColor;height:100%;width:100%}\n"] }]
|
|
342
342
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -425,10 +425,10 @@ class CpsChipComponent {
|
|
|
425
425
|
event.preventDefault();
|
|
426
426
|
this.closed.emit(this.label);
|
|
427
427
|
}
|
|
428
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
429
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
428
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
429
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsChipComponent, isStandalone: true, selector: "cps-chip", inputs: { label: "label", icon: "icon", iconColor: "iconColor", iconPosition: "iconPosition", closable: "closable", disabled: "disabled", closeButtonAriaLabel: "closeButtonAriaLabel" }, outputs: { closed: "closed" }, usesOnChanges: true, ngImport: i0, template: "<div [ngClass]=\"classesList\" [attr.aria-label]=\"label\">\n @if (icon) {\n <cps-icon\n class=\"cps-chip-icon\"\n [icon]=\"icon\"\n [color]=\"iconColor\"></cps-icon>\n }\n <span class=\"cps-chip-label\">{{ label }}</span>\n @if (closable) {\n <cps-icon\n role=\"button\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-label]=\"closeButtonAriaLabel\"\n [attr.aria-disabled]=\"disabled\"\n class=\"cps-chip-close-icon\"\n icon=\"close-x\"\n size=\"xsmall\"\n color=\"text-darkest\"\n (click)=\"onCloseClick($event)\"\n (keydown.enter)=\"onCloseClick($event)\"\n (keydown.space)=\"onCloseClick($event)\">\n </cps-icon>\n }\n</div>\n", styles: [":host{width:fit-content;display:inline-block;-webkit-user-select:none;-ms-user-select:none;user-select:none}:host .cps-chip{align-items:center;display:inline-flex;background-color:var(--cps-color-bg-dark);border-radius:.875rem;line-height:1rem;padding:.25rem .75rem;cursor:default}:host .cps-chip-close-icon{margin-left:.375rem;cursor:pointer}:host .cps-chip-close-icon:focus{outline:none}:host .cps-chip-close-icon:focus-visible{outline:none;position:relative}:host .cps-chip-close-icon:focus-visible:before,:host .cps-chip-close-icon:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host .cps-chip-close-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-chip-close-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-chip-close-icon:focus-visible.suppress-focus-visible:before,:host .cps-chip-close-icon:focus-visible.suppress-focus-visible:after{display:none}:host .cps-chip-close-icon:hover ::ng-deep .cps-icon{color:var(--cps-color-calm)!important}:host .cps-chip-label{font-size:.875rem;color:var(--cps-color-text-darkest);font-family:Source Sans Pro,sans-serif;font-style:normal;font-weight:400}:host .cps-chip.cps-chip-disabled{pointer-events:none;background-color:var(--cps-color-bg-mid)}:host .cps-chip.cps-chip-disabled .cps-chip-label{color:var(--cps-color-text-mild)}:host .cps-chip.cps-chip-disabled .cps-chip-icon ::ng-deep .cps-icon,:host .cps-chip.cps-chip-disabled .cps-chip-close-icon ::ng-deep .cps-icon{color:var(--cps-color-text-mild)!important}:host .cps-chip.cps-chip--icon-before .cps-chip-icon{margin-right:.375rem}:host .cps-chip.cps-chip--icon-after .cps-chip-icon{margin-left:.375rem;order:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }] }); }
|
|
430
430
|
}
|
|
431
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
431
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsChipComponent, decorators: [{
|
|
432
432
|
type: Component,
|
|
433
433
|
args: [{ imports: [CommonModule, CpsIconComponent], selector: 'cps-chip', template: "<div [ngClass]=\"classesList\" [attr.aria-label]=\"label\">\n @if (icon) {\n <cps-icon\n class=\"cps-chip-icon\"\n [icon]=\"icon\"\n [color]=\"iconColor\"></cps-icon>\n }\n <span class=\"cps-chip-label\">{{ label }}</span>\n @if (closable) {\n <cps-icon\n role=\"button\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-label]=\"closeButtonAriaLabel\"\n [attr.aria-disabled]=\"disabled\"\n class=\"cps-chip-close-icon\"\n icon=\"close-x\"\n size=\"xsmall\"\n color=\"text-darkest\"\n (click)=\"onCloseClick($event)\"\n (keydown.enter)=\"onCloseClick($event)\"\n (keydown.space)=\"onCloseClick($event)\">\n </cps-icon>\n }\n</div>\n", styles: [":host{width:fit-content;display:inline-block;-webkit-user-select:none;-ms-user-select:none;user-select:none}:host .cps-chip{align-items:center;display:inline-flex;background-color:var(--cps-color-bg-dark);border-radius:.875rem;line-height:1rem;padding:.25rem .75rem;cursor:default}:host .cps-chip-close-icon{margin-left:.375rem;cursor:pointer}:host .cps-chip-close-icon:focus{outline:none}:host .cps-chip-close-icon:focus-visible{outline:none;position:relative}:host .cps-chip-close-icon:focus-visible:before,:host .cps-chip-close-icon:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host .cps-chip-close-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-chip-close-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-chip-close-icon:focus-visible.suppress-focus-visible:before,:host .cps-chip-close-icon:focus-visible.suppress-focus-visible:after{display:none}:host .cps-chip-close-icon:hover ::ng-deep .cps-icon{color:var(--cps-color-calm)!important}:host .cps-chip-label{font-size:.875rem;color:var(--cps-color-text-darkest);font-family:Source Sans Pro,sans-serif;font-style:normal;font-weight:400}:host .cps-chip.cps-chip-disabled{pointer-events:none;background-color:var(--cps-color-bg-mid)}:host .cps-chip.cps-chip-disabled .cps-chip-label{color:var(--cps-color-text-mild)}:host .cps-chip.cps-chip-disabled .cps-chip-icon ::ng-deep .cps-icon,:host .cps-chip.cps-chip-disabled .cps-chip-close-icon ::ng-deep .cps-icon{color:var(--cps-color-text-mild)!important}:host .cps-chip.cps-chip--icon-before .cps-chip-icon{margin-right:.375rem}:host .cps-chip.cps-chip--icon-after .cps-chip-icon{margin-left:.375rem;order:1}\n"] }]
|
|
434
434
|
}], propDecorators: { label: [{
|
|
@@ -498,10 +498,10 @@ class CpsProgressLinearComponent {
|
|
|
498
498
|
this.cssColor = computed(() => getCSSColor(this.color(), this.document), ...(ngDevMode ? [{ debugName: "cssColor" }] : /* istanbul ignore next */ []));
|
|
499
499
|
this.cssBgColor = computed(() => getCSSColor(this.bgColor(), this.document), ...(ngDevMode ? [{ debugName: "cssBgColor" }] : /* istanbul ignore next */ []));
|
|
500
500
|
}
|
|
501
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
502
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
501
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsProgressLinearComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
502
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: CpsProgressLinearComponent, isStandalone: true, selector: "cps-progress-linear", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, opacity: { classPropertyName: "opacity", publicName: "opacity", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n class=\"cps-progress-linear\"\n [style.max-width]=\"cvtWidth()\"\n [style.height]=\"cvtHeight()\"\n [style.border-radius]=\"cvtRadius()\"\n [style.background]=\"cssBgColor()\">\n <div\n class=\"cps-progress-linear-line inc\"\n [style.background]=\"cssColor()\"\n [style.opacity]=\"opacity()\"></div>\n <div\n class=\"cps-progress-linear-line dec\"\n [style.background]=\"cssColor()\"\n [style.opacity]=\"opacity()\"></div>\n</div>\n", styles: [":host{width:100%}:host .cps-progress-linear{position:relative;overflow-x:hidden}:host .cps-progress-linear-line{position:absolute;height:inherit;left:-5%;top:0}:host .cps-progress-linear .inc{animation:increase 2s infinite}:host .cps-progress-linear .dec{animation:decrease 2s .5s infinite}@keyframes increase{0%{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes decrease{0%{left:-80%;width:80%}to{left:110%;width:10%}}\n"] }); }
|
|
503
503
|
}
|
|
504
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
504
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsProgressLinearComponent, decorators: [{
|
|
505
505
|
type: Component,
|
|
506
506
|
args: [{ selector: 'cps-progress-linear', template: "<div\n class=\"cps-progress-linear\"\n [style.max-width]=\"cvtWidth()\"\n [style.height]=\"cvtHeight()\"\n [style.border-radius]=\"cvtRadius()\"\n [style.background]=\"cssBgColor()\">\n <div\n class=\"cps-progress-linear-line inc\"\n [style.background]=\"cssColor()\"\n [style.opacity]=\"opacity()\"></div>\n <div\n class=\"cps-progress-linear-line dec\"\n [style.background]=\"cssColor()\"\n [style.opacity]=\"opacity()\"></div>\n</div>\n", styles: [":host{width:100%}:host .cps-progress-linear{position:relative;overflow-x:hidden}:host .cps-progress-linear-line{position:absolute;height:inherit;left:-5%;top:0}:host .cps-progress-linear .inc{animation:increase 2s infinite}:host .cps-progress-linear .dec{animation:decrease 2s .5s infinite}@keyframes increase{0%{left:-5%;width:5%}to{left:130%;width:100%}}@keyframes decrease{0%{left:-80%;width:80%}to{left:110%;width:10%}}\n"] }]
|
|
507
507
|
}], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }], opacity: [{ type: i0.Input, args: [{ isSignal: true, alias: "opacity", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }] } });
|
|
@@ -854,10 +854,10 @@ class CpsTooltipDirective {
|
|
|
854
854
|
setTimeout(() => el.remove(), 1000);
|
|
855
855
|
}, 100);
|
|
856
856
|
}
|
|
857
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
858
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.
|
|
857
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTooltipDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
858
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.13", type: CpsTooltipDirective, isStandalone: true, selector: "[cpsTooltip]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "cpsTooltip", isSignal: true, isRequired: true, transformFunction: null }, tooltipOpenDelay: { classPropertyName: "tooltipOpenDelay", publicName: "tooltipOpenDelay", isSignal: true, isRequired: false, transformFunction: null }, tooltipCloseDelay: { classPropertyName: "tooltipCloseDelay", publicName: "tooltipCloseDelay", isSignal: true, isRequired: false, transformFunction: null }, tooltipOpenOn: { classPropertyName: "tooltipOpenOn", publicName: "tooltipOpenOn", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltipPersistent: { classPropertyName: "tooltipPersistent", publicName: "tooltipPersistent", isSignal: true, isRequired: false, transformFunction: null }, tooltipDisabled: { classPropertyName: "tooltipDisabled", publicName: "tooltipDisabled", isSignal: true, isRequired: false, transformFunction: null }, tooltipMaxWidth: { classPropertyName: "tooltipMaxWidth", publicName: "tooltipMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, tooltipContentClass: { classPropertyName: "tooltipContentClass", publicName: "tooltipContentClass", isSignal: true, isRequired: false, transformFunction: null }, tooltipOffset: { classPropertyName: "tooltipOffset", publicName: "tooltipOffset", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "focusin": "onFocus()", "focusout": "onFocusOut($event)", "keydown.tab": "onTabFromTrigger($event)", "click": "onClick()", "document:click": "onDocumentClick($event.target)", "window:resize": "onPageResize()" } }, ngImport: i0 }); }
|
|
859
859
|
}
|
|
860
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
860
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTooltipDirective, decorators: [{
|
|
861
861
|
type: Directive,
|
|
862
862
|
args: [{
|
|
863
863
|
selector: '[cpsTooltip]',
|
|
@@ -911,10 +911,10 @@ class CpsInfoCircleComponent {
|
|
|
911
911
|
*/
|
|
912
912
|
this.tooltipPersistent = false;
|
|
913
913
|
}
|
|
914
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
915
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
914
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsInfoCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
915
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsInfoCircleComponent, isStandalone: true, selector: "cps-info-circle", inputs: { size: "size", tooltipText: "tooltipText", tooltipPosition: "tooltipPosition", tooltipContentClass: "tooltipContentClass", tooltipMaxWidth: "tooltipMaxWidth", tooltipPersistent: "tooltipPersistent" }, ngImport: i0, template: "<cps-icon\n icon=\"info-circle\"\n role=\"img\"\n aria-label=\"Information\"\n tabindex=\"0\"\n [size]=\"size\"\n color=\"info\"\n [cpsTooltip]=\"tooltipText\"\n tooltipOpenDelay=\"0\"\n tooltipCloseDelay=\"100\"\n [tooltipPosition]=\"tooltipPosition\"\n [tooltipMaxWidth]=\"tooltipMaxWidth\"\n [tooltipPersistent]=\"tooltipPersistent\"\n [tooltipContentClass]=\"tooltipContentClass\">\n</cps-icon>\n", styles: [":host{display:inline-flex}:host cps-icon:focus-visible{outline:none;position:relative}:host cps-icon:focus-visible:before,:host cps-icon:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host cps-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host cps-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host cps-icon:focus-visible.suppress-focus-visible:before,:host cps-icon:focus-visible.suppress-focus-visible:after{display:none}\n"], dependencies: [{ kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }] }); }
|
|
916
916
|
}
|
|
917
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
917
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsInfoCircleComponent, decorators: [{
|
|
918
918
|
type: Component,
|
|
919
919
|
args: [{ selector: 'cps-info-circle', imports: [CpsIconComponent, CpsTooltipDirective], template: "<cps-icon\n icon=\"info-circle\"\n role=\"img\"\n aria-label=\"Information\"\n tabindex=\"0\"\n [size]=\"size\"\n color=\"info\"\n [cpsTooltip]=\"tooltipText\"\n tooltipOpenDelay=\"0\"\n tooltipCloseDelay=\"100\"\n [tooltipPosition]=\"tooltipPosition\"\n [tooltipMaxWidth]=\"tooltipMaxWidth\"\n [tooltipPersistent]=\"tooltipPersistent\"\n [tooltipContentClass]=\"tooltipContentClass\">\n</cps-icon>\n", styles: [":host{display:inline-flex}:host cps-icon:focus-visible{outline:none;position:relative}:host cps-icon:focus-visible:before,:host cps-icon:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host cps-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host cps-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host cps-icon:focus-visible.suppress-focus-visible:before,:host cps-icon:focus-visible.suppress-focus-visible:after{display:none}\n"] }]
|
|
920
920
|
}], propDecorators: { size: [{
|
|
@@ -936,10 +936,10 @@ class LabelByValuePipe {
|
|
|
936
936
|
const option = options.find((opt) => isEqual(opt[valueKey], value));
|
|
937
937
|
return option ? option[labelKey] : '';
|
|
938
938
|
}
|
|
939
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
940
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
939
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: LabelByValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
940
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.13", ngImport: i0, type: LabelByValuePipe, isStandalone: true, name: "labelByValue" }); }
|
|
941
941
|
}
|
|
942
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
942
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: LabelByValuePipe, decorators: [{
|
|
943
943
|
type: Pipe,
|
|
944
944
|
args: [{ standalone: true, name: 'labelByValue' }]
|
|
945
945
|
}] });
|
|
@@ -957,10 +957,10 @@ class CheckOptionSelectedPipe {
|
|
|
957
957
|
? isEqual(option, value)
|
|
958
958
|
: isEqual(option[optionValue], value);
|
|
959
959
|
}
|
|
960
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
961
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
960
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CheckOptionSelectedPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
961
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.13", ngImport: i0, type: CheckOptionSelectedPipe, isStandalone: true, name: "checkOptionSelected" }); }
|
|
962
962
|
}
|
|
963
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
963
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CheckOptionSelectedPipe, decorators: [{
|
|
964
964
|
type: Pipe,
|
|
965
965
|
args: [{ standalone: true, name: 'checkOptionSelected' }]
|
|
966
966
|
}] });
|
|
@@ -994,10 +994,10 @@ class CpsProgressCircularComponent {
|
|
|
994
994
|
this.strokeWidth = convertSize(this.strokeWidth);
|
|
995
995
|
this.color = getCSSColor(this.color, this.document);
|
|
996
996
|
}
|
|
997
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
998
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
997
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsProgressCircularComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
998
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsProgressCircularComponent, isStandalone: true, selector: "cps-progress-circular", inputs: { diameter: "diameter", strokeWidth: "strokeWidth", color: "color" }, ngImport: i0, template: "<div\n class=\"cps-progress-circular\"\n [style.width]=\"diameter\"\n [style.border]=\"strokeWidth + ' solid ' + color\"></div>\n", styles: [":host{display:inline-block}:host .cps-progress-circular{box-sizing:border-box;aspect-ratio:1;border-radius:50%;border-right-color:transparent!important;border-bottom:unset!important;border-bottom-right-radius:unset;animation:cps-progress-circular-animation .8s linear infinite}@keyframes cps-progress-circular-animation{to{transform:rotate(360deg)}}\n"] }); }
|
|
999
999
|
}
|
|
1000
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1000
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsProgressCircularComponent, decorators: [{
|
|
1001
1001
|
type: Component,
|
|
1002
1002
|
args: [{ imports: [], selector: 'cps-progress-circular', template: "<div\n class=\"cps-progress-circular\"\n [style.width]=\"diameter\"\n [style.border]=\"strokeWidth + ' solid ' + color\"></div>\n", styles: [":host{display:inline-block}:host .cps-progress-circular{box-sizing:border-box;aspect-ratio:1;border-radius:50%;border-right-color:transparent!important;border-bottom:unset!important;border-bottom-right-radius:unset;animation:cps-progress-circular-animation .8s linear infinite}@keyframes cps-progress-circular-animation{to{transform:rotate(360deg)}}\n"] }]
|
|
1003
1003
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -1131,10 +1131,10 @@ class CpsFocusService {
|
|
|
1131
1131
|
this.lastInput.set('pointer');
|
|
1132
1132
|
});
|
|
1133
1133
|
}
|
|
1134
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1135
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
1134
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsFocusService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1135
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsFocusService, providedIn: 'root' }); }
|
|
1136
1136
|
}
|
|
1137
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsFocusService, decorators: [{
|
|
1138
1138
|
type: Injectable,
|
|
1139
1139
|
args: [{ providedIn: 'root' }]
|
|
1140
1140
|
}], ctorParameters: () => [] });
|
|
@@ -1799,8 +1799,8 @@ class CpsMenuComponent {
|
|
|
1799
1799
|
ngOnDestroy() {
|
|
1800
1800
|
this._destroy();
|
|
1801
1801
|
}
|
|
1802
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
1803
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsMenuComponent, isStandalone: true, selector: "cps-menu", inputs: { header: "header", ariaLabel: "ariaLabel", items: "items", withArrow: "withArrow", compressed: "compressed", focusOnShow: "focusOnShow", persistent: "persistent", containerClass: "containerClass", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { menuShown: "menuShown", menuHidden: "menuHidden", beforeMenuHidden: "beforeMenuHidden", contentClicked: "contentClicked", containerMouseLeave: "containerMouseLeave" }, viewQueries: [{ propertyName: "_menuArrow", first: true, predicate: ["menuArrow"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (render) {\n <div\n class=\"cps-menu-container\"\n [class.cps-menu-no-arrow]=\"!withArrow\"\n [class]=\"containerClass\"\n (mousedown)=\"onOverlayClick($event)\"\n [@animation]=\"{\n value: overlayVisible ? 'open' : 'close',\n params: {\n showTransitionParams: showTransitionOptions,\n hideTransitionParams: hideTransitionOptions\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\"\n (mouseleave)=\"containerMouseLeave.emit($event)\">\n @if (withArrow) {\n <div class=\"cps-menu-arrow-bridge\"></div>\n <div class=\"cps-menu-arrow\" #menuArrow></div>\n }\n <div (mousedown)=\"onContentClick()\">\n @if (items.length < 1) {\n <ng-content></ng-content>\n }\n @if (items.length > 0) {\n <div\n class=\"cps-menu-content\"\n [class.cps-menu-content-compressed]=\"compressed\"\n role=\"menu\"\n [attr.aria-label]=\"ariaLabel || header || null\">\n @if (header && !compressed) {\n <div class=\"cps-menu-header\">\n {{ header }}\n </div>\n }\n @for (item of items; track item; let i = $index) {\n @if (!item.url) {\n <a\n role=\"menuitem\"\n [class]=\"itemsClasses[i]\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item.ariaLabel || null\"\n [attr.aria-disabled]=\"\n item.disabled || item.loading ? true : null\n \"\n (click)=\"onItemClick($event, item)\"\n (keydown)=\"onItemKeydown($event, item)\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </a>\n }\n @if (item.url && item.url.startsWith('/')) {\n <a\n role=\"menuitem\"\n [class]=\"itemsClasses[i]\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item.ariaLabel || null\"\n [attr.aria-disabled]=\"\n item.disabled || item.loading ? true : null\n \"\n (click)=\"onItemClick($event, item)\"\n (keydown)=\"onItemKeydown($event, item)\"\n [routerLink]=\"item.url\"\n [target]=\"item.target\"\n [attr.rel]=\"\n item.target === '_blank' ? 'noopener noreferrer' : null\n \">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </a>\n }\n @if (item.url && !item.url.startsWith('/')) {\n <a\n role=\"menuitem\"\n [class]=\"itemsClasses[i]\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item.ariaLabel || null\"\n [attr.aria-disabled]=\"\n item.disabled || item.loading ? true : null\n \"\n (click)=\"onItemClick($event, item)\"\n (keydown)=\"onItemKeydown($event, item)\"\n [href]=\"item.url\"\n [attr.target]=\"item.target\"\n [attr.rel]=\"\n item.target === '_blank' ? 'noopener noreferrer' : null\n \">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </a>\n }\n }\n </div>\n }\n </div>\n </div>\n}\n\n<ng-template #itemTemplate let-item=\"item\">\n @if (!item.loading) {\n @if (withIcons) {\n <div class=\"cps-menu-item-icon\" aria-hidden=\"true\">\n @if (item.icon) {\n <cps-icon\n [icon]=\"item.icon\"\n [color]=\"item.disabled ? 'text-light' : 'text-dark'\"\n [size]=\"compressed ? 'small' : 'normal'\"></cps-icon>\n }\n </div>\n }\n <div class=\"cps-menu-item-content\">\n <span class=\"cps-menu-item-content-title\">{{ item.title }}</span>\n @if (item.desc && !compressed) {\n <span class=\"cps-menu-item-content-desc\">{{ item.desc }}</span>\n }\n </div>\n } @else {\n <span class=\"cps-menu-item-spinner\" role=\"status\" aria-label=\"Loading\">\n <cps-progress-circular\n [strokeWidth]=\"2\"\n [color]=\"compressed ? 'prepared-darken2' : 'calm'\"\n [diameter]=\"16\">\n </cps-progress-circular>\n </span>\n }\n</ng-template>\n", styles: [".cps-menu-arrow-bridge{position:absolute;bottom:100%;left:0;right:0;height:.875rem}.cps-menu-container{background:#fff;border:0 none;box-shadow:0 .0625rem .1875rem #0000004d;position:absolute;margin-top:.875rem;top:0;left:0;font-family:Source Sans Pro,sans-serif}.cps-menu-arrow{position:absolute;bottom:100%;height:0;width:1.5rem;pointer-events:none}.cps-menu-arrow:before,.cps-menu-arrow:after{content:\" \";height:0;width:0;position:absolute;bottom:0;pointer-events:none}.cps-menu-arrow:before{border:solid transparent;border-bottom-color:var(--cps-color-line-light);border-width:.875rem;margin-left:-.875rem}.cps-menu-arrow:after{border:solid transparent;border-bottom-color:#fff;border-width:.75rem;margin-left:-.75rem}.cps-menu-container .cps-menu-content{padding:.75rem}.cps-menu-container .cps-menu-content{font-family:Source Sans Pro,sans-serif;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.cps-menu-container .cps-menu-content .cps-menu-header{display:flex;align-items:center;min-height:3.125rem;padding-bottom:.5rem;font-weight:600;color:var(--cps-color-text-dark);cursor:default}.cps-menu-container .cps-menu-content .cps-menu-item{text-decoration:unset;display:flex;align-items:center;padding:.5rem 3rem .5rem 0;border-top:.0625rem solid rgba(0,0,0,.1215686275);cursor:pointer;min-height:3.625rem}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon{width:3rem;align-items:center;display:flex}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon cps-icon{margin-left:.5rem}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content{display:flex;flex-direction:column}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:600;font-size:.9375rem;line-height:150%;color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-desc{font-size:.75rem;line-height:150%;color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-spinner{width:100%;display:flex;align-items:center;justify-content:center}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible{outline:none;position:relative}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:before,.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:after{content:\"\";position:absolute;border-radius:0}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:before{inset:-.0625rem;border:.0625rem solid var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:after{inset:-.125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible.suppress-focus-visible:before,.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible.suppress-focus-visible:after{display:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled{pointer-events:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):focus-visible{background:var(--cps-color-highlight-hover)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-title,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):focus-visible .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-desc,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):focus-visible .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):hover .cps-menu-item-icon cps-icon i,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):focus-visible .cps-menu-item-icon cps-icon i{color:var(--cps-color-calm)!important}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):active{background:var(--cps-color-highlight-active)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-first{border-top:none}.cps-menu-container .cps-menu-content.cps-menu-content-compressed{padding:0}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item{padding:0 1rem;min-height:2.5rem}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-icon{width:2.25rem}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:500}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item.cps-menu-item-compressed.cps-menu-item-compressed-with-icons{padding:0 1.625rem 0 1rem}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-icon cps-icon i{color:var(--cps-color-prepared-darken2)!important}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-prepared-darken2)}.cps-menu-container-flipped{margin-top:0;margin-bottom:0}.cps-menu-container-flipped .cps-menu-arrow{display:none}.cps-menu-no-arrow{margin-top:0}.cps-menu-container *:focus-visible:not([role=menuitem]){outline:none;position:relative}.cps-menu-container *:focus-visible:not([role=menuitem]):before,.cps-menu-container *:focus-visible:not([role=menuitem]):after{content:\"\";position:absolute;border-radius:inherit}.cps-menu-container *:focus-visible:not([role=menuitem]):before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}.cps-menu-container *:focus-visible:not([role=menuitem]):after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-menu-container *:focus-visible:not([role=menuitem]).suppress-focus-visible:before,.cps-menu-container *:focus-visible:not([role=menuitem]).suppress-focus-visible:after{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsProgressCircularComponent, selector: "cps-progress-circular", inputs: ["diameter", "strokeWidth", "color"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], animations: [
|
|
1802
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsMenuComponent, deps: [{ token: DOCUMENT }, { token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.PrimeNG }, { token: i4.OverlayService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1803
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsMenuComponent, isStandalone: true, selector: "cps-menu", inputs: { header: "header", ariaLabel: "ariaLabel", items: "items", withArrow: "withArrow", compressed: "compressed", focusOnShow: "focusOnShow", persistent: "persistent", containerClass: "containerClass", showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { menuShown: "menuShown", menuHidden: "menuHidden", beforeMenuHidden: "beforeMenuHidden", contentClicked: "contentClicked", containerMouseLeave: "containerMouseLeave" }, viewQueries: [{ propertyName: "_menuArrow", first: true, predicate: ["menuArrow"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (render) {\n <div\n class=\"cps-menu-container\"\n [class.cps-menu-no-arrow]=\"!withArrow\"\n [class]=\"containerClass\"\n (mousedown)=\"onOverlayClick($event)\"\n [@animation]=\"{\n value: overlayVisible ? 'open' : 'close',\n params: {\n showTransitionParams: showTransitionOptions,\n hideTransitionParams: hideTransitionOptions\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\"\n (mouseleave)=\"containerMouseLeave.emit($event)\">\n @if (withArrow) {\n <div class=\"cps-menu-arrow-bridge\"></div>\n <div class=\"cps-menu-arrow\" #menuArrow></div>\n }\n <div (mousedown)=\"onContentClick()\">\n @if (items.length < 1) {\n <ng-content></ng-content>\n }\n @if (items.length > 0) {\n <div\n class=\"cps-menu-content\"\n [class.cps-menu-content-compressed]=\"compressed\"\n role=\"menu\"\n [attr.aria-label]=\"ariaLabel || header || null\">\n @if (header && !compressed) {\n <div class=\"cps-menu-header\">\n {{ header }}\n </div>\n }\n @for (item of items; track item; let i = $index) {\n @if (!item.url) {\n <a\n role=\"menuitem\"\n [class]=\"itemsClasses[i]\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item.ariaLabel || null\"\n [attr.aria-disabled]=\"\n item.disabled || item.loading ? true : null\n \"\n (click)=\"onItemClick($event, item)\"\n (keydown)=\"onItemKeydown($event, item)\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </a>\n }\n @if (item.url && item.url.startsWith('/')) {\n <a\n role=\"menuitem\"\n [class]=\"itemsClasses[i]\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item.ariaLabel || null\"\n [attr.aria-disabled]=\"\n item.disabled || item.loading ? true : null\n \"\n (click)=\"onItemClick($event, item)\"\n (keydown)=\"onItemKeydown($event, item)\"\n [routerLink]=\"item.url\"\n [target]=\"item.target\"\n [attr.rel]=\"\n item.target === '_blank' ? 'noopener noreferrer' : null\n \">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </a>\n }\n @if (item.url && !item.url.startsWith('/')) {\n <a\n role=\"menuitem\"\n [class]=\"itemsClasses[i]\"\n tabindex=\"-1\"\n [attr.aria-label]=\"item.ariaLabel || null\"\n [attr.aria-disabled]=\"\n item.disabled || item.loading ? true : null\n \"\n (click)=\"onItemClick($event, item)\"\n (keydown)=\"onItemKeydown($event, item)\"\n [href]=\"item.url\"\n [attr.target]=\"item.target\"\n [attr.rel]=\"\n item.target === '_blank' ? 'noopener noreferrer' : null\n \">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </a>\n }\n }\n </div>\n }\n </div>\n </div>\n}\n\n<ng-template #itemTemplate let-item=\"item\">\n @if (!item.loading) {\n @if (withIcons) {\n <div class=\"cps-menu-item-icon\" aria-hidden=\"true\">\n @if (item.icon) {\n <cps-icon\n [icon]=\"item.icon\"\n [color]=\"item.disabled ? 'text-light' : 'text-dark'\"\n [size]=\"compressed ? 'small' : 'normal'\"></cps-icon>\n }\n </div>\n }\n <div class=\"cps-menu-item-content\">\n <span class=\"cps-menu-item-content-title\">{{ item.title }}</span>\n @if (item.desc && !compressed) {\n <span class=\"cps-menu-item-content-desc\">{{ item.desc }}</span>\n }\n </div>\n } @else {\n <span class=\"cps-menu-item-spinner\" role=\"status\" aria-label=\"Loading\">\n <cps-progress-circular\n [strokeWidth]=\"2\"\n [color]=\"compressed ? 'prepared-darken2' : 'calm'\"\n [diameter]=\"16\">\n </cps-progress-circular>\n </span>\n }\n</ng-template>\n", styles: [".cps-menu-arrow-bridge{position:absolute;bottom:100%;left:0;right:0;height:.875rem}.cps-menu-container{background:#fff;border:0 none;box-shadow:0 .0625rem .1875rem #0000004d;position:absolute;margin-top:.875rem;top:0;left:0;font-family:Source Sans Pro,sans-serif}.cps-menu-arrow{position:absolute;bottom:100%;height:0;width:1.5rem;pointer-events:none}.cps-menu-arrow:before,.cps-menu-arrow:after{content:\" \";height:0;width:0;position:absolute;bottom:0;pointer-events:none}.cps-menu-arrow:before{border:solid transparent;border-bottom-color:var(--cps-color-line-light);border-width:.875rem;margin-left:-.875rem}.cps-menu-arrow:after{border:solid transparent;border-bottom-color:#fff;border-width:.75rem;margin-left:-.75rem}.cps-menu-container .cps-menu-content{padding:.75rem}.cps-menu-container .cps-menu-content{font-family:Source Sans Pro,sans-serif;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.cps-menu-container .cps-menu-content .cps-menu-header{display:flex;align-items:center;min-height:3.125rem;padding-bottom:.5rem;font-weight:600;color:var(--cps-color-text-dark);cursor:default}.cps-menu-container .cps-menu-content .cps-menu-item{text-decoration:unset;display:flex;align-items:center;padding:.5rem 3rem .5rem 0;border-top:.0625rem solid rgba(0,0,0,.1215686275);cursor:pointer;min-height:3.625rem}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon{width:3rem;align-items:center;display:flex}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-icon cps-icon{margin-left:.5rem}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content{display:flex;flex-direction:column}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:600;font-size:.9375rem;line-height:150%;color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-content .cps-menu-item-content-desc{font-size:.75rem;line-height:150%;color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item .cps-menu-item-spinner{width:100%;display:flex;align-items:center;justify-content:center}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible{outline:none;position:relative}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:before,.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:after{content:\"\";position:absolute;border-radius:0}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:before{inset:-.0625rem;border:.0625rem solid var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible:after{inset:-.125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible.suppress-focus-visible:before,.cps-menu-container .cps-menu-content .cps-menu-item:focus-visible.suppress-focus-visible:after{display:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled{pointer-events:none}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-text-mild)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-disabled .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-light)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):focus-visible{background:var(--cps-color-highlight-hover)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-title,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):focus-visible .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-calm)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):hover .cps-menu-item-content .cps-menu-item-content-desc,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):focus-visible .cps-menu-item-content .cps-menu-item-content-desc{color:var(--cps-color-text-dark)}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):hover .cps-menu-item-icon cps-icon i,.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):not(.cps-menu-item-compressed):focus-visible .cps-menu-item-icon cps-icon i{color:var(--cps-color-calm)!important}.cps-menu-container .cps-menu-content .cps-menu-item:not(.cps-menu-item-disabled):active{background:var(--cps-color-highlight-active)}.cps-menu-container .cps-menu-content .cps-menu-item.cps-menu-item-first{border-top:none}.cps-menu-container .cps-menu-content.cps-menu-content-compressed{padding:0}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item{padding:0 1rem;min-height:2.5rem}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-icon{width:2.25rem}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item .cps-menu-item-content .cps-menu-item-content-title{font-weight:500}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item.cps-menu-item-compressed.cps-menu-item-compressed-with-icons{padding:0 1.625rem 0 1rem}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-icon cps-icon i{color:var(--cps-color-prepared-darken2)!important}.cps-menu-container .cps-menu-content.cps-menu-content-compressed .cps-menu-item:not(.cps-menu-item-disabled) .cps-menu-item-content .cps-menu-item-content-title{color:var(--cps-color-prepared-darken2)}.cps-menu-container-flipped{margin-top:0;margin-bottom:0}.cps-menu-container-flipped .cps-menu-arrow{display:none}.cps-menu-no-arrow{margin-top:0}.cps-menu-container *:focus-visible:not([role=menuitem]){outline:none;position:relative}.cps-menu-container *:focus-visible:not([role=menuitem]):before,.cps-menu-container *:focus-visible:not([role=menuitem]):after{content:\"\";position:absolute;border-radius:inherit}.cps-menu-container *:focus-visible:not([role=menuitem]):before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}.cps-menu-container *:focus-visible:not([role=menuitem]):after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-menu-container *:focus-visible:not([role=menuitem]).suppress-focus-visible:before,.cps-menu-container *:focus-visible:not([role=menuitem]).suppress-focus-visible:after{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsProgressCircularComponent, selector: "cps-progress-circular", inputs: ["diameter", "strokeWidth", "color"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], animations: [
|
|
1804
1804
|
trigger('animation', [
|
|
1805
1805
|
state('void', style({
|
|
1806
1806
|
transform: 'scaleY(0.8)',
|
|
@@ -1819,7 +1819,7 @@ class CpsMenuComponent {
|
|
|
1819
1819
|
])
|
|
1820
1820
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1821
1821
|
}
|
|
1822
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
1822
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsMenuComponent, decorators: [{
|
|
1823
1823
|
type: Component,
|
|
1824
1824
|
args: [{ imports: [
|
|
1825
1825
|
CommonModule,
|
|
@@ -2805,10 +2805,10 @@ class CpsAutocompleteComponent {
|
|
|
2805
2805
|
_pxToRem(px) {
|
|
2806
2806
|
return px / this._rootFontSizePx;
|
|
2807
2807
|
}
|
|
2808
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
2809
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsAutocompleteComponent, isStandalone: true, selector: "cps-autocomplete", inputs: { label: "label", ariaLabel: "ariaLabel", placeholder: "placeholder", hint: "hint", returnObject: "returnObject", multiple: "multiple", disabled: "disabled", width: "width", selectAll: "selectAll", showChevron: "showChevron", withOptionsAliases: "withOptionsAliases", useOptionsAliasesWhenNoMatch: "useOptionsAliasesWhenNoMatch", optionAlias: "optionAlias", chips: "chips", closableChips: "closableChips", clearable: "clearable", openOnClear: "openOnClear", keepInitialOrder: "keepInitialOrder", optionLabel: "optionLabel", optionValue: "optionValue", optionInfo: "optionInfo", hideDetails: "hideDetails", persistentClear: "persistentClear", prefixIcon: "prefixIcon", prefixIconSize: "prefixIconSize", loading: "loading", loadingMessage: "loadingMessage", showLoadingMessage: "showLoadingMessage", emptyMessage: "emptyMessage", showEmptyMessage: "showEmptyMessage", virtualScroll: "virtualScroll", numToleratedItems: "numToleratedItems", externalError: "externalError", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", appearance: "appearance", emptyOptionIndex: "emptyOptionIndex", inputChangeDebounceTime: "inputChangeDebounceTime", validating: "validating", _value: ["value", "_value"], options: "options" }, outputs: { valueChanged: "valueChanged", inputChanged: "inputChanged", focused: "focused", blurred: "blurred" }, providers: [LabelByValuePipe, CheckOptionSelectedPipe], viewQueries: [{ propertyName: "autocompleteBox", first: true, predicate: ["autocompleteBox"], descendants: true }, { propertyName: "autocompleteContainer", first: true, predicate: ["autocompleteContainer"], descendants: true }, { propertyName: "virtualList", first: true, predicate: ["virtualList"], descendants: true }, { propertyName: "optionsMenu", first: true, predicate: ["optionsMenu"], descendants: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }, { propertyName: "autocompleteInput", first: true, predicate: ["autocompleteInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-autocomplete\"\n [ngClass]=\"{\n disabled: disabled,\n error: error || externalError,\n active: isActive,\n opened: isOpened\n }\"\n #autocompleteContainer>\n @if (label) {\n <div class=\"cps-autocomplete-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-autocomplete-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n (keydown)=\"onContainerKeyDown($event)\"\n class=\"cps-autocomplete-container\"\n [class.active]=\"isActive\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div\n class=\"cps-autocomplete-box\"\n #autocompleteBox\n (mousedown)=\"onBoxClick()\">\n <div class=\"cps-autocomplete-box-area\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? 'var(--cps-text-muted)' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if (\n (!multiple && !isEmptyValue()) || (value?.length > 0 && multiple)\n ) {\n <div class=\"cps-autocomplete-box-items\">\n @if (!multiple) {\n <span class=\"single-item\">\n <div class=\"single-item-selection\">\n <span [style.opacity]=\"activeSingle ? 0 : 1\">{{\n returnObject\n ? value[optionLabel]\n : (value\n | labelByValue: options : optionValue : optionLabel)\n }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n autocompleteInputTemplate;\n context: {\n inputClass: 'single-item-input',\n inputStyle: activeSingle ? { opacity: '1' } : null\n }\n \">\n </ng-container>\n </span>\n }\n @if (multiple && !chips) {\n <div class=\"cps-autocomplete-multi-selection-wrapper\">\n <div\n class=\"text-group\"\n role=\"list\"\n tabindex=\"-1\"\n aria-label=\"Selected options\">\n @for (val of value; track val; let last = $last) {\n <div\n class=\"text-group-item\"\n role=\"listitem\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\">\n {{\n returnObject\n ? val[optionLabel]\n : (val\n | labelByValue\n : options\n : optionValue\n : optionLabel)\n }}{{ !last ? ',' : '' }}\n </div>\n }\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n autocompleteInputTemplate;\n context: {\n inputClass: 'multi-item-input'\n }\n \"></ng-container>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"cps-autocomplete-multi-selection-wrapper\">\n <div\n class=\"chips-group\"\n role=\"list\"\n tabindex=\"-1\"\n aria-label=\"Selected options\">\n @for (val of value; track val; let last = $last) {\n <cps-chip\n role=\"listitem\"\n closeButtonAriaLabel=\"Remove\"\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"select(val, true)\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\"\n [label]=\"\n returnObject\n ? val[optionLabel]\n : (val\n | labelByValue: options : optionValue : optionLabel)\n \">\n </cps-chip>\n }\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n autocompleteInputTemplate;\n context: {\n inputClass: 'multi-chip-input'\n }\n \"></ng-container>\n </div>\n }\n </div>\n } @else {\n <ng-container\n *ngTemplateOutlet=\"autocompleteInputTemplate\"></ng-container>\n }\n <span class=\"cps-autocomplete-box-icons\">\n @if (clearable && !disabled) {\n <span\n role=\"button\"\n (click)=\"clear($event)\"\n (mousedown)=\"$event.preventDefault()\"\n (keydown.enter)=\"clear($event)\"\n (keydown.space)=\"clear($event)\"\n aria-label=\"Clear selection\"\n [tabindex]=\"disabled ? -1 : 0\"\n class=\"cps-autocomplete-box-clear-icon\"\n [ngClass]=\"{\n 'cps-autocomplete-box-clear-icon-hidden':\n !persistentClear &&\n (!multiple || !value?.length) &&\n (multiple || isEmptyValue())\n }\">\n <cps-icon icon=\"delete\" size=\"small\"></cps-icon>\n </span>\n }\n @if (showChevron && options.length) {\n <span\n class=\"cps-autocomplete-box-chevron\"\n role=\"button\"\n (mousedown)=\"onChevronClick($event)\"\n (keydown.enter)=\"onChevronClick($event)\"\n (keydown.space)=\"onChevronClick($event)\"\n [attr.aria-label]=\"\n isOpened ? 'Collapse options' : 'Expand options'\n \"\n [tabindex]=\"disabled ? -1 : 0\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden($event)\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-autocomplete-options-menu\">\n <div\n #optionsList\n role=\"listbox\"\n [id]=\"optionsListId\"\n tabindex=\"-1\"\n aria-readonly=\"false\"\n aria-disabled=\"false\"\n aria-orientation=\"vertical\"\n [attr.aria-multiselectable]=\"!!multiple\"\n class=\"cps-autocomplete-options\"\n [style.width.rem]=\"autocompleteBoxWidthRem\">\n @if (loading && showLoadingMessage) {\n <div\n class=\"cps-autocomplete-options-loading\"\n role=\"option\"\n tabindex=\"-1\"\n aria-disabled=\"true\"\n aria-selected=\"false\">\n {{ loadingMessage }}\n </div>\n }\n @if (\n showEmptyMessage &&\n filteredOptions.length < 1 &&\n !loading &&\n inputTextDebounced\n ) {\n <div\n class=\"cps-autocomplete-options-empty\"\n role=\"option\"\n tabindex=\"-1\"\n aria-disabled=\"true\"\n aria-selected=\"false\">\n {{ emptyMessage }}\n </div>\n }\n @if (isSelectAllVisible) {\n <div\n class=\"cps-autocomplete-options-option select-all-option\"\n [id]=\"selectAllOptionId\"\n role=\"option\"\n tabindex=\"-1\"\n aria-disabled=\"false\"\n [attr.aria-setsize]=\"optionsAriaSetSize\"\n [attr.aria-posinset]=\"1\"\n [attr.aria-selected]=\"value?.length === options.length\"\n [class.allselected]=\"value?.length === options.length\"\n [class.highlighten]=\"optionHighlightedIndex === 0\"\n (mousedown)=\"$event.preventDefault()\"\n (click)=\"toggleAll()\">\n <span class=\"cps-autocomplete-options-option-left\">\n @if (multiple) {\n <span class=\"cps-autocomplete-options-option-check\"> </span>\n }\n <span class=\"cps-autocomplete-options-option-label\"\n >Select all</span\n >\n </span>\n </div>\n }\n @if (!loading) {\n @if (virtualScroll) {\n <p-virtualscroller\n #virtualList\n [tabindex]=\"-1\"\n [items]=\"filteredOptions\"\n [delay]=\"0\"\n [scrollHeight]=\"virtualListHeightRem + 'rem'\"\n [options]=\"{ numToleratedItems: numToleratedItems }\"\n [itemSize]=\"virtualScrollItemSizePx\">\n <ng-template pTemplate=\"item\" let-item let-options=\"options\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item,\n itemIndex: options.index\n }\n \"></ng-container>\n </ng-template>\n </p-virtualscroller>\n } @else {\n @for (item of filteredOptions; track item; let itemIndex = $index) {\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item,\n itemIndex: itemIndex\n }\n \"></ng-container>\n }\n }\n }\n </div>\n </cps-menu>\n @if (loading || validating) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"autocomplete-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !externalError && !hideDetails) {\n <div class=\"cps-autocomplete-hint\">\n {{ hint }}\n </div>\n }\n @if ((error || externalError) && !hideDetails) {\n <div class=\"cps-autocomplete-error\" role=\"alert\" aria-live=\"assertive\">\n {{ error || externalError }}\n </div>\n }\n</div>\n\n<ng-template\n #autocompleteInputTemplate\n let-inputClass=\"inputClass\"\n let-inputStyle=\"inputStyle\">\n <input\n #autocompleteInput\n type=\"text\"\n class=\"cps-autocomplete-box-input\"\n spellcheck=\"false\"\n [disabled]=\"disabled\"\n role=\"combobox\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n [attr.aria-invalid]=\"error || externalError ? 'true' : null\"\n [attr.aria-controls]=\"optionsListId\"\n [attr.aria-activedescendant]=\"activeDescendantId\"\n [attr.aria-expanded]=\"isOpened\"\n [attr.aria-required]=\"isRequired || null\"\n [ngClass]=\"inputClass\"\n [ngStyle]=\"inputStyle\"\n [placeholder]=\"\n (!multiple && isEmptyValue()) || (value?.length < 1 && multiple)\n ? placeholder\n : ''\n \"\n (input)=\"filterOptions($event)\"\n (keydown)=\"onInputKeyDown($event)\"\n [(ngModel)]=\"inputText\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n [attr.aria-label]=\"computedLabel\" />\n</ng-template>\n\n<ng-template #itemTemplate let-item=\"item\" let-itemIndex=\"itemIndex\">\n <div\n class=\"cps-autocomplete-options-option\"\n [id]=\"getOptionId(item, itemIndex)\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.aria-setsize]=\"optionsAriaSetSize\"\n [attr.aria-posinset]=\"getOptionAriaPosInSet(itemIndex)\"\n (mousedown)=\"$event.preventDefault()\"\n (click)=\"onOptionClick(item)\"\n [class.highlighten]=\"\n itemIndex === optionHighlightedIndex - (isSelectAllVisible ? 1 : 0)\n \"\n [attr.aria-selected]=\"\n item | checkOptionSelected: value : multiple : returnObject : optionValue\n \"\n [class.selected]=\"\n item | checkOptionSelected: value : multiple : returnObject : optionValue\n \">\n <span class=\"cps-autocomplete-options-option-left\">\n @if (multiple) {\n <span class=\"cps-autocomplete-options-option-check\"> </span>\n }\n <span\n data-testid=\"cps-autocomplete-options\"\n class=\"cps-autocomplete-options-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ item[optionLabel] }}</span\n >\n </span>\n\n <span\n class=\"cps-autocomplete-options-option-right\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ item[optionInfo] }}</span\n >\n </div>\n</ng-template>\n", styles: [":host{display:flex}:host .cps-autocomplete{position:relative;width:100%;outline:none;font-family:inherit;font-weight:400;display:grid}:host .cps-autocomplete .cps-autocomplete-container{position:relative}:host .cps-autocomplete .cps-autocomplete-container .autocomplete-progress-bar{position:absolute;bottom:.0625rem;padding:0 .0625rem}:host .cps-autocomplete .cps-autocomplete-container.borderless .cps-autocomplete-box,:host .cps-autocomplete .cps-autocomplete-container.underlined .cps-autocomplete-box{line-height:1;border:none!important;border-radius:0}:host .cps-autocomplete .cps-autocomplete-container.underlined .cps-autocomplete-box{border-bottom:.0625rem solid var(--cps-color-line-light)!important}:host .cps-autocomplete.active .cps-autocomplete-box{border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete.active .cps-autocomplete-box .cps-autocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-autocomplete.opened .cps-autocomplete-box .cps-autocomplete-box-chevron{top:1.375rem;transform:rotate(180deg)}:host .cps-autocomplete .cps-autocomplete-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);background-color:var(--cps-surface-body);font-size:.875rem;font-weight:600}:host .cps-autocomplete .cps-autocomplete-label .cps-autocomplete-label-info-circle{margin-left:.5rem;pointer-events:all}:host .cps-autocomplete .persistent-clear .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:not(:focus):not(:hover) cps-icon,:host .cps-autocomplete .cps-autocomplete-container.active .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:not(:focus):not(:hover) cps-icon,:host .cps-autocomplete .cps-autocomplete-container:hover .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:not(:focus):not(:hover) cps-icon{opacity:.5}:host .cps-autocomplete .cps-autocomplete-box{overflow:hidden;min-height:2.375rem;width:100%;cursor:text;background:var(--cps-input-background);font-size:1rem;outline:none;padding:0 .75rem;border-radius:.25rem;border:.0625rem solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-autocomplete .cps-autocomplete-box-area{display:flex;min-height:2.25rem;align-items:center}:host .cps-autocomplete .cps-autocomplete-box-area .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-autocomplete .cps-autocomplete-box-input{min-height:2.25rem;padding:0;background-color:transparent;width:0;min-width:1.875rem;flex-grow:1;font-size:1rem;color:var(--cps-color-text-dark);border-style:none;outline:none;font-family:inherit}:host .cps-autocomplete .cps-autocomplete-box-input::placeholder{color:var(--cps-input-placeholder);font-style:italic;opacity:1}:host .cps-autocomplete .cps-autocomplete-box-items{display:inline-flex;flex-direction:column;width:100%;padding-top:.1875rem;padding-bottom:.1875rem;min-height:2.25rem;justify-content:center;position:relative}:host .cps-autocomplete .cps-autocomplete-box-items .single-item{color:var(--cps-color-text-dark);display:inline-flex}:host .cps-autocomplete .cps-autocomplete-box-items .single-item-selection{display:inline-flex;letter-spacing:inherit;line-height:inherit;max-width:100%}:host .cps-autocomplete .cps-autocomplete-box-items .single-item-input{opacity:0;min-width:0;align-self:flex-start;flex:1 1;transition:none;position:absolute;top:0;bottom:0;width:100%;padding-inline-start:inherit;padding-inline-end:inherit}:host .cps-autocomplete .cps-autocomplete-box-items .multi-chip-input{min-height:1.875rem}:host .cps-autocomplete .cps-autocomplete-box-items .multi-item-input{min-height:1.75rem}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper{display:inline-flex;flex-wrap:wrap;align-items:center}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .chips-group{display:contents}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .chips-group cps-chip{padding-bottom:.1875rem;padding-top:.1875rem;padding-right:.25rem}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .text-group{display:contents;color:var(--cps-color-text-dark)}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .text-group .text-group-item{padding-bottom:.1875rem;padding-top:.1875rem;padding-right:.25rem}:host .cps-autocomplete .cps-autocomplete-box:hover{border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box:hover .cps-autocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons{display:flex}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon{cursor:pointer;display:flex;color:var(--cps-state-error);margin-left:.5rem}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus{outline:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:hover cps-icon,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus cps-icon{opacity:1}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible{outline:none;position:relative}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible.suppress-focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible.suppress-focus-visible:after{display:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon-hidden{visibility:hidden}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron{display:flex;margin-left:.5rem}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus{outline:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible{outline:none;position:relative}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible.suppress-focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible.suppress-focus-visible:after{display:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron{transition-duration:.2s;cursor:pointer}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:hover ::ng-deep cps-icon .cps-icon,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus ::ng-deep cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host .cps-autocomplete .cps-autocomplete-hint{color:var(--cps-color-text-mild);background-color:var(--cps-surface-body);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-autocomplete .cps-autocomplete-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-autocomplete.disabled{pointer-events:none}:host .cps-autocomplete.disabled .cps-autocomplete-box{background:var(--cps-color-bg-disabled)}:host .cps-autocomplete.disabled .cps-autocomplete-box-items{color:var(--cps-color-text-light)}:host .cps-autocomplete.disabled .cps-autocomplete-box-items .text-group,:host .cps-autocomplete.disabled .cps-autocomplete-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-autocomplete.disabled .cps-autocomplete-label{color:var(--cps-color-text-mild)}:host .cps-autocomplete.error .cps-autocomplete-box{border-color:var(--cps-state-error)!important;background:#fef3f2}:host .about-to-remove{color:var(--cps-color-text-light)}:host .about-to-remove ::ng-deep .cps-chip{background-color:var(--cps-color-bg-mid)}.cps-autocomplete-options{font-family:inherit;background:var(--cps-popover-background);overflow-x:hidden;max-height:15.125rem;overflow-y:auto}.cps-autocomplete-options .cps-autocomplete-options-empty,.cps-autocomplete-options .cps-autocomplete-options-loading{padding:.6875rem;font-size:1rem;cursor:default;color:var(--cps-color-text-dark)}.cps-autocomplete-options .cps-autocomplete-options-option{padding:.75rem;justify-content:space-between;display:flex;cursor:pointer}.cps-autocomplete-options .cps-autocomplete-options-option:hover{background:var(--cps-color-highlight-hover)}.cps-autocomplete-options .cps-autocomplete-options-option-label{color:var(--cps-color-text-dark)}.cps-autocomplete-options .cps-autocomplete-options-option-left{display:flex;align-items:center;margin-right:.5rem}.cps-autocomplete-options .cps-autocomplete-options-option-right{color:var(--cps-color-text-medium);text-align:right}.cps-autocomplete-options .cps-autocomplete-options-option-check{background-color:transparent;border:0;width:1rem;height:1rem;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:.5rem;opacity:0}.cps-autocomplete-options .cps-autocomplete-options-option-check:after{color:var(--cps-color-calm);top:.25rem;left:.0625rem;width:.5rem;height:.1875rem;border-left:.125rem solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:.125rem solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-autocomplete-options .cps-autocomplete-options-option.selected,.cps-autocomplete-options .cps-autocomplete-options-option.allselected{font-weight:600}.cps-autocomplete-options .cps-autocomplete-options-option.selected .cps-autocomplete-options-option-label,.cps-autocomplete-options .cps-autocomplete-options-option.allselected .cps-autocomplete-options-option-label{color:var(--cps-color-calm)}.cps-autocomplete-options .cps-autocomplete-options-option.selected .cps-autocomplete-options-option-check,.cps-autocomplete-options .cps-autocomplete-options-option.allselected .cps-autocomplete-options-option-check{opacity:1}.cps-autocomplete-options .cps-autocomplete-options-option.selected{background:var(--cps-color-highlight-selected)}.cps-autocomplete-options .cps-autocomplete-options-option.selected .cps-autocomplete-options-option-right{color:var(--cps-color-text-dark)}.cps-autocomplete-options .cps-autocomplete-options-option.highlighten{background:var(--cps-color-highlight-active)}.cps-autocomplete-options .cps-autocomplete-options-option.selected.highlighten{background:var(--cps-color-highlight-selected-dark)}.cps-autocomplete-options .select-all-option{border-bottom:.0625rem solid lightgrey;font-weight:600}.cps-autocomplete-options ::ng-deep .p-virtualscroller-list.p-scroller{overflow-anchor:none}.cps-autocomplete-options .virtual-row{white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "ngmodule", type: ScrollerModule }, { kind: "component", type: i4$1.Scroller, selector: "p-scroller, p-virtualscroller, p-virtual-scroller, p-virtualScroller", inputs: ["hostName", "id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "pipe", type: LabelByValuePipe, name: "labelByValue" }, { kind: "pipe", type: CheckOptionSelectedPipe, name: "checkOptionSelected" }] }); }
|
|
2808
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsAutocompleteComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: PLATFORM_ID }, { token: i0.ChangeDetectorRef }, { token: LabelByValuePipe }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2809
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsAutocompleteComponent, isStandalone: true, selector: "cps-autocomplete", inputs: { label: "label", ariaLabel: "ariaLabel", placeholder: "placeholder", hint: "hint", returnObject: "returnObject", multiple: "multiple", disabled: "disabled", width: "width", selectAll: "selectAll", showChevron: "showChevron", withOptionsAliases: "withOptionsAliases", useOptionsAliasesWhenNoMatch: "useOptionsAliasesWhenNoMatch", optionAlias: "optionAlias", chips: "chips", closableChips: "closableChips", clearable: "clearable", openOnClear: "openOnClear", keepInitialOrder: "keepInitialOrder", optionLabel: "optionLabel", optionValue: "optionValue", optionInfo: "optionInfo", hideDetails: "hideDetails", persistentClear: "persistentClear", prefixIcon: "prefixIcon", prefixIconSize: "prefixIconSize", loading: "loading", loadingMessage: "loadingMessage", showLoadingMessage: "showLoadingMessage", emptyMessage: "emptyMessage", showEmptyMessage: "showEmptyMessage", virtualScroll: "virtualScroll", numToleratedItems: "numToleratedItems", externalError: "externalError", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", appearance: "appearance", emptyOptionIndex: "emptyOptionIndex", inputChangeDebounceTime: "inputChangeDebounceTime", validating: "validating", _value: ["value", "_value"], options: "options" }, outputs: { valueChanged: "valueChanged", inputChanged: "inputChanged", focused: "focused", blurred: "blurred" }, providers: [LabelByValuePipe, CheckOptionSelectedPipe], viewQueries: [{ propertyName: "autocompleteBox", first: true, predicate: ["autocompleteBox"], descendants: true }, { propertyName: "autocompleteContainer", first: true, predicate: ["autocompleteContainer"], descendants: true }, { propertyName: "virtualList", first: true, predicate: ["virtualList"], descendants: true }, { propertyName: "optionsMenu", first: true, predicate: ["optionsMenu"], descendants: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }, { propertyName: "autocompleteInput", first: true, predicate: ["autocompleteInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-autocomplete\"\n [ngClass]=\"{\n disabled: disabled,\n error: error || externalError,\n active: isActive,\n opened: isOpened\n }\"\n #autocompleteContainer>\n @if (label) {\n <div class=\"cps-autocomplete-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-autocomplete-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n (keydown)=\"onContainerKeyDown($event)\"\n class=\"cps-autocomplete-container\"\n [class.active]=\"isActive\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div\n class=\"cps-autocomplete-box\"\n #autocompleteBox\n (mousedown)=\"onBoxClick()\">\n <div class=\"cps-autocomplete-box-area\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? 'var(--cps-text-muted)' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if (\n (!multiple && !isEmptyValue()) || (value?.length > 0 && multiple)\n ) {\n <div class=\"cps-autocomplete-box-items\">\n @if (!multiple) {\n <span class=\"single-item\">\n <div class=\"single-item-selection\">\n <span [style.opacity]=\"activeSingle ? 0 : 1\">{{\n returnObject\n ? value[optionLabel]\n : (value\n | labelByValue: options : optionValue : optionLabel)\n }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n autocompleteInputTemplate;\n context: {\n inputClass: 'single-item-input',\n inputStyle: activeSingle ? { opacity: '1' } : null\n }\n \">\n </ng-container>\n </span>\n }\n @if (multiple && !chips) {\n <div class=\"cps-autocomplete-multi-selection-wrapper\">\n <div\n class=\"text-group\"\n role=\"list\"\n tabindex=\"-1\"\n aria-label=\"Selected options\">\n @for (val of value; track val; let last = $last) {\n <div\n class=\"text-group-item\"\n role=\"listitem\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\">\n {{\n returnObject\n ? val[optionLabel]\n : (val\n | labelByValue\n : options\n : optionValue\n : optionLabel)\n }}{{ !last ? ',' : '' }}\n </div>\n }\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n autocompleteInputTemplate;\n context: {\n inputClass: 'multi-item-input'\n }\n \"></ng-container>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"cps-autocomplete-multi-selection-wrapper\">\n <div\n class=\"chips-group\"\n role=\"list\"\n tabindex=\"-1\"\n aria-label=\"Selected options\">\n @for (val of value; track val; let last = $last) {\n <cps-chip\n role=\"listitem\"\n closeButtonAriaLabel=\"Remove\"\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"select(val, true)\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\"\n [label]=\"\n returnObject\n ? val[optionLabel]\n : (val\n | labelByValue: options : optionValue : optionLabel)\n \">\n </cps-chip>\n }\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n autocompleteInputTemplate;\n context: {\n inputClass: 'multi-chip-input'\n }\n \"></ng-container>\n </div>\n }\n </div>\n } @else {\n <ng-container\n *ngTemplateOutlet=\"autocompleteInputTemplate\"></ng-container>\n }\n <span class=\"cps-autocomplete-box-icons\">\n @if (clearable && !disabled) {\n <span\n role=\"button\"\n (click)=\"clear($event)\"\n (mousedown)=\"$event.preventDefault()\"\n (keydown.enter)=\"clear($event)\"\n (keydown.space)=\"clear($event)\"\n aria-label=\"Clear selection\"\n [tabindex]=\"disabled ? -1 : 0\"\n class=\"cps-autocomplete-box-clear-icon\"\n [ngClass]=\"{\n 'cps-autocomplete-box-clear-icon-hidden':\n !persistentClear &&\n (!multiple || !value?.length) &&\n (multiple || isEmptyValue())\n }\">\n <cps-icon icon=\"delete\" size=\"small\"></cps-icon>\n </span>\n }\n @if (showChevron && options.length) {\n <span\n class=\"cps-autocomplete-box-chevron\"\n role=\"button\"\n (mousedown)=\"onChevronClick($event)\"\n (keydown.enter)=\"onChevronClick($event)\"\n (keydown.space)=\"onChevronClick($event)\"\n [attr.aria-label]=\"\n isOpened ? 'Collapse options' : 'Expand options'\n \"\n [tabindex]=\"disabled ? -1 : 0\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden($event)\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-autocomplete-options-menu\">\n <div\n #optionsList\n role=\"listbox\"\n [id]=\"optionsListId\"\n tabindex=\"-1\"\n aria-readonly=\"false\"\n aria-disabled=\"false\"\n aria-orientation=\"vertical\"\n [attr.aria-multiselectable]=\"!!multiple\"\n class=\"cps-autocomplete-options\"\n [style.width.rem]=\"autocompleteBoxWidthRem\">\n @if (loading && showLoadingMessage) {\n <div\n class=\"cps-autocomplete-options-loading\"\n role=\"option\"\n tabindex=\"-1\"\n aria-disabled=\"true\"\n aria-selected=\"false\">\n {{ loadingMessage }}\n </div>\n }\n @if (\n showEmptyMessage &&\n filteredOptions.length < 1 &&\n !loading &&\n inputTextDebounced\n ) {\n <div\n class=\"cps-autocomplete-options-empty\"\n role=\"option\"\n tabindex=\"-1\"\n aria-disabled=\"true\"\n aria-selected=\"false\">\n {{ emptyMessage }}\n </div>\n }\n @if (isSelectAllVisible) {\n <div\n class=\"cps-autocomplete-options-option select-all-option\"\n [id]=\"selectAllOptionId\"\n role=\"option\"\n tabindex=\"-1\"\n aria-disabled=\"false\"\n [attr.aria-setsize]=\"optionsAriaSetSize\"\n [attr.aria-posinset]=\"1\"\n [attr.aria-selected]=\"value?.length === options.length\"\n [class.allselected]=\"value?.length === options.length\"\n [class.highlighten]=\"optionHighlightedIndex === 0\"\n (mousedown)=\"$event.preventDefault()\"\n (click)=\"toggleAll()\">\n <span class=\"cps-autocomplete-options-option-left\">\n @if (multiple) {\n <span class=\"cps-autocomplete-options-option-check\"> </span>\n }\n <span class=\"cps-autocomplete-options-option-label\"\n >Select all</span\n >\n </span>\n </div>\n }\n @if (!loading) {\n @if (virtualScroll) {\n <p-virtualscroller\n #virtualList\n [tabindex]=\"-1\"\n [items]=\"filteredOptions\"\n [delay]=\"0\"\n [scrollHeight]=\"virtualListHeightRem + 'rem'\"\n [options]=\"{ numToleratedItems: numToleratedItems }\"\n [itemSize]=\"virtualScrollItemSizePx\">\n <ng-template pTemplate=\"item\" let-item let-options=\"options\">\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item,\n itemIndex: options.index\n }\n \"></ng-container>\n </ng-template>\n </p-virtualscroller>\n } @else {\n @for (item of filteredOptions; track item; let itemIndex = $index) {\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item,\n itemIndex: itemIndex\n }\n \"></ng-container>\n }\n }\n }\n </div>\n </cps-menu>\n @if (loading || validating) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"autocomplete-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !externalError && !hideDetails) {\n <div class=\"cps-autocomplete-hint\">\n {{ hint }}\n </div>\n }\n @if ((error || externalError) && !hideDetails) {\n <div class=\"cps-autocomplete-error\" role=\"alert\" aria-live=\"assertive\">\n {{ error || externalError }}\n </div>\n }\n</div>\n\n<ng-template\n #autocompleteInputTemplate\n let-inputClass=\"inputClass\"\n let-inputStyle=\"inputStyle\">\n <input\n #autocompleteInput\n type=\"text\"\n class=\"cps-autocomplete-box-input\"\n spellcheck=\"false\"\n [disabled]=\"disabled\"\n role=\"combobox\"\n aria-autocomplete=\"list\"\n aria-haspopup=\"listbox\"\n [attr.aria-invalid]=\"error || externalError ? 'true' : null\"\n [attr.aria-controls]=\"optionsListId\"\n [attr.aria-activedescendant]=\"activeDescendantId\"\n [attr.aria-expanded]=\"isOpened\"\n [attr.aria-required]=\"isRequired || null\"\n [ngClass]=\"inputClass\"\n [ngStyle]=\"inputStyle\"\n [placeholder]=\"\n (!multiple && isEmptyValue()) || (value?.length < 1 && multiple)\n ? placeholder\n : ''\n \"\n (input)=\"filterOptions($event)\"\n (keydown)=\"onInputKeyDown($event)\"\n [(ngModel)]=\"inputText\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n [attr.aria-label]=\"computedLabel\" />\n</ng-template>\n\n<ng-template #itemTemplate let-item=\"item\" let-itemIndex=\"itemIndex\">\n <div\n class=\"cps-autocomplete-options-option\"\n [id]=\"getOptionId(item, itemIndex)\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.aria-setsize]=\"optionsAriaSetSize\"\n [attr.aria-posinset]=\"getOptionAriaPosInSet(itemIndex)\"\n (mousedown)=\"$event.preventDefault()\"\n (click)=\"onOptionClick(item)\"\n [class.highlighten]=\"\n itemIndex === optionHighlightedIndex - (isSelectAllVisible ? 1 : 0)\n \"\n [attr.aria-selected]=\"\n item | checkOptionSelected: value : multiple : returnObject : optionValue\n \"\n [class.selected]=\"\n item | checkOptionSelected: value : multiple : returnObject : optionValue\n \">\n <span class=\"cps-autocomplete-options-option-left\">\n @if (multiple) {\n <span class=\"cps-autocomplete-options-option-check\"> </span>\n }\n <span\n data-testid=\"cps-autocomplete-options\"\n class=\"cps-autocomplete-options-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ item[optionLabel] }}</span\n >\n </span>\n\n <span\n class=\"cps-autocomplete-options-option-right\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ item[optionInfo] }}</span\n >\n </div>\n</ng-template>\n", styles: [":host{display:flex}:host .cps-autocomplete{position:relative;width:100%;outline:none;font-family:inherit;font-weight:400;display:grid}:host .cps-autocomplete .cps-autocomplete-container{position:relative}:host .cps-autocomplete .cps-autocomplete-container .autocomplete-progress-bar{position:absolute;bottom:.0625rem;padding:0 .0625rem}:host .cps-autocomplete .cps-autocomplete-container.borderless .cps-autocomplete-box,:host .cps-autocomplete .cps-autocomplete-container.underlined .cps-autocomplete-box{line-height:1;border:none!important;border-radius:0}:host .cps-autocomplete .cps-autocomplete-container.underlined .cps-autocomplete-box{border-bottom:.0625rem solid var(--cps-color-line-light)!important}:host .cps-autocomplete.active .cps-autocomplete-box{border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete.active .cps-autocomplete-box .cps-autocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-autocomplete.opened .cps-autocomplete-box .cps-autocomplete-box-chevron{top:1.375rem;transform:rotate(180deg)}:host .cps-autocomplete .cps-autocomplete-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);background-color:var(--cps-surface-body);font-size:.875rem;font-weight:600}:host .cps-autocomplete .cps-autocomplete-label .cps-autocomplete-label-info-circle{margin-left:.5rem;pointer-events:all}:host .cps-autocomplete .persistent-clear .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:not(:focus):not(:hover) cps-icon,:host .cps-autocomplete .cps-autocomplete-container.active .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:not(:focus):not(:hover) cps-icon,:host .cps-autocomplete .cps-autocomplete-container:hover .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:not(:focus):not(:hover) cps-icon{opacity:.5}:host .cps-autocomplete .cps-autocomplete-box{overflow:hidden;min-height:2.375rem;width:100%;cursor:text;background:var(--cps-input-background);font-size:1rem;outline:none;padding:0 .75rem;border-radius:.25rem;border:.0625rem solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-autocomplete .cps-autocomplete-box-area{display:flex;min-height:2.25rem;align-items:center}:host .cps-autocomplete .cps-autocomplete-box-area .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-autocomplete .cps-autocomplete-box-input{min-height:2.25rem;padding:0;background-color:transparent;width:0;min-width:1.875rem;flex-grow:1;font-size:1rem;color:var(--cps-color-text-dark);border-style:none;outline:none;font-family:inherit}:host .cps-autocomplete .cps-autocomplete-box-input::placeholder{color:var(--cps-input-placeholder);font-style:italic;opacity:1}:host .cps-autocomplete .cps-autocomplete-box-items{display:inline-flex;flex-direction:column;width:100%;padding-top:.1875rem;padding-bottom:.1875rem;min-height:2.25rem;justify-content:center;position:relative}:host .cps-autocomplete .cps-autocomplete-box-items .single-item{color:var(--cps-color-text-dark);display:inline-flex}:host .cps-autocomplete .cps-autocomplete-box-items .single-item-selection{display:inline-flex;letter-spacing:inherit;line-height:inherit;max-width:100%}:host .cps-autocomplete .cps-autocomplete-box-items .single-item-input{opacity:0;min-width:0;align-self:flex-start;flex:1 1;transition:none;position:absolute;top:0;bottom:0;width:100%;padding-inline-start:inherit;padding-inline-end:inherit}:host .cps-autocomplete .cps-autocomplete-box-items .multi-chip-input{min-height:1.875rem}:host .cps-autocomplete .cps-autocomplete-box-items .multi-item-input{min-height:1.75rem}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper{display:inline-flex;flex-wrap:wrap;align-items:center}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .chips-group{display:contents}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .chips-group cps-chip{padding-bottom:.1875rem;padding-top:.1875rem;padding-right:.25rem}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .text-group{display:contents;color:var(--cps-color-text-dark)}:host .cps-autocomplete .cps-autocomplete-box-items .cps-autocomplete-multi-selection-wrapper .text-group .text-group-item{padding-bottom:.1875rem;padding-top:.1875rem;padding-right:.25rem}:host .cps-autocomplete .cps-autocomplete-box:hover{border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box:hover .cps-autocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons{display:flex}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon{cursor:pointer;display:flex;color:var(--cps-state-error);margin-left:.5rem}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus{outline:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:hover cps-icon,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus cps-icon{opacity:1}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible{outline:none;position:relative}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible.suppress-focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon:focus-visible.suppress-focus-visible:after{display:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon-hidden{visibility:hidden}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron{display:flex;margin-left:.5rem}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus{outline:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible{outline:none;position:relative}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible.suppress-focus-visible:before,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus-visible.suppress-focus-visible:after{display:none}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron{transition-duration:.2s;cursor:pointer}:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:hover ::ng-deep cps-icon .cps-icon,:host .cps-autocomplete .cps-autocomplete-box .cps-autocomplete-box-icons .cps-autocomplete-box-chevron:focus ::ng-deep cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host .cps-autocomplete .cps-autocomplete-hint{color:var(--cps-color-text-mild);background-color:var(--cps-surface-body);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-autocomplete .cps-autocomplete-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-autocomplete.disabled{pointer-events:none}:host .cps-autocomplete.disabled .cps-autocomplete-box{background:var(--cps-color-bg-disabled)}:host .cps-autocomplete.disabled .cps-autocomplete-box-items{color:var(--cps-color-text-light)}:host .cps-autocomplete.disabled .cps-autocomplete-box-items .text-group,:host .cps-autocomplete.disabled .cps-autocomplete-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-autocomplete.disabled .cps-autocomplete-label{color:var(--cps-color-text-mild)}:host .cps-autocomplete.error .cps-autocomplete-box{border-color:var(--cps-state-error)!important;background:#fef3f2}:host .about-to-remove{color:var(--cps-color-text-light)}:host .about-to-remove ::ng-deep .cps-chip{background-color:var(--cps-color-bg-mid)}.cps-autocomplete-options{font-family:inherit;background:var(--cps-popover-background);overflow-x:hidden;max-height:15.125rem;overflow-y:auto}.cps-autocomplete-options .cps-autocomplete-options-empty,.cps-autocomplete-options .cps-autocomplete-options-loading{padding:.6875rem;font-size:1rem;cursor:default;color:var(--cps-color-text-dark)}.cps-autocomplete-options .cps-autocomplete-options-option{padding:.75rem;justify-content:space-between;display:flex;cursor:pointer}.cps-autocomplete-options .cps-autocomplete-options-option:hover{background:var(--cps-color-highlight-hover)}.cps-autocomplete-options .cps-autocomplete-options-option-label{color:var(--cps-color-text-dark)}.cps-autocomplete-options .cps-autocomplete-options-option-left{display:flex;align-items:center;margin-right:.5rem}.cps-autocomplete-options .cps-autocomplete-options-option-right{color:var(--cps-color-text-medium);text-align:right}.cps-autocomplete-options .cps-autocomplete-options-option-check{background-color:transparent;border:0;width:1rem;height:1rem;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:.5rem;opacity:0}.cps-autocomplete-options .cps-autocomplete-options-option-check:after{color:var(--cps-color-calm);top:.25rem;left:.0625rem;width:.5rem;height:.1875rem;border-left:.125rem solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:.125rem solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-autocomplete-options .cps-autocomplete-options-option.selected,.cps-autocomplete-options .cps-autocomplete-options-option.allselected{font-weight:600}.cps-autocomplete-options .cps-autocomplete-options-option.selected .cps-autocomplete-options-option-label,.cps-autocomplete-options .cps-autocomplete-options-option.allselected .cps-autocomplete-options-option-label{color:var(--cps-color-calm)}.cps-autocomplete-options .cps-autocomplete-options-option.selected .cps-autocomplete-options-option-check,.cps-autocomplete-options .cps-autocomplete-options-option.allselected .cps-autocomplete-options-option-check{opacity:1}.cps-autocomplete-options .cps-autocomplete-options-option.selected{background:var(--cps-color-highlight-selected)}.cps-autocomplete-options .cps-autocomplete-options-option.selected .cps-autocomplete-options-option-right{color:var(--cps-color-text-dark)}.cps-autocomplete-options .cps-autocomplete-options-option.highlighten{background:var(--cps-color-highlight-active)}.cps-autocomplete-options .cps-autocomplete-options-option.selected.highlighten{background:var(--cps-color-highlight-selected-dark)}.cps-autocomplete-options .select-all-option{border-bottom:.0625rem solid lightgrey;font-weight:600}.cps-autocomplete-options ::ng-deep .p-virtualscroller-list.p-scroller{overflow-anchor:none}.cps-autocomplete-options .virtual-row{white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "ngmodule", type: ScrollerModule }, { kind: "component", type: i4$1.Scroller, selector: "p-scroller, p-virtualscroller, p-virtual-scroller, p-virtualScroller", inputs: ["hostName", "id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "pipe", type: LabelByValuePipe, name: "labelByValue" }, { kind: "pipe", type: CheckOptionSelectedPipe, name: "checkOptionSelected" }] }); }
|
|
2810
2810
|
}
|
|
2811
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
2811
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsAutocompleteComponent, decorators: [{
|
|
2812
2812
|
type: Component,
|
|
2813
2813
|
args: [{ imports: [
|
|
2814
2814
|
CommonModule,
|
|
@@ -3158,10 +3158,10 @@ class CpsButtonToggleComponent {
|
|
|
3158
3158
|
_pxToRem(px) {
|
|
3159
3159
|
return px / this._rootFontSizePx;
|
|
3160
3160
|
}
|
|
3161
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3162
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3161
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsButtonToggleComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: PLATFORM_ID }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3162
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsButtonToggleComponent, isStandalone: true, selector: "cps-button-toggle", inputs: { label: "label", ariaLabel: "ariaLabel", options: "options", multiple: "multiple", disabled: "disabled", mandatory: "mandatory", equalWidths: "equalWidths", optionTooltipPosition: "optionTooltipPosition", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", _value: ["value", "_value"] }, outputs: { valueChanged: "valueChanged" }, providers: [CheckOptionSelectedPipe], usesOnChanges: true, ngImport: i0, template: "<div class=\"cps-btn-toggle\">\n @if (label) {\n <div class=\"cps-btn-toggle-label\" [class.disabled]=\"disabled\">\n <span>{{ label }}</span>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-btn-toggle-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n class=\"cps-btn-toggle-content\"\n role=\"group\"\n [attr.aria-label]=\"ariaLabel || label || null\">\n @for (option of options; track option.value) {\n @if (option.tooltip) {\n <span\n class=\"cps-btn-toggle-option-wrapper\"\n [cpsTooltip]=\"option.tooltip\"\n tooltipCloseDelay=\"0\"\n [tooltipPosition]=\"optionTooltipPosition\">\n <ng-container\n *ngTemplateOutlet=\"\n buttonTemplate;\n context: { option }\n \"></ng-container>\n </span>\n }\n @if (!option.tooltip) {\n <span class=\"cps-btn-toggle-option-wrapper\">\n <ng-container\n *ngTemplateOutlet=\"\n buttonTemplate;\n context: { option }\n \"></ng-container>\n </span>\n }\n }\n </div>\n</div>\n<ng-template #buttonTemplate let-option=\"option\">\n <button\n type=\"button\"\n class=\"cps-btn-toggle-content-option\"\n [class.is-selected]=\"\n option.value | checkOptionSelected: value : multiple : true : ''\n \"\n [disabled]=\"option.disabled || disabled\"\n (click)=\"updateValueOnClick(option.value)\"\n [attr.aria-pressed]=\"\n option.value | checkOptionSelected: value : multiple : true : ''\n \"\n [attr.aria-label]=\"option.ariaLabel || option.label || null\"\n [style.min-width.rem]=\"equalWidths ? largestButtonWidthRem : null\">\n <span class=\"cps-btn-toggle-content-option-inner\">\n @if (option.icon) {\n <cps-icon [class.me-2]=\"!!option.label\" [icon]=\"option.icon\">\n </cps-icon>\n }\n @if (option.label) {\n <span>{{ option.label }}</span>\n }\n </span>\n </button>\n</ng-template>\n", styles: [":host .cps-btn-toggle{display:block}:host .cps-btn-toggle-label{color:var(--cps-color-text-dark);margin-bottom:.5rem;align-items:center;display:flex;font-weight:700;font-size:1rem;font-family:Source Sans Pro,sans-serif;cursor:default}:host .cps-btn-toggle-label.disabled{color:var(--cps-color-text-mild)}:host .cps-btn-toggle-label .cps-btn-toggle-label-info-circle{margin-left:.5rem}:host .cps-btn-toggle-label .cps-btn-toggle-label-info-circle ::ng-deep cps-icon i{width:.875rem;height:.875rem}:host .cps-btn-toggle-content{display:flex;flex-wrap:nowrap}:host .cps-btn-toggle-option-wrapper{display:flex}:host .cps-btn-toggle-option-wrapper:not(:last-child) .cps-btn-toggle-content-option{border-right:0}:host .cps-btn-toggle-content-option{height:2.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;background:#fff;padding:.375rem .75rem;position:relative;border:.0625rem solid var(--cps-color-text-lightest);font-weight:400;font-size:1rem;font-family:Source Sans Pro,sans-serif;letter-spacing:.05em;color:var(--cps-color-text-dark);-webkit-user-select:none;user-select:none}:host .cps-btn-toggle-content-option:hover{background:var(--cps-color-highlight-hover);transition:background-color .2s ease}:host .cps-btn-toggle-content-option:active{background:var(--cps-color-highlight-active);transition:background-color .2s ease}:host .cps-btn-toggle-content-option:focus-visible:not(.is-selected):not(:active){background:var(--cps-color-highlight-hover)}:host .cps-btn-toggle-content-option:focus-visible{outline:none;position:relative}:host .cps-btn-toggle-content-option:focus-visible:before,:host .cps-btn-toggle-content-option:focus-visible:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-btn-toggle-content-option:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-btn-toggle-content-option:focus-visible:after{inset:-.3125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-btn-toggle-content-option:focus-visible.suppress-focus-visible:before,:host .cps-btn-toggle-content-option:focus-visible.suppress-focus-visible:after{display:none}:host .cps-btn-toggle-content-option:focus-visible{z-index:1}:host .cps-btn-toggle-content-option.is-selected{background:var(--cps-color-calm);color:#fff}:host .cps-btn-toggle-content-option:disabled{background:var(--cps-color-bg-disabled);color:var(--cps-color-text-mild);cursor:default}:host .cps-btn-toggle-content-option:disabled.is-selected{background:var(--cps-color-bg-disabled-selected);color:var(--cps-color-text-medium);opacity:1}:host .cps-btn-toggle-option-wrapper:first-child .cps-btn-toggle-content-option{border-radius:.25rem 0 0 .25rem}:host .cps-btn-toggle-option-wrapper:last-child .cps-btn-toggle-content-option{border-radius:0 .25rem .25rem 0}:host .cps-btn-toggle-content-option-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }, { kind: "pipe", type: CheckOptionSelectedPipe, name: "checkOptionSelected" }] }); }
|
|
3163
3163
|
}
|
|
3164
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3164
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsButtonToggleComponent, decorators: [{
|
|
3165
3165
|
type: Component,
|
|
3166
3166
|
args: [{ imports: [
|
|
3167
3167
|
CommonModule,
|
|
@@ -3399,10 +3399,10 @@ class CpsButtonComponent {
|
|
|
3399
3399
|
onBlur() {
|
|
3400
3400
|
this.enterActive = false;
|
|
3401
3401
|
}
|
|
3402
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3403
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3402
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsButtonComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3403
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsButtonComponent, isStandalone: true, selector: "cps-button", inputs: { color: "color", contentColor: "contentColor", borderRadius: "borderRadius", type: "type", label: "label", ariaLabel: "ariaLabel", icon: "icon", iconPosition: "iconPosition", size: "size", width: "width", height: "height", disabled: "disabled", loading: "loading" }, outputs: { clicked: "clicked" }, host: { properties: { "style.width": "this.cvtWidth" } }, usesOnChanges: true, ngImport: i0, template: "<div>\n <button\n type=\"button\"\n [ngClass]=\"classesList\"\n [disabled]=\"disabled\"\n (click)=\"onClick($event)\"\n [attr.aria-busy]=\"loading ? true : null\"\n [attr.aria-label]=\"ariaLabel || label || null\"\n [class.loading]=\"loading\"\n [class.cps-button--key-active]=\"enterActive\"\n (keydown.enter)=\"onEnterKeydown()\"\n (keyup.enter)=\"onEnterKeyup()\"\n (blur)=\"onBlur()\"\n [ngStyle]=\"{\n backgroundColor: type === 'solid' ? buttonColor : 'transparent',\n color: textColor,\n height: cvtHeight || 'none',\n borderRadius: borderRadius\n }\">\n <div class=\"cps-button__spinner\" aria-hidden=\"true\">\n @if (loading) {\n <cps-progress-circular\n color=\"currentColor\"\n [diameter]=\"cvtIconSize\"\n strokeWidth=\"2\">\n </cps-progress-circular>\n }\n </div>\n <div\n class=\"cps-button__content\"\n [style.visibility]=\"loading ? 'hidden' : null\"\n [attr.aria-hidden]=\"loading ? true : null\">\n @if (icon) {\n <cps-icon\n class=\"cps-button__icon\"\n [icon]=\"icon\"\n [color]=\"\n disabled\n ? type === 'solid'\n ? 'text-mild'\n : 'text-light'\n : textColor\n \"\n aria-hidden=\"true\"\n [size]=\"cvtIconSize\">\n </cps-icon>\n }\n @if (label) {\n <span\n class=\"cps-button__text\"\n [ngStyle]=\"{ 'font-size': cvtFontSize || null }\">\n {{ label }}\n </span>\n }\n </div>\n </button>\n</div>\n", styles: [":host{width:fit-content;display:inline-block}:host .cps-button{width:100%;letter-spacing:normal;font-family:Source Sans Pro,sans-serif;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;position:relative;border:none;cursor:pointer;outline:none;padding:0 1rem;font-weight:500}:host .cps-button:focus-visible:not(.loading){background-image:linear-gradient(#ffffff1a 0 0);box-shadow:0 .125rem .25rem #0c0c0d33}:host .cps-button:focus-visible{outline:none;position:relative}:host .cps-button:focus-visible:before,:host .cps-button:focus-visible:after{content:\"\";position:absolute;border-radius:inherit}:host .cps-button:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-button:focus-visible:after{inset:-.3125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-button:focus-visible.suppress-focus-visible:before,:host .cps-button:focus-visible.suppress-focus-visible:after{display:none}:host .cps-button:hover:not(:active):not(:disabled){background-image:linear-gradient(#ffffff1a 0 0);box-shadow:0 .125rem .25rem #0c0c0d33}:host .cps-button:active:not(:disabled):not(.loading),:host .cps-button--key-active:not(:disabled):not(.loading){background-image:linear-gradient(#0000001a 0 0)}:host .cps-button__content{display:inline-flex}:host .cps-button__icon{align-self:center}:host .cps-button:disabled,:host .cps-button.loading{cursor:default;pointer-events:none}:host .cps-button--solid{border:0}:host .cps-button--solid:disabled{background-color:var(--cps-color-bg-disabled-selected)!important;color:var(--cps-color-text-mild)!important}:host .cps-button--outlined{border:.125rem solid;box-sizing:border-box}:host .cps-button--outlined:disabled{border-color:var(--cps-color-text-light)!important;color:var(--cps-color-text-light)!important}:host .cps-button--borderless:disabled{color:var(--cps-color-text-light)!important}:host .cps-button--borderless:hover:not(:active):not(:disabled){box-shadow:0 .0625rem .25rem #0c0c0d1a}:host .cps-button--large{min-height:3rem}:host .cps-button--large .cps-button__icon{width:1.25rem;height:1.25rem}:host .cps-button--large .cps-button__text{font-size:1.25rem}:host .cps-button--large .cps-button__spinner ::ng-deep .cps-progress-circular{width:1.375rem}:host .cps-button--large.loading{min-width:3.5rem}:host .cps-button--normal{min-height:2.5rem}:host .cps-button--normal .cps-button__icon{width:1rem;height:1rem}:host .cps-button--normal .cps-button__text{font-size:1rem}:host .cps-button--normal .cps-button__spinner ::ng-deep .cps-progress-circular{width:1.125rem}:host .cps-button--normal.loading{min-width:3rem}:host .cps-button--small{min-height:2rem}:host .cps-button--small .cps-button__icon{width:.875rem;height:.875rem}:host .cps-button--small .cps-button__text{font-size:.875rem}:host .cps-button--small .cps-button__spinner ::ng-deep .cps-progress-circular{width:.875rem}:host .cps-button--small.loading{min-width:2.5rem}:host .cps-button--xsmall{min-height:1.5rem}:host .cps-button--xsmall .cps-button__icon{width:.75rem;height:.75rem}:host .cps-button--xsmall .cps-button__text{font-size:.75rem}:host .cps-button--xsmall .cps-button__spinner ::ng-deep .cps-progress-circular{width:.625rem}:host .cps-button--xsmall.loading{min-width:2rem}:host .cps-button.cps-button--icon-before .cps-button__icon{margin-right:.5rem}:host .cps-button.cps-button--icon-after .cps-button__icon{margin-left:.5rem;order:1}:host .cps-button .cps-button__text{line-height:1}:host .cps-button .cps-button__spinner{position:absolute;display:flex}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsProgressCircularComponent, selector: "cps-progress-circular", inputs: ["diameter", "strokeWidth", "color"] }] }); }
|
|
3404
3404
|
}
|
|
3405
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3405
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsButtonComponent, decorators: [{
|
|
3406
3406
|
type: Component,
|
|
3407
3407
|
args: [{ imports: [CommonModule, CpsIconComponent, CpsProgressCircularComponent], selector: 'cps-button', template: "<div>\n <button\n type=\"button\"\n [ngClass]=\"classesList\"\n [disabled]=\"disabled\"\n (click)=\"onClick($event)\"\n [attr.aria-busy]=\"loading ? true : null\"\n [attr.aria-label]=\"ariaLabel || label || null\"\n [class.loading]=\"loading\"\n [class.cps-button--key-active]=\"enterActive\"\n (keydown.enter)=\"onEnterKeydown()\"\n (keyup.enter)=\"onEnterKeyup()\"\n (blur)=\"onBlur()\"\n [ngStyle]=\"{\n backgroundColor: type === 'solid' ? buttonColor : 'transparent',\n color: textColor,\n height: cvtHeight || 'none',\n borderRadius: borderRadius\n }\">\n <div class=\"cps-button__spinner\" aria-hidden=\"true\">\n @if (loading) {\n <cps-progress-circular\n color=\"currentColor\"\n [diameter]=\"cvtIconSize\"\n strokeWidth=\"2\">\n </cps-progress-circular>\n }\n </div>\n <div\n class=\"cps-button__content\"\n [style.visibility]=\"loading ? 'hidden' : null\"\n [attr.aria-hidden]=\"loading ? true : null\">\n @if (icon) {\n <cps-icon\n class=\"cps-button__icon\"\n [icon]=\"icon\"\n [color]=\"\n disabled\n ? type === 'solid'\n ? 'text-mild'\n : 'text-light'\n : textColor\n \"\n aria-hidden=\"true\"\n [size]=\"cvtIconSize\">\n </cps-icon>\n }\n @if (label) {\n <span\n class=\"cps-button__text\"\n [ngStyle]=\"{ 'font-size': cvtFontSize || null }\">\n {{ label }}\n </span>\n }\n </div>\n </button>\n</div>\n", styles: [":host{width:fit-content;display:inline-block}:host .cps-button{width:100%;letter-spacing:normal;font-family:Source Sans Pro,sans-serif;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;position:relative;border:none;cursor:pointer;outline:none;padding:0 1rem;font-weight:500}:host .cps-button:focus-visible:not(.loading){background-image:linear-gradient(#ffffff1a 0 0);box-shadow:0 .125rem .25rem #0c0c0d33}:host .cps-button:focus-visible{outline:none;position:relative}:host .cps-button:focus-visible:before,:host .cps-button:focus-visible:after{content:\"\";position:absolute;border-radius:inherit}:host .cps-button:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-button:focus-visible:after{inset:-.3125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-button:focus-visible.suppress-focus-visible:before,:host .cps-button:focus-visible.suppress-focus-visible:after{display:none}:host .cps-button:hover:not(:active):not(:disabled){background-image:linear-gradient(#ffffff1a 0 0);box-shadow:0 .125rem .25rem #0c0c0d33}:host .cps-button:active:not(:disabled):not(.loading),:host .cps-button--key-active:not(:disabled):not(.loading){background-image:linear-gradient(#0000001a 0 0)}:host .cps-button__content{display:inline-flex}:host .cps-button__icon{align-self:center}:host .cps-button:disabled,:host .cps-button.loading{cursor:default;pointer-events:none}:host .cps-button--solid{border:0}:host .cps-button--solid:disabled{background-color:var(--cps-color-bg-disabled-selected)!important;color:var(--cps-color-text-mild)!important}:host .cps-button--outlined{border:.125rem solid;box-sizing:border-box}:host .cps-button--outlined:disabled{border-color:var(--cps-color-text-light)!important;color:var(--cps-color-text-light)!important}:host .cps-button--borderless:disabled{color:var(--cps-color-text-light)!important}:host .cps-button--borderless:hover:not(:active):not(:disabled){box-shadow:0 .0625rem .25rem #0c0c0d1a}:host .cps-button--large{min-height:3rem}:host .cps-button--large .cps-button__icon{width:1.25rem;height:1.25rem}:host .cps-button--large .cps-button__text{font-size:1.25rem}:host .cps-button--large .cps-button__spinner ::ng-deep .cps-progress-circular{width:1.375rem}:host .cps-button--large.loading{min-width:3.5rem}:host .cps-button--normal{min-height:2.5rem}:host .cps-button--normal .cps-button__icon{width:1rem;height:1rem}:host .cps-button--normal .cps-button__text{font-size:1rem}:host .cps-button--normal .cps-button__spinner ::ng-deep .cps-progress-circular{width:1.125rem}:host .cps-button--normal.loading{min-width:3rem}:host .cps-button--small{min-height:2rem}:host .cps-button--small .cps-button__icon{width:.875rem;height:.875rem}:host .cps-button--small .cps-button__text{font-size:.875rem}:host .cps-button--small .cps-button__spinner ::ng-deep .cps-progress-circular{width:.875rem}:host .cps-button--small.loading{min-width:2.5rem}:host .cps-button--xsmall{min-height:1.5rem}:host .cps-button--xsmall .cps-button__icon{width:.75rem;height:.75rem}:host .cps-button--xsmall .cps-button__text{font-size:.75rem}:host .cps-button--xsmall .cps-button__spinner ::ng-deep .cps-progress-circular{width:.625rem}:host .cps-button--xsmall.loading{min-width:2rem}:host .cps-button.cps-button--icon-before .cps-button__icon{margin-right:.5rem}:host .cps-button.cps-button--icon-after .cps-button__icon{margin-left:.5rem;order:1}:host .cps-button .cps-button__text{line-height:1}:host .cps-button .cps-button__spinner{position:absolute;display:flex}\n"] }]
|
|
3408
3408
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -3562,10 +3562,10 @@ class CpsCheckboxComponent {
|
|
|
3562
3562
|
focus() {
|
|
3563
3563
|
this._elementRef?.nativeElement?.querySelector('input')?.focus();
|
|
3564
3564
|
}
|
|
3565
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3566
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
3565
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsCheckboxComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: DOCUMENT }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3566
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsCheckboxComponent, isStandalone: true, selector: "cps-checkbox", inputs: { label: "label", ariaLabel: "ariaLabel", disabled: "disabled", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", icon: "icon", iconColor: "iconColor", value: "value" }, outputs: { valueChanged: "valueChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cps-checkbox-container\">\n <label class=\"cps-checkbox\" [class.cps-checkbox-disabled]=\"disabled\">\n <input\n type=\"checkbox\"\n class=\"cps-checkbox-input\"\n [disabled]=\"disabled\"\n [checked]=\"value\"\n (change)=\"updateValueEvent($event)\"\n [attr.aria-label]=\"ariaLabel || label || null\" />\n <span class=\"cps-checkbox-indicator\" aria-hidden=\"true\"></span>\n @if (icon) {\n <cps-icon\n class=\"cps-checkbox-icon\"\n [icon]=\"icon\"\n size=\"small\"\n [color]=\"disabled ? 'text-mild' : iconColor\"\n aria-hidden=\"true\">\n </cps-icon>\n }\n @if (label) {\n <span class=\"cps-checkbox-label\">\n {{ label }}\n </span>\n }\n </label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-checkbox-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n</div>\n", styles: [":host{min-width:max-content;display:inline-block}:host .cps-checkbox-container{line-height:normal;display:flex;align-items:center}:host .cps-checkbox-container .cps-checkbox{display:flex;align-items:center;font-size:1rem;font-family:Source Sans Pro,sans-serif;font-style:normal;font-weight:400;color:var(--cps-color-text-dark);cursor:pointer;-webkit-user-select:none;user-select:none}:host .cps-checkbox-container .cps-checkbox-disabled{cursor:default;color:var(--cps-color-text-mild)}:host .cps-checkbox-container .cps-checkbox-input{position:absolute;opacity:0;width:1.125rem;height:1.125rem;margin:0}:host .cps-checkbox-container .cps-checkbox-indicator{position:relative;display:inline-block;width:1.125rem;height:1.125rem;border:.125rem solid var(--cps-color-text-medium);border-radius:.125rem}:host .cps-checkbox-container .cps-checkbox-label,:host .cps-checkbox-container .cps-checkbox-icon{margin-left:.625rem}:host .cps-checkbox-container .cps-checkbox-input:checked~.cps-checkbox-indicator{color:#fff;background:var(--cps-color-calm) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgdmlld0JveD0iMCAwIDEyIDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TCAuMDU3IDUuNjRsLjgyOS0xLjIyN0w0LjQ3IDcuMjY4IDEwLjkyMS4wODZsLjkyMyAxLjEwMy02Ljg2MyA3LjY0Yy0uMTM0LS4wMDMtLjQwNi4xNDgtLjQwNi4xNDh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4KPC9zdmc+) 50% 40% no-repeat;background-size:.75rem auto;border-color:var(--cps-color-calm)}:host .cps-checkbox-container .cps-checkbox-input:disabled~.cps-checkbox-indicator{border-color:var(--cps-color-text-light)}:host .cps-checkbox-container .cps-checkbox-input:checked:disabled~.cps-checkbox-indicator{background:var(--cps-color-text-light) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgdmlld0JveD0iMCAwIDEyIDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TCAuMDU3IDUuNjRsLjgyOS0xLjIyN0w0LjQ3IDcuMjY4IDEwLjkyMS4wODZsLjkyMyAxLjEwMy02Ljg2MyA3LjY0Yy0uMTM0LS4wMDMtLjQwNi4xNDgtLjQwNi4xNDh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4KPC9zdmc+) 50% 40% no-repeat;background-size:.75rem auto}:host .cps-checkbox-container .cps-checkbox:not(.cps-checkbox-disabled):hover .cps-checkbox-indicator{border-color:var(--cps-color-calm)}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator{border-color:var(--cps-color-calm);outline:none;position:relative}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:before,:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:before{inset:-.325rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:after{inset:-.45rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator.suppress-focus-visible:before,:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator.suppress-focus-visible:after{display:none}:host .cps-checkbox-container .cps-checkbox-info-circle{margin-left:.5rem}:host .cps-checkbox-container .cps-checkbox-info-circle ::ng-deep cps-icon i{width:.875rem;height:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }] }); }
|
|
3567
3567
|
}
|
|
3568
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3568
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsCheckboxComponent, decorators: [{
|
|
3569
3569
|
type: Component,
|
|
3570
3570
|
args: [{ imports: [CommonModule, CpsInfoCircleComponent, CpsIconComponent], selector: 'cps-checkbox', template: "<div class=\"cps-checkbox-container\">\n <label class=\"cps-checkbox\" [class.cps-checkbox-disabled]=\"disabled\">\n <input\n type=\"checkbox\"\n class=\"cps-checkbox-input\"\n [disabled]=\"disabled\"\n [checked]=\"value\"\n (change)=\"updateValueEvent($event)\"\n [attr.aria-label]=\"ariaLabel || label || null\" />\n <span class=\"cps-checkbox-indicator\" aria-hidden=\"true\"></span>\n @if (icon) {\n <cps-icon\n class=\"cps-checkbox-icon\"\n [icon]=\"icon\"\n size=\"small\"\n [color]=\"disabled ? 'text-mild' : iconColor\"\n aria-hidden=\"true\">\n </cps-icon>\n }\n @if (label) {\n <span class=\"cps-checkbox-label\">\n {{ label }}\n </span>\n }\n </label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-checkbox-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n</div>\n", styles: [":host{min-width:max-content;display:inline-block}:host .cps-checkbox-container{line-height:normal;display:flex;align-items:center}:host .cps-checkbox-container .cps-checkbox{display:flex;align-items:center;font-size:1rem;font-family:Source Sans Pro,sans-serif;font-style:normal;font-weight:400;color:var(--cps-color-text-dark);cursor:pointer;-webkit-user-select:none;user-select:none}:host .cps-checkbox-container .cps-checkbox-disabled{cursor:default;color:var(--cps-color-text-mild)}:host .cps-checkbox-container .cps-checkbox-input{position:absolute;opacity:0;width:1.125rem;height:1.125rem;margin:0}:host .cps-checkbox-container .cps-checkbox-indicator{position:relative;display:inline-block;width:1.125rem;height:1.125rem;border:.125rem solid var(--cps-color-text-medium);border-radius:.125rem}:host .cps-checkbox-container .cps-checkbox-label,:host .cps-checkbox-container .cps-checkbox-icon{margin-left:.625rem}:host .cps-checkbox-container .cps-checkbox-input:checked~.cps-checkbox-indicator{color:#fff;background:var(--cps-color-calm) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgdmlld0JveD0iMCAwIDEyIDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TCAuMDU3IDUuNjRsLjgyOS0xLjIyN0w0LjQ3IDcuMjY4IDEwLjkyMS4wODZsLjkyMyAxLjEwMy02Ljg2MyA3LjY0Yy0uMTM0LS4wMDMtLjQwNi4xNDgtLjQwNi4xNDh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4KPC9zdmc+) 50% 40% no-repeat;background-size:.75rem auto;border-color:var(--cps-color-calm)}:host .cps-checkbox-container .cps-checkbox-input:disabled~.cps-checkbox-indicator{border-color:var(--cps-color-text-light)}:host .cps-checkbox-container .cps-checkbox-input:checked:disabled~.cps-checkbox-indicator{background:var(--cps-color-text-light) url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgdmlld0JveD0iMCAwIDEyIDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTQuNTc1IDguOTc3cy0uNDA0LS4wMDctLjUzNi0uMTY1TCAuMDU3IDUuNjRsLjgyOS0xLjIyN0w0LjQ3IDcuMjY4IDEwLjkyMS4wODZsLjkyMyAxLjEwMy02Ljg2MyA3LjY0Yy0uMTM0LS4wMDMtLjQwNi4xNDgtLjQwNi4xNDh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4KPC9zdmc+) 50% 40% no-repeat;background-size:.75rem auto}:host .cps-checkbox-container .cps-checkbox:not(.cps-checkbox-disabled):hover .cps-checkbox-indicator{border-color:var(--cps-color-calm)}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator{border-color:var(--cps-color-calm);outline:none;position:relative}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:before,:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:before{inset:-.325rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator:after{inset:-.45rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator.suppress-focus-visible:before,:host .cps-checkbox-container .cps-checkbox-input:focus-visible~.cps-checkbox-indicator.suppress-focus-visible:after{display:none}:host .cps-checkbox-container .cps-checkbox-info-circle{margin-left:.5rem}:host .cps-checkbox-container .cps-checkbox-info-circle ::ng-deep cps-icon i{width:.875rem;height:.875rem}\n"] }]
|
|
3571
3571
|
}], ctorParameters: () => [{ type: i1$2.NgControl, decorators: [{
|
|
@@ -3897,10 +3897,10 @@ class CpsInputComponent {
|
|
|
3897
3897
|
focus() {
|
|
3898
3898
|
this.elementRef?.nativeElement?.querySelector('input')?.focus();
|
|
3899
3899
|
}
|
|
3900
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
3901
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsInputComponent, isStandalone: true, selector: "cps-input", inputs: { label: "label", hint: "hint", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", width: "width", type: "type", loading: "loading", clearable: "clearable", prefixIcon: "prefixIcon", prefixIconClickable: "prefixIconClickable", prefixIconSize: "prefixIconSize", prefixText: "prefixText", hideDetails: "hideDetails", persistentClear: "persistentClear", error: "error", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", appearance: "appearance", valueToDisplay: "valueToDisplay", value: "value" }, outputs: { valueChanged: "valueChanged", focused: "focused", prefixIconClicked: "prefixIconClicked", blurred: "blurred", cleared: "cleared", enterClicked: "enterClicked" }, viewQueries: [{ propertyName: "prefixTextSpan", first: true, predicate: ["prefixTextSpan"], descendants: true }], ngImport: i0, template: "<div class=\"cps-input-container\" [ngStyle]=\"{ width: cvtWidth }\">\n @if (label) {\n <div\n class=\"cps-input-label\"\n [class.cps-input-label-disabled]=\"disabled && !readonly\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-input-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n\n <div\n class=\"cps-input-wrap\"\n [class.password]=\"type === 'password'\"\n [class.cps-input-wrap-error]=\"error\"\n [class.clearable]=\"clearable\"\n [class.persistent-clear]=\"persistentClear\"\n [class.borderless]=\"appearance === 'borderless'\"\n [class.underlined]=\"appearance === 'underlined'\">\n @if (!valueToDisplay) {\n <input\n spellcheck=\"false\"\n [type]=\"currentType\"\n autocomplete=\"off\"\n [value]=\"value\"\n (input)=\"updateValueEvent($event)\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n (keydown.enter)=\"onInputEnterKeyDown()\"\n [ngStyle]=\"{\n width: cvtWidth,\n 'padding-left': prefixWidth || 'none'\n }\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\" />\n }\n\n @if (valueToDisplay) {\n <input\n [value]=\"valueToDisplay\"\n [disabled]=\"true\"\n [readonly]=\"true\"\n [ngStyle]=\"{\n width: cvtWidth,\n 'padding-left': prefixWidth || 'none'\n }\" />\n }\n\n <div class=\"cps-input-prefix\">\n @if (prefixIcon) {\n <span class=\"cps-input-prefix-icon\">\n <cps-icon\n [icon]=\"prefixIcon\"\n [size]=\"prefixIconSize\"\n [style.color]=\"disabled ? 'var(--cps-text-muted)' : null\"\n [style.cursor]=\"\n prefixIconClickable && !disabled && !readonly\n ? 'pointer'\n : 'default'\n \"\n (click)=\"onClickPrefixIcon()\">\n </cps-icon>\n </span>\n }\n\n @if (prefixText) {\n <span class=\"cps-input-prefix-text\" #prefixTextSpan>\n {{ prefixText }}\n </span>\n }\n </div>\n\n @if (!disabled && !readonly) {\n <div class=\"cps-input-action-btns\">\n @if (clearable) {\n <span\n [style.visibility]=\"\n persistentClear || (!persistentClear && value)\n ? 'visible'\n : 'hidden'\n \"\n class=\"clear-btn\">\n <cps-icon icon=\"delete\" size=\"small\" (click)=\"onClear()\"></cps-icon>\n </span>\n }\n @if (type === 'password') {\n <span\n class=\"password-show-btn\"\n [class.password-show-btn-active]=\"currentType === 'text'\">\n <cps-icon\n icon=\"eye\"\n size=\"18px\"\n (click)=\"togglePassword()\"></cps-icon>\n </span>\n }\n </div>\n }\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.5\"\n class=\"cps-input-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-input-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-input-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-input-container{width:100%;gap:.2rem!important;display:flex!important;flex-direction:column!important;font-family:inherit}:host .cps-input-container .cps-input-wrap{position:relative;overflow:hidden}:host .cps-input-container .cps-input-wrap:hover input:enabled:not(:read-only){border:1px solid var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap-error input{border-color:var(--cps-state-error)!important}:host .cps-input-container .cps-input-wrap-error input:not(:focus){background:var(--cps-error-background)!important}:host .cps-input-container .cps-input-wrap-error .cps-input-prefix-icon{color:var(--cps-state-error)!important}:host .cps-input-container .cps-input-wrap input{min-height:38px;font-family:inherit;font-size:1rem;color:var(--cps-color-text-dark);background:var(--cps-input-background);padding:.375rem .75rem;line-height:1.5;border:1px solid var(--cps-color-line-light);transition-duration:.2s;appearance:none;border-radius:var(--cps-border-radius-small);width:100%}:host .cps-input-container .cps-input-wrap input:focus{outline:0}:host .cps-input-container .cps-input-wrap input:focus:not(:read-only){border-color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap input:read-only{cursor:default}:host .cps-input-container .cps-input-wrap input:disabled{opacity:1}:host .cps-input-container .cps-input-wrap input:disabled:not([readonly]){color:var(--cps-color-text-light);background-color:var(--cps-color-bg-disabled);pointer-events:none}:host .cps-input-container .cps-input-wrap input:focus:not(:read-only)+.cps-input-prefix>.cps-input-prefix-icon,:host .cps-input-container .cps-input-wrap input:hover:not(:read-only)+.cps-input-prefix>.cps-input-prefix-icon{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap input:disabled+.cps-input-prefix>.cps-input-prefix-icon{color:var(--cps-color-text-dark)}:host .cps-input-container .cps-input-wrap input:focus+.cps-input-prefix+.cps-input-action-btns>.clear-btn cps-icon{opacity:.5}:host .cps-input-container .cps-input-wrap:hover .cps-input-action-btns .clear-btn cps-icon{opacity:.5}:host .cps-input-container .cps-input-wrap .cps-input-action-btns{display:flex;position:absolute;top:50%;right:.75rem;margin-top:-.5rem}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .clear-btn{display:flex;cursor:pointer;color:var(--cps-state-error)}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .clear-btn cps-icon{opacity:0;transition-duration:.2s}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .clear-btn cps-icon:hover{opacity:1!important}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn{margin-left:.5rem;cursor:pointer;color:var(--cps-color-text-mild)}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn-active{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn cps-icon{transition-duration:.2s}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn cps-icon:hover{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap input:not(:read-only)+.cps-input-prefix:hover>.cps-input-prefix-icon{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap .cps-input-prefix{display:flex;position:absolute;height:100%;top:50%;left:.8rem;transform:translateY(-50%)}:host .cps-input-container .cps-input-wrap .cps-input-prefix-icon{display:flex;flex-direction:column;justify-content:center;transition-duration:.2s;margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-input-container .cps-input-wrap .cps-input-prefix-text{display:flex;flex-direction:column;justify-content:center;color:var(--cps-color-text-mild);cursor:default;line-height:1.2}:host .cps-input-container .cps-input-wrap .cps-input-progress-bar{position:absolute;bottom:1px;padding:0 1px;display:block}:host .cps-input-container .cps-input-wrap.borderless input,:host .cps-input-container .cps-input-wrap.underlined input{line-height:1;border:none!important;border-radius:0}:host .cps-input-container .cps-input-wrap.underlined input{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-input-container .persistent-clear .cps-input-action-btns .clear-btn cps-icon{opacity:.5}:host .cps-input-container .password.clearable>input{padding-right:3.8rem}:host .cps-input-container .password>input,:host .cps-input-container .clearable>input{padding-right:2.2rem}:host .cps-input-container .cps-input-hint{color:var(--cps-color-text-mild);font-family:inherit;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-input-container .cps-input-error{color:var(--cps-state-error);font-family:inherit;font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-input-container .cps-input-label{color:var(--cps-color-text-dark);font-size:.875rem;align-items:center;display:inline-flex;font-weight:600}:host .cps-input-container .cps-input-label .cps-input-label-info-circle{margin-left:8px}:host .cps-input-container .cps-input-label-disabled{color:var(--cps-color-text-mild)}:host .cps-input-container ::placeholder{font-family:inherit;color:var(--cps-color-text-mild);font-style:italic;opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }] }); }
|
|
3900
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsInputComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3901
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsInputComponent, isStandalone: true, selector: "cps-input", inputs: { label: "label", hint: "hint", placeholder: "placeholder", disabled: "disabled", readonly: "readonly", width: "width", type: "type", loading: "loading", clearable: "clearable", prefixIcon: "prefixIcon", prefixIconClickable: "prefixIconClickable", prefixIconSize: "prefixIconSize", prefixText: "prefixText", hideDetails: "hideDetails", persistentClear: "persistentClear", error: "error", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", appearance: "appearance", valueToDisplay: "valueToDisplay", value: "value" }, outputs: { valueChanged: "valueChanged", focused: "focused", prefixIconClicked: "prefixIconClicked", blurred: "blurred", cleared: "cleared", enterClicked: "enterClicked" }, viewQueries: [{ propertyName: "prefixTextSpan", first: true, predicate: ["prefixTextSpan"], descendants: true }], ngImport: i0, template: "<div class=\"cps-input-container\" [ngStyle]=\"{ width: cvtWidth }\">\n @if (label) {\n <div\n class=\"cps-input-label\"\n [class.cps-input-label-disabled]=\"disabled && !readonly\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-input-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n\n <div\n class=\"cps-input-wrap\"\n [class.password]=\"type === 'password'\"\n [class.cps-input-wrap-error]=\"error\"\n [class.clearable]=\"clearable\"\n [class.persistent-clear]=\"persistentClear\"\n [class.borderless]=\"appearance === 'borderless'\"\n [class.underlined]=\"appearance === 'underlined'\">\n @if (!valueToDisplay) {\n <input\n spellcheck=\"false\"\n [type]=\"currentType\"\n autocomplete=\"off\"\n [value]=\"value\"\n (input)=\"updateValueEvent($event)\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n (keydown.enter)=\"onInputEnterKeyDown()\"\n [ngStyle]=\"{\n width: cvtWidth,\n 'padding-left': prefixWidth || 'none'\n }\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\" />\n }\n\n @if (valueToDisplay) {\n <input\n [value]=\"valueToDisplay\"\n [disabled]=\"true\"\n [readonly]=\"true\"\n [ngStyle]=\"{\n width: cvtWidth,\n 'padding-left': prefixWidth || 'none'\n }\" />\n }\n\n <div class=\"cps-input-prefix\">\n @if (prefixIcon) {\n <span class=\"cps-input-prefix-icon\">\n <cps-icon\n [icon]=\"prefixIcon\"\n [size]=\"prefixIconSize\"\n [style.color]=\"disabled ? 'var(--cps-text-muted)' : null\"\n [style.cursor]=\"\n prefixIconClickable && !disabled && !readonly\n ? 'pointer'\n : 'default'\n \"\n (click)=\"onClickPrefixIcon()\">\n </cps-icon>\n </span>\n }\n\n @if (prefixText) {\n <span class=\"cps-input-prefix-text\" #prefixTextSpan>\n {{ prefixText }}\n </span>\n }\n </div>\n\n @if (!disabled && !readonly) {\n <div class=\"cps-input-action-btns\">\n @if (clearable) {\n <span\n [style.visibility]=\"\n persistentClear || (!persistentClear && value)\n ? 'visible'\n : 'hidden'\n \"\n class=\"clear-btn\">\n <cps-icon icon=\"delete\" size=\"small\" (click)=\"onClear()\"></cps-icon>\n </span>\n }\n @if (type === 'password') {\n <span\n class=\"password-show-btn\"\n [class.password-show-btn-active]=\"currentType === 'text'\">\n <cps-icon\n icon=\"eye\"\n size=\"18px\"\n (click)=\"togglePassword()\"></cps-icon>\n </span>\n }\n </div>\n }\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.5\"\n class=\"cps-input-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-input-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-input-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-input-container{width:100%;gap:.2rem!important;display:flex!important;flex-direction:column!important;font-family:inherit}:host .cps-input-container .cps-input-wrap{position:relative;overflow:hidden}:host .cps-input-container .cps-input-wrap:hover input:enabled:not(:read-only){border:1px solid var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap-error input{border-color:var(--cps-state-error)!important}:host .cps-input-container .cps-input-wrap-error input:not(:focus){background:var(--cps-error-background)!important}:host .cps-input-container .cps-input-wrap-error .cps-input-prefix-icon{color:var(--cps-state-error)!important}:host .cps-input-container .cps-input-wrap input{min-height:38px;font-family:inherit;font-size:1rem;color:var(--cps-color-text-dark);background:var(--cps-input-background);padding:.375rem .75rem;line-height:1.5;border:1px solid var(--cps-color-line-light);transition-duration:.2s;appearance:none;border-radius:var(--cps-border-radius-small);width:100%}:host .cps-input-container .cps-input-wrap input:focus{outline:0}:host .cps-input-container .cps-input-wrap input:focus:not(:read-only){border-color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap input:read-only{cursor:default}:host .cps-input-container .cps-input-wrap input:disabled{opacity:1}:host .cps-input-container .cps-input-wrap input:disabled:not([readonly]){color:var(--cps-color-text-light);background-color:var(--cps-color-bg-disabled);pointer-events:none}:host .cps-input-container .cps-input-wrap input:focus:not(:read-only)+.cps-input-prefix>.cps-input-prefix-icon,:host .cps-input-container .cps-input-wrap input:hover:not(:read-only)+.cps-input-prefix>.cps-input-prefix-icon{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap input:disabled+.cps-input-prefix>.cps-input-prefix-icon{color:var(--cps-color-text-dark)}:host .cps-input-container .cps-input-wrap input:focus+.cps-input-prefix+.cps-input-action-btns>.clear-btn cps-icon{opacity:.5}:host .cps-input-container .cps-input-wrap:hover .cps-input-action-btns .clear-btn cps-icon{opacity:.5}:host .cps-input-container .cps-input-wrap .cps-input-action-btns{display:flex;position:absolute;top:50%;right:.75rem;margin-top:-.5rem}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .clear-btn{display:flex;cursor:pointer;color:var(--cps-state-error)}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .clear-btn cps-icon{opacity:0;transition-duration:.2s}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .clear-btn cps-icon:hover{opacity:1!important}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn{margin-left:.5rem;cursor:pointer;color:var(--cps-color-text-mild)}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn-active{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn cps-icon{transition-duration:.2s}:host .cps-input-container .cps-input-wrap .cps-input-action-btns .password-show-btn cps-icon:hover{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap input:not(:read-only)+.cps-input-prefix:hover>.cps-input-prefix-icon{color:var(--cps-color-calm)}:host .cps-input-container .cps-input-wrap .cps-input-prefix{display:flex;position:absolute;height:100%;top:50%;left:.8rem;transform:translateY(-50%)}:host .cps-input-container .cps-input-wrap .cps-input-prefix-icon{display:flex;flex-direction:column;justify-content:center;transition-duration:.2s;margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-input-container .cps-input-wrap .cps-input-prefix-text{display:flex;flex-direction:column;justify-content:center;color:var(--cps-color-text-mild);cursor:default;line-height:1.2}:host .cps-input-container .cps-input-wrap .cps-input-progress-bar{position:absolute;bottom:1px;padding:0 1px;display:block}:host .cps-input-container .cps-input-wrap.borderless input,:host .cps-input-container .cps-input-wrap.underlined input{line-height:1;border:none!important;border-radius:0}:host .cps-input-container .cps-input-wrap.underlined input{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-input-container .persistent-clear .cps-input-action-btns .clear-btn cps-icon{opacity:.5}:host .cps-input-container .password.clearable>input{padding-right:3.8rem}:host .cps-input-container .password>input,:host .cps-input-container .clearable>input{padding-right:2.2rem}:host .cps-input-container .cps-input-hint{color:var(--cps-color-text-mild);font-family:inherit;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-input-container .cps-input-error{color:var(--cps-state-error);font-family:inherit;font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-input-container .cps-input-label{color:var(--cps-color-text-dark);font-size:.875rem;align-items:center;display:inline-flex;font-weight:600}:host .cps-input-container .cps-input-label .cps-input-label-info-circle{margin-left:8px}:host .cps-input-container .cps-input-label-disabled{color:var(--cps-color-text-mild)}:host .cps-input-container ::placeholder{font-family:inherit;color:var(--cps-color-text-mild);font-style:italic;opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }] }); }
|
|
3902
3902
|
}
|
|
3903
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
3903
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsInputComponent, decorators: [{
|
|
3904
3904
|
type: Component,
|
|
3905
3905
|
args: [{ imports: [
|
|
3906
3906
|
CommonModule,
|
|
@@ -4284,10 +4284,10 @@ class CpsDatepickerComponent {
|
|
|
4284
4284
|
this.focusInput();
|
|
4285
4285
|
}
|
|
4286
4286
|
}
|
|
4287
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4288
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.10", type: CpsDatepickerComponent, isStandalone: true, selector: "cps-datepicker", inputs: { label: "label", disabled: "disabled", width: "width", placeholder: "placeholder", hint: "hint", clearable: "clearable", hideDetails: "hideDetails", persistentClear: "persistentClear", showTodayButton: "showTodayButton", openOnInputFocus: "openOnInputFocus", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", appearance: "appearance", minDate: "minDate", maxDate: "maxDate", value: "value" }, outputs: { valueChanged: "valueChanged" }, viewQueries: [{ propertyName: "datepickerInput", first: true, predicate: ["datepickerInput"], descendants: true }, { propertyName: "calendarMenu", first: true, predicate: ["calendarMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-datepicker\"\n [ngStyle]=\"{ width: cvtWidth }\"\n [class.focused]=\"isOpened\">\n <cps-input\n #datepickerInput\n [disabled]=\"disabled\"\n [value]=\"stringDate\"\n [label]=\"label\"\n prefixIcon=\"datepicker\"\n [placeholder]=\"placeholder\"\n (prefixIconClicked)=\"onClickCalendarIcon()\"\n [prefixIconClickable]=\"true\"\n (focused)=\"onInputFocus()\"\n (valueChanged)=\"onInputValueChanged($event)\"\n [clearable]=\"clearable\"\n (blurred)=\"onInputBlur()\"\n (cleared)=\"onInputClear()\"\n (enterClicked)=\"onInputEnterClicked()\"\n [width]=\"width\"\n [hint]=\"hint\"\n [hideDetails]=\"hideDetails\"\n [infoTooltip]=\"infoTooltip\"\n [infoTooltipClass]=\"infoTooltipClass\"\n [infoTooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [infoTooltipPersistent]=\"infoTooltipPersistent\"\n [persistentClear]=\"persistentClear\"\n [appearance]=\"appearance\"\n [error]=\"error\"></cps-input>\n <cps-menu\n #calendarMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeCalendarHidden()\"\n (contentClicked)=\"onCalendarContentClick()\"\n [focusOnShow]=\"false\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-datepicker-calendar-menu\">\n <div class=\"cps-datepicker-calendar\">\n <p-datepicker\n [(ngModel)]=\"value\"\n [inline]=\"true\"\n [showIcon]=\"true\"\n [showButtonBar]=\"showTodayButton\"\n (onSelect)=\"onSelectCalendarDate($event)\"\n (onClearClick)=\"onClearCalendarDate()\"\n [showOtherMonths]=\"false\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\" />\n </div>\n </cps-menu>\n</div>\n", styles: [":host{display:flex}:host .cps-datepicker{position:relative;width:100%}:host .cps-datepicker.focused ::ng-deep input{border:1px solid var(--cps-color-calm)!important}:host .cps-datepicker.focused ::ng-deep .cps-input-prefix-icon{color:var(--cps-color-calm)!important}:host .cps-datepicker.focused ::ng-deep .clear-btn cps-icon{opacity:.5!important}.cps-datepicker-calendar{-webkit-user-select:none;-ms-user-select:none;user-select:none}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-panel{font-family:Source Sans Pro,sans-serif;width:auto!important;padding:.5rem;background:#fff;color:var(--cps-color-text-darkest);border:1px solid #ced4da}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header{padding:.5rem;color:var(--cps-color-text-darkest);background:#fff;font-weight:600;margin:0;border-bottom:1px solid #dee2e6;border-top-right-radius:6px;border-top-left-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-prev-button,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-next-button{width:2rem;height:2rem;color:var(--cps-color-calm);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-prev-button:enabled:hover,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-next-button:enabled:hover{color:var(--cps-color-calm);border-color:transparent;background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-prev-button:focus,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-next-button:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title{line-height:2rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-year,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-month{color:var(--cps-color-text-darkest);transition:background-color .2s,color .2s,box-shadow .2s;font-weight:600;padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-year:enabled:hover,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-month:enabled:hover{color:var(--cps-color-calm)}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-month{margin-right:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table{font-size:1rem;margin:.5rem 0}.cps-datepicker-calendar ::ng-deep .p-datepicker table th{padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table th>span{width:2.5rem;height:2.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table td{padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span{width:2.5rem;height:2.5rem;border-radius:50%;transition:box-shadow .2s;border:1px solid transparent}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span.p-disabled{color:var(--cps-color-text-lightest);cursor:default}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker table td.p-datepicker-today>span{border-color:var(--cps-color-calm);background:unset;color:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker table td.p-datepicker-today>span.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-buttonbar{padding:.5rem 0 0;border-top:1px solid #dee2e6}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-buttonbar .p-button{width:auto;color:var(--cps-color-prepared);border-width:2px;border-style:solid}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker{border-top:1px solid #dee2e6;padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button{width:2rem;height:2rem;color:var(--cps-color-calm);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button:enabled:hover{color:var(--cps-color-calm);border-color:transparent;background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button:last-child{margin-top:.2em}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker span{font-size:1.25rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker>div{padding:0 .5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-timeonly .p-timepicker{border-top:0 none}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-month-view{margin:.5rem 0}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-month-view .p-datepicker-month{padding:.5rem;transition:box-shadow .2s;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-month-view .p-datepicker-month.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-year-view{margin:.5rem 0}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-year-view .p-datepicker-year{padding:.5rem;transition:box-shadow .2s;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-year-view .p-datepicker-year.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-multiple-month .p-datepicker-group{border-left:1px solid #dee2e6;padding-right:.5rem;padding-left:.5rem;padding-top:0;padding-bottom:0}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:first-child{padding-left:0;border-left:0 none}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child{padding-right:0}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) table td span:not(.p-datepicker-day-selected):not(.p-disabled):hover{background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) table td span:not(.p-datepicker-day-selected):not(.p-disabled):focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-datepicker-month-view .p-datepicker-month:not(.p-disabled):not(.p-datepicker-day-selected):hover{background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-datepicker-month-view .p-datepicker-month:not(.p-disabled):focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-yearpicker .p-datepicker-year:not(.p-disabled):not(.p-datepicker-day-selected):hover{background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-yearpicker .p-datepicker-year:not(.p-disabled):focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep p-calendar.p-calendar-clearable .p-inputtext{padding-right:2.5rem}.cps-datepicker-calendar ::ng-deep p-calendar.p-calendar-clearable .p-calendar-clear-icon{color:var(--cps-color-calm);right:.75rem}.cps-datepicker-calendar ::ng-deep p-calendar.p-calendar-clearable.p-calendar-w-btn .p-calendar-clear-icon{color:var(--cps-color-calm);right:3.75rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table th,.cps-datepicker-calendar ::ng-deep .p-datepicker table td{padding:.125rem}.cps-datepicker-calendar ::ng-deep .p-datepicker-other-month{color:var(--cps-color-text-light)}.cps-datepicker-calendar ::ng-deep .p-ripple:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-ripple{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:1rem;font-family:Source Sans Pro,sans-serif;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button{font-family:Source Sans Pro,sans-serif;background-color:transparent;color:var(--cps-color-calm);border-color:transparent;margin:0;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative;padding:.75rem 1.25rem;font-size:1rem;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button:focus{box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button:hover{background-color:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button:active{background-color:var(--cps-color-highlight-selected)}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button .p-button-label{font-weight:700}.cps-datepicker-calendar ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}\n"], dependencies: [{ kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$1.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }] }); }
|
|
4287
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDatepickerComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4288
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsDatepickerComponent, isStandalone: true, selector: "cps-datepicker", inputs: { label: "label", disabled: "disabled", width: "width", placeholder: "placeholder", hint: "hint", clearable: "clearable", hideDetails: "hideDetails", persistentClear: "persistentClear", showTodayButton: "showTodayButton", openOnInputFocus: "openOnInputFocus", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", appearance: "appearance", minDate: "minDate", maxDate: "maxDate", value: "value" }, outputs: { valueChanged: "valueChanged" }, viewQueries: [{ propertyName: "datepickerInput", first: true, predicate: ["datepickerInput"], descendants: true }, { propertyName: "calendarMenu", first: true, predicate: ["calendarMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-datepicker\"\n [ngStyle]=\"{ width: cvtWidth }\"\n [class.focused]=\"isOpened\">\n <cps-input\n #datepickerInput\n [disabled]=\"disabled\"\n [value]=\"stringDate\"\n [label]=\"label\"\n prefixIcon=\"datepicker\"\n [placeholder]=\"placeholder\"\n (prefixIconClicked)=\"onClickCalendarIcon()\"\n [prefixIconClickable]=\"true\"\n (focused)=\"onInputFocus()\"\n (valueChanged)=\"onInputValueChanged($event)\"\n [clearable]=\"clearable\"\n (blurred)=\"onInputBlur()\"\n (cleared)=\"onInputClear()\"\n (enterClicked)=\"onInputEnterClicked()\"\n [width]=\"width\"\n [hint]=\"hint\"\n [hideDetails]=\"hideDetails\"\n [infoTooltip]=\"infoTooltip\"\n [infoTooltipClass]=\"infoTooltipClass\"\n [infoTooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [infoTooltipPersistent]=\"infoTooltipPersistent\"\n [persistentClear]=\"persistentClear\"\n [appearance]=\"appearance\"\n [error]=\"error\"></cps-input>\n <cps-menu\n #calendarMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeCalendarHidden()\"\n (contentClicked)=\"onCalendarContentClick()\"\n [focusOnShow]=\"false\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-datepicker-calendar-menu\">\n <div class=\"cps-datepicker-calendar\">\n <p-datepicker\n [(ngModel)]=\"value\"\n [inline]=\"true\"\n [showIcon]=\"true\"\n [showButtonBar]=\"showTodayButton\"\n (onSelect)=\"onSelectCalendarDate($event)\"\n (onClearClick)=\"onClearCalendarDate()\"\n [showOtherMonths]=\"false\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\" />\n </div>\n </cps-menu>\n</div>\n", styles: [":host{display:flex}:host .cps-datepicker{position:relative;width:100%}:host .cps-datepicker.focused ::ng-deep input{border:1px solid var(--cps-color-calm)!important}:host .cps-datepicker.focused ::ng-deep .cps-input-prefix-icon{color:var(--cps-color-calm)!important}:host .cps-datepicker.focused ::ng-deep .clear-btn cps-icon{opacity:.5!important}.cps-datepicker-calendar{-webkit-user-select:none;-ms-user-select:none;user-select:none}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-panel{font-family:Source Sans Pro,sans-serif;width:auto!important;padding:.5rem;background:#fff;color:var(--cps-color-text-darkest);border:1px solid #ced4da}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header{padding:.5rem;color:var(--cps-color-text-darkest);background:#fff;font-weight:600;margin:0;border-bottom:1px solid #dee2e6;border-top-right-radius:6px;border-top-left-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-prev-button,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-next-button{width:2rem;height:2rem;color:var(--cps-color-calm);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-prev-button:enabled:hover,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-next-button:enabled:hover{color:var(--cps-color-calm);border-color:transparent;background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-prev-button:focus,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-next-button:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title{line-height:2rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-year,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-month{color:var(--cps-color-text-darkest);transition:background-color .2s,color .2s,box-shadow .2s;font-weight:600;padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-year:enabled:hover,.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-month:enabled:hover{color:var(--cps-color-calm)}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-select-month{margin-right:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table{font-size:1rem;margin:.5rem 0}.cps-datepicker-calendar ::ng-deep .p-datepicker table th{padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table th>span{width:2.5rem;height:2.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table td{padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span{width:2.5rem;height:2.5rem;border-radius:50%;transition:box-shadow .2s;border:1px solid transparent}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span.p-disabled{color:var(--cps-color-text-lightest);cursor:default}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker table td>span:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker table td.p-datepicker-today>span{border-color:var(--cps-color-calm);background:unset;color:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker table td.p-datepicker-today>span.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-buttonbar{padding:.5rem 0 0;border-top:1px solid #dee2e6}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-buttonbar .p-button{width:auto;color:var(--cps-color-prepared);border-width:2px;border-style:solid}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker{border-top:1px solid #dee2e6;padding:.5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button{width:2rem;height:2rem;color:var(--cps-color-calm);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button:enabled:hover{color:var(--cps-color-calm);border-color:transparent;background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker button:last-child{margin-top:.2em}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker span{font-size:1.25rem}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-timepicker>div{padding:0 .5rem}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-timeonly .p-timepicker{border-top:0 none}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-month-view{margin:.5rem 0}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-month-view .p-datepicker-month{padding:.5rem;transition:box-shadow .2s;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-month-view .p-datepicker-month.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-year-view{margin:.5rem 0}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-year-view .p-datepicker-year{padding:.5rem;transition:box-shadow .2s;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker .p-datepicker-year-view .p-datepicker-year.p-datepicker-day-selected{color:var(--cps-color-calm);background:var(--cps-color-highlight-selected);font-weight:700}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-multiple-month .p-datepicker-group{border-left:1px solid #dee2e6;padding-right:.5rem;padding-left:.5rem;padding-top:0;padding-bottom:0}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:first-child{padding-left:0;border-left:0 none}.cps-datepicker-calendar ::ng-deep .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child{padding-right:0}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) table td span:not(.p-datepicker-day-selected):not(.p-disabled):hover{background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) table td span:not(.p-datepicker-day-selected):not(.p-disabled):focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-datepicker-month-view .p-datepicker-month:not(.p-disabled):not(.p-datepicker-day-selected):hover{background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-datepicker-month-view .p-datepicker-month:not(.p-disabled):focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-yearpicker .p-datepicker-year:not(.p-disabled):not(.p-datepicker-day-selected):hover{background:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker:not(.p-disabled) .p-yearpicker .p-datepicker-year:not(.p-disabled):focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep p-calendar.p-calendar-clearable .p-inputtext{padding-right:2.5rem}.cps-datepicker-calendar ::ng-deep p-calendar.p-calendar-clearable .p-calendar-clear-icon{color:var(--cps-color-calm);right:.75rem}.cps-datepicker-calendar ::ng-deep p-calendar.p-calendar-clearable.p-calendar-w-btn .p-calendar-clear-icon{color:var(--cps-color-calm);right:3.75rem}.cps-datepicker-calendar ::ng-deep .p-datepicker table th,.cps-datepicker-calendar ::ng-deep .p-datepicker table td{padding:.125rem}.cps-datepicker-calendar ::ng-deep .p-datepicker-other-month{color:var(--cps-color-text-light)}.cps-datepicker-calendar ::ng-deep .p-ripple:focus{outline:0 none;outline-offset:0;box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-ripple{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:1rem;font-family:Source Sans Pro,sans-serif;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button{font-family:Source Sans Pro,sans-serif;background-color:transparent;color:var(--cps-color-calm);border-color:transparent;margin:0;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative;padding:.75rem 1.25rem;font-size:1rem;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;border-radius:6px}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button:focus{box-shadow:unset}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button:hover{background-color:var(--cps-color-highlight-hover)}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button:active{background-color:var(--cps-color-highlight-selected)}.cps-datepicker-calendar ::ng-deep .p-datepicker-buttonbar .p-button .p-button-label{font-weight:700}.cps-datepicker-calendar ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}\n"], dependencies: [{ kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$1.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }] }); }
|
|
4289
4289
|
}
|
|
4290
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4290
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDatepickerComponent, decorators: [{
|
|
4291
4291
|
type: Component,
|
|
4292
4292
|
args: [{ imports: [
|
|
4293
4293
|
CpsInputComponent,
|
|
@@ -4392,10 +4392,10 @@ class CpsDividerComponent {
|
|
|
4392
4392
|
? `${convertSize(this.thickness())} ${this.type()} ${getCSSColor(this.color(), this.document)}`
|
|
4393
4393
|
: '';
|
|
4394
4394
|
}
|
|
4395
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4396
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
4395
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDividerComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4396
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: CpsDividerComponent, isStandalone: true, selector: "cps-divider", inputs: { vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.border-top": "borderTop()", "style.border-right": "borderRight()" }, classAttribute: "cps-divider" }, ngImport: i0, template: '', isInline: true, styles: [".cps-divider{display:block;margin:0}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
4397
4397
|
}
|
|
4398
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4398
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDividerComponent, decorators: [{
|
|
4399
4399
|
type: Component,
|
|
4400
4400
|
args: [{ selector: 'cps-divider', host: {
|
|
4401
4401
|
class: 'cps-divider',
|
|
@@ -4551,8 +4551,8 @@ class CpsExpansionPanelComponent {
|
|
|
4551
4551
|
this._renderer.setStyle(el, 'visibility', 'hidden');
|
|
4552
4552
|
}
|
|
4553
4553
|
}
|
|
4554
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4555
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4554
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsExpansionPanelComponent, deps: [{ token: i1$3.AnimationBuilder }, { token: DOCUMENT }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4555
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsExpansionPanelComponent, isStandalone: true, selector: "cps-expansion-panel", inputs: { headerTitle: "headerTitle", backgroundColor: "backgroundColor", showChevron: "showChevron", isExpanded: "isExpanded", disabled: "disabled", bordered: "bordered", borderRadius: "borderRadius", borderColor: "borderColor", width: "width", prefixIcon: "prefixIcon" }, outputs: { afterCollapse: "afterCollapse", afterExpand: "afterExpand" }, viewQueries: [{ propertyName: "panelContentElem", first: true, predicate: ["panelContentElem"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-expansion-panel\"\n [class.expanded]=\"isExpanded\"\n [ngStyle]=\"{\n 'background-color': backgroundColor,\n 'border-radius': borderRadius,\n width: width,\n border: bordered ? '1px solid ' + borderColor : ''\n }\">\n <div\n class=\"cps-expansion-panel-header\"\n [@panelHeader]=\"\n isExpanded\n ? {\n value: 'visible',\n params: {\n borderStyle: bordered ? '1px solid ' + borderColor : ''\n }\n }\n : 'hidden'\n \"\n [ngClass]=\"{ disabled: disabled }\"\n [style.cursor]=\"disabled ? 'default' : 'pointer'\"\n (click)=\"toggleExpansion()\">\n @if (prefixIcon) {\n <span class=\"cps-expansion-panel-prefix-icon\">\n <cps-icon\n [icon]=\"prefixIcon\"\n size=\"small\"\n [color]=\"disabled ? 'text-mild' : 'text-dark'\">\n </cps-icon>\n </span>\n }\n <div class=\"cps-expansion-panel-title\">{{ headerTitle }}</div>\n @if (showChevron && !disabled) {\n <span class=\"cps-expansion-panel-chevron\">\n <cps-icon icon=\"chevron-down\" size=\"small\" color=\"text-dark\">\n </cps-icon>\n </span>\n }\n </div>\n <div class=\"cps-expansion-panel-content\" #panelContentElem>\n <div class=\"cps-expansion-panel-content-inner\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:flex}:host .cps-expansion-panel{overflow:hidden;font-family:Source Sans Pro,sans-serif;line-height:20px;color:var(--cps-color-text-dark)}:host .cps-expansion-panel-header{border-bottom-color:transparent;display:flex;align-items:center;padding:10px 16px 10px 24px;font-size:16px;justify-content:space-between;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host .cps-expansion-panel-header:hover{background-color:var(--cps-color-highlight-hover)}:host .cps-expansion-panel-header:active{background-color:var(--cps-color-highlight-active)}:host .cps-expansion-panel-header.disabled{pointer-events:none;color:var(--cps-color-text-mild)}:host .cps-expansion-panel-prefix-icon{display:flex;align-items:center;margin-right:12px;margin-bottom:2px}:host .cps-expansion-panel-prefix-icon cps-icon ::ng-deep .cps-icon{width:18px;height:18px}:host .cps-expansion-panel-title{flex:1 0 auto;display:inline-flex;font-weight:600}:host .cps-expansion-panel-chevron{width:16px;display:flex;align-items:center;transition-duration:.2s;margin-left:6px}:host .cps-expansion-panel-content{overflow:auto;color:var(--cps-color-text-dark);font-size:16px}:host .cps-expansion-panel-content-inner{padding:16px 24px}:host .cps-expansion-panel.expanded .cps-expansion-panel-content{max-height:500px}:host .cps-expansion-panel.expanded .cps-expansion-panel-chevron{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }], animations: [
|
|
4556
4556
|
trigger('panelHeader', [
|
|
4557
4557
|
state('hidden', style({
|
|
4558
4558
|
borderBottom: ''
|
|
@@ -4565,7 +4565,7 @@ class CpsExpansionPanelComponent {
|
|
|
4565
4565
|
])
|
|
4566
4566
|
] }); }
|
|
4567
4567
|
}
|
|
4568
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4568
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsExpansionPanelComponent, decorators: [{
|
|
4569
4569
|
type: Component,
|
|
4570
4570
|
args: [{ imports: [CommonModule, CpsIconComponent], selector: 'cps-expansion-panel', animations: [
|
|
4571
4571
|
trigger('panelHeader', [
|
|
@@ -4848,10 +4848,10 @@ class CpsFileUploadComponent {
|
|
|
4848
4848
|
const fileNameLowerCase = file.name.toLowerCase();
|
|
4849
4849
|
return this.extensions.some((ext) => fileNameLowerCase.endsWith(ext));
|
|
4850
4850
|
}
|
|
4851
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4852
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsFileUploadComponent, isStandalone: true, selector: "cps-file-upload", inputs: { extensions: { classPropertyName: "extensions", publicName: "extensions", isSignal: false, isRequired: false, transformFunction: null }, fileDesc: { classPropertyName: "fileDesc", publicName: "fileDesc", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, fileInfo: { classPropertyName: "fileInfo", publicName: "fileInfo", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, fileProcessingCallback: { classPropertyName: "fileProcessingCallback", publicName: "fileProcessingCallback", isSignal: false, isRequired: false, transformFunction: null }, fileNameTooltipPosition: { classPropertyName: "fileNameTooltipPosition", publicName: "fileNameTooltipPosition", isSignal: false, isRequired: false, transformFunction: null }, fileNameTooltipOffset: { classPropertyName: "fileNameTooltipOffset", publicName: "fileNameTooltipOffset", isSignal: false, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileUploaded: "fileUploaded", fileUploadFailed: "fileUploadFailed", fileProcessed: "fileProcessed", fileProcessingFailed: "fileProcessingFailed", fileProcessingCancelled: "fileProcessingCancelled", uploadedFileRemoved: "uploadedFileRemoved" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "dropzoneButton", first: true, predicate: ["dropzoneButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"cps-file-upload\"\n [class.disabled]=\"disabled\"\n [style.width]=\"cvtWidth()\">\n <div class=\"cps-sr-only\" aria-live=\"polite\" aria-atomic=\"true\">\n @if (errorMessage) {\n {{ errorMessage }}\n } @else if (uploadedFile) {\n @if (isProcessingFile) {\n File is being processed\n } @else {\n File successfully uploaded\n }\n }\n </div>\n <button\n #dropzoneButton\n type=\"button\"\n class=\"cps-file-upload-dropzone\"\n [ngClass]=\"{\n 'dragged-over': isDragoverFile,\n 'with-bottom-section': uploadedFile?.name || errorMessage\n }\"\n [disabled]=\"disabled\"\n [class.processing]=\"isProcessingFile\"\n (click)=\"openFilePicker()\"\n (dragend)=\"onDragEnd()\"\n (dragenter)=\"onDragEnter()\"\n (dragleave)=\"onDragLeave()\"\n (dragover)=\"onDragOver($event)\"\n (drop)=\"onDrop($event)\"\n [attr.aria-label]=\"ariaLabel\">\n <input\n #fileInput\n (change)=\"tryUploadFile($event)\"\n type=\"file\"\n [accept]=\"extensionsString\"\n hidden />\n <cps-icon\n icon=\"export\"\n size=\"large\"\n [color]=\"disabled ? 'text-mild' : 'text-darkest'\"></cps-icon>\n <div class=\"cps-file-upload-dropzone-title\">\n Drag&Drop or choose a file to upload\n </div>\n @if (fileDesc || extensionsStringAsterisks) {\n <span class=\"cps-file-upload-dropzone-file-desc\"\n >{{ fileDesc }}\n {{\n extensionsStringAsterisks ? '(' + extensionsStringAsterisks + ')' : ''\n }}</span\n >\n }\n @if (fileInfo) {\n <div class=\"cps-file-upload-dropzone-content\">\n <cps-icon\n [color]=\"disabled ? 'text-mild' : 'info'\"\n icon=\"info-circle\"\n size=\"xsmall\"></cps-icon>\n {{ fileInfo }}\n </div>\n }\n @if (isProcessingFile && uploadedFile) {\n <cps-progress-linear\n height=\"0.1875rem\"\n radius=\"0.25rem\"\n opacity=\"0.3\"\n [color]=\"disabled ? 'text-mild' : 'calm'\"\n class=\"cps-file-upload-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </button>\n @if (errorMessage) {\n <div class=\"cps-file-upload-error\">\n <cps-icon\n icon=\"toast-error\"\n [color]=\"disabled ? 'text-light' : 'error'\"></cps-icon>\n <span>{{ errorMessage }}</span>\n </div>\n }\n @if (uploadedFile) {\n <div class=\"cps-file-upload-uploaded-files\">\n <div class=\"cps-file-upload-uploaded-file\">\n <div class=\"cps-file-upload-uploaded-file-title\">\n <cps-icon\n class=\"cps-file-upload-uploaded-file-status-icon\"\n [icon]=\"isProcessingFile ? 'pending' : 'toast-success'\"\n [color]=\"\n disabled ? 'text-light' : isProcessingFile ? 'warn' : 'success'\n \">\n </cps-icon>\n <div\n class=\"cps-file-upload-uploaded-file-name\"\n cpsTooltip=\"{{ uploadedFile.name }}\"\n [tooltipPosition]=\"fileNameTooltipPosition\"\n [tooltipOffset]=\"fileNameTooltipOffset\"\n tooltipOpenOn=\"hover\">\n {{ uploadedFile.name }}\n </div>\n </div>\n @if (!disabled) {\n @if (isProcessingFile) {\n <cps-icon\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"'Cancel file processing'\"\n class=\"cps-file-upload-uploaded-file-cancel-process-icon\"\n icon=\"close-x\"\n color=\"error\"\n (click)=\"onCancelFileProcessing($event)\"\n (keydown.enter)=\"onCancelFileProcessing($event)\"\n (keydown.space)=\"onCancelFileProcessing($event)\">\n </cps-icon>\n } @else {\n <cps-icon\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"'Remove uploaded file'\"\n class=\"cps-file-upload-uploaded-file-remove-icon\"\n icon=\"remove\"\n color=\"error\"\n (click)=\"onRemoveUploadedFile($event)\"\n (keydown.enter)=\"onRemoveUploadedFile($event)\"\n (keydown.space)=\"onRemoveUploadedFile($event)\">\n </cps-icon>\n }\n }\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-file-upload{min-width:0;position:relative}:host .cps-file-upload .cps-file-upload-dropzone{background:transparent;font-family:Source Sans Pro,sans-serif;min-height:1.25rem;padding:2rem;text-align:center;border:.125rem dashed var(--cps-color-calm);position:relative;border-radius:1rem;display:block;width:100%;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none}:host .cps-file-upload .cps-file-upload-dropzone:hover{background-color:var(--cps-color-highlight-hover)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible{outline:none;position:relative}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:after{content:\"\";position:absolute;border-radius:inherit}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:after{inset:-.375rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible.suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible.suppress-focus-visible:after{display:none}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing){outline:none;position:relative}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):after{content:\"\";position:absolute;border-radius:inherit}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):after{inset:-.375rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing).suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing).suppress-focus-visible:after{display:none}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing){background-color:var(--cps-color-highlight-hover)}:host .cps-file-upload .cps-file-upload-dropzone:active:not(.processing){background-color:var(--cps-color-highlight-selected)}:host .cps-file-upload .cps-file-upload-dropzone.processing{pointer-events:none;cursor:default}:host .cps-file-upload .cps-file-upload-dropzone.dragged-over{background-color:var(--cps-color-highlight-selected)}:host .cps-file-upload .cps-file-upload-dropzone.with-bottom-section{border-bottom-right-radius:0;border-bottom-left-radius:0;border-bottom:.0625rem dashed var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-dropzone input{cursor:pointer;opacity:0;position:absolute;inset:0;width:100%;height:100%}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-dropzone-title{font-size:1rem;margin:.5rem 0;color:var(--cps-color-calm);font-weight:600}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-dropzone-file-desc{font-size:1.125rem;color:var(--cps-color-text-dark)}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-dropzone-content{margin-top:1rem;font-size:1rem;color:var(--cps-color-text-dark)}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-progress-bar{position:absolute;bottom:-.125rem;left:0}:host .cps-file-upload .cps-file-upload-uploaded-files{border-bottom:.125rem dashed var(--cps-color-calm);border-left:.125rem dashed var(--cps-color-calm);border-right:.125rem dashed var(--cps-color-calm);border-bottom-right-radius:1rem;border-bottom-left-radius:1rem;background-color:var(--cps-color-highlight-hover)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file{cursor:default;display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-title{display:flex;align-items:center;flex:1;min-width:0}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-title .cps-file-upload-uploaded-file-name{color:var(--cps-color-text-darkest);font-size:1.25rem;margin:0 .5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(100% - 3.75rem)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon{cursor:pointer;flex-shrink:0;margin-left:.5rem}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus{outline:none}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible{outline:none;position:relative}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:after,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:after,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible.suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible.suppress-focus-visible:after,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible.suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible.suppress-focus-visible:after{display:none}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:hover ::ng-deep .cps-icon,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:hover ::ng-deep .cps-icon{color:var(--cps-color-error-darken1)!important}:host .cps-file-upload .cps-file-upload-error{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;overflow:hidden;border-bottom:.125rem dashed var(--cps-color-calm);border-left:.125rem dashed var(--cps-color-calm);border-right:.125rem dashed var(--cps-color-calm);border-bottom-right-radius:1rem;border-bottom-left-radius:1rem;background-color:var(--cps-color-highlight-hover);color:var(--cps-color-error);font-size:1.25rem}:host .cps-file-upload .cps-file-upload-error span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .cps-file-upload.disabled{pointer-events:none}:host .cps-file-upload.disabled .cps-file-upload-dropzone{border-color:var(--cps-color-line-darkest);cursor:not-allowed}:host .cps-file-upload.disabled .cps-file-upload-dropzone .cps-file-upload-dropzone-title{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-dropzone .cps-file-upload-dropzone-file-desc{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-dropzone .cps-file-upload-dropzone-content{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-uploaded-files{border-color:var(--cps-color-line-darkest);background-color:var(--cps-color-bg-disabled)}:host .cps-file-upload.disabled .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-title .cps-file-upload-uploaded-file-name{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-error{border-color:var(--cps-color-line-darkest);background-color:var(--cps-color-bg-disabled);color:var(--cps-color-text-mild)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }] }); }
|
|
4851
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4852
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsFileUploadComponent, isStandalone: true, selector: "cps-file-upload", inputs: { extensions: { classPropertyName: "extensions", publicName: "extensions", isSignal: false, isRequired: false, transformFunction: null }, fileDesc: { classPropertyName: "fileDesc", publicName: "fileDesc", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, fileInfo: { classPropertyName: "fileInfo", publicName: "fileInfo", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, fileProcessingCallback: { classPropertyName: "fileProcessingCallback", publicName: "fileProcessingCallback", isSignal: false, isRequired: false, transformFunction: null }, fileNameTooltipPosition: { classPropertyName: "fileNameTooltipPosition", publicName: "fileNameTooltipPosition", isSignal: false, isRequired: false, transformFunction: null }, fileNameTooltipOffset: { classPropertyName: "fileNameTooltipOffset", publicName: "fileNameTooltipOffset", isSignal: false, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileUploaded: "fileUploaded", fileUploadFailed: "fileUploadFailed", fileProcessed: "fileProcessed", fileProcessingFailed: "fileProcessingFailed", fileProcessingCancelled: "fileProcessingCancelled", uploadedFileRemoved: "uploadedFileRemoved" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "dropzoneButton", first: true, predicate: ["dropzoneButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"cps-file-upload\"\n [class.disabled]=\"disabled\"\n [style.width]=\"cvtWidth()\">\n <div class=\"cps-sr-only\" aria-live=\"polite\" aria-atomic=\"true\">\n @if (errorMessage) {\n {{ errorMessage }}\n } @else if (uploadedFile) {\n @if (isProcessingFile) {\n File is being processed\n } @else {\n File successfully uploaded\n }\n }\n </div>\n <button\n #dropzoneButton\n type=\"button\"\n class=\"cps-file-upload-dropzone\"\n [ngClass]=\"{\n 'dragged-over': isDragoverFile,\n 'with-bottom-section': uploadedFile?.name || errorMessage\n }\"\n [disabled]=\"disabled\"\n [class.processing]=\"isProcessingFile\"\n (click)=\"openFilePicker()\"\n (dragend)=\"onDragEnd()\"\n (dragenter)=\"onDragEnter()\"\n (dragleave)=\"onDragLeave()\"\n (dragover)=\"onDragOver($event)\"\n (drop)=\"onDrop($event)\"\n [attr.aria-label]=\"ariaLabel\">\n <input\n #fileInput\n (change)=\"tryUploadFile($event)\"\n type=\"file\"\n [accept]=\"extensionsString\"\n hidden />\n <cps-icon\n icon=\"export\"\n size=\"large\"\n [color]=\"disabled ? 'text-mild' : 'text-darkest'\"></cps-icon>\n <div class=\"cps-file-upload-dropzone-title\">\n Drag&Drop or choose a file to upload\n </div>\n @if (fileDesc || extensionsStringAsterisks) {\n <span class=\"cps-file-upload-dropzone-file-desc\"\n >{{ fileDesc }}\n {{\n extensionsStringAsterisks ? '(' + extensionsStringAsterisks + ')' : ''\n }}</span\n >\n }\n @if (fileInfo) {\n <div class=\"cps-file-upload-dropzone-content\">\n <cps-icon\n [color]=\"disabled ? 'text-mild' : 'info'\"\n icon=\"info-circle\"\n size=\"xsmall\"></cps-icon>\n {{ fileInfo }}\n </div>\n }\n @if (isProcessingFile && uploadedFile) {\n <cps-progress-linear\n height=\"0.1875rem\"\n radius=\"0.25rem\"\n opacity=\"0.3\"\n [color]=\"disabled ? 'text-mild' : 'calm'\"\n class=\"cps-file-upload-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </button>\n @if (errorMessage) {\n <div class=\"cps-file-upload-error\">\n <cps-icon\n icon=\"toast-error\"\n [color]=\"disabled ? 'text-light' : 'error'\"></cps-icon>\n <span>{{ errorMessage }}</span>\n </div>\n }\n @if (uploadedFile) {\n <div class=\"cps-file-upload-uploaded-files\">\n <div class=\"cps-file-upload-uploaded-file\">\n <div class=\"cps-file-upload-uploaded-file-title\">\n <cps-icon\n class=\"cps-file-upload-uploaded-file-status-icon\"\n [icon]=\"isProcessingFile ? 'pending' : 'toast-success'\"\n [color]=\"\n disabled ? 'text-light' : isProcessingFile ? 'warn' : 'success'\n \">\n </cps-icon>\n <div\n class=\"cps-file-upload-uploaded-file-name\"\n cpsTooltip=\"{{ uploadedFile.name }}\"\n [tooltipPosition]=\"fileNameTooltipPosition\"\n [tooltipOffset]=\"fileNameTooltipOffset\"\n tooltipOpenOn=\"hover\">\n {{ uploadedFile.name }}\n </div>\n </div>\n @if (!disabled) {\n @if (isProcessingFile) {\n <cps-icon\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"'Cancel file processing'\"\n class=\"cps-file-upload-uploaded-file-cancel-process-icon\"\n icon=\"close-x\"\n color=\"error\"\n (click)=\"onCancelFileProcessing($event)\"\n (keydown.enter)=\"onCancelFileProcessing($event)\"\n (keydown.space)=\"onCancelFileProcessing($event)\">\n </cps-icon>\n } @else {\n <cps-icon\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"'Remove uploaded file'\"\n class=\"cps-file-upload-uploaded-file-remove-icon\"\n icon=\"remove\"\n color=\"error\"\n (click)=\"onRemoveUploadedFile($event)\"\n (keydown.enter)=\"onRemoveUploadedFile($event)\"\n (keydown.space)=\"onRemoveUploadedFile($event)\">\n </cps-icon>\n }\n }\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-file-upload{min-width:0;position:relative}:host .cps-file-upload .cps-file-upload-dropzone{background:transparent;font-family:Source Sans Pro,sans-serif;min-height:1.25rem;padding:2rem;text-align:center;border:.125rem dashed var(--cps-color-calm);position:relative;border-radius:1rem;display:block;width:100%;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none}:host .cps-file-upload .cps-file-upload-dropzone:hover{background-color:var(--cps-color-highlight-hover)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible{outline:none;position:relative}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:after{content:\"\";position:absolute;border-radius:inherit}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:after{inset:-.375rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible.suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible.suppress-focus-visible:after{display:none}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing){outline:none;position:relative}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):after{content:\"\";position:absolute;border-radius:inherit}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing):after{inset:-.375rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing).suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing).suppress-focus-visible:after{display:none}:host .cps-file-upload .cps-file-upload-dropzone:focus-visible:not(.processing){background-color:var(--cps-color-highlight-hover)}:host .cps-file-upload .cps-file-upload-dropzone:active:not(.processing){background-color:var(--cps-color-highlight-selected)}:host .cps-file-upload .cps-file-upload-dropzone.processing{pointer-events:none;cursor:default}:host .cps-file-upload .cps-file-upload-dropzone.dragged-over{background-color:var(--cps-color-highlight-selected)}:host .cps-file-upload .cps-file-upload-dropzone.with-bottom-section{border-bottom-right-radius:0;border-bottom-left-radius:0;border-bottom:.0625rem dashed var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-dropzone input{cursor:pointer;opacity:0;position:absolute;inset:0;width:100%;height:100%}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-dropzone-title{font-size:1rem;margin:.5rem 0;color:var(--cps-color-calm);font-weight:600}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-dropzone-file-desc{font-size:1.125rem;color:var(--cps-color-text-dark)}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-dropzone-content{margin-top:1rem;font-size:1rem;color:var(--cps-color-text-dark)}:host .cps-file-upload .cps-file-upload-dropzone .cps-file-upload-progress-bar{position:absolute;bottom:-.125rem;left:0}:host .cps-file-upload .cps-file-upload-uploaded-files{border-bottom:.125rem dashed var(--cps-color-calm);border-left:.125rem dashed var(--cps-color-calm);border-right:.125rem dashed var(--cps-color-calm);border-bottom-right-radius:1rem;border-bottom-left-radius:1rem;background-color:var(--cps-color-highlight-hover)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file{cursor:default;display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-title{display:flex;align-items:center;flex:1;min-width:0}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-title .cps-file-upload-uploaded-file-name{color:var(--cps-color-text-darkest);font-size:1.25rem;margin:0 .5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(100% - 3.75rem)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon{cursor:pointer;flex-shrink:0;margin-left:.5rem}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus{outline:none}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible{outline:none;position:relative}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:after,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:after{content:\"\";position:absolute;border-radius:.375rem}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible:after,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible.suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:focus-visible.suppress-focus-visible:after,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible.suppress-focus-visible:before,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:focus-visible.suppress-focus-visible:after{display:none}:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-remove-icon:hover ::ng-deep .cps-icon,:host .cps-file-upload .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-cancel-process-icon:hover ::ng-deep .cps-icon{color:var(--cps-color-error-darken1)!important}:host .cps-file-upload .cps-file-upload-error{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;overflow:hidden;border-bottom:.125rem dashed var(--cps-color-calm);border-left:.125rem dashed var(--cps-color-calm);border-right:.125rem dashed var(--cps-color-calm);border-bottom-right-radius:1rem;border-bottom-left-radius:1rem;background-color:var(--cps-color-highlight-hover);color:var(--cps-color-error);font-size:1.25rem}:host .cps-file-upload .cps-file-upload-error span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .cps-file-upload.disabled{pointer-events:none}:host .cps-file-upload.disabled .cps-file-upload-dropzone{border-color:var(--cps-color-line-darkest);cursor:not-allowed}:host .cps-file-upload.disabled .cps-file-upload-dropzone .cps-file-upload-dropzone-title{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-dropzone .cps-file-upload-dropzone-file-desc{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-dropzone .cps-file-upload-dropzone-content{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-uploaded-files{border-color:var(--cps-color-line-darkest);background-color:var(--cps-color-bg-disabled)}:host .cps-file-upload.disabled .cps-file-upload-uploaded-files .cps-file-upload-uploaded-file .cps-file-upload-uploaded-file-title .cps-file-upload-uploaded-file-name{color:var(--cps-color-text-mild)}:host .cps-file-upload.disabled .cps-file-upload-error{border-color:var(--cps-color-line-darkest);background-color:var(--cps-color-bg-disabled);color:var(--cps-color-text-mild)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }] }); }
|
|
4853
4853
|
}
|
|
4854
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4854
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsFileUploadComponent, decorators: [{
|
|
4855
4855
|
type: Component,
|
|
4856
4856
|
args: [{ selector: 'cps-file-upload', imports: [
|
|
4857
4857
|
CommonModule,
|
|
@@ -4930,10 +4930,10 @@ class CpsLoaderComponent {
|
|
|
4930
4930
|
this.backgroundColor = `rgba(0, 0, 0, ${this.opacity})`;
|
|
4931
4931
|
this.labelColor = getCSSColor(this.labelColor, this.document);
|
|
4932
4932
|
}
|
|
4933
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4934
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
4933
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsLoaderComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4934
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsLoaderComponent, isStandalone: true, selector: "cps-loader", inputs: { fullScreen: "fullScreen", opacity: "opacity", labelColor: "labelColor", showLabel: "showLabel" }, ngImport: i0, template: "<div\n class=\"cps-loader-overlay\"\n [ngStyle]=\"{\n 'background-color': backgroundColor,\n position: fullScreen ? 'fixed' : 'relative'\n }\">\n <div class=\"cps-loader-overlay-content\">\n @if (showLabel) {\n <label class=\"cps-loader-overlay-content-text\" [style.color]=\"labelColor\"\n >Loading...\n </label>\n }\n <div class=\"cps-loader-overlay-content-circles\">\n <div class=\"cps-loader-overlay-content-circles-circle cps-sp1\">\n <div class=\"cps-loader-overlay-content-circles-circle cps-sp2\">\n <div class=\"cps-loader-overlay-content-circles-circle cps-sp3\"></div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [":host{display:contents}:host .cps-loader-overlay{width:100%;height:100%;inset:0;z-index:2000}:host .cps-loader-overlay-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}:host .cps-loader-overlay-content-text{display:block;text-align:center;font-size:20px;font-family:Source Sans Pro,sans-serif;font-weight:600;padding-bottom:15px;animation:cps-loader-text-animation 4s linear infinite;-webkit-user-select:none;-ms-user-select:none;user-select:none}:host .cps-loader-overlay-content-circles{height:85px;width:90px}:host .cps-loader-overlay-content-circles-circle{border-left:5px solid;border-top-left-radius:100%;border-top:5px solid;margin:5px;animation-name:cps-loader-circles-animation;animation-duration:1s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite;animation-direction:normal;animation-fill-mode:forwards}:host .cps-loader-overlay-content-circles .cps-sp1{border-left-color:var(--cps-accent-primary);border-top-color:var(--cps-accent-primary);width:40px;height:40px}:host .cps-loader-overlay-content-circles .cps-sp2{border-left-color:var(--cps-accent-secondary);border-top-color:var(--cps-accent-secondary);width:30px;height:30px}:host .cps-loader-overlay-content-circles .cps-sp3{width:20px;height:20px;border-left-color:var(--cps-color-energy);border-top-color:var(--cps-color-energy)}@keyframes cps-loader-text-animation{0%,to{filter:opacity(1)}50%{filter:opacity(.4)}}@keyframes cps-loader-circles-animation{0%{transform:rotate(0);transform-origin:right bottom}25%{transform:rotate(90deg);transform-origin:right bottom}50%{transform:rotate(180deg);transform-origin:right bottom}75%{transform:rotate(270deg);transform-origin:right bottom}to{transform:rotate(360deg);transform-origin:right bottom}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
4935
4935
|
}
|
|
4936
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4936
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsLoaderComponent, decorators: [{
|
|
4937
4937
|
type: Component,
|
|
4938
4938
|
args: [{ imports: [CommonModule], selector: 'cps-loader', template: "<div\n class=\"cps-loader-overlay\"\n [ngStyle]=\"{\n 'background-color': backgroundColor,\n position: fullScreen ? 'fixed' : 'relative'\n }\">\n <div class=\"cps-loader-overlay-content\">\n @if (showLabel) {\n <label class=\"cps-loader-overlay-content-text\" [style.color]=\"labelColor\"\n >Loading...\n </label>\n }\n <div class=\"cps-loader-overlay-content-circles\">\n <div class=\"cps-loader-overlay-content-circles-circle cps-sp1\">\n <div class=\"cps-loader-overlay-content-circles-circle cps-sp2\">\n <div class=\"cps-loader-overlay-content-circles-circle cps-sp3\"></div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [":host{display:contents}:host .cps-loader-overlay{width:100%;height:100%;inset:0;z-index:2000}:host .cps-loader-overlay-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}:host .cps-loader-overlay-content-text{display:block;text-align:center;font-size:20px;font-family:Source Sans Pro,sans-serif;font-weight:600;padding-bottom:15px;animation:cps-loader-text-animation 4s linear infinite;-webkit-user-select:none;-ms-user-select:none;user-select:none}:host .cps-loader-overlay-content-circles{height:85px;width:90px}:host .cps-loader-overlay-content-circles-circle{border-left:5px solid;border-top-left-radius:100%;border-top:5px solid;margin:5px;animation-name:cps-loader-circles-animation;animation-duration:1s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite;animation-direction:normal;animation-fill-mode:forwards}:host .cps-loader-overlay-content-circles .cps-sp1{border-left-color:var(--cps-accent-primary);border-top-color:var(--cps-accent-primary);width:40px;height:40px}:host .cps-loader-overlay-content-circles .cps-sp2{border-left-color:var(--cps-accent-secondary);border-top-color:var(--cps-accent-secondary);width:30px;height:30px}:host .cps-loader-overlay-content-circles .cps-sp3{width:20px;height:20px;border-left-color:var(--cps-color-energy);border-top-color:var(--cps-color-energy)}@keyframes cps-loader-text-animation{0%,to{filter:opacity(1)}50%{filter:opacity(.4)}}@keyframes cps-loader-circles-animation{0%{transform:rotate(0);transform-origin:right bottom}25%{transform:rotate(90deg);transform-origin:right bottom}50%{transform:rotate(180deg);transform-origin:right bottom}75%{transform:rotate(270deg);transform-origin:right bottom}to{transform:rotate(360deg);transform-origin:right bottom}}\n"] }]
|
|
4939
4939
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -4963,10 +4963,10 @@ class CombineLabelsPipe {
|
|
|
4963
4963
|
})
|
|
4964
4964
|
.join(', ');
|
|
4965
4965
|
}
|
|
4966
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
4967
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
4966
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CombineLabelsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
4967
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.13", ngImport: i0, type: CombineLabelsPipe, isStandalone: true, name: "combineLabels" }); }
|
|
4968
4968
|
}
|
|
4969
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
4969
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CombineLabelsPipe, decorators: [{
|
|
4970
4970
|
type: Pipe,
|
|
4971
4971
|
args: [{ standalone: true, name: 'combineLabels' }]
|
|
4972
4972
|
}] });
|
|
@@ -5490,10 +5490,10 @@ class CpsSelectComponent {
|
|
|
5490
5490
|
(typeof this.value === 'string' && this.value.trim() === '') ||
|
|
5491
5491
|
Number.isNaN(this.value));
|
|
5492
5492
|
}
|
|
5493
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
5494
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsSelectComponent, isStandalone: true, selector: "cps-select", inputs: { label: "label", placeholder: "placeholder", hint: "hint", returnObject: "returnObject", multiple: "multiple", disabled: "disabled", width: "width", selectAll: "selectAll", chips: "chips", closableChips: "closableChips", clearable: "clearable", openOnClear: "openOnClear", options: "options", keepInitialOrder: "keepInitialOrder", optionLabel: "optionLabel", optionValue: "optionValue", optionInfo: "optionInfo", optionIcon: "optionIcon", optionIconColor: "optionIconColor", hideDetails: "hideDetails", persistentClear: "persistentClear", prefixIcon: "prefixIcon", prefixIconSize: "prefixIconSize", loading: "loading", virtualScroll: "virtualScroll", numToleratedItems: "numToleratedItems", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", optionsClass: "optionsClass", appearance: "appearance", showChevron: "showChevron", _value: ["value", "_value"] }, outputs: { valueChanged: "valueChanged", focused: "focused", blurred: "blurred" }, providers: [LabelByValuePipe, CombineLabelsPipe, CheckOptionSelectedPipe], viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["selectBox"], descendants: true }, { propertyName: "selectContainer", first: true, predicate: ["selectContainer"], descendants: true }, { propertyName: "virtualList", first: true, predicate: ["virtualList"], descendants: true }, { propertyName: "optionsMenu", first: true, predicate: ["optionsMenu"], descendants: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }], ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-select\"\n tabindex=\"0\"\n [ngClass]=\"{ disabled: disabled, error: error, active: isOpened }\"\n #selectContainer\n (keydown)=\"onKeyDown($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\">\n @if (label) {\n <div class=\"cps-select-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-select-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n class=\"cps-select-container\"\n [class.focused]=\"isOpened\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div class=\"cps-select-box\" #selectBox (click)=\"onBoxClick()\">\n <div class=\"cps-select-box-left\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? '#9a9595' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if ((!multiple && isEmptyValue()) || (value?.length < 1 && multiple)) {\n <div class=\"cps-select-box-placeholder\">\n {{ placeholder }}\n </div>\n }\n @if (\n (!multiple && !isEmptyValue()) || (value?.length > 0 && multiple)\n ) {\n <div class=\"cps-select-box-items\">\n @if (!multiple) {\n <span class=\"single-item\">\n {{\n returnObject\n ? value[optionLabel]\n : (value\n | labelByValue: options : optionValue : optionLabel)\n }}</span\n >\n }\n @if (multiple && !chips) {\n <div class=\"text-group\">\n <span class=\"text-group-item\">\n {{\n value\n | combineLabels\n : options\n : optionValue\n : optionLabel\n : returnObject\n }}\n </span>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"chips-group\">\n @for (val of value; track val) {\n <cps-chip\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"select(val, true)\"\n [label]=\"\n returnObject\n ? val[optionLabel]\n : (val\n | labelByValue: options : optionValue : optionLabel)\n \">\n </cps-chip>\n }\n </div>\n }\n </div>\n }\n </div>\n <span class=\"cps-select-box-icons\">\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear ||\n (!persistentClear &&\n ((multiple && value?.length) || (!multiple && !isEmptyValue())))\n ? 'visible'\n : 'hidden'\n \"\n class=\"cps-select-box-clear-icon\">\n <cps-icon\n icon=\"delete\"\n size=\"small\"\n (click)=\"clear($event)\"></cps-icon>\n </span>\n }\n @if (showChevron) {\n <span class=\"cps-select-box-chevron\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden()\"\n hideTransitionOptions=\"0s linear\"\n [containerClass]=\"'cps-select-options-menu ' + optionsClass\">\n <div\n #optionsList\n class=\"cps-select-options\"\n [ngStyle]=\"{\n width: selectBoxWidth + 'px'\n }\">\n @if (!virtualScroll) {\n @if (multiple && selectAll && options.length > 1) {\n <div\n class=\"cps-select-options-option select-all-option\"\n [class.allselected]=\"value?.length === options.length\"\n (click)=\"toggleAll()\">\n <span class=\"cps-select-options-option-left\">\n @if (multiple) {\n <span class=\"cps-select-options-option-check\"> </span>\n }\n <span class=\"cps-select-options-option-label\">Select all</span>\n </span>\n </div>\n }\n @for (item of options; track item) {\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n }\n }\n @if (virtualScroll) {\n <p-virtualscroller\n #virtualList\n [items]=\"options\"\n [delay]=\"0\"\n [scrollHeight]=\"virtualListHeight + 'px'\"\n [options]=\"{ numToleratedItems: numToleratedItems }\"\n [itemSize]=\"virtualScrollItemSize\">\n <ng-template pTemplate=\"item\" let-item>\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </ng-template>\n </p-virtualscroller>\n }\n </div>\n </cps-menu>\n\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"select-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-select-hint\">{{ hint }}</div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-select-error\">{{ error }}</div>\n }\n</div>\n\n<ng-template #itemTemplate let-item=\"item\">\n <div\n class=\"cps-select-options-option\"\n (click)=\"onOptionClick(item)\"\n [class.selected]=\"\n item | checkOptionSelected: value : multiple : returnObject : optionValue\n \">\n <span class=\"cps-select-options-option-left\">\n @if (multiple) {\n <span class=\"cps-select-options-option-check\"> </span>\n }\n <span\n class=\"cps-select-options-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ item[optionLabel] }}</span\n >\n </span>\n\n <span\n class=\"cps-select-options-option-right\"\n [class.virtual-row]=\"virtualScroll\">\n {{ item[optionInfo] }}\n @if (item[optionIcon]) {\n <cps-icon\n [icon]=\"item[optionIcon]\"\n [color]=\"item[optionIconColor] || 'text-light'\"\n class=\"cps-select-options-option-right-icon\">\n </cps-icon>\n }\n </span>\n </div>\n</ng-template>\n", styles: [":host{display:flex}:host .cps-select{position:relative;width:100%;outline:none;font-family:Source Sans Pro,sans-serif;font-weight:400;display:grid}:host .cps-select .cps-select-container{position:relative}:host .cps-select .cps-select-container .select-progress-bar{position:absolute;bottom:1px;padding:0 1px}:host .cps-select .cps-select-container.borderless .cps-select-box,:host .cps-select .cps-select-container.underlined .cps-select-box{line-height:1;border:none!important;border-radius:0}:host .cps-select .cps-select-container.underlined .cps-select-box{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-select.active .cps-select-box{border:1px solid var(--cps-color-calm)}:host .cps-select.active .cps-select-box .cps-select-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-select.active .cps-select-box .cps-select-box-chevron{top:22px;transform:rotate(180deg)}:host .cps-select .cps-select-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-select .cps-select-label .cps-select-label-info-circle{margin-left:8px;pointer-events:all}:host .cps-select .persistent-clear .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon,:host .cps-select .cps-select-container.focused .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon,:host .cps-select .cps-select-container:hover .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon{opacity:.5}:host .cps-select .cps-select-box{overflow:hidden;justify-content:space-between;min-height:38px;width:100%;cursor:pointer;background:#fff;font-size:1rem;outline:none;padding:0 12px;border-radius:4px;align-items:center;display:flex;border:1px solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-select .cps-select-box-placeholder{color:var(--cps-color-text-mild);font-style:italic}:host .cps-select .cps-select-box-items{margin-top:3px;margin-bottom:3px}:host .cps-select .cps-select-box-items .text-group,:host .cps-select .cps-select-box-items .single-item{color:var(--cps-color-text-dark);padding-top:3px;padding-bottom:3px}:host .cps-select .cps-select-box-items .chips-group cps-chip{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-select .cps-select-box-items .text-group-item{line-height:1.5}:host .cps-select .cps-select-box .cps-select-box-left{display:inline-flex;align-items:center}:host .cps-select .cps-select-box .cps-select-box-left .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-select .cps-select-box:hover{border:1px solid var(--cps-color-calm)}:host .cps-select .cps-select-box:hover .cps-select-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-select .cps-select-box .cps-select-box-icons{display:flex}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon{display:flex;color:var(--cps-state-error);margin-left:8px}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon:hover{opacity:1!important}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-chevron{display:flex;margin-left:8px;transition-duration:.2s}:host .cps-select .cps-select-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-select .cps-select-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-select.disabled{pointer-events:none}:host .cps-select.disabled .cps-select-box{background:var(--cps-color-bg-disabled)}:host .cps-select.disabled .cps-select-box-items{color:var(--cps-color-text-light)}:host .cps-select.disabled .cps-select-box-items .text-group,:host .cps-select.disabled .cps-select-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-select.disabled .cps-select-label{color:var(--cps-color-text-mild)}:host .cps-select.error .cps-select-box{border-color:var(--cps-state-error)!important;background:#fef3f2!important}.cps-select-options{background:#fff;overflow-x:hidden;max-height:242px;overflow-y:auto}.cps-select-options .cps-select-options-option{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-select-options .cps-select-options-option:hover{background:var(--cps-color-highlight-hover)}.cps-select-options .cps-select-options-option-label{color:var(--cps-color-text-dark)}.cps-select-options .cps-select-options-option-left{display:flex;align-items:center;margin-right:8px}.cps-select-options .cps-select-options-option-right{color:var(--cps-color-text-light);display:flex;align-items:center}.cps-select-options .cps-select-options-option-right-icon{margin-left:8px}.cps-select-options .cps-select-options-option-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-select-options .cps-select-options-option-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-select-options .cps-select-options-option.selected,.cps-select-options .cps-select-options-option.allselected{font-weight:600}.cps-select-options .cps-select-options-option.selected .cps-select-options-option-label,.cps-select-options .cps-select-options-option.allselected .cps-select-options-option-label{color:var(--cps-color-calm)}.cps-select-options .cps-select-options-option.selected .cps-select-options-option-check,.cps-select-options .cps-select-options-option.allselected .cps-select-options-option-check{opacity:1}.cps-select-options .cps-select-options-option.selected{background:var(--cps-color-highlight-selected)}.cps-select-options .cps-select-options-option.highlighten{background:var(--cps-color-highlight-active)}.cps-select-options .cps-select-options-option.selected.highlighten{background:var(--cps-color-highlight-selected-dark)}.cps-select-options .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}.cps-select-options ::ng-deep .p-virtualscroller-list.p-scroller{overflow-anchor:none}.cps-select-options .virtual-row{white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "ngmodule", type: ScrollerModule }, { kind: "component", type: i4$1.Scroller, selector: "p-scroller, p-virtualscroller, p-virtual-scroller, p-virtualScroller", inputs: ["hostName", "id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "pipe", type: LabelByValuePipe, name: "labelByValue" }, { kind: "pipe", type: CombineLabelsPipe, name: "combineLabels" }, { kind: "pipe", type: CheckOptionSelectedPipe, name: "checkOptionSelected" }] }); }
|
|
5493
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSelectComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5494
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsSelectComponent, isStandalone: true, selector: "cps-select", inputs: { label: "label", placeholder: "placeholder", hint: "hint", returnObject: "returnObject", multiple: "multiple", disabled: "disabled", width: "width", selectAll: "selectAll", chips: "chips", closableChips: "closableChips", clearable: "clearable", openOnClear: "openOnClear", options: "options", keepInitialOrder: "keepInitialOrder", optionLabel: "optionLabel", optionValue: "optionValue", optionInfo: "optionInfo", optionIcon: "optionIcon", optionIconColor: "optionIconColor", hideDetails: "hideDetails", persistentClear: "persistentClear", prefixIcon: "prefixIcon", prefixIconSize: "prefixIconSize", loading: "loading", virtualScroll: "virtualScroll", numToleratedItems: "numToleratedItems", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", optionsClass: "optionsClass", appearance: "appearance", showChevron: "showChevron", _value: ["value", "_value"] }, outputs: { valueChanged: "valueChanged", focused: "focused", blurred: "blurred" }, providers: [LabelByValuePipe, CombineLabelsPipe, CheckOptionSelectedPipe], viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["selectBox"], descendants: true }, { propertyName: "selectContainer", first: true, predicate: ["selectContainer"], descendants: true }, { propertyName: "virtualList", first: true, predicate: ["virtualList"], descendants: true }, { propertyName: "optionsMenu", first: true, predicate: ["optionsMenu"], descendants: true }, { propertyName: "optionsList", first: true, predicate: ["optionsList"], descendants: true }], ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-select\"\n tabindex=\"0\"\n [ngClass]=\"{ disabled: disabled, error: error, active: isOpened }\"\n #selectContainer\n (keydown)=\"onKeyDown($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\">\n @if (label) {\n <div class=\"cps-select-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-select-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n class=\"cps-select-container\"\n [class.focused]=\"isOpened\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div class=\"cps-select-box\" #selectBox (click)=\"onBoxClick()\">\n <div class=\"cps-select-box-left\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? '#9a9595' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if ((!multiple && isEmptyValue()) || (value?.length < 1 && multiple)) {\n <div class=\"cps-select-box-placeholder\">\n {{ placeholder }}\n </div>\n }\n @if (\n (!multiple && !isEmptyValue()) || (value?.length > 0 && multiple)\n ) {\n <div class=\"cps-select-box-items\">\n @if (!multiple) {\n <span class=\"single-item\">\n {{\n returnObject\n ? value[optionLabel]\n : (value\n | labelByValue: options : optionValue : optionLabel)\n }}</span\n >\n }\n @if (multiple && !chips) {\n <div class=\"text-group\">\n <span class=\"text-group-item\">\n {{\n value\n | combineLabels\n : options\n : optionValue\n : optionLabel\n : returnObject\n }}\n </span>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"chips-group\">\n @for (val of value; track val) {\n <cps-chip\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"select(val, true)\"\n [label]=\"\n returnObject\n ? val[optionLabel]\n : (val\n | labelByValue: options : optionValue : optionLabel)\n \">\n </cps-chip>\n }\n </div>\n }\n </div>\n }\n </div>\n <span class=\"cps-select-box-icons\">\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear ||\n (!persistentClear &&\n ((multiple && value?.length) || (!multiple && !isEmptyValue())))\n ? 'visible'\n : 'hidden'\n \"\n class=\"cps-select-box-clear-icon\">\n <cps-icon\n icon=\"delete\"\n size=\"small\"\n (click)=\"clear($event)\"></cps-icon>\n </span>\n }\n @if (showChevron) {\n <span class=\"cps-select-box-chevron\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden()\"\n hideTransitionOptions=\"0s linear\"\n [containerClass]=\"'cps-select-options-menu ' + optionsClass\">\n <div\n #optionsList\n class=\"cps-select-options\"\n [ngStyle]=\"{\n width: selectBoxWidth + 'px'\n }\">\n @if (!virtualScroll) {\n @if (multiple && selectAll && options.length > 1) {\n <div\n class=\"cps-select-options-option select-all-option\"\n [class.allselected]=\"value?.length === options.length\"\n (click)=\"toggleAll()\">\n <span class=\"cps-select-options-option-left\">\n @if (multiple) {\n <span class=\"cps-select-options-option-check\"> </span>\n }\n <span class=\"cps-select-options-option-label\">Select all</span>\n </span>\n </div>\n }\n @for (item of options; track item) {\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n }\n }\n @if (virtualScroll) {\n <p-virtualscroller\n #virtualList\n [items]=\"options\"\n [delay]=\"0\"\n [scrollHeight]=\"virtualListHeight + 'px'\"\n [options]=\"{ numToleratedItems: numToleratedItems }\"\n [itemSize]=\"virtualScrollItemSize\">\n <ng-template pTemplate=\"item\" let-item>\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate;\n context: {\n item: item\n }\n \"></ng-container>\n </ng-template>\n </p-virtualscroller>\n }\n </div>\n </cps-menu>\n\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"select-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-select-hint\">{{ hint }}</div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-select-error\">{{ error }}</div>\n }\n</div>\n\n<ng-template #itemTemplate let-item=\"item\">\n <div\n class=\"cps-select-options-option\"\n (click)=\"onOptionClick(item)\"\n [class.selected]=\"\n item | checkOptionSelected: value : multiple : returnObject : optionValue\n \">\n <span class=\"cps-select-options-option-left\">\n @if (multiple) {\n <span class=\"cps-select-options-option-check\"> </span>\n }\n <span\n class=\"cps-select-options-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ item[optionLabel] }}</span\n >\n </span>\n\n <span\n class=\"cps-select-options-option-right\"\n [class.virtual-row]=\"virtualScroll\">\n {{ item[optionInfo] }}\n @if (item[optionIcon]) {\n <cps-icon\n [icon]=\"item[optionIcon]\"\n [color]=\"item[optionIconColor] || 'text-light'\"\n class=\"cps-select-options-option-right-icon\">\n </cps-icon>\n }\n </span>\n </div>\n</ng-template>\n", styles: [":host{display:flex}:host .cps-select{position:relative;width:100%;outline:none;font-family:Source Sans Pro,sans-serif;font-weight:400;display:grid}:host .cps-select .cps-select-container{position:relative}:host .cps-select .cps-select-container .select-progress-bar{position:absolute;bottom:1px;padding:0 1px}:host .cps-select .cps-select-container.borderless .cps-select-box,:host .cps-select .cps-select-container.underlined .cps-select-box{line-height:1;border:none!important;border-radius:0}:host .cps-select .cps-select-container.underlined .cps-select-box{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-select.active .cps-select-box{border:1px solid var(--cps-color-calm)}:host .cps-select.active .cps-select-box .cps-select-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-select.active .cps-select-box .cps-select-box-chevron{top:22px;transform:rotate(180deg)}:host .cps-select .cps-select-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-select .cps-select-label .cps-select-label-info-circle{margin-left:8px;pointer-events:all}:host .cps-select .persistent-clear .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon,:host .cps-select .cps-select-container.focused .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon,:host .cps-select .cps-select-container:hover .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon{opacity:.5}:host .cps-select .cps-select-box{overflow:hidden;justify-content:space-between;min-height:38px;width:100%;cursor:pointer;background:#fff;font-size:1rem;outline:none;padding:0 12px;border-radius:4px;align-items:center;display:flex;border:1px solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-select .cps-select-box-placeholder{color:var(--cps-color-text-mild);font-style:italic}:host .cps-select .cps-select-box-items{margin-top:3px;margin-bottom:3px}:host .cps-select .cps-select-box-items .text-group,:host .cps-select .cps-select-box-items .single-item{color:var(--cps-color-text-dark);padding-top:3px;padding-bottom:3px}:host .cps-select .cps-select-box-items .chips-group cps-chip{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-select .cps-select-box-items .text-group-item{line-height:1.5}:host .cps-select .cps-select-box .cps-select-box-left{display:inline-flex;align-items:center}:host .cps-select .cps-select-box .cps-select-box-left .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-select .cps-select-box:hover{border:1px solid var(--cps-color-calm)}:host .cps-select .cps-select-box:hover .cps-select-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-select .cps-select-box .cps-select-box-icons{display:flex}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon{display:flex;color:var(--cps-state-error);margin-left:8px}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-clear-icon cps-icon:hover{opacity:1!important}:host .cps-select .cps-select-box .cps-select-box-icons .cps-select-box-chevron{display:flex;margin-left:8px;transition-duration:.2s}:host .cps-select .cps-select-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-select .cps-select-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-select.disabled{pointer-events:none}:host .cps-select.disabled .cps-select-box{background:var(--cps-color-bg-disabled)}:host .cps-select.disabled .cps-select-box-items{color:var(--cps-color-text-light)}:host .cps-select.disabled .cps-select-box-items .text-group,:host .cps-select.disabled .cps-select-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-select.disabled .cps-select-label{color:var(--cps-color-text-mild)}:host .cps-select.error .cps-select-box{border-color:var(--cps-state-error)!important;background:#fef3f2!important}.cps-select-options{background:#fff;overflow-x:hidden;max-height:242px;overflow-y:auto}.cps-select-options .cps-select-options-option{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-select-options .cps-select-options-option:hover{background:var(--cps-color-highlight-hover)}.cps-select-options .cps-select-options-option-label{color:var(--cps-color-text-dark)}.cps-select-options .cps-select-options-option-left{display:flex;align-items:center;margin-right:8px}.cps-select-options .cps-select-options-option-right{color:var(--cps-color-text-light);display:flex;align-items:center}.cps-select-options .cps-select-options-option-right-icon{margin-left:8px}.cps-select-options .cps-select-options-option-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-select-options .cps-select-options-option-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-select-options .cps-select-options-option.selected,.cps-select-options .cps-select-options-option.allselected{font-weight:600}.cps-select-options .cps-select-options-option.selected .cps-select-options-option-label,.cps-select-options .cps-select-options-option.allselected .cps-select-options-option-label{color:var(--cps-color-calm)}.cps-select-options .cps-select-options-option.selected .cps-select-options-option-check,.cps-select-options .cps-select-options-option.allselected .cps-select-options-option-check{opacity:1}.cps-select-options .cps-select-options-option.selected{background:var(--cps-color-highlight-selected)}.cps-select-options .cps-select-options-option.highlighten{background:var(--cps-color-highlight-active)}.cps-select-options .cps-select-options-option.selected.highlighten{background:var(--cps-color-highlight-selected-dark)}.cps-select-options .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}.cps-select-options ::ng-deep .p-virtualscroller-list.p-scroller{overflow-anchor:none}.cps-select-options .virtual-row{white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "ngmodule", type: ScrollerModule }, { kind: "component", type: i4$1.Scroller, selector: "p-scroller, p-virtualscroller, p-virtual-scroller, p-virtualScroller", inputs: ["hostName", "id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "pipe", type: LabelByValuePipe, name: "labelByValue" }, { kind: "pipe", type: CombineLabelsPipe, name: "combineLabels" }, { kind: "pipe", type: CheckOptionSelectedPipe, name: "checkOptionSelected" }] }); }
|
|
5495
5495
|
}
|
|
5496
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
5496
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSelectComponent, decorators: [{
|
|
5497
5497
|
type: Component,
|
|
5498
5498
|
args: [{ imports: [
|
|
5499
5499
|
CommonModule,
|
|
@@ -5686,10 +5686,10 @@ class CpsPaginatorComponent {
|
|
|
5686
5686
|
this.paginator.rows = rows;
|
|
5687
5687
|
this.paginator.changePage(this.paginator.getPage());
|
|
5688
5688
|
}
|
|
5689
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
5690
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
5689
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsPaginatorComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5690
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsPaginatorComponent, isStandalone: true, selector: "cps-paginator", inputs: { first: "first", rows: "rows", totalRecords: "totalRecords", rowsPerPageOptions: "rowsPerPageOptions", alwaysShow: "alwaysShow", backgroundColor: "backgroundColor", resetPageOnRowsChange: "resetPageOnRowsChange" }, outputs: { pageChanged: "pageChanged" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }], ngImport: i0, template: "<p-paginator\n #paginator\n (onPageChange)=\"onPageChange($event)\"\n [first]=\"first\"\n [rows]=\"rows\"\n [style]=\"{ background: backgroundColor }\"\n [totalRecords]=\"totalRecords\"\n [showFirstLastIcon]=\"true\"\n [showCurrentPageReport]=\"true\"\n [alwaysShow]=\"alwaysShow\"\n [templateLeft]=\"itemsPerPageTemplate\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\">\n</p-paginator>\n\n<ng-template #itemsPerPageTemplate>\n <div class=\"cps-paginator-itms-per-page\">\n <span class=\"cps-paginator-items-per-page-title\">Items per page: </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChange($event)\"\n [returnObject]=\"false\"\n optionsClass=\"cps-paginator-page-options\"></cps-select>\n </div>\n</ng-template>\n", styles: [":host ::ng-deep .p-paginator{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:.5rem 1rem}:host ::ng-deep .p-paginator-content-start{margin-right:auto}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px;cursor:default}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px;height:unset}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator-current{cursor:default}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-paginator-page-selected{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-paginator-page:focus{outline:0 none;outline-offset:0;box-shadow:unset}:host ::ng-deep .p-paginator-page{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}::ng-deep .cps-select-options-menu.cps-paginator-page-options .cps-select-options-option{font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i1$4.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first", "appendTo"], outputs: ["onPageChange"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "optionIcon", "optionIconColor", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "numToleratedItems", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "optionsClass", "appearance", "showChevron", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
5691
5691
|
}
|
|
5692
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
5692
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsPaginatorComponent, decorators: [{
|
|
5693
5693
|
type: Component,
|
|
5694
5694
|
args: [{ selector: 'cps-paginator', imports: [PaginatorModule, CpsSelectComponent, FormsModule], template: "<p-paginator\n #paginator\n (onPageChange)=\"onPageChange($event)\"\n [first]=\"first\"\n [rows]=\"rows\"\n [style]=\"{ background: backgroundColor }\"\n [totalRecords]=\"totalRecords\"\n [showFirstLastIcon]=\"true\"\n [showCurrentPageReport]=\"true\"\n [alwaysShow]=\"alwaysShow\"\n [templateLeft]=\"itemsPerPageTemplate\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\">\n</p-paginator>\n\n<ng-template #itemsPerPageTemplate>\n <div class=\"cps-paginator-itms-per-page\">\n <span class=\"cps-paginator-items-per-page-title\">Items per page: </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChange($event)\"\n [returnObject]=\"false\"\n optionsClass=\"cps-paginator-page-options\"></cps-select>\n </div>\n</ng-template>\n", styles: [":host ::ng-deep .p-paginator{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:.5rem 1rem}:host ::ng-deep .p-paginator-content-start{margin-right:auto}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px;cursor:default}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-content-start .cps-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px;height:unset}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator-current{cursor:default}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-paginator-page-selected{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-paginator-page:focus{outline:0 none;outline-offset:0;box-shadow:unset}:host ::ng-deep .p-paginator-page{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}::ng-deep .cps-select-options-menu.cps-paginator-page-options .cps-select-options-option{font-size:14px}\n"] }]
|
|
5695
5695
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -5733,10 +5733,10 @@ class CpsPaginatePipe {
|
|
|
5733
5733
|
const last = first + rows;
|
|
5734
5734
|
return items.slice(first, last);
|
|
5735
5735
|
}
|
|
5736
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
5737
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
5736
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsPaginatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
5737
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.13", ngImport: i0, type: CpsPaginatePipe, isStandalone: true, name: "cpsPaginate" }); }
|
|
5738
5738
|
}
|
|
5739
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
5739
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsPaginatePipe, decorators: [{
|
|
5740
5740
|
type: Pipe,
|
|
5741
5741
|
args: [{
|
|
5742
5742
|
standalone: true,
|
|
@@ -5804,10 +5804,10 @@ class CpsRadioButtonComponent {
|
|
|
5804
5804
|
onFocus() {
|
|
5805
5805
|
this.focused.emit();
|
|
5806
5806
|
}
|
|
5807
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
5808
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
5807
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5808
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsRadioButtonComponent, isStandalone: true, selector: "cps-radio-button", inputs: { groupName: "groupName", option: "option", checked: "checked", groupDisabled: "groupDisabled" }, outputs: { updateValueEvent: "updateValueEvent", blurred: "blurred", focused: "focused" }, usesOnChanges: true, ngImport: i0, template: "@if (option.tooltip) {\n <div\n class=\"cps-radio-group-content-button\"\n [cpsTooltip]=\"option.tooltip || ''\"\n tooltipCloseDelay=\"0\"\n tooltipPosition=\"bottom\">\n <ng-container\n *ngTemplateOutlet=\"\n optionRadioTemplate;\n context: {\n option: option\n }\n \"></ng-container>\n </div>\n} @else {\n <div class=\"cps-radio-group-content-button\">\n <ng-container\n *ngTemplateOutlet=\"\n optionRadioTemplate;\n context: {\n option: option\n }\n \"></ng-container>\n </div>\n}\n\n<ng-template #optionRadioTemplate let-option=\"option\">\n <span class=\"cps-radio-input-wrapper\">\n <input\n type=\"radio\"\n [id]=\"inputId\"\n [name]=\"groupName\"\n [attr.aria-label]=\"option.ariaLabel || null\"\n [disabled]=\"option.disabled || groupDisabled\"\n [value]=\"option.value\"\n [checked]=\"checked\"\n (change)=\"updateValue($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n </span>\n <div\n #contentRef\n class=\"content\"\n [attr.inert]=\"!checked || option.disabled || groupDisabled ? '' : null\">\n <ng-content></ng-content>\n </div>\n @if (!contentRef.innerHTML.trim() && option.label) {\n <label\n class=\"cps-radio-group-content-button-label\"\n [for]=\"inputId\"\n [style.cursor]=\"option.disabled || groupDisabled ? 'default' : 'pointer'\"\n >{{ option.label }}\n </label>\n }\n</ng-template>\n", styles: [":host .cps-radio-group-content-button{display:grid;grid-template-columns:1rem auto;align-items:center;gap:.75rem}:host .cps-radio-group-content-button-label{font-size:1rem;color:var(--cps-color-text-dark);font-style:normal;font-weight:400;line-height:1rem}:host .cps-radio-group-content-button input[type=radio]{-webkit-appearance:none;appearance:none;background-color:transparent;margin:0;cursor:pointer;font:inherit;color:var(--cps-color-text-medium);width:1.25rem;height:1.25rem;border:.15rem solid currentColor;border-radius:50%;display:grid;place-content:center;position:absolute;inset:0}:host .cps-radio-group-content-button input[type=radio]:hover,:host .cps-radio-group-content-button input[type=radio]:checked{color:var(--cps-color-calm)}:host .cps-radio-group-content-button input[type=radio]:disabled{color:var(--cps-color-text-light);cursor:default}:host .cps-radio-group-content-button input[type=radio]:before{content:\"\";width:1.25rem;height:1.25rem;border-radius:50%;transform:scale(0);transition:.12s transform ease-in-out;box-shadow:inset 1rem 1rem var(--cps-color-calm);background-color:CanvasText}:host .cps-radio-group-content-button input[type=radio][disabled]:before{box-shadow:inset 1rem 1rem var(--cps-color-text-light)}:host .cps-radio-group-content-button input[type=radio]:checked:before{transform:scale(.5)}:host .cps-radio-group-content-button input[type=radio]:focus-visible{outline:none}:host .cps-radio-group-content-button .cps-radio-input-wrapper{display:block;position:relative;width:1.25rem;height:1.25rem;flex-shrink:0}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible){outline:none;position:relative}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):before,:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):after{content:\"\";position:absolute;border-radius:50%}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):before{inset:-.1875rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible).suppress-focus-visible:before,:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible).suppress-focus-visible:after{display:none}:host .cps-radio-group-content-button:has(input:disabled) .cps-radio-group-content-button-label{color:var(--cps-color-text-mild)}:host .cps-radio-group-content-button .cps-radio-group-content-button-label{-webkit-user-select:none;user-select:none}:host .cps-radio-group-content-button .content:empty{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }] }); }
|
|
5809
5809
|
}
|
|
5810
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
5810
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRadioButtonComponent, decorators: [{
|
|
5811
5811
|
type: Component,
|
|
5812
5812
|
args: [{ imports: [CommonModule, CpsTooltipDirective], selector: 'cps-radio-button', template: "@if (option.tooltip) {\n <div\n class=\"cps-radio-group-content-button\"\n [cpsTooltip]=\"option.tooltip || ''\"\n tooltipCloseDelay=\"0\"\n tooltipPosition=\"bottom\">\n <ng-container\n *ngTemplateOutlet=\"\n optionRadioTemplate;\n context: {\n option: option\n }\n \"></ng-container>\n </div>\n} @else {\n <div class=\"cps-radio-group-content-button\">\n <ng-container\n *ngTemplateOutlet=\"\n optionRadioTemplate;\n context: {\n option: option\n }\n \"></ng-container>\n </div>\n}\n\n<ng-template #optionRadioTemplate let-option=\"option\">\n <span class=\"cps-radio-input-wrapper\">\n <input\n type=\"radio\"\n [id]=\"inputId\"\n [name]=\"groupName\"\n [attr.aria-label]=\"option.ariaLabel || null\"\n [disabled]=\"option.disabled || groupDisabled\"\n [value]=\"option.value\"\n [checked]=\"checked\"\n (change)=\"updateValue($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n </span>\n <div\n #contentRef\n class=\"content\"\n [attr.inert]=\"!checked || option.disabled || groupDisabled ? '' : null\">\n <ng-content></ng-content>\n </div>\n @if (!contentRef.innerHTML.trim() && option.label) {\n <label\n class=\"cps-radio-group-content-button-label\"\n [for]=\"inputId\"\n [style.cursor]=\"option.disabled || groupDisabled ? 'default' : 'pointer'\"\n >{{ option.label }}\n </label>\n }\n</ng-template>\n", styles: [":host .cps-radio-group-content-button{display:grid;grid-template-columns:1rem auto;align-items:center;gap:.75rem}:host .cps-radio-group-content-button-label{font-size:1rem;color:var(--cps-color-text-dark);font-style:normal;font-weight:400;line-height:1rem}:host .cps-radio-group-content-button input[type=radio]{-webkit-appearance:none;appearance:none;background-color:transparent;margin:0;cursor:pointer;font:inherit;color:var(--cps-color-text-medium);width:1.25rem;height:1.25rem;border:.15rem solid currentColor;border-radius:50%;display:grid;place-content:center;position:absolute;inset:0}:host .cps-radio-group-content-button input[type=radio]:hover,:host .cps-radio-group-content-button input[type=radio]:checked{color:var(--cps-color-calm)}:host .cps-radio-group-content-button input[type=radio]:disabled{color:var(--cps-color-text-light);cursor:default}:host .cps-radio-group-content-button input[type=radio]:before{content:\"\";width:1.25rem;height:1.25rem;border-radius:50%;transform:scale(0);transition:.12s transform ease-in-out;box-shadow:inset 1rem 1rem var(--cps-color-calm);background-color:CanvasText}:host .cps-radio-group-content-button input[type=radio][disabled]:before{box-shadow:inset 1rem 1rem var(--cps-color-text-light)}:host .cps-radio-group-content-button input[type=radio]:checked:before{transform:scale(.5)}:host .cps-radio-group-content-button input[type=radio]:focus-visible{outline:none}:host .cps-radio-group-content-button .cps-radio-input-wrapper{display:block;position:relative;width:1.25rem;height:1.25rem;flex-shrink:0}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible){outline:none;position:relative}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):before,:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):after{content:\"\";position:absolute;border-radius:50%}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):before{inset:-.1875rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible):after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible).suppress-focus-visible:before,:host .cps-radio-group-content-button .cps-radio-input-wrapper:has(input:focus-visible).suppress-focus-visible:after{display:none}:host .cps-radio-group-content-button:has(input:disabled) .cps-radio-group-content-button-label{color:var(--cps-color-text-mild)}:host .cps-radio-group-content-button .cps-radio-group-content-button-label{-webkit-user-select:none;user-select:none}:host .cps-radio-group-content-button .content:empty{display:none}\n"] }]
|
|
5813
5813
|
}], propDecorators: { groupName: [{
|
|
@@ -6009,15 +6009,15 @@ class CpsRadioGroupComponent {
|
|
|
6009
6009
|
const message = errArr.find((msg) => typeof msg === 'string');
|
|
6010
6010
|
this.error = message || 'Unknown error';
|
|
6011
6011
|
}
|
|
6012
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
6013
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
6012
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRadioGroupComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6013
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsRadioGroupComponent, isStandalone: true, selector: "cps-radio-group", inputs: { options: "options", groupLabel: "groupLabel", ariaLabel: "ariaLabel", vertical: "vertical", disabled: "disabled", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", hint: "hint", hideDetails: "hideDetails", value: "value" }, outputs: { valueChanged: "valueChanged", blurred: "blurred", focused: "focused" }, providers: [
|
|
6014
6014
|
{
|
|
6015
6015
|
provide: CPS_RADIO_GROUP,
|
|
6016
6016
|
useExisting: CpsRadioGroupComponent
|
|
6017
6017
|
}
|
|
6018
6018
|
], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"cps-radio-group\"\n role=\"radiogroup\"\n [attr.aria-label]=\"computedLabel\"\n [attr.aria-disabled]=\"disabled || null\"\n [attr.aria-required]=\"isRequired || null\"\n [attr.aria-invalid]=\"error ? 'true' : null\">\n @if (groupLabel) {\n <div class=\"cps-radio-group-label\">\n <span>{{ groupLabel }}</span>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-radio-group-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n\n <div\n #contentRef\n class=\"cps-radio-group-content\"\n [class.cps-radio-group-content-vertical]=\"vertical\"\n [class.cps-radio-group-content-horizontal]=\"!vertical\">\n <ng-content></ng-content>\n </div>\n\n @if (!contentRef.innerHTML.trim()) {\n <div\n class=\"cps-radio-group-content\"\n [class.cps-radio-group-content-vertical]=\"vertical\"\n [class.cps-radio-group-content-horizontal]=\"!vertical\">\n @for (option of options; track option) {\n <cps-radio-button\n [option]=\"option\"\n [groupName]=\"groupName\"\n [checked]=\"option.value === value\"\n [groupDisabled]=\"disabled\"\n (blurred)=\"onBlur()\"\n (focused)=\"onFocus()\"\n (updateValueEvent)=\"updateValueEvent($event)\">\n </cps-radio-button>\n }\n </div>\n }\n @if (!error && !hideDetails) {\n <div class=\"cps-radio-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-radio-error\" role=\"alert\" aria-live=\"assertive\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{width:fit-content;display:inline-block}:host .cps-radio-group{font-family:Source Sans Pro,sans-serif}:host .cps-radio-group-label{font-style:normal;font-weight:700;font-size:1rem;color:var(--cps-color-text-dark);margin-bottom:.75rem;align-items:center;display:inline-flex;cursor:default}:host .cps-radio-group-label .cps-radio-group-label-info-circle{margin-left:.5rem}:host .cps-radio-group-label .cps-radio-group-label-info-circle ::ng-deep cps-icon i{width:.875rem;height:.875rem}:host .cps-radio-group-content{margin-left:.5rem;gap:1.25rem}:host .cps-radio-group-content-vertical{display:grid;grid-auto-rows:1fr}:host .cps-radio-group-content-horizontal{display:flex;flex-direction:row;flex-wrap:wrap}:host .cps-radio-group-content .content:empty{display:none}:host .cps-radio-group .cps-radio-hint{margin-top:.25rem;color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-radio-group .cps-radio-error{margin-top:.25rem;color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsRadioButtonComponent, selector: "cps-radio-button", inputs: ["groupName", "option", "checked", "groupDisabled"], outputs: ["updateValueEvent", "blurred", "focused"] }] }); }
|
|
6019
6019
|
}
|
|
6020
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
6020
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRadioGroupComponent, decorators: [{
|
|
6021
6021
|
type: Component,
|
|
6022
6022
|
args: [{ imports: [CommonModule, CpsInfoCircleComponent, CpsRadioButtonComponent], selector: 'cps-radio-group', providers: [
|
|
6023
6023
|
{
|
|
@@ -6078,10 +6078,10 @@ class CpsRadioComponent {
|
|
|
6078
6078
|
updateValueEvent(value) {
|
|
6079
6079
|
this.radioGroup?.updateValueEvent(value);
|
|
6080
6080
|
}
|
|
6081
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
6082
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
6081
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRadioComponent, deps: [{ token: CPS_RADIO_GROUP, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6082
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsRadioComponent, isStandalone: true, selector: "cps-radio", inputs: { option: "option" }, ngImport: i0, template: "<cps-radio-button\n [option]=\"option\"\n [groupName]=\"radioGroup?.groupName || ''\"\n [groupDisabled]=\"groupDisabled\"\n [checked]=\"radioGroup?.value == option.value\"\n (updateValueEvent)=\"updateValueEvent($event)\">\n <ng-content></ng-content>\n</cps-radio-button>\n", styles: [":host{display:flex;align-items:center}\n"], dependencies: [{ kind: "component", type: CpsRadioButtonComponent, selector: "cps-radio-button", inputs: ["groupName", "option", "checked", "groupDisabled"], outputs: ["updateValueEvent", "blurred", "focused"] }] }); }
|
|
6083
6083
|
}
|
|
6084
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
6084
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRadioComponent, decorators: [{
|
|
6085
6085
|
type: Component,
|
|
6086
6086
|
args: [{ selector: 'cps-radio', imports: [CpsRadioButtonComponent], template: "<cps-radio-button\n [option]=\"option\"\n [groupName]=\"radioGroup?.groupName || ''\"\n [groupDisabled]=\"groupDisabled\"\n [checked]=\"radioGroup?.value == option.value\"\n (updateValueEvent)=\"updateValueEvent($event)\">\n <ng-content></ng-content>\n</cps-radio-button>\n", styles: [":host{display:flex;align-items:center}\n"] }]
|
|
6087
6087
|
}], ctorParameters: () => [{ type: CpsRadioGroupComponent, decorators: [{
|
|
@@ -6494,10 +6494,10 @@ class CpsCronValidationService {
|
|
|
6494
6494
|
];
|
|
6495
6495
|
return validMonths.includes(month.toUpperCase());
|
|
6496
6496
|
}
|
|
6497
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
6498
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
6497
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsCronValidationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
6498
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsCronValidationService, providedIn: 'root' }); }
|
|
6499
6499
|
}
|
|
6500
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
6500
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsCronValidationService, decorators: [{
|
|
6501
6501
|
type: Injectable,
|
|
6502
6502
|
args: [{
|
|
6503
6503
|
providedIn: 'root'
|
|
@@ -6831,10 +6831,10 @@ class CpsTimepickerComponent {
|
|
|
6831
6831
|
_getRange(startFrom, until) {
|
|
6832
6832
|
return Array.from({ length: until + 1 - startFrom }, (_, k) => k + startFrom);
|
|
6833
6833
|
}
|
|
6834
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
6835
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
6834
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTimepickerComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6835
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTimepickerComponent, isStandalone: true, selector: "cps-timepicker", inputs: { label: "label", disabled: "disabled", use24HourTime: "use24HourTime", withSeconds: "withSeconds", hint: "hint", hideDetails: "hideDetails", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", mandatoryValue: "mandatoryValue", value: "value" }, outputs: { valueChanged: "valueChanged", focused: "focused", blurred: "blurred" }, viewQueries: [{ propertyName: "hoursField", first: true, predicate: ["hoursField"], descendants: true }, { propertyName: "minutesField", first: true, predicate: ["minutesField"], descendants: true }, { propertyName: "secondsField", first: true, predicate: ["secondsField"], descendants: true }], ngImport: i0, template: "<div class=\"cps-timepicker\">\n @if (label) {\n <div\n class=\"cps-timepicker-label\"\n [ngClass]=\"{ 'cps-timepicker-label-disabled': disabled }\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-timepicker-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div class=\"cps-timepicker-body\">\n <cps-autocomplete\n #hoursField\n ariaLabel=\"Hours\"\n (keypress)=\"numberOnly($event)\"\n width=\"60\"\n [emptyOptionIndex]=\"mandatoryValue ? 0 : -1\"\n [options]=\"hoursOptions\"\n [withOptionsAliases]=\"!use24HourTime\"\n [useOptionsAliasesWhenNoMatch]=\"true\"\n [hideDetails]=\"true\"\n [disabled]=\"disabled\"\n [showChevron]=\"false\"\n [showEmptyMessage]=\"false\"\n (focused)=\"onFieldFocus()\"\n (blurred)=\"onFieldBlur()\"\n [returnObject]=\"false\"\n [value]=\"value?.hours\"\n (valueChanged)=\"updateHours($event)\"\n [externalError]=\"hoursError\"\n placeholder=\"HH\"></cps-autocomplete>\n <span class=\"cps-timepicker-delimiter\">:</span>\n <cps-autocomplete\n #minutesField\n ariaLabel=\"Minutes\"\n (keypress)=\"numberOnly($event)\"\n width=\"60\"\n [emptyOptionIndex]=\"mandatoryValue ? 0 : -1\"\n [options]=\"minutesOptions\"\n [hideDetails]=\"true\"\n [disabled]=\"disabled\"\n [showChevron]=\"false\"\n [showEmptyMessage]=\"false\"\n (focused)=\"onFieldFocus()\"\n (blurred)=\"onFieldBlur()\"\n [returnObject]=\"false\"\n [value]=\"value?.minutes\"\n (valueChanged)=\"updateMinutes($event)\"\n [externalError]=\"minutesError\"\n placeholder=\"MM\"></cps-autocomplete>\n @if (withSeconds) {\n <span class=\"cps-timepicker-delimiter\">:</span>\n }\n @if (withSeconds) {\n <cps-autocomplete\n #secondsField\n ariaLabel=\"Seconds\"\n (keypress)=\"numberOnly($event)\"\n width=\"60\"\n [emptyOptionIndex]=\"mandatoryValue ? 0 : -1\"\n [options]=\"secondsOptions\"\n [hideDetails]=\"true\"\n [disabled]=\"disabled\"\n [showChevron]=\"false\"\n [showEmptyMessage]=\"false\"\n (focused)=\"onFieldFocus()\"\n (blurred)=\"onFieldBlur()\"\n [returnObject]=\"false\"\n [value]=\"value?.seconds\"\n (valueChanged)=\"updateSeconds($event)\"\n [externalError]=\"secondsError\"\n placeholder=\"SS\"></cps-autocomplete>\n }\n @if (!use24HourTime) {\n <cps-button-toggle\n class=\"cps-timepicker-am-pm-selector\"\n ariaLabel=\"Day period\"\n [options]=\"dayPeriodOptions\"\n [disabled]=\"disabled\"\n [value]=\"value?.dayPeriod || 'AM'\"\n (valueChanged)=\"updateDayPeriod($event)\">\n </cps-button-toggle>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-timepicker-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-timepicker-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host .cps-timepicker{display:flex;flex-direction:column}:host .cps-timepicker .cps-timepicker-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-timepicker .cps-timepicker-label-info-circle{margin-left:8px}:host .cps-timepicker .cps-timepicker-label-disabled{color:var(--cps-color-text-mild)}:host .cps-timepicker-body{display:flex;flex-direction:row}:host .cps-timepicker-body .cps-timepicker-am-pm-selector{margin-left:10px;margin-top:0}:host .cps-timepicker-body .cps-timepicker-delimiter{color:var(--cps-color-text-lightest);font-size:24px;margin:0 10px}:host .cps-timepicker .cps-timepicker-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-timepicker .cps-timepicker-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CpsButtonToggleComponent, selector: "cps-button-toggle", inputs: ["label", "ariaLabel", "options", "multiple", "disabled", "mandatory", "equalWidths", "optionTooltipPosition", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsAutocompleteComponent, selector: "cps-autocomplete", inputs: ["label", "ariaLabel", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "showChevron", "withOptionsAliases", "useOptionsAliasesWhenNoMatch", "optionAlias", "chips", "closableChips", "clearable", "openOnClear", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "loadingMessage", "showLoadingMessage", "emptyMessage", "showEmptyMessage", "virtualScroll", "numToleratedItems", "externalError", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "emptyOptionIndex", "inputChangeDebounceTime", "validating", "value", "options"], outputs: ["valueChanged", "inputChanged", "focused", "blurred"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }] }); }
|
|
6836
6836
|
}
|
|
6837
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
6837
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTimepickerComponent, decorators: [{
|
|
6838
6838
|
type: Component,
|
|
6839
6839
|
args: [{ selector: 'cps-timepicker', imports: [
|
|
6840
6840
|
CommonModule,
|
|
@@ -8150,10 +8150,10 @@ class CpsSchedulerComponent {
|
|
|
8150
8150
|
const res = Number(value);
|
|
8151
8151
|
return isNaN(res) ? 0 : res;
|
|
8152
8152
|
}
|
|
8153
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
8154
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsSchedulerComponent, isStandalone: true, selector: "cps-scheduler", inputs: { label: "label", cron: "cron", timeZone: "timeZone", showNotSet: "showNotSet", showAdvanced: "showAdvanced", showMinutes: "showMinutes", showTimeZone: "showTimeZone", defaultTime: "defaultTime", use24HourTime: "use24HourTime", disabled: "disabled", infoTooltip: "infoTooltip" }, outputs: { cronChange: "cronChange", timeZoneChange: "timeZoneChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cps-scheduler-selector\">\n <cps-button-toggle\n data-testid=\"schedule-type-toggle\"\n [options]=\"scheduleTypes\"\n [disabled]=\"disabled\"\n [label]=\"label\"\n [infoTooltip]=\"infoTooltip\"\n [(ngModel)]=\"activeScheduleType\"\n (ngModelChange)=\"setActiveScheduleType($event)\">\n </cps-button-toggle>\n</div>\n\n<div\n class=\"cps-scheduler-container\"\n [class.cps-scheduler-container-disabled]=\"disabled\">\n @switch (activeScheduleType) {\n @case ('Not set') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"not-set-config\"></div>\n }\n\n @case ('Minutes') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"minutes-config\">\n <div class=\"cps-scheduler-tab-pane-row\">\n Every\n <cps-select\n width=\"70px\"\n [disabled]=\"disabled\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"minutes-input\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.minutes.minutes\"\n [options]=\"selectOptions.minutes\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n minute(s)\n </div>\n </div>\n }\n\n @case ('Hourly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"hourly-config\">\n <div class=\"cps-scheduler-tab-pane-row\">\n Every\n <cps-select\n width=\"70px\"\n [disabled]=\"disabled\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"hourly-hours-input\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.hourly.hours\"\n [options]=\"selectOptions.hours\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n hour(s) on minute\n <cps-select\n width=\"70px\"\n [disabled]=\"disabled\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"hourly-minutes-input\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.hourly.minutes\"\n [options]=\"selectOptions.fullMinutes\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n </div>\n </div>\n }\n\n @case ('Daily') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"daily-config\">\n <cps-radio-group\n ariaLabel=\"Daily schedule frequency\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"state.daily.subTab\"\n (valueChanged)=\"regenerateCron()\"\n [vertical]=\"true\">\n <cps-radio\n [option]=\"{\n ariaLabel: 'Repeat every N days at a specific time',\n value: 'everyDays',\n disabled: disabled\n }\"\n data-testid=\"daily-subtab-everyDays\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.daily.subTab !== 'everyDays'\n \">\n Every\n <cps-select\n width=\"70px\"\n data-testid=\"daily-every-days-input\"\n [disabled]=\"disabled || state.daily.subTab !== 'everyDays'\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.daily.everyDays.days\"\n [options]=\"selectOptions.monthDays\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n day(s) at\n <cps-timepicker\n data-testid=\"daily-timepicker\"\n [disabled]=\"disabled || state.daily.subTab !== 'everyDays'\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.daily.everyDays)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"onTimeChanged($event, state.daily.everyDays)\">\n </cps-timepicker>\n </div>\n </cps-radio>\n <cps-radio\n data-testid=\"daily-subtab-everyWeekDay\"\n [option]=\"{\n ariaLabel: 'Repeat every working day at a specific time',\n value: 'everyWeekDay',\n disabled: disabled\n }\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n data-testid=\"daily-weekday-config\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.daily.subTab !== 'everyWeekDay'\n \">\n Every working day at\n <cps-timepicker\n [disabled]=\"disabled || state.daily.subTab !== 'everyWeekDay'\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.daily.everyWeekDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.daily.everyWeekDay)\n \">\n </cps-timepicker>\n </div>\n </cps-radio>\n </cps-radio-group>\n </div>\n }\n\n @case ('Weekly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"weekly-config\">\n <div class=\"cps-scheduler-days-checkbox-group\">\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-MON\"\n label=\"Monday\"\n [(ngModel)]=\"state.weekly.MON\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-TUE\"\n label=\"Tuesday\"\n [(ngModel)]=\"state.weekly.TUE\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-WED\"\n label=\"Wednesday\"\n [(ngModel)]=\"state.weekly.WED\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-THU\"\n label=\"Thursday\"\n [(ngModel)]=\"state.weekly.THU\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-FRI\"\n label=\"Friday\"\n [(ngModel)]=\"state.weekly.FRI\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-SAT\"\n label=\"Saturday\"\n [(ngModel)]=\"state.weekly.SAT\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-SUN\"\n label=\"Sunday\"\n [(ngModel)]=\"state.weekly.SUN\">\n </cps-checkbox>\n </div>\n <div class=\"cps-scheduler-tab-pane-row\">\n at\n <cps-timepicker\n [disabled]=\"disabled\"\n data-testid=\"weekly-timepicker\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.weekly)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"onTimeChanged($event, state.weekly)\">\n </cps-timepicker>\n </div>\n </div>\n }\n\n @case ('Monthly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"monthly-config\">\n <cps-radio-group\n ariaLabel=\"Monthly schedule frequency\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"state.monthly.subTab\"\n (valueChanged)=\"regenerateCron()\"\n [vertical]=\"true\">\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat every N months on a selected day at a chosen time, nearest weekday optional',\n value: 'specificDay',\n disabled: disabled\n }\"\n data-testid=\"monthly-subtab-specificDay\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.monthly.subTab !== 'specificDay'\n \">\n On the\n <cps-select\n width=\"120px\"\n data-testid=\"monthly-day-select\"\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificDay.day\"\n [options]=\"selectOptions.monthDaysWithLasts\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n of every\n <cps-select\n width=\"70px\"\n data-testid=\"monthly-months-input\"\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificDay.months\"\n [options]=\"selectOptions.monthsNumeric\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n month(s) at\n <cps-timepicker\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.monthly.specificDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.monthly.specificDay)\n \">\n </cps-timepicker>\n <cps-checkbox\n data-testid=\"monthly-weekday-toggle\"\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n label=\"During the nearest weekday\"\n [(ngModel)]=\"state.monthly.runOnWeekday\"\n class=\"cps-scheduler-nearest-weekday-checkbox\">\n </cps-checkbox>\n </div>\n </cps-radio>\n\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat every N months on a weekday pattern from a chosen month at a chosen time',\n value: 'specificWeekDay',\n disabled: disabled\n }\"\n data-testid=\"monthly-subtab-specificWeekDay\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.monthly.subTab !== 'specificWeekDay'\n \">\n On the\n <cps-select\n width=\"106px\"\n data-testid=\"monthly-week-select\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificWeekDay.monthWeek\"\n [options]=\"selectOptions.monthWeeks\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n <cps-select\n width=\"130px\"\n data-testid=\"monthly-weekday-select\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificWeekDay.day\"\n [options]=\"selectOptions.days\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n of every\n <cps-select\n width=\"90px\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n data-testid=\"monthly-weekday-months-input\"\n [(ngModel)]=\"state.monthly.specificWeekDay.months\"\n [options]=\"selectOptions.monthsNumeric\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n month(s) starting in\n <cps-select\n width=\"120px\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"monthly-weekday-start-month-select\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificWeekDay.startMonth\"\n [options]=\"selectOptions.months\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n at\n <cps-timepicker\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n data-testid=\"monthly-weekday-timepicker\"\n [value]=\"formatTimeValue(state.monthly.specificWeekDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.monthly.specificWeekDay)\n \">\n </cps-timepicker>\n </div>\n </cps-radio>\n </cps-radio-group>\n </div>\n }\n\n @case ('Yearly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"yearly-config\">\n <cps-radio-group\n ariaLabel=\"Yearly schedule frequency\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"state.yearly.subTab\"\n (valueChanged)=\"regenerateCron()\"\n [vertical]=\"true\">\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat in a selected month on a selected day at a chosen time, nearest weekday optional',\n value: 'specificMonthDay',\n disabled: disabled\n }\"\n data-testid=\"yearly-subtab-specificMonthDay\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.yearly.subTab !== 'specificMonthDay'\n \">\n Every\n <cps-select\n width=\"120px\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthDay.month\"\n [options]=\"selectOptions.months\"\n data-testid=\"yearly-month-select\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n on the\n <cps-select\n width=\"120px\"\n data-testid=\"yearly-day-select\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthDay.day\"\n [options]=\"selectOptions.monthDaysWithLasts\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n at\n <cps-timepicker\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.yearly.specificMonthDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.yearly.specificMonthDay)\n \">\n </cps-timepicker>\n <cps-checkbox\n data-testid=\"yearly-weekday-toggle\"\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n label=\"During the nearest weekday\"\n [(ngModel)]=\"state.yearly.runOnWeekday\"\n class=\"cps-scheduler-nearest-weekday-checkbox\">\n </cps-checkbox>\n </div>\n </cps-radio>\n\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat in a selected month on a selected weekday at a chosen time',\n value: 'specificMonthWeek',\n disabled: disabled\n }\"\n data-testid=\"yearly-subtab-specificMonthWeek\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.yearly.subTab !== 'specificMonthWeek'\n \">\n On the\n <cps-select\n width=\"106px\"\n data-testid=\"yearly-week-select\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthWeek.monthWeek\"\n [options]=\"selectOptions.monthWeeks\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n <cps-select\n width=\"120px\"\n data-testid=\"yearly-weekday-select\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthWeek.day\"\n [options]=\"selectOptions.days\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n of\n <cps-select\n width=\"120px\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthWeek.month\"\n [options]=\"selectOptions.months\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n at\n <cps-timepicker\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.yearly.specificMonthWeek)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.yearly.specificMonthWeek)\n \">\n </cps-timepicker>\n </div>\n </cps-radio>\n </cps-radio-group>\n </div>\n }\n\n @case ('Advanced') {\n <div data-testid=\"advanced-config\">\n <form [formGroup]=\"form\">\n <cps-input\n label=\"\"\n data-testid=\"advanced-cron-input\"\n [disabled]=\"disabled\"\n width=\"500px\"\n placeholder=\"Please enter\"\n formControlName=\"advanced\"\n (valueChanged)=\"regenerateCron()\">\n </cps-input>\n </form>\n </div>\n }\n }\n\n @if (cron && showTimeZone) {\n <div class=\"cps-scheduler-time-zone\" data-testid=\"timezone-selector\">\n <cps-autocomplete\n label=\"Time zone\"\n data-testid=\"timezone-select\"\n [(ngModel)]=\"timeZone\"\n (valueChanged)=\"onTimeZoneChanged($event)\"\n [returnObject]=\"false\"\n width=\"300\"\n [options]=\"timeZoneOptions\">\n </cps-autocomplete>\n </div>\n }\n</div>\n", styles: [":host .cps-scheduler-selector{margin-bottom:24px}:host .cps-scheduler-container{margin-top:10px;margin-left:16px}:host .cps-scheduler-container .cps-scheduler-select-control{margin-left:8px;margin-right:8px}:host .cps-scheduler-container .cps-scheduler-days-checkbox-group{max-width:700px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-template-rows:1fr 1fr;grid-gap:20px;margin-bottom:16px}:host .cps-scheduler-container .cps-scheduler-tab-pane{margin-bottom:28px}:host .cps-scheduler-container .cps-scheduler-tab-pane cps-radio-group ::ng-deep .cps-radio-group-content{margin-left:0!important}:host .cps-scheduler-container .cps-scheduler-tab-pane .cps-scheduler-tab-pane-row{display:flex;align-items:center}:host .cps-scheduler-container .cps-scheduler-tab-pane .cps-scheduler-tab-pane-row-disabled{color:var(--cps-color-text-light)}:host .cps-scheduler-container .cps-scheduler-tab-pane .cps-scheduler-nearest-weekday-checkbox{margin-left:16px}:host .cps-scheduler-container .cps-scheduler-tab-pane cps-timepicker{margin-left:8px}:host .cps-scheduler-container-disabled{color:var(--cps-color-text-light)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CpsButtonToggleComponent, selector: "cps-button-toggle", inputs: ["label", "ariaLabel", "options", "multiple", "disabled", "mandatory", "equalWidths", "optionTooltipPosition", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "optionIcon", "optionIconColor", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "numToleratedItems", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "optionsClass", "appearance", "showChevron", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: CpsRadioGroupComponent, selector: "cps-radio-group", inputs: ["options", "groupLabel", "ariaLabel", "vertical", "disabled", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "hint", "hideDetails", "value"], outputs: ["valueChanged", "blurred", "focused"] }, { kind: "component", type: CpsRadioComponent, selector: "cps-radio", inputs: ["option"] }, { kind: "component", type: CpsCheckboxComponent, selector: "cps-checkbox", inputs: ["label", "ariaLabel", "disabled", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "icon", "iconColor", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "component", type: CpsTimepickerComponent, selector: "cps-timepicker", inputs: ["label", "disabled", "use24HourTime", "withSeconds", "hint", "hideDetails", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "mandatoryValue", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: CpsAutocompleteComponent, selector: "cps-autocomplete", inputs: ["label", "ariaLabel", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "showChevron", "withOptionsAliases", "useOptionsAliasesWhenNoMatch", "optionAlias", "chips", "closableChips", "clearable", "openOnClear", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "loadingMessage", "showLoadingMessage", "emptyMessage", "showEmptyMessage", "virtualScroll", "numToleratedItems", "externalError", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "emptyOptionIndex", "inputChangeDebounceTime", "validating", "value", "options"], outputs: ["valueChanged", "inputChanged", "focused", "blurred"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8153
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSchedulerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8154
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsSchedulerComponent, isStandalone: true, selector: "cps-scheduler", inputs: { label: "label", cron: "cron", timeZone: "timeZone", showNotSet: "showNotSet", showAdvanced: "showAdvanced", showMinutes: "showMinutes", showTimeZone: "showTimeZone", defaultTime: "defaultTime", use24HourTime: "use24HourTime", disabled: "disabled", infoTooltip: "infoTooltip" }, outputs: { cronChange: "cronChange", timeZoneChange: "timeZoneChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"cps-scheduler-selector\">\n <cps-button-toggle\n data-testid=\"schedule-type-toggle\"\n [options]=\"scheduleTypes\"\n [disabled]=\"disabled\"\n [label]=\"label\"\n [infoTooltip]=\"infoTooltip\"\n [(ngModel)]=\"activeScheduleType\"\n (ngModelChange)=\"setActiveScheduleType($event)\">\n </cps-button-toggle>\n</div>\n\n<div\n class=\"cps-scheduler-container\"\n [class.cps-scheduler-container-disabled]=\"disabled\">\n @switch (activeScheduleType) {\n @case ('Not set') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"not-set-config\"></div>\n }\n\n @case ('Minutes') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"minutes-config\">\n <div class=\"cps-scheduler-tab-pane-row\">\n Every\n <cps-select\n width=\"70px\"\n [disabled]=\"disabled\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"minutes-input\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.minutes.minutes\"\n [options]=\"selectOptions.minutes\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n minute(s)\n </div>\n </div>\n }\n\n @case ('Hourly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"hourly-config\">\n <div class=\"cps-scheduler-tab-pane-row\">\n Every\n <cps-select\n width=\"70px\"\n [disabled]=\"disabled\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"hourly-hours-input\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.hourly.hours\"\n [options]=\"selectOptions.hours\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n hour(s) on minute\n <cps-select\n width=\"70px\"\n [disabled]=\"disabled\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"hourly-minutes-input\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.hourly.minutes\"\n [options]=\"selectOptions.fullMinutes\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n </div>\n </div>\n }\n\n @case ('Daily') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"daily-config\">\n <cps-radio-group\n ariaLabel=\"Daily schedule frequency\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"state.daily.subTab\"\n (valueChanged)=\"regenerateCron()\"\n [vertical]=\"true\">\n <cps-radio\n [option]=\"{\n ariaLabel: 'Repeat every N days at a specific time',\n value: 'everyDays',\n disabled: disabled\n }\"\n data-testid=\"daily-subtab-everyDays\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.daily.subTab !== 'everyDays'\n \">\n Every\n <cps-select\n width=\"70px\"\n data-testid=\"daily-every-days-input\"\n [disabled]=\"disabled || state.daily.subTab !== 'everyDays'\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.daily.everyDays.days\"\n [options]=\"selectOptions.monthDays\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n day(s) at\n <cps-timepicker\n data-testid=\"daily-timepicker\"\n [disabled]=\"disabled || state.daily.subTab !== 'everyDays'\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.daily.everyDays)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"onTimeChanged($event, state.daily.everyDays)\">\n </cps-timepicker>\n </div>\n </cps-radio>\n <cps-radio\n data-testid=\"daily-subtab-everyWeekDay\"\n [option]=\"{\n ariaLabel: 'Repeat every working day at a specific time',\n value: 'everyWeekDay',\n disabled: disabled\n }\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n data-testid=\"daily-weekday-config\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.daily.subTab !== 'everyWeekDay'\n \">\n Every working day at\n <cps-timepicker\n [disabled]=\"disabled || state.daily.subTab !== 'everyWeekDay'\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.daily.everyWeekDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.daily.everyWeekDay)\n \">\n </cps-timepicker>\n </div>\n </cps-radio>\n </cps-radio-group>\n </div>\n }\n\n @case ('Weekly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"weekly-config\">\n <div class=\"cps-scheduler-days-checkbox-group\">\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-MON\"\n label=\"Monday\"\n [(ngModel)]=\"state.weekly.MON\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-TUE\"\n label=\"Tuesday\"\n [(ngModel)]=\"state.weekly.TUE\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-WED\"\n label=\"Wednesday\"\n [(ngModel)]=\"state.weekly.WED\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-THU\"\n label=\"Thursday\"\n [(ngModel)]=\"state.weekly.THU\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-FRI\"\n label=\"Friday\"\n [(ngModel)]=\"state.weekly.FRI\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-SAT\"\n label=\"Saturday\"\n [(ngModel)]=\"state.weekly.SAT\">\n </cps-checkbox>\n <cps-checkbox\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled\"\n data-testid=\"weekly-SUN\"\n label=\"Sunday\"\n [(ngModel)]=\"state.weekly.SUN\">\n </cps-checkbox>\n </div>\n <div class=\"cps-scheduler-tab-pane-row\">\n at\n <cps-timepicker\n [disabled]=\"disabled\"\n data-testid=\"weekly-timepicker\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.weekly)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"onTimeChanged($event, state.weekly)\">\n </cps-timepicker>\n </div>\n </div>\n }\n\n @case ('Monthly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"monthly-config\">\n <cps-radio-group\n ariaLabel=\"Monthly schedule frequency\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"state.monthly.subTab\"\n (valueChanged)=\"regenerateCron()\"\n [vertical]=\"true\">\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat every N months on a selected day at a chosen time, nearest weekday optional',\n value: 'specificDay',\n disabled: disabled\n }\"\n data-testid=\"monthly-subtab-specificDay\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.monthly.subTab !== 'specificDay'\n \">\n On the\n <cps-select\n width=\"120px\"\n data-testid=\"monthly-day-select\"\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificDay.day\"\n [options]=\"selectOptions.monthDaysWithLasts\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n of every\n <cps-select\n width=\"70px\"\n data-testid=\"monthly-months-input\"\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificDay.months\"\n [options]=\"selectOptions.monthsNumeric\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n month(s) at\n <cps-timepicker\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.monthly.specificDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.monthly.specificDay)\n \">\n </cps-timepicker>\n <cps-checkbox\n data-testid=\"monthly-weekday-toggle\"\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"disabled || state.monthly.subTab !== 'specificDay'\"\n label=\"During the nearest weekday\"\n [(ngModel)]=\"state.monthly.runOnWeekday\"\n class=\"cps-scheduler-nearest-weekday-checkbox\">\n </cps-checkbox>\n </div>\n </cps-radio>\n\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat every N months on a weekday pattern from a chosen month at a chosen time',\n value: 'specificWeekDay',\n disabled: disabled\n }\"\n data-testid=\"monthly-subtab-specificWeekDay\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.monthly.subTab !== 'specificWeekDay'\n \">\n On the\n <cps-select\n width=\"106px\"\n data-testid=\"monthly-week-select\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificWeekDay.monthWeek\"\n [options]=\"selectOptions.monthWeeks\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n <cps-select\n width=\"130px\"\n data-testid=\"monthly-weekday-select\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificWeekDay.day\"\n [options]=\"selectOptions.days\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n of every\n <cps-select\n width=\"90px\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n data-testid=\"monthly-weekday-months-input\"\n [(ngModel)]=\"state.monthly.specificWeekDay.months\"\n [options]=\"selectOptions.monthsNumeric\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n month(s) starting in\n <cps-select\n width=\"120px\"\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n data-testid=\"monthly-weekday-start-month-select\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.monthly.specificWeekDay.startMonth\"\n [options]=\"selectOptions.months\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n at\n <cps-timepicker\n [disabled]=\"\n disabled || state.monthly.subTab !== 'specificWeekDay'\n \"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n data-testid=\"monthly-weekday-timepicker\"\n [value]=\"formatTimeValue(state.monthly.specificWeekDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.monthly.specificWeekDay)\n \">\n </cps-timepicker>\n </div>\n </cps-radio>\n </cps-radio-group>\n </div>\n }\n\n @case ('Yearly') {\n <div class=\"cps-scheduler-tab-pane\" data-testid=\"yearly-config\">\n <cps-radio-group\n ariaLabel=\"Yearly schedule frequency\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"state.yearly.subTab\"\n (valueChanged)=\"regenerateCron()\"\n [vertical]=\"true\">\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat in a selected month on a selected day at a chosen time, nearest weekday optional',\n value: 'specificMonthDay',\n disabled: disabled\n }\"\n data-testid=\"yearly-subtab-specificMonthDay\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.yearly.subTab !== 'specificMonthDay'\n \">\n Every\n <cps-select\n width=\"120px\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthDay.month\"\n [options]=\"selectOptions.months\"\n data-testid=\"yearly-month-select\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n on the\n <cps-select\n width=\"120px\"\n data-testid=\"yearly-day-select\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthDay.day\"\n [options]=\"selectOptions.monthDaysWithLasts\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n at\n <cps-timepicker\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.yearly.specificMonthDay)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.yearly.specificMonthDay)\n \">\n </cps-timepicker>\n <cps-checkbox\n data-testid=\"yearly-weekday-toggle\"\n (valueChanged)=\"regenerateCron()\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthDay'\n \"\n label=\"During the nearest weekday\"\n [(ngModel)]=\"state.yearly.runOnWeekday\"\n class=\"cps-scheduler-nearest-weekday-checkbox\">\n </cps-checkbox>\n </div>\n </cps-radio>\n\n <cps-radio\n [option]=\"{\n ariaLabel:\n 'Repeat in a selected month on a selected weekday at a chosen time',\n value: 'specificMonthWeek',\n disabled: disabled\n }\"\n data-testid=\"yearly-subtab-specificMonthWeek\">\n <div\n class=\"cps-scheduler-tab-pane-row\"\n [class.cps-scheduler-tab-pane-row-disabled]=\"\n state.yearly.subTab !== 'specificMonthWeek'\n \">\n On the\n <cps-select\n width=\"106px\"\n data-testid=\"yearly-week-select\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthWeek.monthWeek\"\n [options]=\"selectOptions.monthWeeks\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n <cps-select\n width=\"120px\"\n data-testid=\"yearly-weekday-select\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthWeek.day\"\n [options]=\"selectOptions.days\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n of\n <cps-select\n width=\"120px\"\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [returnObject]=\"false\"\n [hideDetails]=\"true\"\n (valueChanged)=\"regenerateCron()\"\n [(ngModel)]=\"state.yearly.specificMonthWeek.month\"\n [options]=\"selectOptions.months\"\n class=\"cps-scheduler-select-control\">\n </cps-select>\n at\n <cps-timepicker\n [disabled]=\"\n disabled || state.yearly.subTab !== 'specificMonthWeek'\n \"\n [use24HourTime]=\"use24HourTime\"\n [mandatoryValue]=\"true\"\n [value]=\"formatTimeValue(state.yearly.specificMonthWeek)\"\n [hideDetails]=\"true\"\n (valueChanged)=\"\n onTimeChanged($event, state.yearly.specificMonthWeek)\n \">\n </cps-timepicker>\n </div>\n </cps-radio>\n </cps-radio-group>\n </div>\n }\n\n @case ('Advanced') {\n <div data-testid=\"advanced-config\">\n <form [formGroup]=\"form\">\n <cps-input\n label=\"\"\n data-testid=\"advanced-cron-input\"\n [disabled]=\"disabled\"\n width=\"500px\"\n placeholder=\"Please enter\"\n formControlName=\"advanced\"\n (valueChanged)=\"regenerateCron()\">\n </cps-input>\n </form>\n </div>\n }\n }\n\n @if (cron && showTimeZone) {\n <div class=\"cps-scheduler-time-zone\" data-testid=\"timezone-selector\">\n <cps-autocomplete\n label=\"Time zone\"\n data-testid=\"timezone-select\"\n [(ngModel)]=\"timeZone\"\n (valueChanged)=\"onTimeZoneChanged($event)\"\n [returnObject]=\"false\"\n width=\"300\"\n [options]=\"timeZoneOptions\">\n </cps-autocomplete>\n </div>\n }\n</div>\n", styles: [":host .cps-scheduler-selector{margin-bottom:24px}:host .cps-scheduler-container{margin-top:10px;margin-left:16px}:host .cps-scheduler-container .cps-scheduler-select-control{margin-left:8px;margin-right:8px}:host .cps-scheduler-container .cps-scheduler-days-checkbox-group{max-width:700px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-template-rows:1fr 1fr;grid-gap:20px;margin-bottom:16px}:host .cps-scheduler-container .cps-scheduler-tab-pane{margin-bottom:28px}:host .cps-scheduler-container .cps-scheduler-tab-pane cps-radio-group ::ng-deep .cps-radio-group-content{margin-left:0!important}:host .cps-scheduler-container .cps-scheduler-tab-pane .cps-scheduler-tab-pane-row{display:flex;align-items:center}:host .cps-scheduler-container .cps-scheduler-tab-pane .cps-scheduler-tab-pane-row-disabled{color:var(--cps-color-text-light)}:host .cps-scheduler-container .cps-scheduler-tab-pane .cps-scheduler-nearest-weekday-checkbox{margin-left:16px}:host .cps-scheduler-container .cps-scheduler-tab-pane cps-timepicker{margin-left:8px}:host .cps-scheduler-container-disabled{color:var(--cps-color-text-light)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CpsButtonToggleComponent, selector: "cps-button-toggle", inputs: ["label", "ariaLabel", "options", "multiple", "disabled", "mandatory", "equalWidths", "optionTooltipPosition", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "optionIcon", "optionIconColor", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "numToleratedItems", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "optionsClass", "appearance", "showChevron", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: CpsRadioGroupComponent, selector: "cps-radio-group", inputs: ["options", "groupLabel", "ariaLabel", "vertical", "disabled", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "hint", "hideDetails", "value"], outputs: ["valueChanged", "blurred", "focused"] }, { kind: "component", type: CpsRadioComponent, selector: "cps-radio", inputs: ["option"] }, { kind: "component", type: CpsCheckboxComponent, selector: "cps-checkbox", inputs: ["label", "ariaLabel", "disabled", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "icon", "iconColor", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "component", type: CpsTimepickerComponent, selector: "cps-timepicker", inputs: ["label", "disabled", "use24HourTime", "withSeconds", "hint", "hideDetails", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "mandatoryValue", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: CpsAutocompleteComponent, selector: "cps-autocomplete", inputs: ["label", "ariaLabel", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "showChevron", "withOptionsAliases", "useOptionsAliasesWhenNoMatch", "optionAlias", "chips", "closableChips", "clearable", "openOnClear", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "loadingMessage", "showLoadingMessage", "emptyMessage", "showEmptyMessage", "virtualScroll", "numToleratedItems", "externalError", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "emptyOptionIndex", "inputChangeDebounceTime", "validating", "value", "options"], outputs: ["valueChanged", "inputChanged", "focused", "blurred"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8155
8155
|
}
|
|
8156
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
8156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSchedulerComponent, decorators: [{
|
|
8157
8157
|
type: Component,
|
|
8158
8158
|
args: [{ selector: 'cps-scheduler', imports: [
|
|
8159
8159
|
FormsModule,
|
|
@@ -8279,8 +8279,8 @@ class CpsSidebarMenuComponent {
|
|
|
8279
8279
|
toggleSidebar() {
|
|
8280
8280
|
this.isExpanded = !this.isExpanded;
|
|
8281
8281
|
}
|
|
8282
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
8283
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
8282
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSidebarMenuComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8283
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsSidebarMenuComponent, isStandalone: true, selector: "cps-sidebar-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, isExpanded: { classPropertyName: "isExpanded", publicName: "isExpanded", isSignal: false, isRequired: false, transformFunction: null }, exactRoutes: { classPropertyName: "exactRoutes", publicName: "exactRoutes", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "allMenus", predicate: ["popupMenu"], descendants: true }], ngImport: i0, template: "<div\n class=\"cps-sidebar-menu\"\n [style.height]=\"cvtHeight()\"\n [class.cps-sidebar-menu-collapsed]=\"!isExpanded\">\n <nav\n class=\"cps-sidebar-menubar\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-description]=\"`Sidebar ${isExpanded ? 'expanded' : 'collapsed'}`\">\n @for (item of items; track item) {\n @if (item.url) {\n <a\n class=\"cps-sidebar-menu-item\"\n tabindex=\"0\"\n [routerLink]=\"item.disabled ? null : [item.url]\"\n routerLinkActive=\"active\"\n ariaCurrentWhenActive=\"page\"\n [routerLinkActiveOptions]=\"{ exact: exactRoutes }\"\n [class.disabled]=\"item.disabled\"\n [attr.aria-disabled]=\"item.disabled || null\"\n [attr.aria-label]=\"item.title\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\" aria-hidden=\"true\">\n </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </a>\n }\n @if (!item.url) {\n <cps-menu\n #popupMenu\n [items]=\"item.items || []\"\n [header]=\"item.title\"\n [focusOnShow]=\"false\"\n showTransitionOptions=\"0s\"\n hideTransitionOptions=\"0s\"\n [withArrow]=\"false\"\n (containerMouseLeave)=\"leaveMenu($event, popupMenu)\">\n </cps-menu>\n <button\n type=\"button\"\n (mouseenter)=\"showMenu($event, popupMenu)\"\n (mouseleave)=\"leaveMenu($event, popupMenu)\"\n (focusin)=\"showMenu($event, popupMenu, item)\"\n (focusout)=\"leaveMenu($event, popupMenu)\"\n (click)=\"toggleMenu($event, popupMenu, item)\"\n class=\"cps-sidebar-menu-item menu-trigger\"\n [class.active]=\"isActive(item)\"\n [class.menu-open]=\"popupMenu.isVisible()\"\n [class.disabled]=\"item.disabled\"\n [attr.aria-haspopup]=\"'menu'\"\n [attr.aria-expanded]=\"\n focusedItemWithMenu === item ? popupMenu.isVisible() : null\n \"\n [attr.aria-current]=\"isActive(item) ? 'page' : null\"\n [attr.aria-disabled]=\"item.disabled || null\"\n [attr.aria-label]=\"item.title\">\n <cps-icon [icon]=\"item.icon\" size=\"normal\" aria-hidden=\"true\">\n </cps-icon>\n <span\n class=\"cps-sidebar-menu-item-label\"\n [@onExpand]=\"isExpanded ? 'expanded' : 'collapsed'\">\n {{ item.title }}\n </span>\n </button>\n }\n }\n </nav>\n <button\n type=\"button\"\n class=\"expand-area\"\n (click)=\"toggleSidebar()\"\n [attr.aria-label]=\"isExpanded ? 'Collapse sidebar' : 'Expand sidebar'\"\n [attr.aria-expanded]=\"isExpanded\">\n <cps-icon icon=\"menu-shrink\" size=\"normal\" aria-hidden=\"true\"> </cps-icon>\n </button>\n</div>\n", styles: [":host .cps-sidebar-menu{display:inline-flex;flex-direction:column;justify-content:flex-start;align-items:center;box-shadow:0 0 3.75rem #0000001a;width:5rem;transition-duration:.2s;overflow:hidden;position:relative}:host .cps-sidebar-menu .cps-sidebar-menubar{width:100%}:host .cps-sidebar-menu .expand-area{cursor:pointer;display:flex;justify-content:center;height:1.5rem;position:absolute;bottom:5%;background:none;border:none;padding:0;font:inherit;color:inherit}:host .cps-sidebar-menu .expand-area cps-icon{transition:transform .2s cubic-bezier(.4,0,.2,1)}:host .cps-sidebar-menu .expand-area:focus-visible{outline:none;position:relative}:host .cps-sidebar-menu .expand-area:focus-visible:before,:host .cps-sidebar-menu .expand-area:focus-visible:after{content:\"\";position:absolute;border-radius:0}:host .cps-sidebar-menu .expand-area:focus-visible:before{inset:0;border:.0625rem solid var(--cps-color-calm)}:host .cps-sidebar-menu .expand-area:focus-visible:after{inset:.0625rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-sidebar-menu .expand-area:focus-visible.suppress-focus-visible:before,:host .cps-sidebar-menu .expand-area:focus-visible.suppress-focus-visible:after{display:none}:host .cps-sidebar-menu .expand-area:focus-visible{position:absolute}:host .cps-sidebar-menu .expand-area:hover,:host .cps-sidebar-menu .expand-area:focus-visible{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:5rem;text-decoration:none;color:var(--cps-color-text-darkest);border-bottom:.0625rem solid var(--cps-color-line-mid);-webkit-user-select:none;user-select:none;background:none;border-left:none;border-right:none;border-top:none;padding:0;font:inherit}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible{outline:none;position:relative}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible:before,:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible:after{content:\"\";position:absolute;border-radius:0}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible:before{inset:0;border:.0625rem solid var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible:after{inset:.0625rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible.suppress-focus-visible:before,:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible.suppress-focus-visible:after{display:none}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible:not(.active):not(.disabled){background:var(--cps-color-highlight-hover);color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:focus-visible:not(.active):not(.disabled) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item .cps-sidebar-menu-item-label{font-weight:600;font-size:.6875rem;line-height:.8125rem;width:5rem;color:var(--cps-color-text-darkest);text-align:center}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active):not(.disabled){background:var(--cps-color-highlight-hover);color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:hover:not(.active):not(.disabled) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item:active:not(.active):not(.disabled){background:var(--cps-color-highlight-active)}:host .cps-sidebar-menu .cps-sidebar-menu-item.active{background:var(--cps-color-calm);color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.active .cps-sidebar-menu-item-label{color:#fff}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active):not(.disabled){background:var(--cps-color-highlight-active);color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-open:not(.active):not(.disabled) .cps-sidebar-menu-item-label{color:var(--cps-color-calm)}:host .cps-sidebar-menu .cps-sidebar-menu-item.menu-trigger{cursor:pointer}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled{cursor:default;background:var(--cps-color-bg-disabled);color:var(--cps-color-text-mild)}:host .cps-sidebar-menu .cps-sidebar-menu-item.disabled .cps-sidebar-menu-item-label{color:var(--cps-color-text-mild)}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed{width:2.5rem}:host .cps-sidebar-menu.cps-sidebar-menu-collapsed .expand-area cps-icon{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], animations: [
|
|
8284
8284
|
trigger('onExpand', [
|
|
8285
8285
|
state('collapsed', style({
|
|
8286
8286
|
marginTop: '0',
|
|
@@ -8298,7 +8298,7 @@ class CpsSidebarMenuComponent {
|
|
|
8298
8298
|
])
|
|
8299
8299
|
] }); }
|
|
8300
8300
|
}
|
|
8301
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
8301
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSidebarMenuComponent, decorators: [{
|
|
8302
8302
|
type: Component,
|
|
8303
8303
|
args: [{ selector: 'cps-sidebar-menu', imports: [CommonModule, CpsMenuComponent, CpsIconComponent, RouterModule], animations: [
|
|
8304
8304
|
trigger('onExpand', [
|
|
@@ -8425,10 +8425,10 @@ class CpsSwitchComponent {
|
|
|
8425
8425
|
focus() {
|
|
8426
8426
|
this._elementRef?.nativeElement?.querySelector('input')?.focus();
|
|
8427
8427
|
}
|
|
8428
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
8429
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
8428
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSwitchComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8429
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsSwitchComponent, isStandalone: true, selector: "cps-switch", inputs: { label: "label", disabled: "disabled", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", value: "value" }, outputs: { valueChanged: "valueChanged" }, ngImport: i0, template: "<div class=\"cps-switch-container\">\n <label class=\"cps-switch\">\n <input\n type=\"checkbox\"\n [disabled]=\"disabled\"\n [checked]=\"value\"\n (change)=\"updateValueEvent($event)\" />\n <span class=\"cps-switch-slider\"></span>\n </label>\n @if (label) {\n <span\n class=\"cps-switch-label\"\n [ngClass]=\"{ 'cps-switch-label-disabled': disabled }\"\n >{{ label }}</span\n >\n }\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-switch-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n</div>\n", styles: [":host{min-width:max-content;display:inline-block}:host .cps-switch-container{line-height:normal;display:flex;align-items:center}:host .cps-switch-container .cps-switch{position:relative;display:inline-block;width:48px;height:24px}:host .cps-switch-container .cps-switch input{opacity:0;width:0;height:0}:host .cps-switch-container .cps-switch-slider{position:absolute;cursor:pointer;inset:0;background-color:#fff;transition:.2s;border:1px solid var(--cps-color-calm);border-radius:30px}:host .cps-switch-container .cps-switch-label{font-size:16px;font-family:Source Sans Pro,sans-serif;font-style:normal;color:var(--cps-color-text-dark);margin-left:10px;cursor:default}:host .cps-switch-container .cps-switch-label-disabled{color:var(--cps-color-text-light)}:host .cps-switch-container .cps-switch-slider:before{position:absolute;content:\"\";height:14px;width:14px;border-radius:20px;left:4px;bottom:4px;background-color:var(--cps-color-calm);transition:.2s}:host .cps-switch-container input:checked+.cps-switch-slider{background-color:var(--cps-color-calm)}:host .cps-switch-container input:focus+.cps-switch-slider{box-shadow:0 0 1px var(--cps-color-calm)}:host .cps-switch-container input:checked+.cps-switch-slider:before{transform:translate(24px);background-color:#fff}:host .cps-switch-container input:disabled~.cps-switch-slider{cursor:default;border-color:var(--cps-color-text-lightest)}:host .cps-switch-container input:disabled:checked~.cps-switch-slider{background-color:var(--cps-color-text-lightest)}:host .cps-switch-container input:disabled:not(:checked)~.cps-switch-slider:before{background-color:var(--cps-color-text-lightest)}:host .cps-switch-container .cps-switch-info-circle{margin-left:8px}:host .cps-switch-container .cps-switch-info-circle ::ng-deep cps-icon i{width:14px;height:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }] }); }
|
|
8430
8430
|
}
|
|
8431
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
8431
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSwitchComponent, decorators: [{
|
|
8432
8432
|
type: Component,
|
|
8433
8433
|
args: [{ imports: [CommonModule, CpsInfoCircleComponent], selector: 'cps-switch', template: "<div class=\"cps-switch-container\">\n <label class=\"cps-switch\">\n <input\n type=\"checkbox\"\n [disabled]=\"disabled\"\n [checked]=\"value\"\n (change)=\"updateValueEvent($event)\" />\n <span class=\"cps-switch-slider\"></span>\n </label>\n @if (label) {\n <span\n class=\"cps-switch-label\"\n [ngClass]=\"{ 'cps-switch-label-disabled': disabled }\"\n >{{ label }}</span\n >\n }\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-switch-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n</div>\n", styles: [":host{min-width:max-content;display:inline-block}:host .cps-switch-container{line-height:normal;display:flex;align-items:center}:host .cps-switch-container .cps-switch{position:relative;display:inline-block;width:48px;height:24px}:host .cps-switch-container .cps-switch input{opacity:0;width:0;height:0}:host .cps-switch-container .cps-switch-slider{position:absolute;cursor:pointer;inset:0;background-color:#fff;transition:.2s;border:1px solid var(--cps-color-calm);border-radius:30px}:host .cps-switch-container .cps-switch-label{font-size:16px;font-family:Source Sans Pro,sans-serif;font-style:normal;color:var(--cps-color-text-dark);margin-left:10px;cursor:default}:host .cps-switch-container .cps-switch-label-disabled{color:var(--cps-color-text-light)}:host .cps-switch-container .cps-switch-slider:before{position:absolute;content:\"\";height:14px;width:14px;border-radius:20px;left:4px;bottom:4px;background-color:var(--cps-color-calm);transition:.2s}:host .cps-switch-container input:checked+.cps-switch-slider{background-color:var(--cps-color-calm)}:host .cps-switch-container input:focus+.cps-switch-slider{box-shadow:0 0 1px var(--cps-color-calm)}:host .cps-switch-container input:checked+.cps-switch-slider:before{transform:translate(24px);background-color:#fff}:host .cps-switch-container input:disabled~.cps-switch-slider{cursor:default;border-color:var(--cps-color-text-lightest)}:host .cps-switch-container input:disabled:checked~.cps-switch-slider{background-color:var(--cps-color-text-lightest)}:host .cps-switch-container input:disabled:not(:checked)~.cps-switch-slider:before{background-color:var(--cps-color-text-lightest)}:host .cps-switch-container .cps-switch-info-circle{margin-left:8px}:host .cps-switch-container .cps-switch-info-circle ::ng-deep cps-icon i{width:14px;height:14px}\n"] }]
|
|
8434
8434
|
}], ctorParameters: () => [{ type: i1$2.NgControl, decorators: [{
|
|
@@ -8520,10 +8520,10 @@ class CpsTabComponent {
|
|
|
8520
8520
|
}
|
|
8521
8521
|
}
|
|
8522
8522
|
}
|
|
8523
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
8524
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
8523
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8524
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsTabComponent, isStandalone: true, selector: "cps-tab", inputs: { label: "label", ariaLabel: "ariaLabel", icon: "icon", disabled: "disabled", tooltipText: "tooltipText", tooltipContentClass: "tooltipContentClass", tooltipMaxWidth: "tooltipMaxWidth", tooltipPersistent: "tooltipPersistent", badgeValue: "badgeValue", badgeTooltip: "badgeTooltip" }, viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n\n<ng-container *ngTemplateOutlet=\"content\"></ng-container>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8525
8525
|
}
|
|
8526
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
8526
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTabComponent, decorators: [{
|
|
8527
8527
|
type: Component,
|
|
8528
8528
|
args: [{ imports: [CommonModule], selector: 'cps-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n\n<ng-container *ngTemplateOutlet=\"content\"></ng-container>\n" }]
|
|
8529
8529
|
}], propDecorators: { label: [{
|
|
@@ -8886,8 +8886,8 @@ class CpsTabGroupComponent {
|
|
|
8886
8886
|
parseFloat(style.borderRightWidth);
|
|
8887
8887
|
return width;
|
|
8888
8888
|
}
|
|
8889
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
8890
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsTabGroupComponent, isStandalone: true, selector: "cps-tab-group", inputs: { selectedIndex: "selectedIndex", isSubTabs: "isSubTabs", alignment: "alignment", autoActivation: "autoActivation", contentWrapClass: "contentWrapClass", headerClass: "headerClass", stretched: "stretched", animationType: "animationType", navButtonsBackground: "navButtonsBackground", tabsBackground: "tabsBackground" }, outputs: { beforeTabChanged: "beforeTabChanged", afterTabChanged: "afterTabChanged" }, queries: [{ propertyName: "tabs", predicate: CpsTabComponent }], viewQueries: [{ propertyName: "_tabPanelEls", predicate: ["tabPanel"], descendants: true, isSignal: true }, { propertyName: "tabsList", first: true, predicate: ["tabsList"], descendants: true }, { propertyName: "backBtn", first: true, predicate: ["backBtn"], descendants: true }, { propertyName: "forwardBtn", first: true, predicate: ["forwardBtn"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"cps-tabs\"\n [class]=\"headerClass\"\n [ngClass]=\"{\n 'cps-tabs-subtabs': isSubTabs,\n 'cps-tabs-center-aligned': alignment === 'center',\n 'cps-tabs-right-aligned': alignment === 'right',\n 'cps-tabs-stretched': stretched\n }\"\n [ngStyle]=\"{ 'background-color': tabsBackground }\">\n @if (!backBtnVisible) {\n <button\n type=\"button\"\n class=\"nav-btn nav-btn-back\"\n [style.background-color]=\"navButtonsBackground\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n #backBtn\n (click)=\"navBackward()\">\n <cps-icon\n icon=\"chevron-down\"\n color=\"text-dark\"\n aria-hidden=\"true\"></cps-icon>\n </button>\n }\n <ul #tabsList class=\"cps-tabs-list\" role=\"tablist\" tabindex=\"-1\">\n @for (tab of tabs; track tab; let tabIndex = $index) {\n @if (tab.tooltipText) {\n <li\n class=\"cps-tab\"\n role=\"tab\"\n [id]=\"getTabId(tabIndex)\"\n [attr.aria-label]=\"getTabAriaLabel(tab)\"\n [attr.aria-selected]=\"tab.active\"\n [attr.aria-disabled]=\"tab.disabled ? true : null\"\n [attr.tabindex]=\"getTabFocusOrderTabIndex(tabIndex)\"\n [attr.aria-controls]=\"getPanelId(tabIndex)\"\n (click)=\"!tab.disabled ? onTabClick(tabIndex) : ''\"\n (mousedown)=\"onMouseDown($event)\"\n (keydown)=\"onTabKeydown($event, tabIndex)\"\n [class.active]=\"tab.active\"\n [class.disabled]=\"tab.disabled\"\n [cpsTooltip]=\"tab.tooltipText\"\n tooltipOpenDelay=\"1000\"\n tooltipCloseDelay=\"0\"\n tooltipPosition=\"bottom\"\n [tooltipMaxWidth]=\"tab.tooltipMaxWidth\"\n [tooltipPersistent]=\"tab.tooltipPersistent\"\n [tooltipContentClass]=\"tab.tooltipContentClass\">\n <ng-container\n *ngTemplateOutlet=\"\n tabHeaderTemplate;\n context: {\n tab: tab\n }\n \"></ng-container>\n </li>\n } @else {\n <li\n class=\"cps-tab\"\n role=\"tab\"\n [id]=\"getTabId(tabIndex)\"\n [attr.aria-label]=\"getTabAriaLabel(tab)\"\n [attr.aria-selected]=\"tab.active\"\n [attr.aria-disabled]=\"tab.disabled ? true : null\"\n [attr.tabindex]=\"getTabFocusOrderTabIndex(tabIndex)\"\n [attr.aria-controls]=\"getPanelId(tabIndex)\"\n (click)=\"!tab.disabled ? onTabClick(tabIndex) : ''\"\n (mousedown)=\"onMouseDown($event)\"\n (keydown)=\"onTabKeydown($event, tabIndex)\"\n [class.active]=\"tab.active\"\n [class.disabled]=\"tab.disabled\">\n <ng-container\n *ngTemplateOutlet=\"\n tabHeaderTemplate;\n context: {\n tab: tab\n }\n \"></ng-container>\n </li>\n }\n }\n </ul>\n @if (!forwardBtnVisible) {\n <button\n type=\"button\"\n class=\"nav-btn nav-btn-forward\"\n [style.background-color]=\"navButtonsBackground\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n #forwardBtn\n (click)=\"navForward()\">\n <cps-icon\n icon=\"chevron-down\"\n color=\"text-dark\"\n aria-hidden=\"true\"></cps-icon>\n </button>\n }\n</div>\n<div\n class=\"cps-tab-content-wrap\"\n [class]=\"contentWrapClass\"\n [ngClass]=\"{\n 'cps-tab-content-wrap-subtabs': isSubTabs\n }\">\n @for (tab of tabs; track tab; let panelIndex = $index) {\n <div\n #tabPanel\n class=\"cps-tab-content\"\n role=\"tabpanel\"\n [id]=\"getPanelId(panelIndex)\"\n [attr.aria-labelledby]=\"getTabId(panelIndex)\"\n [attr.tabindex]=\"tab.active ? panelTabindex() : null\"\n [hidden]=\"!tab.active\"\n (mousedown)=\"onMouseDown($event)\">\n @if (tab.active) {\n @if (animationType === 'slide') {\n <div [@slideInOut]=\"animationState\" class=\"cps-tab-content-inner\">\n <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n </div>\n }\n @if (animationType === 'fade') {\n <div [@fadeInOut]=\"animationState\" class=\"cps-tab-content-inner\">\n <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n </div>\n }\n }\n </div>\n }\n</div>\n\n<ng-template #tabHeaderTemplate let-tab=\"tab\">\n @if (tab.icon) {\n <cps-icon class=\"cps-tab-icon\" [icon]=\"tab.icon\" aria-hidden=\"true\">\n </cps-icon>\n }\n <span class=\"cps-tab-link\">{{ tab.label }}</span>\n @if (tab.badgeValue) {\n @if (tab.badgeTooltip) {\n <div\n class=\"cps-tab-badge\"\n [cpsTooltip]=\"tab.badgeTooltip\"\n aria-hidden=\"true\">\n <span>{{ tab.badgeValue }}</span>\n </div>\n } @else {\n <div class=\"cps-tab-badge\" aria-hidden=\"true\">\n <span>{{ tab.badgeValue }}</span>\n </div>\n }\n }\n</ng-template>\n", styles: [":host{background-color:inherit;margin:0!important;display:flex;flex-direction:column;max-width:100%}:host .cps-tabs{display:flex;position:relative}:host .cps-tabs .nav-btn{display:flex;justify-content:center;align-items:center;width:2rem;cursor:pointer;position:absolute;height:100%;border:none;padding:0;background:transparent;z-index:1}:host .cps-tabs .nav-btn:hover ::ng-deep cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host .cps-tabs .nav-btn-back{left:0;box-shadow:.125rem 0 .125rem -.0625rem #0003}:host .cps-tabs .nav-btn-back cps-icon{transform:rotate(90deg)}:host .cps-tabs .nav-btn-forward{right:0;box-shadow:-.125rem 0 .125rem -.0625rem #0003}:host .cps-tabs .nav-btn-forward cps-icon{transform:rotate(270deg)}:host .cps-tabs .cps-tabs-list{display:flex;list-style:none;padding:0;margin:0;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;overscroll-behavior:contain auto;-ms-overflow-style:none;scrollbar-width:none}:host .cps-tabs .cps-tabs-list .cps-tab{display:inline-flex;align-items:center;justify-content:center;min-width:9.375rem;padding:0 1.5rem;font-family:Source Sans Pro,sans-serif;font-style:normal;font-weight:500;font-size:.9375rem;line-height:1.25rem;color:var(--cps-color-text-dark);opacity:1;cursor:pointer;border-bottom:.1875rem solid transparent;transition:border-bottom .2s}:host .cps-tabs .cps-tabs-list .cps-tab.active:not(.disabled){color:var(--cps-color-calm)}:host .cps-tabs .cps-tabs-list .cps-tab.disabled{cursor:default;color:var(--cps-color-text-mild)}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible{outline:none;position:relative}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:after{content:\"\";position:absolute;border-radius:0}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:before{inset:.0625rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:after{inset:0;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible.suppress-focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible.suppress-focus-visible:after{display:none}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-link{text-decoration:none;padding:.625rem;color:inherit}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge{min-width:1.25rem;padding:0 .1875rem;height:1.25rem;border-radius:50%;background-color:var(--cps-color-surprise);color:#fff;font-size:.75rem;display:flex;align-items:center;justify-content:center}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible{outline:none;position:relative}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible.suppress-focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible.suppress-focus-visible:after{display:none}:host .cps-tabs .cps-tabs-list::-webkit-scrollbar{display:none}:host .cps-tabs.cps-tabs-center-aligned{justify-content:center}:host .cps-tabs.cps-tabs-right-aligned{justify-content:flex-end}:host .cps-tabs.cps-tabs-stretched ul{flex-grow:1}:host .cps-tabs.cps-tabs-stretched ul li{flex-grow:1}:host .cps-tabs:not(.cps-tabs-subtabs){border-bottom:.0625rem solid rgba(0,0,0,.12)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab.active:not(.disabled){border-bottom:.1875rem solid var(--cps-color-surprise)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab.active.disabled{border-bottom:.1875rem solid var(--cps-color-line-dark)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab:hover:not(:active,.active,.disabled),:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab:focus-visible:not(:active,.active,.disabled){border-bottom:.1875rem solid var(--cps-color-line-light)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab:active:not(.disabled,.active){border-bottom:.1875rem solid var(--cps-color-line-mid)}:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab{height:2.0625rem;background-color:#d7d7d759}:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab.active{background-color:#fff}:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab:hover:not(.disabled),:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab:focus-visible:not(.disabled){color:var(--cps-color-calm)}:host .cps-tab-content-wrap{display:flex;position:relative;min-height:6.25rem;font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-dark);flex:1;border-bottom:none;overflow:hidden}:host .cps-tab-content-wrap .cps-tab-content{display:block;position:relative;overflow-x:hidden;overflow-y:auto;flex-grow:1;flex-basis:100%;inset:0;outline:0}:host .cps-tab-content-wrap .cps-tab-content[hidden]{display:none!important}:host .cps-tab-content-wrap .cps-tab-content:focus-visible{outline:none;position:relative}:host .cps-tab-content-wrap .cps-tab-content:focus-visible:before,:host .cps-tab-content-wrap .cps-tab-content:focus-visible:after{content:\"\";position:absolute;border-radius:0}:host .cps-tab-content-wrap .cps-tab-content:focus-visible:before{inset:.0625rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-tab-content-wrap .cps-tab-content:focus-visible:after{inset:0;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-tab-content-wrap .cps-tab-content:focus-visible.suppress-focus-visible:before,:host .cps-tab-content-wrap .cps-tab-content:focus-visible.suppress-focus-visible:after{display:none}:host .cps-tab-content-wrap .cps-tab-content .cps-tab-content-inner{height:100%;overflow:auto}:host .cps-tab-content-wrap.cps-tab-content-wrap-subtabs{background-color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }], animations: [
|
|
8889
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTabGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8890
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTabGroupComponent, isStandalone: true, selector: "cps-tab-group", inputs: { selectedIndex: "selectedIndex", isSubTabs: "isSubTabs", alignment: "alignment", autoActivation: "autoActivation", contentWrapClass: "contentWrapClass", headerClass: "headerClass", stretched: "stretched", animationType: "animationType", navButtonsBackground: "navButtonsBackground", tabsBackground: "tabsBackground" }, outputs: { beforeTabChanged: "beforeTabChanged", afterTabChanged: "afterTabChanged" }, queries: [{ propertyName: "tabs", predicate: CpsTabComponent }], viewQueries: [{ propertyName: "_tabPanelEls", predicate: ["tabPanel"], descendants: true, isSignal: true }, { propertyName: "tabsList", first: true, predicate: ["tabsList"], descendants: true }, { propertyName: "backBtn", first: true, predicate: ["backBtn"], descendants: true }, { propertyName: "forwardBtn", first: true, predicate: ["forwardBtn"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"cps-tabs\"\n [class]=\"headerClass\"\n [ngClass]=\"{\n 'cps-tabs-subtabs': isSubTabs,\n 'cps-tabs-center-aligned': alignment === 'center',\n 'cps-tabs-right-aligned': alignment === 'right',\n 'cps-tabs-stretched': stretched\n }\"\n [ngStyle]=\"{ 'background-color': tabsBackground }\">\n @if (!backBtnVisible) {\n <button\n type=\"button\"\n class=\"nav-btn nav-btn-back\"\n [style.background-color]=\"navButtonsBackground\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n #backBtn\n (click)=\"navBackward()\">\n <cps-icon\n icon=\"chevron-down\"\n color=\"text-dark\"\n aria-hidden=\"true\"></cps-icon>\n </button>\n }\n <ul #tabsList class=\"cps-tabs-list\" role=\"tablist\" tabindex=\"-1\">\n @for (tab of tabs; track tab; let tabIndex = $index) {\n @if (tab.tooltipText) {\n <li\n class=\"cps-tab\"\n role=\"tab\"\n [id]=\"getTabId(tabIndex)\"\n [attr.aria-label]=\"getTabAriaLabel(tab)\"\n [attr.aria-selected]=\"tab.active\"\n [attr.aria-disabled]=\"tab.disabled ? true : null\"\n [attr.tabindex]=\"getTabFocusOrderTabIndex(tabIndex)\"\n [attr.aria-controls]=\"getPanelId(tabIndex)\"\n (click)=\"!tab.disabled ? onTabClick(tabIndex) : ''\"\n (mousedown)=\"onMouseDown($event)\"\n (keydown)=\"onTabKeydown($event, tabIndex)\"\n [class.active]=\"tab.active\"\n [class.disabled]=\"tab.disabled\"\n [cpsTooltip]=\"tab.tooltipText\"\n tooltipOpenDelay=\"1000\"\n tooltipCloseDelay=\"0\"\n tooltipPosition=\"bottom\"\n [tooltipMaxWidth]=\"tab.tooltipMaxWidth\"\n [tooltipPersistent]=\"tab.tooltipPersistent\"\n [tooltipContentClass]=\"tab.tooltipContentClass\">\n <ng-container\n *ngTemplateOutlet=\"\n tabHeaderTemplate;\n context: {\n tab: tab\n }\n \"></ng-container>\n </li>\n } @else {\n <li\n class=\"cps-tab\"\n role=\"tab\"\n [id]=\"getTabId(tabIndex)\"\n [attr.aria-label]=\"getTabAriaLabel(tab)\"\n [attr.aria-selected]=\"tab.active\"\n [attr.aria-disabled]=\"tab.disabled ? true : null\"\n [attr.tabindex]=\"getTabFocusOrderTabIndex(tabIndex)\"\n [attr.aria-controls]=\"getPanelId(tabIndex)\"\n (click)=\"!tab.disabled ? onTabClick(tabIndex) : ''\"\n (mousedown)=\"onMouseDown($event)\"\n (keydown)=\"onTabKeydown($event, tabIndex)\"\n [class.active]=\"tab.active\"\n [class.disabled]=\"tab.disabled\">\n <ng-container\n *ngTemplateOutlet=\"\n tabHeaderTemplate;\n context: {\n tab: tab\n }\n \"></ng-container>\n </li>\n }\n }\n </ul>\n @if (!forwardBtnVisible) {\n <button\n type=\"button\"\n class=\"nav-btn nav-btn-forward\"\n [style.background-color]=\"navButtonsBackground\"\n aria-hidden=\"true\"\n tabindex=\"-1\"\n #forwardBtn\n (click)=\"navForward()\">\n <cps-icon\n icon=\"chevron-down\"\n color=\"text-dark\"\n aria-hidden=\"true\"></cps-icon>\n </button>\n }\n</div>\n<div\n class=\"cps-tab-content-wrap\"\n [class]=\"contentWrapClass\"\n [ngClass]=\"{\n 'cps-tab-content-wrap-subtabs': isSubTabs\n }\">\n @for (tab of tabs; track tab; let panelIndex = $index) {\n <div\n #tabPanel\n class=\"cps-tab-content\"\n role=\"tabpanel\"\n [id]=\"getPanelId(panelIndex)\"\n [attr.aria-labelledby]=\"getTabId(panelIndex)\"\n [attr.tabindex]=\"tab.active ? panelTabindex() : null\"\n [hidden]=\"!tab.active\"\n (mousedown)=\"onMouseDown($event)\">\n @if (tab.active) {\n @if (animationType === 'slide') {\n <div [@slideInOut]=\"animationState\" class=\"cps-tab-content-inner\">\n <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n </div>\n }\n @if (animationType === 'fade') {\n <div [@fadeInOut]=\"animationState\" class=\"cps-tab-content-inner\">\n <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n </div>\n }\n }\n </div>\n }\n</div>\n\n<ng-template #tabHeaderTemplate let-tab=\"tab\">\n @if (tab.icon) {\n <cps-icon class=\"cps-tab-icon\" [icon]=\"tab.icon\" aria-hidden=\"true\">\n </cps-icon>\n }\n <span class=\"cps-tab-link\">{{ tab.label }}</span>\n @if (tab.badgeValue) {\n @if (tab.badgeTooltip) {\n <div\n class=\"cps-tab-badge\"\n [cpsTooltip]=\"tab.badgeTooltip\"\n aria-hidden=\"true\">\n <span>{{ tab.badgeValue }}</span>\n </div>\n } @else {\n <div class=\"cps-tab-badge\" aria-hidden=\"true\">\n <span>{{ tab.badgeValue }}</span>\n </div>\n }\n }\n</ng-template>\n", styles: [":host{background-color:inherit;margin:0!important;display:flex;flex-direction:column;max-width:100%}:host .cps-tabs{display:flex;position:relative}:host .cps-tabs .nav-btn{display:flex;justify-content:center;align-items:center;width:2rem;cursor:pointer;position:absolute;height:100%;border:none;padding:0;background:transparent;z-index:1}:host .cps-tabs .nav-btn:hover ::ng-deep cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host .cps-tabs .nav-btn-back{left:0;box-shadow:.125rem 0 .125rem -.0625rem #0003}:host .cps-tabs .nav-btn-back cps-icon{transform:rotate(90deg)}:host .cps-tabs .nav-btn-forward{right:0;box-shadow:-.125rem 0 .125rem -.0625rem #0003}:host .cps-tabs .nav-btn-forward cps-icon{transform:rotate(270deg)}:host .cps-tabs .cps-tabs-list{display:flex;list-style:none;padding:0;margin:0;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;overscroll-behavior:contain auto;-ms-overflow-style:none;scrollbar-width:none}:host .cps-tabs .cps-tabs-list .cps-tab{display:inline-flex;align-items:center;justify-content:center;min-width:9.375rem;padding:0 1.5rem;font-family:Source Sans Pro,sans-serif;font-style:normal;font-weight:500;font-size:.9375rem;line-height:1.25rem;color:var(--cps-color-text-dark);opacity:1;cursor:pointer;border-bottom:.1875rem solid transparent;transition:border-bottom .2s}:host .cps-tabs .cps-tabs-list .cps-tab.active:not(.disabled){color:var(--cps-color-calm)}:host .cps-tabs .cps-tabs-list .cps-tab.disabled{cursor:default;color:var(--cps-color-text-mild)}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible{outline:none;position:relative}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:after{content:\"\";position:absolute;border-radius:0}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:before{inset:.0625rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible:after{inset:0;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible.suppress-focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab:focus-visible.suppress-focus-visible:after{display:none}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-link{text-decoration:none;padding:.625rem;color:inherit}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge{min-width:1.25rem;padding:0 .1875rem;height:1.25rem;border-radius:50%;background-color:var(--cps-color-surprise);color:#fff;font-size:.75rem;display:flex;align-items:center;justify-content:center}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible{outline:none;position:relative}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:after{content:\"\";position:absolute;border-radius:50%}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible.suppress-focus-visible:before,:host .cps-tabs .cps-tabs-list .cps-tab .cps-tab-badge:focus-visible.suppress-focus-visible:after{display:none}:host .cps-tabs .cps-tabs-list::-webkit-scrollbar{display:none}:host .cps-tabs.cps-tabs-center-aligned{justify-content:center}:host .cps-tabs.cps-tabs-right-aligned{justify-content:flex-end}:host .cps-tabs.cps-tabs-stretched ul{flex-grow:1}:host .cps-tabs.cps-tabs-stretched ul li{flex-grow:1}:host .cps-tabs:not(.cps-tabs-subtabs){border-bottom:.0625rem solid rgba(0,0,0,.12)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab.active:not(.disabled){border-bottom:.1875rem solid var(--cps-color-surprise)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab.active.disabled{border-bottom:.1875rem solid var(--cps-color-line-dark)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab:hover:not(:active,.active,.disabled),:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab:focus-visible:not(:active,.active,.disabled){border-bottom:.1875rem solid var(--cps-color-line-light)}:host .cps-tabs:not(.cps-tabs-subtabs) .cps-tabs-list .cps-tab:active:not(.disabled,.active){border-bottom:.1875rem solid var(--cps-color-line-mid)}:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab{height:2.0625rem;background-color:#d7d7d759}:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab.active{background-color:#fff}:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab:hover:not(.disabled),:host .cps-tabs.cps-tabs-subtabs .cps-tabs-list .cps-tab:focus-visible:not(.disabled){color:var(--cps-color-calm)}:host .cps-tab-content-wrap{display:flex;position:relative;min-height:6.25rem;font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-dark);flex:1;border-bottom:none;overflow:hidden}:host .cps-tab-content-wrap .cps-tab-content{display:block;position:relative;overflow-x:hidden;overflow-y:auto;flex-grow:1;flex-basis:100%;inset:0;outline:0}:host .cps-tab-content-wrap .cps-tab-content[hidden]{display:none!important}:host .cps-tab-content-wrap .cps-tab-content:focus-visible{outline:none;position:relative}:host .cps-tab-content-wrap .cps-tab-content:focus-visible:before,:host .cps-tab-content-wrap .cps-tab-content:focus-visible:after{content:\"\";position:absolute;border-radius:0}:host .cps-tab-content-wrap .cps-tab-content:focus-visible:before{inset:.0625rem;border:.0625rem solid var(--cps-color-calm)}:host .cps-tab-content-wrap .cps-tab-content:focus-visible:after{inset:0;border:.0625rem solid var(--cps-color-calm-highlighten)}:host .cps-tab-content-wrap .cps-tab-content:focus-visible.suppress-focus-visible:before,:host .cps-tab-content-wrap .cps-tab-content:focus-visible.suppress-focus-visible:after{display:none}:host .cps-tab-content-wrap .cps-tab-content .cps-tab-content-inner{height:100%;overflow:auto}:host .cps-tab-content-wrap.cps-tab-content-wrap-subtabs{background-color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "directive", type: CpsTooltipDirective, selector: "[cpsTooltip]", inputs: ["cpsTooltip", "tooltipOpenDelay", "tooltipCloseDelay", "tooltipOpenOn", "tooltipPosition", "tooltipPersistent", "tooltipDisabled", "tooltipMaxWidth", "tooltipContentClass", "tooltipOffset"] }], animations: [
|
|
8891
8891
|
trigger('slideInOut', [
|
|
8892
8892
|
state('slideLeft', style({ transform: 'translateX(0)' })),
|
|
8893
8893
|
state('slideRight', style({ transform: 'translateX(0)' })),
|
|
@@ -8915,7 +8915,7 @@ class CpsTabGroupComponent {
|
|
|
8915
8915
|
])
|
|
8916
8916
|
] }); }
|
|
8917
8917
|
}
|
|
8918
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
8918
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTabGroupComponent, decorators: [{
|
|
8919
8919
|
type: Component,
|
|
8920
8920
|
args: [{ imports: [CommonModule, CpsIconComponent, CpsTooltipDirective], selector: 'cps-tab-group', animations: [
|
|
8921
8921
|
trigger('slideInOut', [
|
|
@@ -9097,10 +9097,10 @@ class TableRowMenuComponent {
|
|
|
9097
9097
|
}
|
|
9098
9098
|
}
|
|
9099
9099
|
}
|
|
9100
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9101
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
9100
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableRowMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9101
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: TableRowMenuComponent, isStandalone: true, selector: "table-row-menu", inputs: { showRowRemoveButton: "showRowRemoveButton", customItems: "customItems", showRowEditButton: "showRowEditButton" }, outputs: { editRowBtnClicked: "editRowBtnClicked", removeRowBtnClicked: "removeRowBtnClicked" }, ngImport: i0, template: "<cps-menu #rowMenu [items]=\"items\" [compressed]=\"true\" [withArrow]=\"false\">\n</cps-menu>\n<cps-icon\n icon=\"dropdown-menu\"\n size=\"22\"\n (click)=\"rowMenu.toggle($event)\"\n class=\"cps-table-row-menu-icon\">\n</cps-icon>\n", styles: [":host{height:22px;display:block}:host .cps-table-row-menu-icon{cursor:pointer}:host .cps-table-row-menu-icon:hover{color:var(--cps-color-calm)}\n"], dependencies: [{ kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }] }); }
|
|
9102
9102
|
}
|
|
9103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
9103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableRowMenuComponent, decorators: [{
|
|
9104
9104
|
type: Component,
|
|
9105
9105
|
args: [{ selector: 'table-row-menu', imports: [CpsIconComponent, CpsMenuComponent], template: "<cps-menu #rowMenu [items]=\"items\" [compressed]=\"true\" [withArrow]=\"false\">\n</cps-menu>\n<cps-icon\n icon=\"dropdown-menu\"\n size=\"22\"\n (click)=\"rowMenu.toggle($event)\"\n class=\"cps-table-row-menu-icon\">\n</cps-icon>\n", styles: [":host{height:22px;display:block}:host .cps-table-row-menu-icon{cursor:pointer}:host .cps-table-row-menu-icon:hover{color:var(--cps-color-calm)}\n"] }]
|
|
9106
9106
|
}], propDecorators: { editRowBtnClicked: [{
|
|
@@ -9174,10 +9174,10 @@ class CpsSortIconComponent {
|
|
|
9174
9174
|
this.subscription.unsubscribe();
|
|
9175
9175
|
}
|
|
9176
9176
|
}
|
|
9177
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9178
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
9177
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSortIconComponent, deps: [{ token: i1$5.Table, optional: true }, { token: i2$2.TreeTable, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9178
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsSortIconComponent, isStandalone: true, selector: "cps-sort-icon", inputs: { field: "field" }, ngImport: i0, template: "@if (sortOrder === 0) {\n <div class=\"cps-sortable-column-icon sort-unsorted\">\n <div class=\"sort-unsorted-arrow-up\"></div>\n <div class=\"sort-unsorted-arrow-down\"></div>\n </div>\n}\n@if (sortOrder === 1) {\n <div class=\"cps-sortable-column-icon sort-desc\"></div>\n}\n@if (sortOrder === -1) {\n <div class=\"cps-sortable-column-icon sort-asc\"></div>\n}\n\n@if (isMultiSorted()) {\n <span class=\"cps-sortable-column-badge\">{{ getBadgeValue() }}</span>\n}\n", styles: [":host .cps-sortable-column-icon{display:inline-flex;margin-left:8px}:host .sort-desc{border:4px solid transparent;border-bottom-color:var(--cps-color-calm);margin-bottom:4px}:host .sort-asc{border:4px solid transparent;border-top-color:var(--cps-color-calm);margin-top:4px}:host .sort-unsorted{flex-direction:column;vertical-align:bottom}:host .sort-unsorted .sort-unsorted-arrow-up{display:inline-flex;border:4px solid transparent;border-bottom-color:var(--cps-color-line-dark);margin-bottom:4px;margin-top:-4px}:host .sort-unsorted .sort-unsorted-arrow-down{display:inline-flex;border:4px solid transparent;border-top-color:var(--cps-color-line-dark)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9179
9179
|
}
|
|
9180
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
9180
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsSortIconComponent, decorators: [{
|
|
9181
9181
|
type: Component,
|
|
9182
9182
|
args: [{ selector: 'cps-sort-icon', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (sortOrder === 0) {\n <div class=\"cps-sortable-column-icon sort-unsorted\">\n <div class=\"sort-unsorted-arrow-up\"></div>\n <div class=\"sort-unsorted-arrow-down\"></div>\n </div>\n}\n@if (sortOrder === 1) {\n <div class=\"cps-sortable-column-icon sort-desc\"></div>\n}\n@if (sortOrder === -1) {\n <div class=\"cps-sortable-column-icon sort-asc\"></div>\n}\n\n@if (isMultiSorted()) {\n <span class=\"cps-sortable-column-badge\">{{ getBadgeValue() }}</span>\n}\n", styles: [":host .cps-sortable-column-icon{display:inline-flex;margin-left:8px}:host .sort-desc{border:4px solid transparent;border-bottom-color:var(--cps-color-calm);margin-bottom:4px}:host .sort-asc{border:4px solid transparent;border-top-color:var(--cps-color-calm);margin-top:4px}:host .sort-unsorted{flex-direction:column;vertical-align:bottom}:host .sort-unsorted .sort-unsorted-arrow-up{display:inline-flex;border:4px solid transparent;border-bottom-color:var(--cps-color-line-dark);margin-bottom:4px;margin-top:-4px}:host .sort-unsorted .sort-unsorted-arrow-down{display:inline-flex;border:4px solid transparent;border-top-color:var(--cps-color-line-dark)}\n"] }]
|
|
9183
9183
|
}], ctorParameters: () => [{ type: i1$5.Table, decorators: [{
|
|
@@ -9216,10 +9216,10 @@ class CpsTableColumnSortableDirective extends SortableColumn {
|
|
|
9216
9216
|
this.sortIconRef.destroy();
|
|
9217
9217
|
this.viewContainerRef.clear();
|
|
9218
9218
|
}
|
|
9219
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9220
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
9219
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableColumnSortableDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i1$5.Table }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
9220
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTableColumnSortableDirective, isStandalone: true, selector: "[cpsTColSortable]", inputs: { field: ["cpsTColSortable", "field"] }, usesInheritance: true, ngImport: i0 }); }
|
|
9221
9221
|
}
|
|
9222
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
9222
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableColumnSortableDirective, decorators: [{
|
|
9223
9223
|
type: Directive,
|
|
9224
9224
|
args: [{
|
|
9225
9225
|
standalone: true,
|
|
@@ -9420,10 +9420,10 @@ class TableUnsortDirective {
|
|
|
9420
9420
|
}
|
|
9421
9421
|
return this.pTable.compareValuesOnSort(value1, value2, this.pTable.multiSortMeta[index].order);
|
|
9422
9422
|
}
|
|
9423
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9424
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
9423
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableUnsortDirective, deps: [{ token: i1$5.Table, host: true, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
9424
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: TableUnsortDirective, isStandalone: true, selector: "[tWithUnsort]", exportAs: ["tWithUnsort"], ngImport: i0 }); }
|
|
9425
9425
|
}
|
|
9426
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
9426
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableUnsortDirective, decorators: [{
|
|
9427
9427
|
type: Directive,
|
|
9428
9428
|
args: [{
|
|
9429
9429
|
standalone: true,
|
|
@@ -9535,10 +9535,10 @@ class TableColumnFilterConstraintComponent {
|
|
|
9535
9535
|
this._tableInstance._filter();
|
|
9536
9536
|
event.preventDefault();
|
|
9537
9537
|
}
|
|
9538
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9539
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
9538
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableColumnFilterConstraintComponent, deps: [{ token: i1$5.Table, optional: true }, { token: i2$2.TreeTable, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9539
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: TableColumnFilterConstraintComponent, isStandalone: true, selector: "table-column-filter-constraint", inputs: { type: "type", field: "field", filterConstraint: "filterConstraint", categoryOptions: "categoryOptions", asButtonToggle: "asButtonToggle", singleSelection: "singleSelection", placeholder: "placeholder", hasApplyButton: "hasApplyButton" }, viewQueries: [{ propertyName: "categoryAutocompleteComponent", first: true, predicate: ["categoryAutocompleteComponent"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@switch (type) {\n @case ('text') {\n <cps-input\n [placeholder]=\"placeholder\"\n [hideDetails]=\"true\"\n (keydown.enter)=\"onEnterKeyDown($event)\"\n [value]=\"filterConstraint?.value\"\n (valueChanged)=\"onValueChange($event)\"\n type=\"text\"></cps-input>\n }\n @case ('number') {\n <cps-input\n [hideDetails]=\"true\"\n [placeholder]=\"placeholder\"\n (keydown.enter)=\"onEnterKeyDown($event)\"\n [value]=\"filterConstraint?.value\"\n (valueChanged)=\"onValueChange($event)\"\n type=\"number\"></cps-input>\n }\n @case ('boolean') {\n <div class=\"cps-table-col-filter-constraint-btn-toggles\">\n <cps-button-toggle\n ariaLabel=\"Boolean filter\"\n [options]=\"booleanOptions\"\n [value]=\"filterConstraint?.value\"\n (valueChanged)=\"onValueChange($event)\"\n [mandatory]=\"false\">\n </cps-button-toggle>\n </div>\n }\n @case ('date') {\n <cps-datepicker\n [openOnInputFocus]=\"true\"\n [hideDetails]=\"true\"\n [placeholder]=\"placeholder\"\n [value]=\"filterConstraint?.value\"\n (keydown.enter)=\"onEnterKeyDown($event)\"\n (valueChanged)=\"onValueChange($event)\">\n </cps-datepicker>\n }\n @case ('category') {\n @if (!asButtonToggle) {\n <cps-autocomplete\n #categoryAutocompleteComponent\n ariaLabel=\"Category filter\"\n class=\"cps-table-col-filter-category-autocomplete\"\n [placeholder]=\"placeholder\"\n [options]=\"categories\"\n [hideDetails]=\"true\"\n [clearable]=\"true\"\n [value]=\"filterConstraint?.value\"\n (valueChanged)=\"onValueChange($event)\"\n [returnObject]=\"false\"\n [multiple]=\"!singleSelection\">\n </cps-autocomplete>\n }\n <div class=\"cps-table-col-filter-constraint-btn-toggles\">\n @if (asButtonToggle) {\n <cps-button-toggle\n ariaLabel=\"Category filter\"\n [options]=\"categories\"\n [value]=\"filterConstraint?.value\"\n (valueChanged)=\"onValueChange($event)\"\n [mandatory]=\"false\"\n [multiple]=\"!singleSelection\">\n </cps-button-toggle>\n }\n </div>\n }\n}\n", styles: [":host .cps-table-col-filter-constraint-btn-toggles{display:flex;justify-content:center}:host .cps-table-col-filter-category-autocomplete{min-width:200px;max-width:400px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "component", type: CpsDatepickerComponent, selector: "cps-datepicker", inputs: ["label", "disabled", "width", "placeholder", "hint", "clearable", "hideDetails", "persistentClear", "showTodayButton", "openOnInputFocus", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "minDate", "maxDate", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsButtonToggleComponent, selector: "cps-button-toggle", inputs: ["label", "ariaLabel", "options", "multiple", "disabled", "mandatory", "equalWidths", "optionTooltipPosition", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "value"], outputs: ["valueChanged"] }, { kind: "component", type: CpsAutocompleteComponent, selector: "cps-autocomplete", inputs: ["label", "ariaLabel", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "showChevron", "withOptionsAliases", "useOptionsAliasesWhenNoMatch", "optionAlias", "chips", "closableChips", "clearable", "openOnClear", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "loadingMessage", "showLoadingMessage", "emptyMessage", "showEmptyMessage", "virtualScroll", "numToleratedItems", "externalError", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "emptyOptionIndex", "inputChangeDebounceTime", "validating", "value", "options"], outputs: ["valueChanged", "inputChanged", "focused", "blurred"] }] }); }
|
|
9540
9540
|
}
|
|
9541
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
9541
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableColumnFilterConstraintComponent, decorators: [{
|
|
9542
9542
|
type: Component,
|
|
9543
9543
|
args: [{ selector: 'table-column-filter-constraint', imports: [
|
|
9544
9544
|
FormsModule,
|
|
@@ -9896,10 +9896,10 @@ class TableColumnFilterComponent {
|
|
|
9896
9896
|
onMouseLeave() {
|
|
9897
9897
|
this._updateSortIconColor('');
|
|
9898
9898
|
}
|
|
9899
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
9900
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
9899
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableColumnFilterComponent, deps: [{ token: i0.ElementRef }, { token: i1$5.Table, optional: true }, { token: i2$2.TreeTable, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9900
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: TableColumnFilterComponent, isStandalone: true, selector: "table-column-filter", inputs: { field: "field", type: "type", persistent: "persistent", showClearButton: "showClearButton", showApplyButton: "showApplyButton", showCloseButton: "showCloseButton", showMatchModes: "showMatchModes", matchModes: "matchModes", showOperator: "showOperator", maxConstraints: "maxConstraints", headerTitle: "headerTitle", hideOnClear: "hideOnClear", categoryOptions: "categoryOptions", asButtonToggle: "asButtonToggle", singleSelection: "singleSelection", placeholder: "placeholder" }, host: { listeners: { "click": "onClick($event)", "mouseenter": "onMouseOver()", "mouseleave": "onMouseLeave()" } }, viewQueries: [{ propertyName: "columnFilterMenu", first: true, predicate: ["columnFilterMenu"], descendants: true }, { propertyName: "constraintCompList", predicate: ["constraintComponent"], descendants: true }], ngImport: i0, template: "<div class=\"cps-table-col-filter\">\n <cps-menu\n #columnFilterMenu\n [withArrow]=\"false\"\n hideTransitionOptions=\"0s linear\"\n [persistent]=\"persistent || (showApplyButton && isCategoryDropdownOpened)\"\n (menuShown)=\"onMenuShown()\"\n (menuHidden)=\"onMenuHidden()\"\n (beforeMenuHidden)=\"onBeforeMenuHidden()\">\n <div class=\"cps-table-col-filter-menu-content\">\n @if (showCloseButton || headerTitle) {\n <div class=\"cps-table-col-filter-menu-content-header\">\n <span class=\"cps-table-col-filter-menu-content-header-title\">\n {{ headerTitle }}\n </span>\n @if (showCloseButton) {\n <cps-icon icon=\"close-x\" (click)=\"onCloseClick()\"></cps-icon>\n }\n </div>\n }\n @if (isShowOperator) {\n <div class=\"cps-table-col-filter-menu-content-operator\">\n <cps-select\n [hideDetails]=\"true\"\n [disabled]=\"!fieldConstraints || fieldConstraints.length < 2\"\n [returnObject]=\"false\"\n [options]=\"operatorOptions\"\n [ngModel]=\"operator\"\n (valueChanged)=\"onOperatorChange($event)\"></cps-select>\n </div>\n }\n <div class=\"cps-table-col-filter-menu-content-constraints\">\n @for (\n fieldConstraint of fieldConstraints;\n track fieldConstraint;\n let i = $index\n ) {\n <div class=\"cps-table-col-filter-menu-content-constraint\">\n @if (showMatchModes && currentMatchModes) {\n <cps-select\n class=\"cps-table-col-filter-match-mode-select\"\n [hideDetails]=\"true\"\n [returnObject]=\"false\"\n [options]=\"currentMatchModes\"\n [ngModel]=\"fieldConstraint.matchMode\"\n (valueChanged)=\"\n onMenuMatchModeChange($event, fieldConstraint)\n \"></cps-select>\n }\n <table-column-filter-constraint\n #constraintComponent\n [type]=\"type\"\n [field]=\"field\"\n [asButtonToggle]=\"asButtonToggle\"\n [singleSelection]=\"singleSelection\"\n [categoryOptions]=\"categoryOptions\"\n [filterConstraint]=\"fieldConstraint\"\n [hasApplyButton]=\"showApplyButton\"\n [placeholder]=\"placeholder\">\n </table-column-filter-constraint>\n @if (showRemoveIcon) {\n <div class=\"cps-table-col-filter-remove-rule-btn\">\n <cps-button\n type=\"borderless\"\n width=\"100%\"\n size=\"small\"\n color=\"prepared\"\n icon=\"delete\"\n (clicked)=\"removeConstraint(fieldConstraint)\"\n label=\"Remove condition\">\n </cps-button>\n </div>\n }\n </div>\n }\n </div>\n @if (isShowAddConstraint) {\n <div class=\"cps-table-col-filter-add-rule-btn\">\n <cps-button\n label=\"Add condition\"\n type=\"borderless\"\n width=\"100%\"\n size=\"small\"\n color=\"surprise\"\n icon=\"add\"\n (clicked)=\"addConstraint()\">\n </cps-button>\n </div>\n }\n <div class=\"cps-table-col-filter-buttonbar\">\n @if (showClearButton) {\n <cps-button\n (clicked)=\"clearFilter()\"\n type=\"borderless\"\n color=\"prepared\"\n size=\"small\"\n label=\"Clear\"></cps-button>\n }\n @if (showApplyButton) {\n <cps-button\n (clicked)=\"applyFilter()\"\n color=\"prepared\"\n size=\"small\"\n label=\"Apply\"></cps-button>\n }\n </div>\n </div>\n </cps-menu>\n <cps-icon\n [icon]=\"isFilterApplied ? 'filter-funnel-filled' : 'filter-funnel'\"\n size=\"13\"\n (click)=\"columnFilterMenu.toggle($event)\"\n class=\"cps-table-col-filter-menu-button\"\n [ngClass]=\"{\n 'cps-table-col-filter-menu-button-active': isFilterApplied\n }\"\n >>\n </cps-icon>\n</div>\n", styles: [":host .cps-table-col-filter{display:inline-flex}:host .cps-table-col-filter .cps-table-col-filter-menu-button{display:inline-flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;overflow:hidden;position:relative;padding-left:8px;padding-right:4px}:host .cps-table-col-filter .cps-table-col-filter-menu-button:not(.cps-table-col-filter-menu-button-active):hover{color:var(--cps-color-text-dark)}:host .cps-table-col-filter .cps-table-col-filter-menu-button-active{color:var(--cps-color-calm-lighten1)}.cps-table-col-filter-menu-content{padding-bottom:12px;min-width:200px;max-height:500px;overflow:auto}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-header{min-height:32px;padding:8px;border-bottom:1px solid var(--cps-color-line-mid);background:var(--cps-color-bg-light);display:flex;justify-content:space-between;align-items:center}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-header-title{font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-darkest);max-width:390px;cursor:default}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-header cps-icon{margin-left:8px;cursor:pointer}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-header cps-icon:hover{color:var(--cps-color-calm)}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-operator{padding:12px;border-bottom:1px solid var(--cps-color-line-mid);background:var(--cps-color-bg-light)}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-constraints .cps-table-col-filter-menu-content-constraint{border-bottom:1px solid var(--cps-color-line-mid);padding:12px}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-constraints .cps-table-col-filter-menu-content-constraint .cps-table-col-filter-match-mode-select{margin-bottom:8px}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-constraints .cps-table-col-filter-menu-content-constraint:last-child{border-bottom:none}.cps-table-col-filter-menu-content .cps-table-col-filter-menu-content-constraints .cps-table-col-filter-remove-rule-btn{padding-top:8px}.cps-table-col-filter-menu-content .cps-table-col-filter-add-rule-btn{padding:8px 12px}.cps-table-col-filter-menu-content .cps-table-col-filter-buttonbar{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "optionIcon", "optionIconColor", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "numToleratedItems", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "optionsClass", "appearance", "showChevron", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: TableColumnFilterConstraintComponent, selector: "table-column-filter-constraint", inputs: ["type", "field", "filterConstraint", "categoryOptions", "asButtonToggle", "singleSelection", "placeholder", "hasApplyButton"] }] }); }
|
|
9901
9901
|
}
|
|
9902
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
9902
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TableColumnFilterComponent, decorators: [{
|
|
9903
9903
|
type: Component,
|
|
9904
9904
|
args: [{ selector: 'table-column-filter', imports: [
|
|
9905
9905
|
CommonModule,
|
|
@@ -10096,10 +10096,10 @@ class CpsTableColumnFilterDirective {
|
|
|
10096
10096
|
this.filterCompRef.destroy();
|
|
10097
10097
|
this.viewContainerRef.clear();
|
|
10098
10098
|
}
|
|
10099
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
10100
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
10099
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableColumnFilterDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
10100
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTableColumnFilterDirective, isStandalone: true, selector: "[cpsTColFilter]", inputs: { field: ["cpsTColFilter", "field"], filterType: "filterType", filterPersistent: "filterPersistent", filterShowClearButton: "filterShowClearButton", filterShowApplyButton: "filterShowApplyButton", filterShowCloseButton: "filterShowCloseButton", filterShowMatchModes: "filterShowMatchModes", filterMatchModes: "filterMatchModes", filterShowOperator: "filterShowOperator", filterMaxConstraints: "filterMaxConstraints", filterHeaderTitle: "filterHeaderTitle", filterHideOnClear: "filterHideOnClear", filterCategoryOptions: "filterCategoryOptions", filterAsButtonToggle: "filterAsButtonToggle", filterSingleSelection: "filterSingleSelection", filterPlaceholder: "filterPlaceholder" }, exportAs: ["cpsTColFilter"], usesOnChanges: true, ngImport: i0 }); }
|
|
10101
10101
|
}
|
|
10102
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
10102
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableColumnFilterDirective, decorators: [{
|
|
10103
10103
|
type: Directive,
|
|
10104
10104
|
args: [{
|
|
10105
10105
|
standalone: true,
|
|
@@ -10157,10 +10157,10 @@ class CpsTableDetectFilterTypePipe {
|
|
|
10157
10157
|
}
|
|
10158
10158
|
return 'text';
|
|
10159
10159
|
}
|
|
10160
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
10161
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
10160
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableDetectFilterTypePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
10161
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.13", ngImport: i0, type: CpsTableDetectFilterTypePipe, isStandalone: true, name: "cpsTableDetectFilterType" }); }
|
|
10162
10162
|
}
|
|
10163
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
10163
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableDetectFilterTypePipe, decorators: [{
|
|
10164
10164
|
type: Pipe,
|
|
10165
10165
|
args: [{
|
|
10166
10166
|
name: 'cpsTableDetectFilterType',
|
|
@@ -10173,10 +10173,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
|
|
|
10173
10173
|
* @group Directives
|
|
10174
10174
|
*/
|
|
10175
10175
|
class CpsTableColumnResizableDirective extends ResizableColumn {
|
|
10176
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
10177
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
10176
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableColumnResizableDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
10177
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTableColumnResizableDirective, isStandalone: true, selector: "[cpsTColResizable]", inputs: { pResizableColumnDisabled: ["cpsTColResizableDisabled", "pResizableColumnDisabled"] }, usesInheritance: true, ngImport: i0 }); }
|
|
10178
10178
|
}
|
|
10179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
10179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableColumnResizableDirective, decorators: [{
|
|
10180
10180
|
type: Directive,
|
|
10181
10181
|
args: [{
|
|
10182
10182
|
standalone: true,
|
|
@@ -10925,8 +10925,8 @@ class CpsTableComponent {
|
|
|
10925
10925
|
downloadLink.click();
|
|
10926
10926
|
});
|
|
10927
10927
|
}
|
|
10928
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
10929
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
10928
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10929
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTableComponent, isStandalone: true, selector: "cps-table", inputs: { columns: "columns", colHeaderName: "colHeaderName", colFieldName: "colFieldName", colFilterTypeName: "colFilterTypeName", colDateFormatName: "colDateFormatName", striped: "striped", bordered: "bordered", size: "size", selectable: "selectable", rowHover: "rowHover", dataKey: "dataKey", showRowMenu: "showRowMenu", showRowRemoveButton: "showRowRemoveButton", showRowEditButton: "showRowEditButton", rowMenuItems: "rowMenuItems", reorderableRows: "reorderableRows", loading: "loading", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", sortable: "sortable", filterableByColumns: "filterableByColumns", autoColumnFilterType: "autoColumnFilterType", sortMode: "sortMode", customSort: "customSort", hasToolbar: "hasToolbar", toolbarSize: "toolbarSize", toolbarTitle: "toolbarTitle", toolbarIcon: "toolbarIcon", toolbarIconColor: "toolbarIconColor", scrollable: "scrollable", scrollHeight: "scrollHeight", virtualScroll: "virtualScroll", numToleratedItems: "numToleratedItems", paginator: "paginator", alwaysShowPaginator: "alwaysShowPaginator", rowsPerPageOptions: "rowsPerPageOptions", first: "first", rows: "rows", resetPageOnRowsChange: "resetPageOnRowsChange", resetPageOnSort: "resetPageOnSort", totalRecords: "totalRecords", emptyMessage: "emptyMessage", emptyBodyHeight: "emptyBodyHeight", lazy: "lazy", lazyLoadOnInit: "lazyLoadOnInit", showGlobalFilter: "showGlobalFilter", globalFilterPlaceholder: "globalFilterPlaceholder", globalFilterFields: "globalFilterFields", clearGlobalFilterOnLoading: "clearGlobalFilterOnLoading", showRemoveBtnOnSelect: "showRemoveBtnOnSelect", removeBtnOnSelectDisabled: "removeBtnOnSelectDisabled", showAdditionalBtnOnSelect: "showAdditionalBtnOnSelect", additionalBtnOnSelectTitle: "additionalBtnOnSelectTitle", additionalBtnOnSelectIcon: "additionalBtnOnSelectIcon", additionalBtnOnSelectDisabled: "additionalBtnOnSelectDisabled", showActionBtn: "showActionBtn", actionBtnTitle: "actionBtnTitle", actionBtnIcon: "actionBtnIcon", actionBtnDisabled: "actionBtnDisabled", showExportBtn: "showExportBtn", exportBtnDisabled: "exportBtnDisabled", exportFilename: "exportFilename", csvSeparator: "csvSeparator", showDataReloadBtn: "showDataReloadBtn", dataReloadBtnDisabled: "dataReloadBtnDisabled", showColumnsToggleBtn: "showColumnsToggleBtn", columnsToggleBtnDisabled: "columnsToggleBtnDisabled", initialColumns: "initialColumns", renderDataAsHTML: "renderDataAsHTML", data: "data", resizableColumns: "resizableColumns", columnResizeMode: "columnResizeMode" }, outputs: { rowsSelected: "rowsSelected", selectedRowIndexes: "selectedRowIndexes", actionBtnClicked: "actionBtnClicked", editRowBtnClicked: "editRowBtnClicked", rowsToRemove: "rowsToRemove", rowIndexesToRemove: "rowIndexesToRemove", pageChanged: "pageChanged", sorted: "sorted", filtered: "filtered", rowsReordered: "rowsReordered", columnsSelected: "columnsSelected", lazyLoaded: "lazyLoaded", dataReloadBtnClicked: "dataReloadBtnClicked", additionalBtnOnSelectClicked: "additionalBtnOnSelectClicked", customSortFunction: "customSortFunction" }, providers: [
|
|
10930
10930
|
TableService,
|
|
10931
10931
|
{
|
|
10932
10932
|
provide: Table,
|
|
@@ -10936,7 +10936,7 @@ class CpsTableComponent {
|
|
|
10936
10936
|
}
|
|
10937
10937
|
], queries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "nestedHeaderTemplate", first: true, predicate: ["nestedHeader"], descendants: true }, { propertyName: "bodyTemplate", first: true, predicate: ["body"], descendants: true }, { propertyName: "rowExpansionTemplate", first: true, predicate: ["rowexpansion"], descendants: true }], viewQueries: [{ propertyName: "primengTable", first: true, predicate: ["primengTable"], descendants: true, static: true }, { propertyName: "globalFilterComp", first: true, predicate: ["globalFilterComp"], descendants: true }, { propertyName: "exportMenu", first: true, predicate: ["exportMenu"], descendants: true }, { propertyName: "colToggleMenu", first: true, predicate: ["colToggleMenu"], descendants: true }, { propertyName: "tUnsortDirective", first: true, predicate: ["tUnsortDirective"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p-table\n #primengTable\n #tUnsortDirective=\"tWithUnsort\"\n tWithUnsort\n [ngClass]=\"{ 'cps-table-loading': loading }\"\n [styleClass]=\"styleClass\"\n [tableStyle]=\"tableStyle\"\n [tableStyleClass]=\"tableStyleClass\"\n [value]=\"data\"\n [dataKey]=\"dataKey\"\n [columns]=\"selectedColumns\"\n (selectionChange)=\"onSelectionChanged($event)\"\n [globalFilterFields]=\"globalFilterFields\"\n [showInitialSortBadge]=\"false\"\n [loading]=\"loading\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n [lazy]=\"lazy\"\n [lazyLoadOnInit]=\"lazyLoadOnInit\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: numToleratedItems }\"\n [paginator]=\"paginator\"\n [showCurrentPageReport]=\"true\"\n [alwaysShowPaginator]=\"alwaysShowPaginator\"\n [rows]=\"rows\"\n [first]=\"first\"\n [totalRecords]=\"totalRecords\"\n [resetPageOnSort]=\"resetPageOnSort\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\"\n [(selection)]=\"selectedRows\"\n [metaKeySelection]=\"false\"\n [rowHover]=\"rowHover\"\n [customSort]=\"customSort\"\n [sortMode]=\"sortMode\"\n [exportFilename]=\"exportFilename\"\n [csvSeparator]=\"csvSeparator\"\n [resizableColumns]=\"resizableColumns\"\n [columnResizeMode]=\"columnResizeMode\"\n [stripedRows]=\"striped\"\n [showGridlines]=\"bordered\"\n [size]=\"size === 'normal' ? undefined : size\"\n (onPage)=\"onPageChange($event)\"\n (onLazyLoad)=\"onLazyLoaded($event)\"\n (sortFunction)=\"onSortFunction($event)\"\n (onSort)=\"onSort($event)\"\n (onFilter)=\"onFilter($event)\"\n (onRowReorder)=\"onRowReorder($event)\">\n @if (hasToolbar) {\n <ng-template pTemplate=\"caption\">\n @if (toolbarTemplate) {\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n }\n @if (!toolbarTemplate) {\n <div class=\"cps-table-tbar-left\">\n @if (toolbarIcon) {\n <div class=\"cps-table-tbar-icon\">\n <cps-icon\n [icon]=\"toolbarIcon\"\n [color]=\"toolbarIconColor\"></cps-icon>\n </div>\n }\n <div class=\"cps-table-tbar-title\">{{ toolbarTitle }}</div>\n @if (showGlobalFilter) {\n <div class=\"cps-table-tbar-global-filter\">\n <cps-input\n #globalFilterComp\n prefixIcon=\"search\"\n [placeholder]=\"globalFilterPlaceholder\"\n (valueChanged)=\"onFilterGlobal($event)\"\n [clearable]=\"true\"\n [disabled]=\"loading\"\n [appearance]=\"\n toolbarSize === 'small' ? 'underlined' : 'outlined'\n \"\n [hideDetails]=\"true\">\n </cps-input>\n </div>\n }\n </div>\n <div class=\"cps-table-tbar-right\">\n @if (showRemoveBtnOnSelect && selectedRows.length > 0) {\n <div class=\"cps-table-tbar-btn-on-select\">\n <cps-button\n label=\"Remove\"\n [disabled]=\"removeBtnOnSelectDisabled\"\n color=\"prepared\"\n type=\"borderless\"\n icon=\"remove\"\n [size]=\"toolbarSize\"\n (clicked)=\"removeSelected()\">\n </cps-button>\n </div>\n }\n @if (showAdditionalBtnOnSelect && selectedRows.length > 0) {\n <div class=\"cps-table-tbar-btn-on-select\">\n <cps-button\n [label]=\"additionalBtnOnSelectTitle\"\n [disabled]=\"additionalBtnOnSelectDisabled\"\n color=\"prepared\"\n type=\"borderless\"\n [icon]=\"additionalBtnOnSelectIcon\"\n [size]=\"toolbarSize\"\n (clicked)=\"onClickAdditionalBtnOnSelect()\">\n </cps-button>\n </div>\n }\n @if (showActionBtn) {\n <div class=\"cps-table-tbar-action-btn\">\n <cps-button\n [label]=\"actionBtnTitle\"\n [disabled]=\"actionBtnDisabled\"\n color=\"prepared\"\n type=\"outlined\"\n [icon]=\"actionBtnIcon\"\n [size]=\"toolbarSize\"\n (clicked)=\"onClickActionBtn()\">\n </cps-button>\n </div>\n }\n @if (showColumnsToggleBtn && columns.length > 0) {\n <div\n class=\"cps-table-tbar-coltoggle-btn\"\n [ngClass]=\"{ 'btn-disabled': columnsToggleBtnDisabled }\">\n <cps-icon\n icon=\"columns\"\n size=\"normal\"\n [color]=\"\n columnsToggleBtnDisabled\n ? 'text-lightest'\n : 'prepared-lighten1'\n \"\n (click)=\"onColumnsToggle($event)\"></cps-icon>\n <cps-menu #colToggleMenu [withArrow]=\"false\">\n <div class=\"cps-table-coltoggle-menu\">\n <div\n class=\"cps-table-coltoggle-menu-item select-all-option\"\n [class.allselected]=\"\n selectedColumns.length === columns.length\n \"\n (click)=\"toggleAllColumns()\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span class=\"cps-table-coltoggle-menu-item-check\"> </span>\n <span class=\"cps-table-coltoggle-menu-item-label\"\n >Show all columns</span\n >\n </span>\n </div>\n @for (col of columns; track col) {\n <div\n class=\"cps-table-coltoggle-menu-item\"\n (click)=\"onSelectColumn(col)\"\n [class.selected]=\"isColumnSelected(col)\">\n <span class=\"cps-table-coltoggle-menu-item-left\">\n <span\n class=\"cps-table-coltoggle-menu-item-check\"></span>\n <span class=\"cps-table-coltoggle-menu-item-label\">{{\n col[colHeaderName]\n }}</span>\n </span>\n </div>\n }\n </div>\n </cps-menu>\n </div>\n }\n @if (showExportBtn) {\n <div\n class=\"cps-table-tbar-export-btn\"\n [ngClass]=\"{ 'btn-disabled': exportBtnDisabled }\">\n <cps-icon\n icon=\"export\"\n size=\"20\"\n [color]=\"exportBtnDisabled ? 'text-light' : 'prepared-lighten1'\"\n (click)=\"onExportData($event)\"></cps-icon>\n <cps-menu\n #exportMenu\n [items]=\"exportMenuItems\"\n [compressed]=\"true\"\n [withArrow]=\"false\">\n </cps-menu>\n </div>\n }\n @if (showDataReloadBtn) {\n <div\n class=\"cps-table-tbar-reload-btn\"\n [ngClass]=\"{ 'btn-disabled': dataReloadBtnDisabled }\">\n <cps-icon\n icon=\"refresh\"\n size=\"18\"\n [color]=\"\n dataReloadBtnDisabled ? 'text-light' : 'prepared-lighten1'\n \"\n (click)=\"onReloadData()\">\n </cps-icon>\n </div>\n }\n </div>\n }\n </ng-template>\n }\n\n @if (nestedHeaderTemplate; as columns) {\n <ng-template pTemplate=\"header\" let-columns>\n <ng-container\n *ngTemplateOutlet=\"\n nestedHeaderTemplate;\n context: {\n $implicit: columns\n }\n \"></ng-container>\n </ng-template>\n }\n\n @if (!nestedHeaderTemplate; as columns) {\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n @if (rowExpansionTemplate) {\n <th\n style=\"width: 3rem\"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\"></th>\n }\n @if (reorderableRows) {\n <th\n style=\"width: 3rem\"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\"></th>\n }\n @if (selectable) {\n <th\n style=\"width: 4rem\"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\">\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n }\n @if (headerTemplate) {\n <ng-container\n *ngTemplateOutlet=\"\n headerTemplate;\n context: {\n $implicit: columns\n }\n \"></ng-container>\n }\n @if (!headerTemplate && columns.length > 0) {\n @if (sortable) {\n @if (filterableByColumns) {\n @for (col of columns; track col) {\n <th\n [cpsTColSortable]=\"col[colFieldName]\"\n [cpsTColFilter]=\"col[colFieldName]\"\n [filterType]=\"\n col[colFilterTypeName] ??\n (autoColumnFilterType\n ? (data | cpsTableDetectFilterType: col[colFieldName])\n : 'text')\n \"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n } @else {\n @for (col of columns; track col) {\n <th\n [cpsTColSortable]=\"col[colFieldName]\"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n }\n }\n @if (!sortable) {\n @if (filterableByColumns) {\n @for (col of columns; track col) {\n <th\n [cpsTColFilter]=\"col[colFieldName]\"\n [filterType]=\"\n col[colFilterTypeName] ??\n (autoColumnFilterType\n ? (data | cpsTableDetectFilterType: col[colFieldName])\n : 'text')\n \"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n } @else {\n @for (col of columns; track col) {\n <th\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n }\n }\n }\n @if (showRowMenu && (showRowRemoveButton || showRowEditButton)) {\n <th\n style=\"width: 2rem\"\n class=\"cps-table-row-menu-cell\"\n cpsTColResizable\n [cpsTColResizableDisabled]=\"!resizableColumns\"></th>\n }\n </tr>\n </ng-template>\n }\n\n <ng-template\n pTemplate=\"body\"\n let-rowData\n let-columns=\"columns\"\n let-item\n let-rowIndex=\"rowIndex\"\n let-expanded=\"expanded\">\n <tr\n [pReorderableRow]=\"rowIndex\"\n [ngClass]=\"{\n 'cps-table-row-selected': selectable && primengTable.isSelected(item)\n }\">\n @if (rowExpansionTemplate) {\n <td class=\"cps-table-row-chevron-cell\">\n <div\n class=\"cps-table-row-chevron\"\n [ngClass]=\"{ 'cps-table-row-chevron-expanded': expanded }\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n color=\"text-dark\"\n [pRowToggler]=\"item\">\n </cps-icon>\n </div>\n </td>\n }\n @if (reorderableRows) {\n <td class=\"cps-table-row-drag-handle-cell\">\n <span class=\"cps-table-row-drag-handle\" pReorderableRowHandle\n >\u2630</span\n >\n </td>\n }\n @if (selectable) {\n <td>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n }\n @if (bodyTemplate) {\n <ng-container\n *ngTemplateOutlet=\"\n bodyTemplate;\n context: {\n $implicit: item,\n rowIndex: rowIndex,\n columns: columns,\n rowData: rowData\n }\n \">\n </ng-container>\n }\n @if (!bodyTemplate) {\n @if (columns.length > 0) {\n @if (renderDataAsHTML) {\n @for (col of columns; track col) {\n <td [innerHTML]=\"rowData[col[colFieldName]]\"></td>\n }\n } @else {\n @for (col of columns; track col) {\n <td>\n {{\n col[colDateFormatName]\n ? (rowData[col[colFieldName]]\n | date: col[colDateFormatName])\n : rowData[col[colFieldName]]\n }}\n </td>\n }\n }\n }\n }\n @if (showRowMenu && (showRowRemoveButton || showRowEditButton)) {\n <td class=\"cps-table-row-menu-cell\">\n <table-row-menu\n (editRowBtnClicked)=\"onEditRowClicked(item)\"\n (removeRowBtnClicked)=\"onRemoveRowClicked(item)\"\n [showRowRemoveButton]=\"showRowRemoveButton\"\n [showRowEditButton]=\"showRowEditButton\"\n [customItems]=\"rowMenuItems\">\n </table-row-menu>\n </td>\n }\n </tr>\n </ng-template>\n @if (rowExpansionTemplate; as item) {\n <ng-template pTemplate=\"rowexpansion\" let-item>\n <tr class=\"cps-table-row-expanded-content\">\n <td colspan=\"100\">\n <ng-container\n *ngTemplateOutlet=\"\n rowExpansionTemplate;\n context: {\n $implicit: item\n }\n \"></ng-container>\n </td>\n </tr>\n </ng-template>\n }\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td\n colspan=\"100\"\n class=\"cps-table-empty-message-td\"\n [ngStyle]=\"{ height: emptyBodyHeight }\">\n {{ emptyMessage }}\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"loadingicon\">\n <cps-loader [fullScreen]=\"false\" opacity=\"0\"></cps-loader>\n </ng-template>\n <ng-template pTemplate=\"paginatorleft\">\n <div class=\"cps-table-paginator-itms-per-page\">\n <span class=\"cps-table-paginator-items-per-page-title\"\n >Rows per page:\n </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChanged()\"\n [returnObject]=\"false\"\n optionsClass=\"cps-paginator-page-options\">\n </cps-select>\n </div>\n </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}:host ::ng-deep .p-datatable-flex-scrollable{display:flex;flex-direction:column;height:100%}:host ::ng-deep .p-datatable{position:relative}:host ::ng-deep .p-datatable .p-column-resizer-helper{background:var(--cps-color-calm);width:1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-header{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable .p-datatable-header{font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:0 10px!important;border:unset;background:unset;border-top:1px solid var(--cps-color-line-mid);border-right:1px solid var(--cps-color-line-mid);border-left:4px solid var(--cps-color-surprise)!important;border-radius:4px 4px 0 0;font-size:16px;line-height:150%;background-color:#fff;color:var(--cps-color-text-darkest);overflow:auto}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-global-filter{margin-left:12px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-icon{display:flex;margin-right:8px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-left .cps-table-tbar-title{cursor:default}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right{display:flex;align-items:center}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-btn-on-select{margin-right:4px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-action-btn{margin-right:4px;margin-left:8px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-reload-btn{display:contents}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-reload-btn cps-icon{margin-left:12px;margin-right:4px}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn:not(.btn-disabled) cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn:not(.btn-disabled) cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-reload-btn:not(.btn-disabled) cps-icon{cursor:pointer}:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-coltoggle-btn:not(.btn-disabled) cps-icon:hover .cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-export-btn:not(.btn-disabled) cps-icon:hover .cps-icon,:host ::ng-deep .p-datatable .p-datatable-header .cps-table-tbar-right .cps-table-tbar-reload-btn:not(.btn-disabled) cps-icon:hover .cps-icon{color:var(--cps-color-prepared)!important}:host ::ng-deep .cps-tbar-small.p-datatable .p-datatable-header{height:43px}:host ::ng-deep .cps-tbar-normal.p-datatable .p-datatable-header{height:72px}:host ::ng-deep .p-datatable-flex-scrollable>.p-datatable-wrapper{display:flex;flex-direction:column;flex:1;height:100%}:host ::ng-deep .p-datatable-scrollable>.p-datatable-wrapper{position:relative}:host ::ng-deep .p-datatable>.p-datatable-wrapper{overflow:auto}:host ::ng-deep .p-datatable-table{border-spacing:0px;width:100%}:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-datatable-table>.p-datatable-tfoot,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-thead,:host ::ng-deep .p-datatable.p-datatable-scrollable>.p-datatable-wrapper>.p-scroller-viewport>.p-scroller>.p-datatable-table>.p-datatable-tfoot{background-color:#fff}:host ::ng-deep .p-datatable-scrollable-table>.p-datatable-thead{position:sticky;top:0;z-index:1}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-thead>tr>th{padding:1.25rem}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 1px;font-weight:400;color:var(--cps-color-text-mild);background:#fff;transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th:last-child{border-width:1px}:host ::ng-deep .p-datatable .p-datatable-thead>tr>th{border-width:1px 0 1px 1px}:host ::ng-deep .p-datatable .p-datatable-thead tr:not(:first-child) th{border-top:unset}:host ::ng-deep .p-datatable .p-datatable-sortable-column:not(.p-paginator-page-selected):hover .cps-sortable-column-icon.sort-unsorted .sort-unsorted-arrow-up{border-bottom-color:var(--cps-color-text-mild)}:host ::ng-deep .p-datatable .p-datatable-sortable-column:not(.p-paginator-page-selected):hover .cps-sortable-column-icon.sort-unsorted .sort-unsorted-arrow-down{border-top-color:var(--cps-color-text-mild)}:host ::ng-deep .p-icon{display:inline-block;width:1rem;height:1rem}:host ::ng-deep .p-datatable .p-sortable-column .cps-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center;font-size:12px;vertical-align:top;color:var(--cps-color-calm);margin-left:.25rem}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column{cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-datatable .p-sortable-column:focus{box-shadow:none;outline:0 none}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(odd){background:var(--cps-color-bg-light)}:host ::ng-deep .p-datatable.p-datatable-striped .p-datatable-tbody>tr:nth-child(2n){background:#fff}:host ::ng-deep .p-datatable.p-datatable-hoverable .p-datatable-tbody>tr:not(.p-highlight):not(.cps-table-row-expanded-content):hover{background:var(--cps-color-highlight-hover)}:host ::ng-deep .p-datatable .p-datatable-tbody .cps-table-row-expanded-content td{border-left:4px solid var(--cps-color-surprise)!important}:host ::ng-deep .p-datatable .p-datatable-tbody>tr{background:#fff;color:var(--cps-color-text-dark);transition:box-shadow .2s}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.cps-table-row-selected{background-color:var(--cps-color-highlight-active)!important}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td:last-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines:has(.p-datatable-thead):has(.p-datatable-tbody) .p-datatable-tbody>tr>td{border-width:0 0 1px 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td:last-child{border-width:1px 1px 0 1px}:host ::ng-deep .p-datatable.p-datatable-gridlines .p-datatable-tbody>tr>td{border-width:1px 0 0 1px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{text-align:left;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td:first-child{border-width:0 0 1px 1px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td:last-child{border-width:0 1px 1px 0}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td:only-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-datatable.p-datatable-sm .p-datatable-tbody>tr>td{padding:.5rem}:host ::ng-deep .p-datatable.p-datatable-lg .p-datatable-tbody>tr>td{padding:1.25rem}:host ::ng-deep td:has(p-tablecheckbox){text-align:center!important}:host ::ng-deep th:has(p-tableheadercheckbox){text-align:center!important;width:3rem!important}:host ::ng-deep .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative;width:18px;height:18px}:host ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:host ::ng-deep .p-hidden-accessible input,:host ::ng-deep .p-hidden-accessible select{transform:scale(0)}:host ::ng-deep .p-checkbox .p-checkbox-box{background:#fff;width:18px;height:18px;color:var(--cps-color-text-dark);border:2px solid var(--cps-color-text-mild);border-radius:2px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}:host ::ng-deep .p-checkbox-box{display:flex;justify-content:center;align-items:center}:host ::ng-deep .p-checkbox.p-checkbox-checked .p-checkbox-box{border-color:var(--cps-color-calm);background:var(--cps-color-calm)}:host ::ng-deep .p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box{border-color:var(--cps-color-calm);background:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box{border-color:var(--cps-color-calm)}:host ::ng-deep .p-checkbox .p-checkbox-box .p-icon{width:14px;height:14px}:host ::ng-deep .p-checkbox .p-checkbox-box .p-checkbox-icon{transition-duration:.2s;color:#fff;font-size:14px}:host ::ng-deep .p-datatable-reorderable-row-handle,:host ::ng-deep [pReorderableColumn]{cursor:move;font-size:20px;line-height:1}:host ::ng-deep .p-datatable-reorderable-row-handle:hover,:host ::ng-deep [pReorderableColumn]:hover{color:var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-top>td{box-shadow:inset 0 2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-datatable-tbody>tr.p-datatable-dragpoint-bottom>td{box-shadow:inset 0 -2px 0 0 var(--cps-color-calm)}:host ::ng-deep .p-datatable .p-paginator{border-width:0 1px 1px 1px;border-radius:0}:host ::ng-deep .p-paginator{background:#fff;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:1rem;border:1px solid var(--cps-color-line-mid)}:host ::ng-deep .p-paginator-content-start{margin-right:auto}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-table-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px;cursor:default}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px;height:unset}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator-current{cursor:default}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-paginator-page-selected{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep .p-paginator-page:focus{outline:0 none;outline-offset:0;box-shadow:unset}:host ::ng-deep .p-paginator-page{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}:host ::ng-deep .cps-table-empty-message-td{text-align:center!important;font-weight:600;background:#fff}:host ::ng-deep .cps-table-row-drag-handle-cell{text-align:center!important}:host ::ng-deep .cps-table-row-drag-handle-cell .cps-table-row-drag-handle{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host ::ng-deep .cps-table-row-chevron-cell{text-align:center!important}:host ::ng-deep .cps-table-row-chevron-cell .cps-table-row-chevron{transition-duration:.2s;cursor:pointer;display:inline-flex}:host ::ng-deep .cps-table-row-chevron-cell .cps-table-row-chevron:hover cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host ::ng-deep .cps-table-row-chevron-cell .cps-table-row-chevron-expanded{transform:rotate(180deg)}:host ::ng-deep .cps-table-row-menu-cell{border-left:none!important}:host ::ng-deep .p-datatable .p-datatable-mask.p-overlay-mask{position:absolute;display:flex;align-items:center;justify-content:center;z-index:1001;top:0;left:0;width:100%;height:100%;background-color:#fff;transition-duration:.2s;border:1px solid var(--cps-color-line-mid)}:host ::ng-deep .p-datatable.cps-tbar-small .p-datatable-mask.p-overlay-mask{top:43px;height:calc(100% - 43px)}:host ::ng-deep .p-datatable.cps-tbar-normal .p-datatable-mask.p-overlay-mask{top:72px;height:calc(100% - 72px)}:host ::ng-deep .cps-table-loading .p-datatable{min-height:200px}:host ::ng-deep .cps-table-loading .p-datatable.cps-tbar-normal{min-height:272px}:host ::ng-deep .cps-table-loading .p-datatable.cps-tbar-small{min-height:243px}:host ::ng-deep .cps-table-col-filter-menu-open .cps-table-col-filter-menu-button{color:var(--cps-color-text-dark)}.cps-table-coltoggle-menu{display:block;max-height:242px;overflow-x:hidden;background:#fff}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item:hover{background:var(--cps-color-highlight-hover)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-label{color:var(--cps-color-text-dark)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-left{display:flex;align-items:center;margin-right:8px}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected{font-weight:600}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-label,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-label{color:var(--cps-color-calm)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected .cps-table-coltoggle-menu-item-check,.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.allselected .cps-table-coltoggle-menu-item-check{opacity:1}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected{background:var(--cps-color-highlight-selected)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.highlighten{background:var(--cps-color-highlight-active)}.cps-table-coltoggle-menu .cps-table-coltoggle-menu-item.selected.highlighten{background:var(--cps-color-highlight-selected-dark)}.cps-table-coltoggle-menu .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}::ng-deep .cps-select-options-menu.cps-paginator-page-options .cps-select-options-option{font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$5.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$5.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "component", type: i1$5.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i1$5.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "directive", type: i1$5.ReorderableRowHandle, selector: "[pReorderableRowHandle]" }, { kind: "directive", type: i1$5.ReorderableRow, selector: "[pReorderableRow]", inputs: ["pReorderableRow", "pReorderableRowDisabled"] }, { kind: "directive", type: TableUnsortDirective, selector: "[tWithUnsort]", exportAs: ["tWithUnsort"] }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "optionIcon", "optionIconColor", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "numToleratedItems", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "optionsClass", "appearance", "showChevron", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "component", type: CpsLoaderComponent, selector: "cps-loader", inputs: ["fullScreen", "opacity", "labelColor", "showLabel"] }, { kind: "component", type: TableRowMenuComponent, selector: "table-row-menu", inputs: ["showRowRemoveButton", "customItems", "showRowEditButton"], outputs: ["editRowBtnClicked", "removeRowBtnClicked"] }, { kind: "directive", type: CpsTableColumnSortableDirective, selector: "[cpsTColSortable]", inputs: ["cpsTColSortable"] }, { kind: "directive", type: CpsTableColumnFilterDirective, selector: "[cpsTColFilter]", inputs: ["cpsTColFilter", "filterType", "filterPersistent", "filterShowClearButton", "filterShowApplyButton", "filterShowCloseButton", "filterShowMatchModes", "filterMatchModes", "filterShowOperator", "filterMaxConstraints", "filterHeaderTitle", "filterHideOnClear", "filterCategoryOptions", "filterAsButtonToggle", "filterSingleSelection", "filterPlaceholder"], exportAs: ["cpsTColFilter"] }, { kind: "directive", type: CpsTableColumnResizableDirective, selector: "[cpsTColResizable]", inputs: ["cpsTColResizableDisabled"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }, { kind: "pipe", type: CpsTableDetectFilterTypePipe, name: "cpsTableDetectFilterType" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10938
10938
|
}
|
|
10939
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
10939
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableComponent, decorators: [{
|
|
10940
10940
|
type: Component,
|
|
10941
10941
|
args: [{ selector: 'cps-table', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
10942
10942
|
FormsModule,
|
|
@@ -11190,10 +11190,10 @@ class CpsTableHeaderSelectableDirective {
|
|
|
11190
11190
|
this.checkboxCompRef.destroy();
|
|
11191
11191
|
this.viewContainerRef.clear();
|
|
11192
11192
|
}
|
|
11193
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
11194
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
11193
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableHeaderSelectableDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
11194
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTableHeaderSelectableDirective, isStandalone: true, selector: "[cpsTHdrSelectable]", ngImport: i0 }); }
|
|
11195
11195
|
}
|
|
11196
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
11196
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableHeaderSelectableDirective, decorators: [{
|
|
11197
11197
|
type: Directive,
|
|
11198
11198
|
args: [{
|
|
11199
11199
|
standalone: true,
|
|
@@ -11219,10 +11219,10 @@ class CpsTableRowSelectableDirective {
|
|
|
11219
11219
|
this.checkboxCompRef.destroy();
|
|
11220
11220
|
this.viewContainerRef.clear();
|
|
11221
11221
|
}
|
|
11222
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
11223
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
11222
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableRowSelectableDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
11223
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTableRowSelectableDirective, isStandalone: true, selector: "[cpsTRowSelectable]", inputs: { value: ["cpsTRowSelectable", "value"] }, ngImport: i0 }); }
|
|
11224
11224
|
}
|
|
11225
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
11225
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTableRowSelectableDirective, decorators: [{
|
|
11226
11226
|
type: Directive,
|
|
11227
11227
|
args: [{
|
|
11228
11228
|
standalone: true,
|
|
@@ -11321,10 +11321,10 @@ class CpsTagComponent {
|
|
|
11321
11321
|
this.onChange(value);
|
|
11322
11322
|
this.valueChanged.emit(value);
|
|
11323
11323
|
}
|
|
11324
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
11325
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
11324
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTagComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11325
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsTagComponent, isStandalone: true, selector: "cps-tag", inputs: { label: "label", color: "color", disabled: "disabled", selectable: "selectable", value: "value" }, outputs: { valueChanged: "valueChanged" }, usesOnChanges: true, ngImport: i0, template: "<div\n [ngClass]=\"classesList\"\n [class.unselected]=\"!value && selectable\"\n [ngStyle]=\"{ borderColor: color }\"\n (click)=\"toggleSelected()\">\n <p>{{ label }}</p>\n</div>\n", styles: [":host{width:fit-content;display:inline-block;-webkit-user-select:none;-ms-user-select:none;user-select:none}:host .cps-tag{font-family:Source Sans Pro,sans-serif;min-height:25px;align-items:center;padding:0 10px;background-color:#fff;display:inline-flex;cursor:default;border:solid 1px;border-left:solid 4px}:host .cps-tag.cps-tag--selectable{cursor:pointer}:host .cps-tag.cps-tag--selectable:not(:active):not(:disabled){box-shadow:1px 3px 4px #0000001a}:host .cps-tag.cps-tag--disabled{pointer-events:none;border-color:var(--cps-color-line-dark)!important}:host .cps-tag.cps-tag--disabled p{color:var(--cps-color-text-light)}:host .cps-tag.unselected{border-color:var(--cps-color-text-light)!important}:host .cps-tag p{margin:0;font-size:11px;color:var(--cps-color-text-dark)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
11326
11326
|
}
|
|
11327
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
11327
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTagComponent, decorators: [{
|
|
11328
11328
|
type: Component,
|
|
11329
11329
|
args: [{ imports: [CommonModule], selector: 'cps-tag', template: "<div\n [ngClass]=\"classesList\"\n [class.unselected]=\"!value && selectable\"\n [ngStyle]=\"{ borderColor: color }\"\n (click)=\"toggleSelected()\">\n <p>{{ label }}</p>\n</div>\n", styles: [":host{width:fit-content;display:inline-block;-webkit-user-select:none;-ms-user-select:none;user-select:none}:host .cps-tag{font-family:Source Sans Pro,sans-serif;min-height:25px;align-items:center;padding:0 10px;background-color:#fff;display:inline-flex;cursor:default;border:solid 1px;border-left:solid 4px}:host .cps-tag.cps-tag--selectable{cursor:pointer}:host .cps-tag.cps-tag--selectable:not(:active):not(:disabled){box-shadow:1px 3px 4px #0000001a}:host .cps-tag.cps-tag--disabled{pointer-events:none;border-color:var(--cps-color-line-dark)!important}:host .cps-tag.cps-tag--disabled p{color:var(--cps-color-text-light)}:host .cps-tag.unselected{border-color:var(--cps-color-text-light)!important}:host .cps-tag p{margin:0;font-size:11px;color:var(--cps-color-text-dark)}\n"] }]
|
|
11330
11330
|
}], ctorParameters: () => [{ type: i1$2.NgControl, decorators: [{
|
|
@@ -11572,10 +11572,10 @@ class CpsTextareaComponent {
|
|
|
11572
11572
|
focus() {
|
|
11573
11573
|
this._elementRef?.nativeElement?.querySelector('textarea')?.focus();
|
|
11574
11574
|
}
|
|
11575
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
11576
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
11575
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTextareaComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11576
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTextareaComponent, isStandalone: true, selector: "cps-textarea", inputs: { label: "label", placeholder: "placeholder", rows: "rows", cols: "cols", autofocus: "autofocus", hint: "hint", disabled: "disabled", width: "width", clearable: "clearable", hideDetails: "hideDetails", persistentClear: "persistentClear", error: "error", resizable: "resizable", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", value: "value" }, outputs: { valueChanged: "valueChanged", focused: "focused", prefixIconClicked: "prefixIconClicked", blurred: "blurred" }, ngImport: i0, template: "<div class=\"cps-textarea-container\" [ngStyle]=\"{ width: cvtWidth }\">\n @if (label) {\n <div\n class=\"cps-textarea-label\"\n [ngClass]=\"{ 'cps-textarea-label-disabled': disabled }\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-textarea-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n\n <div\n class=\"cps-textarea-wrap\"\n [ngClass]=\"{\n 'cps-textarea-wrap-error': error,\n clearable: clearable,\n 'persistent-clear': persistentClear\n }\">\n <textarea\n spellcheck=\"false\"\n [cols]=\"cols\"\n [rows]=\"rows\"\n [autofocus]=\"autofocus\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [ngStyle]=\"{\n width: cvtWidth,\n resize: resizable\n }\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\"\n (input)=\"updateValueEvent($event)\"></textarea>\n\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear || (!persistentClear && value) ? 'visible' : 'hidden'\n \"\n class=\"clear-btn\">\n <cps-icon icon=\"delete\" size=\"small\" (click)=\"clear()\"></cps-icon>\n </span>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-textarea-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-textarea-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-textarea-container{width:100%;gap:.2rem!important;display:flex!important;flex-direction:column!important;font-family:Source Sans Pro,sans-serif}:host .cps-textarea-container .cps-textarea-wrap{position:relative;overflow:hidden}:host .cps-textarea-container .cps-textarea-wrap:hover textarea:enabled{border:1px solid var(--cps-color-calm)}:host .cps-textarea-container .cps-textarea-wrap-error textarea{border-color:var(--cps-state-error)!important}:host .cps-textarea-container .cps-textarea-wrap-error textarea:not(:focus){background:#fef3f2!important}:host .cps-textarea-container .cps-textarea-wrap textarea{display:block;font-family:Source Sans Pro,sans-serif;font-size:1rem;color:var(--cps-color-text-dark);background:#fff;padding:.375rem .75rem;line-height:1.5;min-height:38px;border:1px solid var(--cps-color-line-light);transition-property:border-color;transition-duration:.2s;appearance:none;border-radius:4px;width:100%}:host .cps-textarea-container .cps-textarea-wrap textarea:focus{border:1px solid var(--cps-color-calm);outline:0}:host .cps-textarea-container .cps-textarea-wrap textarea:disabled{color:var(--cps-color-text-light);background-color:var(--cps-color-bg-disabled);opacity:1;pointer-events:none}:host .cps-textarea-container .cps-textarea-wrap textarea:focus+.clear-btn cps-icon{opacity:.5}:host .cps-textarea-container .cps-textarea-wrap:hover .clear-btn cps-icon{opacity:.5}:host .cps-textarea-container .cps-textarea-wrap .clear-btn{position:absolute;top:.75rem;right:.75rem;cursor:pointer;color:var(--cps-state-error)}:host .cps-textarea-container .cps-textarea-wrap .clear-btn cps-icon{opacity:0;transition-duration:.2s}:host .cps-textarea-container .cps-textarea-wrap .clear-btn cps-icon:hover{opacity:1!important}:host .cps-textarea-container .persistent-clear .clear-btn cps-icon{opacity:.5}:host .cps-textarea-container .clearable>textarea{padding-right:2.2rem}:host .cps-textarea-container .cps-textarea-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-textarea-container .cps-textarea-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-textarea-container .cps-textarea-label{color:var(--cps-color-text-dark);font-size:.875rem;align-items:center;display:inline-flex;font-weight:600}:host .cps-textarea-container .cps-textarea-label .cps-textarea-label-info-circle{margin-left:8px}:host .cps-textarea-container .cps-textarea-label-disabled{color:var(--cps-color-text-mild)}:host .cps-textarea-container ::placeholder{font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-mild);font-style:italic;opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }] }); }
|
|
11577
11577
|
}
|
|
11578
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
11578
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTextareaComponent, decorators: [{
|
|
11579
11579
|
type: Component,
|
|
11580
11580
|
args: [{ selector: 'cps-textarea', imports: [CommonModule, CpsIconComponent, CpsInfoCircleComponent], template: "<div class=\"cps-textarea-container\" [ngStyle]=\"{ width: cvtWidth }\">\n @if (label) {\n <div\n class=\"cps-textarea-label\"\n [ngClass]=\"{ 'cps-textarea-label-disabled': disabled }\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-textarea-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n\n <div\n class=\"cps-textarea-wrap\"\n [ngClass]=\"{\n 'cps-textarea-wrap-error': error,\n clearable: clearable,\n 'persistent-clear': persistentClear\n }\">\n <textarea\n spellcheck=\"false\"\n [cols]=\"cols\"\n [rows]=\"rows\"\n [autofocus]=\"autofocus\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [ngStyle]=\"{\n width: cvtWidth,\n resize: resizable\n }\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\"\n (input)=\"updateValueEvent($event)\"></textarea>\n\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear || (!persistentClear && value) ? 'visible' : 'hidden'\n \"\n class=\"clear-btn\">\n <cps-icon icon=\"delete\" size=\"small\" (click)=\"clear()\"></cps-icon>\n </span>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-textarea-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-textarea-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-textarea-container{width:100%;gap:.2rem!important;display:flex!important;flex-direction:column!important;font-family:Source Sans Pro,sans-serif}:host .cps-textarea-container .cps-textarea-wrap{position:relative;overflow:hidden}:host .cps-textarea-container .cps-textarea-wrap:hover textarea:enabled{border:1px solid var(--cps-color-calm)}:host .cps-textarea-container .cps-textarea-wrap-error textarea{border-color:var(--cps-state-error)!important}:host .cps-textarea-container .cps-textarea-wrap-error textarea:not(:focus){background:#fef3f2!important}:host .cps-textarea-container .cps-textarea-wrap textarea{display:block;font-family:Source Sans Pro,sans-serif;font-size:1rem;color:var(--cps-color-text-dark);background:#fff;padding:.375rem .75rem;line-height:1.5;min-height:38px;border:1px solid var(--cps-color-line-light);transition-property:border-color;transition-duration:.2s;appearance:none;border-radius:4px;width:100%}:host .cps-textarea-container .cps-textarea-wrap textarea:focus{border:1px solid var(--cps-color-calm);outline:0}:host .cps-textarea-container .cps-textarea-wrap textarea:disabled{color:var(--cps-color-text-light);background-color:var(--cps-color-bg-disabled);opacity:1;pointer-events:none}:host .cps-textarea-container .cps-textarea-wrap textarea:focus+.clear-btn cps-icon{opacity:.5}:host .cps-textarea-container .cps-textarea-wrap:hover .clear-btn cps-icon{opacity:.5}:host .cps-textarea-container .cps-textarea-wrap .clear-btn{position:absolute;top:.75rem;right:.75rem;cursor:pointer;color:var(--cps-state-error)}:host .cps-textarea-container .cps-textarea-wrap .clear-btn cps-icon{opacity:0;transition-duration:.2s}:host .cps-textarea-container .cps-textarea-wrap .clear-btn cps-icon:hover{opacity:1!important}:host .cps-textarea-container .persistent-clear .clear-btn cps-icon{opacity:.5}:host .cps-textarea-container .clearable>textarea{padding-right:2.2rem}:host .cps-textarea-container .cps-textarea-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-textarea-container .cps-textarea-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default}:host .cps-textarea-container .cps-textarea-label{color:var(--cps-color-text-dark);font-size:.875rem;align-items:center;display:inline-flex;font-weight:600}:host .cps-textarea-container .cps-textarea-label .cps-textarea-label-info-circle{margin-left:8px}:host .cps-textarea-container .cps-textarea-label-disabled{color:var(--cps-color-text-mild)}:host .cps-textarea-container ::placeholder{font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-mild);font-style:italic;opacity:1}\n"] }]
|
|
11581
11581
|
}], ctorParameters: () => [{ type: i1$2.NgControl, decorators: [{
|
|
@@ -12191,10 +12191,10 @@ class CpsBaseTreeDropdownComponent {
|
|
|
12191
12191
|
return key ? this.optionsMap.get(key) : undefined;
|
|
12192
12192
|
}
|
|
12193
12193
|
}
|
|
12194
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12195
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
12194
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsBaseTreeDropdownComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12195
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsBaseTreeDropdownComponent, isStandalone: false, selector: "ng-component", inputs: { label: "label", hint: "hint", multiple: "multiple", disabled: "disabled", width: "width", chips: "chips", closableChips: "closableChips", clearable: "clearable", openOnClear: "openOnClear", optionLabel: "optionLabel", optionInfo: "optionInfo", hideDetails: "hideDetails", persistentClear: "persistentClear", prefixIcon: "prefixIcon", prefixIconSize: "prefixIconSize", loading: "loading", virtualScroll: "virtualScroll", numToleratedItems: "numToleratedItems", infoTooltip: "infoTooltip", infoTooltipClass: "infoTooltipClass", infoTooltipMaxWidth: "infoTooltipMaxWidth", infoTooltipPersistent: "infoTooltipPersistent", infoTooltipPosition: "infoTooltipPosition", initialExpandDirectories: "initialExpandDirectories", initialExpandAll: "initialExpandAll", showChevron: "showChevron", options: "options", _value: ["value", "_value"] }, outputs: { valueChanged: "valueChanged", focused: "focused", blurred: "blurred" }, viewQueries: [{ propertyName: "componentContainer", first: true, predicate: ["componentContainer"], descendants: true }, { propertyName: "optionsMenu", first: true, predicate: ["optionsMenu"], descendants: true }, { propertyName: "treeList", first: true, predicate: ["treeList"], descendants: true }, { propertyName: "boxEl", first: true, predicate: ["boxEl"], descendants: true }], usesOnChanges: true, ngImport: i0, template: '', isInline: true }); }
|
|
12196
12196
|
}
|
|
12197
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12197
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsBaseTreeDropdownComponent, decorators: [{
|
|
12198
12198
|
type: Component,
|
|
12199
12199
|
args: [{
|
|
12200
12200
|
template: '',
|
|
@@ -12507,10 +12507,10 @@ class CpsTreeAutocompleteComponent extends CpsBaseTreeDropdownComponent {
|
|
|
12507
12507
|
this.focusInput();
|
|
12508
12508
|
}, 0);
|
|
12509
12509
|
}
|
|
12510
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12511
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsTreeAutocompleteComponent, isStandalone: true, selector: "cps-tree-autocomplete", inputs: { emptyMessage: "emptyMessage", appearance: "appearance", placeholder: "placeholder" }, viewQueries: [{ propertyName: "treeAutocompleteInput", first: true, predicate: ["treeAutocompleteInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-treeautocomplete\"\n tabindex=\"1\"\n [ngClass]=\"{ disabled: disabled, error: error, active: isActive() }\"\n #componentContainer>\n @if (label) {\n <div class=\"cps-treeautocomplete-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-treeautocomplete-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n (keydown)=\"onContainerKeyDown($event)\"\n class=\"cps-treeautocomplete-container\"\n [class.focused]=\"isActive()\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div class=\"cps-treeautocomplete-box\" #boxEl (mousedown)=\"onBoxClick()\">\n <div class=\"cps-treeautocomplete-box-area\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? '#9a9595' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if (\n (treeSelection && !multiple) ||\n (treeSelection?.length > 0 && multiple)\n ) {\n <div class=\"cps-treeautocomplete-box-items\">\n @if (!multiple) {\n <span class=\"single-item\">\n <div class=\"single-item-selection\">\n <span [style.opacity]=\"activeSingle ? 0 : 1\">{{\n treeSelection.label\n }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n treeAutocompleteInputTemplate;\n context: {\n inputClass: 'single-item-input',\n inputStyle: activeSingle ? 'opacity: 1' : null\n }\n \">\n </ng-container>\n </span>\n }\n @if (multiple && !chips) {\n <div class=\"text-group\">\n @for (val of treeSelection; track val; let last = $last) {\n <div\n class=\"text-group-item\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\">\n {{ val.label }}{{ !last ? ',' : '' }}\n </div>\n }\n <ng-container\n *ngTemplateOutlet=\"\n treeAutocompleteInputTemplate;\n context: {\n inputClass: 'multi-item-input'\n }\n \"></ng-container>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"chips-group\">\n @for (val of treeSelection; track val; let last = $last) {\n <cps-chip\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"remove(val)\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\"\n [label]=\"val.label\">\n </cps-chip>\n }\n <ng-container\n *ngTemplateOutlet=\"\n treeAutocompleteInputTemplate;\n context: {\n inputClass: 'multi-chip-input'\n }\n \"></ng-container>\n </div>\n }\n </div>\n } @else {\n <input\n #treeAutocompleteInput\n class=\"cps-treeautocomplete-box-input\"\n spellcheck=\"false\"\n [placeholder]=\"\n (!treeSelection && !multiple) ||\n (treeSelection?.length < 1 && multiple)\n ? placeholder\n : ''\n \"\n (input)=\"filterOptions($event)\"\n (keydown)=\"onInputKeyDown($event)\"\n [(ngModel)]=\"inputText\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n }\n <span class=\"cps-treeautocomplete-box-icons\">\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear ||\n (!persistentClear &&\n ((multiple && treeSelection?.length) ||\n (!multiple && treeSelection)))\n ? 'visible'\n : 'hidden'\n \"\n class=\"cps-treeautocomplete-box-clear-icon\">\n <cps-icon\n icon=\"delete\"\n size=\"small\"\n (click)=\"clear($event)\"></cps-icon>\n </span>\n }\n @if (showChevron) {\n <span\n class=\"cps-treeautocomplete-box-chevron\"\n (mousedown)=\"onChevronClick($event)\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden($event)\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-treeautocomplete-options-menu\">\n <div\n class=\"cps-treeautocomplete-options\"\n [ngStyle]=\"{\n width: boxWidth + 'px'\n }\">\n <p-tree\n #treeList\n [emptyMessage]=\"emptyMessage\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: numToleratedItems }\"\n [scrollHeight]=\"virtualListHeight + 'px'\"\n (onNodeSelect)=\"onSelectNode()\"\n (onNodeExpand)=\"onNodeExpand($event)\"\n (onNodeCollapse)=\"onNodeCollapse($event)\"\n (onFilter)=\"onFilterOptions()\"\n [value]=\"innerOptions\"\n [(selection)]=\"treeSelection\"\n (selectionChange)=\"treeSelectionChanged($event)\"\n [metaKeySelection]=\"multiple ? false : true\"\n [selectionMode]=\"multiple ? 'multiple' : 'single'\">\n <ng-template let-node pTemplate=\"directory\">\n <span class=\"cps-treeautocomplete-directory-elem\">{{\n node.label\n }}</span>\n </ng-template>\n <ng-template let-node pTemplate=\"default\">\n <span class=\"cps-treeautocomplete-option\">\n <span class=\"cps-treeautocomplete-option-left\">\n @if (multiple) {\n <span class=\"cps-treeautocomplete-option-check\"> </span>\n }\n <span\n class=\"cps-treeautocomplete-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.label }}</span\n >\n </span>\n <span\n class=\"cps-treeautocomplete-option-info\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.info }}</span\n >\n </span>\n </ng-template>\n </p-tree>\n </div>\n </cps-menu>\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"cps-treeautocomplete-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-treeautocomplete-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-treeautocomplete-error\">\n {{ error }}\n </div>\n }\n</div>\n\n<ng-template\n #treeAutocompleteInputTemplate\n let-inputClass=\"inputClass\"\n let-inputStyle=\"inputStyle\">\n <input\n #treeAutocompleteInput\n class=\"cps-treeautocomplete-box-input\"\n spellcheck=\"false\"\n [class]=\"inputClass\"\n [style]=\"inputStyle\"\n [placeholder]=\"\n (!treeSelection && !multiple) || (treeSelection?.length < 1 && multiple)\n ? placeholder\n : ''\n \"\n (input)=\"filterOptions($event)\"\n (keydown)=\"onInputKeyDown($event)\"\n [(ngModel)]=\"inputText\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n</ng-template>\n", styles: [":host{display:flex}:host .cps-treeautocomplete{position:relative;width:100%;outline:none;font-family:Source Sans Pro,sans-serif;font-weight:400;display:grid}:host .cps-treeautocomplete .cps-treeautocomplete-container{position:relative}:host .cps-treeautocomplete .cps-treeautocomplete-container .cps-treeautocomplete-progress-bar{position:absolute;bottom:1px;padding:0 1px}:host .cps-treeautocomplete .cps-treeautocomplete-container.focused .cps-treeautocomplete-box{background:#fff!important}:host .cps-treeautocomplete .cps-treeautocomplete-container.borderless .cps-treeautocomplete-box,:host .cps-treeautocomplete .cps-treeautocomplete-container.underlined .cps-treeautocomplete-box{line-height:1;border:none!important;border-radius:0}:host .cps-treeautocomplete .cps-treeautocomplete-container.underlined .cps-treeautocomplete-box{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-treeautocomplete.active .cps-treeautocomplete-box{border:1px solid var(--cps-color-calm)}:host .cps-treeautocomplete.active .cps-treeautocomplete-box .cps-treeautocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeautocomplete.active .cps-treeautocomplete-box .cps-treeautocomplete-box-chevron{top:22px;transform:rotate(180deg)}:host .cps-treeautocomplete .cps-treeautocomplete-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-treeautocomplete .cps-treeautocomplete-label .cps-treeautocomplete-label-info-circle{margin-left:8px;pointer-events:all}:host .cps-treeautocomplete .persistent-clear .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon,:host .cps-treeautocomplete .cps-treeautocomplete-container.focused .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon,:host .cps-treeautocomplete .cps-treeautocomplete-container:hover .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon{opacity:.5}:host .cps-treeautocomplete .cps-treeautocomplete-box{overflow:hidden;min-height:38px;width:100%;cursor:text;background:#fff;font-size:1rem;outline:none;padding:0 12px;border-radius:4px;border:1px solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-treeautocomplete .cps-treeautocomplete-box-area{display:flex;min-height:36px;align-items:center}:host .cps-treeautocomplete .cps-treeautocomplete-box-area .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-treeautocomplete .cps-treeautocomplete-box-input{min-height:36px;padding:0;background-color:transparent;width:0;min-width:30px;flex-grow:1;font-size:1rem;color:var(--cps-color-text-dark);border-style:none;outline:none;font-family:Source Sans Pro,sans-serif}:host .cps-treeautocomplete .cps-treeautocomplete-box-input::placeholder{color:var(--cps-color-text-mild);font-style:italic;opacity:1}:host .cps-treeautocomplete .cps-treeautocomplete-box-items{display:inline-flex;flex-direction:column;width:100%;padding-top:3px;padding-bottom:3px;min-height:36px;justify-content:center;position:relative}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .single-item{color:var(--cps-color-text-dark);display:inline-flex}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .single-item-selection{display:inline-flex;letter-spacing:inherit;line-height:inherit;max-width:100%}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .single-item-input{opacity:0;min-width:0;align-self:flex-start;flex:1 1;transition:none;position:absolute;top:0;bottom:0;width:100%;padding-inline-start:inherit;padding-inline-end:inherit}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .multi-chip-input{min-height:30px}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .multi-item-input{min-height:28px}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .chips-group{display:inline-flex;flex-wrap:wrap;align-items:center}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .chips-group cps-chip{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .text-group{color:var(--cps-color-text-dark);align-items:center;display:inline-flex;flex-wrap:wrap}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .text-group .text-group-item{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-treeautocomplete .cps-treeautocomplete-box:hover{border:1px solid var(--cps-color-calm)}:host .cps-treeautocomplete .cps-treeautocomplete-box:hover .cps-treeautocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons{display:flex}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon{cursor:pointer;display:flex;color:var(--cps-state-error);margin-left:8px}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon:hover{opacity:1!important}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-chevron{display:flex;margin-left:8px;transition-duration:.2s;cursor:pointer}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-chevron:hover ::ng-deep cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host .cps-treeautocomplete .cps-treeautocomplete-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeautocomplete .cps-treeautocomplete-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeautocomplete.disabled{pointer-events:none}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box{background:var(--cps-color-bg-disabled)}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box-items{color:var(--cps-color-text-light)}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box-items .text-group,:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-label{color:var(--cps-color-text-mild)}:host .cps-treeautocomplete.error .cps-treeautocomplete-box{border-color:var(--cps-state-error)!important;background:#fef3f2}:host .about-to-remove{color:var(--cps-color-text-light)}:host .about-to-remove ::ng-deep .cps-chip{background-color:var(--cps-color-bg-mid)}.cps-treeautocomplete-options{background:#fff;overflow-x:hidden;max-height:242px;overflow-y:auto}.cps-treeautocomplete-options ::ng-deep .p-tree{background:#fff;color:var(--cps-color-text-dark);padding:0;border:unset;border-radius:unset}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option{margin-right:8px;display:flex;align-items:center;justify-content:space-between}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-left{display:flex;align-items:center;margin-right:8px}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-info{margin-left:6px;color:var(--cps-color-text-light)}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option .virtual-row{white-space:nowrap}.cps-treeautocomplete-options ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}.cps-treeautocomplete-options ::ng-deep .p-tree-wrapper{overflow:auto}.cps-treeautocomplete-options ::ng-deep .p-tree-root-children{margin:0;padding:0;list-style-type:none;overflow:auto}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node{padding:unset;outline:0 none;min-width:fit-content}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content{border-radius:0;transition:box-shadow .2s;padding:.25rem}.cps-treeautocomplete-options ::ng-deep .p-tree-node-content{display:flex;align-items:center}.cps-treeautocomplete-options ::ng-deep .p-tree-node-content .p-tree-node-label{width:100%}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content .p-tree-node-toggle-button{margin-right:.5rem;width:2rem;height:2rem;color:var(--cps-color-text-light);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content:not(.p-tree-node-selected):hover{background:var(--cps-color-highlight-hover)}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content:not(.p-tree-node-selected){background-color:var(--cps-color-highlight-hover)}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected);color:var(--cps-color-calm);font-weight:600}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected .cps-treeautocomplete-option-check{opacity:1}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected-dark)}.cps-treeautocomplete-options ::ng-deep .p-tree-node-toggle-button{outline:0 none;outline-offset:0;cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative;flex-shrink:0}.cps-treeautocomplete-options ::ng-deep .p-tree-node-toggle-button :hover{color:var(--cps-color-calm)}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content .p-tree-node-toggle-button{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeautocomplete-options ::ng-deep .cps-tree-node-fully-expandable>.p-tree-node-content:hover .p-tree-node-toggle-button{color:var(--cps-color-calm)!important}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-node-children{padding:0 0 0 1rem}.cps-treeautocomplete-options ::ng-deep .p-tree-node-children{margin:0;padding:0;list-style-type:none}.cps-treeautocomplete-options ::ng-deep .p-tree-empty-message{padding:11px;font-size:16px;cursor:default}.cps-treeautocomplete-options ::ng-deep .cps-tree-node-fully-expandable{cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-directory-elem{font-weight:700;font-size:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TreeModule }, { kind: "component", type: i3.Tree, selector: "p-tree", inputs: ["value", "selectionMode", "loadingMode", "selection", "styleClass", "contextMenu", "contextMenuSelectionMode", "contextMenuSelection", "draggableScope", "droppableScope", "draggableNodes", "droppableNodes", "metaKeySelection", "propagateSelectionUp", "propagateSelectionDown", "loading", "loadingIcon", "emptyMessage", "ariaLabel", "togglerAriaLabel", "ariaLabelledBy", "validateDrop", "filter", "filterInputAutoFocus", "filterBy", "filterMode", "filterOptions", "filterPlaceholder", "filteredNodes", "filterLocale", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "indentation", "_templateMap", "trackBy", "highlightOnSelect"], outputs: ["selectionChange", "contextMenuSelectionChange", "onNodeSelect", "onNodeUnselect", "onNodeExpand", "onNodeCollapse", "onNodeContextMenuSelect", "onNodeDoubleClick", "onNodeDrop", "onLazyLoad", "onScroll", "onScrollIndexChange", "onFilter"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }] }); }
|
|
12510
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeAutocompleteComponent, deps: [{ token: i1$2.NgControl, optional: true }, { token: DOCUMENT }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12511
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTreeAutocompleteComponent, isStandalone: true, selector: "cps-tree-autocomplete", inputs: { emptyMessage: "emptyMessage", appearance: "appearance", placeholder: "placeholder" }, viewQueries: [{ propertyName: "treeAutocompleteInput", first: true, predicate: ["treeAutocompleteInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-treeautocomplete\"\n tabindex=\"1\"\n [ngClass]=\"{ disabled: disabled, error: error, active: isActive() }\"\n #componentContainer>\n @if (label) {\n <div class=\"cps-treeautocomplete-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-treeautocomplete-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n (keydown)=\"onContainerKeyDown($event)\"\n class=\"cps-treeautocomplete-container\"\n [class.focused]=\"isActive()\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div class=\"cps-treeautocomplete-box\" #boxEl (mousedown)=\"onBoxClick()\">\n <div class=\"cps-treeautocomplete-box-area\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? '#9a9595' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if (\n (treeSelection && !multiple) ||\n (treeSelection?.length > 0 && multiple)\n ) {\n <div class=\"cps-treeautocomplete-box-items\">\n @if (!multiple) {\n <span class=\"single-item\">\n <div class=\"single-item-selection\">\n <span [style.opacity]=\"activeSingle ? 0 : 1\">{{\n treeSelection.label\n }}</span>\n </div>\n <ng-container\n *ngTemplateOutlet=\"\n treeAutocompleteInputTemplate;\n context: {\n inputClass: 'single-item-input',\n inputStyle: activeSingle ? 'opacity: 1' : null\n }\n \">\n </ng-container>\n </span>\n }\n @if (multiple && !chips) {\n <div class=\"text-group\">\n @for (val of treeSelection; track val; let last = $last) {\n <div\n class=\"text-group-item\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\">\n {{ val.label }}{{ !last ? ',' : '' }}\n </div>\n }\n <ng-container\n *ngTemplateOutlet=\"\n treeAutocompleteInputTemplate;\n context: {\n inputClass: 'multi-item-input'\n }\n \"></ng-container>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"chips-group\">\n @for (val of treeSelection; track val; let last = $last) {\n <cps-chip\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"remove(val)\"\n [ngClass]=\"{\n 'about-to-remove': last && backspaceClickedOnce\n }\"\n [label]=\"val.label\">\n </cps-chip>\n }\n <ng-container\n *ngTemplateOutlet=\"\n treeAutocompleteInputTemplate;\n context: {\n inputClass: 'multi-chip-input'\n }\n \"></ng-container>\n </div>\n }\n </div>\n } @else {\n <input\n #treeAutocompleteInput\n class=\"cps-treeautocomplete-box-input\"\n spellcheck=\"false\"\n [placeholder]=\"\n (!treeSelection && !multiple) ||\n (treeSelection?.length < 1 && multiple)\n ? placeholder\n : ''\n \"\n (input)=\"filterOptions($event)\"\n (keydown)=\"onInputKeyDown($event)\"\n [(ngModel)]=\"inputText\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n }\n <span class=\"cps-treeautocomplete-box-icons\">\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear ||\n (!persistentClear &&\n ((multiple && treeSelection?.length) ||\n (!multiple && treeSelection)))\n ? 'visible'\n : 'hidden'\n \"\n class=\"cps-treeautocomplete-box-clear-icon\">\n <cps-icon\n icon=\"delete\"\n size=\"small\"\n (click)=\"clear($event)\"></cps-icon>\n </span>\n }\n @if (showChevron) {\n <span\n class=\"cps-treeautocomplete-box-chevron\"\n (mousedown)=\"onChevronClick($event)\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden($event)\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-treeautocomplete-options-menu\">\n <div\n class=\"cps-treeautocomplete-options\"\n [ngStyle]=\"{\n width: boxWidth + 'px'\n }\">\n <p-tree\n #treeList\n [emptyMessage]=\"emptyMessage\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: numToleratedItems }\"\n [scrollHeight]=\"virtualListHeight + 'px'\"\n (onNodeSelect)=\"onSelectNode()\"\n (onNodeExpand)=\"onNodeExpand($event)\"\n (onNodeCollapse)=\"onNodeCollapse($event)\"\n (onFilter)=\"onFilterOptions()\"\n [value]=\"innerOptions\"\n [(selection)]=\"treeSelection\"\n (selectionChange)=\"treeSelectionChanged($event)\"\n [metaKeySelection]=\"multiple ? false : true\"\n [selectionMode]=\"multiple ? 'multiple' : 'single'\">\n <ng-template let-node pTemplate=\"directory\">\n <span class=\"cps-treeautocomplete-directory-elem\">{{\n node.label\n }}</span>\n </ng-template>\n <ng-template let-node pTemplate=\"default\">\n <span class=\"cps-treeautocomplete-option\">\n <span class=\"cps-treeautocomplete-option-left\">\n @if (multiple) {\n <span class=\"cps-treeautocomplete-option-check\"> </span>\n }\n <span\n class=\"cps-treeautocomplete-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.label }}</span\n >\n </span>\n <span\n class=\"cps-treeautocomplete-option-info\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.info }}</span\n >\n </span>\n </ng-template>\n </p-tree>\n </div>\n </cps-menu>\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"cps-treeautocomplete-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-treeautocomplete-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-treeautocomplete-error\">\n {{ error }}\n </div>\n }\n</div>\n\n<ng-template\n #treeAutocompleteInputTemplate\n let-inputClass=\"inputClass\"\n let-inputStyle=\"inputStyle\">\n <input\n #treeAutocompleteInput\n class=\"cps-treeautocomplete-box-input\"\n spellcheck=\"false\"\n [class]=\"inputClass\"\n [style]=\"inputStyle\"\n [placeholder]=\"\n (!treeSelection && !multiple) || (treeSelection?.length < 1 && multiple)\n ? placeholder\n : ''\n \"\n (input)=\"filterOptions($event)\"\n (keydown)=\"onInputKeyDown($event)\"\n [(ngModel)]=\"inputText\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\" />\n</ng-template>\n", styles: [":host{display:flex}:host .cps-treeautocomplete{position:relative;width:100%;outline:none;font-family:Source Sans Pro,sans-serif;font-weight:400;display:grid}:host .cps-treeautocomplete .cps-treeautocomplete-container{position:relative}:host .cps-treeautocomplete .cps-treeautocomplete-container .cps-treeautocomplete-progress-bar{position:absolute;bottom:1px;padding:0 1px}:host .cps-treeautocomplete .cps-treeautocomplete-container.focused .cps-treeautocomplete-box{background:#fff!important}:host .cps-treeautocomplete .cps-treeautocomplete-container.borderless .cps-treeautocomplete-box,:host .cps-treeautocomplete .cps-treeautocomplete-container.underlined .cps-treeautocomplete-box{line-height:1;border:none!important;border-radius:0}:host .cps-treeautocomplete .cps-treeautocomplete-container.underlined .cps-treeautocomplete-box{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-treeautocomplete.active .cps-treeautocomplete-box{border:1px solid var(--cps-color-calm)}:host .cps-treeautocomplete.active .cps-treeautocomplete-box .cps-treeautocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeautocomplete.active .cps-treeautocomplete-box .cps-treeautocomplete-box-chevron{top:22px;transform:rotate(180deg)}:host .cps-treeautocomplete .cps-treeautocomplete-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-treeautocomplete .cps-treeautocomplete-label .cps-treeautocomplete-label-info-circle{margin-left:8px;pointer-events:all}:host .cps-treeautocomplete .persistent-clear .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon,:host .cps-treeautocomplete .cps-treeautocomplete-container.focused .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon,:host .cps-treeautocomplete .cps-treeautocomplete-container:hover .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon{opacity:.5}:host .cps-treeautocomplete .cps-treeautocomplete-box{overflow:hidden;min-height:38px;width:100%;cursor:text;background:#fff;font-size:1rem;outline:none;padding:0 12px;border-radius:4px;border:1px solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-treeautocomplete .cps-treeautocomplete-box-area{display:flex;min-height:36px;align-items:center}:host .cps-treeautocomplete .cps-treeautocomplete-box-area .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-treeautocomplete .cps-treeautocomplete-box-input{min-height:36px;padding:0;background-color:transparent;width:0;min-width:30px;flex-grow:1;font-size:1rem;color:var(--cps-color-text-dark);border-style:none;outline:none;font-family:Source Sans Pro,sans-serif}:host .cps-treeautocomplete .cps-treeautocomplete-box-input::placeholder{color:var(--cps-color-text-mild);font-style:italic;opacity:1}:host .cps-treeautocomplete .cps-treeautocomplete-box-items{display:inline-flex;flex-direction:column;width:100%;padding-top:3px;padding-bottom:3px;min-height:36px;justify-content:center;position:relative}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .single-item{color:var(--cps-color-text-dark);display:inline-flex}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .single-item-selection{display:inline-flex;letter-spacing:inherit;line-height:inherit;max-width:100%}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .single-item-input{opacity:0;min-width:0;align-self:flex-start;flex:1 1;transition:none;position:absolute;top:0;bottom:0;width:100%;padding-inline-start:inherit;padding-inline-end:inherit}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .multi-chip-input{min-height:30px}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .multi-item-input{min-height:28px}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .chips-group{display:inline-flex;flex-wrap:wrap;align-items:center}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .chips-group cps-chip{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .text-group{color:var(--cps-color-text-dark);align-items:center;display:inline-flex;flex-wrap:wrap}:host .cps-treeautocomplete .cps-treeautocomplete-box-items .text-group .text-group-item{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-treeautocomplete .cps-treeautocomplete-box:hover{border:1px solid var(--cps-color-calm)}:host .cps-treeautocomplete .cps-treeautocomplete-box:hover .cps-treeautocomplete-box-area .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons{display:flex}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon{cursor:pointer;display:flex;color:var(--cps-state-error);margin-left:8px}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-clear-icon cps-icon:hover{opacity:1!important}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-chevron{display:flex;margin-left:8px;transition-duration:.2s;cursor:pointer}:host .cps-treeautocomplete .cps-treeautocomplete-box .cps-treeautocomplete-box-icons .cps-treeautocomplete-box-chevron:hover ::ng-deep cps-icon .cps-icon{color:var(--cps-color-calm)!important}:host .cps-treeautocomplete .cps-treeautocomplete-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeautocomplete .cps-treeautocomplete-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeautocomplete.disabled{pointer-events:none}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box{background:var(--cps-color-bg-disabled)}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box-items{color:var(--cps-color-text-light)}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box-items .text-group,:host .cps-treeautocomplete.disabled .cps-treeautocomplete-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-treeautocomplete.disabled .cps-treeautocomplete-label{color:var(--cps-color-text-mild)}:host .cps-treeautocomplete.error .cps-treeautocomplete-box{border-color:var(--cps-state-error)!important;background:#fef3f2}:host .about-to-remove{color:var(--cps-color-text-light)}:host .about-to-remove ::ng-deep .cps-chip{background-color:var(--cps-color-bg-mid)}.cps-treeautocomplete-options{background:#fff;overflow-x:hidden;max-height:242px;overflow-y:auto}.cps-treeautocomplete-options ::ng-deep .p-tree{background:#fff;color:var(--cps-color-text-dark);padding:0;border:unset;border-radius:unset}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option{margin-right:8px;display:flex;align-items:center;justify-content:space-between}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-left{display:flex;align-items:center;margin-right:8px}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option-info{margin-left:6px;color:var(--cps-color-text-light)}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-option .virtual-row{white-space:nowrap}.cps-treeautocomplete-options ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}.cps-treeautocomplete-options ::ng-deep .p-tree-wrapper{overflow:auto}.cps-treeautocomplete-options ::ng-deep .p-tree-root-children{margin:0;padding:0;list-style-type:none;overflow:auto}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node{padding:unset;outline:0 none;min-width:fit-content}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content{border-radius:0;transition:box-shadow .2s;padding:.25rem}.cps-treeautocomplete-options ::ng-deep .p-tree-node-content{display:flex;align-items:center}.cps-treeautocomplete-options ::ng-deep .p-tree-node-content .p-tree-node-label{width:100%}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content .p-tree-node-toggle-button{margin-right:.5rem;width:2rem;height:2rem;color:var(--cps-color-text-light);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content:not(.p-tree-node-selected):hover{background:var(--cps-color-highlight-hover)}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content:not(.p-tree-node-selected){background-color:var(--cps-color-highlight-hover)}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected);color:var(--cps-color-calm);font-weight:600}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected .cps-treeautocomplete-option-check{opacity:1}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected-dark)}.cps-treeautocomplete-options ::ng-deep .p-tree-node-toggle-button{outline:0 none;outline-offset:0;cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative;flex-shrink:0}.cps-treeautocomplete-options ::ng-deep .p-tree-node-toggle-button :hover{color:var(--cps-color-calm)}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content .p-tree-node-toggle-button{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeautocomplete-options ::ng-deep .cps-tree-node-fully-expandable>.p-tree-node-content:hover .p-tree-node-toggle-button{color:var(--cps-color-calm)!important}.cps-treeautocomplete-options ::ng-deep .p-tree .p-tree-node-children{padding:0 0 0 1rem}.cps-treeautocomplete-options ::ng-deep .p-tree-node-children{margin:0;padding:0;list-style-type:none}.cps-treeautocomplete-options ::ng-deep .p-tree-empty-message{padding:11px;font-size:16px;cursor:default}.cps-treeautocomplete-options ::ng-deep .cps-tree-node-fully-expandable{cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cps-treeautocomplete-options ::ng-deep .cps-treeautocomplete-directory-elem{font-weight:700;font-size:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TreeModule }, { kind: "component", type: i3.Tree, selector: "p-tree", inputs: ["value", "selectionMode", "loadingMode", "selection", "styleClass", "contextMenu", "contextMenuSelectionMode", "contextMenuSelection", "draggableScope", "droppableScope", "draggableNodes", "droppableNodes", "metaKeySelection", "propagateSelectionUp", "propagateSelectionDown", "loading", "loadingIcon", "emptyMessage", "ariaLabel", "togglerAriaLabel", "ariaLabelledBy", "validateDrop", "filter", "filterInputAutoFocus", "filterBy", "filterMode", "filterOptions", "filterPlaceholder", "filteredNodes", "filterLocale", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "indentation", "_templateMap", "trackBy", "highlightOnSelect"], outputs: ["selectionChange", "contextMenuSelectionChange", "onNodeSelect", "onNodeUnselect", "onNodeExpand", "onNodeCollapse", "onNodeContextMenuSelect", "onNodeDoubleClick", "onNodeDrop", "onLazyLoad", "onScroll", "onScrollIndexChange", "onFilter"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }] }); }
|
|
12512
12512
|
}
|
|
12513
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12513
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeAutocompleteComponent, decorators: [{
|
|
12514
12514
|
type: Component,
|
|
12515
12515
|
args: [{ imports: [
|
|
12516
12516
|
CommonModule,
|
|
@@ -12585,10 +12585,10 @@ class CpsTreeSelectComponent extends CpsBaseTreeDropdownComponent {
|
|
|
12585
12585
|
this.initArrowsNavigaton();
|
|
12586
12586
|
}
|
|
12587
12587
|
}
|
|
12588
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12589
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsTreeSelectComponent, isStandalone: true, selector: "cps-tree-select", inputs: { appearance: "appearance", placeholder: "placeholder" }, providers: [CombineLabelsPipe], usesInheritance: true, ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-treeselect\"\n tabindex=\"0\"\n [ngClass]=\"{ disabled: disabled, error: error, active: isOpened }\"\n #componentContainer\n (keydown)=\"onKeyDown($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\">\n @if (label) {\n <div class=\"cps-treeselect-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-treeselect-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n class=\"cps-treeselect-container\"\n [class.focused]=\"isOpened\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div class=\"cps-treeselect-box\" #boxEl (click)=\"onBoxClick()\">\n <div class=\"cps-treeselect-box-left\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? '#9a9595' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if (\n (!treeSelection && !multiple) ||\n (treeSelection?.length < 1 && multiple)\n ) {\n <div class=\"cps-treeselect-box-placeholder\">\n {{ placeholder }}\n </div>\n }\n @if (\n (treeSelection && !multiple) ||\n (treeSelection?.length > 0 && multiple)\n ) {\n <div class=\"cps-treeselect-box-items\">\n @if (!multiple) {\n <span class=\"single-item\"> {{ treeSelection.label }}</span>\n }\n @if (multiple && !chips) {\n <div class=\"text-group\">\n <span class=\"text-group-item\">\n {{\n treeSelection\n | combineLabels: innerOptions : '' : 'label' : true\n }}\n </span>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"chips-group\">\n @for (val of treeSelection; track val) {\n <cps-chip\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"remove(val)\"\n [label]=\"val.label\">\n </cps-chip>\n }\n </div>\n }\n </div>\n }\n </div>\n <span class=\"cps-treeselect-box-icons\">\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear ||\n (!persistentClear &&\n ((multiple && treeSelection?.length) ||\n (!multiple && treeSelection)))\n ? 'visible'\n : 'hidden'\n \"\n class=\"cps-treeselect-box-clear-icon\">\n <cps-icon\n icon=\"delete\"\n size=\"small\"\n (click)=\"clear($event)\"></cps-icon>\n </span>\n }\n @if (showChevron) {\n <span class=\"cps-treeselect-box-chevron\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden()\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-treeselect-options-menu\">\n <div\n class=\"cps-treeselect-options\"\n [ngStyle]=\"{\n width: boxWidth + 'px'\n }\">\n <p-tree\n #treeList\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: numToleratedItems }\"\n [scrollHeight]=\"virtualListHeight + 'px'\"\n (onNodeSelect)=\"onSelectNode()\"\n (onNodeExpand)=\"onNodeExpand($event)\"\n (onNodeCollapse)=\"onNodeCollapse($event)\"\n [value]=\"innerOptions\"\n [(selection)]=\"treeSelection\"\n (selectionChange)=\"treeSelectionChanged($event)\"\n [metaKeySelection]=\"multiple ? false : true\"\n [selectionMode]=\"multiple ? 'multiple' : 'single'\">\n <ng-template let-node pTemplate=\"directory\">\n <span class=\"cps-treeselect-directory-elem\">{{ node.label }}</span>\n </ng-template>\n <ng-template let-node pTemplate=\"default\">\n <span class=\"cps-treeselect-option\">\n <span class=\"cps-treeselect-option-left\">\n @if (multiple) {\n <span class=\"cps-treeselect-option-check\"> </span>\n }\n <span\n class=\"cps-treeselect-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.label }}</span\n >\n </span>\n <span\n class=\"cps-treeselect-option-info\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.info }}</span\n >\n </span>\n </ng-template>\n </p-tree>\n </div>\n </cps-menu>\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"cps-treeselect-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-treeselect-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-treeselect-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-treeselect{position:relative;width:100%;outline:none;font-family:Source Sans Pro,sans-serif;font-weight:400;display:grid}:host .cps-treeselect .cps-treeselect-container{position:relative}:host .cps-treeselect .cps-treeselect-container .cps-treeselect-progress-bar{position:absolute;bottom:1px;padding:0 1px}:host .cps-treeselect .cps-treeselect-container.borderless .cps-treeselect-box,:host .cps-treeselect .cps-treeselect-container.underlined .cps-treeselect-box{line-height:1;border:none!important;border-radius:0}:host .cps-treeselect .cps-treeselect-container.underlined .cps-treeselect-box{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-treeselect.active .cps-treeselect-box{border:1px solid var(--cps-color-calm)}:host .cps-treeselect.active .cps-treeselect-box .cps-treeselect-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeselect.active .cps-treeselect-box .cps-treeselect-box-chevron{top:22px;transform:rotate(180deg)}:host .cps-treeselect .cps-treeselect-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-treeselect .cps-treeselect-label .cps-treeselect-label-info-circle{margin-left:8px;pointer-events:all}:host .cps-treeselect .persistent-clear .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon,:host .cps-treeselect .cps-treeselect-container.focused .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon,:host .cps-treeselect .cps-treeselect-container:hover .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon{opacity:.5}:host .cps-treeselect .cps-treeselect-box{overflow:hidden;justify-content:space-between;min-height:38px;width:100%;cursor:pointer;background:#fff;font-size:1rem;outline:none;padding:0 12px;border-radius:4px;align-items:center;display:flex;border:1px solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-treeselect .cps-treeselect-box-placeholder{color:var(--cps-color-text-mild);font-style:italic}:host .cps-treeselect .cps-treeselect-box-items{margin-top:3px;margin-bottom:3px}:host .cps-treeselect .cps-treeselect-box-items .text-group,:host .cps-treeselect .cps-treeselect-box-items .single-item{color:var(--cps-color-text-dark);padding-top:3px;padding-bottom:3px}:host .cps-treeselect .cps-treeselect-box-items .chips-group cps-chip{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-treeselect .cps-treeselect-box-items .text-group-item{line-height:1.5}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-left{display:inline-flex;align-items:center}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-left .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-treeselect .cps-treeselect-box:hover{border:1px solid var(--cps-color-calm)}:host .cps-treeselect .cps-treeselect-box:hover .cps-treeselect-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons{display:flex}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon{display:flex;color:var(--cps-state-error);margin-left:8px}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon:hover{opacity:1!important}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-chevron{display:flex;margin-left:8px;transition-duration:.2s}:host .cps-treeselect .cps-treeselect-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeselect .cps-treeselect-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeselect.disabled{pointer-events:none}:host .cps-treeselect.disabled .cps-treeselect-box{background:var(--cps-color-bg-disabled)}:host .cps-treeselect.disabled .cps-treeselect-box-items{color:var(--cps-color-text-light)}:host .cps-treeselect.disabled .cps-treeselect-box-items .text-group,:host .cps-treeselect.disabled .cps-treeselect-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-treeselect.disabled .cps-treeselect-label{color:var(--cps-color-text-mild)}:host .cps-treeselect.error .cps-treeselect-box{border-color:var(--cps-state-error)!important;background:#fef3f2!important}.cps-treeselect-options{background:#fff;overflow-x:hidden;max-height:242px;overflow-y:auto}.cps-treeselect-options ::ng-deep .p-tree{background:#fff;color:var(--cps-color-text-dark);padding:0;border:unset;border-radius:unset}.cps-treeselect-options ::ng-deep .cps-treeselect-option{margin-right:8px;display:flex;align-items:center;justify-content:space-between}.cps-treeselect-options ::ng-deep .cps-treeselect-option-left{display:flex;align-items:center;margin-right:8px}.cps-treeselect-options ::ng-deep .cps-treeselect-option-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-treeselect-options ::ng-deep .cps-treeselect-option-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-treeselect-options ::ng-deep .cps-treeselect-option-info{margin-left:6px;color:var(--cps-color-text-light)}.cps-treeselect-options ::ng-deep .cps-treeselect-option .virtual-row{white-space:nowrap}.cps-treeselect-options ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}.cps-treeselect-options ::ng-deep .p-tree-wrapper{overflow:auto}.cps-treeselect-options ::ng-deep .p-tree-root-children{margin:0;padding:0;list-style-type:none;overflow:auto}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node{padding:unset;outline:0 none;min-width:fit-content}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content{border-radius:0;transition:box-shadow .2s;padding:.25rem}.cps-treeselect-options ::ng-deep .p-tree-node-content{display:flex;align-items:center}.cps-treeselect-options ::ng-deep .p-tree-node-content .p-tree-node-label{width:100%}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content .p-tree-node-toggle-button{margin-right:.5rem;width:2rem;height:2rem;color:var(--cps-color-text-light);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content:not(.p-tree-node-selected):hover{background:var(--cps-color-highlight-hover)}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content:not(.p-tree-node-selected){background-color:var(--cps-color-highlight-hover)}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected);color:var(--cps-color-calm);font-weight:600}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected .cps-treeselect-option-check{opacity:1}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected-dark)}.cps-treeselect-options ::ng-deep .p-tree-node-toggle-button{outline:0 none;outline-offset:0;cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative;flex-shrink:0}.cps-treeselect-options ::ng-deep .p-tree-node-toggle-button :hover{color:var(--cps-color-calm)}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content .p-tree-node-toggle-button{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeselect-options ::ng-deep .cps-tree-node-fully-expandable>.p-tree-node-content:hover .p-tree-node-toggle-button{color:var(--cps-color-calm)!important}.cps-treeselect-options ::ng-deep .p-tree .p-tree-node-children{padding:0 0 0 1rem}.cps-treeselect-options ::ng-deep .p-tree-node-children{margin:0;padding:0;list-style-type:none}.cps-treeselect-options ::ng-deep .cps-tree-node-fully-expandable{cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cps-treeselect-options ::ng-deep .cps-treeselect-directory-elem{font-weight:700;font-size:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TreeModule }, { kind: "component", type: i3.Tree, selector: "p-tree", inputs: ["value", "selectionMode", "loadingMode", "selection", "styleClass", "contextMenu", "contextMenuSelectionMode", "contextMenuSelection", "draggableScope", "droppableScope", "draggableNodes", "droppableNodes", "metaKeySelection", "propagateSelectionUp", "propagateSelectionDown", "loading", "loadingIcon", "emptyMessage", "ariaLabel", "togglerAriaLabel", "ariaLabelledBy", "validateDrop", "filter", "filterInputAutoFocus", "filterBy", "filterMode", "filterOptions", "filterPlaceholder", "filteredNodes", "filterLocale", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "indentation", "_templateMap", "trackBy", "highlightOnSelect"], outputs: ["selectionChange", "contextMenuSelectionChange", "onNodeSelect", "onNodeUnselect", "onNodeExpand", "onNodeCollapse", "onNodeContextMenuSelect", "onNodeDoubleClick", "onNodeDrop", "onLazyLoad", "onScroll", "onScrollIndexChange", "onFilter"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "pipe", type: CombineLabelsPipe, name: "combineLabels" }] }); }
|
|
12588
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeSelectComponent, deps: [{ token: i1$2.NgControl, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12589
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTreeSelectComponent, isStandalone: true, selector: "cps-tree-select", inputs: { appearance: "appearance", placeholder: "placeholder" }, providers: [CombineLabelsPipe], usesInheritance: true, ngImport: i0, template: "<div\n [ngStyle]=\"{ width: cvtWidth }\"\n class=\"cps-treeselect\"\n tabindex=\"0\"\n [ngClass]=\"{ disabled: disabled, error: error, active: isOpened }\"\n #componentContainer\n (keydown)=\"onKeyDown($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\">\n @if (label) {\n <div class=\"cps-treeselect-label\">\n <label>{{ label }}</label>\n @if (infoTooltip) {\n <cps-info-circle\n class=\"cps-treeselect-label-info-circle\"\n size=\"xsmall\"\n [tooltipPosition]=\"infoTooltipPosition\"\n [tooltipContentClass]=\"infoTooltipClass\"\n [tooltipMaxWidth]=\"infoTooltipMaxWidth\"\n [tooltipPersistent]=\"infoTooltipPersistent\"\n [tooltipText]=\"infoTooltip\">\n </cps-info-circle>\n }\n </div>\n }\n <div\n class=\"cps-treeselect-container\"\n [class.focused]=\"isOpened\"\n [ngClass]=\"{\n 'persistent-clear': persistentClear,\n borderless: appearance === 'borderless',\n underlined: appearance === 'underlined'\n }\">\n <div class=\"cps-treeselect-box\" #boxEl (click)=\"onBoxClick()\">\n <div class=\"cps-treeselect-box-left\">\n @if (prefixIcon) {\n <cps-icon\n [icon]=\"prefixIcon\"\n [style.color]=\"disabled ? '#9a9595' : null\"\n [size]=\"prefixIconSize\"\n class=\"prefix-icon\">\n </cps-icon>\n }\n @if (\n (!treeSelection && !multiple) ||\n (treeSelection?.length < 1 && multiple)\n ) {\n <div class=\"cps-treeselect-box-placeholder\">\n {{ placeholder }}\n </div>\n }\n @if (\n (treeSelection && !multiple) ||\n (treeSelection?.length > 0 && multiple)\n ) {\n <div class=\"cps-treeselect-box-items\">\n @if (!multiple) {\n <span class=\"single-item\"> {{ treeSelection.label }}</span>\n }\n @if (multiple && !chips) {\n <div class=\"text-group\">\n <span class=\"text-group-item\">\n {{\n treeSelection\n | combineLabels: innerOptions : '' : 'label' : true\n }}\n </span>\n </div>\n }\n @if (multiple && chips) {\n <div class=\"chips-group\">\n @for (val of treeSelection; track val) {\n <cps-chip\n [disabled]=\"disabled\"\n [closable]=\"closableChips\"\n (closed)=\"remove(val)\"\n [label]=\"val.label\">\n </cps-chip>\n }\n </div>\n }\n </div>\n }\n </div>\n <span class=\"cps-treeselect-box-icons\">\n @if (clearable && !disabled) {\n <span\n [style.visibility]=\"\n persistentClear ||\n (!persistentClear &&\n ((multiple && treeSelection?.length) ||\n (!multiple && treeSelection)))\n ? 'visible'\n : 'hidden'\n \"\n class=\"cps-treeselect-box-clear-icon\">\n <cps-icon\n icon=\"delete\"\n size=\"small\"\n (click)=\"clear($event)\"></cps-icon>\n </span>\n }\n @if (showChevron) {\n <span class=\"cps-treeselect-box-chevron\">\n <cps-icon\n icon=\"chevron-down\"\n size=\"small\"\n [color]=\"disabled ? 'text-light' : 'text-dark'\"></cps-icon>\n </span>\n }\n </span>\n </div>\n\n <cps-menu\n #optionsMenu\n [withArrow]=\"false\"\n (beforeMenuHidden)=\"onBeforeOptionsHidden()\"\n hideTransitionOptions=\"0s linear\"\n containerClass=\"cps-treeselect-options-menu\">\n <div\n class=\"cps-treeselect-options\"\n [ngStyle]=\"{\n width: boxWidth + 'px'\n }\">\n <p-tree\n #treeList\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{ numToleratedItems: numToleratedItems }\"\n [scrollHeight]=\"virtualListHeight + 'px'\"\n (onNodeSelect)=\"onSelectNode()\"\n (onNodeExpand)=\"onNodeExpand($event)\"\n (onNodeCollapse)=\"onNodeCollapse($event)\"\n [value]=\"innerOptions\"\n [(selection)]=\"treeSelection\"\n (selectionChange)=\"treeSelectionChanged($event)\"\n [metaKeySelection]=\"multiple ? false : true\"\n [selectionMode]=\"multiple ? 'multiple' : 'single'\">\n <ng-template let-node pTemplate=\"directory\">\n <span class=\"cps-treeselect-directory-elem\">{{ node.label }}</span>\n </ng-template>\n <ng-template let-node pTemplate=\"default\">\n <span class=\"cps-treeselect-option\">\n <span class=\"cps-treeselect-option-left\">\n @if (multiple) {\n <span class=\"cps-treeselect-option-check\"> </span>\n }\n <span\n class=\"cps-treeselect-option-label\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.label }}</span\n >\n </span>\n <span\n class=\"cps-treeselect-option-info\"\n [class.virtual-row]=\"virtualScroll\"\n >{{ node.info }}</span\n >\n </span>\n </ng-template>\n </p-tree>\n </div>\n </cps-menu>\n @if (loading) {\n <cps-progress-linear\n height=\"3\"\n radius=\"4\"\n opacity=\"0.3\"\n class=\"cps-treeselect-progress-bar\"\n bgColor=\"transparent\">\n </cps-progress-linear>\n }\n </div>\n @if (!error && !hideDetails) {\n <div class=\"cps-treeselect-hint\">\n {{ hint }}\n </div>\n }\n @if (error && !hideDetails) {\n <div class=\"cps-treeselect-error\">\n {{ error }}\n </div>\n }\n</div>\n", styles: [":host{display:flex}:host .cps-treeselect{position:relative;width:100%;outline:none;font-family:Source Sans Pro,sans-serif;font-weight:400;display:grid}:host .cps-treeselect .cps-treeselect-container{position:relative}:host .cps-treeselect .cps-treeselect-container .cps-treeselect-progress-bar{position:absolute;bottom:1px;padding:0 1px}:host .cps-treeselect .cps-treeselect-container.borderless .cps-treeselect-box,:host .cps-treeselect .cps-treeselect-container.underlined .cps-treeselect-box{line-height:1;border:none!important;border-radius:0}:host .cps-treeselect .cps-treeselect-container.underlined .cps-treeselect-box{border-bottom:1px solid var(--cps-color-line-light)!important}:host .cps-treeselect.active .cps-treeselect-box{border:1px solid var(--cps-color-calm)}:host .cps-treeselect.active .cps-treeselect-box .cps-treeselect-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeselect.active .cps-treeselect-box .cps-treeselect-box-chevron{top:22px;transform:rotate(180deg)}:host .cps-treeselect .cps-treeselect-label{align-items:center;display:inline-flex;margin-bottom:.2rem;color:var(--cps-color-text-dark);font-size:.875rem;font-weight:600}:host .cps-treeselect .cps-treeselect-label .cps-treeselect-label-info-circle{margin-left:8px;pointer-events:all}:host .cps-treeselect .persistent-clear .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon,:host .cps-treeselect .cps-treeselect-container.focused .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon,:host .cps-treeselect .cps-treeselect-container:hover .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon{opacity:.5}:host .cps-treeselect .cps-treeselect-box{overflow:hidden;justify-content:space-between;min-height:38px;width:100%;cursor:pointer;background:#fff;font-size:1rem;outline:none;padding:0 12px;border-radius:4px;align-items:center;display:flex;border:1px solid var(--cps-color-line-light);transition-duration:.2s}:host .cps-treeselect .cps-treeselect-box-placeholder{color:var(--cps-color-text-mild);font-style:italic}:host .cps-treeselect .cps-treeselect-box-items{margin-top:3px;margin-bottom:3px}:host .cps-treeselect .cps-treeselect-box-items .text-group,:host .cps-treeselect .cps-treeselect-box-items .single-item{color:var(--cps-color-text-dark);padding-top:3px;padding-bottom:3px}:host .cps-treeselect .cps-treeselect-box-items .chips-group cps-chip{padding-bottom:3px;padding-top:3px;padding-right:4px}:host .cps-treeselect .cps-treeselect-box-items .text-group-item{line-height:1.5}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-left{display:inline-flex;align-items:center}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-left .prefix-icon{margin-right:.5rem;color:var(--cps-color-text-dark)}:host .cps-treeselect .cps-treeselect-box:hover{border:1px solid var(--cps-color-calm)}:host .cps-treeselect .cps-treeselect-box:hover .cps-treeselect-box-left .prefix-icon{color:var(--cps-color-calm)}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons{display:flex}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon{display:flex;color:var(--cps-state-error);margin-left:8px}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon{opacity:0;transition-duration:.2s}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-clear-icon cps-icon:hover{opacity:1!important}:host .cps-treeselect .cps-treeselect-box .cps-treeselect-box-icons .cps-treeselect-box-chevron{display:flex;margin-left:8px;transition-duration:.2s}:host .cps-treeselect .cps-treeselect-hint{color:var(--cps-color-text-mild);font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeselect .cps-treeselect-error{color:var(--cps-state-error);font-weight:700;font-size:.75rem;min-height:1.125rem;line-height:1.125rem;cursor:default;margin-top:.2rem}:host .cps-treeselect.disabled{pointer-events:none}:host .cps-treeselect.disabled .cps-treeselect-box{background:var(--cps-color-bg-disabled)}:host .cps-treeselect.disabled .cps-treeselect-box-items{color:var(--cps-color-text-light)}:host .cps-treeselect.disabled .cps-treeselect-box-items .text-group,:host .cps-treeselect.disabled .cps-treeselect-box-items .single-item{color:var(--cps-color-text-light)}:host .cps-treeselect.disabled .cps-treeselect-label{color:var(--cps-color-text-mild)}:host .cps-treeselect.error .cps-treeselect-box{border-color:var(--cps-state-error)!important;background:#fef3f2!important}.cps-treeselect-options{background:#fff;overflow-x:hidden;max-height:242px;overflow-y:auto}.cps-treeselect-options ::ng-deep .p-tree{background:#fff;color:var(--cps-color-text-dark);padding:0;border:unset;border-radius:unset}.cps-treeselect-options ::ng-deep .cps-treeselect-option{margin-right:8px;display:flex;align-items:center;justify-content:space-between}.cps-treeselect-options ::ng-deep .cps-treeselect-option-left{display:flex;align-items:center;margin-right:8px}.cps-treeselect-options ::ng-deep .cps-treeselect-option-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-treeselect-options ::ng-deep .cps-treeselect-option-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-treeselect-options ::ng-deep .cps-treeselect-option-info{margin-left:6px;color:var(--cps-color-text-light)}.cps-treeselect-options ::ng-deep .cps-treeselect-option .virtual-row{white-space:nowrap}.cps-treeselect-options ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}.cps-treeselect-options ::ng-deep .p-tree-wrapper{overflow:auto}.cps-treeselect-options ::ng-deep .p-tree-root-children{margin:0;padding:0;list-style-type:none;overflow:auto}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node{padding:unset;outline:0 none;min-width:fit-content}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content{border-radius:0;transition:box-shadow .2s;padding:.25rem}.cps-treeselect-options ::ng-deep .p-tree-node-content{display:flex;align-items:center}.cps-treeselect-options ::ng-deep .p-tree-node-content .p-tree-node-label{width:100%}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content .p-tree-node-toggle-button{margin-right:.5rem;width:2rem;height:2rem;color:var(--cps-color-text-light);border:0 none;background:transparent;border-radius:50%;transition:background-color .2s,color .2s,box-shadow .2s}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content:not(.p-tree-node-selected):hover{background:var(--cps-color-highlight-hover)}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content:not(.p-tree-node-selected){background-color:var(--cps-color-highlight-hover)}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected);color:var(--cps-color-calm);font-weight:600}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node .p-tree-node-content.p-tree-node-selected .cps-treeselect-option-check{opacity:1}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content.p-tree-node-selected{background:var(--cps-color-highlight-selected-dark)}.cps-treeselect-options ::ng-deep .p-tree-node-toggle-button{outline:0 none;outline-offset:0;cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;position:relative;flex-shrink:0}.cps-treeselect-options ::ng-deep .p-tree-node-toggle-button :hover{color:var(--cps-color-calm)}.cps-treeselect-options ::ng-deep .p-tree .p-tree-root-children .p-tree-node:focus>.p-tree-node-content .p-tree-node-toggle-button{outline:0 none;outline-offset:0;box-shadow:unset}.cps-treeselect-options ::ng-deep .cps-tree-node-fully-expandable>.p-tree-node-content:hover .p-tree-node-toggle-button{color:var(--cps-color-calm)!important}.cps-treeselect-options ::ng-deep .p-tree .p-tree-node-children{padding:0 0 0 1rem}.cps-treeselect-options ::ng-deep .p-tree-node-children{margin:0;padding:0;list-style-type:none}.cps-treeselect-options ::ng-deep .cps-tree-node-fully-expandable{cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cps-treeselect-options ::ng-deep .cps-treeselect-directory-elem{font-weight:700;font-size:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TreeModule }, { kind: "component", type: i3.Tree, selector: "p-tree", inputs: ["value", "selectionMode", "loadingMode", "selection", "styleClass", "contextMenu", "contextMenuSelectionMode", "contextMenuSelection", "draggableScope", "droppableScope", "draggableNodes", "droppableNodes", "metaKeySelection", "propagateSelectionUp", "propagateSelectionDown", "loading", "loadingIcon", "emptyMessage", "ariaLabel", "togglerAriaLabel", "ariaLabelledBy", "validateDrop", "filter", "filterInputAutoFocus", "filterBy", "filterMode", "filterOptions", "filterPlaceholder", "filteredNodes", "filterLocale", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "indentation", "_templateMap", "trackBy", "highlightOnSelect"], outputs: ["selectionChange", "contextMenuSelectionChange", "onNodeSelect", "onNodeUnselect", "onNodeExpand", "onNodeCollapse", "onNodeContextMenuSelect", "onNodeDoubleClick", "onNodeDrop", "onLazyLoad", "onScroll", "onScrollIndexChange", "onFilter"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsChipComponent, selector: "cps-chip", inputs: ["label", "icon", "iconColor", "iconPosition", "closable", "disabled", "closeButtonAriaLabel"], outputs: ["closed"] }, { kind: "component", type: CpsProgressLinearComponent, selector: "cps-progress-linear", inputs: ["width", "height", "color", "bgColor", "opacity", "radius"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "pipe", type: CombineLabelsPipe, name: "combineLabels" }] }); }
|
|
12590
12590
|
}
|
|
12591
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12591
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeSelectComponent, decorators: [{
|
|
12592
12592
|
type: Component,
|
|
12593
12593
|
args: [{ imports: [
|
|
12594
12594
|
CommonModule,
|
|
@@ -12737,10 +12737,10 @@ class CpsTreeTableColumnFilterDirective {
|
|
|
12737
12737
|
this.filterCompRef.destroy();
|
|
12738
12738
|
this.viewContainerRef.clear();
|
|
12739
12739
|
}
|
|
12740
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12741
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
12740
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableColumnFilterDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
12741
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTreeTableColumnFilterDirective, isStandalone: true, selector: "[cpsTTColFilter]", inputs: { field: ["cpsTTColFilter", "field"], filterType: "filterType", filterPersistent: "filterPersistent", filterShowClearButton: "filterShowClearButton", filterShowApplyButton: "filterShowApplyButton", filterShowCloseButton: "filterShowCloseButton", filterShowMatchModes: "filterShowMatchModes", filterMatchModes: "filterMatchModes", filterShowOperator: "filterShowOperator", filterHeaderTitle: "filterHeaderTitle", filterHideOnClear: "filterHideOnClear", filterCategoryOptions: "filterCategoryOptions", filterAsButtonToggle: "filterAsButtonToggle", filterSingleSelection: "filterSingleSelection", filterPlaceholder: "filterPlaceholder" }, exportAs: ["cpsTTColFilter"], usesOnChanges: true, ngImport: i0 }); }
|
|
12742
12742
|
}
|
|
12743
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12743
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableColumnFilterDirective, decorators: [{
|
|
12744
12744
|
type: Directive,
|
|
12745
12745
|
args: [{
|
|
12746
12746
|
standalone: true,
|
|
@@ -12785,10 +12785,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
|
|
|
12785
12785
|
* @group Directives
|
|
12786
12786
|
*/
|
|
12787
12787
|
class CpsTreeTableColumnResizableDirective extends TTResizableColumn {
|
|
12788
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12789
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
12788
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableColumnResizableDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
12789
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTreeTableColumnResizableDirective, isStandalone: true, selector: "[cpsTTColResizable]", inputs: { ttResizableColumnDisabled: ["cpsTTColResizableDisabled", "ttResizableColumnDisabled"] }, usesInheritance: true, ngImport: i0 }); }
|
|
12790
12790
|
}
|
|
12791
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12791
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableColumnResizableDirective, decorators: [{
|
|
12792
12792
|
type: Directive,
|
|
12793
12793
|
args: [{
|
|
12794
12794
|
standalone: true,
|
|
@@ -12827,10 +12827,10 @@ class CpsTreeTableColumnSortableDirective extends TTSortableColumn {
|
|
|
12827
12827
|
this.sortIconRef.destroy();
|
|
12828
12828
|
this.viewContainerRef.clear();
|
|
12829
12829
|
}
|
|
12830
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12831
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
12830
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableColumnSortableDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i2$2.TreeTable }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
12831
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTreeTableColumnSortableDirective, isStandalone: true, selector: "[cpsTTColSortable]", inputs: { field: ["cpsTTColSortable", "field"] }, usesInheritance: true, ngImport: i0 }); }
|
|
12832
12832
|
}
|
|
12833
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12833
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableColumnSortableDirective, decorators: [{
|
|
12834
12834
|
type: Directive,
|
|
12835
12835
|
args: [{
|
|
12836
12836
|
standalone: true,
|
|
@@ -12860,10 +12860,10 @@ class CpsTreeTableHeaderSelectableDirective {
|
|
|
12860
12860
|
this.checkboxCompRef.destroy();
|
|
12861
12861
|
this.viewContainerRef.clear();
|
|
12862
12862
|
}
|
|
12863
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12864
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
12863
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableHeaderSelectableDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
12864
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTreeTableHeaderSelectableDirective, isStandalone: true, selector: "[cpsTTHdrSelectable]", ngImport: i0 }); }
|
|
12865
12865
|
}
|
|
12866
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12866
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableHeaderSelectableDirective, decorators: [{
|
|
12867
12867
|
type: Directive,
|
|
12868
12868
|
args: [{
|
|
12869
12869
|
standalone: true,
|
|
@@ -12890,10 +12890,10 @@ class CpsTreeTableRowSelectableDirective {
|
|
|
12890
12890
|
this.checkboxCompRef.destroy();
|
|
12891
12891
|
this.viewContainerRef.clear();
|
|
12892
12892
|
}
|
|
12893
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12894
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
12893
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableRowSelectableDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
12894
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTreeTableRowSelectableDirective, isStandalone: true, selector: "[cpsTTRowSelectable]", inputs: { value: ["cpsTTRowSelectable", "value"] }, ngImport: i0 }); }
|
|
12895
12895
|
}
|
|
12896
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12896
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableRowSelectableDirective, decorators: [{
|
|
12897
12897
|
type: Directive,
|
|
12898
12898
|
args: [{
|
|
12899
12899
|
standalone: true,
|
|
@@ -12931,10 +12931,10 @@ class CpsTreetableRowTogglerDirective {
|
|
|
12931
12931
|
this.togglerCompRef.destroy();
|
|
12932
12932
|
this.viewContainerRef.clear();
|
|
12933
12933
|
}
|
|
12934
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
12935
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
12934
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreetableRowTogglerDirective, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
12935
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsTreetableRowTogglerDirective, isStandalone: true, selector: "[cpsTTRowToggler]", inputs: { rowNode: ["cpsTTRowToggler", "rowNode"] }, ngImport: i0 }); }
|
|
12936
12936
|
}
|
|
12937
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
12937
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreetableRowTogglerDirective, decorators: [{
|
|
12938
12938
|
type: Directive,
|
|
12939
12939
|
args: [{
|
|
12940
12940
|
standalone: true,
|
|
@@ -13279,10 +13279,10 @@ class TreeTableUnsortDirective {
|
|
|
13279
13279
|
}
|
|
13280
13280
|
});
|
|
13281
13281
|
}
|
|
13282
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
13283
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
13282
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TreeTableUnsortDirective, deps: [{ token: i2$2.TreeTable, host: true, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
13283
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: TreeTableUnsortDirective, isStandalone: true, selector: "[ttWithUnsort]", ngImport: i0 }); }
|
|
13284
13284
|
}
|
|
13285
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
13285
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: TreeTableUnsortDirective, decorators: [{
|
|
13286
13286
|
type: Directive,
|
|
13287
13287
|
args: [{
|
|
13288
13288
|
standalone: true,
|
|
@@ -13313,10 +13313,10 @@ class CpsTreeTableDetectFilterTypePipe {
|
|
|
13313
13313
|
}
|
|
13314
13314
|
return 'text';
|
|
13315
13315
|
}
|
|
13316
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
13317
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.
|
|
13316
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableDetectFilterTypePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
13317
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableDetectFilterTypePipe, isStandalone: true, name: "cpsTTDetectFilterType" }); }
|
|
13318
13318
|
}
|
|
13319
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
13319
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableDetectFilterTypePipe, decorators: [{
|
|
13320
13320
|
type: Pipe,
|
|
13321
13321
|
args: [{
|
|
13322
13322
|
name: 'cpsTTDetectFilterType',
|
|
@@ -14392,8 +14392,8 @@ class CpsTreeTableComponent {
|
|
|
14392
14392
|
return cleanNode;
|
|
14393
14393
|
});
|
|
14394
14394
|
}
|
|
14395
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
14396
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
14395
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14396
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsTreeTableComponent, isStandalone: true, selector: "cps-tree-table", inputs: { columns: "columns", colHeaderName: "colHeaderName", colFieldName: "colFieldName", colFilterTypeName: "colFilterTypeName", colDateFormatName: "colDateFormatName", minWidth: "minWidth", minWidthForBodyOnly: "minWidthForBodyOnly", autoLayout: "autoLayout", striped: "striped", bordered: "bordered", size: "size", selectable: "selectable", rowHover: "rowHover", showRowMenu: "showRowMenu", showRowRemoveButton: "showRowRemoveButton", showRowEditButton: "showRowEditButton", rowMenuItems: "rowMenuItems", loading: "loading", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", sortable: "sortable", sortMode: "sortMode", customSort: "customSort", hasToolbar: "hasToolbar", toolbarSize: "toolbarSize", toolbarTitle: "toolbarTitle", toolbarIcon: "toolbarIcon", toolbarIconColor: "toolbarIconColor", scrollable: "scrollable", scrollHeight: "scrollHeight", virtualScroll: "virtualScroll", virtualScrollItemHeight: "virtualScrollItemHeight", numToleratedItems: "numToleratedItems", paginator: "paginator", alwaysShowPaginator: "alwaysShowPaginator", rowsPerPageOptions: "rowsPerPageOptions", first: "first", rows: "rows", resetPageOnRowsChange: "resetPageOnRowsChange", resetPageOnSort: "resetPageOnSort", totalRecords: "totalRecords", emptyMessage: "emptyMessage", emptyBodyHeight: "emptyBodyHeight", lazy: "lazy", lazyLoadOnInit: "lazyLoadOnInit", showGlobalFilter: "showGlobalFilter", globalFilterPlaceholder: "globalFilterPlaceholder", globalFilterFields: "globalFilterFields", clearGlobalFilterOnLoading: "clearGlobalFilterOnLoading", showRemoveBtnOnSelect: "showRemoveBtnOnSelect", removeBtnOnSelectDisabled: "removeBtnOnSelectDisabled", showAdditionalBtnOnSelect: "showAdditionalBtnOnSelect", additionalBtnOnSelectTitle: "additionalBtnOnSelectTitle", additionalBtnOnSelectIcon: "additionalBtnOnSelectIcon", additionalBtnOnSelectDisabled: "additionalBtnOnSelectDisabled", showActionBtn: "showActionBtn", actionBtnTitle: "actionBtnTitle", actionBtnIcon: "actionBtnIcon", actionBtnDisabled: "actionBtnDisabled", showDataReloadBtn: "showDataReloadBtn", dataReloadBtnDisabled: "dataReloadBtnDisabled", showColumnsToggleBtn: "showColumnsToggleBtn", columnsToggleBtnDisabled: "columnsToggleBtnDisabled", initialColumns: "initialColumns", filterableByColumns: "filterableByColumns", autoColumnFilterType: "autoColumnFilterType", showExportBtn: "showExportBtn", exportBtnDisabled: "exportBtnDisabled", exportFilename: "exportFilename", exportOriginalData: "exportOriginalData", renderDataAsHTML: "renderDataAsHTML", data: "data", resizableColumns: "resizableColumns", columnResizeMode: "columnResizeMode" }, outputs: { rowsSelected: "rowsSelected", actionBtnClicked: "actionBtnClicked", additionalBtnOnSelectClicked: "additionalBtnOnSelectClicked", editRowBtnClicked: "editRowBtnClicked", rowsToRemove: "rowsToRemove", pageChanged: "pageChanged", sorted: "sorted", filtered: "filtered", columnsSelected: "columnsSelected", lazyLoaded: "lazyLoaded", dataReloadBtnClicked: "dataReloadBtnClicked", nodeExpanded: "nodeExpanded", nodeCollapsed: "nodeCollapsed", nodeSelected: "nodeSelected", nodeUnselected: "nodeUnselected", customSortFunction: "customSortFunction" }, providers: [
|
|
14397
14397
|
TreeTableStyle,
|
|
14398
14398
|
TreeTableService,
|
|
14399
14399
|
{
|
|
@@ -14404,7 +14404,7 @@ class CpsTreeTableComponent {
|
|
|
14404
14404
|
}
|
|
14405
14405
|
], queries: [{ propertyName: "toolbarTemplate", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "headerTemplate", first: true, predicate: ["header"], descendants: true }, { propertyName: "nestedHeaderTemplate", first: true, predicate: ["nestedHeader"], descendants: true }, { propertyName: "bodyTemplate", first: true, predicate: ["body"], descendants: true }, { propertyName: "colgroupTemplate", first: true, predicate: ["colgroup"], descendants: true }], viewQueries: [{ propertyName: "primengTreeTable", first: true, predicate: ["primengTreeTable"], descendants: true, static: true }, { propertyName: "globalFilterComp", first: true, predicate: ["globalFilterComp"], descendants: true }, { propertyName: "colToggleMenu", first: true, predicate: ["colToggleMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p-treeTable\n #primengTreeTable\n ttWithUnsort\n [ngClass]=\"{\n 'cps-treetable-loading': loading,\n 'cps-treetable-flex': defScrollHeight === 'flex',\n 'cps-treetable-nonvirtual': !virtualScroll,\n 'cps-treetable-autolayout-calced': autoLayout && scrollable\n }\"\n [value]=\"data\"\n [autoLayout]=\"autoLayout && !scrollable\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n [virtualScroll]=\"virtualScroll\"\n [virtualScrollItemSize]=\"virtualScrollItemSize\"\n [virtualScrollOptions]=\"{\n numToleratedItems: numToleratedItems,\n autoSize: false\n }\"\n [columns]=\"selectedColumns\"\n [loading]=\"loading\"\n [rowHover]=\"rowHover\"\n [lazy]=\"lazy\"\n [(selection)]=\"selectedRows\"\n (selectionChange)=\"onSelectionChanged($event)\"\n compareSelectionBy=\"deepEquals\"\n [lazyLoadOnInit]=\"lazyLoadOnInit\"\n [styleClass]=\"styleClass\"\n [tableStyle]=\"tableStyle\"\n [tableStyleClass]=\"tableStyleClass\"\n [customSort]=\"customSort\"\n [sortMode]=\"sortMode\"\n [globalFilterFields]=\"globalFilterFields\"\n [paginator]=\"paginator\"\n [showCurrentPageReport]=\"true\"\n [alwaysShowPaginator]=\"alwaysShowPaginator\"\n [rows]=\"rows\"\n [first]=\"first\"\n [totalRecords]=\"totalRecords\"\n [resetPageOnSort]=\"resetPageOnSort\"\n [resizableColumns]=\"resizableColumns\"\n [columnResizeMode]=\"columnResizeMode\"\n [showGridlines]=\"bordered\"\n currentPageReportTemplate=\"{first} - {last} of {totalRecords}\"\n (onPage)=\"onPageChange($event)\"\n (onSort)=\"onSort($event)\"\n (onFilter)=\"onFilter($event)\"\n (onLazyLoad)=\"onLazyLoaded($event)\"\n (sortFunction)=\"onSortFunction($event)\"\n (onNodeExpand)=\"onNodeExpanded($event)\"\n (onNodeCollapse)=\"onNodeCollapsed($event)\"\n (onNodeSelect)=\"onNodeSelected($event)\"\n (onNodeUnselect)=\"onNodeUnselected($event)\">\n @if (colgroupTemplate) {\n <ng-template pTemplate=\"colgroup\">\n <ng-container *ngTemplateOutlet=\"colgroupTemplate\"></ng-container>\n </ng-template>\n }\n @if (hasToolbar) {\n <ng-template pTemplate=\"caption\">\n @if (toolbarTemplate) {\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n }\n @if (!toolbarTemplate) {\n <div class=\"cps-treetable-tbar-left\">\n @if (toolbarIcon) {\n <div class=\"cps-treetable-tbar-icon\">\n <cps-icon\n [icon]=\"toolbarIcon\"\n [color]=\"toolbarIconColor\"></cps-icon>\n </div>\n }\n <div class=\"cps-treetable-tbar-title\">{{ toolbarTitle }}</div>\n @if (showGlobalFilter) {\n <div class=\"cps-treetable-tbar-global-filter\">\n <cps-input\n #globalFilterComp\n prefixIcon=\"search\"\n [placeholder]=\"globalFilterPlaceholder\"\n (valueChanged)=\"onFilterGlobal($event)\"\n [clearable]=\"true\"\n [disabled]=\"loading\"\n [appearance]=\"\n toolbarSize === 'small' ? 'underlined' : 'outlined'\n \"\n [hideDetails]=\"true\">\n </cps-input>\n </div>\n }\n </div>\n <div class=\"cps-treetable-tbar-right\">\n @if (showRemoveBtnOnSelect && selectedRows.length > 0) {\n <div class=\"cps-treetable-tbar-btn-on-select\">\n <cps-button\n label=\"Remove\"\n [disabled]=\"removeBtnOnSelectDisabled\"\n color=\"prepared\"\n type=\"borderless\"\n icon=\"remove\"\n [size]=\"toolbarSize\"\n (clicked)=\"removeSelected()\">\n </cps-button>\n </div>\n }\n @if (showAdditionalBtnOnSelect && selectedRows.length > 0) {\n <div class=\"cps-treetable-tbar-btn-on-select\">\n <cps-button\n [label]=\"additionalBtnOnSelectTitle\"\n [disabled]=\"additionalBtnOnSelectDisabled\"\n color=\"prepared\"\n type=\"borderless\"\n [icon]=\"additionalBtnOnSelectIcon\"\n [size]=\"toolbarSize\"\n (clicked)=\"onClickAdditionalBtnOnSelect()\">\n </cps-button>\n </div>\n }\n @if (showActionBtn) {\n <div class=\"cps-treetable-tbar-action-btn\">\n <cps-button\n [label]=\"actionBtnTitle\"\n [disabled]=\"actionBtnDisabled\"\n color=\"prepared\"\n type=\"outlined\"\n [icon]=\"actionBtnIcon\"\n [size]=\"toolbarSize\"\n (clicked)=\"onClickActionBtn()\">\n </cps-button>\n </div>\n }\n @if (showExportBtn) {\n <div\n class=\"cps-treetable-tbar-export-btn ml-2\"\n [ngClass]=\"{ 'btn-disabled': exportBtnDisabled }\">\n <cps-button\n label=\"Export\"\n [disabled]=\"exportBtnDisabled\"\n color=\"prepared\"\n type=\"solid\"\n icon=\"export\"\n [size]=\"toolbarSize\"\n (clicked)=\"onExportData()\">\n </cps-button>\n </div>\n }\n @if (showColumnsToggleBtn && columns.length > 0) {\n <div\n class=\"cps-treetable-tbar-coltoggle-btn\"\n [ngClass]=\"{ 'btn-disabled': columnsToggleBtnDisabled }\">\n <cps-icon\n icon=\"columns\"\n size=\"normal\"\n [color]=\"\n columnsToggleBtnDisabled\n ? 'text-lightest'\n : 'prepared-lighten1'\n \"\n (click)=\"onColumnsToggle($event)\"></cps-icon>\n <cps-menu #colToggleMenu [withArrow]=\"false\">\n <div class=\"cps-treetable-coltoggle-menu\">\n <div\n class=\"cps-treetable-coltoggle-menu-item select-all-option\"\n [class.allselected]=\"\n selectedColumns.length === columns.length\n \"\n (click)=\"toggleAllColumns()\">\n <span class=\"cps-treetable-coltoggle-menu-item-left\">\n <span class=\"cps-treetable-coltoggle-menu-item-check\">\n </span>\n <span class=\"cps-treetable-coltoggle-menu-item-label\"\n >Show all columns</span\n >\n </span>\n </div>\n @for (col of columns; track col) {\n <div\n class=\"cps-treetable-coltoggle-menu-item\"\n (click)=\"onSelectColumn(col)\"\n [class.selected]=\"isColumnSelected(col)\">\n <span class=\"cps-treetable-coltoggle-menu-item-left\">\n <span\n class=\"cps-treetable-coltoggle-menu-item-check\"></span>\n <span class=\"cps-treetable-coltoggle-menu-item-label\">{{\n col[colHeaderName]\n }}</span>\n </span>\n </div>\n }\n </div>\n </cps-menu>\n </div>\n }\n @if (showDataReloadBtn) {\n <div\n class=\"cps-treetable-tbar-reload-btn\"\n [ngClass]=\"{ 'btn-disabled': dataReloadBtnDisabled }\">\n <cps-icon\n icon=\"refresh\"\n size=\"18\"\n [color]=\"\n dataReloadBtnDisabled ? 'text-light' : 'prepared-lighten1'\n \"\n (click)=\"onReloadData()\">\n </cps-icon>\n </div>\n }\n </div>\n }\n </ng-template>\n }\n\n @if (nestedHeaderTemplate; as columns) {\n <ng-template pTemplate=\"header\" let-columns>\n <ng-container\n *ngTemplateOutlet=\"\n nestedHeaderTemplate;\n context: { $implicit: columns }\n \"></ng-container>\n </ng-template>\n }\n\n @if (!nestedHeaderTemplate; as columns) {\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <!-- <th style=\"width: 3rem\" *ngIf=\"reorderableRows\"></th> -->\n @if (selectable) {\n <th\n cpsTTHdrSelectable\n cpsTTColResizable\n [cpsTTColResizableDisabled]=\"!resizableColumns\"></th>\n }\n @if (headerTemplate) {\n <ng-container\n *ngTemplateOutlet=\"\n headerTemplate;\n context: { $implicit: columns }\n \"></ng-container>\n }\n @if (!headerTemplate && columns.length > 0) {\n @if (sortable) {\n @if (filterableByColumns) {\n @for (col of columns; track col) {\n <th\n [cpsTTColSortable]=\"col[colFieldName]\"\n [cpsTTColFilter]=\"col[colFieldName]\"\n [filterType]=\"\n col[colFilterTypeName] ??\n (autoColumnFilterType\n ? (data | cpsTTDetectFilterType: col[colFieldName])\n : 'text')\n \"\n cpsTTColResizable\n [cpsTTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n } @else {\n @for (col of columns; track col) {\n <th\n [cpsTTColSortable]=\"col[colFieldName]\"\n cpsTTColResizable\n [cpsTTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n }\n }\n @if (!sortable) {\n @if (filterableByColumns) {\n @for (col of columns; track col) {\n <th\n [cpsTTColFilter]=\"col[colFieldName]\"\n [filterType]=\"\n col[colFilterTypeName] ??\n (autoColumnFilterType\n ? (data | cpsTTDetectFilterType: col[colFieldName])\n : 'text')\n \"\n cpsTTColResizable\n [cpsTTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n } @else {\n @for (col of columns; track col) {\n <th\n cpsTTColResizable\n [cpsTTColResizableDisabled]=\"!resizableColumns\">\n {{ col[colHeaderName] }}\n </th>\n }\n }\n }\n }\n @if (showRowMenu && (showRowRemoveButton || showRowEditButton)) {\n <th\n class=\"cps-treetable-row-menu-cell\"\n cpsTTColResizable\n [cpsTTColResizableDisabled]=\"!resizableColumns\"></th>\n }\n </tr>\n </ng-template>\n }\n\n <ng-template\n pTemplate=\"body\"\n let-rowData=\"rowData\"\n let-columns=\"columns\"\n let-rowNode\n let-rowIndex=\"rowIndex\">\n <tr\n [ttRow]=\"rowNode\"\n [ngClass]=\"{\n 'cps-treetable-row-selected':\n selectable && primengTreeTable.isSelected(rowNode.node)\n }\">\n <!-- <td *ngIf=\"reorderableRows\" class=\"cps-table-row-drag-handle-cell\">\n <span class=\"cps-table-row-drag-handle\" pReorderableRowHandle>\u2630</span>\n </td> -->\n @if (selectable) {\n <td [cpsTTRowSelectable]=\"rowNode\"></td>\n }\n @if (bodyTemplate) {\n <ng-container\n *ngTemplateOutlet=\"\n bodyTemplate;\n context: {\n $implicit: rowNode,\n rowIndex: rowIndex,\n columns: columns,\n rowData: rowData\n }\n \">\n </ng-container>\n }\n @if (!bodyTemplate) {\n @if (columns.length > 0) {\n @if (renderDataAsHTML) {\n @for (col of columns; track col; let i = $index) {\n @if (i === 0) {\n <td\n [cpsTTRowToggler]=\"rowNode\"\n [innerHTML]=\"rowData[col[colFieldName]]\"></td>\n }\n @if (i > 0) {\n <td [innerHTML]=\"rowData[col[colFieldName]]\"></td>\n }\n }\n } @else {\n @for (col of columns; track col; let i = $index) {\n @if (i === 0) {\n <td [cpsTTRowToggler]=\"rowNode\">\n {{\n col[colDateFormatName]\n ? (rowData[col[colFieldName]]\n | date: col[colDateFormatName])\n : rowData[col[colFieldName]]\n }}\n </td>\n }\n @if (i > 0) {\n <td>\n {{\n col[colDateFormatName]\n ? (rowData[col[colFieldName]]\n | date: col[colDateFormatName])\n : rowData[col[colFieldName]]\n }}\n </td>\n }\n }\n }\n }\n }\n @if (showRowMenu && (showRowRemoveButton || showRowEditButton)) {\n <td class=\"cps-treetable-row-menu-cell\">\n <table-row-menu\n (editRowBtnClicked)=\"onEditRowClicked(rowNode.node)\"\n (removeRowBtnClicked)=\"onRemoveRowClicked(rowNode.node)\"\n [showRowRemoveButton]=\"showRowRemoveButton\"\n [showRowEditButton]=\"showRowEditButton\"\n [customItems]=\"rowMenuItems\">\n </table-row-menu>\n </td>\n }\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td\n colspan=\"100\"\n class=\"cps-treetable-empty-message-td\"\n [ngStyle]=\"{ height: emptyBodyHeight }\">\n {{ emptyMessage }}\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"loadingicon\">\n <cps-loader [fullScreen]=\"false\" opacity=\"0\"></cps-loader>\n </ng-template>\n <ng-template pTemplate=\"paginatorleft\">\n <div class=\"cps-table-paginator-itms-per-page\">\n <span class=\"cps-table-paginator-items-per-page-title\"\n >Rows per page:\n </span>\n <cps-select\n [options]=\"rowOptions\"\n [hideDetails]=\"true\"\n [(ngModel)]=\"rows\"\n (valueChanged)=\"onRowsPerPageChanged()\"\n [returnObject]=\"false\"\n optionsClass=\"cps-paginator-page-options\">\n </cps-select>\n </div>\n </ng-template>\n\n <ng-template pTemplate=\"paginatorfirstpagelinkicon\">\n <cps-icon icon=\"menu-shrink\" size=\"normal\"></cps-icon>\n </ng-template>\n <ng-template pTemplate=\"paginatorpreviouspagelinkicon\">\n <cps-icon icon=\"angle-left\"></cps-icon>\n </ng-template>\n <ng-template pTemplate=\"paginatornextpagelinkicon\">\n <cps-icon icon=\"angle-right\"></cps-icon>\n </ng-template>\n <ng-template pTemplate=\"paginatorlastpagelinkicon\">\n <cps-icon icon=\"menu-expand\" size=\"normal\"></cps-icon>\n </ng-template>\n</p-treeTable>\n", styles: [":host ::ng-deep .p-treetable{position:relative}:host ::ng-deep .p-component,:host ::ng-deep .p-component *{box-sizing:border-box}:host ::ng-deep .p-component{font-family:Source Sans Pro,sans-serif;font-size:14px;font-weight:400}:host ::ng-deep .p-treetable-scrollable-wrapper{position:relative;background:#fff}:host ::ng-deep .p-treetable-wrapper{background:#fff}:host ::ng-deep .cps-treetable-nonvirtual.cps-treetable-flex .p-treetable-flex-scrollable.cps-tbar-normal .p-treetable-scrollable-wrapper{height:calc(100% - 72px)}:host ::ng-deep .cps-treetable-nonvirtual.cps-treetable-flex .p-treetable-flex-scrollable.cps-tbar-small .p-treetable-scrollable-wrapper{height:calc(100% - 43px)}:host ::ng-deep .cps-treetable-nonvirtual.cps-treetable-flex .p-treetable-flex-scrollable .p-treetable-scrollable-wrapper .p-treetable-scrollable-view .p-treetable-scrollable-header{display:contents}:host ::ng-deep .p-treetable .p-treetable-scrollable-header,:host ::ng-deep .p-treetable .p-treetable-scrollable-footer{background:#fff}:host ::ng-deep .p-treetable-scrollable-header,:host ::ng-deep .p-treetable-scrollable-footer{overflow:hidden}:host ::ng-deep .p-treetable table{border-collapse:collapse;width:100%;table-layout:fixed}:host ::ng-deep .p-treetable .p-treetable-thead>tr>th{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 1px;font-weight:400;color:var(--cps-color-text-mild);background:#fff;transition:box-shadow .2s;overflow:hidden}:host ::ng-deep .p-treetable-scrollable-body{overflow:auto!important;position:relative}:host ::ng-deep .cps-treetable-flex .p-treetable-scrollable-body{height:100%}:host ::ng-deep .p-treetable .p-treetable-tbody{background:#fff}:host ::ng-deep .p-treetable .p-treetable-tbody>tr{background:#fff;color:var(--cps-color-text-dark);transition:box-shadow .2s}:host ::ng-deep .p-treetable .p-treetable-tbody>tr.cps-treetable-row-selected{background-color:var(--cps-color-highlight-active)!important}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td{text-align:left;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem}:host ::ng-deep p-treetable:not(.cps-treetable-autolayout-calced) .p-treetable .p-treetable-tbody>tr>td{overflow:hidden}:host ::ng-deep .cps-treetable-autolayout-calced .p-treetable .p-treetable-scrollable-body .p-treetable-tbody>tr>td:not(.cps-treetable-row-toggler-cell):not(.cps-treetable-selectable-cell):not(.cps-treetable-row-menu-cell):not(.cps-treetable-empty-message-td){opacity:0;border-left-color:#fff}:host ::ng-deep .cps-treetable-autolayout-calced .p-treetable.p-treetable-striped .p-treetable-scrollable-body .p-treetable-tbody>tr:nth-child(odd)>td:not(.cps-treetable-row-toggler-cell):not(.cps-treetable-selectable-cell):not(.cps-treetable-row-menu-cell):not(.cps-treetable-empty-message-td){border-left-color:var(--cps-color-bg-light)}:host ::ng-deep .cps-treetable-autolayout-calced .p-treetable .p-treetable-scrollable-body .p-treetable-tbody>tr:hover>td:not(.cps-treetable-row-toggler-cell):not(.cps-treetable-selectable-cell):not(.cps-treetable-row-menu-cell):not(.cps-treetable-empty-message-td){border-left-color:var(--cps-color-highlight-hover)}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td:first-child{border-width:0 0 1px 1px}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td:last-child{border-width:0 1px 1px 0}:host ::ng-deep .p-treetable-auto-layout table{table-layout:auto}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler{width:auto;height:auto;color:var(--cps-color-text-dark);border:0 none;background:transparent;border-radius:50%;margin-right:.5rem;padding:0}:host ::ng-deep .p-treetable-toggler{cursor:pointer;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;overflow:hidden;position:relative}:host ::ng-deep .p-ripple{overflow:hidden;position:relative}:host ::ng-deep .p-paginator-page:focus{outline:0 none;outline-offset:0;box-shadow:unset}:host ::ng-deep .p-paginator-page{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:14px;font-family:Source Sans Pro,sans-serif;border-radius:6px}:host ::ng-deep input[type=button],:host ::ng-deep input[type=submit],:host ::ng-deep input[type=reset],:host ::ng-deep input[type=file]::-webkit-file-upload-button,:host ::ng-deep button{border-radius:0}:host ::ng-deep .p-treetable .p-treetable-tbody>tr:focus{outline:0 none;outline-offset:-.15rem}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler:enabled:hover{color:var(--cps-color-calm);border-color:transparent;background:unset}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler:focus{outline:0 none;outline-offset:0;box-shadow:unset}:host ::ng-deep .p-treetable .p-paginator{border-width:0 1px 1px 1px;border-radius:0}:host ::ng-deep .p-paginator{background:#fff;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--cps-color-text-dark);padding:1rem;border:1px solid var(--cps-color-line-mid)}:host ::ng-deep .p-paginator-content-start{margin-right:auto}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page{display:inline-flex;align-items:center}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-table-paginator-items-per-page-title{font-family:Source Sans Pro,sans-serif;font-size:14px;margin-right:12px;cursor:default}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-select-box{min-height:32px!important;background:transparent!important}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-items{font-size:14px!important}:host ::ng-deep .p-paginator-content-start .cps-table-paginator-itms-per-page .cps-select-box .cps-select-box-chevron .cps-icon{width:14px;height:14px}:host ::ng-deep .p-paginator .p-paginator-current{background-color:transparent;border:0 none;color:var(--cps-color-text-dark);min-width:3rem;margin:.143rem;padding:0 .5rem;font-family:Source Sans Pro,sans-serif;font-size:14px;height:unset}:host ::ng-deep .p-paginator-page,:host ::ng-deep .p-paginator-next,:host ::ng-deep .p-paginator-last,:host ::ng-deep .p-paginator-first,:host ::ng-deep .p-paginator-prev,:host ::ng-deep .p-paginator-current{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;overflow:hidden;position:relative}:host ::ng-deep .p-paginator-current{cursor:default}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):hover,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-first:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-next:not(.p-disabled):not(.p-paginator-page-selected):active,:host ::ng-deep .p-paginator .p-paginator-last:not(.p-disabled):not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-first,:host ::ng-deep .p-paginator .p-paginator-prev,:host ::ng-deep .p-paginator .p-paginator-next,:host ::ng-deep .p-paginator .p-paginator-last{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-disabled,:host ::ng-deep .p-disabled *{cursor:default!important;pointer-events:none}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page.p-paginator-page-selected{background:var(--cps-color-calm);border-color:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):hover{background:var(--cps-color-highlight-hover);border-color:unset}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page:not(.p-paginator-page-selected):active{background:var(--cps-color-highlight-active)}:host ::ng-deep .p-paginator .p-paginator-pages .p-paginator-page{background-color:transparent;border:1px solid var(--cps-color-text-dark);border-radius:4px;color:var(--cps-color-text-dark);min-width:32px;height:32px;margin:.143rem;transition:box-shadow .2s}:host ::ng-deep .p-paginator-element:focus{z-index:1;position:relative}:host ::ng-deep span.p-paginator-icon,:host ::ng-deep span.p-paginator-first-icon,:host ::ng-deep span.p-paginator-prev-icon,:host ::ng-deep span.p-paginator-last-icon,:host ::ng-deep span.p-paginator-next-icon{display:contents}:host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:.4}:host ::ng-deep .cps-treetable-empty-message-td{text-align:center!important;font-weight:600;background:#fff}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-header{border-width:1px 1px 0 1px}:host ::ng-deep .p-treetable .p-treetable-header{font-weight:600;display:flex;justify-content:space-between;align-items:center;padding:0 10px!important;border:unset;background:unset;border-top:1px solid var(--cps-color-line-mid);border-right:1px solid var(--cps-color-line-mid);border-left:4px solid var(--cps-color-surprise)!important;border-radius:4px 4px 0 0;font-size:16px;line-height:150%;background-color:#fff;color:var(--cps-color-text-darkest);overflow:auto}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-left{display:flex;align-items:center}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-left .cps-treetable-tbar-global-filter{margin-left:12px}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-left .cps-treetable-tbar-icon{display:flex;margin-right:8px}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-left .cps-treetable-tbar-title{cursor:default}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right{display:flex;align-items:center}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-btn-on-select{margin-right:4px}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-action-btn{margin-right:4px;margin-left:8px}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-coltoggle-btn,:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-reload-btn{display:contents}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-coltoggle-btn cps-icon,:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-reload-btn cps-icon{margin-left:12px;margin-right:4px}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-coltoggle-btn:not(.btn-disabled) cps-icon,:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-reload-btn:not(.btn-disabled) cps-icon{cursor:pointer}:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-coltoggle-btn:not(.btn-disabled) cps-icon:hover .cps-icon,:host ::ng-deep .p-treetable .p-treetable-header .cps-treetable-tbar-right .cps-treetable-tbar-reload-btn:not(.btn-disabled) cps-icon:hover .cps-icon{color:var(--cps-color-prepared)!important}:host ::ng-deep .cps-tbar-small.p-treetable .p-treetable-header{height:43px}:host ::ng-deep .cps-tbar-normal.p-treetable .p-treetable-header{height:72px}:host ::ng-deep .p-treetable .p-treetable-footer{background:#fff;color:#343a40;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;padding:1rem;font-weight:700}:host ::ng-deep .p-treetable .p-treetable-tfoot>tr>td{text-align:left;padding:1rem;border:1px solid var(--cps-color-line-mid);border-width:0 0 1px 0;font-weight:700;color:#343a40;background:#fff}:host ::ng-deep .p-treetable .p-sortable-column:not(.p-highlight):hover .cps-sortable-column-icon.sort-unsorted .sort-unsorted-arrow-up{border-bottom-color:var(--cps-color-text-mild)}:host ::ng-deep .p-treetable .p-sortable-column:not(.p-highlight):hover .cps-sortable-column-icon.sort-unsorted .sort-unsorted-arrow-down{border-top-color:var(--cps-color-text-mild)}:host ::ng-deep .p-icon-wrapper{display:inline-flex}:host ::ng-deep .p-icon{display:inline-block;width:1rem;height:1rem}:host ::ng-deep .p-treetable .p-sortable-column .cps-sortable-column-badge{display:inline-flex;align-items:center;justify-content:center;font-size:12px;vertical-align:top;color:var(--cps-color-calm);margin-left:.25rem}:host ::ng-deep .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:none;cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-treetable .p-sortable-column{cursor:pointer;-webkit-user-select:none;user-select:none}:host ::ng-deep .p-treetable .p-sortable-column:focus{box-shadow:none;outline:0 none}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td .p-treetable-toggler.p-icon{width:2rem;height:2rem}:host ::ng-deep .p-treetable .p-treetable-tbody>tr.p-highlight{background:#eff6ff;color:#1d4ed8}:host ::ng-deep .p-treetable.p-treetable-hoverable-rows .p-treetable-tbody>tr:not(.p-highlight):hover{background:var(--cps-color-highlight-hover)}:host ::ng-deep .p-treetable-hoverable-rows .p-treetable-tbody>tr{cursor:auto}:host ::ng-deep .p-treetable .p-column-resizer-helper{background:var(--cps-color-calm);width:1px}:host ::ng-deep .p-treetable .p-treetable-mask.p-overlay-mask{position:absolute;display:flex;align-items:center;justify-content:center;z-index:1001;top:0;left:0;width:100%;height:100%;background-color:#fff;transition-duration:.2s;border:1px solid var(--cps-color-line-mid)}:host ::ng-deep .p-treetable.cps-tbar-small .p-treetable-mask.p-overlay-mask{top:43px;height:calc(100% - 43px)}:host ::ng-deep .p-treetable.cps-tbar-normal .p-treetable-mask.p-overlay-mask{top:72px;height:calc(100% - 72px)}:host ::ng-deep .cps-treetable-loading .p-treetable{min-height:200px}:host ::ng-deep .cps-treetable-loading .p-treetable.cps-tbar-normal{min-height:272px}:host ::ng-deep .cps-treetable-loading .p-treetable.cps-tbar-small{min-height:243px}:host ::ng-deep .cps-table-col-filter-menu-open .cps-table-col-filter-menu-button{color:var(--cps-color-text-dark)}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-footer{border-width:0 1px 1px 1px}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-top{border-width:0 1px 0 1px}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-bottom{border-width:0 1px 1px 1px}:host ::ng-deep .p-treetable .p-treetable-thead>tr>th,:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-thead>tr>th{border-width:1px 0 1px 1px}:host ::ng-deep .p-treetable .p-treetable-thead>tr>th:last-child{border-width:1px}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-tbody>tr>td{border-width:0 0 1px 1px}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-tfoot>tr>td{border-width:1px}:host ::ng-deep .p-treetable.p-treetable-gridlines .p-treetable-tbody>tr>td:last-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td:only-child{border-width:0 1px 1px 1px}:host ::ng-deep .p-treetable.p-treetable-sm .p-treetable-thead>tr>th{padding:.5rem}:host ::ng-deep .p-treetable.p-treetable-sm .p-treetable-tbody>tr>td{padding:.5rem}:host ::ng-deep .p-treetable.p-treetable-sm .p-treetable-tfoot>tr>td{padding:.5rem}:host ::ng-deep .p-treetable.p-treetable-sm .p-treetable-footer{padding:.5rem}:host ::ng-deep .p-treetable.p-treetable-lg .p-treetable-thead>tr>th{padding:1.25rem}:host ::ng-deep .p-treetable.p-treetable-lg .p-treetable-tbody>tr>td{padding:1.25rem}:host ::ng-deep .p-treetable.p-treetable-lg .p-treetable-tfoot>tr>td{padding:1.25rem}:host ::ng-deep .p-treetable.p-treetable-lg .p-treetable-footer{padding:1.25rem}:host ::ng-deep .p-treetable.p-treetable-striped .p-treetable-tbody>tr:nth-child(odd){background:var(--cps-color-bg-light)}:host ::ng-deep .p-treetable.p-treetable-striped .p-treetable-tbody>tr:nth-child(2n){background:#fff}:host ::ng-deep .cps-treetable-row-menu-cell{width:55px;border-left:none!important}:host ::ng-deep .cps-treetable-selectable-cell{width:55px;text-align:center!important}:host ::ng-deep .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative;width:18px;height:18px}:host ::ng-deep .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:host ::ng-deep .p-hidden-accessible input,:host ::ng-deep .p-hidden-accessible select{transform:scale(0)}:host ::ng-deep .p-checkbox .p-checkbox-box{background:#fff;width:18px;height:18px;color:var(--cps-color-text-dark);border:2px solid var(--cps-color-text-mild);border-radius:2px;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}:host ::ng-deep .p-checkbox-box{display:flex;justify-content:center;align-items:center}:host ::ng-deep .p-checkbox.p-checkbox-checked .p-checkbox-box{border-color:var(--cps-color-calm);background:var(--cps-color-calm)}:host ::ng-deep .p-checkbox-checked:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box{border-color:var(--cps-color-calm);background:var(--cps-color-calm);color:#fff}:host ::ng-deep .p-checkbox:not(.p-disabled):has(.p-checkbox-input:hover) .p-checkbox-box{border-color:var(--cps-color-calm)}:host ::ng-deep .p-checkbox .p-checkbox-box .p-icon{width:14px;height:14px}:host ::ng-deep .p-checkbox .p-checkbox-box .p-checkbox-icon{transition-duration:.2s;color:#fff;font-size:14px}:host ::ng-deep .p-checkbox .p-checkbox-box minusicon .p-checkbox-icon{color:var(--cps-color-calm);width:12px}:host ::ng-deep .p-treetable .p-treetable-tbody>tr>td p-treetablecheckbox .p-checkbox{margin-right:0}::ng-deep .p-scrollbar-measure{width:100px;height:100px;overflow:scroll;position:absolute;top:-9999px}.cps-treetable-coltoggle-menu{display:block;max-height:242px;overflow-x:hidden;background:#fff}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item{padding:12px;justify-content:space-between;display:flex;cursor:pointer}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item:hover{background:var(--cps-color-highlight-hover)}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item-label{color:var(--cps-color-text-dark)}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item-left{display:flex;align-items:center;margin-right:8px}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item-check{background-color:transparent;border:0;width:16px;height:16px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);margin-right:8px;opacity:0}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item-check:after{color:var(--cps-color-calm);top:4px;left:1px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box;position:absolute;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.selected,.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.allselected{font-weight:600}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.selected .cps-treetable-coltoggle-menu-item-label,.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.allselected .cps-treetable-coltoggle-menu-item-label{color:var(--cps-color-calm)}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.selected .cps-treetable-coltoggle-menu-item-check,.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.allselected .cps-treetable-coltoggle-menu-item-check{opacity:1}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.selected{background:var(--cps-color-highlight-selected)}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.highlighten{background:var(--cps-color-highlight-active)}.cps-treetable-coltoggle-menu .cps-treetable-coltoggle-menu-item.selected.highlighten{background:var(--cps-color-highlight-selected-dark)}.cps-treetable-coltoggle-menu .select-all-option{border-bottom:1px solid lightgrey;font-weight:600}::ng-deep .cps-select-options-menu.cps-paginator-page-options .cps-select-options-option{font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: TreeTableModule }, { kind: "component", type: i2$2.TreeTable, selector: "p-treeTable, p-treetable, p-tree-table", inputs: ["columns", "styleClass", "tableStyle", "tableStyleClass", "autoLayout", "lazy", "lazyLoadOnInit", "paginator", "rows", "first", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "customSort", "selectionMode", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "compareSelectionBy", "rowHover", "loading", "loadingIcon", "showLoader", "scrollable", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "frozenColumns", "resizableColumns", "columnResizeMode", "reorderableColumns", "contextMenu", "rowTrackBy", "filters", "globalFilterFields", "filterDelay", "filterMode", "filterLocale", "paginatorLocale", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "value", "virtualRowHeight", "selectionKeys", "showGridlines"], outputs: ["selectionChange", "contextMenuSelectionChange", "onFilter", "onNodeExpand", "onNodeCollapse", "onPage", "onSort", "onLazyLoad", "sortFunction", "onColResize", "onColReorder", "onNodeSelect", "onNodeUnselect", "onContextMenuSelect", "onHeaderCheckboxToggle", "onEditInit", "onEditComplete", "onEditCancel", "selectionKeysChange"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$2.TTRow, selector: "[ttRow]", inputs: ["ttRow"] }, { kind: "component", type: CpsInputComponent, selector: "cps-input", inputs: ["label", "hint", "placeholder", "disabled", "readonly", "width", "type", "loading", "clearable", "prefixIcon", "prefixIconClickable", "prefixIconSize", "prefixText", "hideDetails", "persistentClear", "error", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "appearance", "valueToDisplay", "value"], outputs: ["valueChanged", "focused", "prefixIconClicked", "blurred", "cleared", "enterClicked"] }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsMenuComponent, selector: "cps-menu", inputs: ["header", "ariaLabel", "items", "withArrow", "compressed", "focusOnShow", "persistent", "containerClass", "showTransitionOptions", "hideTransitionOptions"], outputs: ["menuShown", "menuHidden", "beforeMenuHidden", "contentClicked", "containerMouseLeave"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }, { kind: "component", type: CpsSelectComponent, selector: "cps-select", inputs: ["label", "placeholder", "hint", "returnObject", "multiple", "disabled", "width", "selectAll", "chips", "closableChips", "clearable", "openOnClear", "options", "keepInitialOrder", "optionLabel", "optionValue", "optionInfo", "optionIcon", "optionIconColor", "hideDetails", "persistentClear", "prefixIcon", "prefixIconSize", "loading", "virtualScroll", "numToleratedItems", "infoTooltip", "infoTooltipClass", "infoTooltipMaxWidth", "infoTooltipPersistent", "infoTooltipPosition", "optionsClass", "appearance", "showChevron", "value"], outputs: ["valueChanged", "focused", "blurred"] }, { kind: "component", type: CpsLoaderComponent, selector: "cps-loader", inputs: ["fullScreen", "opacity", "labelColor", "showLabel"] }, { kind: "directive", type: CpsTreeTableColumnSortableDirective, selector: "[cpsTTColSortable]", inputs: ["cpsTTColSortable"] }, { kind: "directive", type: CpsTreeTableColumnFilterDirective, selector: "[cpsTTColFilter]", inputs: ["cpsTTColFilter", "filterType", "filterPersistent", "filterShowClearButton", "filterShowApplyButton", "filterShowCloseButton", "filterShowMatchModes", "filterMatchModes", "filterShowOperator", "filterHeaderTitle", "filterHideOnClear", "filterCategoryOptions", "filterAsButtonToggle", "filterSingleSelection", "filterPlaceholder"], exportAs: ["cpsTTColFilter"] }, { kind: "directive", type: CpsTreeTableHeaderSelectableDirective, selector: "[cpsTTHdrSelectable]" }, { kind: "directive", type: CpsTreeTableRowSelectableDirective, selector: "[cpsTTRowSelectable]", inputs: ["cpsTTRowSelectable"] }, { kind: "directive", type: CpsTreetableRowTogglerDirective, selector: "[cpsTTRowToggler]", inputs: ["cpsTTRowToggler"] }, { kind: "directive", type: CpsTreeTableColumnResizableDirective, selector: "[cpsTTColResizable]", inputs: ["cpsTTColResizableDisabled"] }, { kind: "directive", type: TreeTableUnsortDirective, selector: "[ttWithUnsort]" }, { kind: "component", type: TableRowMenuComponent, selector: "table-row-menu", inputs: ["showRowRemoveButton", "customItems", "showRowEditButton"], outputs: ["editRowBtnClicked", "removeRowBtnClicked"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }, { kind: "pipe", type: CpsTreeTableDetectFilterTypePipe, name: "cpsTTDetectFilterType" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14406
14406
|
}
|
|
14407
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
14407
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsTreeTableComponent, decorators: [{
|
|
14408
14408
|
type: Component,
|
|
14409
14409
|
args: [{ selector: 'cps-tree-table', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
14410
14410
|
FormsModule,
|
|
@@ -14787,10 +14787,10 @@ class CpsDialogContentDirective {
|
|
|
14787
14787
|
constructor(viewContainerRef) {
|
|
14788
14788
|
this.viewContainerRef = viewContainerRef;
|
|
14789
14789
|
}
|
|
14790
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
14791
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
14790
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogContentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
14791
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.13", type: CpsDialogContentDirective, isStandalone: true, selector: "[cpsDialogContent]", ngImport: i0 }); }
|
|
14792
14792
|
}
|
|
14793
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
14793
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogContentDirective, decorators: [{
|
|
14794
14794
|
type: Directive,
|
|
14795
14795
|
args: [{
|
|
14796
14796
|
standalone: true,
|
|
@@ -15435,15 +15435,15 @@ class CpsDialogComponent {
|
|
|
15435
15435
|
top: Math.max(0, Math.min(top, height - m))
|
|
15436
15436
|
};
|
|
15437
15437
|
}
|
|
15438
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
15439
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: CpsDialogComponent, isStandalone: true, selector: "cps-dialog", viewQueries: [{ propertyName: "insertionPoint", first: true, predicate: CpsDialogContentDirective, descendants: true }, { propertyName: "maskViewChild", first: true, predicate: ["mask"], descendants: true }, { propertyName: "contentViewChild", first: true, predicate: ["content"], descendants: true }, { propertyName: "headerViewChild", first: true, predicate: ["header"], descendants: true }, { propertyName: "dragHandleViewChild", first: true, predicate: ["dragHandle"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n #mask\n [ngClass]=\"{\n 'cps-dialog-mask': true,\n 'cps-dialog-overlay': config.modal !== false,\n 'cps-dialog-overlay-enter':\n config.modal !== false && !config.blurredBackground,\n 'cps-dialog-blurred-overlay cps-dialog-blurred-overlay-enter':\n config.modal !== false && config.blurredBackground,\n 'cps-dialog-left': position === 'left',\n 'cps-dialog-right': position === 'right',\n 'cps-dialog-top': position === 'top',\n 'cps-dialog-bottom': position === 'bottom',\n 'cps-dialog-top-left': position === 'topleft' || position === 'top-left',\n 'cps-dialog-top-right': position === 'topright' || position === 'top-right',\n 'cps-dialog-bottom-left':\n position === 'bottomleft' || position === 'bottom-left',\n 'cps-dialog-bottom-right':\n position === 'bottomright' || position === 'bottom-right'\n }\"\n [class]=\"config.maskStyleClass || ''\">\n @if (visible) {\n <div\n #container\n [ngClass]=\"{\n 'cps-dialog': true,\n 'cps-dialog-resizable': resizable,\n 'cps-dialog-draggable': draggable && !maximized,\n 'cps-dialog-dragging': dragging,\n 'cps-dialog-maximized': maximized\n }\"\n [ngStyle]=\"config.style\"\n [class]=\"config.styleClass || ''\"\n [@animation]=\"{\n value: 'visible',\n params: {\n transform: transformOptions,\n transition:\n config.transitionOptions || '150ms cubic-bezier(0, 0, 0.2, 1)'\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\"\n role=\"dialog\"\n [attr.aria-modal]=\"config.modal !== false ? 'true' : null\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"config.ariaLabelledBy || null\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-describedby]=\"config.ariaDescribedBy || null\"\n [style.width]=\"cvtWidth\"\n [style.height]=\"cvtHeight\"\n [style.minWidth]=\"cvtMinWidth\"\n [style.minHeight]=\"cvtMinHeight\"\n [style.maxWidth]=\"cvtMaxWidth\"\n [style.maxHeight]=\"cvtMaxHeight\">\n @if (config.showHeader !== false) {\n <div\n #header\n class=\"cps-dialog-header\"\n [ngClass]=\"{\n 'cps-dialog-header-left-bordered':\n config.showHeaderLeftBorder !== false,\n 'cps-dialog-header-bottom-bordered':\n config.showHeaderBottomBorder !== false\n }\"\n (mousedown)=\"initDrag($event)\">\n @if (draggable && !maximized) {\n <cps-icon\n #dragHandle\n class=\"cps-dialog-drag-handle\"\n icon=\"dots\"\n role=\"button\"\n tabindex=\"0\"\n aria-label=\"Move dialog\"\n aria-description=\"Use arrow keys to move\"\n (keydown)=\"onHeaderKeydown($event)\"\n (keyup)=\"onHeaderKeyup($event)\">\n </cps-icon>\n }\n <div class=\"cps-dialog-header-left\">\n <div class=\"cps-dialog-header-icon\">\n @if (config.headerIcon) {\n <cps-icon\n [icon]=\"config.headerIcon\"\n [color]=\"config.headerIconColor || 'currentColor'\">\n </cps-icon>\n }\n </div>\n <span class=\"cps-dialog-header-title\">{{\n config.headerTitle\n }}</span>\n <div class=\"cps-dialog-header-info-circle\">\n @if (config.headerInfoTooltip) {\n <cps-info-circle\n size=\"small\"\n [tooltipPosition]=\"config.headerInfoTooltipPosition || 'top'\"\n [tooltipText]=\"config.headerInfoTooltip\">\n </cps-info-circle>\n }\n </div>\n </div>\n <div class=\"cps-dialog-header-action-buttons\">\n @if (maximizable) {\n <cps-button\n class=\"cps-dialog-header-action-button\"\n [icon]=\"maximized ? 'minimize' : 'maximize'\"\n [ariaLabel]=\"maximized ? 'Minimize dialog' : 'Maximize dialog'\"\n size=\"small\"\n width=\"2rem\"\n color=\"graphite\"\n type=\"borderless\"\n (clicked)=\"toggleMaximized()\">\n </cps-button>\n }\n @if (config.showCloseBtn !== false) {\n <cps-button\n class=\"cps-dialog-header-action-button\"\n icon=\"close-x-2\"\n ariaLabel=\"Close dialog\"\n size=\"small\"\n width=\"2rem\"\n color=\"graphite\"\n type=\"borderless\"\n [disabled]=\"isCloseDisabled()\"\n (clicked)=\"hide()\">\n </cps-button>\n }\n </div>\n </div>\n }\n <div\n #content\n class=\"cps-dialog-content\"\n [ngStyle]=\"config.contentStyle\"\n [class]=\"config.contentStyleClass || ''\">\n <ng-template cpsDialogContent></ng-template>\n </div>\n @if (resizable && !maximized) {\n <div\n class=\"cps-dialog-resizable-handle\"\n style=\"z-index: 90\"\n tabindex=\"0\"\n role=\"button\"\n aria-label=\"Resize dialog\"\n aria-description=\"Use arrow keys to resize\"\n (mousedown)=\"initResize($event)\"\n (keydown)=\"onResizeHandleKeydown($event)\"\n (keyup)=\"onResizeHandleKeyup($event)\">\n <span\n class=\"cps-dialog-resizable-handle-grip\"\n aria-hidden=\"true\"></span>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".cps-dialog-mask{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none}.cps-dialog-mask.cps-dialog-overlay{pointer-events:auto}.cps-dialog-overlay-enter{animation:cps-dialog-overlay-enter-animation .15s forwards}.cps-dialog-overlay-leave{animation:cps-dialog-overlay-leave-animation .15s forwards}.cps-dialog-blurred-overlay-enter{animation:cps-dialog-blurred-overlay-enter-animation .15s forwards}.cps-dialog-blurred-overlay-leave{animation:cps-dialog-blurred-overlay-leave-animation .15s forwards}.cps-dialog-overlay{background-color:#0003;transition-duration:.2s}.cps-dialog-blurred-overlay{-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}@keyframes cps-dialog-overlay-enter-animation{0%{background-color:transparent}to{background-color:#0003}}@keyframes cps-dialog-overlay-leave-animation{0%{background-color:#0003}to{background-color:transparent}}@keyframes cps-dialog-blurred-overlay-enter-animation{0%{background-color:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background-color:#0003;-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}}@keyframes cps-dialog-blurred-overlay-leave-animation{0%{background-color:#0003;-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}to{background-color:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}.cps-dialog{box-sizing:border-box;display:flex;flex-direction:column;pointer-events:auto;transform:scale(1);position:relative;border-radius:.25rem;box-shadow:0 .0625rem .1875rem #0000004d;border:0 none;font-family:Source Sans Pro,sans-serif;font-size:1rem;font-weight:400}.cps-dialog:focus-visible{outline:none;position:relative}.cps-dialog:focus-visible:before,.cps-dialog:focus-visible:after{content:\"\";position:absolute;border-radius:inherit}.cps-dialog:focus-visible:before{inset:-.0625rem;border:.0625rem solid var(--cps-color-calm)}.cps-dialog:focus-visible:after{inset:-.125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-dialog:focus-visible.suppress-focus-visible:before,.cps-dialog:focus-visible.suppress-focus-visible:after{display:none}.cps-dialog .cps-dialog-header{overflow:hidden;border-bottom:0 none;background:#fff;color:var(--cps-color-text-dark);padding:1rem;border-top-right-radius:.25rem;border-top-left-radius:.25rem;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.cps-dialog .cps-dialog-header.cps-dialog-header-left-bordered{border-left:.25rem solid var(--cps-color-surprise)}.cps-dialog .cps-dialog-header.cps-dialog-header-bottom-bordered{border-bottom:.0625rem solid var(--cps-color-line-mid)}.cps-dialog .cps-dialog-header .cps-dialog-header-left{display:flex;align-items:center}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-icon{margin-right:.5rem;display:flex}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-title{cursor:default;font-weight:700;font-size:1.25rem}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-info-circle{margin-left:.5rem;cursor:default;display:flex}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-info-circle cps-info-circle{margin-top:.125rem}.cps-dialog .cps-dialog-content{background:#fff;color:var(--cps-color-text-dark);padding:1rem}.cps-dialog .cps-dialog-content:last-of-type,.cps-dialog-resizable .cps-dialog-content{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.cps-dialog-content{overflow-y:auto;flex-grow:1}.cps-dialog-dragging .cps-dialog-header{background-color:var(--cps-color-highlight-active)!important}.cps-dialog-draggable .cps-dialog-header{cursor:move;overflow:visible}.cps-dialog-draggable .cps-dialog-header:hover{background-color:var(--cps-color-highlight-hover)}.cps-dialog-draggable .cps-dialog-header.cps-dialog-header-moving{background-color:var(--cps-color-highlight-active)}.cps-dialog-draggable .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-title{cursor:unset}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible{outline:none;position:relative}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:before,.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:after{content:\"\";position:absolute;border-radius:.25rem}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:after{inset:-.375rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible.suppress-focus-visible:before,.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible.suppress-focus-visible:after{display:none}.cps-dialog .cps-dialog-header-action-buttons{display:flex;align-items:center}.cps-dialog-top .cps-dialog,.cps-dialog-bottom .cps-dialog,.cps-dialog-left .cps-dialog,.cps-dialog-right .cps-dialog,.cps-dialog-top-left .cps-dialog,.cps-dialog-top-right .cps-dialog,.cps-dialog-bottom-left .cps-dialog,.cps-dialog-bottom-right .cps-dialog{margin:.75rem;transform:translateZ(0)}.cps-dialog-maximized{-webkit-transition:none;transition:none;transform:none;width:100vw!important;height:100vh!important;top:0!important;left:0!important;max-height:100%;height:100%}.cps-dialog-maximized .cps-dialog-content{flex-grow:1;border-radius:0!important}.cps-dialog-maximized .cps-dialog-header{border-radius:0!important}.cps-dialog-left{justify-content:flex-start}.cps-dialog-right{justify-content:flex-end}.cps-dialog-top{align-items:flex-start}.cps-dialog-top-left{justify-content:flex-start;align-items:flex-start}.cps-dialog-top-right{justify-content:flex-end;align-items:flex-start}.cps-dialog-bottom{align-items:flex-end}.cps-dialog-bottom-left{justify-content:flex-start;align-items:flex-end}.cps-dialog-bottom-right{justify-content:flex-end;align-items:flex-end}.cps-dialog .cps-dialog-resizable-handle{position:absolute;display:block;cursor:nwse-resize;width:1.5rem;height:1.5rem;right:0;bottom:0;overflow:visible}.cps-dialog .cps-dialog-resizable-handle:focus-visible{background-color:var(--cps-color-highlight-hover)}.cps-dialog .cps-dialog-resizable-handle.cps-dialog-resizable-handle-resizing,.cps-dialog .cps-dialog-resizable-handle.cps-dialog-resizable-handle-resizing:focus-visible{background-color:var(--cps-color-highlight-active)}.cps-dialog .cps-dialog-resizable-handle{outline:none;position:relative}.cps-dialog .cps-dialog-resizable-handle:before,.cps-dialog .cps-dialog-resizable-handle:after{content:\"\";position:absolute;border-radius:0}.cps-dialog .cps-dialog-resizable-handle:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}.cps-dialog .cps-dialog-resizable-handle:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-dialog .cps-dialog-resizable-handle.suppress-focus-visible:before,.cps-dialog .cps-dialog-resizable-handle.suppress-focus-visible:after{display:none}.cps-dialog .cps-dialog-resizable-handle{position:absolute}.cps-dialog .cps-dialog-resizable-handle:not(:focus-visible):before,.cps-dialog .cps-dialog-resizable-handle:not(:focus-visible):after{display:none}.cps-dialog .cps-dialog-resizable-handle .cps-dialog-resizable-handle-grip{position:absolute;inset:0;overflow:hidden;display:block}.cps-dialog .cps-dialog-resizable-handle .cps-dialog-resizable-handle-grip:after{content:\"\";position:absolute;display:block;width:3.125rem;height:0;box-shadow:0 0 0 .0625rem var(--cps-color-calm),0 .4375rem 0 .0625rem var(--cps-color-calm),0 .875rem 0 .0625rem var(--cps-color-calm),0 1.3125rem 0 .0625rem var(--cps-color-calm);transform:translate(-50%,-50%) rotate(-45deg) scale(.5);top:65%;left:65%}.cps-unselectable-text{-webkit-user-select:none;user-select:none}.cps-overflow-hidden{overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: CpsDialogContentDirective, selector: "[cpsDialogContent]" }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }], animations: [
|
|
15438
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogComponent, deps: [{ token: DOCUMENT }, { token: PLATFORM_ID }, { token: CpsDialogRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: CpsDialogConfig }, { token: i0.NgZone }, { token: i1.PrimeNG }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15439
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsDialogComponent, isStandalone: true, selector: "cps-dialog", viewQueries: [{ propertyName: "insertionPoint", first: true, predicate: CpsDialogContentDirective, descendants: true }, { propertyName: "maskViewChild", first: true, predicate: ["mask"], descendants: true }, { propertyName: "contentViewChild", first: true, predicate: ["content"], descendants: true }, { propertyName: "headerViewChild", first: true, predicate: ["header"], descendants: true }, { propertyName: "dragHandleViewChild", first: true, predicate: ["dragHandle"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div\n #mask\n [ngClass]=\"{\n 'cps-dialog-mask': true,\n 'cps-dialog-overlay': config.modal !== false,\n 'cps-dialog-overlay-enter':\n config.modal !== false && !config.blurredBackground,\n 'cps-dialog-blurred-overlay cps-dialog-blurred-overlay-enter':\n config.modal !== false && config.blurredBackground,\n 'cps-dialog-left': position === 'left',\n 'cps-dialog-right': position === 'right',\n 'cps-dialog-top': position === 'top',\n 'cps-dialog-bottom': position === 'bottom',\n 'cps-dialog-top-left': position === 'topleft' || position === 'top-left',\n 'cps-dialog-top-right': position === 'topright' || position === 'top-right',\n 'cps-dialog-bottom-left':\n position === 'bottomleft' || position === 'bottom-left',\n 'cps-dialog-bottom-right':\n position === 'bottomright' || position === 'bottom-right'\n }\"\n [class]=\"config.maskStyleClass || ''\">\n @if (visible) {\n <div\n #container\n [ngClass]=\"{\n 'cps-dialog': true,\n 'cps-dialog-resizable': resizable,\n 'cps-dialog-draggable': draggable && !maximized,\n 'cps-dialog-dragging': dragging,\n 'cps-dialog-maximized': maximized\n }\"\n [ngStyle]=\"config.style\"\n [class]=\"config.styleClass || ''\"\n [@animation]=\"{\n value: 'visible',\n params: {\n transform: transformOptions,\n transition:\n config.transitionOptions || '150ms cubic-bezier(0, 0, 0.2, 1)'\n }\n }\"\n (@animation.start)=\"onAnimationStart($event)\"\n (@animation.done)=\"onAnimationEnd($event)\"\n role=\"dialog\"\n [attr.aria-modal]=\"config.modal !== false ? 'true' : null\"\n tabindex=\"-1\"\n [attr.aria-labelledby]=\"config.ariaLabelledBy || null\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-describedby]=\"config.ariaDescribedBy || null\"\n [style.width]=\"cvtWidth\"\n [style.height]=\"cvtHeight\"\n [style.minWidth]=\"cvtMinWidth\"\n [style.minHeight]=\"cvtMinHeight\"\n [style.maxWidth]=\"cvtMaxWidth\"\n [style.maxHeight]=\"cvtMaxHeight\">\n @if (config.showHeader !== false) {\n <div\n #header\n class=\"cps-dialog-header\"\n [ngClass]=\"{\n 'cps-dialog-header-left-bordered':\n config.showHeaderLeftBorder !== false,\n 'cps-dialog-header-bottom-bordered':\n config.showHeaderBottomBorder !== false\n }\"\n (mousedown)=\"initDrag($event)\">\n @if (draggable && !maximized) {\n <cps-icon\n #dragHandle\n class=\"cps-dialog-drag-handle\"\n icon=\"dots\"\n role=\"button\"\n tabindex=\"0\"\n aria-label=\"Move dialog\"\n aria-description=\"Use arrow keys to move\"\n (keydown)=\"onHeaderKeydown($event)\"\n (keyup)=\"onHeaderKeyup($event)\">\n </cps-icon>\n }\n <div class=\"cps-dialog-header-left\">\n <div class=\"cps-dialog-header-icon\">\n @if (config.headerIcon) {\n <cps-icon\n [icon]=\"config.headerIcon\"\n [color]=\"config.headerIconColor || 'currentColor'\">\n </cps-icon>\n }\n </div>\n <span class=\"cps-dialog-header-title\">{{\n config.headerTitle\n }}</span>\n <div class=\"cps-dialog-header-info-circle\">\n @if (config.headerInfoTooltip) {\n <cps-info-circle\n size=\"small\"\n [tooltipPosition]=\"config.headerInfoTooltipPosition || 'top'\"\n [tooltipText]=\"config.headerInfoTooltip\">\n </cps-info-circle>\n }\n </div>\n </div>\n <div class=\"cps-dialog-header-action-buttons\">\n @if (maximizable) {\n <cps-button\n class=\"cps-dialog-header-action-button\"\n [icon]=\"maximized ? 'minimize' : 'maximize'\"\n [ariaLabel]=\"maximized ? 'Minimize dialog' : 'Maximize dialog'\"\n size=\"small\"\n width=\"2rem\"\n color=\"graphite\"\n type=\"borderless\"\n (clicked)=\"toggleMaximized()\">\n </cps-button>\n }\n @if (config.showCloseBtn !== false) {\n <cps-button\n class=\"cps-dialog-header-action-button\"\n icon=\"close-x-2\"\n ariaLabel=\"Close dialog\"\n size=\"small\"\n width=\"2rem\"\n color=\"graphite\"\n type=\"borderless\"\n [disabled]=\"isCloseDisabled()\"\n (clicked)=\"hide()\">\n </cps-button>\n }\n </div>\n </div>\n }\n <div\n #content\n class=\"cps-dialog-content\"\n [ngStyle]=\"config.contentStyle\"\n [class]=\"config.contentStyleClass || ''\">\n <ng-template cpsDialogContent></ng-template>\n </div>\n @if (resizable && !maximized) {\n <div\n class=\"cps-dialog-resizable-handle\"\n style=\"z-index: 90\"\n tabindex=\"0\"\n role=\"button\"\n aria-label=\"Resize dialog\"\n aria-description=\"Use arrow keys to resize\"\n (mousedown)=\"initResize($event)\"\n (keydown)=\"onResizeHandleKeydown($event)\"\n (keyup)=\"onResizeHandleKeyup($event)\">\n <span\n class=\"cps-dialog-resizable-handle-grip\"\n aria-hidden=\"true\"></span>\n </div>\n }\n </div>\n }\n</div>\n", styles: [".cps-dialog-mask{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none}.cps-dialog-mask.cps-dialog-overlay{pointer-events:auto}.cps-dialog-overlay-enter{animation:cps-dialog-overlay-enter-animation .15s forwards}.cps-dialog-overlay-leave{animation:cps-dialog-overlay-leave-animation .15s forwards}.cps-dialog-blurred-overlay-enter{animation:cps-dialog-blurred-overlay-enter-animation .15s forwards}.cps-dialog-blurred-overlay-leave{animation:cps-dialog-blurred-overlay-leave-animation .15s forwards}.cps-dialog-overlay{background-color:#0003;transition-duration:.2s}.cps-dialog-blurred-overlay{-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}@keyframes cps-dialog-overlay-enter-animation{0%{background-color:transparent}to{background-color:#0003}}@keyframes cps-dialog-overlay-leave-animation{0%{background-color:#0003}to{background-color:transparent}}@keyframes cps-dialog-blurred-overlay-enter-animation{0%{background-color:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{background-color:#0003;-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}}@keyframes cps-dialog-blurred-overlay-leave-animation{0%{background-color:#0003;-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem)}to{background-color:transparent;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}.cps-dialog{box-sizing:border-box;display:flex;flex-direction:column;pointer-events:auto;transform:scale(1);position:relative;border-radius:.25rem;box-shadow:0 .0625rem .1875rem #0000004d;border:0 none;font-family:Source Sans Pro,sans-serif;font-size:1rem;font-weight:400}.cps-dialog:focus-visible{outline:none;position:relative}.cps-dialog:focus-visible:before,.cps-dialog:focus-visible:after{content:\"\";position:absolute;border-radius:inherit}.cps-dialog:focus-visible:before{inset:-.0625rem;border:.0625rem solid var(--cps-color-calm)}.cps-dialog:focus-visible:after{inset:-.125rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-dialog:focus-visible.suppress-focus-visible:before,.cps-dialog:focus-visible.suppress-focus-visible:after{display:none}.cps-dialog .cps-dialog-header{overflow:hidden;border-bottom:0 none;background:#fff;color:var(--cps-color-text-dark);padding:1rem;border-top-right-radius:.25rem;border-top-left-radius:.25rem;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.cps-dialog .cps-dialog-header.cps-dialog-header-left-bordered{border-left:.25rem solid var(--cps-color-surprise)}.cps-dialog .cps-dialog-header.cps-dialog-header-bottom-bordered{border-bottom:.0625rem solid var(--cps-color-line-mid)}.cps-dialog .cps-dialog-header .cps-dialog-header-left{display:flex;align-items:center}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-icon{margin-right:.5rem;display:flex}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-title{cursor:default;font-weight:700;font-size:1.25rem}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-info-circle{margin-left:.5rem;cursor:default;display:flex}.cps-dialog .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-info-circle cps-info-circle{margin-top:.125rem}.cps-dialog .cps-dialog-content{background:#fff;color:var(--cps-color-text-dark);padding:1rem}.cps-dialog .cps-dialog-content:last-of-type,.cps-dialog-resizable .cps-dialog-content{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.cps-dialog-content{overflow-y:auto;flex-grow:1}.cps-dialog-dragging .cps-dialog-header{background-color:var(--cps-color-highlight-active)!important}.cps-dialog-draggable .cps-dialog-header{cursor:move;overflow:visible}.cps-dialog-draggable .cps-dialog-header:hover{background-color:var(--cps-color-highlight-hover)}.cps-dialog-draggable .cps-dialog-header.cps-dialog-header-moving{background-color:var(--cps-color-highlight-active)}.cps-dialog-draggable .cps-dialog-header .cps-dialog-header-left .cps-dialog-header-title{cursor:unset}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible{outline:none;position:relative}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:before,.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:after{content:\"\";position:absolute;border-radius:.25rem}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:before{inset:-.25rem;border:.0625rem solid var(--cps-color-calm)}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible:after{inset:-.375rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible.suppress-focus-visible:before,.cps-dialog-draggable .cps-dialog-drag-handle:focus-visible.suppress-focus-visible:after{display:none}.cps-dialog .cps-dialog-header-action-buttons{display:flex;align-items:center}.cps-dialog-top .cps-dialog,.cps-dialog-bottom .cps-dialog,.cps-dialog-left .cps-dialog,.cps-dialog-right .cps-dialog,.cps-dialog-top-left .cps-dialog,.cps-dialog-top-right .cps-dialog,.cps-dialog-bottom-left .cps-dialog,.cps-dialog-bottom-right .cps-dialog{margin:.75rem;transform:translateZ(0)}.cps-dialog-maximized{-webkit-transition:none;transition:none;transform:none;width:100vw!important;height:100vh!important;top:0!important;left:0!important;max-height:100%;height:100%}.cps-dialog-maximized .cps-dialog-content{flex-grow:1;border-radius:0!important}.cps-dialog-maximized .cps-dialog-header{border-radius:0!important}.cps-dialog-left{justify-content:flex-start}.cps-dialog-right{justify-content:flex-end}.cps-dialog-top{align-items:flex-start}.cps-dialog-top-left{justify-content:flex-start;align-items:flex-start}.cps-dialog-top-right{justify-content:flex-end;align-items:flex-start}.cps-dialog-bottom{align-items:flex-end}.cps-dialog-bottom-left{justify-content:flex-start;align-items:flex-end}.cps-dialog-bottom-right{justify-content:flex-end;align-items:flex-end}.cps-dialog .cps-dialog-resizable-handle{position:absolute;display:block;cursor:nwse-resize;width:1.5rem;height:1.5rem;right:0;bottom:0;overflow:visible}.cps-dialog .cps-dialog-resizable-handle:focus-visible{background-color:var(--cps-color-highlight-hover)}.cps-dialog .cps-dialog-resizable-handle.cps-dialog-resizable-handle-resizing,.cps-dialog .cps-dialog-resizable-handle.cps-dialog-resizable-handle-resizing:focus-visible{background-color:var(--cps-color-highlight-active)}.cps-dialog .cps-dialog-resizable-handle{outline:none;position:relative}.cps-dialog .cps-dialog-resizable-handle:before,.cps-dialog .cps-dialog-resizable-handle:after{content:\"\";position:absolute;border-radius:0}.cps-dialog .cps-dialog-resizable-handle:before{inset:-.125rem;border:.0625rem solid var(--cps-color-calm)}.cps-dialog .cps-dialog-resizable-handle:after{inset:-.25rem;border:.0625rem solid var(--cps-color-calm-highlighten)}.cps-dialog .cps-dialog-resizable-handle.suppress-focus-visible:before,.cps-dialog .cps-dialog-resizable-handle.suppress-focus-visible:after{display:none}.cps-dialog .cps-dialog-resizable-handle{position:absolute}.cps-dialog .cps-dialog-resizable-handle:not(:focus-visible):before,.cps-dialog .cps-dialog-resizable-handle:not(:focus-visible):after{display:none}.cps-dialog .cps-dialog-resizable-handle .cps-dialog-resizable-handle-grip{position:absolute;inset:0;overflow:hidden;display:block}.cps-dialog .cps-dialog-resizable-handle .cps-dialog-resizable-handle-grip:after{content:\"\";position:absolute;display:block;width:3.125rem;height:0;box-shadow:0 0 0 .0625rem var(--cps-color-calm),0 .4375rem 0 .0625rem var(--cps-color-calm),0 .875rem 0 .0625rem var(--cps-color-calm),0 1.3125rem 0 .0625rem var(--cps-color-calm);transform:translate(-50%,-50%) rotate(-45deg) scale(.5);top:65%;left:65%}.cps-unselectable-text{-webkit-user-select:none;user-select:none}.cps-overflow-hidden{overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: CpsDialogContentDirective, selector: "[cpsDialogContent]" }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsInfoCircleComponent, selector: "cps-info-circle", inputs: ["size", "tooltipText", "tooltipPosition", "tooltipContentClass", "tooltipMaxWidth", "tooltipPersistent"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }], animations: [
|
|
15440
15440
|
trigger('animation', [
|
|
15441
15441
|
transition('void => visible', [useAnimation(showAnimation)]),
|
|
15442
15442
|
transition('visible => void', [useAnimation(hideAnimation)])
|
|
15443
15443
|
])
|
|
15444
15444
|
], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
15445
15445
|
}
|
|
15446
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
15446
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogComponent, decorators: [{
|
|
15447
15447
|
type: Component,
|
|
15448
15448
|
args: [{ selector: 'cps-dialog', imports: [
|
|
15449
15449
|
CommonModule,
|
|
@@ -15492,10 +15492,10 @@ class CpsConfirmationComponent {
|
|
|
15492
15492
|
close(confirm) {
|
|
15493
15493
|
this._dialogRef?.close(confirm);
|
|
15494
15494
|
}
|
|
15495
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
15496
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.
|
|
15495
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsConfirmationComponent, deps: [{ token: CpsDialogRef }, { token: CpsDialogConfig }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15496
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.13", type: CpsConfirmationComponent, isStandalone: true, selector: "cps-confirmation", ngImport: i0, template: "<div class=\"cps-confirmation\">\n <span class=\"cps-confirmation-subtitle\" [innerHTML]=\"subtitle\"></span>\n <div class=\"cps-confirmation-buttons\">\n <cps-button\n type=\"outlined\"\n label=\"No\"\n (clicked)=\"close(false)\"\n color=\"calm\">\n </cps-button>\n <cps-button\n data-testid=\"btn-yes\"\n label=\"Yes\"\n (clicked)=\"close(true)\"\n color=\"calm\">\n </cps-button>\n </div>\n</div>\n", styles: [":host .cps-confirmation{display:flex;flex-direction:column;align-items:center;padding:.5rem}:host .cps-confirmation-subtitle{font-size:1rem;font-weight:400;font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-dark)}:host .cps-confirmation-buttons{width:100%;display:flex;justify-content:space-around;padding-top:1.75rem}\n"], dependencies: [{ kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }] }); }
|
|
15497
15497
|
}
|
|
15498
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
15498
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsConfirmationComponent, decorators: [{
|
|
15499
15499
|
type: Component,
|
|
15500
15500
|
args: [{ imports: [CpsButtonComponent], selector: 'cps-confirmation', template: "<div class=\"cps-confirmation\">\n <span class=\"cps-confirmation-subtitle\" [innerHTML]=\"subtitle\"></span>\n <div class=\"cps-confirmation-buttons\">\n <cps-button\n type=\"outlined\"\n label=\"No\"\n (clicked)=\"close(false)\"\n color=\"calm\">\n </cps-button>\n <cps-button\n data-testid=\"btn-yes\"\n label=\"Yes\"\n (clicked)=\"close(true)\"\n color=\"calm\">\n </cps-button>\n </div>\n</div>\n", styles: [":host .cps-confirmation{display:flex;flex-direction:column;align-items:center;padding:.5rem}:host .cps-confirmation-subtitle{font-size:1rem;font-weight:400;font-family:Source Sans Pro,sans-serif;color:var(--cps-color-text-dark)}:host .cps-confirmation-buttons{width:100%;display:flex;justify-content:space-around;padding-top:1.75rem}\n"] }]
|
|
15501
15501
|
}], ctorParameters: () => [{ type: CpsDialogRef }, { type: CpsDialogConfig }] });
|
|
@@ -15624,10 +15624,10 @@ class CpsDialogService {
|
|
|
15624
15624
|
callback(items[i]);
|
|
15625
15625
|
}
|
|
15626
15626
|
}
|
|
15627
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
15628
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
15627
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogService, deps: [{ token: i0.ApplicationRef }, { token: i0.EnvironmentInjector }, { token: i0.Injector }, { token: DOCUMENT }, { token: CpsDialogService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
15628
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogService, providedIn: 'root' }); }
|
|
15629
15629
|
}
|
|
15630
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
15630
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsDialogService, decorators: [{
|
|
15631
15631
|
type: Injectable,
|
|
15632
15632
|
args: [{ providedIn: 'root' }]
|
|
15633
15633
|
}], ctorParameters: () => [{ type: i0.ApplicationRef }, { type: i0.EnvironmentInjector }, { type: i0.Injector }, { type: Document, decorators: [{
|
|
@@ -15724,8 +15724,8 @@ class CpsToastComponent {
|
|
|
15724
15724
|
this.timeout = null;
|
|
15725
15725
|
}
|
|
15726
15726
|
}
|
|
15727
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
15728
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
15727
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsToastComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15728
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsToastComponent, isStandalone: true, selector: "cps-toast", inputs: { config: "config", data: "data" }, outputs: { closed: "closed" }, ngImport: i0, template: "<div\n (mouseenter)=\"clearTimeout()\"\n (mouseleave)=\"initiateTimeout()\"\n [class]=\"data.type\"\n [@toastState]=\"{\n value: 'visible'\n }\"\n [ngStyle]=\"{ 'max-width': maxWidth }\"\n class=\"cps-toast-content\">\n <div class=\"cps-toast-icon\" [ngClass]=\"{ filled: filled }\">\n <cps-icon\n [icon]=\"'toast-' + data.type\"\n [color]=\"filled ? '#fff' : color\"\n size=\"normal\"></cps-icon>\n </div>\n <div class=\"cps-toast-message\">\n <p class=\"cps-toast-message-header\">{{ data.message || '' }}</p>\n @if (data.details) {\n <p class=\"cps-toast-message-details\">\n {{ data.details }}\n </p>\n }\n </div>\n <div class=\"cps-toast-buttons\">\n <cps-button\n (clicked)=\"close()\"\n [color]=\"color\"\n ariaLabel=\"Close notification\"\n icon=\"close-x\"\n class=\"cps-toast-close-button\"\n width=\"40\"\n type=\"borderless\"></cps-button>\n </div>\n</div>\n", styles: [":host .cps-toast-content{color:var(--cps-color-text-darkest);border-radius:4px;box-shadow:0 1px 3px #0000004d;display:flex;overflow:hidden}:host .cps-toast-content.success{background-color:var(--cps-color-success-bg);border:2px solid var(--cps-color-success)}:host .cps-toast-content.success .cps-toast-icon.filled{background-color:var(--cps-color-success)}:host .cps-toast-content.error{background-color:var(--cps-color-error-bg);border:2px solid var(--cps-color-error)}:host .cps-toast-content.error .cps-toast-icon.filled{background-color:var(--cps-color-error)}:host .cps-toast-content.warning{background-color:var(--cps-color-warn-bg);border:2px solid var(--cps-color-warn)}:host .cps-toast-content.warning .cps-toast-icon.filled{background-color:var(--cps-color-warn)}:host .cps-toast-content.info{background-color:var(--cps-color-info-bg);border:2px solid var(--cps-color-info)}:host .cps-toast-content.info .cps-toast-icon.filled{background-color:var(--cps-color-info)}:host .cps-toast-icon{display:flex;align-items:center;padding:20px}:host .cps-toast-message{display:flex;flex-direction:column;justify-content:center;padding:0 16px;font-weight:600;font-family:Source Sans Pro,sans-serif;cursor:default}:host .cps-toast-message .cps-toast-message-details{white-space:pre-line;margin-top:0;font-size:14px}:host .cps-toast-buttons{display:flex;justify-content:center;align-items:center}:host .cps-toast-buttons .cps-toast-close-button{margin:0 8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CpsButtonComponent, selector: "cps-button", inputs: ["color", "contentColor", "borderRadius", "type", "label", "ariaLabel", "icon", "iconPosition", "size", "width", "height", "disabled", "loading"], outputs: ["clicked"] }, { kind: "component", type: CpsIconComponent, selector: "cps-icon", inputs: ["icon", "size", "color"] }], animations: [
|
|
15729
15729
|
trigger('toastState', [
|
|
15730
15730
|
state('visible', style({
|
|
15731
15731
|
transform: 'translateY(0)',
|
|
@@ -15745,7 +15745,7 @@ class CpsToastComponent {
|
|
|
15745
15745
|
])
|
|
15746
15746
|
] }); }
|
|
15747
15747
|
}
|
|
15748
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
15748
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsToastComponent, decorators: [{
|
|
15749
15749
|
type: Component,
|
|
15750
15750
|
args: [{ imports: [CommonModule, CpsButtonComponent, CpsIconComponent], selector: 'cps-toast', animations: [
|
|
15751
15751
|
trigger('toastState', [
|
|
@@ -15826,14 +15826,14 @@ class CpsNotificationContainerComponent {
|
|
|
15826
15826
|
ZIndexUtils.clear(this.container.nativeElement);
|
|
15827
15827
|
}
|
|
15828
15828
|
}
|
|
15829
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
15830
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
15829
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsNotificationContainerComponent, deps: [{ token: i0.Renderer2 }, { token: i0.NgZone }, { token: i1.PrimeNG }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15830
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: CpsNotificationContainerComponent, isStandalone: true, selector: "cps-notification-container", inputs: { position: "position" }, outputs: { closed: "closed" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div\n [ngClass]=\"{\n 'cps-notification-container-mask': true,\n 'cps-notification-container-left':\n position === CpsNotificationPosition.LEFT,\n 'cps-notification-container-right':\n position === CpsNotificationPosition.RIGHT,\n 'cps-notification-container-top': position === CpsNotificationPosition.TOP,\n 'cps-notification-container-bottom':\n position === CpsNotificationPosition.BOTTOM,\n 'cps-notification-container-top-left':\n position === CpsNotificationPosition.TOPLEFT,\n 'cps-notification-container-top-right':\n position === CpsNotificationPosition.TOPRIGHT,\n 'cps-notification-container-bottom-left':\n position === CpsNotificationPosition.BOTTOMLEFT,\n 'cps-notification-container-bottom-right':\n position === CpsNotificationPosition.BOTTOMRIGHT\n }\">\n <div #container class=\"cps-notification-container\" role=\"notification\">\n <div\n #content\n class=\"cps-notification-container-content\"\n [ngStyle]=\"{\n 'align-items': [\n CpsNotificationPosition.RIGHT,\n CpsNotificationPosition.TOPRIGHT,\n CpsNotificationPosition.BOTTOMRIGHT\n ].includes(position)\n ? 'flex-end'\n : 'flex-start'\n }\">\n @for (notification of notifications; track notification; let i = $index) {\n <cps-toast\n [data]=\"notification.data\"\n [config]=\"notification.config\"\n @notificationAnimation\n (closed)=\"onCloseNotification(i)\">\n </cps-toast>\n }\n </div>\n </div>\n</div>\n", styles: [".cps-notification-container-mask{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none}.cps-notification-container{box-sizing:border-box;display:flex;flex-direction:column;pointer-events:auto;transform:scale(1);position:relative;border-radius:4px;border:0 none;font-family:Source Sans Pro,sans-serif;font-size:1rem;font-weight:400}.cps-notification-container .cps-notification-container-content{background:transparent;flex-grow:1;gap:12px;display:flex;flex-direction:column-reverse}.cps-notification-container-top .cps-notification-container,.cps-notification-container-bottom .cps-notification-container,.cps-notification-container-left .cps-notification-container,.cps-notification-container-right .cps-notification-container,.cps-notification-container-top-left .cps-notification-container,.cps-notification-container-top-right .cps-notification-container,.cps-notification-container-bottom-left .cps-notification-container,.cps-notification-container-bottom-right .cps-notification-container{margin:.75rem;transform:translateZ(0)}.cps-notification-container-left{justify-content:flex-start}.cps-notification-container-right{justify-content:flex-end}.cps-notification-container-top{align-items:flex-start}.cps-notification-container-top-left{justify-content:flex-start;align-items:flex-start}.cps-notification-container-top-right{justify-content:flex-end;align-items:flex-start}.cps-notification-container-bottom{align-items:flex-end}.cps-notification-container-bottom-left{justify-content:flex-start;align-items:flex-end}.cps-notification-container-bottom-right{justify-content:flex-end;align-items:flex-end}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: CpsToastComponent, selector: "cps-toast", inputs: ["config", "data"], outputs: ["closed"] }], animations: [
|
|
15831
15831
|
trigger('notificationAnimation', [
|
|
15832
15832
|
transition(':enter, :leave', [query('@*', animateChild())])
|
|
15833
15833
|
])
|
|
15834
15834
|
], encapsulation: i0.ViewEncapsulation.None }); }
|
|
15835
15835
|
}
|
|
15836
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
15836
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsNotificationContainerComponent, decorators: [{
|
|
15837
15837
|
type: Component,
|
|
15838
15838
|
args: [{ selector: 'cps-notification-container', imports: [CommonModule, SharedModule, CpsToastComponent], encapsulation: ViewEncapsulation.None, animations: [
|
|
15839
15839
|
trigger('notificationAnimation', [
|
|
@@ -15954,10 +15954,10 @@ class CpsNotificationService {
|
|
|
15954
15954
|
this._containersMap.delete(position);
|
|
15955
15955
|
}
|
|
15956
15956
|
}
|
|
15957
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
15958
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
15957
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsNotificationService, deps: [{ token: i0.ApplicationRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
15958
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsNotificationService, providedIn: 'root' }); }
|
|
15959
15959
|
}
|
|
15960
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
15960
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsNotificationService, decorators: [{
|
|
15961
15961
|
type: Injectable,
|
|
15962
15962
|
args: [{ providedIn: 'root' }]
|
|
15963
15963
|
}], ctorParameters: () => [{ type: i0.ApplicationRef }, { type: Document, decorators: [{
|
|
@@ -16046,10 +16046,10 @@ class CpsRootFontSizeService {
|
|
|
16046
16046
|
_readRootFontSize() {
|
|
16047
16047
|
return parseFloat(getComputedStyle(this._document.documentElement).fontSize);
|
|
16048
16048
|
}
|
|
16049
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
16050
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
16049
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRootFontSizeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
16050
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRootFontSizeService, providedIn: 'root' }); }
|
|
16051
16051
|
}
|
|
16052
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
16052
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsRootFontSizeService, decorators: [{
|
|
16053
16053
|
type: Injectable,
|
|
16054
16054
|
args: [{
|
|
16055
16055
|
providedIn: 'root'
|
|
@@ -16304,10 +16304,10 @@ class CpsThemeService {
|
|
|
16304
16304
|
saveRadiusThemePreference(radiusTheme) {
|
|
16305
16305
|
localStorage.setItem(this.RADIUS_THEME_STORAGE_KEY, radiusTheme);
|
|
16306
16306
|
}
|
|
16307
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
16308
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
16307
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
16308
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsThemeService, providedIn: 'root' }); }
|
|
16309
16309
|
}
|
|
16310
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
16310
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: CpsThemeService, decorators: [{
|
|
16311
16311
|
type: Injectable,
|
|
16312
16312
|
args: [{
|
|
16313
16313
|
providedIn: 'root'
|