@spw-ds/spw-stencil-library 0.0.1

package/dist/types/components/spw-loading/spw-loading.d.ts

@@ -0,0 +1,5 @@
+export declare class SpwLoading {
+    /** Permet de spécifier un texte de chargement */
+    text?: string;
+    render(): any;
+}

package/dist/types/components/spw-message/spw-message.d.ts

@@ -0,0 +1,18 @@
+export declare class SpwMessage {
+    el: HTMLSpwMessageElement;
+    /** Le type de variante */
+    variant: 'default' | 'success' | 'info' | 'alert' | 'warning';
+    /** Identifiant unique pour le message */
+    messageId: string;
+    /** Si la notification est masquable */
+    isDismissable: boolean;
+    /** Texte du bouton pour masquer la notification */
+    dismissableText: string;
+    /** Titre de la notification */
+    messageTitle: string;
+    isVisible: boolean;
+    componentWillLoad(): void;
+    private handleKeyDown;
+    private handleDismiss;
+    render(): any;
+}

package/dist/types/components/spw-modal/spw-modal.d.ts

@@ -0,0 +1,53 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+type CloseEventTrigger = 'CLOSE_BUTTON' | 'ESCAPE_KEY' | 'BACKDROP';
+export interface BeforeCloseEventDetail {
+    trigger: CloseEventTrigger;
+}
+export declare class SpwModal {
+    /** Indique si la modal est ouverte ou fermée, mutable et reflétée dans le DOM */
+    opened?: boolean;
+    showModal: boolean;
+    /** Titre de la modal */
+    caption: string;
+    /** Indique si la fermeture de la modal est possible en cliquant sur l'overlay */
+    closeOnOverlayClick: boolean;
+    /** Rend les boutons en bas de la modal "collants" (toujours visibles) si vrai */
+    stickyButtons: boolean;
+    /** Événement déclenché lors de l'ouverture de la modal */
+    spwModalOpen: EventEmitter;
+    /** Événement déclenché lors de la fermeture de la modal */
+    spwModalClose: EventEmitter;
+    /** Définit la taille de la modal : 'small', 'medium', 'large' ou 'fluid' */
+    size: 'small' | 'medium' | 'large' | 'fluid';
+    /** Icône d'alerte à afficher dans la modal */
+    alertIcon: string;
+    /** Texte du bouton de confirmation */
+    okButtonLabel: string;
+    /** Texte du bouton d'annulation */
+    cancelButtonLabel: string;
+    hostElement: HTMLSpwModalElement;
+    slotButtonsPresent: boolean;
+    /** Indique si le bouton de fermeture est visible */
+    showCloseButton: boolean;
+    private modalContainer;
+    private focusableElements;
+    private closeButton;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    private handleClick;
+    private handleClose;
+    private getFirstFocusableElement;
+    private getLastFocusableElement;
+    private handleTopFocus;
+    private handleBottomFocus;
+    private attemptFocus;
+    private open;
+    private close;
+    private handleKeypress;
+    private doBeforeClose;
+    openedChanged(newValue: boolean): void;
+    private handleOverlayClick;
+    private get elementClass();
+    render(): any;
+}
+export {};

package/dist/types/components/spw-mosaic/spw-mosaic-item/spw-mosaic-item.d.ts

@@ -0,0 +1,8 @@
+export declare class SpwMosaicItem {
+    el: HTMLSpwMosaicItemElement;
+    classString: string;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    private handleConfigurationChange;
+    render(): any;
+}

package/dist/types/components/spw-mosaic/spw-mosaic.d.ts

