@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).
48 lines • 10.6 kB
JavaScript
import { Component, forwardRef, Input, ViewEncapsulation } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { DefaultRadioComponent } from '../default-radio.component';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
import * as i3 from "../fieldset/form-fieldset.component";
import * as i4 from "../fieldset/form-fieldset-element.directive";
export class DsfrFormRadioComponent extends DefaultRadioComponent {
constructor() {
super(...arguments);
/**
* Réduit la taille du radio à 16px (au lieu de 24px).
*/
this.small = false;
}
/**
* @deprecated (@since 1.1.0), utiliser la propriété options à la place.
*/
set radios(options) {
this.options = options;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DsfrFormRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DsfrFormRadioComponent, selector: "dsfr-form-radio", inputs: { options: "options", small: "small", radios: "radios" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => DsfrFormRadioComponent),
multi: true,
},
], usesInheritance: true, ngImport: i0, template: "<dsfr-fieldset\n [id]=\"inputId\"\n [legend]=\"label ?? ''\"\n [legendRegular]=\"legendRegular\"\n [hint]=\"hint ?? ''\"\n [inline]=\"inline\"\n [disabled]=\"disabled\"\n [error]=\"error\"\n [valid]=\"valid\">\n <ng-container *ngIf=\"!label\" legend>\n <ng-content select=\"[legend]\"></ng-content>\n </ng-container>\n <ng-container *ngFor=\"let radio of options; let i = index\">\n <div *fieldsetElement class=\"fr-radio-group\" [ngClass]=\"{ 'fr-radio-group--sm': small }\">\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 [value]=\"radio.value\"\n [(ngModel)]=\"value\"\n [disabled]=\"disabled\"\n [attr.name]=\"name\"\n [attr.required]=\"required\" />\n <label class=\"fr-label\" [for]=\"getRadioId(i)\">\n <div [outerHTML]=\"radio.label\"></div>\n <span *ngIf=\"radio.hint\" class=\"fr-hint-text\">{{ radio.hint }}</span>\n </label>\n </div>\n </ng-container>\n</dsfr-fieldset>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.DsfrFormFieldsetComponent, selector: "dsfr-fieldset, dsfr-form-fieldset", inputs: ["inline"] }, { kind: "directive", type: i4.DsfrFormFieldsetElementDirective, selector: "[fieldsetElement]", inputs: ["fieldsetElement"] }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DsfrFormRadioComponent, decorators: [{
type: Component,
args: [{ selector: 'dsfr-form-radio', encapsulation: ViewEncapsulation.None, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => DsfrFormRadioComponent),
multi: true,
},
], template: "<dsfr-fieldset\n [id]=\"inputId\"\n [legend]=\"label ?? ''\"\n [legendRegular]=\"legendRegular\"\n [hint]=\"hint ?? ''\"\n [inline]=\"inline\"\n [disabled]=\"disabled\"\n [error]=\"error\"\n [valid]=\"valid\">\n <ng-container *ngIf=\"!label\" legend>\n <ng-content select=\"[legend]\"></ng-content>\n </ng-container>\n <ng-container *ngFor=\"let radio of options; let i = index\">\n <div *fieldsetElement class=\"fr-radio-group\" [ngClass]=\"{ 'fr-radio-group--sm': small }\">\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 [value]=\"radio.value\"\n [(ngModel)]=\"value\"\n [disabled]=\"disabled\"\n [attr.name]=\"name\"\n [attr.required]=\"required\" />\n <label class=\"fr-label\" [for]=\"getRadioId(i)\">\n <div [outerHTML]=\"radio.label\"></div>\n <span *ngIf=\"radio.hint\" class=\"fr-hint-text\">{{ radio.hint }}</span>\n </label>\n </div>\n </ng-container>\n</dsfr-fieldset>\n" }]
}], propDecorators: { options: [{
type: Input
}], small: [{
type: Input
}], radios: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1yYWRpby5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZHNmci1jb21wb25lbnRzL3NyYy9saWIvZm9ybXMvZm9ybS1yYWRpby9mb3JtLXJhZGlvLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1kc2ZyLWNvbXBvbmVudHMvc3JjL2xpYi9mb3Jtcy9mb3JtLXJhZGlvL2Zvcm0tcmFkaW8uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2hGLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ25ELE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7Ozs7QUFlbkUsTUFBTSxPQUFPLHNCQUF1QixTQUFRLHFCQUFxQjtJQVpqRTs7UUFrQkU7O1dBRUc7UUFDTSxVQUFLLEdBQUcsS0FBSyxDQUFDO0tBUXhCO0lBTkM7O09BRUc7SUFDSCxJQUFhLE1BQU0sQ0FBQyxPQUFvQjtRQUN0QyxJQUFJLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQztJQUN6QixDQUFDOytHQWhCVSxzQkFBc0I7bUdBQXRCLHNCQUFzQiw0R0FSdEI7WUFDVDtnQkFDRSxPQUFPLEVBQUUsaUJBQWlCO2dCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLHNCQUFzQixDQUFDO2dCQUNyRCxLQUFLLEVBQUUsSUFBSTthQUNaO1NBQ0YsaURDZkgsd3NDQWtDQTs7NEZEakJhLHNCQUFzQjtrQkFabEMsU0FBUzsrQkFDRSxpQkFBaUIsaUJBRVosaUJBQWlCLENBQUMsSUFBSSxhQUMxQjt3QkFDVDs0QkFDRSxPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSx1QkFBdUIsQ0FBQzs0QkFDckQsS0FBSyxFQUFFLElBQUk7eUJBQ1o7cUJBQ0Y7OEJBTVEsT0FBTztzQkFBZixLQUFLO2dCQUtHLEtBQUs7c0JBQWIsS0FBSztnQkFLTyxNQUFNO3NCQUFsQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBmb3J3YXJkUmVmLCBJbnB1dCwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgRGVmYXVsdFJhZGlvQ29tcG9uZW50IH0gZnJvbSAnLi4vZGVmYXVsdC1yYWRpby5jb21wb25lbnQnO1xuaW1wb3J0IHsgRHNmclJhZGlvIH0gZnJvbSAnLi9mb3JtLXJhZGlvLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZHNmci1mb3JtLXJhZGlvJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2Zvcm0tcmFkaW8uY29tcG9uZW50Lmh0bWwnLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBwcm92aWRlcnM6IFtcbiAgICB7XG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcbiAgICAgIHVzZUV4aXN0aW5nOiBmb3J3YXJkUmVmKCgpID0+IERzZnJGb3JtUmFkaW9Db21wb25lbnQpLFxuICAgICAgbXVsdGk6IHRydWUsXG4gICAgfSxcbiAgXSxcbn0pXG5leHBvcnQgY2xhc3MgRHNmckZvcm1SYWRpb0NvbXBvbmVudCBleHRlbmRzIERlZmF1bHRSYWRpb0NvbXBvbmVudCB7XG4gIC8qKlxuICAgKiBMZSBtb2TDqGxlIGRlIHByw6lzZW50YXRpb24gcGVybWV0dGFudCBkZSB0cmFuc21ldHRyZSBsYSBsaXN0ZSBkZXMgcmFkaW9zLlxuICAgKi9cbiAgQElucHV0KCkgb3B0aW9uczogRHNmclJhZGlvW107XG5cbiAgLyoqXG4gICAqIFLDqWR1aXQgbGEgdGFpbGxlIGR1IHJhZGlvIMOgIDE2cHggKGF1IGxpZXUgZGUgMjRweCkuXG4gICAqL1xuICBASW5wdXQoKSBzbWFsbCA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBAZGVwcmVjYXRlZCAoQHNpbmNlIDEuMS4wKSwgdXRpbGlzZXIgbGEgcHJvcHJpw6l0w6kgb3B0aW9ucyDDoCBsYSBwbGFjZS5cbiAgICovXG4gIEBJbnB1dCgpIHNldCByYWRpb3Mob3B0aW9uczogRHNmclJhZGlvW10pIHtcbiAgICB0aGlzLm9wdGlvbnMgPSBvcHRpb25zO1xuICB9XG59XG4iLCI8ZHNmci1maWVsZHNldFxuICBbaWRdPVwiaW5wdXRJZFwiXG4gIFtsZWdlbmRdPVwibGFiZWwgPz8gJydcIlxuICBbbGVnZW5kUmVndWxhcl09XCJsZWdlbmRSZWd1bGFyXCJcbiAgW2hpbnRdPVwiaGludCA/PyAnJ1wiXG4gIFtpbmxpbmVdPVwiaW5saW5lXCJcbiAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgW2Vycm9yXT1cImVycm9yXCJcbiAgW3ZhbGlkXT1cInZhbGlkXCI+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCIhbGFiZWxcIiBsZWdlbmQ+XG4gICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2xlZ2VuZF1cIj48L25nLWNvbnRlbnQ+XG4gIDwvbmctY29udGFpbmVyPlxuICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCByYWRpbyBvZiBvcHRpb25zOyBsZXQgaSA9IGluZGV4XCI+XG4gICAgPGRpdiAqZmllbGRzZXRFbGVtZW50IGNsYXNzPVwiZnItcmFkaW8tZ3JvdXBcIiBbbmdDbGFzc109XCJ7ICdmci1yYWRpby1ncm91cC0tc20nOiBzbWFsbCB9XCI+XG4gICAgICA8IS0tXG4gICAgICAgIE9uIGJpbmQgw6AgbGEgZm9pcyBsYSBwcm9wcmnDqXTDqSBldCBsJ2F0dHJpYnV0ICduYW1lJyBwb3VyIGNvbnRvdXJuZXIgbGUgYnVnIHN1aXZhbnQ6IGh0dHBzOi8vZ2l0aHViLmNvbS9hbmd1bGFyL2FuZ3VsYXIvaXNzdWVzLzExNzU3IFxuICAgICAgICBjZi4gaXNzdWUjMzYwXG4gICAgICAtLT5cbiAgICAgIDxpbnB1dFxuICAgICAgICB0eXBlPVwicmFkaW9cIlxuICAgICAgICBbYXR0ci5pZF09XCJnZXRSYWRpb0lkKGkpXCJcbiAgICAgICAgW25hbWVdPVwibmFtZSFcIlxuICAgICAgICBbdmFsdWVdPVwicmFkaW8udmFsdWVcIlxuICAgICAgICBbKG5nTW9kZWwpXT1cInZhbHVlXCJcbiAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICAgICAgW2F0dHIubmFtZV09XCJuYW1lXCJcbiAgICAgICAgW2F0dHIucmVxdWlyZWRdPVwicmVxdWlyZWRcIiAvPlxuICAgICAgPGxhYmVsIGNsYXNzPVwiZnItbGFiZWxcIiBbZm9yXT1cImdldFJhZGlvSWQoaSlcIj5cbiAgICAgICAgPGRpdiBbb3V0ZXJIVE1MXT1cInJhZGlvLmxhYmVsXCI+PC9kaXY+XG4gICAgICAgIDxzcGFuICpuZ0lmPVwicmFkaW8uaGludFwiIGNsYXNzPVwiZnItaGludC10ZXh0XCI+e3sgcmFkaW8uaGludCB9fTwvc3Bhbj5cbiAgICAgIDwvbGFiZWw+XG4gICAgPC9kaXY+XG4gIDwvbmctY29udGFpbmVyPlxuPC9kc2ZyLWZpZWxkc2V0PlxuIl19