@cuby-ui/core 0.0.591 → 0.0.593
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/components/badge/badge.options.d.ts +1 -1
- package/esm2022/components/badge/badge.component.mjs +2 -2
- package/esm2022/components/badge/badge.options.mjs +1 -1
- package/esm2022/components/context-menu/context-menu.component.mjs +2 -2
- package/esm2022/components/date-range-calendar/date-range-calendar.component.mjs +2 -2
- package/esm2022/components/dialog/dialog.component.mjs +2 -2
- package/esm2022/components/dropdown/dropdown-wrapper.component.mjs +3 -3
- package/esm2022/components/ghost-input/ghost-input.component.mjs +2 -2
- package/esm2022/components/input-number/input-number.component.mjs +2 -2
- package/esm2022/components/input-password/input-password.component.mjs +2 -2
- package/esm2022/components/input-text/input-text.component.mjs +2 -2
- package/esm2022/components/input-time/input-time.component.mjs +2 -2
- package/esm2022/components/letter-box/letter-box.component.mjs +2 -2
- package/esm2022/components/notification/notification.component.mjs +2 -2
- package/esm2022/components/select/select.component.mjs +2 -2
- package/esm2022/components/textarea/textarea.component.mjs +2 -2
- package/esm2022/editor/components/editor-tooltip/editor-tooltip.component.mjs +3 -3
- package/esm2022/editor/components/marker-modal/marker-modal.component.mjs +3 -3
- package/esm2022/editor/components/marker-select/marker-select.component.mjs +3 -3
- package/esm2022/widgets/ui/button-change-theme/button-change-theme.component.mjs +2 -2
- package/esm2022/widgets/ui/categories/components/category-item/category-item.component.mjs +2 -2
- package/esm2022/widgets/ui/categories-tree/components/category-tree-item/category-tree-item.component.mjs +2 -2
- package/esm2022/widgets/ui/delete-modal/delete-modal.component.mjs +3 -3
- package/fesm2022/cuby-ui-core.mjs +42 -42
- package/fesm2022/cuby-ui-core.mjs.map +1 -1
- package/package.json +4 -4
- package/styles/mixins/shadows.scss +11 -12
- package/styles/theme.scss +394 -7
- package/styles/variables/colors.scss +147 -0
|
@@ -421,11 +421,11 @@ class CuiNotificationComponent {
|
|
|
421
421
|
this.iconOptions = this.ICON_OPTIONS[this.mode];
|
|
422
422
|
}
|
|
423
423
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
424
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiNotificationComponent, selector: "cui-notification", inputs: { status: "status", mode: "mode", isCloseable: "isCloseable" }, outputs: { closed: "closed" }, host: { properties: { "attr.data-status": "this.status", "attr.data-mode": "this.mode" } }, ngImport: i0, template: "<cui-svg\n class=\"c-icon\"\n [icon]=\"ICONS[status].icon\"\n [color]=\"iconOptions[status].color\"\n></cui-svg>\n<div class=\"c-content\">\n <ng-content></ng-content>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n icon=\"cuiIconX\"\n color=\"var(--cui-gray-0)\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:
|
|
424
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiNotificationComponent, selector: "cui-notification", inputs: { status: "status", mode: "mode", isCloseable: "isCloseable" }, outputs: { closed: "closed" }, host: { properties: { "attr.data-status": "this.status", "attr.data-mode": "this.mode" } }, ngImport: i0, template: "<cui-svg\n class=\"c-icon\"\n [icon]=\"ICONS[status].icon\"\n [color]=\"iconOptions[status].color\"\n></cui-svg>\n<div class=\"c-content\">\n <ng-content></ng-content>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n icon=\"cuiIconX\"\n color=\"var(--cui-gray-0)\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:8px;background:var(--cui-gray-800);color:var(--cui-gray-0);font-family:var(--cui-main-font)}:host[data-mode=light]{padding:15px;border:1px solid;color:var(--cui-base-900)}:host[data-mode=light][data-status=info]{border-color:var(--cui-info);background:var(--cui-badge-blue-bg)}:host[data-mode=light][data-status=success]{border-color:var(--cui-green-700);background:var(--cui-badge-green-bg)}:host[data-mode=light][data-status=alert]{border-color:var(--cui-yellow-400);background:var(--cui-badge-yellow-bg)}:host[data-mode=light][data-status=error]{border-color:var(--cui-danger);background:var(--cui-badge-red-bg)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400)}:host-context([cuiTheme=dark])[data-status=info]{background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}.c-content{flex:1;margin-left:12px;margin-right:16px;margin-top:5px;overflow-wrap:anywhere}.c-icon{margin-top:6px}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:12px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:#fff3}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
425
425
|
}
|
|
426
426
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiNotificationComponent, decorators: [{
|
|
427
427
|
type: Component,
|
|
428
|
-
args: [{ selector: 'cui-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\n class=\"c-icon\"\n [icon]=\"ICONS[status].icon\"\n [color]=\"iconOptions[status].color\"\n></cui-svg>\n<div class=\"c-content\">\n <ng-content></ng-content>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n icon=\"cuiIconX\"\n color=\"var(--cui-gray-0)\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:
|
|
428
|
+
args: [{ selector: 'cui-notification', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cui-svg\n class=\"c-icon\"\n [icon]=\"ICONS[status].icon\"\n [color]=\"iconOptions[status].color\"\n></cui-svg>\n<div class=\"c-content\">\n <ng-content></ng-content>\n</div>\n<button\n *ngIf=\"isCloseable\"\n class=\"c-button\"\n (click)=\"onClose()\"\n>\n <cui-svg\n icon=\"cuiIconX\"\n color=\"var(--cui-gray-0)\"\n />\n</button>\n", styles: [":host{--c-info-icon-color: var(--cui-blue-600);padding:16px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:flex-start;border-radius:8px;background:var(--cui-gray-800);color:var(--cui-gray-0);font-family:var(--cui-main-font)}:host[data-mode=light]{padding:15px;border:1px solid;color:var(--cui-base-900)}:host[data-mode=light][data-status=info]{border-color:var(--cui-info);background:var(--cui-badge-blue-bg)}:host[data-mode=light][data-status=success]{border-color:var(--cui-green-700);background:var(--cui-badge-green-bg)}:host[data-mode=light][data-status=alert]{border-color:var(--cui-yellow-400);background:var(--cui-badge-yellow-bg)}:host[data-mode=light][data-status=error]{border-color:var(--cui-danger);background:var(--cui-badge-red-bg)}:host-context([cuiTheme=dark]){--c-info-icon-color: var(--cui-light-blue-400)}:host-context([cuiTheme=dark])[data-status=info]{background:var(--cui-blue-900)}:host-context([cuiTheme=dark])[data-status=success]{background:var(--cui-green-900)}:host-context([cuiTheme=dark])[data-status=alert]{background:var(--cui-yellow-900)}:host-context([cuiTheme=dark])[data-status=error]{background:var(--cui-red-900)}.c-content{flex:1;margin-left:12px;margin-right:16px;margin-top:5px;overflow-wrap:anywhere}.c-icon{margin-top:6px}.c-button{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:12px;padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}.c-button:hover{background:#fff3}\n"] }]
|
|
429
429
|
}], propDecorators: { status: [{
|
|
430
430
|
type: Input
|
|
431
431
|
}, {
|
|
@@ -2481,11 +2481,11 @@ class CuiBadgeComponent {
|
|
|
2481
2481
|
this.variant = this.options.variant;
|
|
2482
2482
|
}
|
|
2483
2483
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2484
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiBadgeComponent, selector: "cui-badge", inputs: { color: "color", size: "size", variant: "variant" }, host: { properties: { "attr.data-color": "this.color", "attr.data-size": "this.size", "attr.data-variant": "this.variant" } }, ngImport: i0, template: "<span class=\"c-badge__icon\"><ng-content select=\"[cuiBadgeIcon]\" /></span>\n<span class=\"c-badge__body\">\n <ng-content />\n</span>\n", styles: [":host{--cui-badge-accent: currentColor;padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font);box-sizing:border-box}:host[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg)}:host[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg)}:host[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg)}:host[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg)}:host[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg)}:host[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-badge-violet-stroke);outline-offset:-1px}:host[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-gray-900);background:var(--cui-orange-600)}:host[data-color=lavender-solid]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-gray-900);background:var(--cui-lavender-300)}:host[data-color=magenta-solid]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-gray-900);background:var(--cui-magenta-400)}:host[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-gray-900);background:var(--cui-violet-300)}:host[data-color=black-solid]{--cui-badge-accent: var(--cui-base-0);color:var(--cui-base-0);background:var(--cui-base-900)}:host[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-gray-900);background:var(--cui-red-400)}:host[data-color=blue-solid]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-gray-900);background:var(--cui-light-blue-500)}:host[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-badge__body{display:inline-flex;align-items:center;min-width:0}.c-badge__icon{display:contents}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [stroke]{stroke:var(--cui-badge-accent)}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [fill]:not([fill=none]){fill:var(--cui-badge-accent)}:host([data-variant=soft])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-200);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-base-0);background:var(--cui-badge-gray-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-base-0);background:var(--cui-base-600);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=outline])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-blue-border-bold)}:host([data-variant=outline])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-gray-border-bold)}:host([data-variant=outline])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-0);background:transparent;outline:none;border:1px solid var(--cui-base-400)}:host([data-variant=outline])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-green-border-bold)}:host([data-variant=emphasis])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-blue-border-subtle)}:host([data-variant=emphasis])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg-subtle);outline:none;border:1px solid var(--cui-badge-gray-border-subtle)}:host([data-variant=emphasis])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-base-0);background:var(--cui-base-200);outline:none;border:1px solid var(--cui-base-300)}:host([data-variant=emphasis])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-green-border-subtle)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2484
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiBadgeComponent, selector: "cui-badge", inputs: { color: "color", size: "size", variant: "variant" }, host: { properties: { "attr.data-color": "this.color", "attr.data-size": "this.size", "attr.data-variant": "this.variant" } }, ngImport: i0, template: "<span class=\"c-badge__icon\"><ng-content select=\"[cuiBadgeIcon]\" /></span>\n<span class=\"c-badge__body\">\n <ng-content />\n</span>\n", styles: [":host{--cui-badge-accent: currentColor;padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font);box-sizing:border-box}:host[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg)}:host[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg)}:host[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg)}:host[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg)}:host[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg)}:host[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-badge-violet-stroke);outline-offset:-1px}:host[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-gray-900);background:var(--cui-orange-600)}:host[data-color=lavender-solid]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-gray-900);background:var(--cui-lavender-300)}:host[data-color=magenta-solid]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-gray-900);background:var(--cui-magenta-400)}:host[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-gray-900);background:var(--cui-violet-300)}:host[data-color=black-solid]{--cui-badge-accent: var(--cui-base-0);color:var(--cui-base-0);background:var(--cui-base-900)}:host[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-gray-900);background:var(--cui-red-400)}:host[data-color=blue-solid]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-gray-900);background:var(--cui-light-blue-500)}:host[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-badge-cyan-label-inverse);background:var(--cui-badge-cyan-bg)}:host[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-badge-purple-label-inverse);background:var(--cui-badge-purple-bg)}:host[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-badge-terra-label-inverse);background:var(--cui-badge-terra-bg)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-badge__body{display:inline-flex;align-items:center;min-width:0}.c-badge__icon{display:contents}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [stroke]{stroke:var(--cui-badge-accent)}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [fill]:not([fill=none]){fill:var(--cui-badge-accent)}:host([data-variant=soft])[data-color=green]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=red]{--cui-badge-accent: var(--cui-badge-soft-red-stroke);color:var(--cui-badge-soft-red-label);background:var(--cui-badge-soft-red-bg);outline:none;border:1px solid var(--cui-badge-soft-red-border)}:host([data-variant=soft])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-soft-red-stroke);color:var(--cui-badge-soft-red-label);background:var(--cui-badge-soft-red-bg);outline:none;border:1px solid var(--cui-badge-soft-red-border)}:host([data-variant=soft])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-soft-red-stroke);color:var(--cui-badge-soft-red-label);background:var(--cui-badge-soft-red-bg);outline:none;border:1px solid var(--cui-badge-soft-red-border)}:host([data-variant=soft])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-soft-yellow-stroke);color:var(--cui-badge-soft-yellow-label);background:var(--cui-badge-soft-yellow-bg);outline:none;border:1px solid var(--cui-badge-soft-yellow-border)}:host([data-variant=soft])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-soft-yellow-stroke);color:var(--cui-badge-soft-yellow-label);background:var(--cui-badge-soft-yellow-bg);outline:none;border:1px solid var(--cui-badge-soft-yellow-border)}:host([data-variant=soft])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-soft-yellow-stroke);color:var(--cui-badge-soft-yellow-label);background:var(--cui-badge-soft-yellow-bg);outline:none;border:1px solid var(--cui-badge-soft-yellow-border)}:host([data-variant=soft])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-soft-light-blue-stroke);color:var(--cui-badge-soft-light-blue-label);background:var(--cui-badge-soft-light-blue-bg);outline:none;border:1px solid var(--cui-badge-soft-light-blue-border)}:host([data-variant=soft])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-soft-light-blue-stroke);color:var(--cui-badge-soft-light-blue-label);background:var(--cui-badge-soft-light-blue-bg);outline:none;border:1px solid var(--cui-badge-soft-light-blue-border)}:host([data-variant=soft])[data-color=blue]{--cui-badge-accent: var(--cui-badge-soft-blue-stroke);color:var(--cui-badge-soft-blue-label);background:var(--cui-badge-soft-blue-bg);outline:none;border:1px solid var(--cui-badge-soft-blue-border)}:host([data-variant=soft])[data-color=gray]{--cui-badge-accent: var(--cui-badge-soft-gray-stroke);color:var(--cui-badge-soft-gray-label);background:var(--cui-badge-soft-gray-bg);outline:none;border:1px solid var(--cui-badge-soft-gray-border)}:host([data-variant=soft])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-100);outline:none;border:1px solid var(--cui-base-200)}:host([data-variant=soft])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-soft-lavender-stroke);color:var(--cui-badge-soft-lavender-label);background:var(--cui-badge-soft-lavender-bg);outline:none;border:1px solid var(--cui-badge-soft-lavender-border)}:host([data-variant=soft])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-soft-lavender-stroke);color:var(--cui-badge-soft-lavender-label);background:var(--cui-badge-soft-lavender-bg);outline:none;border:1px solid var(--cui-badge-soft-lavender-border)}:host([data-variant=soft])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-soft-magenta-stroke);color:var(--cui-badge-soft-magenta-label);background:var(--cui-badge-soft-magenta-bg);outline:none;border:1px solid var(--cui-badge-soft-magenta-border)}:host([data-variant=soft])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-soft-magenta-stroke);color:var(--cui-badge-soft-magenta-label);background:var(--cui-badge-soft-magenta-bg);outline:none;border:1px solid var(--cui-badge-soft-magenta-border)}:host([data-variant=soft])[data-color=orange]{--cui-badge-accent: var(--cui-badge-soft-orange-stroke);color:var(--cui-badge-soft-orange-label);background:var(--cui-badge-soft-orange-bg);outline:none;border:1px solid var(--cui-badge-soft-orange-border)}:host([data-variant=soft])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-soft-orange-stroke);color:var(--cui-badge-soft-orange-label);background:var(--cui-badge-soft-orange-bg);outline:none;border:1px solid var(--cui-badge-soft-orange-border)}:host([data-variant=soft])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-soft-orange-stroke);color:var(--cui-badge-soft-orange-label);background:var(--cui-badge-soft-orange-bg);outline:none;border:1px solid var(--cui-badge-soft-orange-border)}:host([data-variant=soft])[data-color=violet]{--cui-badge-accent: var(--cui-badge-soft-violet-stroke);color:var(--cui-badge-soft-violet-label);background:var(--cui-badge-soft-violet-bg);outline:none;border:1px solid var(--cui-badge-soft-violet-border)}:host([data-variant=soft])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-soft-violet-stroke);color:var(--cui-badge-soft-violet-label);background:var(--cui-badge-soft-violet-bg);outline:none;border:1px solid var(--cui-badge-soft-violet-border)}:host([data-variant=soft])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-soft-violet-stroke);color:var(--cui-badge-soft-violet-label);background:var(--cui-badge-soft-violet-bg);outline:none;border:1px solid var(--cui-badge-soft-violet-border)}:host([data-variant=soft])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-soft-light-green-stroke);color:var(--cui-badge-soft-light-green-label);background:var(--cui-badge-soft-light-green-bg);outline:none;border:1px solid var(--cui-badge-soft-light-green-border)}:host([data-variant=soft])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-soft-cyan-stroke);color:var(--cui-badge-soft-cyan-label);background:var(--cui-badge-soft-cyan-bg);outline:none;border:1px solid var(--cui-badge-soft-cyan-border)}:host([data-variant=soft])[data-color=purple]{--cui-badge-accent: var(--cui-badge-soft-purple-stroke);color:var(--cui-badge-soft-purple-label);background:var(--cui-badge-soft-purple-bg);outline:none;border:1px solid var(--cui-badge-soft-purple-border)}:host([data-variant=soft])[data-color=terra]{--cui-badge-accent: var(--cui-badge-soft-terra-stroke);color:var(--cui-badge-soft-terra-label);background:var(--cui-badge-soft-terra-bg);outline:none;border:1px solid var(--cui-badge-soft-terra-border)}:host([data-variant=fill])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-base-0);background:var(--cui-badge-gray-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-badge-dark-gray-label-inverse);background:var(--cui-badge-dark-gray-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-base-0);background:var(--cui-badge-cyan-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-base-0);background:var(--cui-badge-purple-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-base-0);background:var(--cui-badge-terra-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=outline])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-blue-border-bold)}:host([data-variant=outline])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-gray-border-bold)}:host([data-variant=outline])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-badge-dark-gray-label);background:transparent;outline:none;border:1px solid var(--cui-badge-dark-gray-border-bold)}:host([data-variant=outline])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-green-border-bold)}:host([data-variant=outline])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-badge-cyan-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-cyan-border-bold)}:host([data-variant=outline])[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-badge-purple-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-purple-border-bold)}:host([data-variant=outline])[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-badge-terra-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-terra-border-bold)}:host([data-variant=emphasis])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-blue-border-subtle)}:host([data-variant=emphasis])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg-subtle);outline:none;border:1px solid var(--cui-badge-gray-border-subtle)}:host([data-variant=emphasis])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-badge-dark-gray-label);background:var(--cui-badge-dark-gray-bg-subtle);outline:none;border:1px solid var(--cui-badge-dark-gray-border-subtle)}:host([data-variant=emphasis])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-green-border-subtle)}:host([data-variant=emphasis])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-badge-cyan-label-inverse);background:var(--cui-badge-cyan-bg-subtle);outline:none;border:1px solid var(--cui-badge-cyan-border-subtle)}:host([data-variant=emphasis])[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-badge-purple-label-inverse);background:var(--cui-badge-purple-bg-subtle);outline:none;border:1px solid var(--cui-badge-purple-border-subtle)}:host([data-variant=emphasis])[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-badge-terra-label-inverse);background:var(--cui-badge-terra-bg-subtle);outline:none;border:1px solid var(--cui-badge-terra-border-subtle)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2485
2485
|
}
|
|
2486
2486
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiBadgeComponent, decorators: [{
|
|
2487
2487
|
type: Component,
|
|
2488
|
-
args: [{ selector: 'cui-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"c-badge__icon\"><ng-content select=\"[cuiBadgeIcon]\" /></span>\n<span class=\"c-badge__body\">\n <ng-content />\n</span>\n", styles: [":host{--cui-badge-accent: currentColor;padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font);box-sizing:border-box}:host[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg)}:host[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg)}:host[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg)}:host[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg)}:host[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg)}:host[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-badge-violet-stroke);outline-offset:-1px}:host[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-gray-900);background:var(--cui-orange-600)}:host[data-color=lavender-solid]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-gray-900);background:var(--cui-lavender-300)}:host[data-color=magenta-solid]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-gray-900);background:var(--cui-magenta-400)}:host[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-gray-900);background:var(--cui-violet-300)}:host[data-color=black-solid]{--cui-badge-accent: var(--cui-base-0);color:var(--cui-base-0);background:var(--cui-base-900)}:host[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-gray-900);background:var(--cui-red-400)}:host[data-color=blue-solid]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-gray-900);background:var(--cui-light-blue-500)}:host[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-badge__body{display:inline-flex;align-items:center;min-width:0}.c-badge__icon{display:contents}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [stroke]{stroke:var(--cui-badge-accent)}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [fill]:not([fill=none]){fill:var(--cui-badge-accent)}:host([data-variant=soft])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-200);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:none;border:1px solid transparent}:host([data-variant=soft])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-base-0);background:var(--cui-badge-gray-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-base-0);background:var(--cui-base-600);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=outline])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-blue-border-bold)}:host([data-variant=outline])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-gray-border-bold)}:host([data-variant=outline])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-0);background:transparent;outline:none;border:1px solid var(--cui-base-400)}:host([data-variant=outline])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-green-border-bold)}:host([data-variant=emphasis])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-blue-border-subtle)}:host([data-variant=emphasis])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg-subtle);outline:none;border:1px solid var(--cui-badge-gray-border-subtle)}:host([data-variant=emphasis])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-base-0);background:var(--cui-base-200);outline:none;border:1px solid var(--cui-base-300)}:host([data-variant=emphasis])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-green-border-subtle)}\n"] }]
|
|
2488
|
+
args: [{ selector: 'cui-badge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"c-badge__icon\"><ng-content select=\"[cuiBadgeIcon]\" /></span>\n<span class=\"c-badge__body\">\n <ng-content />\n</span>\n", styles: [":host{--cui-badge-accent: currentColor;padding-top:2px;padding-bottom:2px;display:inline-flex;align-items:center;gap:4px;flex-shrink:0;border-radius:25px;color:var(--cui-gray-900);font-family:var(--cui-main-font);box-sizing:border-box}:host[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label);background:var(--cui-badge-light-blue-bg)}:host[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg)}:host[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg)}:host[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg)}:host[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg)}:host[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg)}:host[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg)}:host[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg)}:host[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg)}:host[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg)}:host[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg)}:host[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-200)}:host[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg);outline:1px solid var(--cui-badge-violet-stroke);outline-offset:-1px}:host[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-900);background:var(--cui-yellow-bg)}:host[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-gray-900);background:var(--cui-orange-600)}:host[data-color=lavender-solid]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-gray-900);background:var(--cui-lavender-300)}:host[data-color=magenta-solid]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-gray-900);background:var(--cui-magenta-400)}:host[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-gray-900);background:var(--cui-violet-300)}:host[data-color=black-solid]{--cui-badge-accent: var(--cui-base-0);color:var(--cui-base-0);background:var(--cui-base-900)}:host[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-gray-900);background:var(--cui-red-400)}:host[data-color=blue-solid]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-gray-900);background:var(--cui-light-blue-500)}:host[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-gray-900);background:var(--cui-success)}:host[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-badge-cyan-label-inverse);background:var(--cui-badge-cyan-bg)}:host[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-badge-purple-label-inverse);background:var(--cui-badge-purple-bg)}:host[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-badge-terra-label-inverse);background:var(--cui-badge-terra-bg)}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:6px;padding-left:6px}:host[data-size=md]{font-size:14px;line-height:20px;padding-right:8px;padding-left:8px}.c-badge__body{display:inline-flex;align-items:center;min-width:0}.c-badge__icon{display:contents}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [stroke]{stroke:var(--cui-badge-accent)}.c-badge__icon ::ng-deep cui-svg:not(._with-color) [fill]:not([fill=none]){fill:var(--cui-badge-accent)}:host([data-variant=soft])[data-color=green]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-soft-green-stroke);color:var(--cui-badge-soft-green-label);background:var(--cui-badge-soft-green-bg);outline:none;border:1px solid var(--cui-badge-soft-green-border)}:host([data-variant=soft])[data-color=red]{--cui-badge-accent: var(--cui-badge-soft-red-stroke);color:var(--cui-badge-soft-red-label);background:var(--cui-badge-soft-red-bg);outline:none;border:1px solid var(--cui-badge-soft-red-border)}:host([data-variant=soft])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-soft-red-stroke);color:var(--cui-badge-soft-red-label);background:var(--cui-badge-soft-red-bg);outline:none;border:1px solid var(--cui-badge-soft-red-border)}:host([data-variant=soft])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-soft-red-stroke);color:var(--cui-badge-soft-red-label);background:var(--cui-badge-soft-red-bg);outline:none;border:1px solid var(--cui-badge-soft-red-border)}:host([data-variant=soft])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-soft-yellow-stroke);color:var(--cui-badge-soft-yellow-label);background:var(--cui-badge-soft-yellow-bg);outline:none;border:1px solid var(--cui-badge-soft-yellow-border)}:host([data-variant=soft])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-soft-yellow-stroke);color:var(--cui-badge-soft-yellow-label);background:var(--cui-badge-soft-yellow-bg);outline:none;border:1px solid var(--cui-badge-soft-yellow-border)}:host([data-variant=soft])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-soft-yellow-stroke);color:var(--cui-badge-soft-yellow-label);background:var(--cui-badge-soft-yellow-bg);outline:none;border:1px solid var(--cui-badge-soft-yellow-border)}:host([data-variant=soft])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-soft-light-blue-stroke);color:var(--cui-badge-soft-light-blue-label);background:var(--cui-badge-soft-light-blue-bg);outline:none;border:1px solid var(--cui-badge-soft-light-blue-border)}:host([data-variant=soft])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-soft-light-blue-stroke);color:var(--cui-badge-soft-light-blue-label);background:var(--cui-badge-soft-light-blue-bg);outline:none;border:1px solid var(--cui-badge-soft-light-blue-border)}:host([data-variant=soft])[data-color=blue]{--cui-badge-accent: var(--cui-badge-soft-blue-stroke);color:var(--cui-badge-soft-blue-label);background:var(--cui-badge-soft-blue-bg);outline:none;border:1px solid var(--cui-badge-soft-blue-border)}:host([data-variant=soft])[data-color=gray]{--cui-badge-accent: var(--cui-badge-soft-gray-stroke);color:var(--cui-badge-soft-gray-label);background:var(--cui-badge-soft-gray-bg);outline:none;border:1px solid var(--cui-badge-soft-gray-border)}:host([data-variant=soft])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-base-900);background:var(--cui-base-100);outline:none;border:1px solid var(--cui-base-200)}:host([data-variant=soft])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-soft-lavender-stroke);color:var(--cui-badge-soft-lavender-label);background:var(--cui-badge-soft-lavender-bg);outline:none;border:1px solid var(--cui-badge-soft-lavender-border)}:host([data-variant=soft])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-soft-lavender-stroke);color:var(--cui-badge-soft-lavender-label);background:var(--cui-badge-soft-lavender-bg);outline:none;border:1px solid var(--cui-badge-soft-lavender-border)}:host([data-variant=soft])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-soft-magenta-stroke);color:var(--cui-badge-soft-magenta-label);background:var(--cui-badge-soft-magenta-bg);outline:none;border:1px solid var(--cui-badge-soft-magenta-border)}:host([data-variant=soft])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-soft-magenta-stroke);color:var(--cui-badge-soft-magenta-label);background:var(--cui-badge-soft-magenta-bg);outline:none;border:1px solid var(--cui-badge-soft-magenta-border)}:host([data-variant=soft])[data-color=orange]{--cui-badge-accent: var(--cui-badge-soft-orange-stroke);color:var(--cui-badge-soft-orange-label);background:var(--cui-badge-soft-orange-bg);outline:none;border:1px solid var(--cui-badge-soft-orange-border)}:host([data-variant=soft])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-soft-orange-stroke);color:var(--cui-badge-soft-orange-label);background:var(--cui-badge-soft-orange-bg);outline:none;border:1px solid var(--cui-badge-soft-orange-border)}:host([data-variant=soft])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-soft-orange-stroke);color:var(--cui-badge-soft-orange-label);background:var(--cui-badge-soft-orange-bg);outline:none;border:1px solid var(--cui-badge-soft-orange-border)}:host([data-variant=soft])[data-color=violet]{--cui-badge-accent: var(--cui-badge-soft-violet-stroke);color:var(--cui-badge-soft-violet-label);background:var(--cui-badge-soft-violet-bg);outline:none;border:1px solid var(--cui-badge-soft-violet-border)}:host([data-variant=soft])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-soft-violet-stroke);color:var(--cui-badge-soft-violet-label);background:var(--cui-badge-soft-violet-bg);outline:none;border:1px solid var(--cui-badge-soft-violet-border)}:host([data-variant=soft])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-soft-violet-stroke);color:var(--cui-badge-soft-violet-label);background:var(--cui-badge-soft-violet-bg);outline:none;border:1px solid var(--cui-badge-soft-violet-border)}:host([data-variant=soft])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-soft-light-green-stroke);color:var(--cui-badge-soft-light-green-label);background:var(--cui-badge-soft-light-green-bg);outline:none;border:1px solid var(--cui-badge-soft-light-green-border)}:host([data-variant=soft])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-soft-cyan-stroke);color:var(--cui-badge-soft-cyan-label);background:var(--cui-badge-soft-cyan-bg);outline:none;border:1px solid var(--cui-badge-soft-cyan-border)}:host([data-variant=soft])[data-color=purple]{--cui-badge-accent: var(--cui-badge-soft-purple-stroke);color:var(--cui-badge-soft-purple-label);background:var(--cui-badge-soft-purple-bg);outline:none;border:1px solid var(--cui-badge-soft-purple-border)}:host([data-variant=soft])[data-color=terra]{--cui-badge-accent: var(--cui-badge-soft-terra-stroke);color:var(--cui-badge-soft-terra-label);background:var(--cui-badge-soft-terra-bg);outline:none;border:1px solid var(--cui-badge-soft-terra-border)}:host([data-variant=fill])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-base-0);background:var(--cui-badge-red-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-base-0);background:var(--cui-badge-yellow-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-base-0);background:var(--cui-badge-blue-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-base-0);background:var(--cui-badge-gray-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-badge-dark-gray-label-inverse);background:var(--cui-badge-dark-gray-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-base-0);background:var(--cui-badge-lavender-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-base-0);background:var(--cui-badge-magenta-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-base-0);background:var(--cui-badge-orange-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-base-0);background:var(--cui-badge-violet-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-base-0);background:var(--cui-badge-light-green-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-base-0);background:var(--cui-badge-cyan-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-base-0);background:var(--cui-badge-purple-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=fill])[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-base-0);background:var(--cui-badge-terra-bg-bold);outline:none;border:1px solid transparent}:host([data-variant=outline])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-green-border-bold)}:host([data-variant=outline])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-red-border-bold)}:host([data-variant=outline])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-yellow-border-bold)}:host([data-variant=outline])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-blue-border-bold)}:host([data-variant=outline])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-blue-border-bold)}:host([data-variant=outline])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-gray-border-bold)}:host([data-variant=outline])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-500);color:var(--cui-badge-dark-gray-label);background:transparent;outline:none;border:1px solid var(--cui-badge-dark-gray-border-bold)}:host([data-variant=outline])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-lavender-border-bold)}:host([data-variant=outline])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-magenta-border-bold)}:host([data-variant=outline])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-orange-border-bold)}:host([data-variant=outline])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-violet-border-bold)}:host([data-variant=outline])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-light-green-border-bold)}:host([data-variant=outline])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-badge-cyan-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-cyan-border-bold)}:host([data-variant=outline])[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-badge-purple-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-purple-border-bold)}:host([data-variant=outline])[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-badge-terra-label-inverse);background:transparent;outline:none;border:1px solid var(--cui-badge-terra-border-bold)}:host([data-variant=emphasis])[data-color=green]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-light]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=green-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=success-solid]{--cui-badge-accent: var(--cui-badge-green-stroke);color:var(--cui-badge-green-label-inverse);background:var(--cui-badge-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-green-border-subtle)}:host([data-variant=emphasis])[data-color=red]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-light]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=red-solid]{--cui-badge-accent: var(--cui-badge-red-stroke);color:var(--cui-badge-red-label-inverse);background:var(--cui-badge-red-bg-subtle);outline:none;border:1px solid var(--cui-badge-red-border-subtle)}:host([data-variant=emphasis])[data-color=yellow]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-light]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=yellow-solid]{--cui-badge-accent: var(--cui-badge-yellow-stroke);color:var(--cui-badge-yellow-label-inverse);background:var(--cui-badge-yellow-bg-subtle);outline:none;border:1px solid var(--cui-badge-yellow-border-subtle)}:host([data-variant=emphasis])[data-color=light-blue]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue-light]{--cui-badge-accent: var(--cui-badge-light-blue-stroke);color:var(--cui-badge-light-blue-label-inverse);background:var(--cui-badge-light-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-blue-border-subtle)}:host([data-variant=emphasis])[data-color=blue]{--cui-badge-accent: var(--cui-badge-blue-stroke);color:var(--cui-badge-blue-label-inverse);background:var(--cui-badge-blue-bg-subtle);outline:none;border:1px solid var(--cui-badge-blue-border-subtle)}:host([data-variant=emphasis])[data-color=gray]{--cui-badge-accent: var(--cui-badge-gray-stroke);color:var(--cui-badge-gray-label-inverse);background:var(--cui-badge-gray-bg-subtle);outline:none;border:1px solid var(--cui-badge-gray-border-subtle)}:host([data-variant=emphasis])[data-color=dark-gray]{--cui-badge-accent: var(--cui-base-400);color:var(--cui-badge-dark-gray-label);background:var(--cui-badge-dark-gray-bg-subtle);outline:none;border:1px solid var(--cui-badge-dark-gray-border-subtle)}:host([data-variant=emphasis])[data-color=lavender]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=lavender-light]{--cui-badge-accent: var(--cui-badge-lavender-stroke);color:var(--cui-badge-lavender-label-inverse);background:var(--cui-badge-lavender-bg-subtle);outline:none;border:1px solid var(--cui-badge-lavender-border-subtle)}:host([data-variant=emphasis])[data-color=magenta]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=magenta-light]{--cui-badge-accent: var(--cui-badge-magenta-stroke);color:var(--cui-badge-magenta-label-inverse);background:var(--cui-badge-magenta-bg-subtle);outline:none;border:1px solid var(--cui-badge-magenta-border-subtle)}:host([data-variant=emphasis])[data-color=orange]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-light]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=orange-solid]{--cui-badge-accent: var(--cui-badge-orange-stroke);color:var(--cui-badge-orange-label-inverse);background:var(--cui-badge-orange-bg-subtle);outline:none;border:1px solid var(--cui-badge-orange-border-subtle)}:host([data-variant=emphasis])[data-color=violet]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-light]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=violet-solid]{--cui-badge-accent: var(--cui-badge-violet-stroke);color:var(--cui-badge-violet-label-inverse);background:var(--cui-badge-violet-bg-subtle);outline:none;border:1px solid var(--cui-badge-violet-border-subtle)}:host([data-variant=emphasis])[data-color=light-green]{--cui-badge-accent: var(--cui-badge-light-green-stroke);color:var(--cui-badge-light-green-label-inverse);background:var(--cui-badge-light-green-bg-subtle);outline:none;border:1px solid var(--cui-badge-light-green-border-subtle)}:host([data-variant=emphasis])[data-color=cyan]{--cui-badge-accent: var(--cui-badge-cyan-stroke);color:var(--cui-badge-cyan-label-inverse);background:var(--cui-badge-cyan-bg-subtle);outline:none;border:1px solid var(--cui-badge-cyan-border-subtle)}:host([data-variant=emphasis])[data-color=purple]{--cui-badge-accent: var(--cui-badge-purple-stroke);color:var(--cui-badge-purple-label-inverse);background:var(--cui-badge-purple-bg-subtle);outline:none;border:1px solid var(--cui-badge-purple-border-subtle)}:host([data-variant=emphasis])[data-color=terra]{--cui-badge-accent: var(--cui-badge-terra-stroke);color:var(--cui-badge-terra-label-inverse);background:var(--cui-badge-terra-bg-subtle);outline:none;border:1px solid var(--cui-badge-terra-border-subtle)}\n"] }]
|
|
2489
2489
|
}], propDecorators: { color: [{
|
|
2490
2490
|
type: Input
|
|
2491
2491
|
}, {
|
|
@@ -2887,11 +2887,11 @@ class CuiDateRangeCalendarComponent {
|
|
|
2887
2887
|
date1.getDate() === date2.getDate());
|
|
2888
2888
|
}
|
|
2889
2889
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2890
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiDateRangeCalendarComponent, isStandalone: true, selector: "cui-date-range-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, startDate: { classPropertyName: "startDate", publicName: "startDate", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeSelected: "rangeSelected", dateSelected: "dateSelected", cancelled: "cancelled" }, ngImport: i0, template: "<div class=\"cui-calendar\">\n <div class=\"cui-calendar__header\">\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToPrevMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronLeft\" />\n </button>\n <span class=\"cui-calendar__month-name\">{{ currentMonthName() }}</span>\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToNextMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronRight\" />\n </button>\n </div>\n\n <div class=\"cui-calendar__weekdays\">\n @for (day of weekDays; track day) {\n <div class=\"cui-calendar__weekday\">{{ day }}</div>\n }\n </div>\n\n <div class=\"cui-calendar__days\">\n @for (day of calendarDays(); track day.date.getTime()) {\n <button\n type=\"button\"\n class=\"cui-calendar__day\"\n [class.cui-calendar__day--other-month]=\"!day.isCurrentMonth\"\n [class.cui-calendar__day--selected]=\"isSelected(day.date)\"\n [class.cui-calendar__day--in-range]=\"isInRange(day.date)\"\n [class.cui-calendar__day--range-start]=\"isRangeStart(day.date)\"\n [class.cui-calendar__day--range-end]=\"isRangeEnd(day.date)\"\n [class.cui-calendar__day--today]=\"isToday(day.date)\"\n (click)=\"selectDate(day.date)\"\n >\n {{ day.date.getDate() }}\n </button>\n }\n </div>\n\n <div class=\"cui-calendar__footer\">\n <button\n type=\"button\"\n cuiButton\n appearance=\"secondary\"\n (click)=\"cancel()\"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n cuiButton\n appearance=\"action\"\n [disabled]=\"!hasSelection()\"\n (click)=\"apply()\"\n >\n Apply\n </button>\n </div>\n</div>\n", styles: [".cui-calendar{display:flex;flex-direction:column;padding:12px;min-width:280px}.cui-calendar__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cui-calendar__nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:
|
|
2890
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiDateRangeCalendarComponent, isStandalone: true, selector: "cui-date-range-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, startDate: { classPropertyName: "startDate", publicName: "startDate", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeSelected: "rangeSelected", dateSelected: "dateSelected", cancelled: "cancelled" }, ngImport: i0, template: "<div class=\"cui-calendar\">\n <div class=\"cui-calendar__header\">\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToPrevMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronLeft\" />\n </button>\n <span class=\"cui-calendar__month-name\">{{ currentMonthName() }}</span>\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToNextMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronRight\" />\n </button>\n </div>\n\n <div class=\"cui-calendar__weekdays\">\n @for (day of weekDays; track day) {\n <div class=\"cui-calendar__weekday\">{{ day }}</div>\n }\n </div>\n\n <div class=\"cui-calendar__days\">\n @for (day of calendarDays(); track day.date.getTime()) {\n <button\n type=\"button\"\n class=\"cui-calendar__day\"\n [class.cui-calendar__day--other-month]=\"!day.isCurrentMonth\"\n [class.cui-calendar__day--selected]=\"isSelected(day.date)\"\n [class.cui-calendar__day--in-range]=\"isInRange(day.date)\"\n [class.cui-calendar__day--range-start]=\"isRangeStart(day.date)\"\n [class.cui-calendar__day--range-end]=\"isRangeEnd(day.date)\"\n [class.cui-calendar__day--today]=\"isToday(day.date)\"\n (click)=\"selectDate(day.date)\"\n >\n {{ day.date.getDate() }}\n </button>\n }\n </div>\n\n <div class=\"cui-calendar__footer\">\n <button\n type=\"button\"\n cuiButton\n appearance=\"secondary\"\n (click)=\"cancel()\"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n cuiButton\n appearance=\"action\"\n [disabled]=\"!hasSelection()\"\n (click)=\"apply()\"\n >\n Apply\n </button>\n </div>\n</div>\n", styles: [".cui-calendar{display:flex;flex-direction:column;padding:12px;min-width:280px}.cui-calendar__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cui-calendar__nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:8px;cursor:pointer;transition:background .2s}.cui-calendar__nav-btn:hover{background:var(--cui-base-100)}.cui-calendar__month-name{font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-900)}.cui-calendar__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}.cui-calendar__weekday{font-weight:500;font-size:12px;line-height:14px;display:flex;align-items:center;justify-content:center;height:32px;color:var(--cui-base-500)}.cui-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.cui-calendar__day{font-weight:400;font-size:13px;line-height:16px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:8px;cursor:pointer;transition:background .2s;color:var(--cui-base-900)}.cui-calendar__day:hover{background:var(--cui-base-100)}.cui-calendar__day--other-month{color:var(--cui-base-400)}.cui-calendar__day--today{font-weight:600;border:1px solid var(--cui-base-300)}.cui-calendar__day--selected{background:var(--cui-light-blue-600);color:var(--cui-base-0)}.cui-calendar__day--selected:hover{background:var(--cui-light-blue-700)}.cui-calendar__day--in-range{background:var(--cui-lavender-bg);border-radius:0}.cui-calendar__day--in-range:hover{background:var(--cui-base-200)}.cui-calendar__day--range-start{border-radius:8px 0 0 8px}.cui-calendar__day--range-end{border-radius:0 8px 8px 0}.cui-calendar__day--range-start.cui-calendar__day--range-end{border-radius:8px}.cui-calendar__footer{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--cui-base-200)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2891
2891
|
}
|
|
2892
2892
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDateRangeCalendarComponent, decorators: [{
|
|
2893
2893
|
type: Component,
|
|
2894
|
-
args: [{ selector: 'cui-date-range-calendar', standalone: true, imports: [CuiButtonModule, CuiSvgModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cui-calendar\">\n <div class=\"cui-calendar__header\">\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToPrevMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronLeft\" />\n </button>\n <span class=\"cui-calendar__month-name\">{{ currentMonthName() }}</span>\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToNextMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronRight\" />\n </button>\n </div>\n\n <div class=\"cui-calendar__weekdays\">\n @for (day of weekDays; track day) {\n <div class=\"cui-calendar__weekday\">{{ day }}</div>\n }\n </div>\n\n <div class=\"cui-calendar__days\">\n @for (day of calendarDays(); track day.date.getTime()) {\n <button\n type=\"button\"\n class=\"cui-calendar__day\"\n [class.cui-calendar__day--other-month]=\"!day.isCurrentMonth\"\n [class.cui-calendar__day--selected]=\"isSelected(day.date)\"\n [class.cui-calendar__day--in-range]=\"isInRange(day.date)\"\n [class.cui-calendar__day--range-start]=\"isRangeStart(day.date)\"\n [class.cui-calendar__day--range-end]=\"isRangeEnd(day.date)\"\n [class.cui-calendar__day--today]=\"isToday(day.date)\"\n (click)=\"selectDate(day.date)\"\n >\n {{ day.date.getDate() }}\n </button>\n }\n </div>\n\n <div class=\"cui-calendar__footer\">\n <button\n type=\"button\"\n cuiButton\n appearance=\"secondary\"\n (click)=\"cancel()\"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n cuiButton\n appearance=\"action\"\n [disabled]=\"!hasSelection()\"\n (click)=\"apply()\"\n >\n Apply\n </button>\n </div>\n</div>\n", styles: [".cui-calendar{display:flex;flex-direction:column;padding:12px;min-width:280px}.cui-calendar__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cui-calendar__nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:
|
|
2894
|
+
args: [{ selector: 'cui-date-range-calendar', standalone: true, imports: [CuiButtonModule, CuiSvgModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"cui-calendar\">\n <div class=\"cui-calendar__header\">\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToPrevMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronLeft\" />\n </button>\n <span class=\"cui-calendar__month-name\">{{ currentMonthName() }}</span>\n <button\n type=\"button\"\n class=\"cui-calendar__nav-btn\"\n (click)=\"goToNextMonth()\"\n >\n <cui-svg icon=\"cuiIconChevronRight\" />\n </button>\n </div>\n\n <div class=\"cui-calendar__weekdays\">\n @for (day of weekDays; track day) {\n <div class=\"cui-calendar__weekday\">{{ day }}</div>\n }\n </div>\n\n <div class=\"cui-calendar__days\">\n @for (day of calendarDays(); track day.date.getTime()) {\n <button\n type=\"button\"\n class=\"cui-calendar__day\"\n [class.cui-calendar__day--other-month]=\"!day.isCurrentMonth\"\n [class.cui-calendar__day--selected]=\"isSelected(day.date)\"\n [class.cui-calendar__day--in-range]=\"isInRange(day.date)\"\n [class.cui-calendar__day--range-start]=\"isRangeStart(day.date)\"\n [class.cui-calendar__day--range-end]=\"isRangeEnd(day.date)\"\n [class.cui-calendar__day--today]=\"isToday(day.date)\"\n (click)=\"selectDate(day.date)\"\n >\n {{ day.date.getDate() }}\n </button>\n }\n </div>\n\n <div class=\"cui-calendar__footer\">\n <button\n type=\"button\"\n cuiButton\n appearance=\"secondary\"\n (click)=\"cancel()\"\n >\n Cancel\n </button>\n <button\n type=\"button\"\n cuiButton\n appearance=\"action\"\n [disabled]=\"!hasSelection()\"\n (click)=\"apply()\"\n >\n Apply\n </button>\n </div>\n</div>\n", styles: [".cui-calendar{display:flex;flex-direction:column;padding:12px;min-width:280px}.cui-calendar__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.cui-calendar__nav-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:8px;cursor:pointer;transition:background .2s}.cui-calendar__nav-btn:hover{background:var(--cui-base-100)}.cui-calendar__month-name{font-weight:500;font-size:14px;line-height:20px;color:var(--cui-base-900)}.cui-calendar__weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}.cui-calendar__weekday{font-weight:500;font-size:12px;line-height:14px;display:flex;align-items:center;justify-content:center;height:32px;color:var(--cui-base-500)}.cui-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.cui-calendar__day{font-weight:400;font-size:13px;line-height:16px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:8px;cursor:pointer;transition:background .2s;color:var(--cui-base-900)}.cui-calendar__day:hover{background:var(--cui-base-100)}.cui-calendar__day--other-month{color:var(--cui-base-400)}.cui-calendar__day--today{font-weight:600;border:1px solid var(--cui-base-300)}.cui-calendar__day--selected{background:var(--cui-light-blue-600);color:var(--cui-base-0)}.cui-calendar__day--selected:hover{background:var(--cui-light-blue-700)}.cui-calendar__day--in-range{background:var(--cui-lavender-bg);border-radius:0}.cui-calendar__day--in-range:hover{background:var(--cui-base-200)}.cui-calendar__day--range-start{border-radius:8px 0 0 8px}.cui-calendar__day--range-end{border-radius:0 8px 8px 0}.cui-calendar__day--range-start.cui-calendar__day--range-end{border-radius:8px}.cui-calendar__footer{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;padding-top:12px;border-top:1px solid var(--cui-base-200)}\n"] }]
|
|
2895
2895
|
}], ctorParameters: () => [] });
|
|
2896
2896
|
|
|
2897
2897
|
class CuiDateRangeCalendarModule {
|
|
@@ -3025,11 +3025,11 @@ class CuiDialogComponent {
|
|
|
3025
3025
|
}
|
|
3026
3026
|
}
|
|
3027
3027
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3028
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiDialogComponent, selector: "cui-dialog", host: { listeners: { "document:keydown.escape": "onEscape($event)" }, properties: { "attr.data-size": "this.size" } }, hostDirectives: [{ directive: i1$1.CuiFocusTrapDirective }], ngImport: i0, template: "<ng-container [ngSwitch]=\"contentType\">\n <ng-container *ngSwitchCase=\"ContentType.String\">\n {{ context.content }}\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Template\">\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Component\">\n <div class=\"c-component-container\">\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\n </div>\n </ng-container>\n</ng-container>\n", styles: [":host{box-shadow:0 2px 4px -1px
|
|
3028
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiDialogComponent, selector: "cui-dialog", host: { listeners: { "document:keydown.escape": "onEscape($event)" }, properties: { "attr.data-size": "this.size" } }, hostDirectives: [{ directive: i1$1.CuiFocusTrapDirective }], ngImport: i0, template: "<ng-container [ngSwitch]=\"contentType\">\n <ng-container *ngSwitchCase=\"ContentType.String\">\n {{ context.content }}\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Template\">\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Component\">\n <div class=\"c-component-container\">\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\n </div>\n </ng-container>\n</ng-container>\n", styles: [":host{box-shadow:0 2px 4px -1px color-mix(in srgb,var(--cui-base-200) 60%,transparent),0 4px 6px -1px color-mix(in srgb,var(--cui-base-200) 40%,transparent);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;box-sizing:border-box;max-height:calc(100vh - 40px);width:100%;border-radius:12px;outline:none;background:var(--cui-base-0);font-family:var(--cui-main-font);border:1px solid var(--cui-base-200)}:host:last-of-type{z-index:1}:host[data-size=auto]{width:auto}:host[data-size=sm]{max-width:620px}:host[data-size=xl]{max-width:1080px}:host[data-size=full]{border-radius:0;max-height:none;max-width:none;width:100%;height:100%}.c-component-container{display:contents}.c-component-container ::ng-deep>*{display:contents}\n"], dependencies: [{ kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3029
3029
|
}
|
|
3030
3030
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDialogComponent, decorators: [{
|
|
3031
3031
|
type: Component,
|
|
3032
|
-
args: [{ selector: 'cui-dialog', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiFocusTrapDirective], template: "<ng-container [ngSwitch]=\"contentType\">\n <ng-container *ngSwitchCase=\"ContentType.String\">\n {{ context.content }}\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Template\">\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Component\">\n <div class=\"c-component-container\">\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\n </div>\n </ng-container>\n</ng-container>\n", styles: [":host{box-shadow:0 2px 4px -1px
|
|
3032
|
+
args: [{ selector: 'cui-dialog', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiFocusTrapDirective], template: "<ng-container [ngSwitch]=\"contentType\">\n <ng-container *ngSwitchCase=\"ContentType.String\">\n {{ context.content }}\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Template\">\n <ng-container *ngTemplateOutlet=\"contentTemplateRef; context: context\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"ContentType.Component\">\n <div class=\"c-component-container\">\n <ng-container *ngComponentOutlet=\"componentType\"></ng-container>\n </div>\n </ng-container>\n</ng-container>\n", styles: [":host{box-shadow:0 2px 4px -1px color-mix(in srgb,var(--cui-base-200) 60%,transparent),0 4px 6px -1px color-mix(in srgb,var(--cui-base-200) 40%,transparent);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;box-sizing:border-box;max-height:calc(100vh - 40px);width:100%;border-radius:12px;outline:none;background:var(--cui-base-0);font-family:var(--cui-main-font);border:1px solid var(--cui-base-200)}:host:last-of-type{z-index:1}:host[data-size=auto]{width:auto}:host[data-size=sm]{max-width:620px}:host[data-size=xl]{max-width:1080px}:host[data-size=full]{border-radius:0;max-height:none;max-width:none;width:100%;height:100%}.c-component-container{display:contents}.c-component-container ::ng-deep>*{display:contents}\n"] }]
|
|
3033
3033
|
}], propDecorators: { size: [{
|
|
3034
3034
|
type: HostBinding,
|
|
3035
3035
|
args: ['attr.data-size']
|
|
@@ -3216,7 +3216,7 @@ class CuiContextMenuComponent {
|
|
|
3216
3216
|
this.viewContainerRef.clear();
|
|
3217
3217
|
}
|
|
3218
3218
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3219
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiContextMenuComponent, selector: "cui-context-menu[items][target]", inputs: { items: "items", target: "target", width: "width", withPaddings: "withPaddings" }, host: { listeners: { "window:resize": "onClose()", "click": "onStopClickPropagation($event)" } }, providers: [CuiDestroyService], viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }, { directive: i1$1.CuiTargetDirective, inputs: ["ccTarget", "target"] }], ngImport: i0, template: "<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n\n<ng-template #list>\n <div\n class=\"c-container\"\n [style.width]=\"width\"\n >\n <ul\n class=\"c-ul\"\n [class.c-ul_with-padding]=\"withPaddings\"\n >\n <li\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [style.color]=\"item.color\"\n >\n <button\n type=\"button\"\n class=\"c-button\"\n (click)=\"onSelect(item)\"\n >\n <cui-svg\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.color\"\n ></cui-svg>\n <span>{{ item.label }}</span>\n </button>\n </li>\n </ul>\n </div>\n</ng-template>\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-backdrop{position:fixed;inset:0}.c-ul{padding:0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px
|
|
3219
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiContextMenuComponent, selector: "cui-context-menu[items][target]", inputs: { items: "items", target: "target", width: "width", withPaddings: "withPaddings" }, host: { listeners: { "window:resize": "onClose()", "click": "onStopClickPropagation($event)" } }, providers: [CuiDestroyService], viewQueries: [{ propertyName: "list", first: true, predicate: ["list"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }, { directive: i1$1.CuiTargetDirective, inputs: ["ccTarget", "target"] }], ngImport: i0, template: "<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n\n<ng-template #list>\n <div\n class=\"c-container\"\n [style.width]=\"width\"\n >\n <ul\n class=\"c-ul\"\n [class.c-ul_with-padding]=\"withPaddings\"\n >\n <li\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [style.color]=\"item.color\"\n >\n <button\n type=\"button\"\n class=\"c-button\"\n (click)=\"onSelect(item)\"\n >\n <cui-svg\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.color\"\n ></cui-svg>\n <span>{{ item.label }}</span>\n </button>\n </li>\n </ul>\n </div>\n</ng-template>\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-backdrop{position:fixed;inset:0}.c-ul{padding:0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);border:1px solid var(--cui-base-200);border-radius:inherit;width:100%;background:var(--cui-base-0);color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-ul_with-padding{padding-top:7px;padding-bottom:7px}.c-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px}.c-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-button:hover{background:var(--cui-base-50)}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3220
3220
|
}
|
|
3221
3221
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiContextMenuComponent, decorators: [{
|
|
3222
3222
|
type: Component,
|
|
@@ -3226,7 +3226,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
3226
3226
|
directive: CuiTargetDirective,
|
|
3227
3227
|
inputs: ['ccTarget: target']
|
|
3228
3228
|
}
|
|
3229
|
-
], template: "<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n\n<ng-template #list>\n <div\n class=\"c-container\"\n [style.width]=\"width\"\n >\n <ul\n class=\"c-ul\"\n [class.c-ul_with-padding]=\"withPaddings\"\n >\n <li\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [style.color]=\"item.color\"\n >\n <button\n type=\"button\"\n class=\"c-button\"\n (click)=\"onSelect(item)\"\n >\n <cui-svg\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.color\"\n ></cui-svg>\n <span>{{ item.label }}</span>\n </button>\n </li>\n </ul>\n </div>\n</ng-template>\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-backdrop{position:fixed;inset:0}.c-ul{padding:0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px
|
|
3229
|
+
], template: "<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n\n<ng-template #list>\n <div\n class=\"c-container\"\n [style.width]=\"width\"\n >\n <ul\n class=\"c-ul\"\n [class.c-ul_with-padding]=\"withPaddings\"\n >\n <li\n *ngFor=\"let item of items; trackBy: trackByFn\"\n [style.color]=\"item.color\"\n >\n <button\n type=\"button\"\n class=\"c-button\"\n (click)=\"onSelect(item)\"\n >\n <cui-svg\n *ngIf=\"item.icon\"\n [icon]=\"item.icon\"\n [color]=\"item.color\"\n ></cui-svg>\n <span>{{ item.label }}</span>\n </button>\n </li>\n </ul>\n </div>\n</ng-template>\n", styles: [":host{display:none}.c-container{position:fixed;width:268px;border-radius:8px;z-index:1}.c-backdrop{position:fixed;inset:0}.c-ul{padding:0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);border:1px solid var(--cui-base-200);border-radius:inherit;width:100%;background:var(--cui-base-0);color:var(--cui-base-900);font-family:var(--cui-main-font)}.c-ul_with-padding{padding-top:7px;padding-bottom:7px}.c-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px}.c-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-button:hover{background:var(--cui-base-50)}}\n"] }]
|
|
3230
3230
|
}], propDecorators: { items: [{
|
|
3231
3231
|
type: Input
|
|
3232
3232
|
}], target: [{
|
|
@@ -3443,11 +3443,11 @@ class CuiDropdownWrapperComponent {
|
|
|
3443
3443
|
this.maxHeight = '350px';
|
|
3444
3444
|
}
|
|
3445
3445
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDropdownWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3446
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiDropdownWrapperComponent, isStandalone: true, selector: "cui-dropdown-wrapper", inputs: { title: "title", width: "width", maxHeight: "maxHeight" }, hostDirectives: [{ directive: i1$1.CuiFocusTrapDirective }], ngImport: i0, template: "<div\r\n [style.width]=\"width\"\r\n [style.max-height]=\"maxHeight\"\r\n class=\"dropdown\"\r\n>\r\n <header\r\n *ngIf=\"title\"\r\n class=\"header\"\r\n >\r\n <h3 class=\"title\">{{ title }}</h3>\r\n <ng-content select=\"[ccDropdownHeaderContent]\" />\r\n </header>\r\n\r\n <div class=\"scrollable-content\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"footer\">\r\n <ng-content select=\"[ccDropdownFooterContent]\" />\r\n </footer>\r\n</div>\r\n", styles: [".dropdown{box-shadow:0 1px 4px
|
|
3446
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiDropdownWrapperComponent, isStandalone: true, selector: "cui-dropdown-wrapper", inputs: { title: "title", width: "width", maxHeight: "maxHeight" }, hostDirectives: [{ directive: i1$1.CuiFocusTrapDirective }], ngImport: i0, template: "<div\r\n [style.width]=\"width\"\r\n [style.max-height]=\"maxHeight\"\r\n class=\"dropdown\"\r\n>\r\n <header\r\n *ngIf=\"title\"\r\n class=\"header\"\r\n >\r\n <h3 class=\"title\">{{ title }}</h3>\r\n <ng-content select=\"[ccDropdownHeaderContent]\" />\r\n </header>\r\n\r\n <div class=\"scrollable-content\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"footer\">\r\n <ng-content select=\"[ccDropdownFooterContent]\" />\r\n </footer>\r\n</div>\r\n", styles: [".dropdown{box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);padding-top:3px;padding-bottom:3px;display:flex;flex-direction:column;gap:0;border-radius:8px;border:1px solid var(--cui-base-200);height:100%;width:345px;background:var(--cui-base-0)}.header{padding-right:5px;padding-left:5px;display:flex;flex-direction:column;gap:0;align-items:stretch;justify-content:center}.title{font-weight:400;font-size:14px;line-height:20px;padding:4px 8px;color:var(--cui-base-500);text-transform:uppercase}.scrollable-content{overflow:auto}.footer{padding:2px 5px}.footer:empty{display:contents}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3447
3447
|
}
|
|
3448
3448
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDropdownWrapperComponent, decorators: [{
|
|
3449
3449
|
type: Component,
|
|
3450
|
-
args: [{ selector: 'cui-dropdown-wrapper', standalone: true, imports: [NgIf], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiFocusTrapDirective], template: "<div\r\n [style.width]=\"width\"\r\n [style.max-height]=\"maxHeight\"\r\n class=\"dropdown\"\r\n>\r\n <header\r\n *ngIf=\"title\"\r\n class=\"header\"\r\n >\r\n <h3 class=\"title\">{{ title }}</h3>\r\n <ng-content select=\"[ccDropdownHeaderContent]\" />\r\n </header>\r\n\r\n <div class=\"scrollable-content\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"footer\">\r\n <ng-content select=\"[ccDropdownFooterContent]\" />\r\n </footer>\r\n</div>\r\n", styles: [".dropdown{box-shadow:0 1px 4px
|
|
3450
|
+
args: [{ selector: 'cui-dropdown-wrapper', standalone: true, imports: [NgIf], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiFocusTrapDirective], template: "<div\r\n [style.width]=\"width\"\r\n [style.max-height]=\"maxHeight\"\r\n class=\"dropdown\"\r\n>\r\n <header\r\n *ngIf=\"title\"\r\n class=\"header\"\r\n >\r\n <h3 class=\"title\">{{ title }}</h3>\r\n <ng-content select=\"[ccDropdownHeaderContent]\" />\r\n </header>\r\n\r\n <div class=\"scrollable-content\">\r\n <ng-content />\r\n </div>\r\n <footer class=\"footer\">\r\n <ng-content select=\"[ccDropdownFooterContent]\" />\r\n </footer>\r\n</div>\r\n", styles: [".dropdown{box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);padding-top:3px;padding-bottom:3px;display:flex;flex-direction:column;gap:0;border-radius:8px;border:1px solid var(--cui-base-200);height:100%;width:345px;background:var(--cui-base-0)}.header{padding-right:5px;padding-left:5px;display:flex;flex-direction:column;gap:0;align-items:stretch;justify-content:center}.title{font-weight:400;font-size:14px;line-height:20px;padding:4px 8px;color:var(--cui-base-500);text-transform:uppercase}.scrollable-content{overflow:auto}.footer{padding:2px 5px}.footer:empty{display:contents}\n"] }]
|
|
3451
3451
|
}], propDecorators: { title: [{
|
|
3452
3452
|
type: Input
|
|
3453
3453
|
}], width: [{
|
|
@@ -3620,11 +3620,11 @@ class CuiInputNumberComponent {
|
|
|
3620
3620
|
});
|
|
3621
3621
|
}
|
|
3622
3622
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3623
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3623
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: { precision: "precision", min: "min", max: "max" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3624
3624
|
}
|
|
3625
3625
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputNumberComponent, decorators: [{
|
|
3626
3626
|
type: Component,
|
|
3627
|
-
args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3627
|
+
args: [{ selector: 'cui-input-number', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputNumberComponent, true)], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
|
|
3628
3628
|
}], propDecorators: { precision: [{
|
|
3629
3629
|
type: Input
|
|
3630
3630
|
}], min: [{
|
|
@@ -3694,13 +3694,13 @@ class CuiGhostInputComponent {
|
|
|
3694
3694
|
this.isError = input(false, { transform: booleanAttribute });
|
|
3695
3695
|
}
|
|
3696
3696
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiGhostInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3697
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiGhostInputComponent, isStandalone: true, selector: "input [cuiGhostInput]", inputs: { isError: { classPropertyName: "isError", publicName: "isError", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class._with-error": "isError()" } }, ngImport: i0, template: '', isInline: true, styles: [":host{padding-right:3px;padding-left:3px;width:100%;border:1px solid transparent;border-radius:8px;outline:none;background:none}:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{opacity:.5}:host::placeholder{color:var(--cui-base-400)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-visible{box-shadow:0 0 0 2px
|
|
3697
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: CuiGhostInputComponent, isStandalone: true, selector: "input [cuiGhostInput]", inputs: { isError: { classPropertyName: "isError", publicName: "isError", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class._with-error": "isError()" } }, ngImport: i0, template: '', isInline: true, styles: [":host{padding-right:3px;padding-left:3px;width:100%;border:1px solid transparent;border-radius:8px;outline:none;background:none}:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{opacity:.5}:host::placeholder{color:var(--cui-base-400)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3698
3698
|
}
|
|
3699
3699
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiGhostInputComponent, decorators: [{
|
|
3700
3700
|
type: Component,
|
|
3701
3701
|
args: [{ selector: 'input [cuiGhostInput]', standalone: true, template: '', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
3702
3702
|
'[class._with-error]': 'isError()'
|
|
3703
|
-
}, styles: [":host{padding-right:3px;padding-left:3px;width:100%;border:1px solid transparent;border-radius:8px;outline:none;background:none}:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{opacity:.5}:host::placeholder{color:var(--cui-base-400)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-visible{box-shadow:0 0 0 2px
|
|
3703
|
+
}, styles: [":host{padding-right:3px;padding-left:3px;width:100%;border:1px solid transparent;border-radius:8px;outline:none;background:none}:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{opacity:.5}:host::placeholder{color:var(--cui-base-400)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}\n"] }]
|
|
3704
3704
|
}] });
|
|
3705
3705
|
|
|
3706
3706
|
class CuiInputPasswordComponent {
|
|
@@ -3762,11 +3762,11 @@ class CuiInputPasswordComponent {
|
|
|
3762
3762
|
this.isPasswordHidden = !this.isPasswordHidden;
|
|
3763
3763
|
}
|
|
3764
3764
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3765
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputPasswordComponent, selector: "cui-input-password", host: { properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n [type]=\"type\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n *ngIf=\"isToggleButtonShown\"\n [title]=\"buttonTitle\"\n class=\"c-button\"\n (click)=\"onTogglePasswordVisibility()\"\n>\n <cui-svg\n [icon]=\"icon\"\n [width]=\"16\"\n [height]=\"16\"\n color=\"var(--cui-base-500)\"\n ></cui-svg>\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3765
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputPasswordComponent, selector: "cui-input-password", host: { properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n [type]=\"type\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n *ngIf=\"isToggleButtonShown\"\n [title]=\"buttonTitle\"\n class=\"c-button\"\n (click)=\"onTogglePasswordVisibility()\"\n>\n <cui-svg\n [icon]=\"icon\"\n [width]=\"16\"\n [height]=\"16\"\n color=\"var(--cui-base-500)\"\n ></cui-svg>\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3766
3766
|
}
|
|
3767
3767
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputPasswordComponent, decorators: [{
|
|
3768
3768
|
type: Component,
|
|
3769
|
-
args: [{ selector: 'cui-input-password', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n [type]=\"type\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n *ngIf=\"isToggleButtonShown\"\n [title]=\"buttonTitle\"\n class=\"c-button\"\n (click)=\"onTogglePasswordVisibility()\"\n>\n <cui-svg\n [icon]=\"icon\"\n [width]=\"16\"\n [height]=\"16\"\n color=\"var(--cui-base-500)\"\n ></cui-svg>\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3769
|
+
args: [{ selector: 'cui-input-password', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputPasswordComponent, true)], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n [type]=\"type\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n *ngIf=\"isToggleButtonShown\"\n [title]=\"buttonTitle\"\n class=\"c-button\"\n (click)=\"onTogglePasswordVisibility()\"\n>\n <cui-svg\n [icon]=\"icon\"\n [width]=\"16\"\n [height]=\"16\"\n color=\"var(--cui-base-500)\"\n ></cui-svg>\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-input::-ms-reveal{display:none}.c-input[type=password]{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}\n"] }]
|
|
3770
3770
|
}], propDecorators: { isDisabled: [{
|
|
3771
3771
|
type: HostBinding,
|
|
3772
3772
|
args: ['class._disabled']
|
|
@@ -3845,11 +3845,11 @@ class CuiInputTextComponent {
|
|
|
3845
3845
|
this.onChange(value);
|
|
3846
3846
|
}
|
|
3847
3847
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3848
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTextComponent, selector: "cui-input-text", host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n type=\"button\"\n class=\"c-button\"\n [class.c-button_hidden]=\"isClearButtonHidden\"\n (click)=\"onClear()\"\n>\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"c-close-icon\"\n />\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3848
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTextComponent, selector: "cui-input-text", host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n type=\"button\"\n class=\"c-button\"\n [class.c-button_hidden]=\"isClearButtonHidden\"\n (click)=\"onClear()\"\n>\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"c-close-icon\"\n />\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3849
3849
|
}
|
|
3850
3850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTextComponent, decorators: [{
|
|
3851
3851
|
type: Component,
|
|
3852
|
-
args: [{ selector: 'cui-input-text', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n type=\"button\"\n class=\"c-button\"\n [class.c-button_hidden]=\"isClearButtonHidden\"\n (click)=\"onClear()\"\n>\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"c-close-icon\"\n />\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3852
|
+
args: [{ selector: 'cui-input-text', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTextComponent, true)], template: "<cui-svg\n *ngIf=\"iconLeft\"\n [icon]=\"iconLeft\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"value\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n<button\n type=\"button\"\n class=\"c-button\"\n [class.c-button_hidden]=\"isClearButtonHidden\"\n (click)=\"onClear()\"\n>\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"c-close-icon\"\n />\n</button>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}.c-close-icon ::ng-deep path{stroke:var(--cui-base-0)!important}.c-button_hidden{visibility:hidden}\n"] }]
|
|
3853
3853
|
}], propDecorators: { isDisabled: [{
|
|
3854
3854
|
type: HostBinding,
|
|
3855
3855
|
args: ['class._disabled']
|
|
@@ -3947,11 +3947,11 @@ class CuiInputTimeComponent {
|
|
|
3947
3947
|
return maskitoTimeOptionsGenerator({ mode });
|
|
3948
3948
|
}
|
|
3949
3949
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3950
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n icon=\"cuiIconClock\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"computedValue\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3950
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiInputTimeComponent, selector: "cui-input-time", inputs: { mode: "mode" }, host: { listeners: { "click": "onFocus()" }, properties: { "class._disabled": "this.isDisabled", "attr.data-size": "this.size", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<cui-svg\n icon=\"cuiIconClock\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"computedValue\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"], dependencies: [{ kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3951
3951
|
}
|
|
3952
3952
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiInputTimeComponent, decorators: [{
|
|
3953
3953
|
type: Component,
|
|
3954
|
-
args: [{ selector: 'cui-input-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)], template: "<cui-svg\n icon=\"cuiIconClock\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"computedValue\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px
|
|
3954
|
+
args: [{ selector: 'cui-input-time', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER, cuiProvide(NG_VALUE_ACCESSOR, CuiInputTimeComponent, true)], template: "<cui-svg\n icon=\"cuiIconClock\"\n color=\"var(--cui-base-500)\"\n></cui-svg>\n<input\n #input\n [ngModel]=\"computedValue\"\n [attr.id]=\"id\"\n [attr.placeholder]=\"placeholder\"\n type=\"text\"\n [maskito]=\"maskOptions\"\n [disabled]=\"isDisabled\"\n class=\"c-input\"\n (input)=\"onInput($event)\"\n (focus)=\"onTouched()\"\n/>\n", styles: [":host{--cui-input-autofill-bg: var(--cui-input);--cui-input-autofill-color: var(--cui-base-900);padding-right:13px;padding-left:13px;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;cursor:text;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:hover{border-color:var(--cui-base-300)}:host:focus-within{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host[data-size=sm]{padding-top:7px;padding-bottom:7px}:host[data-size=md]{padding-top:8px;padding-bottom:8px}:host._disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}.c-input{padding:0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;background:none;color:inherit;font:inherit;line-height:inherit;width:100%}.c-input:-webkit-autofill,.c-input:-webkit-autofill:hover,.c-input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}.c-input:disabled{cursor:not-allowed}.c-input::placeholder{color:var(--cui-base-400)}.c-button{padding:0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;display:flex}\n"] }]
|
|
3955
3955
|
}], propDecorators: { mode: [{
|
|
3956
3956
|
type: Input
|
|
3957
3957
|
}], isDisabled: [{
|
|
@@ -4029,11 +4029,11 @@ class CuiLetterBoxComponent {
|
|
|
4029
4029
|
return this.shape;
|
|
4030
4030
|
}
|
|
4031
4031
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiLetterBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4032
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiLetterBoxComponent, isStandalone: true, selector: "cui-letter-box", inputs: { letter: "letter", backgroundColor: "backgroundColor", size: "size", shape: "shape" }, host: { properties: { "style.background-color": "this._backgroundColor", "attr.data-size": "this._size", "attr.data-shape": "this._shape" } }, ngImport: i0, template: "{{ letter }}\n", styles: [":host{font-weight:600;flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;border-radius:4px;color:var(--cui-gray-0);text-transform:uppercase}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:4px;padding-left:4px;min-width:18px;height:18px}:host[data-size=md]{font-size:14px;line-height:20px;min-width:24px;height:24px}:host[data-shape=rounded]{padding:0;border-radius:
|
|
4032
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiLetterBoxComponent, isStandalone: true, selector: "cui-letter-box", inputs: { letter: "letter", backgroundColor: "backgroundColor", size: "size", shape: "shape" }, host: { properties: { "style.background-color": "this._backgroundColor", "attr.data-size": "this._size", "attr.data-shape": "this._shape" } }, ngImport: i0, template: "{{ letter }}\n", styles: [":host{font-weight:600;flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;border-radius:4px;color:var(--cui-gray-0);text-transform:uppercase}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:4px;padding-left:4px;min-width:18px;height:18px}:host[data-size=md]{font-size:14px;line-height:20px;min-width:24px;height:24px}:host[data-shape=rounded]{padding:0;border-radius:50px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4033
4033
|
}
|
|
4034
4034
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiLetterBoxComponent, decorators: [{
|
|
4035
4035
|
type: Component,
|
|
4036
|
-
args: [{ selector: 'cui-letter-box', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "{{ letter }}\n", styles: [":host{font-weight:600;flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;border-radius:4px;color:var(--cui-gray-0);text-transform:uppercase}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:4px;padding-left:4px;min-width:18px;height:18px}:host[data-size=md]{font-size:14px;line-height:20px;min-width:24px;height:24px}:host[data-shape=rounded]{padding:0;border-radius:
|
|
4036
|
+
args: [{ selector: 'cui-letter-box', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "{{ letter }}\n", styles: [":host{font-weight:600;flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;border-radius:4px;color:var(--cui-gray-0);text-transform:uppercase}:host[data-size=sm]{font-size:12px;line-height:14px;padding-right:4px;padding-left:4px;min-width:18px;height:18px}:host[data-size=md]{font-size:14px;line-height:20px;min-width:24px;height:24px}:host[data-shape=rounded]{padding:0;border-radius:50px}\n"] }]
|
|
4037
4037
|
}], propDecorators: { letter: [{
|
|
4038
4038
|
type: Input,
|
|
4039
4039
|
args: [{ required: true }]
|
|
@@ -4286,7 +4286,7 @@ class CuiSelectComponent {
|
|
|
4286
4286
|
CUI_TEXT_FILED_CONTROLLER_PROVIDER,
|
|
4287
4287
|
cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
|
|
4288
4288
|
CuiDestroyService
|
|
4289
|
-
], viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }, { propertyName: "getOptionsListHeightContainer", first: true, predicate: ["getOptionsListHeightContainer"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], descendants: true }, { propertyName: "optionsWrapper", first: true, predicate: ["optionsWrapper"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<button\n #button\n type=\"button\"\n [attr.id]=\"id\"\n [attr.data-size]=\"size\"\n [disabled]=\"isDisabled\"\n class=\"c-button\"\n [class.c-button_active]=\"isOpened\"\n [class.c-button_with-error]=\"isError\"\n (click)=\"onSwitch()\"\n>\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\n {{ selectedOption.label }}\n </ng-container>\n <ng-template #placeholderTemplate>\n <span class=\"c-placeholder\">{{ placeholder }}</span>\n </ng-template>\n <cui-svg\n icon=\"cuiIconChevronDown\"\n color=\"var(--cui-base-500)\"\n />\n</button>\n<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n<ng-template #optionsWrapper>\n <div\n cuiFocusTrap\n class=\"c-options__wrapper\"\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n </div>\n</ng-template>\n<div\n #getOptionsListHeightContainer\n class=\"c-get-options-list-height-container\"\n>\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n</div>\n<ng-template #optionsList>\n <ul\n class=\"c-options\"\n [class.c-options_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngIf=\"options.length; else empty\">\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n [class.c-option-button_selected]=\"selectedOption === option\"\n [disabled]=\"option.isDisabled\"\n (click)=\"onSelect($event, option)\"\n >\n <span>{{ option.label }}</span>\n <cui-svg\n *ngIf=\"selectedOption === option\"\n icon=\"cuiIconCheckSm\"\n color=\"var(--cui-info)\"\n class=\"c-option-button__icon\"\n />\n </button>\n </li>\n </ng-container>\n <ng-template #empty>\n <li *ngIf=\"defaultOptionText\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n (click)=\"onClose()\"\n >\n {{ defaultOptionText }}\n </button>\n </li>\n </ng-template>\n </ul>\n</ng-template>\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px
|
|
4289
|
+
], viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }, { propertyName: "getOptionsListHeightContainer", first: true, predicate: ["getOptionsListHeightContainer"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], descendants: true }, { propertyName: "optionsWrapper", first: true, predicate: ["optionsWrapper"], descendants: true }], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<button\n #button\n type=\"button\"\n [attr.id]=\"id\"\n [attr.data-size]=\"size\"\n [disabled]=\"isDisabled\"\n class=\"c-button\"\n [class.c-button_active]=\"isOpened\"\n [class.c-button_with-error]=\"isError\"\n (click)=\"onSwitch()\"\n>\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\n {{ selectedOption.label }}\n </ng-container>\n <ng-template #placeholderTemplate>\n <span class=\"c-placeholder\">{{ placeholder }}</span>\n </ng-template>\n <cui-svg\n icon=\"cuiIconChevronDown\"\n color=\"var(--cui-base-500)\"\n />\n</button>\n<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n<ng-template #optionsWrapper>\n <div\n cuiFocusTrap\n class=\"c-options__wrapper\"\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n </div>\n</ng-template>\n<div\n #getOptionsListHeightContainer\n class=\"c-get-options-list-height-container\"\n>\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n</div>\n<ng-template #optionsList>\n <ul\n class=\"c-options\"\n [class.c-options_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngIf=\"options.length; else empty\">\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n [class.c-option-button_selected]=\"selectedOption === option\"\n [disabled]=\"option.isDisabled\"\n (click)=\"onSelect($event, option)\"\n >\n <span>{{ option.label }}</span>\n <cui-svg\n *ngIf=\"selectedOption === option\"\n icon=\"cuiIconCheckSm\"\n color=\"var(--cui-info)\"\n class=\"c-option-button__icon\"\n />\n </button>\n </li>\n </ng-container>\n <ng-template #empty>\n <li *ngIf=\"defaultOptionText\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n (click)=\"onClose()\"\n >\n {{ defaultOptionText }}\n </button>\n </li>\n </ng-template>\n </ul>\n</ng-template>\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent);border-color:var(--cui-danger)}.c-placeholder{color:var(--cui-base-400)}.c-backdrop{position:fixed;inset:0}.c-options__wrapper{position:absolute;font-family:var(--cui-main-font);z-index:1}.c-get-options-list-height-container{position:fixed;visibility:hidden}.c-options{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);overflow:auto;max-height:180px;border:1px solid var(--cui-base-200);border-radius:8px;background:var(--cui-base-0);color:var(--cui-base-900)}.c-option-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px;text-align:start}.c-option-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-option-button:hover{background:var(--cui-base-50)}}.c-option-button_selected{background:var(--cui-base-50)}.c-option-button:disabled{background:unset;opacity:50%}.c-option-button__icon{margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "directive", type: i1$1.CuiFocusTrapDirective, selector: "[cuiFocusTrap]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4290
4290
|
}
|
|
4291
4291
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiSelectComponent, decorators: [{
|
|
4292
4292
|
type: Component,
|
|
@@ -4294,7 +4294,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
4294
4294
|
CUI_TEXT_FILED_CONTROLLER_PROVIDER,
|
|
4295
4295
|
cuiProvide(NG_VALUE_ACCESSOR, CuiSelectComponent, true),
|
|
4296
4296
|
CuiDestroyService
|
|
4297
|
-
], hostDirectives: [CuiClickOutsideDirective], template: "<button\n #button\n type=\"button\"\n [attr.id]=\"id\"\n [attr.data-size]=\"size\"\n [disabled]=\"isDisabled\"\n class=\"c-button\"\n [class.c-button_active]=\"isOpened\"\n [class.c-button_with-error]=\"isError\"\n (click)=\"onSwitch()\"\n>\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\n {{ selectedOption.label }}\n </ng-container>\n <ng-template #placeholderTemplate>\n <span class=\"c-placeholder\">{{ placeholder }}</span>\n </ng-template>\n <cui-svg\n icon=\"cuiIconChevronDown\"\n color=\"var(--cui-base-500)\"\n />\n</button>\n<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n<ng-template #optionsWrapper>\n <div\n cuiFocusTrap\n class=\"c-options__wrapper\"\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n </div>\n</ng-template>\n<div\n #getOptionsListHeightContainer\n class=\"c-get-options-list-height-container\"\n>\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n</div>\n<ng-template #optionsList>\n <ul\n class=\"c-options\"\n [class.c-options_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngIf=\"options.length; else empty\">\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n [class.c-option-button_selected]=\"selectedOption === option\"\n [disabled]=\"option.isDisabled\"\n (click)=\"onSelect($event, option)\"\n >\n <span>{{ option.label }}</span>\n <cui-svg\n *ngIf=\"selectedOption === option\"\n icon=\"cuiIconCheckSm\"\n color=\"var(--cui-info)\"\n class=\"c-option-button__icon\"\n />\n </button>\n </li>\n </ng-container>\n <ng-template #empty>\n <li *ngIf=\"defaultOptionText\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n (click)=\"onClose()\"\n >\n {{ defaultOptionText }}\n </button>\n </li>\n </ng-template>\n </ul>\n</ng-template>\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px
|
|
4297
|
+
], hostDirectives: [CuiClickOutsideDirective], template: "<button\n #button\n type=\"button\"\n [attr.id]=\"id\"\n [attr.data-size]=\"size\"\n [disabled]=\"isDisabled\"\n class=\"c-button\"\n [class.c-button_active]=\"isOpened\"\n [class.c-button_with-error]=\"isError\"\n (click)=\"onSwitch()\"\n>\n <ng-container *ngIf=\"selectedOption; else placeholderTemplate\">\n {{ selectedOption.label }}\n </ng-container>\n <ng-template #placeholderTemplate>\n <span class=\"c-placeholder\">{{ placeholder }}</span>\n </ng-template>\n <cui-svg\n icon=\"cuiIconChevronDown\"\n color=\"var(--cui-base-500)\"\n />\n</button>\n<ng-template #backdrop>\n <div class=\"c-backdrop\"></div>\n</ng-template>\n<ng-template #optionsWrapper>\n <div\n cuiFocusTrap\n class=\"c-options__wrapper\"\n [class.c-options__wrapper_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n </div>\n</ng-template>\n<div\n #getOptionsListHeightContainer\n class=\"c-get-options-list-height-container\"\n>\n <ng-container *ngTemplateOutlet=\"optionsList\" />\n</div>\n<ng-template #optionsList>\n <ul\n class=\"c-options\"\n [class.c-options_top]=\"isOptionsListAbove\"\n >\n <ng-container *ngIf=\"options.length; else empty\">\n <li *ngFor=\"let option of options; trackBy: trackByFn\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n [class.c-option-button_selected]=\"selectedOption === option\"\n [disabled]=\"option.isDisabled\"\n (click)=\"onSelect($event, option)\"\n >\n <span>{{ option.label }}</span>\n <cui-svg\n *ngIf=\"selectedOption === option\"\n icon=\"cuiIconCheckSm\"\n color=\"var(--cui-info)\"\n class=\"c-option-button__icon\"\n />\n </button>\n </li>\n </ng-container>\n <ng-template #empty>\n <li *ngIf=\"defaultOptionText\">\n <button\n type=\"button\"\n class=\"c-option-button\"\n (click)=\"onClose()\"\n >\n {{ defaultOptionText }}\n </button>\n </li>\n </ng-template>\n </ul>\n</ng-template>\n", styles: [":host{display:block;font-family:var(--cui-main-font);position:relative}.c-button{border:0;flex-shrink:0;outline:none;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:0 13px;font-weight:400;font-size:14px;line-height:20px;display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;cursor:pointer;background:var(--cui-input);color:var(--cui-base-900);font-family:var(--cui-main-font);text-align:start}.c-button:hover{border-color:var(--cui-base-300)}.c-button_active.c-button_active,.c-button:focus{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.c-button:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}.c-button[data-size=sm]{padding-top:7px;padding-bottom:7px}.c-button[data-size=md]{padding-top:8px;padding-bottom:8px}.c-button_with-error{border-color:var(--cui-danger)}.c-button_with-error:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent);border-color:var(--cui-danger)}.c-placeholder{color:var(--cui-base-400)}.c-backdrop{position:fixed;inset:0}.c-options__wrapper{position:absolute;font-family:var(--cui-main-font);z-index:1}.c-get-options-list-height-container{position:fixed;visibility:hidden}.c-options{padding:7px 0;margin:0;list-style:none;font-weight:400;font-size:14px;line-height:20px;box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);overflow:auto;max-height:180px;border:1px solid var(--cui-base-200);border-radius:8px;background:var(--cui-base-0);color:var(--cui-base-900)}.c-option-button{padding:8px 11px 8px 0;border:0;flex-shrink:0;outline:none;cursor:pointer;appearance:none;color:inherit;font:inherit;background:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;padding:8px 11px;width:100%;display:flex;align-items:center;gap:12px;text-align:start}.c-option-button:active{background:var(--cui-base-50)}@media (hover: hover){.c-option-button:hover{background:var(--cui-base-50)}}.c-option-button_selected{background:var(--cui-base-50)}.c-option-button:disabled{background:unset;opacity:50%}.c-option-button__icon{margin-left:auto}\n"] }]
|
|
4298
4298
|
}], propDecorators: { options: [{
|
|
4299
4299
|
type: Input
|
|
4300
4300
|
}], defaultOptionText: [{
|
|
@@ -4642,11 +4642,11 @@ class CuiTextareaComponent {
|
|
|
4642
4642
|
return this.cuiTextFieldController.isError;
|
|
4643
4643
|
}
|
|
4644
4644
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4645
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: { rows: "rows", noBordersAndPaddings: "noBordersAndPaddings" }, host: { properties: { "rows": "this.rows", "class._no-borders-and-paddings": "this.noBordersAndPaddings", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [{ directive: i1$1.CuiAutoResizingDirective }], ngImport: i0, template: '', isInline: true, styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:-webkit-autofill,:host:-webkit-autofill:hover,:host:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px
|
|
4645
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: { rows: "rows", noBordersAndPaddings: "noBordersAndPaddings" }, host: { properties: { "rows": "this.rows", "class._no-borders-and-paddings": "this.noBordersAndPaddings", "class._with-error": "this.isError" } }, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [{ directive: i1$1.CuiAutoResizingDirective }], ngImport: i0, template: '', isInline: true, styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:-webkit-autofill,:host:-webkit-autofill:hover,:host:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4646
4646
|
}
|
|
4647
4647
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiTextareaComponent, decorators: [{
|
|
4648
4648
|
type: Component,
|
|
4649
|
-
args: [{ selector: 'textarea[cuiTextarea]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [CuiAutoResizingDirective], styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:-webkit-autofill,:host:-webkit-autofill:hover,:host:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px
|
|
4649
|
+
args: [{ selector: 'textarea[cuiTextarea]', template: '', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CUI_TEXT_FILED_CONTROLLER_PROVIDER], hostDirectives: [CuiAutoResizingDirective], styles: [":host{padding:11px 13px 11px 0;outline:none;margin:0;border-width:0;appearance:none;caret-color:currentColor;color:inherit;font:inherit;line-height:inherit;padding:11px 13px;font-weight:400;font-size:14px;line-height:20px;box-sizing:border-box;max-height:320px;width:100%;border:1px solid var(--cui-base-200);border-radius:8px;resize:none;background:none;color:var(--cui-base-900);font-family:var(--cui-main-font)}:host:-webkit-autofill,:host:-webkit-autofill:hover,:host:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 200px var(--cui-input-autofill-bg) inset;-webkit-text-fill-color:var(--cui-input-autofill-color);caret-color:var(--cui-input-autofill-color)}:host:hover{border-color:var(--cui-base-300)}:host:focus,:host:focus-visible{box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}:host:disabled{cursor:not-allowed;opacity:.5;background:var(--cui-base-50);border-color:var(--cui-base-200)}:host::placeholder{color:var(--cui-base-400)}:host._no-borders-and-paddings{border:none;border-radius:0;padding:0;box-shadow:none}:host._no-borders-and-paddings:disabled{background:none}:host._with-error{border-color:var(--cui-danger)}:host._with-error:focus{box-shadow:0 0 0 2px color-mix(in srgb,var(--cui-danger) 25%,transparent)}\n"] }]
|
|
4650
4650
|
}], propDecorators: { rows: [{
|
|
4651
4651
|
type: Input
|
|
4652
4652
|
}, {
|
|
@@ -5998,7 +5998,7 @@ class MarkerSelectComponent {
|
|
|
5998
5998
|
useExisting: forwardRef(() => MarkerSelectComponent),
|
|
5999
5999
|
multi: true
|
|
6000
6000
|
}
|
|
6001
|
-
], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<ng-container *ngIf=\"isVisible()\">\n <div\n #dropdown\n class=\"dropdown\"\n >\n <header class=\"header\">\n <cui-input-text\n class=\"header__input\"\n cuiTextFieldId=\"estimated\"\n cuiTextFieldPlaceholder=\"Search...\"\n />\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconFiltersLines\"\n ></button>\n </header>\n <div class=\"scrollable-content\">\n <cc-select-option\n *ngFor=\"let element of elements\"\n [class._selected]=\"element.id === value?.id\"\n (click)=\"onToolClick(element)\"\n [tool]=\"element\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:fixed;z-index:10;left:0}:host._hidden{visibility:hidden}._selected{background-color:var(--cui-base-50)}.dropdown{box-shadow:0 1px 4px
|
|
6001
|
+
], hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<ng-container *ngIf=\"isVisible()\">\n <div\n #dropdown\n class=\"dropdown\"\n >\n <header class=\"header\">\n <cui-input-text\n class=\"header__input\"\n cuiTextFieldId=\"estimated\"\n cuiTextFieldPlaceholder=\"Search...\"\n />\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconFiltersLines\"\n ></button>\n </header>\n <div class=\"scrollable-content\">\n <cc-select-option\n *ngFor=\"let element of elements\"\n [class._selected]=\"element.id === value?.id\"\n (click)=\"onToolClick(element)\"\n [tool]=\"element\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:fixed;z-index:10;left:0}:host._hidden{visibility:hidden}._selected{background-color:var(--cui-base-50)}.dropdown{box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);padding-top:3px;padding-bottom:3px;display:flex;flex-direction:column;gap:4px;border-radius:8px;border:1px solid var(--cui-base-200);max-height:350px;width:345px;background:var(--cui-base-0)}.header{padding:4px 5px;display:flex;align-items:center;gap:4px}.header__input{width:100%}.footer{padding:2px 5px}.title{font-weight:400;font-size:14px;line-height:20px;padding:2px 8px;color:var(--cui-base-500);text-transform:uppercase}.scrollable-content{padding-left:5px;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: SelectOptionComponent, selector: "cc-select-option", inputs: ["tool"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6002
6002
|
}
|
|
6003
6003
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MarkerSelectComponent, decorators: [{
|
|
6004
6004
|
type: Component,
|
|
@@ -6018,7 +6018,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
6018
6018
|
useExisting: forwardRef(() => MarkerSelectComponent),
|
|
6019
6019
|
multi: true
|
|
6020
6020
|
}
|
|
6021
|
-
], template: "<ng-container *ngIf=\"isVisible()\">\n <div\n #dropdown\n class=\"dropdown\"\n >\n <header class=\"header\">\n <cui-input-text\n class=\"header__input\"\n cuiTextFieldId=\"estimated\"\n cuiTextFieldPlaceholder=\"Search...\"\n />\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconFiltersLines\"\n ></button>\n </header>\n <div class=\"scrollable-content\">\n <cc-select-option\n *ngFor=\"let element of elements\"\n [class._selected]=\"element.id === value?.id\"\n (click)=\"onToolClick(element)\"\n [tool]=\"element\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:fixed;z-index:10;left:0}:host._hidden{visibility:hidden}._selected{background-color:var(--cui-base-50)}.dropdown{box-shadow:0 1px 4px
|
|
6021
|
+
], template: "<ng-container *ngIf=\"isVisible()\">\n <div\n #dropdown\n class=\"dropdown\"\n >\n <header class=\"header\">\n <cui-input-text\n class=\"header__input\"\n cuiTextFieldId=\"estimated\"\n cuiTextFieldPlaceholder=\"Search...\"\n />\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconFiltersLines\"\n ></button>\n </header>\n <div class=\"scrollable-content\">\n <cc-select-option\n *ngFor=\"let element of elements\"\n [class._selected]=\"element.id === value?.id\"\n (click)=\"onToolClick(element)\"\n [tool]=\"element\"\n />\n </div>\n </div>\n</ng-container>\n", styles: [":host{position:fixed;z-index:10;left:0}:host._hidden{visibility:hidden}._selected{background-color:var(--cui-base-50)}.dropdown{box-shadow:0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent),0 1px 4px color-mix(in srgb,var(--cui-base-200) 40%,transparent);padding-top:3px;padding-bottom:3px;display:flex;flex-direction:column;gap:4px;border-radius:8px;border:1px solid var(--cui-base-200);max-height:350px;width:345px;background:var(--cui-base-0)}.header{padding:4px 5px;display:flex;align-items:center;gap:4px}.header__input{width:100%}.footer{padding:2px 5px}.title{font-weight:400;font-size:14px;line-height:20px;padding:2px 8px;color:var(--cui-base-500);text-transform:uppercase}.scrollable-content{padding-left:5px;overflow:auto}\n"] }]
|
|
6022
6022
|
}], propDecorators: { target: [{
|
|
6023
6023
|
type: Input
|
|
6024
6024
|
}], space: [{
|
|
@@ -6224,7 +6224,7 @@ class MarkerModalComponent {
|
|
|
6224
6224
|
this.element.style.top = bottom + this.spaceBetweenTargetAndList + 'px';
|
|
6225
6225
|
}
|
|
6226
6226
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MarkerModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6227
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: MarkerModalComponent, isStandalone: true, selector: "ng-component", inputs: { title: "title", url: "url", tool: "tool", isGlobal: "isGlobal", isTool: "isTool", target: "target", space: "space" }, outputs: { saveClicked: "saveClicked", cancelClicked: "cancelClicked" }, host: { properties: { "class._hidden": "this.hide", "class._fixed": "this.fixed" } }, hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<ng-container *transloco=\"let t\">\n <ng-container *ngIf=\"isVisible()\">\n <form\n autocomplete=\"off\"\n class=\"wrapper\"\n >\n <cui-form-field>\n <!-- eslint-disable-next-line -->\n <label\n [for]=\"titleId\"\n cuiLabel\n [isRequired]=\"true\"\n (click)=\"onTitleLabelClick(titleElement)\"\n >\n {{ t('TITLE') }}\n </label>\n <!-- TODO: \u0435\u0441\u043B\u0438 \u043D\u0430\u0439\u0434\u0435\u0442\u0441\u044F \u0432\u0430\u0440\u0438\u043A \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0444\u043E\u0440\u043C\u0443 -->\n <div\n class=\"title\"\n [class.title_invalid]=\"isTitleInvalid()\"\n >\n <div\n #titleElement\n class=\"title__text\"\n contenteditable\n attr.data-placeholder=\"{{ t('TITLE') }}...\"\n (paste)=\"onTitlePaste($event)\"\n (keyup)=\"onTitleChange($event)\"\n [innerHTML]=\"startTitle\"\n ></div>\n <button\n type=\"button\"\n class=\"title__clear\"\n (click)=\"onClearTitle(titleElement)\"\n >\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"title__icon\"\n />\n </button>\n </div>\n\n <cui-hint\n *ngIf=\"isTitleInvalid()\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"isTitleEmpty()\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"isTitleMoreThanMaxLength()\">\n {{ t('PLEASE_KEEP_FIELD_UNDER_CHARACTERS', { value: TITLE_MAX_LENGTH }) }}\n </ng-container>\n </cui-hint>\n </cui-form-field>\n <cui-form-field>\n <label\n [for]=\"dataId\"\n cuiLabel\n [isRequired]=\"true\"\n >\n {{ isTool ? t('TOOL') : t('URL') }}\n </label>\n <ng-container *ngIf=\"dynamicDataControl\">\n <ng-container *ngIf=\"isTool; else input\">\n <div>\n <button\n #target=\"elementRef\"\n class=\"button tool-button\"\n cuiButton\n type=\"button\"\n cuiElement\n appearance=\"outlined-gray\"\n size=\"sm\"\n >\n {{ $any(dynamicDataControl.value)?.title || t('SELECT_TOOL') }}\n </button>\n </div>\n <cc-marker-select\n [formControl]=\"dynamicDataControl\"\n [target]=\"target.nativeElement\"\n />\n </ng-container>\n <ng-template #input>\n <cui-input-text\n [cuiTextFieldId]=\"dataId\"\n [formControl]=\"dynamicDataControl\"\n autocomplete=\"off\"\n [cuiTextFieldIsError]=\"isDynamicDataErrorShown\"\n cuiTextFieldPlaceholder=\"{{ t('LINK') }}...\"\n />\n <cui-hint\n *ngIf=\"isDynamicDataErrorShown\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"dynamicDataControl.errors?.['required']\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"dynamicDataControl.errors?.['url']\">\n {{ t('INVALID_URL') }}\n </ng-container>\n </cui-hint>\n </ng-template>\n </ng-container>\n </cui-form-field>\n <div class=\"buttons\">\n <button\n cuiButton\n type=\"button\"\n appearance=\"outlined-gray\"\n size=\"sm\"\n (click)=\"onCancel()\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n cuiButton\n type=\"submit\"\n appearance=\"action\"\n size=\"sm\"\n [disabled]=\"isFormInvalid\"\n (click)=\"onSave()\"\n >\n {{ t('SAVE') }}\n </button>\n </div>\n </form>\n </ng-container>\n</ng-container>\n", styles: [":host{position:absolute;z-index:1;left:0}:host._fixed{position:fixed}:host._hidden{position:fixed;visibility:hidden}:host ::ng-deep .tool-button{width:100%}:host ::ng-deep .tool-button>span{justify-content:flex-start!important}.wrapper{padding:11px;box-shadow:0 2px 4px -1px #0000000f,0 4px 6px -1px #0000001a;display:flex;flex-direction:column;gap:16px;border-radius:8px;border:1px solid var(--cui-base-200);max-width:450px;background-color:var(--cui-base-0)}.buttons{padding-top:12px;display:flex;justify-content:flex-end;gap:12px}.title{padding:7px 13px;cursor:text;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;width:426px;background:var(--cui-input);color:var(--cui-base-900)}.title:hover{border-color:var(--cui-base-300)}.title:focus-within{outline:none;box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.title_invalid,.title_invalid:focus-within{box-shadow:none;border-color:var(--cui-danger)}.title__text{flex-grow:1;text-wrap:nowrap;overflow:hidden}.title__text[data-placeholder]:empty:before{content:attr(data-placeholder);position:absolute;color:var(--cui-base-400)}.title__text:focus{outline:none}.title__clear{padding:0;visibility:hidden}.title__icon{width:16px}.title__icon ::ng-deep [stroke]{stroke:var(--cui-base-0)}.title__text:not(:empty)+.title__clear{visibility:visible}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiElementDirective, selector: "[cuiElement]", exportAs: ["elementRef"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "ngmodule", type: CuiHintModule }, { kind: "component", type: CuiHintComponent, selector: "cui-hint", inputs: ["hintType"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MarkerSelectComponent, selector: "cc-marker-select", inputs: ["target", "space"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6227
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: MarkerModalComponent, isStandalone: true, selector: "ng-component", inputs: { title: "title", url: "url", tool: "tool", isGlobal: "isGlobal", isTool: "isTool", target: "target", space: "space" }, outputs: { saveClicked: "saveClicked", cancelClicked: "cancelClicked" }, host: { properties: { "class._hidden": "this.hide", "class._fixed": "this.fixed" } }, hostDirectives: [{ directive: i1$1.CuiClickOutsideDirective }], ngImport: i0, template: "<ng-container *transloco=\"let t\">\n <ng-container *ngIf=\"isVisible()\">\n <form\n autocomplete=\"off\"\n class=\"wrapper\"\n >\n <cui-form-field>\n <!-- eslint-disable-next-line -->\n <label\n [for]=\"titleId\"\n cuiLabel\n [isRequired]=\"true\"\n (click)=\"onTitleLabelClick(titleElement)\"\n >\n {{ t('TITLE') }}\n </label>\n <!-- TODO: \u0435\u0441\u043B\u0438 \u043D\u0430\u0439\u0434\u0435\u0442\u0441\u044F \u0432\u0430\u0440\u0438\u043A \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0444\u043E\u0440\u043C\u0443 -->\n <div\n class=\"title\"\n [class.title_invalid]=\"isTitleInvalid()\"\n >\n <div\n #titleElement\n class=\"title__text\"\n contenteditable\n attr.data-placeholder=\"{{ t('TITLE') }}...\"\n (paste)=\"onTitlePaste($event)\"\n (keyup)=\"onTitleChange($event)\"\n [innerHTML]=\"startTitle\"\n ></div>\n <button\n type=\"button\"\n class=\"title__clear\"\n (click)=\"onClearTitle(titleElement)\"\n >\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"title__icon\"\n />\n </button>\n </div>\n\n <cui-hint\n *ngIf=\"isTitleInvalid()\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"isTitleEmpty()\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"isTitleMoreThanMaxLength()\">\n {{ t('PLEASE_KEEP_FIELD_UNDER_CHARACTERS', { value: TITLE_MAX_LENGTH }) }}\n </ng-container>\n </cui-hint>\n </cui-form-field>\n <cui-form-field>\n <label\n [for]=\"dataId\"\n cuiLabel\n [isRequired]=\"true\"\n >\n {{ isTool ? t('TOOL') : t('URL') }}\n </label>\n <ng-container *ngIf=\"dynamicDataControl\">\n <ng-container *ngIf=\"isTool; else input\">\n <div>\n <button\n #target=\"elementRef\"\n class=\"button tool-button\"\n cuiButton\n type=\"button\"\n cuiElement\n appearance=\"outlined-gray\"\n size=\"sm\"\n >\n {{ $any(dynamicDataControl.value)?.title || t('SELECT_TOOL') }}\n </button>\n </div>\n <cc-marker-select\n [formControl]=\"dynamicDataControl\"\n [target]=\"target.nativeElement\"\n />\n </ng-container>\n <ng-template #input>\n <cui-input-text\n [cuiTextFieldId]=\"dataId\"\n [formControl]=\"dynamicDataControl\"\n autocomplete=\"off\"\n [cuiTextFieldIsError]=\"isDynamicDataErrorShown\"\n cuiTextFieldPlaceholder=\"{{ t('LINK') }}...\"\n />\n <cui-hint\n *ngIf=\"isDynamicDataErrorShown\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"dynamicDataControl.errors?.['required']\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"dynamicDataControl.errors?.['url']\">\n {{ t('INVALID_URL') }}\n </ng-container>\n </cui-hint>\n </ng-template>\n </ng-container>\n </cui-form-field>\n <div class=\"buttons\">\n <button\n cuiButton\n type=\"button\"\n appearance=\"outlined-gray\"\n size=\"sm\"\n (click)=\"onCancel()\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n cuiButton\n type=\"submit\"\n appearance=\"action\"\n size=\"sm\"\n [disabled]=\"isFormInvalid\"\n (click)=\"onSave()\"\n >\n {{ t('SAVE') }}\n </button>\n </div>\n </form>\n </ng-container>\n</ng-container>\n", styles: [":host{position:absolute;z-index:1;left:0}:host._fixed{position:fixed}:host._hidden{position:fixed;visibility:hidden}:host ::ng-deep .tool-button{width:100%}:host ::ng-deep .tool-button>span{justify-content:flex-start!important}.wrapper{padding:11px;box-shadow:0 2px 4px -1px color-mix(in srgb,var(--cui-base-200) 60%,transparent),0 4px 6px -1px color-mix(in srgb,var(--cui-base-200) 40%,transparent);display:flex;flex-direction:column;gap:16px;border-radius:8px;border:1px solid var(--cui-base-200);max-width:450px;background-color:var(--cui-base-0)}.buttons{padding-top:12px;display:flex;justify-content:flex-end;gap:12px}.title{padding:7px 13px;cursor:text;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;width:426px;background:var(--cui-input);color:var(--cui-base-900)}.title:hover{border-color:var(--cui-base-300)}.title:focus-within{outline:none;box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.title_invalid,.title_invalid:focus-within{box-shadow:none;border-color:var(--cui-danger)}.title__text{flex-grow:1;text-wrap:nowrap;overflow:hidden}.title__text[data-placeholder]:empty:before{content:attr(data-placeholder);position:absolute;color:var(--cui-base-400)}.title__text:focus{outline:none}.title__clear{padding:0;visibility:hidden}.title__icon{width:16px}.title__icon ::ng-deep [stroke]{stroke:var(--cui-base-0)}.title__text:not(:empty)+.title__clear{visibility:visible}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: CuiElementDirective, selector: "[cuiElement]", exportAs: ["elementRef"] }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "component", type: CuiFormFieldComponent, selector: "cui-form-field" }, { kind: "ngmodule", type: CuiHintModule }, { kind: "component", type: CuiHintComponent, selector: "cui-hint", inputs: ["hintType"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "component", type: CuiInputTextComponent, selector: "cui-input-text" }, { kind: "directive", type: CuiTextFieldIdDirective, selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MarkerSelectComponent, selector: "cc-marker-select", inputs: ["target", "space"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6228
6228
|
}
|
|
6229
6229
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MarkerModalComponent, decorators: [{
|
|
6230
6230
|
type: Component,
|
|
@@ -6241,7 +6241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
6241
6241
|
ReactiveFormsModule,
|
|
6242
6242
|
TranslocoDirective,
|
|
6243
6243
|
NgIf
|
|
6244
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiClickOutsideDirective], template: "<ng-container *transloco=\"let t\">\n <ng-container *ngIf=\"isVisible()\">\n <form\n autocomplete=\"off\"\n class=\"wrapper\"\n >\n <cui-form-field>\n <!-- eslint-disable-next-line -->\n <label\n [for]=\"titleId\"\n cuiLabel\n [isRequired]=\"true\"\n (click)=\"onTitleLabelClick(titleElement)\"\n >\n {{ t('TITLE') }}\n </label>\n <!-- TODO: \u0435\u0441\u043B\u0438 \u043D\u0430\u0439\u0434\u0435\u0442\u0441\u044F \u0432\u0430\u0440\u0438\u043A \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0444\u043E\u0440\u043C\u0443 -->\n <div\n class=\"title\"\n [class.title_invalid]=\"isTitleInvalid()\"\n >\n <div\n #titleElement\n class=\"title__text\"\n contenteditable\n attr.data-placeholder=\"{{ t('TITLE') }}...\"\n (paste)=\"onTitlePaste($event)\"\n (keyup)=\"onTitleChange($event)\"\n [innerHTML]=\"startTitle\"\n ></div>\n <button\n type=\"button\"\n class=\"title__clear\"\n (click)=\"onClearTitle(titleElement)\"\n >\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"title__icon\"\n />\n </button>\n </div>\n\n <cui-hint\n *ngIf=\"isTitleInvalid()\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"isTitleEmpty()\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"isTitleMoreThanMaxLength()\">\n {{ t('PLEASE_KEEP_FIELD_UNDER_CHARACTERS', { value: TITLE_MAX_LENGTH }) }}\n </ng-container>\n </cui-hint>\n </cui-form-field>\n <cui-form-field>\n <label\n [for]=\"dataId\"\n cuiLabel\n [isRequired]=\"true\"\n >\n {{ isTool ? t('TOOL') : t('URL') }}\n </label>\n <ng-container *ngIf=\"dynamicDataControl\">\n <ng-container *ngIf=\"isTool; else input\">\n <div>\n <button\n #target=\"elementRef\"\n class=\"button tool-button\"\n cuiButton\n type=\"button\"\n cuiElement\n appearance=\"outlined-gray\"\n size=\"sm\"\n >\n {{ $any(dynamicDataControl.value)?.title || t('SELECT_TOOL') }}\n </button>\n </div>\n <cc-marker-select\n [formControl]=\"dynamicDataControl\"\n [target]=\"target.nativeElement\"\n />\n </ng-container>\n <ng-template #input>\n <cui-input-text\n [cuiTextFieldId]=\"dataId\"\n [formControl]=\"dynamicDataControl\"\n autocomplete=\"off\"\n [cuiTextFieldIsError]=\"isDynamicDataErrorShown\"\n cuiTextFieldPlaceholder=\"{{ t('LINK') }}...\"\n />\n <cui-hint\n *ngIf=\"isDynamicDataErrorShown\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"dynamicDataControl.errors?.['required']\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"dynamicDataControl.errors?.['url']\">\n {{ t('INVALID_URL') }}\n </ng-container>\n </cui-hint>\n </ng-template>\n </ng-container>\n </cui-form-field>\n <div class=\"buttons\">\n <button\n cuiButton\n type=\"button\"\n appearance=\"outlined-gray\"\n size=\"sm\"\n (click)=\"onCancel()\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n cuiButton\n type=\"submit\"\n appearance=\"action\"\n size=\"sm\"\n [disabled]=\"isFormInvalid\"\n (click)=\"onSave()\"\n >\n {{ t('SAVE') }}\n </button>\n </div>\n </form>\n </ng-container>\n</ng-container>\n", styles: [":host{position:absolute;z-index:1;left:0}:host._fixed{position:fixed}:host._hidden{position:fixed;visibility:hidden}:host ::ng-deep .tool-button{width:100%}:host ::ng-deep .tool-button>span{justify-content:flex-start!important}.wrapper{padding:11px;box-shadow:0 2px 4px -1px
|
|
6244
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [CuiClickOutsideDirective], template: "<ng-container *transloco=\"let t\">\n <ng-container *ngIf=\"isVisible()\">\n <form\n autocomplete=\"off\"\n class=\"wrapper\"\n >\n <cui-form-field>\n <!-- eslint-disable-next-line -->\n <label\n [for]=\"titleId\"\n cuiLabel\n [isRequired]=\"true\"\n (click)=\"onTitleLabelClick(titleElement)\"\n >\n {{ t('TITLE') }}\n </label>\n <!-- TODO: \u0435\u0441\u043B\u0438 \u043D\u0430\u0439\u0434\u0435\u0442\u0441\u044F \u0432\u0430\u0440\u0438\u043A \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0447\u0435\u0440\u0435\u0437 \u0444\u043E\u0440\u043C\u0443 -->\n <div\n class=\"title\"\n [class.title_invalid]=\"isTitleInvalid()\"\n >\n <div\n #titleElement\n class=\"title__text\"\n contenteditable\n attr.data-placeholder=\"{{ t('TITLE') }}...\"\n (paste)=\"onTitlePaste($event)\"\n (keyup)=\"onTitleChange($event)\"\n [innerHTML]=\"startTitle\"\n ></div>\n <button\n type=\"button\"\n class=\"title__clear\"\n (click)=\"onClearTitle(titleElement)\"\n >\n <cui-svg\n icon=\"cuiIconClear\"\n color=\"var(--cui-base-300)\"\n class=\"title__icon\"\n />\n </button>\n </div>\n\n <cui-hint\n *ngIf=\"isTitleInvalid()\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"isTitleEmpty()\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"isTitleMoreThanMaxLength()\">\n {{ t('PLEASE_KEEP_FIELD_UNDER_CHARACTERS', { value: TITLE_MAX_LENGTH }) }}\n </ng-container>\n </cui-hint>\n </cui-form-field>\n <cui-form-field>\n <label\n [for]=\"dataId\"\n cuiLabel\n [isRequired]=\"true\"\n >\n {{ isTool ? t('TOOL') : t('URL') }}\n </label>\n <ng-container *ngIf=\"dynamicDataControl\">\n <ng-container *ngIf=\"isTool; else input\">\n <div>\n <button\n #target=\"elementRef\"\n class=\"button tool-button\"\n cuiButton\n type=\"button\"\n cuiElement\n appearance=\"outlined-gray\"\n size=\"sm\"\n >\n {{ $any(dynamicDataControl.value)?.title || t('SELECT_TOOL') }}\n </button>\n </div>\n <cc-marker-select\n [formControl]=\"dynamicDataControl\"\n [target]=\"target.nativeElement\"\n />\n </ng-container>\n <ng-template #input>\n <cui-input-text\n [cuiTextFieldId]=\"dataId\"\n [formControl]=\"dynamicDataControl\"\n autocomplete=\"off\"\n [cuiTextFieldIsError]=\"isDynamicDataErrorShown\"\n cuiTextFieldPlaceholder=\"{{ t('LINK') }}...\"\n />\n <cui-hint\n *ngIf=\"isDynamicDataErrorShown\"\n hintType=\"error\"\n >\n <ng-container *ngIf=\"dynamicDataControl.errors?.['required']\">\n {{ t('FIELD_IS_REQUIRED') }}\n </ng-container>\n <ng-container *ngIf=\"dynamicDataControl.errors?.['url']\">\n {{ t('INVALID_URL') }}\n </ng-container>\n </cui-hint>\n </ng-template>\n </ng-container>\n </cui-form-field>\n <div class=\"buttons\">\n <button\n cuiButton\n type=\"button\"\n appearance=\"outlined-gray\"\n size=\"sm\"\n (click)=\"onCancel()\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n cuiButton\n type=\"submit\"\n appearance=\"action\"\n size=\"sm\"\n [disabled]=\"isFormInvalid\"\n (click)=\"onSave()\"\n >\n {{ t('SAVE') }}\n </button>\n </div>\n </form>\n </ng-container>\n</ng-container>\n", styles: [":host{position:absolute;z-index:1;left:0}:host._fixed{position:fixed}:host._hidden{position:fixed;visibility:hidden}:host ::ng-deep .tool-button{width:100%}:host ::ng-deep .tool-button>span{justify-content:flex-start!important}.wrapper{padding:11px;box-shadow:0 2px 4px -1px color-mix(in srgb,var(--cui-base-200) 60%,transparent),0 4px 6px -1px color-mix(in srgb,var(--cui-base-200) 40%,transparent);display:flex;flex-direction:column;gap:16px;border-radius:8px;border:1px solid var(--cui-base-200);max-width:450px;background-color:var(--cui-base-0)}.buttons{padding-top:12px;display:flex;justify-content:flex-end;gap:12px}.title{padding:7px 13px;cursor:text;display:flex;align-items:center;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px;width:426px;background:var(--cui-input);color:var(--cui-base-900)}.title:hover{border-color:var(--cui-base-300)}.title:focus-within{outline:none;box-shadow:0 0 0 2px var(--cui-focus);border-color:var(--cui-info)}.title_invalid,.title_invalid:focus-within{box-shadow:none;border-color:var(--cui-danger)}.title__text{flex-grow:1;text-wrap:nowrap;overflow:hidden}.title__text[data-placeholder]:empty:before{content:attr(data-placeholder);position:absolute;color:var(--cui-base-400)}.title__text:focus{outline:none}.title__clear{padding:0;visibility:hidden}.title__icon{width:16px}.title__icon ::ng-deep [stroke]{stroke:var(--cui-base-0)}.title__text:not(:empty)+.title__clear{visibility:visible}\n"] }]
|
|
6245
6245
|
}], propDecorators: { title: [{
|
|
6246
6246
|
type: Input
|
|
6247
6247
|
}], url: [{
|
|
@@ -6376,11 +6376,11 @@ class EditorTooltipComponent {
|
|
|
6376
6376
|
return options.map((option) => this.BUTTONS_OPTIONS.get(option));
|
|
6377
6377
|
}
|
|
6378
6378
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditorTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6379
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: EditorTooltipComponent, isStandalone: true, selector: "ng-component", inputs: { title: "title", options: "options" }, outputs: { copyClicked: "copyClicked", editClicked: "editClicked", deleteClicked: "deleteClicked" }, ngImport: i0, template: "<h3 class=\"title\">{{ title }}</h3>\r\n<div class=\"buttons-container\">\r\n <ng-container *ngFor=\"let button of buttons\">\r\n <div class=\"divider\"></div>\r\n <!-- TODO: class \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u0443\u0434\u0430\u043B\u0451\u043D \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043C-->\r\n <button\r\n class=\"button\"\r\n cuiButton\r\n type=\"button\"\r\n appearance=\"ghost\"\r\n size=\"xxs\"\r\n [icon]=\"button.icon\"\r\n [class]=\"button.class\"\r\n (click)=\"button.handler($event)\"\r\n ></button>\r\n </ng-container>\r\n</div>\r\n", styles: [":host{padding:4px 6px;box-shadow:0 4px 6px -2px
|
|
6379
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: EditorTooltipComponent, isStandalone: true, selector: "ng-component", inputs: { title: "title", options: "options" }, outputs: { copyClicked: "copyClicked", editClicked: "editClicked", deleteClicked: "deleteClicked" }, ngImport: i0, template: "<h3 class=\"title\">{{ title }}</h3>\r\n<div class=\"buttons-container\">\r\n <ng-container *ngFor=\"let button of buttons\">\r\n <div class=\"divider\"></div>\r\n <!-- TODO: class \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u0443\u0434\u0430\u043B\u0451\u043D \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043C-->\r\n <button\r\n class=\"button\"\r\n cuiButton\r\n type=\"button\"\r\n appearance=\"ghost\"\r\n size=\"xxs\"\r\n [icon]=\"button.icon\"\r\n [class]=\"button.class\"\r\n (click)=\"button.handler($event)\"\r\n ></button>\r\n </ng-container>\r\n</div>\r\n", styles: [":host{padding:4px 6px;box-shadow:0 4px 6px -2px color-mix(in srgb,var(--cui-base-200) 50%,transparent),0 10px 15px -3px color-mix(in srgb,var(--cui-base-200) 40%,transparent);font-weight:400;font-size:14px;line-height:20px;position:fixed;z-index:12;left:0;top:0;display:flex;align-items:center;gap:12px;border-radius:4px;font-family:var(--cui-main-font);background:var(--cui-gray-800)}.title{font-weight:400;font-size:14px;line-height:20px;max-width:300px;text-wrap:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--cui-gray-0)}.divider{width:1px;height:24px;background:var(--cui-gray-500)}.buttons-container{display:flex;align-items:center;gap:4px}.button{--cui-base-50: rgba(255 255 255 / 10%);--cui-base-500: var(--cui-gray-0)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6380
6380
|
}
|
|
6381
6381
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditorTooltipComponent, decorators: [{
|
|
6382
6382
|
type: Component,
|
|
6383
|
-
args: [{ standalone: true, imports: [CuiButtonModule, NgFor], changeDetection: ChangeDetectionStrategy.OnPush, template: "<h3 class=\"title\">{{ title }}</h3>\r\n<div class=\"buttons-container\">\r\n <ng-container *ngFor=\"let button of buttons\">\r\n <div class=\"divider\"></div>\r\n <!-- TODO: class \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u0443\u0434\u0430\u043B\u0451\u043D \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043C-->\r\n <button\r\n class=\"button\"\r\n cuiButton\r\n type=\"button\"\r\n appearance=\"ghost\"\r\n size=\"xxs\"\r\n [icon]=\"button.icon\"\r\n [class]=\"button.class\"\r\n (click)=\"button.handler($event)\"\r\n ></button>\r\n </ng-container>\r\n</div>\r\n", styles: [":host{padding:4px 6px;box-shadow:0 4px 6px -2px
|
|
6383
|
+
args: [{ standalone: true, imports: [CuiButtonModule, NgFor], changeDetection: ChangeDetectionStrategy.OnPush, template: "<h3 class=\"title\">{{ title }}</h3>\r\n<div class=\"buttons-container\">\r\n <ng-container *ngFor=\"let button of buttons\">\r\n <div class=\"divider\"></div>\r\n <!-- TODO: class \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u0443\u0434\u0430\u043B\u0451\u043D \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043C-->\r\n <button\r\n class=\"button\"\r\n cuiButton\r\n type=\"button\"\r\n appearance=\"ghost\"\r\n size=\"xxs\"\r\n [icon]=\"button.icon\"\r\n [class]=\"button.class\"\r\n (click)=\"button.handler($event)\"\r\n ></button>\r\n </ng-container>\r\n</div>\r\n", styles: [":host{padding:4px 6px;box-shadow:0 4px 6px -2px color-mix(in srgb,var(--cui-base-200) 50%,transparent),0 10px 15px -3px color-mix(in srgb,var(--cui-base-200) 40%,transparent);font-weight:400;font-size:14px;line-height:20px;position:fixed;z-index:12;left:0;top:0;display:flex;align-items:center;gap:12px;border-radius:4px;font-family:var(--cui-main-font);background:var(--cui-gray-800)}.title{font-weight:400;font-size:14px;line-height:20px;max-width:300px;text-wrap:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--cui-gray-0)}.divider{width:1px;height:24px;background:var(--cui-gray-500)}.buttons-container{display:flex;align-items:center;gap:4px}.button{--cui-base-50: rgba(255 255 255 / 10%);--cui-base-500: var(--cui-gray-0)}\n"] }]
|
|
6384
6384
|
}], propDecorators: { title: [{
|
|
6385
6385
|
type: Input,
|
|
6386
6386
|
args: [{ required: true }]
|
|
@@ -9398,11 +9398,11 @@ class CuiDeleteModalComponent {
|
|
|
9398
9398
|
this.context.completeWith({ canceled: true });
|
|
9399
9399
|
}
|
|
9400
9400
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDeleteModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9401
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiDeleteModalComponent, isStandalone: true, selector: "cui-delete-modal", ngImport: i0, template: "<div\n *transloco=\"let t\"\n class=\"wrapper\"\n>\n <div class=\"content\">\n <div class=\"header\">\n <h3 class=\"title\">{{ t(title) }}</h3>\n <button\n type=\"button\"\n cuiButton\n icon=\"cuiIconX\"\n appearance=\"ghost\"\n [disabled]=\"isLoading()\"\n class=\"close-btn\"\n (click)=\"onCancel()\"\n ></button>\n </div>\n <div class=\"info\">\n @for (text of content; track text) {\n <p [innerHTML]=\"t(text)\"></p>\n }\n </div>\n </div>\n\n <div class=\"footer\">\n <button\n type=\"button\"\n cuiButton\n (click)=\"onCancel()\"\n [disabled]=\"isLoading()\"\n appearance=\"secondary\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n type=\"button\"\n cuiButton\n [isLoaderShown]=\"isLoading()\"\n [disabled]=\"isDisabled\"\n [cuiTooltip]=\"isDisabled && t('IN_DEVELOPMENT')\"\n appearance=\"destructive\"\n (click)=\"onDelete()\"\n >\n {{ t('YES_DELETE') }}\n </button>\n </div>\n</div>\n", styles: [".wrapper{display:flex;flex-direction:column;gap:24px;padding:23px;border-radius:
|
|
9401
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiDeleteModalComponent, isStandalone: true, selector: "cui-delete-modal", ngImport: i0, template: "<div\n *transloco=\"let t\"\n class=\"wrapper\"\n>\n <div class=\"content\">\n <div class=\"header\">\n <h3 class=\"title\">{{ t(title) }}</h3>\n <button\n type=\"button\"\n cuiButton\n icon=\"cuiIconX\"\n appearance=\"ghost\"\n [disabled]=\"isLoading()\"\n class=\"close-btn\"\n (click)=\"onCancel()\"\n ></button>\n </div>\n <div class=\"info\">\n @for (text of content; track text) {\n <p [innerHTML]=\"t(text)\"></p>\n }\n </div>\n </div>\n\n <div class=\"footer\">\n <button\n type=\"button\"\n cuiButton\n (click)=\"onCancel()\"\n [disabled]=\"isLoading()\"\n appearance=\"secondary\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n type=\"button\"\n cuiButton\n [isLoaderShown]=\"isLoading()\"\n [disabled]=\"isDisabled\"\n [cuiTooltip]=\"isDisabled && t('IN_DEVELOPMENT')\"\n appearance=\"destructive\"\n (click)=\"onDelete()\"\n >\n {{ t('YES_DELETE') }}\n </button>\n </div>\n</div>\n", styles: [".wrapper{display:flex;flex-direction:column;gap:24px;padding:23px;border-radius:8px;width:400px}.header{display:flex;flex-direction:row;gap:8px;align-items:stretch;justify-content:space-between}.content{display:flex;flex-direction:column;gap:12px}.title{font-weight:500;font-size:18px;line-height:28px}.info{display:flex;flex-direction:column;gap:16px;font-weight:400;font-size:14px;line-height:20px}.footer{display:flex;flex-direction:row;gap:12px;align-items:stretch;justify-content:flex-end}.close-btn{margin:-8px}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "directive", type: i4.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: CuiTooltipDirective, selector: "[cuiTooltip]:not(ng-container):not(ng-template)", inputs: ["cuiTooltipContext", "cuiTooltipAppearance", "cuiTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9402
9402
|
}
|
|
9403
9403
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiDeleteModalComponent, decorators: [{
|
|
9404
9404
|
type: Component,
|
|
9405
|
-
args: [{ selector: 'cui-delete-modal', imports: [CuiButtonModule, TranslocoModule, CuiTooltip], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *transloco=\"let t\"\n class=\"wrapper\"\n>\n <div class=\"content\">\n <div class=\"header\">\n <h3 class=\"title\">{{ t(title) }}</h3>\n <button\n type=\"button\"\n cuiButton\n icon=\"cuiIconX\"\n appearance=\"ghost\"\n [disabled]=\"isLoading()\"\n class=\"close-btn\"\n (click)=\"onCancel()\"\n ></button>\n </div>\n <div class=\"info\">\n @for (text of content; track text) {\n <p [innerHTML]=\"t(text)\"></p>\n }\n </div>\n </div>\n\n <div class=\"footer\">\n <button\n type=\"button\"\n cuiButton\n (click)=\"onCancel()\"\n [disabled]=\"isLoading()\"\n appearance=\"secondary\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n type=\"button\"\n cuiButton\n [isLoaderShown]=\"isLoading()\"\n [disabled]=\"isDisabled\"\n [cuiTooltip]=\"isDisabled && t('IN_DEVELOPMENT')\"\n appearance=\"destructive\"\n (click)=\"onDelete()\"\n >\n {{ t('YES_DELETE') }}\n </button>\n </div>\n</div>\n", styles: [".wrapper{display:flex;flex-direction:column;gap:24px;padding:23px;border-radius:
|
|
9405
|
+
args: [{ selector: 'cui-delete-modal', imports: [CuiButtonModule, TranslocoModule, CuiTooltip], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *transloco=\"let t\"\n class=\"wrapper\"\n>\n <div class=\"content\">\n <div class=\"header\">\n <h3 class=\"title\">{{ t(title) }}</h3>\n <button\n type=\"button\"\n cuiButton\n icon=\"cuiIconX\"\n appearance=\"ghost\"\n [disabled]=\"isLoading()\"\n class=\"close-btn\"\n (click)=\"onCancel()\"\n ></button>\n </div>\n <div class=\"info\">\n @for (text of content; track text) {\n <p [innerHTML]=\"t(text)\"></p>\n }\n </div>\n </div>\n\n <div class=\"footer\">\n <button\n type=\"button\"\n cuiButton\n (click)=\"onCancel()\"\n [disabled]=\"isLoading()\"\n appearance=\"secondary\"\n >\n {{ t('CANCEL') }}\n </button>\n <button\n type=\"button\"\n cuiButton\n [isLoaderShown]=\"isLoading()\"\n [disabled]=\"isDisabled\"\n [cuiTooltip]=\"isDisabled && t('IN_DEVELOPMENT')\"\n appearance=\"destructive\"\n (click)=\"onDelete()\"\n >\n {{ t('YES_DELETE') }}\n </button>\n </div>\n</div>\n", styles: [".wrapper{display:flex;flex-direction:column;gap:24px;padding:23px;border-radius:8px;width:400px}.header{display:flex;flex-direction:row;gap:8px;align-items:stretch;justify-content:space-between}.content{display:flex;flex-direction:column;gap:12px}.title{font-weight:500;font-size:18px;line-height:28px}.info{display:flex;flex-direction:column;gap:16px;font-weight:400;font-size:14px;line-height:20px}.footer{display:flex;flex-direction:row;gap:12px;align-items:stretch;justify-content:flex-end}.close-btn{margin:-8px}\n"] }]
|
|
9406
9406
|
}] });
|
|
9407
9407
|
|
|
9408
9408
|
/** @deprecated Use `CuiCategoryTreeStateService` from `cui-categories-tree`. */
|
|
@@ -9647,7 +9647,7 @@ class CuiCategoryItemComponent {
|
|
|
9647
9647
|
}, { allowSignalWrites: true });
|
|
9648
9648
|
}
|
|
9649
9649
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCategoryItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9650
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCategoryItemComponent, isStandalone: true, selector: "cui-category-item", inputs: { stageStorage: { classPropertyName: "stageStorage", publicName: "stageStorage", isSignal: true, isRequired: true, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n [disabled]=\"isStageCreationLoading()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"category__open-close-button\"\n [class.category__open-close-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"stageStorageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"category__title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-list\n [stageStorages]=\"stageStorageChildren()\"\n [context]=\"context()\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategoryCategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}}.category:active{background:var(--cui-base-10)}.category__open-close-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:
|
|
9650
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCategoryItemComponent, isStandalone: true, selector: "cui-category-item", inputs: { stageStorage: { classPropertyName: "stageStorage", publicName: "stageStorage", isSignal: true, isRequired: true, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n [disabled]=\"isStageCreationLoading()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"category__open-close-button\"\n [class.category__open-close-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"stageStorageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"category__title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-list\n [stageStorages]=\"stageStorageChildren()\"\n [context]=\"context()\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategoryCategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}}.category:active{background:var(--cui-base-10)}.category__open-close-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:6px;margin:4px 0}@media (hover: hover){.category__open-close-button:hover{background:var(--cui-base-100)}}.category__open-close-button:active{background:var(--cui-base-100)}.category__open-close-button_hidden{visibility:hidden}.category__title{flex:1;text-align:start;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.category__add-subcategory-button{--cui-base-50: var(--cui-base-200)}.list-wrapper{padding-left:8px}.create-category{margin-left:24px}.icon{padding-right:2px;padding-left:2px;height:28px}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CuiButtonModule) }, { kind: "component", type: i0.forwardRef(() => CuiButtonComponent), selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiIconButtonModule) }, { kind: "directive", type: i0.forwardRef(() => CuiLetDirective), selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiSvgModule) }, { kind: "component", type: i0.forwardRef(() => CuiSvgComponent), selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "component", type: i0.forwardRef(() => CuiCategoryFormComponent), selector: "cui-category-form", inputs: ["isDisabled", "defaultTitle"], outputs: ["created", "canceled"] }, { kind: "component", type: i0.forwardRef(() => CuiCreateCategoryItemComponent), selector: "cui-create-category-item", inputs: ["isDisabled"], outputs: ["created", "canceled"] }, { kind: "component", type: i0.forwardRef(() => CuiCategoriesListComponent), selector: "cui-categories-list", inputs: ["stageStorages", "context"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9651
9651
|
}
|
|
9652
9652
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCategoryItemComponent, decorators: [{
|
|
9653
9653
|
type: Component,
|
|
@@ -9659,7 +9659,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
9659
9659
|
CuiCategoryFormComponent,
|
|
9660
9660
|
CuiCreateCategoryItemComponent,
|
|
9661
9661
|
forwardRef(() => CuiCategoriesListComponent)
|
|
9662
|
-
], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n [disabled]=\"isStageCreationLoading()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"category__open-close-button\"\n [class.category__open-close-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"stageStorageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"category__title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-list\n [stageStorages]=\"stageStorageChildren()\"\n [context]=\"context()\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategoryCategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}}.category:active{background:var(--cui-base-10)}.category__open-close-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:
|
|
9662
|
+
], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n [disabled]=\"isStageCreationLoading()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"category__open-close-button\"\n [class.category__open-close-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"stageStorageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"category__title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"category__add-subcategory-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-list\n [stageStorages]=\"stageStorageChildren()\"\n [context]=\"context()\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategoryCategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}}.category:active{background:var(--cui-base-10)}.category__open-close-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:6px;margin:4px 0}@media (hover: hover){.category__open-close-button:hover{background:var(--cui-base-100)}}.category__open-close-button:active{background:var(--cui-base-100)}.category__open-close-button_hidden{visibility:hidden}.category__title{flex:1;text-align:start;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.category__add-subcategory-button{--cui-base-50: var(--cui-base-200)}.list-wrapper{padding-left:8px}.create-category{margin-left:24px}.icon{padding-right:2px;padding-left:2px;height:28px}\n"] }]
|
|
9663
9663
|
}], ctorParameters: () => [] });
|
|
9664
9664
|
|
|
9665
9665
|
class CuiCategoriesListComponent {
|
|
@@ -10025,7 +10025,7 @@ class CuiCategoryTreeItemComponent {
|
|
|
10025
10025
|
.subscribe((storages) => this.storageChildren.set(storages));
|
|
10026
10026
|
}
|
|
10027
10027
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCategoryTreeItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10028
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCategoryTreeItemComponent, isStandalone: true, selector: "cui-category-tree-item", inputs: { storage: { classPropertyName: "storage", publicName: "storage", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { deleted: "deleted" }, ngImport: i0, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"toggle-button\"\n [class.toggle-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"storageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-tree-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"button edit-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"button add-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n @if (isDeleteSupported) {\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconTrash\"\n class=\"button delete-button\"\n (click)=\"onDelete($event)\"\n ></button>\n }\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-tree-list\n [storages]=\"storageChildren()\"\n (deleted)=\"onChildDeleted($event)\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-tree-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}.category:hover .delete-button{display:inline-block}}.category:active{background:var(--cui-base-10)}.toggle-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:
|
|
10028
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CuiCategoryTreeItemComponent, isStandalone: true, selector: "cui-category-tree-item", inputs: { storage: { classPropertyName: "storage", publicName: "storage", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { deleted: "deleted" }, ngImport: i0, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"toggle-button\"\n [class.toggle-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"storageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-tree-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"button edit-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"button add-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n @if (isDeleteSupported) {\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconTrash\"\n class=\"button delete-button\"\n (click)=\"onDelete($event)\"\n ></button>\n }\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-tree-list\n [storages]=\"storageChildren()\"\n (deleted)=\"onChildDeleted($event)\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-tree-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}.category:hover .delete-button{display:inline-block}}.category:active{background:var(--cui-base-10)}.toggle-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:6px;margin:4px 0}@media (hover: hover){.toggle-button:hover{background:var(--cui-base-100)}}.toggle-button:active{background:var(--cui-base-100)}.toggle-button_hidden{visibility:hidden}.title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;text-align:start}.button{--cui-base-50: var(--cui-base-200)}@media (hover: hover){.delete-button{display:none}}.list-wrapper{padding-left:8px}.create-category{margin-left:24px}.icon{padding-right:2px;padding-left:2px;height:28px}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CuiButtonModule) }, { kind: "component", type: i0.forwardRef(() => CuiButtonComponent), selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "theme", "size"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiIconButtonModule) }, { kind: "directive", type: i0.forwardRef(() => CuiLetDirective), selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiSvgModule) }, { kind: "component", type: i0.forwardRef(() => CuiSvgComponent), selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "component", type: i0.forwardRef(() => CuiCategoryTreeFormComponent), selector: "cui-category-tree-form", inputs: ["isDisabled", "defaultTitle"], outputs: ["created", "canceled"] }, { kind: "component", type: i0.forwardRef(() => CuiCreateCategoryTreeItemComponent), selector: "cui-create-category-tree-item", inputs: ["isDisabled"], outputs: ["created", "canceled"] }, { kind: "component", type: i0.forwardRef(() => CuiCategoriesTreeListComponent), selector: "cui-categories-tree-list", inputs: ["storages"], outputs: ["deleted"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10029
10029
|
}
|
|
10030
10030
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CuiCategoryTreeItemComponent, decorators: [{
|
|
10031
10031
|
type: Component,
|
|
@@ -10037,7 +10037,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
10037
10037
|
CuiCategoryTreeFormComponent,
|
|
10038
10038
|
CuiCreateCategoryTreeItemComponent,
|
|
10039
10039
|
forwardRef(() => CuiCategoriesTreeListComponent)
|
|
10040
|
-
], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"toggle-button\"\n [class.toggle-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"storageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-tree-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"button edit-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"button add-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n @if (isDeleteSupported) {\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconTrash\"\n class=\"button delete-button\"\n (click)=\"onDelete($event)\"\n ></button>\n }\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-tree-list\n [storages]=\"storageChildren()\"\n (deleted)=\"onChildDeleted($event)\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-tree-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}.category:hover .delete-button{display:inline-block}}.category:active{background:var(--cui-base-10)}.toggle-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:
|
|
10040
|
+
], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *cuiLet=\"category() as stage\">\n <button\n type=\"button\"\n [style.align-items]=\"alignItems()\"\n class=\"category\"\n (click)=\"onSelectCategory()\"\n >\n <button\n type=\"button\"\n class=\"toggle-button\"\n [class.toggle-button_hidden]=\"isOpenCloseButtonHidden()\"\n (click)=\"onToggleChildren($event)\"\n >\n <cui-svg\n [icon]=\"openCloseButtonIcon()\"\n color=\"var(--cui-base-500)\"\n />\n </button>\n <cui-svg\n [icon]=\"storageIcon()\"\n color=\"var(--cui-base-500)\"\n class=\"icon\"\n />\n @if (isTitleEdit()) {\n <cui-category-tree-form\n [defaultTitle]=\"stage.title\"\n (created)=\"onTitleChanged($event)\"\n (canceled)=\"onCancelTitleEdit()\"\n />\n } @else {\n <span class=\"title\">{{ stage.title }}</span>\n\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconEdit\"\n class=\"button edit-button\"\n (click)=\"onStartTitleEdit($event)\"\n ></button>\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconPlus\"\n class=\"button add-button\"\n (click)=\"onStartCreatingSubcategory($event)\"\n ></button>\n @if (isDeleteSupported) {\n <button\n cuiButton\n type=\"button\"\n appearance=\"ghost\"\n size=\"xxs\"\n icon=\"cuiIconTrash\"\n class=\"button delete-button\"\n (click)=\"onDelete($event)\"\n ></button>\n }\n }\n </button>\n <div\n [hidden]=\"!areChildrenOpened()\"\n class=\"list-wrapper\"\n >\n <cui-categories-tree-list\n [storages]=\"storageChildren()\"\n (deleted)=\"onChildDeleted($event)\"\n />\n @if (isCreateCategoryControlVisible()) {\n <cui-create-category-tree-item\n class=\"create-category\"\n [isDisabled]=\"isSubcategoryCreationLoading()\"\n (created)=\"onCreateNewSubcategory($event)\"\n (canceled)=\"onCreatingSubcategoryCanceled()\"\n />\n }\n </div>\n</ng-container>\n", styles: [".category{display:flex;flex-direction:row;gap:4px;padding:2px 4px;width:100%;min-height:32px;border-radius:8px}@media (hover: hover){.category:hover{background:var(--cui-base-10)}.category:hover .delete-button{display:inline-block}}.category:active{background:var(--cui-base-10)}.toggle-button{display:flex;flex-direction:row;gap:0;padding:2px;border-radius:6px;margin:4px 0}@media (hover: hover){.toggle-button:hover{background:var(--cui-base-100)}}.toggle-button:active{background:var(--cui-base-100)}.toggle-button_hidden{visibility:hidden}.title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;text-align:start}.button{--cui-base-50: var(--cui-base-200)}@media (hover: hover){.delete-button{display:none}}.list-wrapper{padding-left:8px}.create-category{margin-left:24px}.icon{padding-right:2px;padding-left:2px;height:28px}\n"] }]
|
|
10041
10041
|
}], ctorParameters: () => [] });
|
|
10042
10042
|
|
|
10043
10043
|
class CuiCategoriesTreeComponent {
|
|
@@ -12447,7 +12447,7 @@ class ButtonChangeThemeComponent {
|
|
|
12447
12447
|
this.cuiThemeService.next(theme);
|
|
12448
12448
|
}
|
|
12449
12449
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ButtonChangeThemeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12450
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ButtonChangeThemeComponent, isStandalone: true, selector: "cui-button-change-theme", ngImport: i0, template: "@let currentTheme = theme$ | async;\n\n<ng-container *transloco=\"let t\">\n<button type=\"button\"\n class=\"custom-button\">\n <div class=\"content-button\">\n <cui-svg icon=\"cuiIconPaletteSm\" />\n <div class=\"text-and-sub-button\">\n {{ t('SWITCH_THEME') }}\n <div class=\"group-sub-button\">\n <div\n [class.button-select]=\"currentTheme === 'dark'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconMoon\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('dark')\"\n />\n </div>\n <div\n [class.button-select]=\"currentTheme === 'light'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconSun\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('light')\"\n />\n </div>\n </div>\n </div>\n </div>\n</button>\n</ng-container>\n", styles: [".content-button{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;padding-right:8px;padding-left:8px;height:36px;color:var(--cui-base-900)}.text-and-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:space-between;width:100%}.group-sub-button{display:flex;flex-direction:row;gap:4px}.container-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:center;text-transform:capitalize;border:solid 1px var(--cui-base-200);border-radius:
|
|
12450
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ButtonChangeThemeComponent, isStandalone: true, selector: "cui-button-change-theme", ngImport: i0, template: "@let currentTheme = theme$ | async;\n\n<ng-container *transloco=\"let t\">\n<button type=\"button\"\n class=\"custom-button\">\n <div class=\"content-button\">\n <cui-svg icon=\"cuiIconPaletteSm\" />\n <div class=\"text-and-sub-button\">\n {{ t('SWITCH_THEME') }}\n <div class=\"group-sub-button\">\n <div\n [class.button-select]=\"currentTheme === 'dark'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconMoon\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('dark')\"\n />\n </div>\n <div\n [class.button-select]=\"currentTheme === 'light'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconSun\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('light')\"\n />\n </div>\n </div>\n </div>\n </div>\n</button>\n</ng-container>\n", styles: [".content-button{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;padding-right:8px;padding-left:8px;height:36px;color:var(--cui-base-900)}.text-and-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:space-between;width:100%}.group-sub-button{display:flex;flex-direction:row;gap:4px}.container-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:center;text-transform:capitalize;border:solid 1px var(--cui-base-200);border-radius:6px;width:28px;height:28px}.button-select{border:solid 1px var(--cui-badge-blue-border);background-color:var(--cui-badge-blue-bg)}.custom-button{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }] }); }
|
|
12451
12451
|
}
|
|
12452
12452
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ButtonChangeThemeComponent, decorators: [{
|
|
12453
12453
|
type: Component,
|
|
@@ -12455,7 +12455,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
12455
12455
|
CuiSvgModule,
|
|
12456
12456
|
AsyncPipe,
|
|
12457
12457
|
TranslocoDirective
|
|
12458
|
-
], template: "@let currentTheme = theme$ | async;\n\n<ng-container *transloco=\"let t\">\n<button type=\"button\"\n class=\"custom-button\">\n <div class=\"content-button\">\n <cui-svg icon=\"cuiIconPaletteSm\" />\n <div class=\"text-and-sub-button\">\n {{ t('SWITCH_THEME') }}\n <div class=\"group-sub-button\">\n <div\n [class.button-select]=\"currentTheme === 'dark'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconMoon\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('dark')\"\n />\n </div>\n <div\n [class.button-select]=\"currentTheme === 'light'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconSun\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('light')\"\n />\n </div>\n </div>\n </div>\n </div>\n</button>\n</ng-container>\n", styles: [".content-button{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;padding-right:8px;padding-left:8px;height:36px;color:var(--cui-base-900)}.text-and-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:space-between;width:100%}.group-sub-button{display:flex;flex-direction:row;gap:4px}.container-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:center;text-transform:capitalize;border:solid 1px var(--cui-base-200);border-radius:
|
|
12458
|
+
], template: "@let currentTheme = theme$ | async;\n\n<ng-container *transloco=\"let t\">\n<button type=\"button\"\n class=\"custom-button\">\n <div class=\"content-button\">\n <cui-svg icon=\"cuiIconPaletteSm\" />\n <div class=\"text-and-sub-button\">\n {{ t('SWITCH_THEME') }}\n <div class=\"group-sub-button\">\n <div\n [class.button-select]=\"currentTheme === 'dark'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconMoon\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('dark')\"\n />\n </div>\n <div\n [class.button-select]=\"currentTheme === 'light'\"\n class=\"container-sub-button\"\n >\n <cui-svg\n icon=\"cuiIconSun\"\n color=\"var(--cui-base-500)\"\n (click)=\"onChangeTheme('light')\"\n />\n </div>\n </div>\n </div>\n </div>\n</button>\n</ng-container>\n", styles: [".content-button{display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start;padding-right:8px;padding-left:8px;height:36px;color:var(--cui-base-900)}.text-and-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:space-between;width:100%}.group-sub-button{display:flex;flex-direction:row;gap:4px}.container-sub-button{display:flex;flex-direction:row;gap:0;align-items:center;justify-content:center;text-transform:capitalize;border:solid 1px var(--cui-base-200);border-radius:6px;width:28px;height:28px}.button-select{border:solid 1px var(--cui-badge-blue-border);background-color:var(--cui-badge-blue-bg)}.custom-button{width:100%}\n"] }]
|
|
12459
12459
|
}] });
|
|
12460
12460
|
|
|
12461
12461
|
class CuiUserActionContextMenuComponent {
|