@masmarino/gabarit 1.4.0 → 2.1.0

package/textarea/README.md

@@ -0,0 +1,76 @@
+# Textarea
+
+Champ de texte multiligne, cohérent avec `GbtInput` — même API, même
+intégration `ControlValueAccessor`.
+
+**Selector**: `gbt-textarea`
+
+## Inputs
+
+| Input          | Type                                             | Default      | Role                                                                                                      |
+| -------------- | ------------------------------------------------ | ------------ | --------------------------------------------------------------------------------------------------------- |
+| `id`           | `string`                                         | généré       | `id` du champ natif.                                                                                      |
+| `label`        | `string`                                         | `''`         | Libellé affiché au-dessus du champ.                                                                       |
+| `required`     | `boolean`                                        | `false`      | Affiche un `*` à côté du label.                                                                           |
+| `disabled`     | `boolean`                                        | `false`      | Désactive le champ.                                                                                       |
+| `placeholder`  | `string`                                         | `''`         | Texte indicatif.                                                                                          |
+| `errorMessage` | `string \| null`                                 | `null`       | Message d'erreur, associé via `aria-describedby`.                                                         |
+| `rows`         | `number`                                         | `3`          | Hauteur initiale, en lignes (hauteur minimale avec `autosize`).                                           |
+| `hint`         | `string`                                         | `''`         | Aide sous le champ, associée via `aria-describedby`. Masquée (et déliée) tant qu'une erreur est affichée. |
+| `hideLabel`    | `boolean`                                        | `false`      | Masque le libellé visuellement ; il reste dans le DOM et continue de nommer le champ.                     |
+| `mono`         | `boolean`                                        | `false`      | Police à chasse fixe (`--gbt-font-mono` si définie, sinon la pile monospace du système).                  |
+| `autosize`     | `boolean`                                        | `false`      | Le champ grandit avec son contenu au lieu de défiler. Désactive la poignée de redimensionnement.          |
+| `maxRows`      | `number \| null`                                 | `null`       | Avec `autosize` : nombre de lignes au-delà duquel le champ cesse de grandir et défile.                    |
+| `resize`       | `'vertical' \| 'none' \| 'both' \| 'horizontal'` | `'vertical'` | Poignée de redimensionnement (ignorée avec `autosize`).                                                   |
+
+Tous ces inputs sont « éteints » par défaut : un champ qui ne les utilise pas
+garde le même rendu.
+
+## Outputs
+
+| Output      | Type     | Role                                                                                                   |
+| ----------- | -------- | ------------------------------------------------------------------------------------------------------ |
+| `committed` | `string` | Émis au blur, avec la valeur sur laquelle l'utilisateur s'est arrêté (même convention que `GbtInput`). |
+
+## Exemple
+
+```html
+<gbt-textarea label="Description" [rows]="5" formControlName="description" />
+```
+
+## Aide, libellé masqué, monospace
+
+```html
+<gbt-textarea label="Description" hint="Markdown accepté." formControlName="description" />
+
+<gbt-textarea label="Ajouter un commentaire" [hideLabel]="true" [rows]="2" />
+
+<gbt-textarea label="Variables d'environnement" [mono]="true" [rows]="4" />
+```
+
+L'aide (`<p id="<id>-hint">`) est le `aria-describedby` du champ ; tant que
+`errorMessage` est renseigné, elle n'est plus rendue et l'erreur prend sa
+place.
+
+## Redimensionnement
+
+Par défaut, `resize: vertical` natif — l'utilisateur agrandit en tirant le
+coin. `resize` accepte aussi `none`, `both` et `horizontal`.
+
+Avec `autosize`, le champ grandit à la saisie (et se recale quand la valeur
+est écrite par le formulaire ou quand sa largeur change) ; `rows` reste la
+hauteur minimale et `maxRows` plafonne la hauteur, au-delà de laquelle le
+champ défile. Le plafond est un `max-height` CSS calculé avec l'unité `lh` : un
+navigateur qui ne la connaît pas laisse simplement le champ grandir sans
+limite. Pas de compteur de caractères intégré (à ajouter côté application si
+un besoin réel apparaît).
+
+```html
+<gbt-textarea label="Message de commit" [autosize]="true" [rows]="2" [maxRows]="6" />
+```
+
+## Valeur
+
+La valeur est liée à la propriété `value` du `<textarea>` : `writeValue('')`,
+`reset()` ou un `ngModel` remis à `''` vident bien le champ, même après une
+saisie.

