@stemy/ngx-utils 19.9.54 → 19.9.55
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.
|
@@ -8894,13 +8894,13 @@ class ChipsComponent {
|
|
|
8894
8894
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ChipsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8895
8895
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: ChipsComponent, isStandalone: false, selector: "chips", inputs: { testId: "testId", value: "value", multiple: "multiple", disabled: "disabled", type: "type", min: "min", max: "max", minLength: "minLength", maxLength: "maxLength", step: "step", placeholder: "placeholder", unique: "unique", strict: "strict", options: "options" }, outputs: { valueChange: "valueChange" }, providers: [
|
|
8896
8896
|
{ provide: NG_VALUE_ACCESSOR, useExisting: ChipsComponent, multi: true }
|
|
8897
|
-
], viewQueries: [{ propertyName: "chipDropdown", first: true, predicate: ["chipDropdown"], descendants: true }, { propertyName: "chipButtons", first: true, predicate: ["chipButtons"], descendants: true }, { propertyName: "chipInput", first: true, predicate: ["chipInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div dd attachTo=\"root\" [closeInside]=\"false\" [autoPlacement]=\"autoPlacement\" [ngClass]=\"{disabled: disabled}\"\r\n class=\"chips\" #chipDropdown=\"dropdown\">\r\n <input class=\"chips-input\" dropdownToggle [switch]=\"false\" [attr.data-testid]=\"testId + '-input'\"\r\n [type]=\"type == 'number' ? 'number': 'text'\" [min]=\"min\" [max]=\"max\" [step]=\"step\" [disabled]=\"disabled\"\r\n [placeholder]=\"valueOptions.length == 0 && placeholder | translate\" [ngStyle]=\"inputStyles\"\r\n (blur)=\"onBlur($event)\" (keyup)=\"onInput($event)\" #chipInput />\r\n <div class=\"chips-buttons\" #chipButtons [ngClass]=\"{disabled: disabled}\" (resize)=\"onResize()\">\r\n <ng-container *ngFor=\"let item of valueOptions; let ix = index; trackBy:trackBy\">\r\n <a class=\"chips-button\" [ngClass]=\"'chips-' + statuses[ix]\" (dblclick)=\"removeItem($event, ix)\">\r\n @if (item.picture) {\r\n <img [src]=\"item.picture | safe:'url'\" class=\"chip-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"item.label\">\r\n\r\n }\r\n <span class=\"chips-label\" [attr.data-testid]=\"testId + '-label-' + ix\">{{ item.label }} </span>\r\n <close-btn class=\"chips-remove\" [attr.data-testid]=\"testId + '-delete-' + ix\"\r\n (click)=\"removeItem($event, ix)\" *ngIf=\"!disabled\"></close-btn>\r\n </a>\r\n </ng-container>\r\n </div>\r\n @if (options) {\r\n <div class=\"chips-dropdown\" *dropdownContent>\r\n <button [ngClass]=\"option.classes\" [disabled]=\"option.disabled\" (click)=\"enterOption(option.value)\"\r\n *ngFor=\"let option of filteredOptions\">\r\n <div class=\"select-option\">\r\n @if (option?.picture) {\r\n <img [src]=\"option.picture | safe:'url'\" class=\"select-option-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"option.label\">\r\n }\r\n <div class=\"select-option-label\">\r\n {{ option.label }}\r\n </div>\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n</div>", styles: [".chips{--chips-border-size: var(--border-size, 1px);--chips-border-radius: var(--border-radius, 5px);--chips-top-border-radius: var(--chips-border-radius) var(--chips-border-radius) 0 0;--chips-bottom-border-radius: 0 0 var(--chips-border-radius) var(--chips-border-radius);--chips-bg-color: var(--bg-color, #ffffff);--chips-border-color: var(--border-color, #ced4da);--chips-highlight-color: var(--highlight-color, var(--primary-color, #888888));--chips-highlight-text-color: var(--highlight-text-color, #ffffff);--chips-text-color: var(--text-color, #151515);--chips-text-size: var(--text-size, 16px);--chips-padding-vertical: 6px;--chips-padding-horizontal: 12px;--chips-padding: var(--chips-padding-vertical) var(--chips-padding-horizontal);--chips-btn-padding: 12px;--chips-btn-gap: calc(var(--chips-btn-padding) / 2);--chips-btn-color: white;--chips-btn-valid-color: rgba(200, 255, 200, .7);--chips-btn-invalid-color: rgba(255, 200, 200, .7);position:relative;margin:5px 0;font-size:var(--chips-text-size);padding:var(--chips-padding);background:var(--chips-bg-color);color:var(--chips-text-color);border:var(--chips-border-size) solid var(--chips-border-color);border-radius:var(--chips-border-radius)}.chips *{box-sizing:border-box}.chips .chips-input{background:var(--chips-bg-color);padding:var(--chips-padding);font-size:var(--chips-text-size);outline:none;border:none;width:100%;-webkit-user-select:none;user-select:none;font-weight:400}.chips .chips-buttons{position:absolute;top:var(--chips-padding-vertical);left:var(--chips-padding-horizontal);max-width:calc(100% - var(--chips-padding-horizontal) * 2);display:flex;gap:5px;
|
|
8897
|
+
], viewQueries: [{ propertyName: "chipDropdown", first: true, predicate: ["chipDropdown"], descendants: true }, { propertyName: "chipButtons", first: true, predicate: ["chipButtons"], descendants: true }, { propertyName: "chipInput", first: true, predicate: ["chipInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div dd attachTo=\"root\" [closeInside]=\"false\" [autoPlacement]=\"autoPlacement\" [ngClass]=\"{disabled: disabled}\"\r\n class=\"chips\" #chipDropdown=\"dropdown\">\r\n <input class=\"chips-input\" dropdownToggle [switch]=\"false\" [attr.data-testid]=\"testId + '-input'\"\r\n [type]=\"type == 'number' ? 'number': 'text'\" [min]=\"min\" [max]=\"max\" [step]=\"step\" [disabled]=\"disabled\"\r\n [placeholder]=\"valueOptions.length == 0 && placeholder | translate\" [ngStyle]=\"inputStyles\"\r\n (blur)=\"onBlur($event)\" (keyup)=\"onInput($event)\" #chipInput />\r\n <div class=\"chips-buttons\" #chipButtons [ngClass]=\"{disabled: disabled}\" (resize)=\"onResize()\">\r\n <ng-container *ngFor=\"let item of valueOptions; let ix = index; trackBy:trackBy\">\r\n <a class=\"chips-button\" [ngClass]=\"'chips-' + statuses[ix]\" (dblclick)=\"removeItem($event, ix)\">\r\n @if (item.picture) {\r\n <img [src]=\"item.picture | safe:'url'\" class=\"chip-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"item.label\">\r\n\r\n }\r\n <span class=\"chips-label\" [attr.data-testid]=\"testId + '-label-' + ix\">{{ item.label }} </span>\r\n <close-btn class=\"chips-remove\" [attr.data-testid]=\"testId + '-delete-' + ix\"\r\n (click)=\"removeItem($event, ix)\" *ngIf=\"!disabled\"></close-btn>\r\n </a>\r\n </ng-container>\r\n </div>\r\n @if (options) {\r\n <div class=\"chips-dropdown\" *dropdownContent>\r\n <button [ngClass]=\"option.classes\" [disabled]=\"option.disabled\" (click)=\"enterOption(option.value)\"\r\n *ngFor=\"let option of filteredOptions\">\r\n <div class=\"select-option\">\r\n @if (option?.picture) {\r\n <img [src]=\"option.picture | safe:'url'\" class=\"select-option-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"option.label\">\r\n }\r\n <div class=\"select-option-label\">\r\n {{ option.label }}\r\n </div>\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n</div>", styles: [".chips{--chips-border-size: var(--border-size, 1px);--chips-border-radius: var(--border-radius, 5px);--chips-top-border-radius: var(--chips-border-radius) var(--chips-border-radius) 0 0;--chips-bottom-border-radius: 0 0 var(--chips-border-radius) var(--chips-border-radius);--chips-bg-color: var(--bg-color, #ffffff);--chips-border-color: var(--border-color, #ced4da);--chips-highlight-color: var(--highlight-color, var(--primary-color, #888888));--chips-highlight-text-color: var(--highlight-text-color, #ffffff);--chips-text-color: var(--text-color, #151515);--chips-text-size: var(--text-size, 16px);--chips-padding-vertical: 6px;--chips-padding-horizontal: 12px;--chips-padding: var(--chips-padding-vertical) var(--chips-padding-horizontal);--chips-btn-padding: 12px;--chips-btn-gap: calc(var(--chips-btn-padding) / 2);--chips-btn-color: white;--chips-btn-valid-color: rgba(200, 255, 200, .7);--chips-btn-invalid-color: rgba(255, 200, 200, .7);position:relative;margin:5px 0;font-size:var(--chips-text-size);padding:var(--chips-padding);background:var(--chips-bg-color);color:var(--chips-text-color);border:var(--chips-border-size) solid var(--chips-border-color);border-radius:var(--chips-border-radius)}.chips *{box-sizing:border-box}.chips .chips-input{background:var(--chips-bg-color);padding:var(--chips-padding);font-size:var(--chips-text-size);outline:none;border:none;width:100%;-webkit-user-select:none;user-select:none;font-weight:400}.chips .chips-buttons{position:absolute;top:var(--chips-padding-vertical);left:var(--chips-padding-horizontal);max-width:calc(100% - var(--chips-padding-horizontal) * 2);display:flex;gap:5px;border-radius:var(--chips-border-radius);flex-wrap:wrap;overflow-x:hidden;overflow-y:auto}.chips .chips-button{background:var(--chipd-btn-color);color:var(--chips-text-color);border:var(--chips-border-size) solid rgba(0,0,0,.2);border-radius:var(--chips-border-radius);padding:var(--chips-padding-vertical) var(--chips-btn-gap) var(--chips-padding-vertical) var(--chips-btn-padding);-webkit-user-select:none;user-select:none;font-weight:400;outline:none;display:flex;gap:var(--chips-btn-gap);justify-content:center;align-items:center;line-height:1.2rem;text-decoration:none}.chips .chips-button.chips-valid{--chipd-btn-color: var(--chips-btn-valid-color) }.chips .chips-button.chips-invalid{--chipd-btn-color: var(--chips-btn-invalid-color) }.chips img.chip-picture{width:28px;height:28px;object-fit:cover}.chips .chips-label{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chips.disabled{opacity:.75}.chips.disabled .chips-button{padding-right:var(--chips-btn-padding)}.chips-dropdown:not(:empty){position:relative;z-index:1;width:var(--toggle-width, 0);display:flex;flex-direction:column;margin:-3px 0;padding:0;list-style:none;border:var(--chips-border-size) solid var(--chips-border-color);background:var(--chips-bg-color);border-radius:var(--chips-bottom-border-radius);overflow:hidden}.chips-dropdown:not(:empty) *{box-sizing:border-box}.chips-dropdown:not(:empty) button{border:none;background:none;cursor:pointer;padding:6px 12px;-webkit-user-select:none;user-select:none;text-align:left}.chips-dropdown:not(:empty) button:hover,.chips-dropdown:not(:empty) button.active{background-color:var(--chips-highlight-color);color:var(--chips-highlight-text-color)}.chips-dropdown:not(:empty) button:hover a,.chips-dropdown:not(:empty) button.active a{color:var(--chips-highlight-text-color)}.chips-dropdown:not(:empty) .select-option{display:flex;gap:8px;align-items:center;justify-content:center}.chips-dropdown:not(:empty) .select-option .select-option-picture{width:32px;height:32px;object-fit:cover}.chips-dropdown:not(:empty) .select-option .select-option-label{flex:1}.dropdown-placement-top .chips-dropdown{border-radius:var(--chips-top-border-radius)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: DropdownDirective, selector: "[dd],[drop-down]", inputs: ["closeInside", "attachTo", "boundary", "placement", "autoPlacement", "mobileViewUnder", "fixed", "keyboardHandler", "isDisabled"], outputs: ["onShown", "onHidden", "onKeyboard"], exportAs: ["dropdown"] }, { kind: "directive", type: DropdownContentDirective, selector: "[dropdownContent]", exportAs: ["dropdown-content"] }, { kind: "directive", type: DropdownToggleDirective, selector: "[dropdownToggle]", inputs: ["beforeOpen", "switch"], exportAs: ["dropdown-toggle"] }, { kind: "component", type: CloseBtnComponent, selector: "close-btn" }, { kind: "pipe", type: SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8898
8898
|
}
|
|
8899
8899
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ChipsComponent, decorators: [{
|
|
8900
8900
|
type: Component,
|
|
8901
8901
|
args: [{ standalone: false, encapsulation: ViewEncapsulation.None, selector: "chips", providers: [
|
|
8902
8902
|
{ provide: NG_VALUE_ACCESSOR, useExisting: ChipsComponent, multi: true }
|
|
8903
|
-
], template: "<div dd attachTo=\"root\" [closeInside]=\"false\" [autoPlacement]=\"autoPlacement\" [ngClass]=\"{disabled: disabled}\"\r\n class=\"chips\" #chipDropdown=\"dropdown\">\r\n <input class=\"chips-input\" dropdownToggle [switch]=\"false\" [attr.data-testid]=\"testId + '-input'\"\r\n [type]=\"type == 'number' ? 'number': 'text'\" [min]=\"min\" [max]=\"max\" [step]=\"step\" [disabled]=\"disabled\"\r\n [placeholder]=\"valueOptions.length == 0 && placeholder | translate\" [ngStyle]=\"inputStyles\"\r\n (blur)=\"onBlur($event)\" (keyup)=\"onInput($event)\" #chipInput />\r\n <div class=\"chips-buttons\" #chipButtons [ngClass]=\"{disabled: disabled}\" (resize)=\"onResize()\">\r\n <ng-container *ngFor=\"let item of valueOptions; let ix = index; trackBy:trackBy\">\r\n <a class=\"chips-button\" [ngClass]=\"'chips-' + statuses[ix]\" (dblclick)=\"removeItem($event, ix)\">\r\n @if (item.picture) {\r\n <img [src]=\"item.picture | safe:'url'\" class=\"chip-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"item.label\">\r\n\r\n }\r\n <span class=\"chips-label\" [attr.data-testid]=\"testId + '-label-' + ix\">{{ item.label }} </span>\r\n <close-btn class=\"chips-remove\" [attr.data-testid]=\"testId + '-delete-' + ix\"\r\n (click)=\"removeItem($event, ix)\" *ngIf=\"!disabled\"></close-btn>\r\n </a>\r\n </ng-container>\r\n </div>\r\n @if (options) {\r\n <div class=\"chips-dropdown\" *dropdownContent>\r\n <button [ngClass]=\"option.classes\" [disabled]=\"option.disabled\" (click)=\"enterOption(option.value)\"\r\n *ngFor=\"let option of filteredOptions\">\r\n <div class=\"select-option\">\r\n @if (option?.picture) {\r\n <img [src]=\"option.picture | safe:'url'\" class=\"select-option-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"option.label\">\r\n }\r\n <div class=\"select-option-label\">\r\n {{ option.label }}\r\n </div>\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n</div>", styles: [".chips{--chips-border-size: var(--border-size, 1px);--chips-border-radius: var(--border-radius, 5px);--chips-top-border-radius: var(--chips-border-radius) var(--chips-border-radius) 0 0;--chips-bottom-border-radius: 0 0 var(--chips-border-radius) var(--chips-border-radius);--chips-bg-color: var(--bg-color, #ffffff);--chips-border-color: var(--border-color, #ced4da);--chips-highlight-color: var(--highlight-color, var(--primary-color, #888888));--chips-highlight-text-color: var(--highlight-text-color, #ffffff);--chips-text-color: var(--text-color, #151515);--chips-text-size: var(--text-size, 16px);--chips-padding-vertical: 6px;--chips-padding-horizontal: 12px;--chips-padding: var(--chips-padding-vertical) var(--chips-padding-horizontal);--chips-btn-padding: 12px;--chips-btn-gap: calc(var(--chips-btn-padding) / 2);--chips-btn-color: white;--chips-btn-valid-color: rgba(200, 255, 200, .7);--chips-btn-invalid-color: rgba(255, 200, 200, .7);position:relative;margin:5px 0;font-size:var(--chips-text-size);padding:var(--chips-padding);background:var(--chips-bg-color);color:var(--chips-text-color);border:var(--chips-border-size) solid var(--chips-border-color);border-radius:var(--chips-border-radius)}.chips *{box-sizing:border-box}.chips .chips-input{background:var(--chips-bg-color);padding:var(--chips-padding);font-size:var(--chips-text-size);outline:none;border:none;width:100%;-webkit-user-select:none;user-select:none;font-weight:400}.chips .chips-buttons{position:absolute;top:var(--chips-padding-vertical);left:var(--chips-padding-horizontal);max-width:calc(100% - var(--chips-padding-horizontal) * 2);display:flex;gap:5px;
|
|
8903
|
+
], template: "<div dd attachTo=\"root\" [closeInside]=\"false\" [autoPlacement]=\"autoPlacement\" [ngClass]=\"{disabled: disabled}\"\r\n class=\"chips\" #chipDropdown=\"dropdown\">\r\n <input class=\"chips-input\" dropdownToggle [switch]=\"false\" [attr.data-testid]=\"testId + '-input'\"\r\n [type]=\"type == 'number' ? 'number': 'text'\" [min]=\"min\" [max]=\"max\" [step]=\"step\" [disabled]=\"disabled\"\r\n [placeholder]=\"valueOptions.length == 0 && placeholder | translate\" [ngStyle]=\"inputStyles\"\r\n (blur)=\"onBlur($event)\" (keyup)=\"onInput($event)\" #chipInput />\r\n <div class=\"chips-buttons\" #chipButtons [ngClass]=\"{disabled: disabled}\" (resize)=\"onResize()\">\r\n <ng-container *ngFor=\"let item of valueOptions; let ix = index; trackBy:trackBy\">\r\n <a class=\"chips-button\" [ngClass]=\"'chips-' + statuses[ix]\" (dblclick)=\"removeItem($event, ix)\">\r\n @if (item.picture) {\r\n <img [src]=\"item.picture | safe:'url'\" class=\"chip-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"item.label\">\r\n\r\n }\r\n <span class=\"chips-label\" [attr.data-testid]=\"testId + '-label-' + ix\">{{ item.label }} </span>\r\n <close-btn class=\"chips-remove\" [attr.data-testid]=\"testId + '-delete-' + ix\"\r\n (click)=\"removeItem($event, ix)\" *ngIf=\"!disabled\"></close-btn>\r\n </a>\r\n </ng-container>\r\n </div>\r\n @if (options) {\r\n <div class=\"chips-dropdown\" *dropdownContent>\r\n <button [ngClass]=\"option.classes\" [disabled]=\"option.disabled\" (click)=\"enterOption(option.value)\"\r\n *ngFor=\"let option of filteredOptions\">\r\n <div class=\"select-option\">\r\n @if (option?.picture) {\r\n <img [src]=\"option.picture | safe:'url'\" class=\"select-option-picture\" referrerpolicy=\"no-referrer\"\r\n [attr.alt]=\"option.label\">\r\n }\r\n <div class=\"select-option-label\">\r\n {{ option.label }}\r\n </div>\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n</div>", styles: [".chips{--chips-border-size: var(--border-size, 1px);--chips-border-radius: var(--border-radius, 5px);--chips-top-border-radius: var(--chips-border-radius) var(--chips-border-radius) 0 0;--chips-bottom-border-radius: 0 0 var(--chips-border-radius) var(--chips-border-radius);--chips-bg-color: var(--bg-color, #ffffff);--chips-border-color: var(--border-color, #ced4da);--chips-highlight-color: var(--highlight-color, var(--primary-color, #888888));--chips-highlight-text-color: var(--highlight-text-color, #ffffff);--chips-text-color: var(--text-color, #151515);--chips-text-size: var(--text-size, 16px);--chips-padding-vertical: 6px;--chips-padding-horizontal: 12px;--chips-padding: var(--chips-padding-vertical) var(--chips-padding-horizontal);--chips-btn-padding: 12px;--chips-btn-gap: calc(var(--chips-btn-padding) / 2);--chips-btn-color: white;--chips-btn-valid-color: rgba(200, 255, 200, .7);--chips-btn-invalid-color: rgba(255, 200, 200, .7);position:relative;margin:5px 0;font-size:var(--chips-text-size);padding:var(--chips-padding);background:var(--chips-bg-color);color:var(--chips-text-color);border:var(--chips-border-size) solid var(--chips-border-color);border-radius:var(--chips-border-radius)}.chips *{box-sizing:border-box}.chips .chips-input{background:var(--chips-bg-color);padding:var(--chips-padding);font-size:var(--chips-text-size);outline:none;border:none;width:100%;-webkit-user-select:none;user-select:none;font-weight:400}.chips .chips-buttons{position:absolute;top:var(--chips-padding-vertical);left:var(--chips-padding-horizontal);max-width:calc(100% - var(--chips-padding-horizontal) * 2);display:flex;gap:5px;border-radius:var(--chips-border-radius);flex-wrap:wrap;overflow-x:hidden;overflow-y:auto}.chips .chips-button{background:var(--chipd-btn-color);color:var(--chips-text-color);border:var(--chips-border-size) solid rgba(0,0,0,.2);border-radius:var(--chips-border-radius);padding:var(--chips-padding-vertical) var(--chips-btn-gap) var(--chips-padding-vertical) var(--chips-btn-padding);-webkit-user-select:none;user-select:none;font-weight:400;outline:none;display:flex;gap:var(--chips-btn-gap);justify-content:center;align-items:center;line-height:1.2rem;text-decoration:none}.chips .chips-button.chips-valid{--chipd-btn-color: var(--chips-btn-valid-color) }.chips .chips-button.chips-invalid{--chipd-btn-color: var(--chips-btn-invalid-color) }.chips img.chip-picture{width:28px;height:28px;object-fit:cover}.chips .chips-label{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chips.disabled{opacity:.75}.chips.disabled .chips-button{padding-right:var(--chips-btn-padding)}.chips-dropdown:not(:empty){position:relative;z-index:1;width:var(--toggle-width, 0);display:flex;flex-direction:column;margin:-3px 0;padding:0;list-style:none;border:var(--chips-border-size) solid var(--chips-border-color);background:var(--chips-bg-color);border-radius:var(--chips-bottom-border-radius);overflow:hidden}.chips-dropdown:not(:empty) *{box-sizing:border-box}.chips-dropdown:not(:empty) button{border:none;background:none;cursor:pointer;padding:6px 12px;-webkit-user-select:none;user-select:none;text-align:left}.chips-dropdown:not(:empty) button:hover,.chips-dropdown:not(:empty) button.active{background-color:var(--chips-highlight-color);color:var(--chips-highlight-text-color)}.chips-dropdown:not(:empty) button:hover a,.chips-dropdown:not(:empty) button.active a{color:var(--chips-highlight-text-color)}.chips-dropdown:not(:empty) .select-option{display:flex;gap:8px;align-items:center;justify-content:center}.chips-dropdown:not(:empty) .select-option .select-option-picture{width:32px;height:32px;object-fit:cover}.chips-dropdown:not(:empty) .select-option .select-option-label{flex:1}.dropdown-placement-top .chips-dropdown{border-radius:var(--chips-top-border-radius)}\n"] }]
|
|
8904
8904
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { testId: [{
|
|
8905
8905
|
type: Input
|
|
8906
8906
|
}], value: [{
|