@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).
51 lines • 14.5 kB
JavaScript
import { CommonModule } from '@angular/common';
import { Component, forwardRef, Input, ViewEncapsulation } from '@angular/core';
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
import { PictogramComponent } from '../../shared';
import { DefaultRadioComponent } from '../default-radio.component';
import { DsfrFormFieldsetComponent, DsfrFormFieldsetElementDirective } from '../fieldset';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
export class DsfrFormRadioRichComponent extends DefaultRadioComponent {
constructor() {
super(...arguments);
/**
* Message d'information lié au composant
*/
this.message = undefined;
}
/**
* @deprecated (@since 1.1.0) utiliser la propriété options à la place.
*/
set radioRich(options) {
this.options = options;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DsfrFormRadioRichComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DsfrFormRadioRichComponent, isStandalone: true, selector: "dsfr-form-radio-rich", inputs: { options: "options", message: "message", messageSeverity: "messageSeverity", radioRich: "radioRich" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => DsfrFormRadioRichComponent),
multi: true,
},
], usesInheritance: true, ngImport: i0, template: "<dsfr-fieldset\n [id]=\"inputId\"\n [legend]=\"label\"\n [legendRegular]=\"legendRegular\"\n [disabled]=\"disabled\"\n [hint]=\"hint ?? ''\"\n [inline]=\"inline\"\n [error]=\"error\"\n [valid]=\"valid\"\n [message]=\"message\"\n [messageSeverity]=\"messageSeverity\">\n @if (!label) {\n <ng-container legend>\n <ng-content select=\"[legend]\"></ng-content>\n </ng-container>\n }\n @for (radio of options; track radio; let i = $index) {\n <div *fieldsetElement class=\"fr-radio-group fr-radio-rich\">\n <!--\n On bind \u00E0 la fois la propri\u00E9t\u00E9 et l'attribut 'name' pour contourner le bug suivant: https://github.com/angular/angular/issues/11757\n cf. issue#360\n -->\n <input\n type=\"radio\"\n [attr.id]=\"getRadioId(i)\"\n [name]=\"name!\"\n [attr.name]=\"name\"\n [value]=\"radio.value\"\n [disabled]=\"radio.disabled ? radio.disabled : false\"\n [attr.aria-invalid]=\"ariaInvalid || null\"\n [(ngModel)]=\"value\"\n [required]=\"required\" />\n <label class=\"fr-label\" [for]=\"getRadioId(i)\">\n <span [innerHTML]=\"radio.label\"></span>\n @if (radio.hint) {\n <span class=\"fr-hint-text\">{{ radio.hint }}</span>\n }\n </label>\n @if (radio.imagePath || radio.artworkFilePath) {\n <div\n [ngClass]=\"{\n 'fr-radio-rich__img': radio.imagePath,\n 'fr-radio-rich__pictogram': !radio.imagePath && radio.artworkFilePath\n }\">\n @if (radio.imagePath) {\n <img [src]=\"radio.imagePath\" [attr.alt]=\"radio.imageAlt\" />\n } @else if (radio.artworkFilePath && !radio.imagePath) {\n <edu-pictogram [artworkFilePath]=\"radio.artworkFilePath\"></edu-pictogram>\n }\n </div>\n }\n </div>\n }\n</dsfr-fieldset>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DsfrFormFieldsetComponent, selector: "dsfr-fieldset, dsfr-form-fieldset", inputs: ["inline"] }, { kind: "component", type: PictogramComponent, selector: "edu-pictogram", inputs: ["artworkDirPath", "artworkFilePath", "download"] }, { kind: "directive", type: DsfrFormFieldsetElementDirective, selector: "[fieldsetElement]", inputs: ["fieldsetElement"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DsfrFormRadioRichComponent, decorators: [{
type: Component,
args: [{ selector: 'dsfr-form-radio-rich', encapsulation: ViewEncapsulation.None, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => DsfrFormRadioRichComponent),
multi: true,
},
], standalone: true, imports: [CommonModule, FormsModule, DsfrFormFieldsetComponent, PictogramComponent, DsfrFormFieldsetElementDirective], template: "<dsfr-fieldset\n [id]=\"inputId\"\n [legend]=\"label\"\n [legendRegular]=\"legendRegular\"\n [disabled]=\"disabled\"\n [hint]=\"hint ?? ''\"\n [inline]=\"inline\"\n [error]=\"error\"\n [valid]=\"valid\"\n [message]=\"message\"\n [messageSeverity]=\"messageSeverity\">\n @if (!label) {\n <ng-container legend>\n <ng-content select=\"[legend]\"></ng-content>\n </ng-container>\n }\n @for (radio of options; track radio; let i = $index) {\n <div *fieldsetElement class=\"fr-radio-group fr-radio-rich\">\n <!--\n On bind \u00E0 la fois la propri\u00E9t\u00E9 et l'attribut 'name' pour contourner le bug suivant: https://github.com/angular/angular/issues/11757\n cf. issue#360\n -->\n <input\n type=\"radio\"\n [attr.id]=\"getRadioId(i)\"\n [name]=\"name!\"\n [attr.name]=\"name\"\n [value]=\"radio.value\"\n [disabled]=\"radio.disabled ? radio.disabled : false\"\n [attr.aria-invalid]=\"ariaInvalid || null\"\n [(ngModel)]=\"value\"\n [required]=\"required\" />\n <label class=\"fr-label\" [for]=\"getRadioId(i)\">\n <span [innerHTML]=\"radio.label\"></span>\n @if (radio.hint) {\n <span class=\"fr-hint-text\">{{ radio.hint }}</span>\n }\n </label>\n @if (radio.imagePath || radio.artworkFilePath) {\n <div\n [ngClass]=\"{\n 'fr-radio-rich__img': radio.imagePath,\n 'fr-radio-rich__pictogram': !radio.imagePath && radio.artworkFilePath\n }\">\n @if (radio.imagePath) {\n <img [src]=\"radio.imagePath\" [attr.alt]=\"radio.imageAlt\" />\n } @else if (radio.artworkFilePath && !radio.imagePath) {\n <edu-pictogram [artworkFilePath]=\"radio.artworkFilePath\"></edu-pictogram>\n }\n </div>\n }\n </div>\n }\n</dsfr-fieldset>\n" }]
}], propDecorators: { options: [{
type: Input
}], message: [{
type: Input
}], messageSeverity: [{
type: Input
}], radioRich: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1yYWRpby1yaWNoLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1kc2ZyLWNvbXBvbmVudHMvc3JjL2xpYi9mb3Jtcy9mb3JtLXJhZGlvLXJpY2gvZm9ybS1yYWRpby1yaWNoLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1kc2ZyLWNvbXBvbmVudHMvc3JjL2xpYi9mb3Jtcy9mb3JtLXJhZGlvLXJpY2gvZm9ybS1yYWRpby1yaWNoLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDaEYsT0FBTyxFQUFFLFdBQVcsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2hFLE9BQU8sRUFBZ0Isa0JBQWtCLEVBQUUsTUFBTSxjQUFjLENBQUM7QUFDaEUsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sNEJBQTRCLENBQUM7QUFDbkUsT0FBTyxFQUFFLHlCQUF5QixFQUFFLGdDQUFnQyxFQUFFLE1BQU0sYUFBYSxDQUFDOzs7O0FBaUIxRixNQUFNLE9BQU8sMEJBQTJCLFNBQVEscUJBQXFCO0lBZHJFOztRQW9CRTs7V0FFRztRQUNNLFlBQU8sR0FBdUIsU0FBUyxDQUFDO0tBYWxEO0lBTkM7O09BRUc7SUFDSCxJQUFhLFNBQVMsQ0FBQyxPQUF3QjtRQUM3QyxJQUFJLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQztJQUN6QixDQUFDOytHQXJCVSwwQkFBMEI7bUdBQTFCLDBCQUEwQixtTEFWMUI7WUFDVDtnQkFDRSxPQUFPLEVBQUUsaUJBQWlCO2dCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLDBCQUEwQixDQUFDO2dCQUN6RCxLQUFLLEVBQUUsSUFBSTthQUNaO1NBQ0YsaURDbEJILG8yREFzREEsMkNEbENZLFlBQVksNEhBQUUsV0FBVywraENBQUUseUJBQXlCLGtHQUFFLGtCQUFrQixxSEFBRSxnQ0FBZ0M7OzRGQUV6RywwQkFBMEI7a0JBZHRDLFNBQVM7K0JBQ0Usc0JBQXNCLGlCQUVqQixpQkFBaUIsQ0FBQyxJQUFJLGFBQzFCO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLDJCQUEyQixDQUFDOzRCQUN6RCxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRixjQUNXLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxXQUFXLEVBQUUseUJBQXlCLEVBQUUsa0JBQWtCLEVBQUUsZ0NBQWdDLENBQUM7OEJBTTVHLE9BQU87c0JBQWYsS0FBSztnQkFLRyxPQUFPO3NCQUFmLEtBQUs7Z0JBS0csZUFBZTtzQkFBdkIsS0FBSztnQkFLTyxTQUFTO3NCQUFyQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgZm9yd2FyZFJlZiwgSW5wdXQsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3Jtc01vZHVsZSwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBEc2ZyU2V2ZXJpdHksIFBpY3RvZ3JhbUNvbXBvbmVudCB9IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5pbXBvcnQgeyBEZWZhdWx0UmFkaW9Db21wb25lbnQgfSBmcm9tICcuLi9kZWZhdWx0LXJhZGlvLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBEc2ZyRm9ybUZpZWxkc2V0Q29tcG9uZW50LCBEc2ZyRm9ybUZpZWxkc2V0RWxlbWVudERpcmVjdGl2ZSB9IGZyb20gJy4uL2ZpZWxkc2V0JztcbmltcG9ydCB7IERzZnJSYWRpb1JpY2ggfSBmcm9tICcuL2Zvcm0tcmFkaW8tcmljaC5tb2RlbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2RzZnItZm9ybS1yYWRpby1yaWNoJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2Zvcm0tcmFkaW8tcmljaC5jb21wb25lbnQuaHRtbCcsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIHByb3ZpZGVyczogW1xuICAgIHtcbiAgICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gRHNmckZvcm1SYWRpb1JpY2hDb21wb25lbnQpLFxuICAgICAgbXVsdGk6IHRydWUsXG4gICAgfSxcbiAgXSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgRm9ybXNNb2R1bGUsIERzZnJGb3JtRmllbGRzZXRDb21wb25lbnQsIFBpY3RvZ3JhbUNvbXBvbmVudCwgRHNmckZvcm1GaWVsZHNldEVsZW1lbnREaXJlY3RpdmVdLFxufSlcbmV4cG9ydCBjbGFzcyBEc2ZyRm9ybVJhZGlvUmljaENvbXBvbmVudCBleHRlbmRzIERlZmF1bHRSYWRpb0NvbXBvbmVudCB7XG4gIC8qKlxuICAgKiBMZSBtb2TDqGxlIGRlIHByw6lzZW50YXRpb24gcGVybWV0dGFudCBkZSB0cmFuc21ldHRyZSBsYSBsaXN0ZSBkZXMgcmFkaW9zLlxuICAgKi9cbiAgQElucHV0KCkgb3B0aW9uczogRHNmclJhZGlvUmljaFtdO1xuXG4gIC8qKlxuICAgKiBNZXNzYWdlIGQnaW5mb3JtYXRpb24gbGnDqSBhdSBjb21wb3NhbnRcbiAgICovXG4gIEBJbnB1dCgpIG1lc3NhZ2U6IHN0cmluZyB8IHVuZGVmaW5lZCA9IHVuZGVmaW5lZDtcblxuICAvKipcbiAgICogUmVwcsOpc2VudGUgbGEgc8OpdsOpcml0w6kgZHUgbWVzc2FnZVxuICAgKi9cbiAgQElucHV0KCkgbWVzc2FnZVNldmVyaXR5OiBEc2ZyU2V2ZXJpdHk7XG5cbiAgLyoqXG4gICAqIEBkZXByZWNhdGVkIChAc2luY2UgMS4xLjApIHV0aWxpc2VyIGxhIHByb3ByacOpdMOpIG9wdGlvbnMgw6AgbGEgcGxhY2UuXG4gICAqL1xuICBASW5wdXQoKSBzZXQgcmFkaW9SaWNoKG9wdGlvbnM6IERzZnJSYWRpb1JpY2hbXSkge1xuICAgIHRoaXMub3B0aW9ucyA9IG9wdGlvbnM7XG4gIH1cbn1cbiIsIjxkc2ZyLWZpZWxkc2V0XG4gIFtpZF09XCJpbnB1dElkXCJcbiAgW2xlZ2VuZF09XCJsYWJlbFwiXG4gIFtsZWdlbmRSZWd1bGFyXT1cImxlZ2VuZFJlZ3VsYXJcIlxuICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICBbaGludF09XCJoaW50ID8/ICcnXCJcbiAgW2lubGluZV09XCJpbmxpbmVcIlxuICBbZXJyb3JdPVwiZXJyb3JcIlxuICBbdmFsaWRdPVwidmFsaWRcIlxuICBbbWVzc2FnZV09XCJtZXNzYWdlXCJcbiAgW21lc3NhZ2VTZXZlcml0eV09XCJtZXNzYWdlU2V2ZXJpdHlcIj5cbiAgQGlmICghbGFiZWwpIHtcbiAgICA8bmctY29udGFpbmVyIGxlZ2VuZD5cbiAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltsZWdlbmRdXCI+PC9uZy1jb250ZW50PlxuICAgIDwvbmctY29udGFpbmVyPlxuICB9XG4gIEBmb3IgKHJhZGlvIG9mIG9wdGlvbnM7IHRyYWNrIHJhZGlvOyBsZXQgaSA9ICRpbmRleCkge1xuICAgIDxkaXYgKmZpZWxkc2V0RWxlbWVudCBjbGFzcz1cImZyLXJhZGlvLWdyb3VwIGZyLXJhZGlvLXJpY2hcIj5cbiAgICAgIDwhLS1cbiAgICAgIE9uIGJpbmQgw6AgbGEgZm9pcyBsYSBwcm9wcmnDqXTDqSBldCBsJ2F0dHJpYnV0ICduYW1lJyBwb3VyIGNvbnRvdXJuZXIgbGUgYnVnIHN1aXZhbnQ6IGh0dHBzOi8vZ2l0aHViLmNvbS9hbmd1bGFyL2FuZ3VsYXIvaXNzdWVzLzExNzU3XG4gICAgICBjZi4gaXNzdWUjMzYwXG4gICAgICAtLT5cbiAgICAgIDxpbnB1dFxuICAgICAgICB0eXBlPVwicmFkaW9cIlxuICAgICAgICBbYXR0ci5pZF09XCJnZXRSYWRpb0lkKGkpXCJcbiAgICAgICAgW25hbWVdPVwibmFtZSFcIlxuICAgICAgICBbYXR0ci5uYW1lXT1cIm5hbWVcIlxuICAgICAgICBbdmFsdWVdPVwicmFkaW8udmFsdWVcIlxuICAgICAgICBbZGlzYWJsZWRdPVwicmFkaW8uZGlzYWJsZWQgPyByYWRpby5kaXNhYmxlZCA6IGZhbHNlXCJcbiAgICAgICAgW2F0dHIuYXJpYS1pbnZhbGlkXT1cImFyaWFJbnZhbGlkIHx8IG51bGxcIlxuICAgICAgICBbKG5nTW9kZWwpXT1cInZhbHVlXCJcbiAgICAgICAgW3JlcXVpcmVkXT1cInJlcXVpcmVkXCIgLz5cbiAgICAgIDxsYWJlbCBjbGFzcz1cImZyLWxhYmVsXCIgW2Zvcl09XCJnZXRSYWRpb0lkKGkpXCI+XG4gICAgICAgIDxzcGFuIFtpbm5lckhUTUxdPVwicmFkaW8ubGFiZWxcIj48L3NwYW4+XG4gICAgICAgIEBpZiAocmFkaW8uaGludCkge1xuICAgICAgICAgIDxzcGFuIGNsYXNzPVwiZnItaGludC10ZXh0XCI+e3sgcmFkaW8uaGludCB9fTwvc3Bhbj5cbiAgICAgICAgfVxuICAgICAgPC9sYWJlbD5cbiAgICAgIEBpZiAocmFkaW8uaW1hZ2VQYXRoIHx8IHJhZGlvLmFydHdvcmtGaWxlUGF0aCkge1xuICAgICAgICA8ZGl2XG4gICAgICAgICAgW25nQ2xhc3NdPVwie1xuICAgICAgICAgICAgJ2ZyLXJhZGlvLXJpY2hfX2ltZyc6IHJhZGlvLmltYWdlUGF0aCxcbiAgICAgICAgICAgICdmci1yYWRpby1yaWNoX19waWN0b2dyYW0nOiAhcmFkaW8uaW1hZ2VQYXRoICYmIHJhZGlvLmFydHdvcmtGaWxlUGF0aFxuICAgICAgICAgIH1cIj5cbiAgICAgICAgICBAaWYgKHJhZGlvLmltYWdlUGF0aCkge1xuICAgICAgICAgICAgPGltZyBbc3JjXT1cInJhZGlvLmltYWdlUGF0aFwiIFthdHRyLmFsdF09XCJyYWRpby5pbWFnZUFsdFwiIC8+XG4gICAgICAgICAgfSBAZWxzZSBpZiAocmFkaW8uYXJ0d29ya0ZpbGVQYXRoICYmICFyYWRpby5pbWFnZVBhdGgpIHtcbiAgICAgICAgICAgIDxlZHUtcGljdG9ncmFtIFthcnR3b3JrRmlsZVBhdGhdPVwicmFkaW8uYXJ0d29ya0ZpbGVQYXRoXCI+PC9lZHUtcGljdG9ncmFtPlxuICAgICAgICAgIH1cbiAgICAgICAgPC9kaXY+XG4gICAgICB9XG4gICAgPC9kaXY+XG4gIH1cbjwvZHNmci1maWVsZHNldD5cbiJdfQ==