package/timeline-chart/README.md

@@ -0,0 +1,49 @@
+# TimelineChart
+
+Timeline on the dataviz base — a time series and annotated intervals,
+measures its container, reacts to the pointer and keyboard, carries its
+own visually-hidden `gbt-chart-table`.
+
+**Selector**: `gbt-timeline-chart`
+
+## Inputs
+
+| Input              | Type                                        | Default  | Role                                                        |
+| ------------------ | ------------------------------------------- | -------- | ----------------------------------------------------------- |
+| `series`           | `ChartSeries<Date>`                         | required | `{ label, points, pattern? }` — the series, time axis.      |
+| `intervals`        | `ChartInterval[]`                           | required | `{ start, end, label }[]` — the annotated intervals.        |
+| `locale`           | `string`                                    | required | Locale used to format dates.                                |
+| `label`            | `string`                                    | required | Accessible name of the chart.                               |
+| `tableCaption`     | `string`                                    | required | Caption of the series' `sr-only` table.                     |
+| `intervalsCaption` | `string`                                    | required | Caption of the intervals' `sr-only` table.                  |
+| `xColumn`          | `string`                                    | required | Header of the series table's x-axis column.                 |
+| `emptyMessage`     | `string`                                    | required | Message shown when the series is empty.                     |
+| `yZero`            | `boolean`                                   | `true`   | Forces the y-axis domain to contain zero.                   |
+| `yTickCount`       | `number`                                    | `5`      | Target number of ticks on the y-axis.                       |
+| `size`             | `{ width: number; height: number } \| null` | `null`   | Explicit dimensions — reserved for server rendering, tests. |
+| `heading`          | `string`                                    | `''`     | Block title. Empty by default.                              |
+| `headingLevel`     | `1 \| 2 \| 3 \| 4 \| 5 \| 6`                | `2`      | Level of the rendered heading.                              |
+| `headline`         | `string`                                    | `''`     | Current value, already formatted.                           |
+| `trend`            | `string`                                    | `''`     | Change over the period, already formatted.                  |
+
+**Fluid width with a chosen height** — the common case — is achieved by
+setting the height in CSS on the wrapping container, without passing
+`[size]`. See [`../chart-frame/README.md`](../chart/chart-frame/README.md) for
+the full sizing contract and hover behavior.
+
+## Example
+
+```html
+<div style="height: 18rem">
+  <gbt-timeline-chart
+    [series]="{ label: 'Statut', points: [{ x: new Date('2026-01-01'), y: 1 }] }"
+    [intervals]="[{ start: d1, end: d2, label: 'Incident' }]"
+    locale="fr-FR"
+    label="Chronologie des incidents"
+    tableCaption="Détail de la chronologie"
+    intervalsCaption="Détail des incidents"
+    xColumn="Date"
+    emptyMessage="Aucune donnée"
+  />
+</div>
+```

package/toaster/README.md

