@indice/ng-components 0.3.2-beta.12 → 0.3.2-beta.13
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/_styles.scss
CHANGED
|
@@ -731,7 +731,7 @@
|
|
|
731
731
|
}
|
|
732
732
|
|
|
733
733
|
.dropdown-button {
|
|
734
|
-
@apply bg-white block w-full rounded-
|
|
734
|
+
@apply bg-white shadow block w-full rounded-lg border-0 pl-3 py-1.5 pr-10 ring-1 ring-inset ring-gray-200 placeholder:text-gray-300 focus:ring-1 focus:ring-inset focus:ring-gray-500
|
|
735
735
|
text-xs leading-6 disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-500 disabled:ring-gray-200;
|
|
736
736
|
}
|
|
737
737
|
|
|
@@ -748,7 +748,7 @@
|
|
|
748
748
|
}
|
|
749
749
|
|
|
750
750
|
.dropdown-ul {
|
|
751
|
-
@apply absolute z-50 mt-1 w-auto bg-white shadow
|
|
751
|
+
@apply absolute z-50 mt-1 w-auto bg-white shadow max-h-60 rounded-lg py-1 text-xs ring-1 ring-gray-300 ring-opacity-5 focus:outline-none overflow-x-hidden;
|
|
752
752
|
}
|
|
753
753
|
|
|
754
754
|
.dropdown-li {
|
|
@@ -4272,7 +4272,7 @@
|
|
|
4272
4272
|
}
|
|
4273
4273
|
|
|
4274
4274
|
.toggle-buttons-list-button {
|
|
4275
|
-
@apply relative inline-flex items-center p-2 first:border-l first:rounded-l-
|
|
4275
|
+
@apply relative inline-flex items-center p-2 first:border-l first:rounded-l-lg last:rounded-r-lg border-t border-b border-r border-gray-300 bg-white text-xs text-gray-700 hover:text-gray-900 focus:z-10 focus:outline-none;
|
|
4276
4276
|
}
|
|
4277
4277
|
|
|
4278
4278
|
.toggle-buttons-list-button-selected {
|
|
@@ -47,11 +47,11 @@ export class DropDownMenuComponent {
|
|
|
47
47
|
this.selectedChanged.emit(option.value);
|
|
48
48
|
}
|
|
49
49
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DropDownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
50
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder", showIcons: ["show-icons", "showIcons"] }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button
|
|
50
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder", showIcons: ["show-icons", "showIcons"] }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button type=\"button\" (click)=\"expanded = !expanded\" class=\"dropdown-button\" aria-haspopup=\"listbox\" aria-expanded=\"true\" aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </button>\r\n <ul title=\"menu\" *ngIf=\"expanded && options && options.length > 0\" class=\"dropdown-ul\" tabindex=\"-1\" role=\"listbox\" aria-labelledby=\"listbox-label\">\r\n <ng-container *ngFor=\"let option of options\">\r\n <li [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\" (click)=\"selectOption(option)\" id=\"listbox-option-0\" role=\"option\">\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg class=\"dropdown-li-selected-indicator\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\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: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
|
|
51
51
|
}
|
|
52
52
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DropDownMenuComponent, decorators: [{
|
|
53
53
|
type: Component,
|
|
54
|
-
args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button
|
|
54
|
+
args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button type=\"button\" (click)=\"expanded = !expanded\" class=\"dropdown-button\" aria-haspopup=\"listbox\" aria-expanded=\"true\" aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </button>\r\n <ul title=\"menu\" *ngIf=\"expanded && options && options.length > 0\" class=\"dropdown-ul\" tabindex=\"-1\" role=\"listbox\" aria-labelledby=\"listbox-label\">\r\n <ng-container *ngFor=\"let option of options\">\r\n <li [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\" (click)=\"selectOption(option)\" id=\"listbox-option-0\" role=\"option\">\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg class=\"dropdown-li-selected-indicator\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\n" }]
|
|
55
55
|
}], ctorParameters: () => [], propDecorators: { options: [{
|
|
56
56
|
type: Input
|
|
57
57
|
}], selectedValue: [{
|
|
@@ -69,4 +69,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
|
|
|
69
69
|
}], selectedChanged: [{
|
|
70
70
|
type: Output
|
|
71
71
|
}] } });
|
|
72
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
72
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcC1kb3duLW1lbnUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctY29tcG9uZW50cy9zcmMvbGliL2NvbnRyb2xzL2Ryb3AtZG93bi1tZW51L2Ryb3AtZG93bi1tZW51LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWNvbXBvbmVudHMvc3JjL2xpYi9jb250cm9scy9kcm9wLWRvd24tbWVudS9kcm9wLWRvd24tbWVudS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQXFCLE1BQU0sRUFBaUIsTUFBTSxlQUFlLENBQUM7Ozs7QUFRekcsTUFBTSxPQUFPLHFCQUFxQjtJQVNoQyxJQUFXLGNBQWM7UUFDdkIsT0FBTyxJQUFJLENBQUMsZUFBZSxDQUFDO0lBQzlCLENBQUM7SUFDRCxJQUFXLGNBQWMsQ0FBQyxNQUF5QjtRQUNqRCxJQUFJLENBQUMsZUFBZSxHQUFHLE1BQU0sQ0FBQztRQUM5QixJQUFJLENBQUMsYUFBYSxHQUFHLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDO1FBQ2xELElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO0lBQ3hCLENBQUM7SUFNRCxJQUFXLFFBQVE7UUFDakIsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDO0lBQ3hCLENBQUM7SUFDRCxJQUFXLFFBQVEsQ0FBQyxLQUFjO1FBQ2hDLElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO0lBQ3pCLENBQUM7SUFDRDtRQTNCUyxZQUFPLEdBQTZCLEVBQUUsQ0FBQztRQUNoRCwyQ0FBMkM7UUFDeEIsa0JBQWEsR0FBMkIsU0FBUyxDQUFDO1FBQzVELGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsZ0JBQVcsR0FBVyxzQkFBc0IsQ0FBQztRQUNqQyxjQUFTLEdBQUcsSUFBSSxDQUFDO1FBRTlCLG9CQUFlLEdBQXNCLElBQUksQ0FBQztRQVV4QyxtQkFBYyxHQUFzQixJQUFJLFlBQVksRUFBTyxDQUFDO1FBQzVELG9CQUFlLEdBQXNCLElBQUksWUFBWSxFQUFPLENBQUM7UUFFL0QsY0FBUyxHQUFHLEtBQUssQ0FBQztJQU9YLENBQUM7SUFFaEIsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksSUFBSSxDQUFDLE9BQU8sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLE1BQU0sR0FBRyxDQUFDLElBQUksSUFBSSxDQUFDLGFBQWEsS0FBSyxJQUFJLElBQUksSUFBSSxDQUFDLGFBQWEsS0FBSyxTQUFTLEVBQUUsQ0FBQztZQUMvRyxJQUFJLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUMsS0FBSyxLQUFLLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUN2RixDQUFDO0lBQ0gsQ0FBQztJQUVELFFBQVEsS0FBVSxDQUFDO0lBRVosVUFBVSxDQUFDLE1BQWtCO1FBQ2xDLE9BQU8sTUFBTSxJQUFJLElBQUksSUFBSSxJQUFJLENBQUMsYUFBYSxJQUFJLElBQUksSUFBSSxNQUFNLENBQUMsS0FBSyxLQUFLLElBQUksQ0FBQyxhQUFhLENBQUM7SUFDN0YsQ0FBQztJQUVNLGNBQWMsQ0FBQyxNQUFXO1FBQy9CLElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO0lBQ3hCLENBQUM7SUFFTSxZQUFZLENBQUMsTUFBa0I7UUFDcEMsSUFBSSxDQUFDLGNBQWMsR0FBRyxNQUFNLENBQUM7UUFDN0IsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQ3ZDLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMxQyxDQUFDOzhHQWxEVSxxQkFBcUI7a0dBQXJCLHFCQUFxQiwwVUNSbEMsa3hFQStCQTs7MkZEdkJhLHFCQUFxQjtrQkFMakMsU0FBUzsrQkFFRSxvQkFBb0I7d0RBSXJCLE9BQU87c0JBQWYsS0FBSztnQkFFYSxhQUFhO3NCQUEvQixLQUFLO3VCQUFDLFVBQVU7Z0JBQ1IsUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNlLFNBQVM7c0JBQTdCLEtBQUs7dUJBQUMsWUFBWTtnQkFZVCxjQUFjO3NCQUF2QixNQUFNO2dCQUNHLGVBQWU7c0JBQXhCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uQ2hhbmdlcywgT25Jbml0LCBPdXRwdXQsIFNpbXBsZUNoYW5nZXMgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgTWVudU9wdGlvbiB9IGZyb20gJy4uLy4uL3R5cGVzJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIC8vIHRzbGludDpkaXNhYmxlLW5leHQtbGluZTpjb21wb25lbnQtc2VsZWN0b3JcclxuICBzZWxlY3RvcjogJ2xpYi1kcm9wLWRvd24tbWVudScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2Ryb3AtZG93bi1tZW51LmNvbXBvbmVudC5odG1sJyxcclxufSlcclxuZXhwb3J0IGNsYXNzIERyb3BEb3duTWVudUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25DaGFuZ2VzIHtcclxuICBASW5wdXQoKSBvcHRpb25zOiBNZW51T3B0aW9uW10gfCB1bmRlZmluZWQgPSBbXTtcclxuICAvLyB0c2xpbnQ6ZGlzYWJsZS1uZXh0LWxpbmU6bm8taW5wdXQtcmVuYW1lXHJcbiAgQElucHV0KCdzZWxlY3RlZCcpIHNlbGVjdGVkVmFsdWU6IGFueSB8IG51bGwgfCB1bmRlZmluZWQgPSB1bmRlZmluZWQ7XHJcbiAgQElucHV0KCkgbXVsdGlwbGUgPSBmYWxzZTtcclxuICBASW5wdXQoKSBwbGFjZWhvbGRlcjogc3RyaW5nID0gJ86gzrHPgc6xzrrOsc67z44gzrXPgM65zrvOrc6+z4TOtS4uLic7XHJcbiAgQElucHV0KCdzaG93LWljb25zJykgc2hvd0ljb25zID0gdHJ1ZTtcclxuXHJcbiAgcHJpdmF0ZSBzZWxlY3RlZE9wdGlvbiQ6IE1lbnVPcHRpb24gfCBudWxsID0gbnVsbDtcclxuICBwdWJsaWMgZ2V0IHNlbGVjdGVkT3B0aW9uKCk6IE1lbnVPcHRpb24gfCBudWxsIHtcclxuICAgIHJldHVybiB0aGlzLnNlbGVjdGVkT3B0aW9uJDtcclxuICB9XHJcbiAgcHVibGljIHNldCBzZWxlY3RlZE9wdGlvbihvcHRpb246IE1lbnVPcHRpb24gfCBudWxsKSB7XHJcbiAgICB0aGlzLnNlbGVjdGVkT3B0aW9uJCA9IG9wdGlvbjtcclxuICAgIHRoaXMuc2VsZWN0ZWRWYWx1ZSA9IG9wdGlvbiA/IG9wdGlvbi52YWx1ZSA6IG51bGw7XHJcbiAgICB0aGlzLmV4cGFuZGVkID0gZmFsc2U7XHJcbiAgfVxyXG5cclxuICBAT3V0cHV0KCkgc2VsZWN0ZWRDaGFuZ2U6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XHJcbiAgQE91dHB1dCgpIHNlbGVjdGVkQ2hhbmdlZDogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuXHJcbiAgcHJpdmF0ZSBleHBhbmRlZCQgPSBmYWxzZTtcclxuICBwdWJsaWMgZ2V0IGV4cGFuZGVkKCk6IGJvb2xlYW4ge1xyXG4gICAgcmV0dXJuIHRoaXMuZXhwYW5kZWQkO1xyXG4gIH1cclxuICBwdWJsaWMgc2V0IGV4cGFuZGVkKHZhbHVlOiBib29sZWFuKSB7XHJcbiAgICB0aGlzLmV4cGFuZGVkJCA9IHZhbHVlO1xyXG4gIH1cclxuICBjb25zdHJ1Y3RvcigpIHt9XHJcblxyXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcclxuICAgIGlmICh0aGlzLm9wdGlvbnMgJiYgdGhpcy5vcHRpb25zLmxlbmd0aCA+IDAgJiYgdGhpcy5zZWxlY3RlZFZhbHVlICE9PSBudWxsICYmIHRoaXMuc2VsZWN0ZWRWYWx1ZSAhPT0gdW5kZWZpbmVkKSB7XHJcbiAgICAgIHRoaXMuc2VsZWN0ZWRPcHRpb24kID0gdGhpcy5vcHRpb25zLmZpbHRlcigobykgPT4gby52YWx1ZSA9PT0gdGhpcy5zZWxlY3RlZFZhbHVlKVswXTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge31cclxuXHJcbiAgcHVibGljIGlzU2VsZWN0ZWQob3B0aW9uOiBNZW51T3B0aW9uKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gb3B0aW9uICE9IG51bGwgJiYgdGhpcy5zZWxlY3RlZFZhbHVlICE9IG51bGwgJiYgb3B0aW9uLnZhbHVlID09PSB0aGlzLnNlbGVjdGVkVmFsdWU7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgb25DbGlja091dHNpZGUoJGV2ZW50OiBhbnkpOiB2b2lkIHtcclxuICAgIHRoaXMuZXhwYW5kZWQgPSBmYWxzZTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBzZWxlY3RPcHRpb24ob3B0aW9uOiBNZW51T3B0aW9uKTogdm9pZCB7XHJcbiAgICB0aGlzLnNlbGVjdGVkT3B0aW9uID0gb3B0aW9uO1xyXG4gICAgdGhpcy5zZWxlY3RlZENoYW5nZS5lbWl0KG9wdGlvbi52YWx1ZSk7XHJcbiAgICB0aGlzLnNlbGVjdGVkQ2hhbmdlZC5lbWl0KG9wdGlvbi52YWx1ZSk7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJkcm9wZG93bi1jb250YWluZXJcIiAoY2xpY2tPdXRzaWRlKT1cIm9uQ2xpY2tPdXRzaWRlKCRldmVudClcIj5cclxuICA8YnV0dG9uIHR5cGU9XCJidXR0b25cIiAoY2xpY2spPVwiZXhwYW5kZWQgPSAhZXhwYW5kZWRcIiBjbGFzcz1cImRyb3Bkb3duLWJ1dHRvblwiIGFyaWEtaGFzcG9wdXA9XCJsaXN0Ym94XCIgYXJpYS1leHBhbmRlZD1cInRydWVcIiBhcmlhLWxhYmVsbGVkYnk9XCJsaXN0Ym94LWxhYmVsXCI+XHJcbiAgICA8c3BhbiBjbGFzcz1cImRyb3Bkb3duLXNlbGVjdGVkLXRleHRcIj5cclxuICAgICAgPGkgKm5nSWY9XCJzZWxlY3RlZE9wdGlvbj8uaWNvbiAmJiBzaG93SWNvbnNcIiBbY2xhc3NdPVwic2VsZWN0ZWRPcHRpb24/Lmljb25cIiBcclxuICAgICAgICAgIFtjbGFzcy5tci0yXT1cInNlbGVjdGVkT3B0aW9uPy5pY29uXCI+PC9pPnt7IHNlbGVjdGVkT3B0aW9uPy50ZXh0IHx8IHBsYWNlaG9sZGVyIH19XHJcbiAgICA8L3NwYW4+XHJcbiAgICA8c3BhbiBjbGFzcz1cImRyb3Bkb3duLWJ1dHRvbi1pY29uXCI+XHJcbiAgICAgIDwhLS0gSGVyb2ljb24gbmFtZTogc29saWQvc2VsZWN0b3IgLS0+XHJcbiAgICAgIDxzdmcgY2xhc3M9XCJkcm9wZG93bi1hcnJvd1wiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIiB2aWV3Qm94PVwiMCAwIDIwIDIwXCIgZmlsbD1cImN1cnJlbnRDb2xvclwiIGFyaWEtaGlkZGVuPVwidHJ1ZVwiPlxyXG4gICAgICAgIDxwYXRoIGZpbGwtcnVsZT1cImV2ZW5vZGRcIlxyXG4gICAgICAgICAgZD1cIk0xMCAzYTEgMSAwIDAxLjcwNy4yOTNsMyAzYTEgMSAwIDAxLTEuNDE0IDEuNDE0TDEwIDUuNDE0IDcuNzA3IDcuNzA3YTEgMSAwIDAxLTEuNDE0LTEuNDE0bDMtM0ExIDEgMCAwMTEwIDN6bS0zLjcwNyA5LjI5M2ExIDEgMCAwMTEuNDE0IDBMMTAgMTQuNTg2bDIuMjkzLTIuMjkzYTEgMSAwIDAxMS40MTQgMS40MTRsLTMgM2ExIDEgMCAwMS0xLjQxNCAwbC0zLTNhMSAxIDAgMDEwLTEuNDE0elwiXHJcbiAgICAgICAgICBjbGlwLXJ1bGU9XCJldmVub2RkXCIvPlxyXG4gICAgICA8L3N2Zz5cclxuICAgIDwvc3Bhbj5cclxuICA8L2J1dHRvbj5cclxuICA8dWwgdGl0bGU9XCJtZW51XCIgKm5nSWY9XCJleHBhbmRlZCAmJiBvcHRpb25zICYmIG9wdGlvbnMubGVuZ3RoID4gMFwiIGNsYXNzPVwiZHJvcGRvd24tdWxcIiB0YWJpbmRleD1cIi0xXCIgcm9sZT1cImxpc3Rib3hcIiBhcmlhLWxhYmVsbGVkYnk9XCJsaXN0Ym94LWxhYmVsXCI+XHJcbiAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCBvcHRpb24gb2Ygb3B0aW9uc1wiPlxyXG4gICAgICA8bGkgW2NsYXNzXT1cImlzU2VsZWN0ZWQob3B0aW9uKSA/ICdkcm9wZG93bi1saS1zZWxlY3RlZCcgOiAnZHJvcGRvd24tbGknXCIgKGNsaWNrKT1cInNlbGVjdE9wdGlvbihvcHRpb24pXCIgaWQ9XCJsaXN0Ym94LW9wdGlvbi0wXCIgcm9sZT1cIm9wdGlvblwiPlxyXG4gICAgICAgIDxzcGFuIFtjbGFzc109XCJpc1NlbGVjdGVkKG9wdGlvbikgPyAnZHJvcGRvd24tbGktc2VsZWN0ZWQtdGV4dCcgOiAnZHJvcGRvd24tbGktdGV4dCdcIj5cclxuICAgICAgICAgIDxpICpuZ0lmPVwib3B0aW9uLmljb24gJiYgc2hvd0ljb25zXCIgW2NsYXNzXT1cIm9wdGlvbi5pY29uXCIgW2NsYXNzLm1yLTJdPVwib3B0aW9uLmljb25cIj48L2k+e3sgb3B0aW9uLnRleHQgfX1cclxuICAgICAgICA8L3NwYW4+XHJcbiAgICAgICAgPHNwYW4gKm5nSWY9XCJpc1NlbGVjdGVkKG9wdGlvbilcIiBjbGFzcz1cImRyb3Bkb3duLWxpLXNlbGVjdGVkLWluZGljYXRvci1jb250YWluZXJcIj5cclxuICAgICAgICAgIDwhLS0gSGVyb2ljb24gbmFtZTogc29saWQvY2hlY2sgLS0+XHJcbiAgICAgICAgICA8c3ZnIGNsYXNzPVwiZHJvcGRvd24tbGktc2VsZWN0ZWQtaW5kaWNhdG9yXCIgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiIHZpZXdCb3g9XCIwIDAgMjAgMjBcIiBmaWxsPVwiY3VycmVudENvbG9yXCIgYXJpYS1oaWRkZW49XCJ0cnVlXCI+XHJcbiAgICAgICAgICAgIDxwYXRoIGZpbGwtcnVsZT1cImV2ZW5vZGRcIiBkPVwiTTE2LjcwNyA1LjI5M2ExIDEgMCAwMTAgMS40MTRsLTggOGExIDEgMCAwMS0xLjQxNCAwbC00LTRhMSAxIDAgMDExLjQxNC0xLjQxNEw4IDEyLjU4Nmw3LjI5My03LjI5M2ExIDEgMCAwMTEuNDE0IDB6XCIgY2xpcC1ydWxlPVwiZXZlbm9kZFwiLz5cclxuICAgICAgICAgIDwvc3ZnPlxyXG4gICAgICAgIDwvc3Bhbj5cclxuICAgICAgPC9saT5cclxuICAgIDwvbmctY29udGFpbmVyPlxyXG4gIDwvdWw+XHJcbjwvZGl2PlxyXG4iXX0=
|
|
@@ -243,11 +243,11 @@ class DropDownMenuComponent {
|
|
|
243
243
|
this.selectedChanged.emit(option.value);
|
|
244
244
|
}
|
|
245
245
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DropDownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
246
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder", showIcons: ["show-icons", "showIcons"] }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button
|
|
246
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder", showIcons: ["show-icons", "showIcons"] }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button type=\"button\" (click)=\"expanded = !expanded\" class=\"dropdown-button\" aria-haspopup=\"listbox\" aria-expanded=\"true\" aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </button>\r\n <ul title=\"menu\" *ngIf=\"expanded && options && options.length > 0\" class=\"dropdown-ul\" tabindex=\"-1\" role=\"listbox\" aria-labelledby=\"listbox-label\">\r\n <ng-container *ngFor=\"let option of options\">\r\n <li [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\" (click)=\"selectOption(option)\" id=\"listbox-option-0\" role=\"option\">\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg class=\"dropdown-li-selected-indicator\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\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: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
|
|
247
247
|
}
|
|
248
248
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DropDownMenuComponent, decorators: [{
|
|
249
249
|
type: Component,
|
|
250
|
-
args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button
|
|
250
|
+
args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button type=\"button\" (click)=\"expanded = !expanded\" class=\"dropdown-button\" aria-haspopup=\"listbox\" aria-expanded=\"true\" aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </button>\r\n <ul title=\"menu\" *ngIf=\"expanded && options && options.length > 0\" class=\"dropdown-ul\" tabindex=\"-1\" role=\"listbox\" aria-labelledby=\"listbox-label\">\r\n <ng-container *ngFor=\"let option of options\">\r\n <li [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\" (click)=\"selectOption(option)\" id=\"listbox-option-0\" role=\"option\">\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg class=\"dropdown-li-selected-indicator\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\n" }]
|
|
251
251
|
}], ctorParameters: () => [], propDecorators: { options: [{
|
|
252
252
|
type: Input
|
|
253
253
|
}], selectedValue: [{
|