@edugouvfr/ngx-dsfr/lib/components/button/button.component.d.ts

NgxDsfr est un portage Angular des éléments d'interface du Système de Design de l'État Français (DSFR).

import { OnInit } from '@angular/core';
import { DsfrButton, DsfrButtonType, DsfrButtonVariant, DsfrPosition, DsfrSize, LoggerService } from '../../shared';
import * as i0 from "@angular/core";
export declare class DsfrButtonComponent implements DsfrButton, OnInit {
    private logger;
    /** Libellé du bouton.
     *
     * Dans le cas d'une utilisation pour une icône seule ne pas renseigner `label`. Renseigner soit `aria-label` soit `tooltipMessage`.
     */
    label: string;
    /** Type du button, `button` par défaut. */
    type: DsfrButtonType;
    /**
     * Message du `tooltip` (attribut `title` du bouton).
     */
    tooltipMessage: string;
    /** Style du bouton, `primary` par défaut. */
    variant: DsfrButtonVariant;
    /**
     * Taille du bouton, `MD` par défaut
     */
    buttonSize: DsfrSize;
    /** Nom de l'icône. */
    icon: string | undefined;
    /** Position de l'icône, à gauche par défaut. */
    iconPosition: DsfrPosition;
    /** Permet de désactiver le bouton d'action, `false` par défaut. */
    disabled: boolean;
    /**
     * Permet de passer le libellé du bouton en majuscules, 'false' par défaut.
     *
     * @deprecated (since 1.1.0)
     *
     * @internal
     */
    uppercase: boolean;
    /**
     * Permet d'activer un visuel dénotant un "chargement" (busy), 'false' par défaut.
     *
     * @deprecated (since 1.1.0)
     *
     * @internal
     */
    loader: boolean;
    /** 👓 Spécifie le libellé qui sera retranscrit par les narrateurs d'écran. */
    ariaLabel: string;
    /** Permet d'inverser le contraste du marqueur de focus, `false` par défaut. */
    invertedOutlineContrast: boolean;
    /**
     * Identifiant de l'élément `<button>`
     *
     * @deprecated (since 1.14.0) utiliser buttonId
     */
    id: string;
    /**
     * Identifiant de l'élément `<button>`
     */
    buttonId: string;
    /**
     * 👓 `ariaControls` est utilisé pour la manipulation d'une modale par exemple.
     * (prise en charge du retour de focus à la fermeture de la modale).
     */
    ariaControls: string;
    /**
     * 👓 Spécifie l'attribut `aria-pressed` pour indiquer un état (toggle)
     */
    ariaPressed: string;
    /**
     * 👓 Spécifie l'attribut `aria-haspopup` en cas d'ouverture de popup
     */
    ariaHasPopup: string;
    /**
     * 👓 Spécifie l'attribut `aria-expanded`
     */
    ariaExpanded: boolean | undefined;
    /**
     * 👓 Spécifie l'attribut `tabindex` pour la gestion du focus
     */
    tabIndex: boolean;
    /**
     * Style personnalisé
     * @since 1.3.0
     */
    customClass: string;
    /**
     * Permet de définir le role donné à l'élément `button`
     * @since 1.15.0
     */
    buttonRole: string;
    /**
     * Permet de masquer visuellement le libellé en le laissant accessible aux dispositifs d'assistance.
     *
     * A utiliser pour les boutons avec icône seule.
     *
     * @since 1.15.0
     */
    labelSrOnly: boolean;
    constructor(logger: LoggerService);
    /**
     * Taille du bouton, `MD` par défaut
     *
     * @deprecated since(1.15.0) utiliser 'buttonSize' à la place
     */
    get size(): DsfrSize;
    /**
     * Taille du bouton, `MD` par défaut
     *
     * @deprecated since(1.15.0) utiliser 'buttonSize' à la place
     */
    set size(value: DsfrSize);
    ngOnInit(): void;
    /** @internal */
    getClasses(): string[];
    /**
     * Empêche que l'appuie sur la barre Espace soit considéré comme un clic si le rôle du button est 'link'
     */
    protected handleSpaceKeyClick(evt: Event): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<DsfrButtonComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DsfrButtonComponent, "dsfr-button", never, { "label": { "alias": "label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "tooltipMessage": { "alias": "tooltipMessage"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "buttonSize": { "alias": "buttonSize"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "iconPosition": { "alias": "iconPosition"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "uppercase": { "alias": "uppercase"; "required": false; }; "loader": { "alias": "loader"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "invertedOutlineContrast": { "alias": "invertedOutlineContrast"; "required": false; }; "id": { "alias": "id"; "required": false; }; "buttonId": { "alias": "buttonId"; "required": false; }; "ariaControls": { "alias": "ariaControls"; "required": false; }; "ariaPressed": { "alias": "ariaPressed"; "required": false; }; "ariaHasPopup": { "alias": "ariaHasPopup"; "required": false; }; "ariaExpanded": { "alias": "ariaExpanded"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; "buttonRole": { "alias": "buttonRole"; "required": false; }; "labelSrOnly": { "alias": "labelSrOnly"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, never, true, never>;
}