@ng-doc/ui-kit
Version:
<!-- PROJECT LOGO --> <br /> <div align="center"> <a href="https://github.com/ng-doc/ng-doc"> <img src="https://ng-doc.com/assets/images/ng-doc.svg?raw=true" alt="Logo" height="150px"> </a>
56 lines (52 loc) • 4.99 kB
JavaScript
import { __decorate, __metadata } from 'tslib';
import { NgIf } from '@angular/common';
import * as i0 from '@angular/core';
import { Directive, QueryList, ChangeDetectorRef, Component, ChangeDetectionStrategy, ContentChildren } from '@angular/core';
import { NgDocOptionComponent } from '@ng-doc/ui-kit/components/option';
import { NgDocTextComponent } from '@ng-doc/ui-kit/components/text';
import { untilDestroyed, UntilDestroy } from '@ngneat/until-destroy';
import { startWith } from 'rxjs/operators';
class NgDocOptionGroupHeaderDirective {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgDocOptionGroupHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.3", type: NgDocOptionGroupHeaderDirective, isStandalone: true, selector: "[ngDocOptionGroupHeader]", ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgDocOptionGroupHeaderDirective, decorators: [{
type: Directive,
args: [{
selector: '[ngDocOptionGroupHeader]',
standalone: true,
}]
}] });
let NgDocOptionGroupComponent = class NgDocOptionGroupComponent {
constructor(changeDetectorRef) {
this.changeDetectorRef = changeDetectorRef;
this.options = new QueryList();
this.hasHeader = false;
}
ngAfterContentInit() {
this.options.changes
.pipe(startWith(this.options), untilDestroyed(this))
.subscribe((options) => {
this.hasHeader = !!options.length;
this.changeDetectorRef.markForCheck();
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgDocOptionGroupComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: NgDocOptionGroupComponent, isStandalone: true, selector: "ng-doc-option-group", queries: [{ propertyName: "options", predicate: NgDocOptionComponent, descendants: true }], ngImport: i0, template: "<div class=\"ng-doc-option-group-wrapper\">\n\t<div *ngIf=\"hasHeader\" class=\"ng-doc-option-group-header\" ng-doc-text>\n\t\t<ng-content select=\"[ngDocOptionGroupHeader]\"></ng-content>\n\t</div>\n\t<div class=\"ng-doc-option-group\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n", styles: [":host{display:block}.ng-doc-option-group-header{position:sticky;top:0;display:flex;background-color:var(--ng-doc-base-1);padding:var(--ng-doc-base-gutter) calc(var(--ng-doc-base-gutter) * 2);z-index:1;--ng-doc-font-size: 13px;--ng-doc-font-weight: 700;--ng-doc-font-line-height: 18px;--ng-doc-text: var(--ng-doc-base-9)}.ng-doc-option-group ::ng-deep ng-doc-option .ng-doc-option-wrapper{padding-left:calc(var(--ng-doc-base-gutter) * 2)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NgDocTextComponent, selector: "[ng-doc-text]", inputs: ["size", "color", "align", "absoluteContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
};
NgDocOptionGroupComponent = __decorate([
UntilDestroy(),
__metadata("design:paramtypes", [ChangeDetectorRef])
], NgDocOptionGroupComponent);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgDocOptionGroupComponent, decorators: [{
type: Component,
args: [{ selector: 'ng-doc-option-group', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIf, NgDocTextComponent], template: "<div class=\"ng-doc-option-group-wrapper\">\n\t<div *ngIf=\"hasHeader\" class=\"ng-doc-option-group-header\" ng-doc-text>\n\t\t<ng-content select=\"[ngDocOptionGroupHeader]\"></ng-content>\n\t</div>\n\t<div class=\"ng-doc-option-group\">\n\t\t<ng-content></ng-content>\n\t</div>\n</div>\n", styles: [":host{display:block}.ng-doc-option-group-header{position:sticky;top:0;display:flex;background-color:var(--ng-doc-base-1);padding:var(--ng-doc-base-gutter) calc(var(--ng-doc-base-gutter) * 2);z-index:1;--ng-doc-font-size: 13px;--ng-doc-font-weight: 700;--ng-doc-font-line-height: 18px;--ng-doc-text: var(--ng-doc-base-9)}.ng-doc-option-group ::ng-deep ng-doc-option .ng-doc-option-wrapper{padding-left:calc(var(--ng-doc-base-gutter) * 2)}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { options: [{
type: ContentChildren,
args: [NgDocOptionComponent, { descendants: true }]
}] } });
/**
* Generated bundle index. Do not edit.
*/
export { NgDocOptionGroupComponent, NgDocOptionGroupHeaderDirective };
//# sourceMappingURL=ng-doc-ui-kit-components-option-group.mjs.map