@tapsellorg/angular-material-library
Version:
Angular library for Tapsell
52 lines (47 loc) • 8.73 kB
JavaScript
import * as i0 from '@angular/core';
import { input, Inject, ChangeDetectionStrategy, ViewEncapsulation, Component, NgModule } from '@angular/core';
import { DOCUMENT, CommonModule } from '@angular/common';
import * as i1 from '@angular/material/button';
import { MatButtonModule } from '@angular/material/button';
import * as i2 from '@angular/router';
import { RouterModule } from '@angular/router';
import * as i3 from '@angular/material/icon';
import { MatIconModule } from '@angular/material/icon';
import * as i4 from '@tapsellorg/angular-material-library/breadcrumbs';
import { PghBreadcrumbsModule } from '@tapsellorg/angular-material-library/breadcrumbs';
class PghPageHeadComponent {
constructor(document) {
this.document = document;
this.pageTitle = input();
this.subTitle = input(undefined);
this.backLink = input(undefined);
this.hideBreadcrumbs = input(false);
} // TODO: change any to Document after enabling ivy compiler
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PghPageHeadComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: PghPageHeadComponent, isStandalone: false, selector: "pgh-page-head", inputs: { pageTitle: { classPropertyName: "pageTitle", publicName: "pageTitle", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, backLink: { classPropertyName: "backLink", publicName: "backLink", isSignal: true, isRequired: false, transformFunction: null }, hideBreadcrumbs: { classPropertyName: "hideBreadcrumbs", publicName: "hideBreadcrumbs", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (!hideBreadcrumbs()) {\n<pgh-breadcrumbs></pgh-breadcrumbs>\n}\n\n<div class=\"pgh-page-head\">\n <ng-content select=\"[pgh-before]\"></ng-content>\n\n <div class=\"pgh-page-head-title-wrapper\">\n <div class=\"pgh-page-head-title\">\n @if (pageTitle()) {\n <h3>{{ pageTitle() }}</h3>\n }\n <ng-content select=\"[pgh-title]\"></ng-content>\n </div>\n\n <div class=\"pgh-page-head-subtitle\">\n @if (subTitle()) {\n <p>{{ subTitle() }}</p>\n }\n <ng-content select=\"[pgh-sub-title]\"></ng-content>\n </div>\n </div>\n\n <ng-content select=\"[pgh-between]\"></ng-content>\n\n <div class=\"ms-auto\">\n <ng-content select=\"[pgh-before-backlink]\"></ng-content>\n @if (backLink()) {\n <a [routerLink]=\"backLink()!.route\" mat-stroked-button class=\"pgh-back-link-btn\">\n <span>{{ backLink()!.title }}</span>\n <mat-icon\n iconPositionEnd\n [svgIcon]=\"document.dir === 'rtl' ? 'keyboard_arrow_left' : 'keyboard_arrow_right'\"\n class=\"pgh-back-link-icon\"\n ></mat-icon>\n </a>\n }\n </div>\n\n <ng-content select=\"[pgh-after]\"></ng-content>\n</div>\n", styles: [".font-monospaced-numbers{font-feature-settings:\"ss03\"!important}.font-english-numbers{font-feature-settings:normal!important}.font-weight-light{font-weight:300}.font-weight-normal{font-weight:400}.font-weight-bold{font-weight:600}.black-50{background-color:hsl(var(--_body-hue),var(--_body-saturation),var(--lightness-0),50%)!important}.white-50{background-color:hsl(var(--_body-hue),var(--_body-saturation),var(--lightness-1000),50%)!important}.pgh-page-head{display:flex;align-items:flex-start;margin-block:1.5rem;margin-inline:0}@media (max-width: 575.98px){.pgh-page-head{flex-direction:column-reverse}}.pgh-page-head-title>h3{margin-bottom:0;font-size:1.5rem;font-weight:600;display:inline-block}.pgh-page-head-subtitle{margin-top:.5rem}.pgh-page-head-subtitle>p{margin-bottom:0;display:inline-block}.pgh-back-link-btn{color:var(--777)}.pgh-back-link-icon{margin-inline:.125rem -.5rem}\n"], dependencies: [{ kind: "component", type: i1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.PghBreadcrumbsComponent, selector: "pgh-breadcrumbs" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PghPageHeadComponent, decorators: [{
type: Component,
args: [{ selector: 'pgh-page-head', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (!hideBreadcrumbs()) {\n<pgh-breadcrumbs></pgh-breadcrumbs>\n}\n\n<div class=\"pgh-page-head\">\n <ng-content select=\"[pgh-before]\"></ng-content>\n\n <div class=\"pgh-page-head-title-wrapper\">\n <div class=\"pgh-page-head-title\">\n @if (pageTitle()) {\n <h3>{{ pageTitle() }}</h3>\n }\n <ng-content select=\"[pgh-title]\"></ng-content>\n </div>\n\n <div class=\"pgh-page-head-subtitle\">\n @if (subTitle()) {\n <p>{{ subTitle() }}</p>\n }\n <ng-content select=\"[pgh-sub-title]\"></ng-content>\n </div>\n </div>\n\n <ng-content select=\"[pgh-between]\"></ng-content>\n\n <div class=\"ms-auto\">\n <ng-content select=\"[pgh-before-backlink]\"></ng-content>\n @if (backLink()) {\n <a [routerLink]=\"backLink()!.route\" mat-stroked-button class=\"pgh-back-link-btn\">\n <span>{{ backLink()!.title }}</span>\n <mat-icon\n iconPositionEnd\n [svgIcon]=\"document.dir === 'rtl' ? 'keyboard_arrow_left' : 'keyboard_arrow_right'\"\n class=\"pgh-back-link-icon\"\n ></mat-icon>\n </a>\n }\n </div>\n\n <ng-content select=\"[pgh-after]\"></ng-content>\n</div>\n", styles: [".font-monospaced-numbers{font-feature-settings:\"ss03\"!important}.font-english-numbers{font-feature-settings:normal!important}.font-weight-light{font-weight:300}.font-weight-normal{font-weight:400}.font-weight-bold{font-weight:600}.black-50{background-color:hsl(var(--_body-hue),var(--_body-saturation),var(--lightness-0),50%)!important}.white-50{background-color:hsl(var(--_body-hue),var(--_body-saturation),var(--lightness-1000),50%)!important}.pgh-page-head{display:flex;align-items:flex-start;margin-block:1.5rem;margin-inline:0}@media (max-width: 575.98px){.pgh-page-head{flex-direction:column-reverse}}.pgh-page-head-title>h3{margin-bottom:0;font-size:1.5rem;font-weight:600;display:inline-block}.pgh-page-head-subtitle{margin-top:.5rem}.pgh-page-head-subtitle>p{margin-bottom:0;display:inline-block}.pgh-back-link-btn{color:var(--777)}.pgh-back-link-icon{margin-inline:.125rem -.5rem}\n"] }]
}], ctorParameters: () => [{ type: undefined, decorators: [{
type: Inject,
args: [DOCUMENT]
}] }] });
class PghPageHeadModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PghPageHeadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: PghPageHeadModule, declarations: [PghPageHeadComponent], imports: [CommonModule, MatButtonModule, RouterModule, MatIconModule, PghBreadcrumbsModule], exports: [PghPageHeadComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PghPageHeadModule, imports: [CommonModule, MatButtonModule, RouterModule, MatIconModule, PghBreadcrumbsModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: PghPageHeadModule, decorators: [{
type: NgModule,
args: [{
declarations: [PghPageHeadComponent],
imports: [CommonModule, MatButtonModule, RouterModule, MatIconModule, PghBreadcrumbsModule],
exports: [PghPageHeadComponent],
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { PghPageHeadComponent, PghPageHeadModule };
//# sourceMappingURL=tapsellorg-angular-material-library-src-lib-page-head.mjs.map