@leanix/components 0.3.109 → 0.3.111
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/esm2020/lib/forms-ui/components/expanded-dropdown/expanded-dropdown.component.mjs +4 -21
- package/esm2020/lib/forms-ui/components/select-list/select-list.component.mjs +21 -16
- package/fesm2015/leanix-components.mjs +22 -34
- package/fesm2015/leanix-components.mjs.map +1 -1
- package/fesm2020/leanix-components.mjs +22 -34
- package/fesm2020/leanix-components.mjs.map +1 -1
- package/lib/forms-ui/components/expanded-dropdown/expanded-dropdown.component.d.ts +3 -9
- package/lib/forms-ui/components/select-list/select-list.component.d.ts +3 -3
- package/package.json +1 -1
|
@@ -3636,35 +3636,18 @@ class ExpandedDropdownComponent extends KeyboardSelectDirective {
|
|
|
3636
3636
|
super(...arguments);
|
|
3637
3637
|
this.NAME = 'BasicDropdownComponent';
|
|
3638
3638
|
this.options = [];
|
|
3639
|
-
this.defaultOptions = [];
|
|
3640
3639
|
this.onChooseItem = new EventEmitter();
|
|
3641
|
-
this.onItemSelected = new EventEmitter();
|
|
3642
|
-
}
|
|
3643
|
-
selectOption(option) {
|
|
3644
|
-
this.onItemSelected.emit(this.defaultOptions.findIndex((element) => element == option));
|
|
3645
|
-
}
|
|
3646
|
-
chooseItem() {
|
|
3647
|
-
this.onChooseItem.emit();
|
|
3648
3640
|
}
|
|
3649
3641
|
}
|
|
3650
3642
|
ExpandedDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ExpandedDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3651
|
-
ExpandedDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ExpandedDropdownComponent, selector: "lx-expanded-dropdown", inputs: { options: "options"
|
|
3643
|
+
ExpandedDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ExpandedDropdownComponent, selector: "lx-expanded-dropdown", inputs: { options: "options" }, outputs: { onChooseItem: "onChooseItem" }, usesInheritance: true, ngImport: i0, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n <li\n *ngFor=\"let option of options; let index = index\"\n tabindex=\"-1\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n class=\"option keyboardSelectable\"\n (click)=\"onChooseItem.emit(option.id)\"\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container>\n <ng-container *ngTemplateOutlet=\"simpleStringDisplay; context: { $implicit: option, index: index }\"></ng-container>\n </ng-container>\n <ng-template #simpleStringDisplay>\n <span [title]=\"option.name\">\n {{ option.name }}\n </span>\n </ng-template>\n <div class=\"iconContainer\">\n <svg\n width=\"32px\"\n height=\"32px\"\n viewBox=\"0 0 32 32\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n >\n <title>Button/Text/Primary/Medium</title>\n <g id=\"choose-workspace-D\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <g id=\"choose-a-workspace-D\" transform=\"translate(-911.000000, -429.000000)\">\n <g id=\"Group-3\" transform=\"translate(471.000000, 249.000000)\">\n <g id=\"Button/Text/Primary/Medium\" transform=\"translate(440.000000, 180.000000)\">\n <g id=\"UI/Shape/Rectangle-rounded-2px\" fill=\"#1666EE\">\n <circle id=\"\uD83C\uDFA8-Style\" cx=\"16\" cy=\"16\" r=\"16\"></circle>\n </g>\n <g id=\"Icons/basic/refresh\" transform=\"translate(7.000000, 11.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">\n <g id=\"arrow-right\" transform=\"translate(3.772240, 0.000000)\">\n <path\n d=\"M5.41769476,0.0873198725 L4.92588162,0.579133017 C4.80947996,0.695534673 4.80947996,0.88427129 4.92588162,1.00069779 L8.77935771,4.85414904 L0.298083627,4.85414904 C0.133466944,4.85414904 0,4.98761598 0,5.15223266 L0,5.84776113 C0,6.01237781 0.133466944,6.14584475 0.298083627,6.14584475 L8.77935771,6.14584475 L4.92588162,9.99932084 C4.80947996,10.1157225 4.80947996,10.3044591 4.92588162,10.4208856 L5.41769476,10.9126988 C5.53409642,11.0291004 5.72283304,11.0291004 5.83925953,10.9126988 L11.0411666,5.7107917 C11.1575682,5.59439004 11.1575682,5.40565343 11.0411666,5.28922693 L5.83923469,0.0873198725 C5.72283304,-0.0291066242 5.53409642,-0.0291066242 5.41769476,0.0873198725 Z\"\n id=\"Path\"\n ></path>\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </div>\n </li>\n</ul>\n", styles: [".options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:200px}.options:hover .selected{background-color:#fff}.optionSearch{padding:2px}.option{display:flex;justify-content:space-between;font-size:14px;height:40px;align-items:center;padding:4px 12px;border-bottom:1px solid #e1e5eb}.option:hover{background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconContainer{display:none}.option:hover .iconContainer{display:flex}\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: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3652
3644
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ExpandedDropdownComponent, decorators: [{
|
|
3653
3645
|
type: Component,
|
|
3654
|
-
args: [{ selector: 'lx-expanded-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"
|
|
3646
|
+
args: [{ selector: 'lx-expanded-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n <li\n *ngFor=\"let option of options; let index = index\"\n tabindex=\"-1\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n class=\"option keyboardSelectable\"\n (click)=\"onChooseItem.emit(option.id)\"\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container>\n <ng-container *ngTemplateOutlet=\"simpleStringDisplay; context: { $implicit: option, index: index }\"></ng-container>\n </ng-container>\n <ng-template #simpleStringDisplay>\n <span [title]=\"option.name\">\n {{ option.name }}\n </span>\n </ng-template>\n <div class=\"iconContainer\">\n <svg\n width=\"32px\"\n height=\"32px\"\n viewBox=\"0 0 32 32\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n >\n <title>Button/Text/Primary/Medium</title>\n <g id=\"choose-workspace-D\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <g id=\"choose-a-workspace-D\" transform=\"translate(-911.000000, -429.000000)\">\n <g id=\"Group-3\" transform=\"translate(471.000000, 249.000000)\">\n <g id=\"Button/Text/Primary/Medium\" transform=\"translate(440.000000, 180.000000)\">\n <g id=\"UI/Shape/Rectangle-rounded-2px\" fill=\"#1666EE\">\n <circle id=\"\uD83C\uDFA8-Style\" cx=\"16\" cy=\"16\" r=\"16\"></circle>\n </g>\n <g id=\"Icons/basic/refresh\" transform=\"translate(7.000000, 11.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">\n <g id=\"arrow-right\" transform=\"translate(3.772240, 0.000000)\">\n <path\n d=\"M5.41769476,0.0873198725 L4.92588162,0.579133017 C4.80947996,0.695534673 4.80947996,0.88427129 4.92588162,1.00069779 L8.77935771,4.85414904 L0.298083627,4.85414904 C0.133466944,4.85414904 0,4.98761598 0,5.15223266 L0,5.84776113 C0,6.01237781 0.133466944,6.14584475 0.298083627,6.14584475 L8.77935771,6.14584475 L4.92588162,9.99932084 C4.80947996,10.1157225 4.80947996,10.3044591 4.92588162,10.4208856 L5.41769476,10.9126988 C5.53409642,11.0291004 5.72283304,11.0291004 5.83925953,10.9126988 L11.0411666,5.7107917 C11.1575682,5.59439004 11.1575682,5.40565343 11.0411666,5.28922693 L5.83923469,0.0873198725 C5.72283304,-0.0291066242 5.53409642,-0.0291066242 5.41769476,0.0873198725 Z\"\n id=\"Path\"\n ></path>\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </div>\n </li>\n</ul>\n", styles: [".options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:200px}.options:hover .selected{background-color:#fff}.optionSearch{padding:2px}.option{display:flex;justify-content:space-between;font-size:14px;height:40px;align-items:center;padding:4px 12px;border-bottom:1px solid #e1e5eb}.option:hover{background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconContainer{display:none}.option:hover .iconContainer{display:flex}\n"] }]
|
|
3655
3647
|
}], propDecorators: { options: [{
|
|
3656
3648
|
type: Input
|
|
3657
|
-
}], defaultOptions: [{
|
|
3658
|
-
type: Input
|
|
3659
|
-
}], searchKey: [{
|
|
3660
|
-
type: Input
|
|
3661
3649
|
}], onChooseItem: [{
|
|
3662
3650
|
type: Output
|
|
3663
|
-
}], onItemSelected: [{
|
|
3664
|
-
type: Output
|
|
3665
|
-
}], optionTemplateRef: [{
|
|
3666
|
-
type: ContentChild,
|
|
3667
|
-
args: ['optionTemplate']
|
|
3668
3651
|
}] } });
|
|
3669
3652
|
|
|
3670
3653
|
class FormErrorComponent {
|
|
@@ -5189,25 +5172,30 @@ class SelectListComponent extends BaseSelectDirective {
|
|
|
5189
5172
|
});
|
|
5190
5173
|
keyboardEvents.enter$.subscribe(() => {
|
|
5191
5174
|
if (this.searchInput.nativeElement.value === '') {
|
|
5192
|
-
this.onChooseItem.emit();
|
|
5175
|
+
this.onChooseItem.emit(this.selection.id);
|
|
5193
5176
|
}
|
|
5194
|
-
else {
|
|
5195
|
-
|
|
5196
|
-
this.selectOption(newSelectedIndex);
|
|
5177
|
+
else if (this.dropdownComponent.options.length) {
|
|
5178
|
+
this.onChooseItem.emit(this.dropdownComponent.options[this.highlightedIndex].id);
|
|
5197
5179
|
}
|
|
5198
5180
|
});
|
|
5199
5181
|
this.focusAndOpen();
|
|
5200
5182
|
}
|
|
5201
5183
|
selectOption(index) {
|
|
5202
|
-
this.selection
|
|
5203
|
-
|
|
5204
|
-
|
|
5205
|
-
|
|
5206
|
-
|
|
5184
|
+
if (this.determineHighlightIndex(this.options, this.selection) === index) {
|
|
5185
|
+
this.onChooseItem.emit(this.selection.id);
|
|
5186
|
+
}
|
|
5187
|
+
else if (index !== -1) {
|
|
5188
|
+
this.selection = this.options[index];
|
|
5189
|
+
this.selectionChange.emit(this.selection);
|
|
5190
|
+
this.open.next(false);
|
|
5191
|
+
this.focusAndOpen();
|
|
5192
|
+
this.dropdownComponent?.select(index);
|
|
5193
|
+
}
|
|
5207
5194
|
}
|
|
5208
5195
|
searchKeyChanged(event) {
|
|
5209
|
-
if (event.target.value === ''
|
|
5210
|
-
this.
|
|
5196
|
+
if (event.target.value === '' && !['ArrowUp', 'ArrowDown'].includes(event.key)) {
|
|
5197
|
+
this.highlightedIndex = this.determineHighlightIndex(this.dropdownComponent.options, this.selection);
|
|
5198
|
+
this.dropdownComponent.select(this.highlightedIndex);
|
|
5211
5199
|
}
|
|
5212
5200
|
else if (event.key.length === 1 || ['Backspace', 'Delete'].includes(event.key)) {
|
|
5213
5201
|
this.highlightedIndex = 0;
|
|
@@ -5219,16 +5207,16 @@ class SelectListComponent extends BaseSelectDirective {
|
|
|
5219
5207
|
}
|
|
5220
5208
|
}
|
|
5221
5209
|
SelectListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: SelectListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5222
|
-
SelectListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: SelectListComponent, selector: "lx-select-list", inputs: { searchPlaceholder: "searchPlaceholder",
|
|
5210
|
+
SelectListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: SelectListComponent, selector: "lx-select-list", inputs: { searchPlaceholder: "searchPlaceholder", options: "options", selection: "selection" }, outputs: { selectionChange: "selectionChange", onChooseItem: "onChooseItem" }, queries: [{ propertyName: "explicitDropdown", first: true, predicate: SelectDropdownDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "dropdownComponent", first: true, predicate: ExpandedDropdownComponent, descendants: true }], viewQueries: [{ propertyName: "implicitSelectedOption", first: true, predicate: ["selectedOption"], descendants: true, static: true }, { propertyName: "implicitDropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"selectContainer focused\">\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n <div class=\"searchWrapper\">\n <input\n #searchInput\n id=\"searchInput\"\n class=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n (keyup)=\"searchKeyChanged($event)\"\n [formControl]=\"queryControl\"\n [placeholder]=\"searchPlaceholder\"\n />\n <label for=\"searchInput\" class=\"fa fa-search\"></label>\n </div>\n </div>\n </div>\n <div class=\"optionsContainer\" #optionsContainer>\n <ng-container>\n <ng-container *ngTemplateOutlet=\"dropdownTmpl\"></ng-container>\n </ng-container>\n </div>\n</div>\n\n<ng-template #selectedOption>\n <ng-content select=\".selectedOption\"></ng-content>\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\"></ng-content>\n</ng-template>\n", styles: [".selectContainer{position:relative;height:auto;padding:0;box-sizing:border-box;z-index:1049;background:#fff;border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0;border:none;box-shadow:none;font-size:14px}.selectContainer .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 6px 6px #21252933;top:100%;border-top:0;border-top-left-radius:0;border-top-right-radius:0;border:none;border-top:1px solid #e1e5eb;box-shadow:none;margin-top:1px}.selectContainer .inputContainer,.selectContainer .searchInput,.selectContainer .selection,.selectContainer .iconContainer{height:29px}.selectContainer .inputContainer{line-height:29px}.selectContainer .selectionContainer{min-height:29px}.selectionContainer{display:flex}.inputContainer{flex:1;position:relative;white-space:nowrap}.searchInput{width:100%;-webkit-appearance:none;appearance:none;padding-left:27px;border:0;background:transparent;position:relative;cursor:inherit}.searchInput::-ms-clear{display:none}.searchInput:focus{outline:0}.iconContainer{display:flex;align-items:center;text-align:center}.fa-search{position:absolute;left:3px;top:calc(50% - .5em);color:#526179}.searchWrapper{position:relative}.selection{width:100%;position:absolute;display:flex;align-items:center}.selection.lowerOpacity{opacity:.7}.optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;border-radius:3px;background:#fff;z-index:1001}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
5223
5211
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: SelectListComponent, decorators: [{
|
|
5224
5212
|
type: Component,
|
|
5225
|
-
args: [{ selector: 'lx-select-list', template: "<div class=\"selectContainer focused\">\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n <div class=\"searchWrapper\">\n <input\n #searchInput\n id=\"searchInput\"\n class=\"searchInput\"\n type=\"text\"\n (keyup)=\"searchKeyChanged($event)\"\n [formControl]=\"queryControl\"\n [placeholder]=\"searchPlaceholder\"\n />\n <label for=\"searchInput\" class=\"fa fa-search\"></label>\n </div>\n </div>\n </div>\n <div class=\"optionsContainer\" #optionsContainer>\n <ng-container>\n <ng-container *ngTemplateOutlet=\"dropdownTmpl\"></ng-container>\n </ng-container>\n </div>\n</div>\n\n<ng-template #selectedOption>\n <ng-content select=\".selectedOption\"></ng-content>\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\"></ng-content>\n</ng-template>\n", styles: [".selectContainer{position:relative;height:auto;padding:0;box-sizing:border-box;z-index:1049;background:#fff;border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0;border:none;box-shadow:none;font-size:14px}.selectContainer .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 6px 6px #21252933;top:100%;border-top:0;border-top-left-radius:0;border-top-right-radius:0;border:none;border-top:1px solid #e1e5eb;box-shadow:none;margin-top:1px}.selectContainer .inputContainer,.selectContainer .searchInput,.selectContainer .selection,.selectContainer .iconContainer{height:29px}.selectContainer .inputContainer{line-height:29px}.selectContainer .selectionContainer{min-height:29px}.selectionContainer{display:flex}.inputContainer{flex:1;position:relative;white-space:nowrap}.searchInput{width:100%;-webkit-appearance:none;appearance:none;padding-left:27px;border:0;background:transparent;position:relative;cursor:inherit}.searchInput::-ms-clear{display:none}.searchInput:focus{outline:0}.iconContainer{display:flex;align-items:center;text-align:center}.fa-search{position:absolute;left:3px;top:calc(50% - .5em);color:#526179}.searchWrapper{position:relative}.selection{width:100%;position:absolute;display:flex;align-items:center}.selection.lowerOpacity{opacity:.7}.optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;border-radius:3px;background:#fff;z-index:1001}\n"] }]
|
|
5213
|
+
args: [{ selector: 'lx-select-list', template: "<div class=\"selectContainer focused\">\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n <div class=\"searchWrapper\">\n <input\n #searchInput\n id=\"searchInput\"\n class=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n (keyup)=\"searchKeyChanged($event)\"\n [formControl]=\"queryControl\"\n [placeholder]=\"searchPlaceholder\"\n />\n <label for=\"searchInput\" class=\"fa fa-search\"></label>\n </div>\n </div>\n </div>\n <div class=\"optionsContainer\" #optionsContainer>\n <ng-container>\n <ng-container *ngTemplateOutlet=\"dropdownTmpl\"></ng-container>\n </ng-container>\n </div>\n</div>\n\n<ng-template #selectedOption>\n <ng-content select=\".selectedOption\"></ng-content>\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\"></ng-content>\n</ng-template>\n", styles: [".selectContainer{position:relative;height:auto;padding:0;box-sizing:border-box;z-index:1049;background:#fff;border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0;border:none;box-shadow:none;font-size:14px}.selectContainer .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 6px 6px #21252933;top:100%;border-top:0;border-top-left-radius:0;border-top-right-radius:0;border:none;border-top:1px solid #e1e5eb;box-shadow:none;margin-top:1px}.selectContainer .inputContainer,.selectContainer .searchInput,.selectContainer .selection,.selectContainer .iconContainer{height:29px}.selectContainer .inputContainer{line-height:29px}.selectContainer .selectionContainer{min-height:29px}.selectionContainer{display:flex}.inputContainer{flex:1;position:relative;white-space:nowrap}.searchInput{width:100%;-webkit-appearance:none;appearance:none;padding-left:27px;border:0;background:transparent;position:relative;cursor:inherit}.searchInput::-ms-clear{display:none}.searchInput:focus{outline:0}.iconContainer{display:flex;align-items:center;text-align:center}.fa-search{position:absolute;left:3px;top:calc(50% - .5em);color:#526179}.searchWrapper{position:relative}.selection{width:100%;position:absolute;display:flex;align-items:center}.selection.lowerOpacity{opacity:.7}.optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;border-radius:3px;background:#fff;z-index:1001}\n"] }]
|
|
5226
5214
|
}], propDecorators: { searchPlaceholder: [{
|
|
5227
5215
|
type: Input
|
|
5228
|
-
}], selection: [{
|
|
5229
|
-
type: Input
|
|
5230
5216
|
}], options: [{
|
|
5231
5217
|
type: Input
|
|
5218
|
+
}], selection: [{
|
|
5219
|
+
type: Input
|
|
5232
5220
|
}], selectionChange: [{
|
|
5233
5221
|
type: Output
|
|
5234
5222
|
}], onChooseItem: [{
|