@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).
74 lines • 7.63 kB
JavaScript
import { Component, EventEmitter, Input, Output, ViewEncapsulation, inject } from '@angular/core';
import { DsfrI18nService } from '../../../shared';
import * as i0 from "@angular/core";
/**
* Composant de sélection pour une colonne (checkbox)
* fixme : créer composant standalone checkbox lorsque le DSFR aura fix la version sans aria-label
*/
export class DsfrCellCheckboxComponent {
constructor() {
this.selectRow = new EventEmitter();
/** @internal */
this.i18n = inject(DsfrI18nService);
}
get checked() {
return this._checked;
}
set checked(checked) {
this._checked = checked;
}
set isAllChecked(isAllChecked) {
if (this.row.index === 'all') {
this.checked = isAllChecked;
}
}
onSelectRow() {
this.checked = !this.checked;
this.selectRow.emit(this.checked);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DsfrCellCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DsfrCellCheckboxComponent, isStandalone: true, selector: "dsfr-cell-checkbox", inputs: { tableId: "tableId", row: "row", showSelectAll: "showSelectAll", checked: "checked", isAllChecked: "isAllChecked" }, outputs: { selectRow: "selectRow" }, ngImport: i0, template: `
<div (click)="onSelectRow()" class="fr-checkbox-group fr-checkbox-group--sm">
<input
class="edu-table-checkbox"
name="row-select"
id="table-select-checkbox-{{ tableId }}--{{ row?.index }}"
type="checkbox" />
<label class="fr-label" for="table-select-checkbox-{{ tableId }}--{{ row?.index }}">
<span class="fr-sr-only">
{{ showSelectAll ? 'Tout sélectionner' : i18n.t('table.selectRow') + ' ' + row?.index }}
</span>
</label>
</div>
`, isInline: true, styles: [".fr-checkbox-group--sm .edu-table-checkbox+label:before{margin-top:-.75rem}.fr-checkbox-group--sm input[type=checkbox].edu-table-checkbox{margin-top:-.75rem}\n"], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DsfrCellCheckboxComponent, decorators: [{
type: Component,
args: [{ selector: 'dsfr-cell-checkbox', standalone: true, encapsulation: ViewEncapsulation.None, imports: [], template: `
<div (click)="onSelectRow()" class="fr-checkbox-group fr-checkbox-group--sm">
<input
class="edu-table-checkbox"
name="row-select"
id="table-select-checkbox-{{ tableId }}--{{ row?.index }}"
type="checkbox" />
<label class="fr-label" for="table-select-checkbox-{{ tableId }}--{{ row?.index }}">
<span class="fr-sr-only">
{{ showSelectAll ? 'Tout sélectionner' : i18n.t('table.selectRow') + ' ' + row?.index }}
</span>
</label>
</div>
`, styles: [".fr-checkbox-group--sm .edu-table-checkbox+label:before{margin-top:-.75rem}.fr-checkbox-group--sm input[type=checkbox].edu-table-checkbox{margin-top:-.75rem}\n"] }]
}], propDecorators: { tableId: [{
type: Input
}], row: [{
type: Input
}], showSelectAll: [{
type: Input
}], selectRow: [{
type: Output
}], checked: [{
type: Input
}], isAllChecked: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2VsbC1jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZHNmci1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy90YWJsZS9jb21wb25lbnQvY2VsbC1jaGVja2JveC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbEcsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGlCQUFpQixDQUFDOztBQUVsRDs7O0dBR0c7QUFzQkgsTUFBTSxPQUFPLHlCQUF5QjtJQXJCdEM7UUF5QlksY0FBUyxHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7UUFFbEQsZ0JBQWdCO1FBQ1QsU0FBSSxHQUFHLE1BQU0sQ0FBQyxlQUFlLENBQUMsQ0FBQztLQXNCdkM7SUFsQkMsSUFBSSxPQUFPO1FBQ1QsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDO0lBQ3ZCLENBQUM7SUFFRCxJQUFhLE9BQU8sQ0FBQyxPQUE0QjtRQUMvQyxJQUFJLENBQUMsUUFBUSxHQUFHLE9BQU8sQ0FBQztJQUMxQixDQUFDO0lBRUQsSUFBYSxZQUFZLENBQUMsWUFBcUI7UUFDN0MsSUFBSSxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssS0FBSyxLQUFLLEVBQUUsQ0FBQztZQUM3QixJQUFJLENBQUMsT0FBTyxHQUFHLFlBQVksQ0FBQztRQUM5QixDQUFDO0lBQ0gsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsT0FBTyxHQUFHLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQztRQUM3QixJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDcEMsQ0FBQzsrR0E1QlUseUJBQXlCO21HQUF6Qix5QkFBeUIsaVBBZjFCOzs7Ozs7Ozs7Ozs7O0dBYVQ7OzRGQUVVLHlCQUF5QjtrQkFyQnJDLFNBQVM7K0JBQ0Usb0JBQW9CLGNBQ2xCLElBQUksaUJBRUQsaUJBQWlCLENBQUMsSUFBSSxXQUM1QixFQUFFLFlBQ0Q7Ozs7Ozs7Ozs7Ozs7R0FhVDs4QkFHUSxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csR0FBRztzQkFBWCxLQUFLO2dCQUNHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBQ0ksU0FBUztzQkFBbEIsTUFBTTtnQkFXTSxPQUFPO3NCQUFuQixLQUFLO2dCQUlPLFlBQVk7c0JBQXhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCwgVmlld0VuY2Fwc3VsYXRpb24sIGluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRHNmckkxOG5TZXJ2aWNlIH0gZnJvbSAnLi4vLi4vLi4vc2hhcmVkJztcblxuLyoqXG4gKiBDb21wb3NhbnQgZGUgc8OpbGVjdGlvbiBwb3VyIHVuZSBjb2xvbm5lIChjaGVja2JveClcbiAqIGZpeG1lIDogY3LDqWVyIGNvbXBvc2FudCBzdGFuZGFsb25lIGNoZWNrYm94IGxvcnNxdWUgbGUgRFNGUiBhdXJhIGZpeCBsYSB2ZXJzaW9uIHNhbnMgYXJpYS1sYWJlbFxuICovXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdkc2ZyLWNlbGwtY2hlY2tib3gnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBzdHlsZVVybHM6IFsnY2VsbC1jaGVja2JveC5jb21wb25lbnQuc2NzcyddLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBpbXBvcnRzOiBbXSxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2IChjbGljayk9XCJvblNlbGVjdFJvdygpXCIgY2xhc3M9XCJmci1jaGVja2JveC1ncm91cCBmci1jaGVja2JveC1ncm91cC0tc21cIj5cbiAgICAgIDxpbnB1dFxuICAgICAgICBjbGFzcz1cImVkdS10YWJsZS1jaGVja2JveFwiXG4gICAgICAgIG5hbWU9XCJyb3ctc2VsZWN0XCJcbiAgICAgICAgaWQ9XCJ0YWJsZS1zZWxlY3QtY2hlY2tib3gte3sgdGFibGVJZCB9fS0te3sgcm93Py5pbmRleCB9fVwiXG4gICAgICAgIHR5cGU9XCJjaGVja2JveFwiIC8+XG4gICAgICA8bGFiZWwgY2xhc3M9XCJmci1sYWJlbFwiIGZvcj1cInRhYmxlLXNlbGVjdC1jaGVja2JveC17eyB0YWJsZUlkIH19LS17eyByb3c/LmluZGV4IH19XCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwiZnItc3Itb25seVwiPlxuICAgICAgICAgIHt7IHNob3dTZWxlY3RBbGwgPyAnVG91dCBzw6lsZWN0aW9ubmVyJyA6IGkxOG4udCgndGFibGUuc2VsZWN0Um93JykgKyAnICcgKyByb3c/LmluZGV4IH19XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvbGFiZWw+XG4gICAgPC9kaXY+XG4gIGAsXG59KVxuZXhwb3J0IGNsYXNzIERzZnJDZWxsQ2hlY2tib3hDb21wb25lbnQge1xuICBASW5wdXQoKSB0YWJsZUlkOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHJvdzogYW55O1xuICBASW5wdXQoKSBzaG93U2VsZWN0QWxsOiBib29sZWFuO1xuICBAT3V0cHV0KCkgc2VsZWN0Um93ID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIC8qKiBAaW50ZXJuYWwgKi9cbiAgcHVibGljIGkxOG4gPSBpbmplY3QoRHNmckkxOG5TZXJ2aWNlKTtcblxuICBwcml2YXRlIF9jaGVja2VkOiBib29sZWFuIHwgdW5kZWZpbmVkO1xuXG4gIGdldCBjaGVja2VkKCk6IGJvb2xlYW4gfCB1bmRlZmluZWQge1xuICAgIHJldHVybiB0aGlzLl9jaGVja2VkO1xuICB9XG5cbiAgQElucHV0KCkgc2V0IGNoZWNrZWQoY2hlY2tlZDogYm9vbGVhbiB8IHVuZGVmaW5lZCkge1xuICAgIHRoaXMuX2NoZWNrZWQgPSBjaGVja2VkO1xuICB9XG5cbiAgQElucHV0KCkgc2V0IGlzQWxsQ2hlY2tlZChpc0FsbENoZWNrZWQ6IGJvb2xlYW4pIHtcbiAgICBpZiAodGhpcy5yb3cuaW5kZXggPT09ICdhbGwnKSB7XG4gICAgICB0aGlzLmNoZWNrZWQgPSBpc0FsbENoZWNrZWQ7XG4gICAgfVxuICB9XG5cbiAgb25TZWxlY3RSb3coKSB7XG4gICAgdGhpcy5jaGVja2VkID0gIXRoaXMuY2hlY2tlZDtcbiAgICB0aGlzLnNlbGVjdFJvdy5lbWl0KHRoaXMuY2hlY2tlZCk7XG4gIH1cbn1cbiJdfQ==