@edugouvfr/ngx-dsfr
Version:
NgxDsfr est un portage Angular des éléments d'interface du Système de Design de l'État Français (DSFR).
44 lines • 8.39 kB
JavaScript
import { Component, Input, ViewEncapsulation } from '@angular/core';
import { DsfrHeadingLevelConst } from '../../shared';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class DsfrCalloutComponent {
constructor() {
/**
* Le niveau de titre devant être utilisé.
* Valeurs supportées : H2, H3, H4, H5, H6 ou P si vous ne souhaitez pas positionner un titre de section.
*/
this.headingLevel = DsfrHeadingLevelConst.H3;
}
/**
* Détermine la liste des classes CSS à positioner sur le parent.
* @returns un tableau de classes CSS
*
* @internal
*/
getClasses() {
let results = ['fr-callout'];
if (this.icon) {
results = results.concat(this.icon.trim().split(/\s+/));
}
if (this.customClass) {
results = results.concat(this.customClass.trim().split(/\s+/));
}
return results;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DsfrCalloutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DsfrCalloutComponent, selector: "dsfr-callout", inputs: { heading: "heading", headingLevel: "headingLevel", icon: "icon", customClass: "customClass" }, ngImport: i0, template: "<div [class]=\"getClasses()\">\n <ng-container *ngIf=\"heading\" [ngSwitch]=\"headingLevel\">\n <p *ngSwitchCase=\"'NONE'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></p>\n <h2 *ngSwitchCase=\"'H2'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h2>\n <h4 *ngSwitchCase=\"'H4'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h4>\n <h5 *ngSwitchCase=\"'H5'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h5>\n <h6 *ngSwitchCase=\"'H6'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h6>\n <h3 *ngSwitchDefault class=\"fr-callout__title\" [innerHTML]=\"heading\"></h3>\n </ng-container>\n <p class=\"fr-callout__text\">\n <ng-content></ng-content>\n </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DsfrCalloutComponent, decorators: [{
type: Component,
args: [{ selector: 'dsfr-callout', encapsulation: ViewEncapsulation.None, template: "<div [class]=\"getClasses()\">\n <ng-container *ngIf=\"heading\" [ngSwitch]=\"headingLevel\">\n <p *ngSwitchCase=\"'NONE'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></p>\n <h2 *ngSwitchCase=\"'H2'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h2>\n <h4 *ngSwitchCase=\"'H4'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h4>\n <h5 *ngSwitchCase=\"'H5'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h5>\n <h6 *ngSwitchCase=\"'H6'\" class=\"fr-callout__title\" [innerHTML]=\"heading\"></h6>\n <h3 *ngSwitchDefault class=\"fr-callout__title\" [innerHTML]=\"heading\"></h3>\n </ng-container>\n <p class=\"fr-callout__text\">\n <ng-content></ng-content>\n </p>\n</div>\n" }]
}], propDecorators: { heading: [{
type: Input
}], headingLevel: [{
type: Input
}], icon: [{
type: Input
}], customClass: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FsbG91dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZHNmci1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy9jYWxsb3V0L2NhbGxvdXQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWRzZnItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvY2FsbG91dC9jYWxsb3V0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3BFLE9BQU8sRUFBb0IscUJBQXFCLEVBQUUsTUFBTSxjQUFjLENBQUM7OztBQU92RSxNQUFNLE9BQU8sb0JBQW9CO0lBTGpDO1FBV0U7OztXQUdHO1FBQ00saUJBQVksR0FBcUIscUJBQXFCLENBQUMsRUFBRSxDQUFDO0tBOEJwRTtJQWpCQzs7Ozs7T0FLRztJQUNILFVBQVU7UUFDUixJQUFJLE9BQU8sR0FBYSxDQUFDLFlBQVksQ0FBQyxDQUFDO1FBQ3ZDLElBQUksSUFBSSxDQUFDLElBQUksRUFBRTtZQUNiLE9BQU8sR0FBRyxPQUFPLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7U0FDekQ7UUFDRCxJQUFJLElBQUksQ0FBQyxXQUFXLEVBQUU7WUFDcEIsT0FBTyxHQUFHLE9BQU8sQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLEVBQUUsQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztTQUNoRTtRQUVELE9BQU8sT0FBTyxDQUFDO0lBQ2pCLENBQUM7K0dBdkNVLG9CQUFvQjttR0FBcEIsb0JBQW9CLDRKQ1JqQyw0dEJBYUE7OzRGRExhLG9CQUFvQjtrQkFMaEMsU0FBUzsrQkFDRSxjQUFjLGlCQUVULGlCQUFpQixDQUFDLElBQUk7OEJBTTVCLE9BQU87c0JBQWYsS0FBSztnQkFNRyxZQUFZO3NCQUFwQixLQUFLO2dCQUtHLElBQUk7c0JBQVosS0FBSztnQkFNRyxXQUFXO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IERzZnJIZWFkaW5nTGV2ZWwsIERzZnJIZWFkaW5nTGV2ZWxDb25zdCB9IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2RzZnItY2FsbG91dCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9jYWxsb3V0LmNvbXBvbmVudC5odG1sJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgRHNmckNhbGxvdXRDb21wb25lbnQge1xuICAvKipcbiAgICogVGl0cmUgZHUgY2FsbCBvdXQuIFNpIGluZXhpc3RhbnQsIHBhcyBkZSBiYWxpc2UgdGl0cmUuXG4gICAqL1xuICBASW5wdXQoKSBoZWFkaW5nOiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIExlIG5pdmVhdSBkZSB0aXRyZSBkZXZhbnQgw6p0cmUgdXRpbGlzw6kuXG4gICAqIFZhbGV1cnMgc3VwcG9ydMOpZXMgOiBIMiwgSDMsIEg0LCBINSwgSDYgb3UgUCBzaSB2b3VzIG5lIHNvdWhhaXRleiBwYXMgcG9zaXRpb25uZXIgdW4gdGl0cmUgZGUgc2VjdGlvbi5cbiAgICovXG4gIEBJbnB1dCgpIGhlYWRpbmdMZXZlbDogRHNmckhlYWRpbmdMZXZlbCA9IERzZnJIZWFkaW5nTGV2ZWxDb25zdC5IMztcblxuICAvKipcbiAgICogSW5kaXF1ZSBsYSBjbGFzc2UgZCdpY8O0bmUgw6AgdXRpbGlzZXIgZW4gaGF1dCDDoCBnYXVjaGUuIEV4LiBgZnItaWNvbi1pbmZvcm1hdGlvbi1saW5lYC5cbiAgICovXG4gIEBJbnB1dCgpIGljb246IHN0cmluZztcblxuICAvKipcbiAgICogUGVybWV0IGRlIHBlcnNvbm5hbGlzZXIgbGEgY291bGV1ciBkdSB0YWcuIElsIGZhdXQgZG9ubmVyIGxhIGNsYXNzIGV4YWN0IChleCA6IGZyLWNhbGxvdXQtLWdyZWVuLWVtZXJhdWRlKSBxdWUgdm91cyB0cm91dmVyZXpcbiAgICogW2ljaV0oaHR0cHM6Ly9nb3V2ZnIuYXRsYXNzaWFuLm5ldC93aWtpL3NwYWNlcy9EQi9wYWdlcy8yMjIzMzExOTYvTWlzZStlbithdmFudCstK0NhbGwrb3V0I1BlcnNvbm5hbGlzYXRpb24pLlxuICAgKi9cbiAgQElucHV0KCkgY3VzdG9tQ2xhc3M6IHN0cmluZztcblxuICAvKipcbiAgICogRMOpdGVybWluZSBsYSBsaXN0ZSBkZXMgY2xhc3NlcyBDU1Mgw6AgcG9zaXRpb25lciBzdXIgbGUgcGFyZW50LlxuICAgKiBAcmV0dXJucyB1biB0YWJsZWF1IGRlIGNsYXNzZXMgQ1NTXG4gICAqXG4gICAqIEBpbnRlcm5hbFxuICAgKi9cbiAgZ2V0Q2xhc3NlcygpOiBzdHJpbmdbXSB7XG4gICAgbGV0IHJlc3VsdHM6IHN0cmluZ1tdID0gWydmci1jYWxsb3V0J107XG4gICAgaWYgKHRoaXMuaWNvbikge1xuICAgICAgcmVzdWx0cyA9IHJlc3VsdHMuY29uY2F0KHRoaXMuaWNvbi50cmltKCkuc3BsaXQoL1xccysvKSk7XG4gICAgfVxuICAgIGlmICh0aGlzLmN1c3RvbUNsYXNzKSB7XG4gICAgICByZXN1bHRzID0gcmVzdWx0cy5jb25jYXQodGhpcy5jdXN0b21DbGFzcy50cmltKCkuc3BsaXQoL1xccysvKSk7XG4gICAgfVxuXG4gICAgcmV0dXJuIHJlc3VsdHM7XG4gIH1cbn1cbiIsIjxkaXYgW2NsYXNzXT1cImdldENsYXNzZXMoKVwiPlxuICA8bmctY29udGFpbmVyICpuZ0lmPVwiaGVhZGluZ1wiIFtuZ1N3aXRjaF09XCJoZWFkaW5nTGV2ZWxcIj5cbiAgICA8cCAqbmdTd2l0Y2hDYXNlPVwiJ05PTkUnXCIgY2xhc3M9XCJmci1jYWxsb3V0X190aXRsZVwiIFtpbm5lckhUTUxdPVwiaGVhZGluZ1wiPjwvcD5cbiAgICA8aDIgKm5nU3dpdGNoQ2FzZT1cIidIMidcIiBjbGFzcz1cImZyLWNhbGxvdXRfX3RpdGxlXCIgW2lubmVySFRNTF09XCJoZWFkaW5nXCI+PC9oMj5cbiAgICA8aDQgKm5nU3dpdGNoQ2FzZT1cIidINCdcIiBjbGFzcz1cImZyLWNhbGxvdXRfX3RpdGxlXCIgW2lubmVySFRNTF09XCJoZWFkaW5nXCI+PC9oND5cbiAgICA8aDUgKm5nU3dpdGNoQ2FzZT1cIidINSdcIiBjbGFzcz1cImZyLWNhbGxvdXRfX3RpdGxlXCIgW2lubmVySFRNTF09XCJoZWFkaW5nXCI+PC9oNT5cbiAgICA8aDYgKm5nU3dpdGNoQ2FzZT1cIidINidcIiBjbGFzcz1cImZyLWNhbGxvdXRfX3RpdGxlXCIgW2lubmVySFRNTF09XCJoZWFkaW5nXCI+PC9oNj5cbiAgICA8aDMgKm5nU3dpdGNoRGVmYXVsdCBjbGFzcz1cImZyLWNhbGxvdXRfX3RpdGxlXCIgW2lubmVySFRNTF09XCJoZWFkaW5nXCI+PC9oMz5cbiAgPC9uZy1jb250YWluZXI+XG4gIDxwIGNsYXNzPVwiZnItY2FsbG91dF9fdGV4dFwiPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9wPlxuPC9kaXY+XG4iXX0=