@@ -0,0 +1,92 @@
+# Toaster
+
+Pile de notifications temporaires (toasts) — l'application possède le
+tableau de toasts et le composant gère l'empilement, l'auto-dismiss et
+l'accessibilité.
+
+**Selector**: `gbt-toaster`
+
+## Inputs
+
+| Input        | Type              | Default          | Role                                                                                                                 |
+| ------------ | ----------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------- |
+| `toasts`     | `ToastItem[]`     | — (le service)   | Toasts affichés, possédés par l'application. Omis, le toaster affiche le store de `GbtToastService` (voir plus bas). |
+| `position`   | `ToasterPosition` | `'bottom-right'` | Coin ou bord de l'écran où empiler les toasts.                                                                       |
+| `closeLabel` | `string`          | `'Close'`        | Nom accessible du bouton de fermeture de chaque toast.                                                               |
+
+```ts
+interface ToastItem {
+  id: string
+  variant: 'success' | 'error' | 'warning' | 'info'
+  message: string
+  duration?: number // ms, défaut 5000 ; 0 ou Infinity = pas d'auto-dismiss
+}
+```
+
+## Outputs
+
+| Output      | Type     | Role                                                                                                                            |
+| ----------- | -------- | ------------------------------------------------------------------------------------------------------------------------------- |
+| `dismissed` | `string` | Émis avec l'`id` du toast à retirer — auto-dismiss écoulé ou clic sur le bouton fermer. L'application doit filtrer son tableau. |
+
+## Exemple
+
+```html
+<gbt-toaster [toasts]="toasts()" (dismissed)="onDismissed($event)" />
+```
+
+```ts
+toasts = signal<ToastItem[]>([])
+
+onDismissed(id: string): void {
+  this.toasts.update((toasts) => toasts.filter((toast) => toast.id !== id))
+}
+```
+
+Pour afficher un nouveau toast, l'application pousse un élément dans
+son propre tableau (avec un `id` unique, par ex. `crypto.randomUUID()`)
+— le composant se charge de programmer son auto-dismiss.
+
+## Service : `GbtToastService`
+
+Un store de toasts pour toute l'application, à injecter n'importe où (`providedIn: 'root'`). Le toaster placé une
+fois dans le shell l'affiche quand son entrée `toasts` est **omise** ; l'API explicite ci-dessus reste inchangée.
+
+```ts
+private readonly toasts = inject(GbtToastService)
+
+this.toasts.show('Token révoqué')                                     // succès, disparaît après 5 s
+this.toasts.show('La requête a échoué', 'error', { duration: 0 })   // reste jusqu'à fermeture
+```
+
+```html
+<gbt-toaster />
+```
+
+| Membre                           | Rôle                                                                                                                               |
+| -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- |
+| `show(message, kind?, options?)` | Ajoute un toast et retourne son `id`. `kind` : `'success'` (défaut) `\| 'error' \| 'info' \| 'warning'`. `options.duration` en ms. |
+| `dismiss(id)`                    | Retire un toast (et son minuteur). Un `id` inconnu est ignoré.                                                                     |
+| `clear()`                        | Retire tous les toasts.                                                                                                            |
+| `toasts`                         | Signal en lecture seule des toasts affichés (`ToastItem[]`), du plus ancien au plus récent.                                        |
+| `defaultDuration`                | Signal de la durée par défaut, en ms (`5000`). `0` ou `Infinity` : aucun toast ne disparaît seul.                                  |
+
+Le service possède les minuteurs d'auto-dismiss (un toast affiché avant que le toaster n'existe disparaît quand même
+à l'heure), les annule au `dismiss`/`clear` et à la destruction de l'injecteur, et fabrique ses `id` avec un compteur
+(`crypto.randomUUID` n'existe pas hors contexte sécurisé). En mode service, le toaster ne programme aucun minuteur : le
+bouton fermer appelle `dismiss()` (et émet aussi `dismissed`) ; l'expiration ne l'émet pas.
+
+## Accessibilité
+
+Chaque toast porte `role="status"` (succès, info) ou `role="alert"`
+(warning, error), avec `aria-atomic="true"`, pour que les lecteurs
+d'écran annoncent le message sans action de l'utilisateur. C'est la
+même chose en mode service : les erreurs et avertissements sont
+annoncés de façon assertive, les autres poliment.
+
+**À savoir.** (1) Tous les toasts, erreurs comprises, disparaissent après 5 s par défaut et rien ne les suspend au
+survol ou au focus : un utilisateur qui lit lentement (loupe, clavier) peut manquer un message d'erreur (WCAG 2.2.1).
+Passez `{ duration: 0 }` pour une erreur qui doit rester jusqu'à fermeture. (2) Un avertissement est annoncé de façon
+assertive (`role="alert"`) : un `warning` non bloquant interrompt donc la lecture. (3) En mode
+service, placez **un seul** `<gbt-toaster />` dans l'application : deux toasters affichent le même store et
+annoncent chaque message deux fois.

package/tooltip/README.md

@@ -0,0 +1,50 @@
+# Tooltip
+
+Info-bulle générique qui enveloppe n'importe quel élément projeté et
+l'affiche au survol ou au focus clavier.
+
+**Selector**: `gbt-tooltip` (`exportAs="gbtTooltip"`)
+
+## Inputs
+
+| Input      | Type                                        | Default   | Role                                  |
+| ---------- | -------------------------------------------- | --------- | -------------------------------------- |
+| `text`     | `string`                                     | required  | Texte affiché dans la bulle.           |
+| `position` | `'top' \| 'bottom' \| 'left' \| 'right'`     | `'top'`   | Côté de l'élément où placer la bulle.  |
+
+Pas de retournement automatique si la bulle déborde de l'écran —
+l'application choisit la position adaptée à son layout (même logique
+que `gbt-menu`).
+
+## Comportement
+
+- Apparition après ~400ms de survol (annulée si le pointeur repart
+  avant), immédiate au focus clavier.
+- Disparition sur `mouseleave`, `focusout`, ou `Escape`, avec un court
+  fondu (120ms) avant que la bulle ne quitte le DOM — un nouveau
+  survol/focus pendant ce délai annule la disparition et la bulle
+  reste affichée.
+- Contenu texte uniquement — pas d'élément interactif à l'intérieur de
+  la bulle (voir WCAG 1.4.13, § Accessibilité ci-dessous).
+
+## Accessibilité
+
+`gbt-tooltip` ne peut pas poser `aria-describedby` automatiquement sur
+l'élément projeté (il ne connaît pas sa structure interne). Câblez-le
+vous-même via `tooltipId`, exposé par `exportAs="gbtTooltip"` :
+
+```html
+<gbt-tooltip text="Supprimer" #tip="gbtTooltip">
+  <button [attr.aria-describedby]="tip.tooltipId" aria-label="Supprimer">
+    <gbt-icon name="x" />
+  </button>
+</gbt-tooltip>
+```
+
+## Exemple
+
+```html
+<gbt-tooltip text="Cette action est définitive" position="right">
+  <button type="button">Supprimer</button>
+</gbt-tooltip>
+```

