UNPKG

@taiga-ui/kit

Version:

Taiga UI Angular main components kit

25 lines 12.3 kB
import { NgForOf, NgIf } from '@angular/common'; import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; import { TuiElement } from '@taiga-ui/cdk/directives/element'; import { tuiAsDataListAccessor, TuiDataList } from '@taiga-ui/core/components/data-list'; import { TuiLoader } from '@taiga-ui/core/components/loader'; import { PolymorpheusOutlet } from '@taiga-ui/polymorpheus'; import { TuiDataListWrapperComponent } from './data-list-wrapper.component'; import * as i0 from "@angular/core"; import * as i1 from "@taiga-ui/core/components/data-list"; class TuiDataListGroupWrapperComponent extends TuiDataListWrapperComponent { constructor() { super(...arguments); this.labels = []; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDataListGroupWrapperComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDataListGroupWrapperComponent, isStandalone: true, selector: "tui-data-list-wrapper[labels]", inputs: { labels: "labels" }, providers: [tuiAsDataListAccessor(TuiDataListGroupWrapperComponent)], usesInheritance: true, ngImport: i0, template: "<tui-data-list\n *ngIf=\"items; else loading\"\n [emptyContent]=\"emptyContent\"\n [size]=\"size\"\n>\n <tui-opt-group\n *ngFor=\"let group of items; let index = index\"\n [label]=\"labels[index]\"\n >\n <ng-container *ngIf=\"newOptionMode; else legacyOptionFallback\">\n <button\n *ngFor=\"let item of group\"\n #elementRef=\"elementRef\"\n new\n tuiElement\n tuiOption\n type=\"button\"\n [disabled]=\"disabledItemHandler(item)\"\n [value]=\"item\"\n (click.capture)=\"itemClick.emit(item)\"\n >\n <ng-container *polymorpheusOutlet=\"itemContent as text; context: getContext(item, elementRef)\">\n {{ text }}\n </ng-container>\n </button>\n </ng-container>\n\n <!-- TODO(v5): delete fallback -->\n <ng-template #legacyOptionFallback>\n <button\n *ngFor=\"let item of group\"\n #elementRef=\"elementRef\"\n automation-id=\"tui-data-list-wrapper__option\"\n tuiElement\n tuiOption\n type=\"button\"\n [disabled]=\"disabledItemHandler(item)\"\n [value]=\"item\"\n (click)=\"itemClick.emit(item)\"\n >\n <ng-container *polymorpheusOutlet=\"itemContent as text; context: getContext(item, elementRef)\">\n {{ text }}\n </ng-container>\n </button>\n </ng-template>\n </tui-opt-group>\n</tui-data-list>\n<ng-template #loading>\n <tui-loader class=\"t-loader\" />\n</ng-template>\n", styles: [":host{display:block}.t-content{flex:1;min-inline-size:0}.t-loader{margin:.75rem 0}\n"], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: i1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "component", type: i1.TuiOption, selector: "button[tuiOption]:not([new]), a[tuiOption]:not([new]), label[tuiOption]:not([new])", inputs: ["disabled", "value"] }, { kind: "directive", type: i1.TuiOptionNew, selector: "button[tuiOption][new], a[tuiOption][new], label[tuiOption][new]", inputs: ["disabled"] }, { kind: "directive", type: i1.TuiOptionWithValue, selector: "button[tuiOption][value][new], a[tuiOption][value][new], label[tuiOption][value][new]", inputs: ["disabled", "value"] }, { kind: "directive", type: i1.TuiOptGroup, selector: "tui-opt-group", inputs: ["label"] }, { kind: "directive", type: TuiElement, selector: "[tuiElement]", exportAs: ["elementRef"] }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); } } export { TuiDataListGroupWrapperComponent }; i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDataListGroupWrapperComponent, decorators: [{ type: Component, args: [{ standalone: true, selector: 'tui-data-list-wrapper[labels]', imports: [NgForOf, NgIf, PolymorpheusOutlet, TuiDataList, TuiElement, TuiLoader], changeDetection: ChangeDetectionStrategy.OnPush, providers: [tuiAsDataListAccessor(TuiDataListGroupWrapperComponent)], template: "<tui-data-list\n *ngIf=\"items; else loading\"\n [emptyContent]=\"emptyContent\"\n [size]=\"size\"\n>\n <tui-opt-group\n *ngFor=\"let group of items; let index = index\"\n [label]=\"labels[index]\"\n >\n <ng-container *ngIf=\"newOptionMode; else legacyOptionFallback\">\n <button\n *ngFor=\"let item of group\"\n #elementRef=\"elementRef\"\n new\n tuiElement\n tuiOption\n type=\"button\"\n [disabled]=\"disabledItemHandler(item)\"\n [value]=\"item\"\n (click.capture)=\"itemClick.emit(item)\"\n >\n <ng-container *polymorpheusOutlet=\"itemContent as text; context: getContext(item, elementRef)\">\n {{ text }}\n </ng-container>\n </button>\n </ng-container>\n\n <!-- TODO(v5): delete fallback -->\n <ng-template #legacyOptionFallback>\n <button\n *ngFor=\"let item of group\"\n #elementRef=\"elementRef\"\n automation-id=\"tui-data-list-wrapper__option\"\n tuiElement\n tuiOption\n type=\"button\"\n [disabled]=\"disabledItemHandler(item)\"\n [value]=\"item\"\n (click)=\"itemClick.emit(item)\"\n >\n <ng-container *polymorpheusOutlet=\"itemContent as text; context: getContext(item, elementRef)\">\n {{ text }}\n </ng-container>\n </button>\n </ng-template>\n </tui-opt-group>\n</tui-data-list>\n<ng-template #loading>\n <tui-loader class=\"t-loader\" />\n</ng-template>\n", styles: [":host{display:block}.t-content{flex:1;min-inline-size:0}.t-loader{margin:.75rem 0}\n"] }] }], propDecorators: { labels: [{ type: Input }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS1saXN0LWdyb3VwLXdyYXBwZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2l0L2NvbXBvbmVudHMvZGF0YS1saXN0LXdyYXBwZXIvZGF0YS1saXN0LWdyb3VwLXdyYXBwZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2l0L2NvbXBvbmVudHMvZGF0YS1saXN0LXdyYXBwZXIvZGF0YS1saXN0LWdyb3VwLXdyYXBwZXIudGVtcGxhdGUuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsT0FBTyxFQUFFLElBQUksRUFBQyxNQUFNLGlCQUFpQixDQUFDO0FBQzlDLE9BQU8sRUFBQyx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ3hFLE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQztBQUM1RCxPQUFPLEVBQUMscUJBQXFCLEVBQUUsV0FBVyxFQUFDLE1BQU0scUNBQXFDLENBQUM7QUFDdkYsT0FBTyxFQUFDLFNBQVMsRUFBQyxNQUFNLGtDQUFrQyxDQUFDO0FBQzNELE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLHdCQUF3QixDQUFDO0FBRTFELE9BQU8sRUFBQywyQkFBMkIsRUFBQyxNQUFNLCtCQUErQixDQUFDOzs7QUFFMUUsTUFTYSxnQ0FBb0MsU0FBUSwyQkFHeEQ7SUFaRDs7UUFjVyxXQUFNLEdBQXNCLEVBQUUsQ0FBQztLQUN6QzsrR0FOWSxnQ0FBZ0M7bUdBQWhDLGdDQUFnQywwR0FGOUIsQ0FBQyxxQkFBcUIsQ0FBQyxnQ0FBZ0MsQ0FBQyxDQUFDLGlEQ2hCeEUsb3ZEQWtEQSw4SUR0Q2MsT0FBTyxtSEFBRSxJQUFJLDZGQUFFLGtCQUFrQiw4ekJBQWUsVUFBVSxtRkFBRSxTQUFTOztTQU10RSxnQ0FBZ0M7NEZBQWhDLGdDQUFnQztrQkFUNUMsU0FBUztpQ0FDTSxJQUFJLFlBQ04sK0JBQStCLFdBQ2hDLENBQUMsT0FBTyxFQUFFLElBQUksRUFBRSxrQkFBa0IsRUFBRSxXQUFXLEVBQUUsVUFBVSxFQUFFLFNBQVMsQ0FBQyxtQkFHL0QsdUJBQXVCLENBQUMsTUFBTSxhQUNwQyxDQUFDLHFCQUFxQixrQ0FBa0MsQ0FBQzs4QkFPN0QsTUFBTTtzQkFEWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtOZ0Zvck9mLCBOZ0lmfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1R1aUVsZW1lbnR9IGZyb20gJ0B0YWlnYS11aS9jZGsvZGlyZWN0aXZlcy9lbGVtZW50JztcbmltcG9ydCB7dHVpQXNEYXRhTGlzdEFjY2Vzc29yLCBUdWlEYXRhTGlzdH0gZnJvbSAnQHRhaWdhLXVpL2NvcmUvY29tcG9uZW50cy9kYXRhLWxpc3QnO1xuaW1wb3J0IHtUdWlMb2FkZXJ9IGZyb20gJ0B0YWlnYS11aS9jb3JlL2NvbXBvbmVudHMvbG9hZGVyJztcbmltcG9ydCB7UG9seW1vcnBoZXVzT3V0bGV0fSBmcm9tICdAdGFpZ2EtdWkvcG9seW1vcnBoZXVzJztcblxuaW1wb3J0IHtUdWlEYXRhTGlzdFdyYXBwZXJDb21wb25lbnR9IGZyb20gJy4vZGF0YS1saXN0LXdyYXBwZXIuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBzZWxlY3RvcjogJ3R1aS1kYXRhLWxpc3Qtd3JhcHBlcltsYWJlbHNdJyxcbiAgICBpbXBvcnRzOiBbTmdGb3JPZiwgTmdJZiwgUG9seW1vcnBoZXVzT3V0bGV0LCBUdWlEYXRhTGlzdCwgVHVpRWxlbWVudCwgVHVpTG9hZGVyXSxcbiAgICB0ZW1wbGF0ZVVybDogJy4vZGF0YS1saXN0LWdyb3VwLXdyYXBwZXIudGVtcGxhdGUuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vZGF0YS1saXN0LXdyYXBwZXIuc3R5bGUubGVzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIHByb3ZpZGVyczogW3R1aUFzRGF0YUxpc3RBY2Nlc3NvcihUdWlEYXRhTGlzdEdyb3VwV3JhcHBlckNvbXBvbmVudCldLFxufSlcbmV4cG9ydCBjbGFzcyBUdWlEYXRhTGlzdEdyb3VwV3JhcHBlckNvbXBvbmVudDxUPiBleHRlbmRzIFR1aURhdGFMaXN0V3JhcHBlckNvbXBvbmVudDxcbiAgICBULFxuICAgIHJlYWRvbmx5IFRbXVxuPiB7XG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgbGFiZWxzOiByZWFkb25seSBzdHJpbmdbXSA9IFtdO1xufVxuIiwiPHR1aS1kYXRhLWxpc3RcbiAgICAqbmdJZj1cIml0ZW1zOyBlbHNlIGxvYWRpbmdcIlxuICAgIFtlbXB0eUNvbnRlbnRdPVwiZW1wdHlDb250ZW50XCJcbiAgICBbc2l6ZV09XCJzaXplXCJcbj5cbiAgICA8dHVpLW9wdC1ncm91cFxuICAgICAgICAqbmdGb3I9XCJsZXQgZ3JvdXAgb2YgaXRlbXM7IGxldCBpbmRleCA9IGluZGV4XCJcbiAgICAgICAgW2xhYmVsXT1cImxhYmVsc1tpbmRleF1cIlxuICAgID5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm5ld09wdGlvbk1vZGU7IGVsc2UgbGVnYWN5T3B0aW9uRmFsbGJhY2tcIj5cbiAgICAgICAgICAgIDxidXR0b25cbiAgICAgICAgICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiBncm91cFwiXG4gICAgICAgICAgICAgICAgI2VsZW1lbnRSZWY9XCJlbGVtZW50UmVmXCJcbiAgICAgICAgICAgICAgICBuZXdcbiAgICAgICAgICAgICAgICB0dWlFbGVtZW50XG4gICAgICAgICAgICAgICAgdHVpT3B0aW9uXG4gICAgICAgICAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgICAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkSXRlbUhhbmRsZXIoaXRlbSlcIlxuICAgICAgICAgICAgICAgIFt2YWx1ZV09XCJpdGVtXCJcbiAgICAgICAgICAgICAgICAoY2xpY2suY2FwdHVyZSk9XCJpdGVtQ2xpY2suZW1pdChpdGVtKVwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqcG9seW1vcnBoZXVzT3V0bGV0PVwiaXRlbUNvbnRlbnQgYXMgdGV4dDsgY29udGV4dDogZ2V0Q29udGV4dChpdGVtLCBlbGVtZW50UmVmKVwiPlxuICAgICAgICAgICAgICAgICAgICB7eyB0ZXh0IH19XG4gICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICA8L2J1dHRvbj5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG5cbiAgICAgICAgPCEtLSBUT0RPKHY1KTogZGVsZXRlIGZhbGxiYWNrIC0tPlxuICAgICAgICA8bmctdGVtcGxhdGUgI2xlZ2FjeU9wdGlvbkZhbGxiYWNrPlxuICAgICAgICAgICAgPGJ1dHRvblxuICAgICAgICAgICAgICAgICpuZ0Zvcj1cImxldCBpdGVtIG9mIGdyb3VwXCJcbiAgICAgICAgICAgICAgICAjZWxlbWVudFJlZj1cImVsZW1lbnRSZWZcIlxuICAgICAgICAgICAgICAgIGF1dG9tYXRpb24taWQ9XCJ0dWktZGF0YS1saXN0LXdyYXBwZXJfX29wdGlvblwiXG4gICAgICAgICAgICAgICAgdHVpRWxlbWVudFxuICAgICAgICAgICAgICAgIHR1aU9wdGlvblxuICAgICAgICAgICAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgICAgICAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZEl0ZW1IYW5kbGVyKGl0ZW0pXCJcbiAgICAgICAgICAgICAgICBbdmFsdWVdPVwiaXRlbVwiXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cIml0ZW1DbGljay5lbWl0KGl0ZW0pXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpwb2x5bW9ycGhldXNPdXRsZXQ9XCJpdGVtQ29udGVudCBhcyB0ZXh0OyBjb250ZXh0OiBnZXRDb250ZXh0KGl0ZW0sIGVsZW1lbnRSZWYpXCI+XG4gICAgICAgICAgICAgICAgICAgIHt7IHRleHQgfX1cbiAgICAgICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgICAgIDwvYnV0dG9uPlxuICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgIDwvdHVpLW9wdC1ncm91cD5cbjwvdHVpLWRhdGEtbGlzdD5cbjxuZy10ZW1wbGF0ZSAjbG9hZGluZz5cbiAgICA8dHVpLWxvYWRlciBjbGFzcz1cInQtbG9hZGVyXCIgLz5cbjwvbmctdGVtcGxhdGU+XG4iXX0=