@@ -0,0 +1,31 @@
+export declare class SpwMosaic {
+    el: HTMLSpwMosaicElement;
+    /** Liste des éléments à afficher dans la mosaïque */
+    items?: any;
+    /** Active le mode "masonry" pour une mise en page en grille ajustable */
+    isMasonry?: boolean;
+    /** Nombre de colonnes à afficher en vue mobile */
+    colsMobile: number;
+    /** Nombre de colonnes à afficher en vue tablette */
+    colsTablet: number;
+    /** Nombre de colonnes à afficher en vue desktop */
+    colsDesktop: number;
+    private masonry;
+    private observer;
+    initialized: boolean;
+    itemsChanged(newValue: any[], oldValue: any[]): void;
+    isMasonryChanged(newValue: boolean): void;
+    waitForImages(): Promise<void>;
+    private emitConfigurationChanged;
+    configurationChanged(): void;
+    private refreshMasonryLayout;
+    componentDidLoad(): void;
+    componentDidUpdate(): void;
+    disconnectedCallback(): void;
+    initializeMasonry(): Promise<void>;
+    private updateMasonryLayout;
+    private destroyMasonry;
+    private observeSlotChanges;
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-pagination/spw-pagination.d.ts

@@ -0,0 +1,30 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class SpwPagination {
+    /** Nombre total d'éléments à paginer */
+    totalItems: number;
+    /** Nombre d'éléments à afficher par page */
+    itemsPerPage: number;
+    /** Indique si la pagination est désactivée */
+    isDisabled: boolean;
+    /** Type de variante de la pagination : 'numbers' ou 'input' */
+    variant: 'numbers' | 'input';
+    /** Page actuellement sélectionnée, mutable */
+    currentPage: number;
+    /** Événement émis lorsque la page est changée, renvoie le numéro de la nouvelle page */
+    pageChanged: EventEmitter<number>;
+    private totalPages;
+    inputPageValue: string;
+    isMobile: boolean;
+    private debounceTimer;
+    componentWillLoad(): void;
+    disconnectedCallback(): void;
+    private updateIsMobile;
+    calculateTotalPages(): void;
+    private goToPage;
+    private handleInputChange;
+    private getPaginationClass;
+    private handleKeyDown;
+    private calculateWidth;
+    private calculatePageRange;
+    render(): any;
+}

package/dist/types/components/spw-radio/spw-radio.d.ts

@@ -0,0 +1,35 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class SpwRadio {
+    private inputElement;
+    el: HTMLSpwRadioElement;
+    /** Indique si le bouton radio est désactivé */
+    disabled: boolean;
+    /** Indique si le bouton radio est sélectionné (coché), mutable et reflété dans le DOM */
+    checked: boolean;
+    /** Indique s'il y a une erreur visuelle associée au bouton radio */
+    error: boolean;
+    /** Nom du bouton radio, utilisé pour le grouper avec d'autres boutons radio dans un formulaire */
+    name: string;
+    /** Valeur associée au bouton radio */
+    value: string;
+    internalChecked: boolean;
+    internals: ElementInternals;
+    /** Événement déclenché lorsque l'état du bouton radio change (coché ou décoché) */
+    spwChange: EventEmitter<{
+        checked: boolean;
+        value: string;
+    }>;
+    private handleRadio;
+    private uncheckOthers;
+    /** Méthode pour changer l'état de la case à cocher. */
+    setChecked(checked: boolean): Promise<void>;
+    checkedChanged(newValue: boolean): void;
+    private setCheckedState;
+    private updateFormValue;
+    private handleKeydown;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    formResetCallback(): void;
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-search-field/spw-search-field.d.ts

@@ -0,0 +1,39 @@
+export declare class SpwSearchField {
+    private hostElement;
+    /** Liste des éléments à filtrer, passée sous forme de chaîne JSON */
+    items?: string;
+    /** Placeholder à afficher dans le champ de recherche */
+    placeholder: string;
+    /** Label associé au champ de recherche */
+    label: string;
+    /** Indique si le champ de recherche est désactivé */
+    disabled?: boolean;
+    /** Nom du champ de recherche, utilisé pour les formulaires */
+    name: string;
+    /** Indique si le champ est requis */
+    required?: boolean;
+    /** Texte d'assistance affiché sous le champ de recherche */
+    assistiveText?: string;
+    filteredItems: Array<{
+        url?: string;
+        label: string;
+        category?: string;
+    }>;
+    searchText: string;
+    isOpen: boolean;
+    focusedItemIndex: number | null;
+    dropdownDirection: 'up' | 'down';
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    parseItems(newValue: string): void;
+    private handleClickOutside;
+    private handleSearchInput;
+    private filterItems;
+    private normalizeString;
+    private selectItem;
+    private determineDropdownDirection;
+    private handleKeyDown;
+    private highlightMatch;
+    render(): any;
+}

package/dist/types/components/spw-select/spw-select.d.ts

@@ -0,0 +1,48 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class SpwSelect {
+    el: HTMLSpwSelectElement;
+    /** Emet un event si la valeur change */
+    valueChanged: EventEmitter<string | number>;
+    internalValue: string | number;
+    /** Valeur sélectionnée actuelle, mutable et reflétée dans le DOM */
+    value: string | number;
+    /** Label associé au champ de sélection */
+    label: string;
+    /** Texte du placeholder à afficher lorsque rien n'est sélectionné */
+    placeholder: string;
+    /** Indique si le champ de sélection est désactivé */
+    disabled: boolean;
+    /** Nom de l'élément utilisé dans les formulaires pour associer la valeur sélectionnée */
+    name: string;
+    /** Indique si la sélection est obligatoire dans le formulaire */
+    required: boolean;
+    /** Taille du champ de sélection : 'large' ou 'medium' */
+    size: 'large' | 'medium';
+    /** Texte d'assistance affiché sous le champ de sélection */
+    assistiveText?: string;
+    /** Message d'erreur à afficher sous le champ de sélection */
+    error?: string;
+    /** Message d'indication (hint) à afficher sous le champ de sélection */
+    hint?: string;
+    /** Message de succès à afficher sous le champ de sélection */
+    success?: string;
+    /** Affiche une icône d'erreur si vrai */
+    showErrorIcon?: boolean;
+    /** Affiche une icône d'indication si vrai */
+    showHintIcon?: boolean;
+    /** Affiche une icône de succès si vrai */
+    showSuccessIcon?: boolean;
+    private selectElement;
+    internals: ElementInternals;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    private getFormValue;
+    private getInitialSelectedValue;
+    private handleSelectChange;
+    private moveOptionsToLightDom;
+    private renderErrorMessage;
+    private renderHintMessage;
+    private renderSuccessMessage;
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-separator/spw-separator.d.ts

@@ -0,0 +1,15 @@
+export declare class SpwSeparator {
+    /** Permet de choisir la surface du séparateur (clair ou sombre) */
+    surface: 'dark' | 'light';
+    /** Permet de définir la direction du séparateur */
+    direction: 'vertical' | 'horizontal';
+    /** Définit l'épaisseur du séparateur */
+    thickness: 1 | 2;
+    /** Largeur du séparateur (par défaut 100% si non spécifié) */
+    width: string;
+    /** Hauteur du séparateur (par défaut 100% si non spécifié) */
+    height: string;
+    private get elementClass();
+    private get style();
+    render(): any;
+}

package/dist/types/components/spw-table/spw-table-body/spw-table-body.d.ts

@@ -0,0 +1,3 @@
+export declare class SpwTableBody {
+    render(): any;
+}

package/dist/types/components/spw-table/spw-table-cell/spw-table-cell.d.ts

@@ -0,0 +1,16 @@
+export declare class SpwTableCell {
+    /** Définit un colspan pour la cellule */
+    colspan?: HTMLTableCellElement['colSpan'];
+    /** Définit un header relationnel pour la cellule, à des fins d'accessibilité */
+    headers?: HTMLTableCellElement['headers'];
+    /** Définit un rowspan pour la cellule */
+    rowspan?: HTMLTableCellElement['rowSpan'];
+    /** Définit un style visuel qui met en avant la cellule */
+    isHighlighted?: boolean;
+    /** Définit un alignement de texte pour la cellule */
+    textAlign?: 'center' | 'left' | 'right';
+    /** Définit un alignement vertical pour la cellule */
+    verticalAlign?: 'top' | 'bottom' | 'middle';
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-table/spw-table-head/spw-table-head.d.ts

@@ -0,0 +1,3 @@
+export declare class SpwTableHead {
+    render(): any;
+}

package/dist/types/components/spw-table/spw-table-header/spw-table-header.d.ts

@@ -0,0 +1,16 @@
+export declare class SpwTableHeader {
+    /** Définit un colspan pour la cellule */
+    colspan?: HTMLTableCellElement['colSpan'];
+    /** Définit un header relationnel pour la cellule, à des fins d'accessibilité */
+    headers?: HTMLTableCellElement['headers'];
+    /** Définit un rowspan pour la cellule */
+    rowspan?: HTMLTableCellElement['rowSpan'];
+    /** Définit un style visuel qui met en avant la cellule */
+    isHighlighted?: boolean;
+    /** Définit un alignement de texte pour la cellule */
+    textAlign?: 'center' | 'left' | 'right';
+    /** Définit un alignement vertical pour la cellule */
+    verticalAlign?: 'top' | 'bottom' | 'middle';
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-table/spw-table-row/spw-table-row.d.ts

@@ -0,0 +1,3 @@
+export declare class SpwTableRow {
+    render(): any;
+}

package/dist/types/components/spw-table/spw-table.d.ts

@@ -0,0 +1,23 @@
+export interface TableCell {
+    content: string;
+    colspan?: number;
+    rowspan?: number;
+    isHeader?: boolean;
+}
+export interface TableRow {
+    cells: TableCell[];
+}
+export declare class SpwTable {
+    el: HTMLSpwTableElement;
+    /** Propriété pour l'aria-label, à des fins d'accessibilité */
+    accAriaLabel?: string;
+    /** Si le header du tableau doit être sticky ou non */
+    isSticky?: boolean;
+    /** Si défini, apparition d'une scrollbar verticale et max-height  */
+    maxHeight?: string;
+    /** Si défini, apparition d'une scrollbar horizontale et max-width  */
+    minWidth?: string;
+    private formatSize;
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-text-field/spw-text-field.d.ts

@@ -0,0 +1,57 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class SpwTextField {
+    /** Événement émis lorsque la valeur de l'input change */
+    valueChanged: EventEmitter<string>;
+    internalValue: string;
+    /** Valeur actuelle du champ de saisie, mutable et reflétée dans le DOM */
+    value?: string;
+    /** Type d'input à rendre, par exemple, "text", "password", etc. */
+    type?: string;
+    /** Texte à afficher au-dessus du champ de saisie */
+    label: string;
+    /** Texte du placeholder pour le champ de saisie */
+    placeholder: string;
+    /** Si `true`, le champ de saisie est désactivé et ne peut pas être utilisé */
+    disabled?: boolean;
+    /** Attribut `name` de l'élément input */
+    name: string;
+    /** Longueur minimale pour la valeur de l'input */
+    minLength?: number;
+    /** Longueur maximale pour la valeur de l'input */
+    maxLength?: number;
+    /** Indique si l'input est un champ de recherche */
+    isSearch?: boolean;
+    /** Indique si le champ peut être effacé avec un bouton */
+    isClear?: boolean;
+    /** Indique si l'input est requis */
+    required?: boolean;
+    /** Spécifie la taille du champ de saisie : 'large' ou 'medium' */
+    size?: 'large' | 'medium';
+    /** Indicateur à afficher à droite du champ de saisie */
+    indicator?: string;
+    /** Texte d'assistance à afficher sous le champ de saisie */
+    assistiveText?: string;
+    /** Message d'erreur à afficher sous le champ */
+    error?: string;
+    /** Message d'indication (hint) à afficher sous le champ */
+    hint?: string;
+    /** Message de succès à afficher sous le champ */
+    success?: string;
+    /** Affiche une icône d'erreur si vrai */
+    showErrorIcon?: boolean;
+    /** Affiche une icône d'indication si vrai */
+    showHintIcon?: boolean;
+    /** Affiche une icône de succès si vrai */
+    showSuccessIcon?: boolean;
+    isClearIconVisible: boolean;
+    internals: ElementInternals;
+    valueChangedHandler(newValue: string): void;
+    componentWillLoad(): void;
+    private handleChange;
+    private handleClear;
+    private renderErrorMessage;
+    private renderHintMessage;
+    private renderSuccessMessage;
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-textarea/spw-textarea.d.ts

@@ -0,0 +1,53 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class SpwTextarea {
+    /** Événement émis lorsque la valeur du champ textarea change */
+    valueChanged: EventEmitter<string>;
+    internalValue: string;
+    /** Valeur actuelle du champ textarea, mutable et reflétée dans le DOM */
+    value?: string;
+    /** Texte à afficher au-dessus du champ textarea */
+    label?: string;
+    /** Texte du placeholder pour le champ textarea */
+    placeholder: string;
+    /** Si `true`, le champ textarea est désactivé et ne peut pas être utilisé */
+    disabled?: boolean;
+    /** Attribut `name` de l'élément textarea */
+    name: string;
+    /** Nombre de lignes à afficher dans le champ textarea */
+    rows?: number;
+    /** Longueur minimale pour la valeur du textarea */
+    minLength?: number;
+    /** Longueur maximale pour la valeur du textarea */
+    maxLength?: number;
+    /** Indique si l'input est un champ de recherche */
+    isSearch?: boolean;
+    /** Indique si le champ textarea est requis */
+    required?: boolean;
+    /** Spécifie la taille du champ textarea : 'large' ou 'medium' */
+    size?: 'large' | 'medium';
+    /** Indicateur à afficher à droite du champ textarea */
+    indicator?: string;
+    /** Texte d'assistance à afficher au-dessus du champ textarea */
+    assistiveText?: string;
+    /** Message d'erreur à afficher sous le champ textarea */
+    error?: string;
+    /** Message d'indication (hint) à afficher sous le champ textarea */
+    hint?: string;
+    /** Message de succès à afficher sous le champ textarea */
+    success?: string;
+    /** Affiche une icône d'erreur si vrai */
+    showErrorIcon?: boolean;
+    /** Affiche une icône d'indication si vrai */
+    showHintIcon?: boolean;
+    /** Affiche une icône de succès si vrai */
+    showSuccessIcon?: boolean;
+    internals: ElementInternals;
+    valueChangedHandler(newValue: string): void;
+    componentWillLoad(): void;
+    private handleChange;
+    private renderErrorMessage;
+    private renderHintMessage;
+    private renderSuccessMessage;
+    private get elementClass();
+    render(): any;
+}

package/dist/types/components/spw-theme-provider/spw-theme-provider.d.ts

@@ -0,0 +1,10 @@
+import { SpwTheme } from "../../themes/themes";
+export declare class SpwThemeProvider {
+    /** Définit le thème employé, conditionne les tokens associés au thème */
+    theme: SpwTheme;
+    el: HTMLSpwThemeProviderElement;
+    componentWillLoad(): void;
+    componentWillUpdate(): void;
+    private applyTheme;
+    render(): any;
+}

package/dist/types/components/spw-tooltip/spw-tooltip.d.ts

@@ -0,0 +1,13 @@
+export declare class SpwTooltip {
+    /** Titre du tooltip */
+    tooltipTitle: string;
+    /** Texte du tooltip */
+    tooltipText: string;
+    /** Positionnement du tooltip */
+    direction: 'top' | 'bottom' | 'left' | 'right';
+    isVisible: boolean;
+    private showTooltip;
+    private hideTooltip;
+    private get elementClass();
+    render(): any;
+}