package/tree/README.md

@@ -0,0 +1,79 @@
+# Tree
+
+A hierarchical list of expandable/collapsible nodes — file trees,
+nested categories, org charts — implementing the WAI-ARIA
+[Tree View](https://www.w3.org/WAI/ARIA/apg/patterns/treeview/)
+pattern. Distinct from nested `Accordion`s: a tree supports arrow-key
+navigation across the whole hierarchy and a single-selection model,
+where an accordion is a flat list of independently-toggled panels.
+
+**Selector**: `gbt-tree`
+
+## Inputs
+
+| Input           | Type          | Default     | Role                                                          |
+| ---------------- | --------------- | ------------- | ------------------------------------------------------------------ |
+| `items`         | `TreeNode[]`   | *required*   | The hierarchy to render (see `TreeNode` below).                     |
+| `ariaLabel`     | `string`       | `''`          | Accessible name of the tree, when there's no visible heading for it. |
+| `selectedId`    | `string \| null` (model) | `null`        | The currently selected node's id. Two-way bindable.                  |
+| `expandedIds`   | `string[]` (model)        | `[]`          | Ids of currently expanded nodes. Two-way bindable.                    |
+| `expandLabel`   | `string`       | `'Expand'`    | Accessible name of a collapsed node's toggle button.                  |
+| `collapseLabel` | `string`       | `'Collapse'`  | Accessible name of an expanded node's toggle button.                  |
+
+```ts
+interface TreeNode {
+  id: string
+  label: string
+  icon?: string
+  children?: TreeNode[]
+}
+```
+
+## Example
+
+```html
+<gbt-tree
+  [items]="repoTree"
+  ariaLabel="Fichiers du dépôt"
+  [(expandedIds)]="expanded"
+  [(selectedId)]="selected"
+/>
+```
+
+## Behavior
+
+- Clicking a node with children both selects it **and** toggles its
+  expanded state — the same one-click convenience VS Code's file
+  explorer and most desktop file trees offer, rather than requiring a
+  separate click on the chevron just to open a folder.
+- Clicking the chevron button directly toggles expansion only, without
+  changing the selection (`$event.stopPropagation()` keeps the row
+  click from also firing).
+- Full keyboard support per the WAI-ARIA pattern: `ArrowDown`/`ArrowUp`
+  move focus to the next/previous visible row, `ArrowRight` expands a
+  collapsed node (or moves into its first child if already expanded),
+  `ArrowLeft` collapses an expanded node (or moves focus to its parent
+  if already collapsed/a leaf), `Home`/`End` jump to the first/last
+  visible row, `Enter`/`Space` select the focused row.
+- Roving `tabindex`: only the active row is a `Tab` stop; arrow keys
+  move focus without adding the whole tree to the tab order row by
+  row.
+
+## Why a flat list instead of nested groups
+
+The WAI-ARIA pattern allows a tree to be built either as nested
+`role="group"` containers per level, or as a single flat list where
+each item's depth is conveyed by `aria-level`. This component uses the
+flat form: `items` is flattened (respecting which nodes are currently
+expanded) into one array rendered by a single `@for`, with `role="tree"`
+on the `<ul>` and `role="treeitem"` + `aria-level`/`aria-expanded`
+directly on each `<li>`. This avoids a recursive per-node component
+(and the extra indirection that comes with it) and sidesteps relying
+on native `<ul>`/`<li>` list semantics for a structure that isn't
+actually a native nested list — the same reasoning that led to an
+explicit ARIA role here rather than leaning on HTML's own content
+model.
+
+## Accessibility
+
+See `AUDIT.md` for the full RGAA checklist.

package/types/masmarino-gabarit-accordion.d.ts

@@ -0,0 +1,54 @@
+import * as i0 from "@angular/core";
+export declare class AccordionItem {
+  private readonly parent;
+  private readonly header;
+  label: import("@angular/core").InputSignal<string>;
+  protected readonly active: import("@angular/core").WritableSignal<boolean>;
+  protected readonly index: import("@angular/core").WritableSignal<number>;
+  protected readonly groupId: import("@angular/core").WritableSignal<string>;
+  protected readonly headerId: import("@angular/core").Signal<string>;
+  protected readonly panelId: import("@angular/core").Signal<string>;
+  setState(index: number, active: boolean, groupId: string): void;
+  focusHeader(): void;
+  protected toggle(): void;
+  protected onKeydown(event: KeyboardEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<AccordionItem, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<AccordionItem, "gbt-accordion-item", never, {
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+type AccordionMode = 'single' | 'multiple';
+export declare class Accordion {
+  id: import("@angular/core").InputSignal<string>;
+  mode: import("@angular/core").InputSignal<AccordionMode>;
+  expanded: import("@angular/core").ModelSignal<number[]>;
+  protected readonly items: import("@angular/core").Signal<readonly AccordionItem[]>;
+  constructor();
+  toggle(index: number): void;
+  focusHeader(index: number): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Accordion, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Accordion, "gbt-accordion", never, {
+    "id": {
+      "alias": "id";
+      "required": false;
+      "isSignal": true;
+    };
+    "mode": {
+      "alias": "mode";
+      "required": false;
+      "isSignal": true;
+    };
+    "expanded": {
+      "alias": "expanded";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "expanded": "expandedChange";
+  }, ["items"], ["*"], true, never>;
+}
+export type { AccordionMode };

package/types/masmarino-gabarit-alert.d.ts

@@ -0,0 +1,65 @@
+import * as i0 from "@angular/core";
+type AlertVariant = 'info' | 'success' | 'warning' | 'error' | 'neutral';
+type AlertLive = 'auto' | 'assertive' | 'polite' | 'off';
+type AlertSize = 'md' | 'sm';
+type AlertAppearance = 'default' | 'subtle';
+type AlertIconAlign = 'auto' | 'center' | 'start';
+export declare class Alert {
+  variant: import("@angular/core").InputSignal<AlertVariant>;
+  dismissible: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  closeLabel: import("@angular/core").InputSignal<string>;
+  live: import("@angular/core").InputSignal<AlertLive>;
+  heading: import("@angular/core").InputSignal<string>;
+  size: import("@angular/core").InputSignal<AlertSize>;
+  appearance: import("@angular/core").InputSignal<AlertAppearance>;
+  iconAlign: import("@angular/core").InputSignal<AlertIconAlign>;
+  dismissed: import("@angular/core").OutputEmitterRef<void>;
+  protected readonly role: import("@angular/core").Signal<"alert" | "status" | null>;
+  protected readonly icon: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Alert, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Alert, "gbt-alert", never, {
+    "variant": {
+      "alias": "variant";
+      "required": false;
+      "isSignal": true;
+    };
+    "dismissible": {
+      "alias": "dismissible";
+      "required": false;
+      "isSignal": true;
+    };
+    "closeLabel": {
+      "alias": "closeLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "live": {
+      "alias": "live";
+      "required": false;
+      "isSignal": true;
+    };
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+    "appearance": {
+      "alias": "appearance";
+      "required": false;
+      "isSignal": true;
+    };
+    "iconAlign": {
+      "alias": "iconAlign";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "dismissed": "dismissed";
+  }, never, ["*", "[alert-actions]"], true, never>;
+}
+export type { AlertAppearance, AlertIconAlign, AlertLive, AlertSize, AlertVariant };

package/types/masmarino-gabarit-app-shell.d.ts

@@ -0,0 +1,102 @@
+import * as i0 from "@angular/core";
+export declare class AppShellNavGroup {
+  label: import("@angular/core").InputSignal<string>;
+  icon: import("@angular/core").InputSignal<string | null>;
+  expanded: import("@angular/core").ModelSignal<boolean>;
+  protected readonly panelId: string;
+  protected toggle(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<AppShellNavGroup, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<AppShellNavGroup, "gbt-app-shell-nav-group", never, {
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+    "icon": {
+      "alias": "icon";
+      "required": false;
+      "isSignal": true;
+    };
+    "expanded": {
+      "alias": "expanded";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "expanded": "expandedChange";
+  }, never, ["*"], true, never>;
+}
+export declare class AppShell {
+  navLabel: import("@angular/core").InputSignal<string>;
+  skipLabel: import("@angular/core").InputSignal<string>;
+  openMenuLabel: import("@angular/core").InputSignal<string>;
+  closeMenuLabel: import("@angular/core").InputSignal<string>;
+  collapseLabel: import("@angular/core").InputSignal<string>;
+  expandLabel: import("@angular/core").InputSignal<string>;
+  versionLabel: import("@angular/core").InputSignal<string | null>;
+  collapsed: import("@angular/core").InputSignal<boolean>;
+  collapsible: import("@angular/core").InputSignal<boolean>;
+  collapsedChange: import("@angular/core").OutputEmitterRef<boolean>;
+  private readonly id;
+  protected readonly mainId: string;
+  protected readonly navId: string;
+  protected readonly menuOpen: import("@angular/core").WritableSignal<boolean>;
+  protected readonly menuLabel: import("@angular/core").Signal<string>;
+  private readonly toggleButton;
+  private readonly nav;
+  protected toggleMenu(): void;
+  protected close(): void;
+  protected toggleCollapsed(): void;
+  protected onEscape(): void;
+  protected onNavKeydown(event: KeyboardEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<AppShell, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<AppShell, "gbt-app-shell", never, {
+    "navLabel": {
+      "alias": "navLabel";
+      "required": true;
+      "isSignal": true;
+    };
+    "skipLabel": {
+      "alias": "skipLabel";
+      "required": true;
+      "isSignal": true;
+    };
+    "openMenuLabel": {
+      "alias": "openMenuLabel";
+      "required": true;
+      "isSignal": true;
+    };
+    "closeMenuLabel": {
+      "alias": "closeMenuLabel";
+      "required": true;
+      "isSignal": true;
+    };
+    "collapseLabel": {
+      "alias": "collapseLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "expandLabel": {
+      "alias": "expandLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "versionLabel": {
+      "alias": "versionLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "collapsed": {
+      "alias": "collapsed";
+      "required": false;
+      "isSignal": true;
+    };
+    "collapsible": {
+      "alias": "collapsible";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "collapsedChange": "collapsedChange";
+  }, never, ["[shell-brand]", "[shell-nav]", "[shell-header]", "*"], true, never>;
+}

package/types/masmarino-gabarit-auth-activate.d.ts

@@ -0,0 +1,70 @@
+import { ActivateLabels, AuthFooterLink } from "@masmarino/gabarit/auth";
+import * as i0 from "@angular/core";
+type View = 'form' | 'success' | 'invalid';
+export declare class AuthActivate {
+  private readonly auth;
+  private readonly host;
+  private readonly injector;
+  token: import("@angular/core").InputSignal<string | null>;
+  labels: import("@angular/core").InputSignal<Partial<ActivateLabels>>;
+  minPasswordLength: import("@angular/core").InputSignal<number>;
+  /** The invitee chooses their username along with the password, for servers that let them. */
+  chooseUsername: import("@angular/core").InputSignal<boolean>;
+  usernamePattern: import("@angular/core").InputSignal<RegExp>;
+  activated: import("@angular/core").OutputEmitterRef<void>;
+  signIn: import("@angular/core").OutputEmitterRef<void>;
+  protected readonly text: import("@angular/core").Signal<Readonly<ActivateLabels>>;
+  protected readonly id: string;
+  protected readonly signInLink: import("@angular/core").Signal<AuthFooterLink | undefined>;
+  protected readonly passwordHint: import("@angular/core").Signal<string>;
+  private readonly spent;
+  view: import("@angular/core").WritableSignal<View>;
+  protected username: import("@angular/core").WritableSignal<string>;
+  protected password: import("@angular/core").WritableSignal<string>;
+  protected confirmation: import("@angular/core").WritableSignal<string>;
+  error: import("@angular/core").WritableSignal<string>;
+  submitting: import("@angular/core").WritableSignal<boolean>;
+  private attempted;
+  protected intro: import("@angular/core").Signal<string>;
+  protected usernameFieldError: import("@angular/core").Signal<string | null>;
+  protected passwordFieldError: import("@angular/core").Signal<string | null>;
+  protected confirmationFieldError: import("@angular/core").Signal<string | null>;
+  constructor();
+  submit(): void;
+  private confirmationProblem;
+  private clearPasswords;
+  private show;
+  private firstField;
+  private fail;
+  static ɵfac: i0.ɵɵFactoryDeclaration<AuthActivate, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<AuthActivate, "gbt-auth-activate", never, {
+    "token": {
+      "alias": "token";
+      "required": false;
+      "isSignal": true;
+    };
+    "labels": {
+      "alias": "labels";
+      "required": false;
+      "isSignal": true;
+    };
+    "minPasswordLength": {
+      "alias": "minPasswordLength";
+      "required": false;
+      "isSignal": true;
+    };
+    "chooseUsername": {
+      "alias": "chooseUsername";
+      "required": false;
+      "isSignal": true;
+    };
+    "usernamePattern": {
+      "alias": "usernamePattern";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "activated": "activated";
+    "signIn": "signIn";
+  }, ["signInLink"], ["[auth-backdrop]", "[auth-logo]", "[gbtAuthFooterLink]"], true, never>;
+}