@besaitech/ng-design-system 0.0.53 → 0.0.54

package/fesm2022/besaitech-ng-design-system.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, input, computed, ChangeDetectionStrategy, Component, booleanAttribute, isDevMode, effect, numberAttribute, output, signal, forwardRef, viewChild, viewChildren, afterRenderEffect, model, ElementRef, Directive, Injector, contentChild, untracked, afterNextRender, TemplateRef, linkedSignal, Injectable, contentChildren, DestroyRef } from '@angular/core';
+import { inject, input, computed, ChangeDetectionStrategy, Component, booleanAttribute, isDevMode, effect, numberAttribute, output, signal, forwardRef, viewChild, viewChildren, afterRenderEffect, model, ElementRef, Directive, Injector, contentChild, untracked, afterNextRender, TemplateRef, linkedSignal, DestroyRef, Injectable, contentChildren } from '@angular/core';
 import { DomSanitizer } from '@angular/platform-browser';
 import * as i1 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormsModule } from '@angular/forms';
@@ -380,11 +380,10 @@ class SdsInput {
     /** Hard character cap on the native field; 0 means no limit. */
     maxLength = input(0, ...(ngDevMode ? [{ debugName: "maxLength", transform: numberAttribute }] : [{ transform: numberAttribute }]));
     /**
-     * Accessible name for the clear button. French default so existing consumers are unchanged, but an
-     * app serving more than one language MUST translate it — it is an icon-only control, so this string
-     * is its only name.
+     * Accessible name for the clear button. English default; an app serving more than one language MUST
+     * translate it — it is an icon-only control, so this string is its only name.
      */
-    clearLabel = input('Effacer', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    clearLabel = input('Clear', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
     leadingIcon = input(null, ...(ngDevMode ? [{ debugName: "leadingIcon" }] : []));
     trailingIcon = input(null, ...(ngDevMode ? [{ debugName: "trailingIcon" }] : []));
     /**
@@ -697,6 +696,11 @@ const TEXT = {
  * The field formats **live as you type**: the currency symbol, grouping separators and prefix/suffix
  * stay visible on every keystroke, and the caret is kept where it belongs. The value is clamped to
  * {@link min}/{@link max} on blur and on every spinner step; ArrowUp / ArrowDown also step it.
+ *
+ * In a locale whose decimal separator is a comma (fr-BE, nl-BE, de-DE…) a typed "." — the key most
+ * keyboards and numpads offer — is taken as the decimal separator: "12.50" becomes "12,50". Pasted
+ * text works the same way, except that a "." followed by exactly three digits in a locale that groups
+ * with "." ("1.234" in nl-BE) stays a thousands separator.
  */
 class SdsInputNumber {
     inputId = `sds-input-number-${nextId$k++}`;
@@ -707,6 +711,13 @@ class SdsInputNumber {
     placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : []));
     error = input('', ...(ngDevMode ? [{ debugName: "error" }] : []));
+    /**
+     * Mark the field invalid (danger frame + `aria-invalid`) without showing an [error] message — for a
+     * host that renders the message itself, e.g. an editable table cell.
+     */
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    /** Extra id(s) for the field's `aria-describedby`, added to its own hint/error message id. */
+    ariaDescribedby = input('', ...(ngDevMode ? [{ debugName: "ariaDescribedby" }] : []));
     size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
     /** `filled` is a borderless field on a muted ground; `default` is the bordered white field. */
     appearance = input('default', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
@@ -743,22 +754,25 @@ class SdsInputNumber {
     allowEmpty = input(true, ...(ngDevMode ? [{ debugName: "allowEmpty", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     clearable = input(false, ...(ngDevMode ? [{ debugName: "clearable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /**
-     * Accessible names for the icon-only controls. French defaults so existing consumers are unchanged;
-     * translate them in a multi-language app.
+     * Accessible names for the icon-only controls. English defaults; translate them in a
+     * multi-language app.
      */
-    clearLabel = input('Effacer', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
-    incrementLabel = input('Augmenter', ...(ngDevMode ? [{ debugName: "incrementLabel" }] : []));
-    decrementLabel = input('Diminuer', ...(ngDevMode ? [{ debugName: "decrementLabel" }] : []));
+    clearLabel = input('Clear', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    incrementLabel = input('Increase', ...(ngDevMode ? [{ debugName: "incrementLabel" }] : []));
+    decrementLabel = input('Decrease', ...(ngDevMode ? [{ debugName: "decrementLabel" }] : []));
     /** The committed numeric value (driven by CVA + user input). */
     value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
     cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaDisabled" }] : []));
     isDisabled = computed(() => this.disabled() || this.cvaDisabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
     describedBy = computed(() => {
+        const ids = [];
         if (this.error())
-            return `${this.inputId}-err`;
-        if (this.hint())
-            return `${this.inputId}-hint`;
-        return null;
+            ids.push(`${this.inputId}-err`);
+        else if (this.hint())
+            ids.push(`${this.inputId}-hint`);
+        if (this.ariaDescribedby())
+            ids.push(this.ariaDescribedby());
+        return ids.length ? ids.join(' ') : null;
     }, ...(ngDevMode ? [{ debugName: "describedBy" }] : []));
     clearVisible = computed(() => this.clearable() && this.value() !== null && !this.isDisabled() && !this.readonly(), ...(ngDevMode ? [{ debugName: "clearVisible" }] : []));
     incrementIconName = computed(() => this.incrementIcon() ?? (this.buttonLayout() === 'stacked' ? 'chevron-up' : 'plus'), ...(ngDevMode ? [{ debugName: "incrementIconName" }] : []));
@@ -829,13 +843,13 @@ class SdsInputNumber {
             parts.push('opacity-60 cursor-not-allowed');
         if (this.appearance() === 'filled') {
             parts.push('border-transparent bg-muted text-ink');
-            parts.push(this.error()
+            parts.push(this.error() || this.invalid()
                 ? 'border-danger focus-within:ring-2 focus-within:ring-danger/30'
                 : 'focus-within:ring-2 focus-within:ring-brand-500/25');
         }
         else {
             parts.push('bg-surface text-ink');
-            parts.push(this.error()
+            parts.push(this.error() || this.invalid()
                 ? 'border-danger focus-within:border-danger focus-within:ring-2 focus-within:ring-danger/25'
                 : 'border-border focus-within:border-brand-500 focus-within:ring-2 focus-within:ring-brand-500/25');
         }
@@ -964,6 +978,38 @@ class SdsInputNumber {
         const n = Number(s);
         return Number.isFinite(n) ? n : null;
     }
+    /**
+     * In a locale whose decimal separator is not "." (fr-BE, nl-BE, de-DE…), turn the "." people type
+     * for a decimal point into the locale separator before parsing, so "12.50" reads as 12.5.
+     * - `typed` is the text of the keystroke: a "." just typed sits right before the caret and is
+     *   always the decimal point (even in a locale that groups with ".", whose group marks come from
+     *   the formatter, never from the keyboard).
+     * - Otherwise (paste, autofill, programmatic input) and only when the text holds no locale decimal
+     *   separator, the last "." is the decimal point — unless the locale groups with "." and exactly
+     *   three digits follow it ("1.234" in nl-BE is one thousand two hundred thirty-four).
+     */
+    localizeDecimalPoint(raw, caret, typed) {
+        const { group, decimal } = this.separators();
+        if (decimal === '.' || !raw.includes('.') || this.maxFrac() === 0)
+            return raw;
+        if (typed === '.' && raw[caret - 1] === '.') {
+            return raw.slice(0, caret - 1) + decimal + raw.slice(caret);
+        }
+        // A keystroke without a "." leaves the formatter's own "." group marks alone.
+        if ((typed !== null && !typed.includes('.')) || raw.includes(decimal))
+            return raw;
+        // Only a "." inside the number counts, not one in a prefix/suffix (" sq.ft").
+        const prefix = this.prefix();
+        const suffix = this.suffix();
+        const start = prefix && raw.startsWith(prefix) ? prefix.length : 0;
+        const end = suffix && raw.endsWith(suffix) ? raw.length - suffix.length : raw.length;
+        const last = raw.lastIndexOf('.', end - 1);
+        if (last < start)
+            return raw;
+        if (group === '.' && /^\d{3}(?!\d)/.test(raw.slice(last + 1, end)))
+            return raw;
+        return raw.slice(0, last) + decimal + raw.slice(last + 1);
+    }
     /** Pull the sign / integer / fraction fragments out of a formatted, partially-typed string. */
     parseInput(raw) {
         const { group, decimal } = this.separators();
@@ -1032,8 +1078,12 @@ class SdsInputNumber {
     // --- Interaction ----------------------------------------------------------
     onInput(event) {
         const el = event.target;
-        const raw = el.value;
-        const caret = el.selectionStart ?? raw.length;
+        const caret = el.selectionStart ?? el.value.length;
+        // `data` is the keystroke's text; null/undefined for a paste, deletion or a synthetic event.
+        const data = event.data;
+        const kind = event.inputType;
+        const typed = data != null && (kind === 'insertText' || kind === 'insertCompositionText') ? data : null;
+        const raw = this.localizeDecimalPoint(el.value, caret, typed);
         const target = this.significantBefore(raw, caret);
         const parsed = this.parseInput(raw);
         if (parsed.intDigits === '' && parsed.fracDigits === '' && !parsed.hadDecimal) {
@@ -1116,7 +1166,7 @@ class SdsInputNumber {
         this.cvaDisabled.set(isDisabled);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsInputNumber, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsInputNumber, isStandalone: true, selector: "sds-input-number", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, currency: { classPropertyName: "currency", publicName: "currency", isSignal: true, isRequired: false, transformFunction: null }, currencyDisplay: { classPropertyName: "currencyDisplay", publicName: "currencyDisplay", isSignal: true, isRequired: false, transformFunction: null }, useGrouping: { classPropertyName: "useGrouping", publicName: "useGrouping", isSignal: true, isRequired: false, transformFunction: null }, minFractionDigits: { classPropertyName: "minFractionDigits", publicName: "minFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, maxFractionDigits: { classPropertyName: "maxFractionDigits", publicName: "maxFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, showButtons: { classPropertyName: "showButtons", publicName: "showButtons", isSignal: true, isRequired: false, transformFunction: null }, buttonLayout: { classPropertyName: "buttonLayout", publicName: "buttonLayout", isSignal: true, isRequired: false, transformFunction: null }, incrementIcon: { classPropertyName: "incrementIcon", publicName: "incrementIcon", isSignal: true, isRequired: false, transformFunction: null }, decrementIcon: { classPropertyName: "decrementIcon", publicName: "decrementIcon", isSignal: true, isRequired: false, transformFunction: null }, allowEmpty: { classPropertyName: "allowEmpty", publicName: "allowEmpty", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, incrementLabel: { classPropertyName: "incrementLabel", publicName: "incrementLabel", isSignal: true, isRequired: false, transformFunction: null }, decrementLabel: { classPropertyName: "decrementLabel", publicName: "decrementLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsInputNumber, isStandalone: true, selector: "sds-input-number", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, currency: { classPropertyName: "currency", publicName: "currency", isSignal: true, isRequired: false, transformFunction: null }, currencyDisplay: { classPropertyName: "currencyDisplay", publicName: "currencyDisplay", isSignal: true, isRequired: false, transformFunction: null }, useGrouping: { classPropertyName: "useGrouping", publicName: "useGrouping", isSignal: true, isRequired: false, transformFunction: null }, minFractionDigits: { classPropertyName: "minFractionDigits", publicName: "minFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, maxFractionDigits: { classPropertyName: "maxFractionDigits", publicName: "maxFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, showButtons: { classPropertyName: "showButtons", publicName: "showButtons", isSignal: true, isRequired: false, transformFunction: null }, buttonLayout: { classPropertyName: "buttonLayout", publicName: "buttonLayout", isSignal: true, isRequired: false, transformFunction: null }, incrementIcon: { classPropertyName: "incrementIcon", publicName: "incrementIcon", isSignal: true, isRequired: false, transformFunction: null }, decrementIcon: { classPropertyName: "decrementIcon", publicName: "decrementIcon", isSignal: true, isRequired: false, transformFunction: null }, allowEmpty: { classPropertyName: "allowEmpty", publicName: "allowEmpty", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, incrementLabel: { classPropertyName: "incrementLabel", publicName: "incrementLabel", isSignal: true, isRequired: false, transformFunction: null }, decrementLabel: { classPropertyName: "decrementLabel", publicName: "decrementLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SdsInputNumber),
@@ -1169,7 +1219,7 @@ class SdsInputNumber {
           [disabled]="isDisabled()"
           [readOnly]="readonly()"
           [attr.aria-label]="!label() && ariaLabel() ? ariaLabel() : null"
-          [attr.aria-invalid]="error() ? 'true' : null"
+          [attr.aria-invalid]="error() || invalid() ? 'true' : null"
           [attr.aria-describedby]="describedBy()"
           [attr.aria-valuenow]="value()"
           [attr.aria-valuemin]="min()"
@@ -1324,7 +1374,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           [disabled]="isDisabled()"
           [readOnly]="readonly()"
           [attr.aria-label]="!label() && ariaLabel() ? ariaLabel() : null"
-          [attr.aria-invalid]="error() ? 'true' : null"
+          [attr.aria-invalid]="error() || invalid() ? 'true' : null"
           [attr.aria-describedby]="describedBy()"
           [attr.aria-valuenow]="value()"
           [attr.aria-valuemin]="min()"
@@ -1418,7 +1468,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     }
   `,
                 }]
-        }], ctorParameters: () => [], propDecorators: { fieldRef: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], currency: [{ type: i0.Input, args: [{ isSignal: true, alias: "currency", required: false }] }], currencyDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "currencyDisplay", required: false }] }], useGrouping: [{ type: i0.Input, args: [{ isSignal: true, alias: "useGrouping", required: false }] }], minFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "minFractionDigits", required: false }] }], maxFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFractionDigits", required: false }] }], prefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefix", required: false }] }], suffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffix", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], showButtons: [{ type: i0.Input, args: [{ isSignal: true, alias: "showButtons", required: false }] }], buttonLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLayout", required: false }] }], incrementIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementIcon", required: false }] }], decrementIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementIcon", required: false }] }], allowEmpty: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowEmpty", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], incrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementLabel", required: false }] }], decrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementLabel", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { fieldRef: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], ariaDescribedby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedby", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], currency: [{ type: i0.Input, args: [{ isSignal: true, alias: "currency", required: false }] }], currencyDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "currencyDisplay", required: false }] }], useGrouping: [{ type: i0.Input, args: [{ isSignal: true, alias: "useGrouping", required: false }] }], minFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "minFractionDigits", required: false }] }], maxFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFractionDigits", required: false }] }], prefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefix", required: false }] }], suffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffix", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], showButtons: [{ type: i0.Input, args: [{ isSignal: true, alias: "showButtons", required: false }] }], buttonLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLayout", required: false }] }], incrementIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementIcon", required: false }] }], decrementIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementIcon", required: false }] }], allowEmpty: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowEmpty", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], incrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementLabel", required: false }] }], decrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementLabel", required: false }] }] } });
 
 let nextId$j = 0;
 const SIZES$9 = {
@@ -1454,11 +1504,11 @@ class SdsLocalizedInput {
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /**
      * Accessible name for the in-field language switcher, and the "no translation yet" title suffix on each
-     * language button. French defaults so existing consumers are unchanged; translate them in a multi-language
-     * app (the buttons are letter-only, so the title carries their meaning).
+     * language button. English defaults; translate them in a multi-language app (the buttons are
+     * letter-only, so the title carries their meaning).
      */
-    languageSwitcherLabel = input('Langue', ...(ngDevMode ? [{ debugName: "languageSwitcherLabel" }] : []));
-    untranslatedLabel = input('à traduire', ...(ngDevMode ? [{ debugName: "untranslatedLabel" }] : []));
+    languageSwitcherLabel = input('Language', ...(ngDevMode ? [{ debugName: "languageSwitcherLabel" }] : []));
+    untranslatedLabel = input('not translated yet', ...(ngDevMode ? [{ debugName: "untranslatedLabel" }] : []));
     valueMap = signal({}, ...(ngDevMode ? [{ debugName: "valueMap" }] : []));
     /** Language chosen via the switcher; null means "follow currentLanguage / the first language". */
     manual = signal(null, ...(ngDevMode ? [{ debugName: "manual" }] : []));
@@ -1729,10 +1779,10 @@ class SdsOtpInput {
     autoFocus = input(false, ...(ngDevMode ? [{ debugName: "autoFocus", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /**
      * Accessible name for an individual box, suffixed with its 1-based position ("Digit 1", "Digit
-     * 2", …). French default so existing consumers are unchanged; translate it in an app serving more
-     * than one language, since each box is an icon-less control whose only name this is.
+     * 2", …). English default; translate it in an app serving more than one language, since each box
+     * is an icon-less control whose only name this is.
      */
-    cellLabel = input('Chiffre', ...(ngDevMode ? [{ debugName: "cellLabel" }] : []));
+    cellLabel = input('Digit', ...(ngDevMode ? [{ debugName: "cellLabel" }] : []));
     /** Emitted with the full value the moment the last box is filled. */
     completed = output();
     cells = viewChildren('cell', ...(ngDevMode ? [{ debugName: "cells" }] : []));
@@ -2050,6 +2100,13 @@ class SdsTextarea {
     maxLength = input(0, ...(ngDevMode ? [{ debugName: "maxLength", transform: numberAttribute }] : [{ transform: numberAttribute }]));
     /** Show a character counter row. */
     showCount = input(false, ...(ngDevMode ? [{ debugName: "showCount", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    /**
+     * Spoken text of the counter when {@link maxLength} is set; tokens `{count}` and `{max}`. English
+     * default — translate it in a multi-language app.
+     */
+    countLimitLabel = input('{count} of {max} characters used', ...(ngDevMode ? [{ debugName: "countLimitLabel" }] : []));
+    /** Spoken text of the counter without a {@link maxLength}; token `{count}`. */
+    countLabelTemplate = input('{count} characters', ...(ngDevMode ? [{ debugName: "countLabelTemplate" }] : []));
     resize = input('vertical', ...(ngDevMode ? [{ debugName: "resize" }] : []));
     /** Current value (driven by CVA + user input). */
     value = signal('', ...(ngDevMode ? [{ debugName: "value" }] : []));
@@ -2058,9 +2115,9 @@ class SdsTextarea {
     count = computed(() => this.value().length, ...(ngDevMode ? [{ debugName: "count" }] : []));
     hasCounter = computed(() => this.showCount() || this.maxLength() > 0, ...(ngDevMode ? [{ debugName: "hasCounter" }] : []));
     /** Spoken description of the counter for assistive tech. */
-    countLabel = computed(() => this.maxLength()
-        ? `${this.count()} sur ${this.maxLength()} caractères utilisés`
-        : `${this.count()} caractère(s)`, ...(ngDevMode ? [{ debugName: "countLabel" }] : []));
+    countLabel = computed(() => (this.maxLength() ? this.countLimitLabel() : this.countLabelTemplate())
+        .replace('{count}', String(this.count()))
+        .replace('{max}', String(this.maxLength())), ...(ngDevMode ? [{ debugName: "countLabel" }] : []));
     describedBy = computed(() => {
         const ids = [];
         if (this.error())
@@ -2137,7 +2194,7 @@ class SdsTextarea {
         el.style.height = `${el.scrollHeight}px`;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsTextarea, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsTextarea, isStandalone: true, selector: "sds-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsTextarea, isStandalone: true, selector: "sds-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null }, countLimitLabel: { classPropertyName: "countLimitLabel", publicName: "countLimitLabel", isSignal: true, isRequired: false, transformFunction: null }, countLabelTemplate: { classPropertyName: "countLabelTemplate", publicName: "countLabelTemplate", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SdsTextarea),
@@ -2276,7 +2333,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     }
   `,
                 }]
-        }], ctorParameters: () => [], propDecorators: { field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], showCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCount", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], showCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCount", required: false }] }], countLimitLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "countLimitLabel", required: false }] }], countLabelTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "countLabelTemplate", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }] } });
 
 let nextId$g = 0;
 const SIZES$6 = {
@@ -2543,8 +2600,11 @@ let nextId$f = 0;
  * of its own, so it can sit inside the consumer's `<label>` (a whole clickable
  * row), whose text then names it.
  *
+ * Set [indeterminate] for a "some but not all" state (e.g. a select-all box over a partial
+ * selection): the box shows a bar and reads as "mixed"; a click checks it.
+ *
  * @example
- * <sds-checkbox label="Fusion automatique" [(ngModel)]="autoMerge" />
+ * <sds-checkbox label="Auto-merge" [(ngModel)]="autoMerge" />
  */
 class SdsCheckbox {
     id = `sds-checkbox-${nextId$f++}`;
@@ -2553,14 +2613,20 @@ class SdsCheckbox {
     ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
     size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    /**
+     * "Some but not all": shows a bar and is announced as mixed while the value is false. Clicking
+     * checks it (the native behaviour); the host then decides the next [indeterminate].
+     */
+    indeterminate = input(false, ...(ngDevMode ? [{ debugName: "indeterminate", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     checked = signal(false, ...(ngDevMode ? [{ debugName: "checked" }] : []));
+    mixed = computed(() => this.indeterminate() && !this.checked(), ...(ngDevMode ? [{ debugName: "mixed" }] : []));
     cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaDisabled" }] : []));
     isDisabled = computed(() => this.disabled() || this.cvaDisabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
     iconSize = computed(() => (this.size() === 'sm' ? 11 : 13), ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
     stateClasses = computed(() => this.isDisabled() ? 'cursor-not-allowed opacity-60' : 'cursor-pointer', ...(ngDevMode ? [{ debugName: "stateClasses" }] : []));
     boxClasses = computed(() => {
         const size = this.size() === 'sm' ? 'h-4 w-4' : 'h-5 w-5';
-        const state = this.checked()
+        const state = this.checked() || this.mixed()
             ? 'border-brand-600 bg-brand-600 text-white'
             : 'border-border bg-surface text-transparent';
         const focus = 'focus-within:ring-2 focus-within:ring-brand-500/30 focus-within:border-brand-500';
@@ -2587,7 +2653,7 @@ class SdsCheckbox {
         this.onChange(next);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsCheckbox, isStandalone: true, selector: "sds-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "inline-flex" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsCheckbox, isStandalone: true, selector: "sds-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "inline-flex align-middle" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SdsCheckbox),
@@ -2617,6 +2683,7 @@ class SdsCheckbox {
           class="absolute inset-0 m-0 cursor-[inherit] opacity-0"
           [id]="id"
           [checked]="checked()"
+          [indeterminate]="mixed()"
           [disabled]="isDisabled()"
           [attr.aria-label]="!label() && ariaLabel() ? ariaLabel() : null"
           (change)="onInput($event)"
@@ -2624,6 +2691,8 @@ class SdsCheckbox {
         />
         @if (checked()) {
           <sds-icon name="check" [size]="iconSize()" [strokeWidth]="3" />
+        } @else if (mixed()) {
+          <span class="h-0.5 w-2.5 rounded-full bg-current" aria-hidden="true"></span>
         }
       </span>
     </ng-template>
@@ -2642,7 +2711,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                             multi: true,
                         },
                     ],
-                    host: { class: 'inline-flex' },
+                    // align-middle: in an inline context (a table cell) an empty box and a checked one would otherwise
+                    // sit on different baselines, and the row would jump by a few pixels on every toggle.
+                    host: { class: 'inline-flex align-middle' },
                     template: `
     <!-- With a visible label the whole thing is a <label>. Without one it is a plain span, so the box can
          sit inside the consumer's own <label> (a clickable row, say) without nesting labels. -->
@@ -2667,6 +2738,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           class="absolute inset-0 m-0 cursor-[inherit] opacity-0"
           [id]="id"
           [checked]="checked()"
+          [indeterminate]="mixed()"
           [disabled]="isDisabled()"
           [attr.aria-label]="!label() && ariaLabel() ? ariaLabel() : null"
           (change)="onInput($event)"
@@ -2674,12 +2746,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
         />
         @if (checked()) {
           <sds-icon name="check" [size]="iconSize()" [strokeWidth]="3" />
+        } @else if (mixed()) {
+          <span class="h-0.5 w-2.5 rounded-full bg-current" aria-hidden="true"></span>
         }
       </span>
     </ng-template>
   `,
                 }]
-        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }] } });
 
 let nextId$e = 0;
 /**
@@ -4053,6 +4127,9 @@ const STATES = {
  * for multi-select ("select all matches"): it then carries `aria-pressed` and a corner check. [busy]
  * shows a spinner and sets `aria-busy` while a save is in flight.
  *
+ * A photo that fails to load (404, blocked, not an image) falls back to the no-photo layout — never
+ * a broken-image icon — and `(imageError)` reports the URL. A new [image] URL is tried again.
+ *
  * @example
  * <sds-status-tile title="Bacon" subtitle="Extras" state="sold-out" note="Back at 22:00"
  *                  soldOutLabel="Sold out" (activate)="toggle(item)" />
@@ -4077,6 +4154,21 @@ class SdsStatusTile {
     hiddenLabel = input('Hidden', ...(ngDevMode ? [{ debugName: "hiddenLabel" }] : []));
     /** The tile was pressed (click, tap, Enter or Space). */
     activate = output();
+    /** The [image] URL failed to load; the tile has fallen back to its no-photo layout. */
+    imageError = output();
+    /** The URL that last failed to load — hidden until [image] changes to another URL. */
+    failedImage = signal(null, ...(ngDevMode ? [{ debugName: "failedImage" }] : []));
+    showImage = computed(() => {
+        const src = this.image();
+        return !!src && src !== this.failedImage();
+    }, ...(ngDevMode ? [{ debugName: "showImage" }] : []));
+    onImageError() {
+        const src = this.image();
+        if (!src)
+            return;
+        this.failedImage.set(src);
+        this.imageError.emit(src);
+    }
     style = computed(() => STATES[this.state()] ?? STATES.available, ...(ngDevMode ? [{ debugName: "style" }] : []));
     stateText = computed(() => {
         switch (this.state()) {
@@ -4107,7 +4199,7 @@ class SdsStatusTile {
             ring);
     }, ...(ngDevMode ? [{ debugName: "tileClass" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsStatusTile, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsStatusTile, isStandalone: true, selector: "sds-status-tile", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, imageAlt: { classPropertyName: "imageAlt", publicName: "imageAlt", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, note: { classPropertyName: "note", publicName: "note", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, availableLabel: { classPropertyName: "availableLabel", publicName: "availableLabel", isSignal: true, isRequired: false, transformFunction: null }, soldOutLabel: { classPropertyName: "soldOutLabel", publicName: "soldOutLabel", isSignal: true, isRequired: false, transformFunction: null }, hiddenLabel: { classPropertyName: "hiddenLabel", publicName: "hiddenLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activate: "activate" }, host: { classAttribute: "block" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsStatusTile, isStandalone: true, selector: "sds-status-tile", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, imageAlt: { classPropertyName: "imageAlt", publicName: "imageAlt", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, note: { classPropertyName: "note", publicName: "note", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, availableLabel: { classPropertyName: "availableLabel", publicName: "availableLabel", isSignal: true, isRequired: false, transformFunction: null }, soldOutLabel: { classPropertyName: "soldOutLabel", publicName: "soldOutLabel", isSignal: true, isRequired: false, transformFunction: null }, hiddenLabel: { classPropertyName: "hiddenLabel", publicName: "hiddenLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activate: "activate", imageError: "imageError" }, host: { classAttribute: "block" }, ngImport: i0, template: `
     <button
       type="button"
       [class]="tileClass()"
@@ -4118,11 +4210,12 @@ class SdsStatusTile {
       [style.background-image]="hatch()"
       (click)="activate.emit()"
     >
-      @if (image()) {
+      @if (showImage()) {
         <span class="relative block h-[45%] w-full shrink-0 overflow-hidden bg-muted">
           <img
             [src]="image()"
             [alt]="imageAlt()"
+            (error)="onImageError()"
             class="h-full w-full object-cover"
             [class.grayscale]="state() !== 'available'"
             [class.opacity-60]="state() !== 'available'"
@@ -4135,7 +4228,7 @@ class SdsStatusTile {
       <span class="flex min-h-0 w-full flex-1 flex-col gap-1 p-3 text-left">
         <span
           class="line-clamp-2 break-words font-bold leading-tight text-ink"
-          [class]="image() ? 'text-base' : 'text-lg'"
+          [class]="showImage() ? 'text-base' : 'text-lg'"
           [class.line-through]="state() === 'sold-out'"
           [class.decoration-2]="state() === 'sold-out'"
           >{{ title() }}</span
@@ -4198,11 +4291,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
       [style.background-image]="hatch()"
       (click)="activate.emit()"
     >
-      @if (image()) {
+      @if (showImage()) {
         <span class="relative block h-[45%] w-full shrink-0 overflow-hidden bg-muted">
           <img
             [src]="image()"
             [alt]="imageAlt()"
+            (error)="onImageError()"
             class="h-full w-full object-cover"
             [class.grayscale]="state() !== 'available'"
             [class.opacity-60]="state() !== 'available'"
@@ -4215,7 +4309,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
       <span class="flex min-h-0 w-full flex-1 flex-col gap-1 p-3 text-left">
         <span
           class="line-clamp-2 break-words font-bold leading-tight text-ink"
-          [class]="image() ? 'text-base' : 'text-lg'"
+          [class]="showImage() ? 'text-base' : 'text-lg'"
           [class.line-through]="state() === 'sold-out'"
           [class.decoration-2]="state() === 'sold-out'"
           >{{ title() }}</span
@@ -4260,7 +4354,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     </button>
   `,
                 }]
-        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], image: [{ type: i0.Input, args: [{ isSignal: true, alias: "image", required: false }] }], imageAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageAlt", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], note: [{ type: i0.Input, args: [{ isSignal: true, alias: "note", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], busy: [{ type: i0.Input, args: [{ isSignal: true, alias: "busy", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], availableLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "availableLabel", required: false }] }], soldOutLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "soldOutLabel", required: false }] }], hiddenLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hiddenLabel", required: false }] }], activate: [{ type: i0.Output, args: ["activate"] }] } });
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], image: [{ type: i0.Input, args: [{ isSignal: true, alias: "image", required: false }] }], imageAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageAlt", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], note: [{ type: i0.Input, args: [{ isSignal: true, alias: "note", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], busy: [{ type: i0.Input, args: [{ isSignal: true, alias: "busy", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], availableLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "availableLabel", required: false }] }], soldOutLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "soldOutLabel", required: false }] }], hiddenLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "hiddenLabel", required: false }] }], activate: [{ type: i0.Output, args: ["activate"] }], imageError: [{ type: i0.Output, args: ["imageError"] }] } });
 
 let nextId$b = 0;
 /**
@@ -4904,6 +4998,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 }]
         }] });
 let nextId$a = 0;
+/** Fastest auto-scroll step, in px per animation frame (reached at the very edge). */
+const AUTO_SCROLL_MAX_STEP = 18;
+/** The nearest ancestor that scrolls vertically (below the document, which is handled as the window). */
+function scrollParentOf(el) {
+    const doc = el.ownerDocument;
+    for (let node = el.parentElement; node; node = node.parentElement) {
+        if (node === doc.body || node === doc.documentElement)
+            break;
+        const overflowY = getComputedStyle(node).overflowY;
+        if (/(auto|scroll|overlay)/.test(overflowY) && node.scrollHeight > node.clientHeight)
+            return node;
+    }
+    return null;
+}
+/**
+ * Signed scroll step for a pointer at `y` inside the band [top, bottom]: negative near the top edge,
+ * positive near the bottom, faster the closer it gets, 0 elsewhere.
+ */
+function edgeStep(y, top, bottom, edge) {
+    if (bottom - top < edge * 2)
+        edge = (bottom - top) / 3;
+    if (edge <= 0)
+        return 0;
+    const speed = (depth) => Math.ceil(AUTO_SCROLL_MAX_STEP * Math.min(1, depth / edge));
+    if (y < top + edge)
+        return -speed(top + edge - y);
+    if (y > bottom - edge)
+        return speed(y - (bottom - edge));
+    return 0;
+}
 /** Move one entry of `list` from `from` to `to`, returning a new array. */
 function moveItem(list, from, to) {
     const next = [...list];
@@ -4919,6 +5043,10 @@ function moveItem(list, from, to) {
  * - **Keyboard**: focus a handle, **Space/Enter** picks the item up, **↑/↓** (and Home/End) move it,
  *   **Space/Enter** drops it, **Escape** cancels (the event is stopped, so an enclosing drawer stays open).
  *   Moving focus away also cancels.
+ * - **Long lists**: while a pointer drag nears the top or bottom edge of the nearest scrollable
+ *   ancestor (a drawer body, a panel) — or of the window — that container scrolls, faster closer to
+ *   the edge, and the dragged row stays under the pointer. A keyboard move scrolls just enough to keep
+ *   the moving row in view. Turn off with `[autoScroll]="false"`.
  * - **Screen readers**: every handle is named ("Reorder Burgers") and described by the instructions; an
  *   assertive live region announces pick-up, each move ("moved to position 3 of 8"), the drop and a cancel.
  *
@@ -4955,6 +5083,13 @@ class SdsSortableList {
     appearance = input('card', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
     /** Accessible name of the list. */
     ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
+    /**
+     * Scroll the nearest scrollable ancestor (then the window) while dragging near its top or bottom
+     * edge, and keep a keyboard-moved row in view.
+     */
+    autoScroll = input(true, ...(ngDevMode ? [{ debugName: "autoScroll", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    /** Height (px) of the band along each scroll edge where a pointer drag starts auto-scrolling. */
+    autoScrollEdge = input(56, ...(ngDevMode ? [{ debugName: "autoScrollEdge", transform: numberAttribute }] : [{ transform: numberAttribute }]));
     /** Name of each handle; `{item}` is the item's label. */
     handleLabel = input('Reorder {item}', ...(ngDevMode ? [{ debugName: "handleLabel" }] : []));
     /** Read after a handle's name (aria-describedby). */
@@ -4985,6 +5120,16 @@ class SdsSortableList {
     gap = 0;
     pointerId = null;
     startY = 0;
+    /** Latest pointer position during a pointer drag (auto-scroll re-reads it every frame). */
+    lastY = 0;
+    /** The host's viewport top at drag start: the drift since then is how far its scrollers moved. */
+    startHostTop = 0;
+    /** Nearest scrollable ancestor, found at drag start. */
+    scroller = null;
+    frame = null;
+    constructor() {
+        inject(DestroyRef).onDestroy(() => this.stopAutoScroll());
+    }
     /** Per-row offsets that open a gap where the moving row will land. */
     shifts = computed(() => {
         const a = this.active();
@@ -5118,7 +5263,7 @@ class SdsSortableList {
             case 'Escape':
                 event.preventDefault();
                 event.stopPropagation();
-                this.cancel();
+                this.cancel(true, true);
                 return;
             case 'Tab':
                 this.cancel();
@@ -5130,6 +5275,7 @@ class SdsSortableList {
             return;
         this.target.set(to);
         this.announce(this.movedMessage(), to);
+        this.revealActive();
     }
     /** Focus leaving the list while an item is picked up cancels the move. */
     onFocusOut(event) {
@@ -5152,17 +5298,39 @@ class SdsSortableList {
         event.currentTarget.focus({ preventScroll: true });
         this.pointerId = event.pointerId;
         this.startY = event.clientY;
+        this.lastY = event.clientY;
         this.pointerDy.set(0);
         this.begin(i, 'pointer');
+        this.startAutoScroll();
     }
     onPointerMove(event) {
         if (this.mode() !== 'pointer' || event.pointerId !== this.pointerId)
             return;
+        this.lastY = event.clientY;
+        this.track();
+    }
+    /**
+     * Place the dragged row under the pointer and pick its landing slot. Positions are compared in
+     * drag-start coordinates: the pointer's travel plus however far the list has scrolled since.
+     */
+    track() {
         const a = this.active();
-        if (a === null)
-            return;
-        const dy = event.clientY - this.startY;
+        if (a === null || !this.rects[a])
+            return;
+        // Keep the row inside the list: it can't be dropped beyond either end, and a row dragged past the
+        // end would grow the scroll area under an auto-scroll that then never stops.
+        const first = this.rects[0];
+        const last = this.rects[this.rects.length - 1];
+        const minDy = first.top - this.rects[a].top;
+        const maxDy = last.top + last.height - (this.rects[a].top + this.rects[a].height);
+        const dy = Math.min(maxDy, Math.max(minDy, this.lastY - this.startY + this.scrolledBy()));
         this.pointerDy.set(dy);
+        // Pinned at an end of the list: that end's slot (with equal row heights the centre test below
+        // would stop one short of the last slot).
+        if (dy >= maxDy)
+            return this.target.set(this.rects.length - 1);
+        if (dy <= minDy)
+            return this.target.set(0);
         const center = this.rects[a].top + this.rects[a].height / 2 + dy;
         let t = 0;
         this.rects.forEach((r, j) => {
@@ -5171,6 +5339,103 @@ class SdsSortableList {
         });
         this.target.set(t);
     }
+    /** How far (px) the list has moved up the viewport since the drag began — any ancestor or the window. */
+    scrolledBy() {
+        return this.startHostTop - this.host.nativeElement.getBoundingClientRect().top;
+    }
+    // --- auto-scroll ----------------------------------------------------------------
+    startAutoScroll() {
+        if (!this.autoScroll() || typeof requestAnimationFrame === 'undefined')
+            return;
+        this.stopAutoScroll();
+        const tick = () => {
+            this.frame = null;
+            if (this.mode() !== 'pointer')
+                return;
+            this.scrollNearEdge(this.lastY);
+            // Re-track every frame: auto-scroll, or a wheel/trackpad scroll, moves the list under a still pointer.
+            this.track();
+            this.frame = requestAnimationFrame(tick);
+        };
+        this.frame = requestAnimationFrame(tick);
+    }
+    stopAutoScroll() {
+        if (this.frame !== null)
+            cancelAnimationFrame(this.frame);
+        this.frame = null;
+    }
+    /**
+     * One auto-scroll step for a pointer at `y`: the scroll container first, then the window. A side
+     * only scrolls while part of the list is still hidden past that edge.
+     */
+    scrollNearEdge(y) {
+        const edge = Math.max(0, this.autoScrollEdge());
+        const view = this.host.nativeElement.ownerDocument.defaultView;
+        const vh = view?.innerHeight ?? 0;
+        const list = this.host.nativeElement.getBoundingClientRect();
+        /** A step toward a side of the band [top, bottom], or 0 when the list doesn't extend past it. */
+        const stepFor = (top, bottom) => {
+            const step = edgeStep(y, top, bottom, edge);
+            if (step < 0 && list.top >= top)
+                return 0;
+            if (step > 0 && list.bottom <= bottom)
+                return 0;
+            return step;
+        };
+        const el = this.scroller;
+        if (el) {
+            const box = el.getBoundingClientRect();
+            const step = stepFor(Math.max(box.top, 0), Math.min(box.bottom, vh));
+            const room = step < 0 ? el.scrollTop : el.scrollHeight - el.clientHeight - el.scrollTop;
+            if (step !== 0 && room > 0.5) {
+                el.scrollTop += step;
+                return true;
+            }
+        }
+        const doc = this.host.nativeElement.ownerDocument.scrollingElement;
+        if (!view || !doc)
+            return false;
+        const step = stepFor(0, vh);
+        const room = step < 0 ? doc.scrollTop : doc.scrollHeight - doc.clientHeight - doc.scrollTop;
+        if (step === 0 || room <= 0.5)
+            return false;
+        view.scrollBy(0, step);
+        return true;
+    }
+    /**
+     * Keyboard move: scroll just enough (container, then window) to keep the moving row in view. Its
+     * resting box comes from drag-start geometry, since its transform may still be animating.
+     */
+    revealActive() {
+        if (!this.autoScroll())
+            return;
+        afterNextRender(() => {
+            const a = this.active();
+            if (a === null || !this.rects[a] || this.mode() !== 'keyboard')
+                return;
+            const margin = 8;
+            const view = this.host.nativeElement.ownerDocument.defaultView;
+            const vh = view?.innerHeight ?? 0;
+            /** How far the row sticks out of [lo, hi]: negative above, positive below, 0 inside. */
+            const overflow = (lo, hi) => {
+                const top = this.rects[a].top + this.activeOffset() - this.scrolledBy();
+                const bottom = top + this.rects[a].height;
+                return top < lo ? top - lo : bottom > hi ? bottom - hi : 0;
+            };
+            const el = this.scroller;
+            if (el) {
+                const box = el.getBoundingClientRect();
+                const d = overflow(Math.max(box.top, 0) + margin, Math.min(box.bottom, vh) - margin);
+                if (d)
+                    el.scrollTop += d;
+            }
+            if (view) {
+                const d = overflow(margin, vh - margin);
+                if (d)
+                    view.scrollBy(0, d);
+            }
+        }, { injector: this.injector });
+    }
     onPointerUp(event) {
         if (this.mode() !== 'pointer' || event.pointerId !== this.pointerId)
             return;
@@ -5183,6 +5448,8 @@ class SdsSortableList {
     // --- lifecycle of a move -------------------------------------------------------
     begin(i, mode) {
         this.measure();
+        this.startHostTop = this.host.nativeElement.getBoundingClientRect().top;
+        this.scroller = this.autoScroll() ? scrollParentOf(this.host.nativeElement) : null;
         this.active.set(i);
         this.target.set(i);
         this.mode.set(mode);
@@ -5223,20 +5490,29 @@ class SdsSortableList {
         this.focusHandle(to);
     }
     /** Nothing was moved in the DOM while dragging, so focus is still where it should be. */
-    cancel(announce = true) {
+    cancel(announce = true, reveal = false) {
         const from = this.active();
         if (from === null)
             return;
+        const keyboard = this.mode() === 'keyboard';
         this.reset();
         if (announce)
             this.announce(this.cancelledMessage(), from);
+        // Escape after a keyboard move that scrolled away: bring the row (and its focused handle) back.
+        if (reveal && keyboard && this.autoScroll()) {
+            afterNextRender(() => this.host.nativeElement
+                .querySelector(`[data-sortable-index="${from}"]`)
+                ?.scrollIntoView({ block: 'nearest' }), { injector: this.injector });
+        }
     }
     reset() {
+        this.stopAutoScroll();
         this.active.set(null);
         this.target.set(null);
         this.mode.set(null);
         this.pointerDy.set(0);
         this.pointerId = null;
+        this.scroller = null;
     }
     focusHandle(index) {
         afterNextRender(() => {
@@ -5257,7 +5533,7 @@ class SdsSortableList {
         queueMicrotask(() => this.liveMessage.set(text));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsSortableList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsSortableList, isStandalone: true, selector: "sds-sortable-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, labelField: { classPropertyName: "labelField", publicName: "labelField", isSignal: true, isRequired: false, transformFunction: null }, itemLabel: { classPropertyName: "itemLabel", publicName: "itemLabel", isSignal: true, isRequired: false, transformFunction: null }, itemDisabled: { classPropertyName: "itemDisabled", publicName: "itemDisabled", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, handleLabel: { classPropertyName: "handleLabel", publicName: "handleLabel", isSignal: true, isRequired: false, transformFunction: null }, instructions: { classPropertyName: "instructions", publicName: "instructions", isSignal: true, isRequired: false, transformFunction: null }, pickedUpMessage: { classPropertyName: "pickedUpMessage", publicName: "pickedUpMessage", isSignal: true, isRequired: false, transformFunction: null }, movedMessage: { classPropertyName: "movedMessage", publicName: "movedMessage", isSignal: true, isRequired: false, transformFunction: null }, droppedMessage: { classPropertyName: "droppedMessage", publicName: "droppedMessage", isSignal: true, isRequired: false, transformFunction: null }, cancelledMessage: { classPropertyName: "cancelledMessage", publicName: "cancelledMessage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", reorder: "reorder" }, host: { classAttribute: "block" }, queries: [{ propertyName: "itemTpl", first: true, predicate: SdsSortableItem, descendants: true, isSignal: true }, { propertyName: "handleTpl", first: true, predicate: SdsSortableHandle, descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsSortableList, isStandalone: true, selector: "sds-sortable-list", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, labelField: { classPropertyName: "labelField", publicName: "labelField", isSignal: true, isRequired: false, transformFunction: null }, itemLabel: { classPropertyName: "itemLabel", publicName: "itemLabel", isSignal: true, isRequired: false, transformFunction: null }, itemDisabled: { classPropertyName: "itemDisabled", publicName: "itemDisabled", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, autoScroll: { classPropertyName: "autoScroll", publicName: "autoScroll", isSignal: true, isRequired: false, transformFunction: null }, autoScrollEdge: { classPropertyName: "autoScrollEdge", publicName: "autoScrollEdge", isSignal: true, isRequired: false, transformFunction: null }, handleLabel: { classPropertyName: "handleLabel", publicName: "handleLabel", isSignal: true, isRequired: false, transformFunction: null }, instructions: { classPropertyName: "instructions", publicName: "instructions", isSignal: true, isRequired: false, transformFunction: null }, pickedUpMessage: { classPropertyName: "pickedUpMessage", publicName: "pickedUpMessage", isSignal: true, isRequired: false, transformFunction: null }, movedMessage: { classPropertyName: "movedMessage", publicName: "movedMessage", isSignal: true, isRequired: false, transformFunction: null }, droppedMessage: { classPropertyName: "droppedMessage", publicName: "droppedMessage", isSignal: true, isRequired: false, transformFunction: null }, cancelledMessage: { classPropertyName: "cancelledMessage", publicName: "cancelledMessage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { items: "itemsChange", reorder: "reorder" }, host: { classAttribute: "block" }, queries: [{ propertyName: "itemTpl", first: true, predicate: SdsSortableItem, descendants: true, isSignal: true }, { propertyName: "handleTpl", first: true, predicate: SdsSortableHandle, descendants: true, isSignal: true }], ngImport: i0, template: `
     <ul
       role="list"
       [attr.aria-label]="ariaLabel() || null"
@@ -5380,7 +5656,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     <div class="sr-only" aria-live="assertive" aria-atomic="true">{{ liveMessage() }}</div>
   `,
                 }]
-        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], labelField: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelField", required: false }] }], itemLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemLabel", required: false }] }], itemDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemDisabled", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], handleLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "handleLabel", required: false }] }], instructions: [{ type: i0.Input, args: [{ isSignal: true, alias: "instructions", required: false }] }], pickedUpMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickedUpMessage", required: false }] }], movedMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "movedMessage", required: false }] }], droppedMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "droppedMessage", required: false }] }], cancelledMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelledMessage", required: false }] }], reorder: [{ type: i0.Output, args: ["reorder"] }], itemTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSortableItem), { isSignal: true }] }], handleTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSortableHandle), { isSignal: true }] }] } });
+        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }, { type: i0.Output, args: ["itemsChange"] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], labelField: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelField", required: false }] }], itemLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemLabel", required: false }] }], itemDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemDisabled", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], autoScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoScroll", required: false }] }], autoScrollEdge: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoScrollEdge", required: false }] }], handleLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "handleLabel", required: false }] }], instructions: [{ type: i0.Input, args: [{ isSignal: true, alias: "instructions", required: false }] }], pickedUpMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "pickedUpMessage", required: false }] }], movedMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "movedMessage", required: false }] }], droppedMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "droppedMessage", required: false }] }], cancelledMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelledMessage", required: false }] }], reorder: [{ type: i0.Output, args: ["reorder"] }], itemTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSortableItem), { isSignal: true }] }], handleTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSortableHandle), { isSignal: true }] }] } });
 
 let nextId$9 = 0;
 /** "1.5 MB" style size (decimal units, like file managers show them), for messages. */
@@ -6282,41 +6558,41 @@ class SdsCalendar {
     max = input(null, ...(ngDevMode ? [{ debugName: "max" }] : []));
     /** 0 = Sunday, 1 = Monday (default, European). */
     firstDayOfWeek = input(1, ...(ngDevMode ? [{ debugName: "firstDayOfWeek" }] : []));
-    locale = input('fr-FR', ...(ngDevMode ? [{ debugName: "locale" }] : []));
+    /** BCP 47 locale for month and weekday names. Defaults to `en-GB`; pass the app's locale. */
+    locale = input('en-GB', ...(ngDevMode ? [{ debugName: "locale" }] : []));
     showActions = input(true, ...(ngDevMode ? [{ debugName: "showActions" }] : []));
     /** When true, a time editor (HH:mm, 24h) is shown and the value keeps its time-of-day. */
     showTime = input(false, ...(ngDevMode ? [{ debugName: "showTime", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /** When true, a "done" action is shown (used by the overlay picker to close the panel). */
     showDone = input(false, ...(ngDevMode ? [{ debugName: "showDone", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /** Visible label of the time editor. Translate it in the consuming app. */
-    timeLabel = input('Heure', ...(ngDevMode ? [{ debugName: "timeLabel" }] : []));
+    timeLabel = input('Time', ...(ngDevMode ? [{ debugName: "timeLabel" }] : []));
     /** Accessible name of the hours field (it is a bare numeric input). */
-    hoursLabel = input('Heures', ...(ngDevMode ? [{ debugName: "hoursLabel" }] : []));
+    hoursLabel = input('Hours', ...(ngDevMode ? [{ debugName: "hoursLabel" }] : []));
     /** Accessible name of the minutes field. */
     minutesLabel = input('Minutes', ...(ngDevMode ? [{ debugName: "minutesLabel" }] : []));
     /** Visible text of the "done" action (shown when {@link showDone} is true). */
-    doneLabel = input('Terminé', ...(ngDevMode ? [{ debugName: "doneLabel" }] : []));
+    doneLabel = input('Done', ...(ngDevMode ? [{ debugName: "doneLabel" }] : []));
     /**
-     * Accessible name for the calendar container. French default so existing consumers are unchanged,
-     * but an app serving more than one language MUST translate it.
+     * Accessible name for the calendar container. English default; an app serving more than one
+     * language MUST translate it.
      */
-    calendarLabel = input('Calendrier', ...(ngDevMode ? [{ debugName: "calendarLabel" }] : []));
+    calendarLabel = input('Calendar', ...(ngDevMode ? [{ debugName: "calendarLabel" }] : []));
     /**
      * Accessible name for the "previous" nav button. It is icon-only, so this string is its ONLY
-     * accessible name — a hardcoded French one is simply wrong in every other locale. Translate it in
-     * the consuming app.
+     * accessible name. English default; translate it in the consuming app.
      */
-    previousLabel = input('Précédent', ...(ngDevMode ? [{ debugName: "previousLabel" }] : []));
+    previousLabel = input('Previous', ...(ngDevMode ? [{ debugName: "previousLabel" }] : []));
     /** Accessible name for the icon-only "next" nav button. See {@link previousLabel}. */
-    nextLabel = input('Suivant', ...(ngDevMode ? [{ debugName: "nextLabel" }] : []));
+    nextLabel = input('Next', ...(ngDevMode ? [{ debugName: "nextLabel" }] : []));
     /**
      * Visible text of the "today" action (shown when {@link showActions} is true). Translate it in the
      * consuming app — the library ships no i18n of its own.
      */
-    todayActionLabel = input("Aujourd'hui", ...(ngDevMode ? [{ debugName: "todayActionLabel" }] : []));
+    todayActionLabel = input('Today', ...(ngDevMode ? [{ debugName: "todayActionLabel" }] : []));
     /** Visible text of the "clear" action. See {@link todayActionLabel}. */
-    clearActionLabel = input('Effacer', ...(ngDevMode ? [{ debugName: "clearActionLabel" }] : []));
-    /** Emitted when a concrete date is picked (day click or "Aujourd'hui"). */
+    clearActionLabel = input('Clear', ...(ngDevMode ? [{ debugName: "clearActionLabel" }] : []));
+    /** Emitted when a concrete date is picked (day click or "Today"). */
     dateSelect = output();
     /** Emitted when the "done" action is used (see {@link showDone}). */
     done = output();
@@ -7079,7 +7355,7 @@ const SIZES$5 = {
  * [(ngModel)]; the value is a `Date | null`.
  *
  * @example
- * <sds-date-picker label="Date de garde" [(ngModel)]="date" />
+ * <sds-date-picker label="Delivery date" [(ngModel)]="date" />
  */
 class SdsDatePicker {
     host = inject(ElementRef);
@@ -7087,14 +7363,18 @@ class SdsDatePicker {
     fieldId = `sds-date-${nextId$7++}`;
     label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
     ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
-    placeholder = input('jj/mm/aaaa', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    placeholder = input('dd/mm/yyyy', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : []));
     error = input('', ...(ngDevMode ? [{ debugName: "error" }] : []));
     size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : []));
     min = input(null, ...(ngDevMode ? [{ debugName: "min" }] : []));
     max = input(null, ...(ngDevMode ? [{ debugName: "max" }] : []));
     firstDayOfWeek = input(1, ...(ngDevMode ? [{ debugName: "firstDayOfWeek" }] : []));
-    locale = input('fr-FR', ...(ngDevMode ? [{ debugName: "locale" }] : []));
+    /**
+     * BCP 47 locale for the calendar's month and weekday names. Defaults to `en-GB` (English names, and
+     * the same day-first order as the default dd/MM/yyyy display); pass the app's locale.
+     */
+    locale = input('en-GB', ...(ngDevMode ? [{ debugName: "locale" }] : []));
     inline = input(false, ...(ngDevMode ? [{ debugName: "inline", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     clearable = input(true, ...(ngDevMode ? [{ debugName: "clearable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     showActions = input(true, ...(ngDevMode ? [{ debugName: "showActions", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
@@ -7108,38 +7388,37 @@ class SdsDatePicker {
     /** Custom display formatter for the DATE part (default dd/MM/yyyy). The time is appended as HH:mm. */
     format = input(formatDdMmYyyy, ...(ngDevMode ? [{ debugName: "format" }] : []));
     /** Visible label of the time editor (forwarded to the calendar). See {@link showTime}. */
-    timeLabel = input('Heure', ...(ngDevMode ? [{ debugName: "timeLabel" }] : []));
+    timeLabel = input('Time', ...(ngDevMode ? [{ debugName: "timeLabel" }] : []));
     /** Accessible name of the hours field (forwarded to the calendar). */
-    hoursLabel = input('Heures', ...(ngDevMode ? [{ debugName: "hoursLabel" }] : []));
+    hoursLabel = input('Hours', ...(ngDevMode ? [{ debugName: "hoursLabel" }] : []));
     /** Accessible name of the minutes field (forwarded to the calendar). */
     minutesLabel = input('Minutes', ...(ngDevMode ? [{ debugName: "minutesLabel" }] : []));
     /** Visible text of the calendar's "done" action, shown in the overlay when {@link showTime}. */
-    doneLabel = input('Terminé', ...(ngDevMode ? [{ debugName: "doneLabel" }] : []));
+    doneLabel = input('Done', ...(ngDevMode ? [{ debugName: "doneLabel" }] : []));
     /**
-     * Accessible name for the clear button. French default so existing consumers are unchanged, but an
-     * app serving more than one language MUST translate it — it is an icon-only control, so this string
-     * is its only name.
+     * Accessible name for the clear button. English default; an app serving more than one language MUST
+     * translate it — it is an icon-only control, so this string is its only name.
      */
-    clearLabel = input('Effacer la date', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    clearLabel = input('Clear date', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
     /**
      * Accessible name for the icon-only calendar toggle while the panel is CLOSED. See
      * {@link clearLabel} for why this has to be translatable.
      */
-    openCalendarLabel = input('Ouvrir le calendrier', ...(ngDevMode ? [{ debugName: "openCalendarLabel" }] : []));
+    openCalendarLabel = input('Open calendar', ...(ngDevMode ? [{ debugName: "openCalendarLabel" }] : []));
     /** Accessible name for the calendar toggle while the panel is OPEN. See {@link openCalendarLabel}. */
-    closeCalendarLabel = input('Fermer le calendrier', ...(ngDevMode ? [{ debugName: "closeCalendarLabel" }] : []));
+    closeCalendarLabel = input('Close calendar', ...(ngDevMode ? [{ debugName: "closeCalendarLabel" }] : []));
     /** Accessible name for the overlay dialog that holds the calendar. */
-    panelLabel = input('Sélection de date', ...(ngDevMode ? [{ debugName: "panelLabel" }] : []));
+    panelLabel = input('Choose a date', ...(ngDevMode ? [{ debugName: "panelLabel" }] : []));
     /**
      * Labels forwarded to the embedded <sds-calendar>. They live here because the picker is how the
      * calendar is normally reached — without forwarding, a consumer could translate the field but not
      * the panel it opens. Defaults match SdsCalendar's own, so nothing changes for existing consumers.
      */
-    calendarLabel = input('Calendrier', ...(ngDevMode ? [{ debugName: "calendarLabel" }] : []));
-    previousLabel = input('Précédent', ...(ngDevMode ? [{ debugName: "previousLabel" }] : []));
-    nextLabel = input('Suivant', ...(ngDevMode ? [{ debugName: "nextLabel" }] : []));
-    todayActionLabel = input("Aujourd'hui", ...(ngDevMode ? [{ debugName: "todayActionLabel" }] : []));
-    clearActionLabel = input('Effacer', ...(ngDevMode ? [{ debugName: "clearActionLabel" }] : []));
+    calendarLabel = input('Calendar', ...(ngDevMode ? [{ debugName: "calendarLabel" }] : []));
+    previousLabel = input('Previous', ...(ngDevMode ? [{ debugName: "previousLabel" }] : []));
+    nextLabel = input('Next', ...(ngDevMode ? [{ debugName: "nextLabel" }] : []));
+    todayActionLabel = input('Today', ...(ngDevMode ? [{ debugName: "todayActionLabel" }] : []));
+    clearActionLabel = input('Clear', ...(ngDevMode ? [{ debugName: "clearActionLabel" }] : []));
     value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
     open = signal(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
     cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "cvaDisabled" }] : []));
@@ -7705,7 +7984,7 @@ let nextId$6 = 0;
  *
  * @example
  * <sds-select [options]="services" optionLabel="name" optionValue="id"
- *            placeholder="Choisir un service" [(ngModel)]="serviceId" filter clearable />
+ *            placeholder="Choose a service" [(ngModel)]="serviceId" filter clearable />
  *
  * @example
  * <sds-select [options]="categories" optionLabel="name" optionValue="id" [(ngModel)]="categoryId">
@@ -7725,7 +8004,7 @@ class SdsSelect {
     optionDisabled = input('disabled', ...(ngDevMode ? [{ debugName: "optionDisabled" }] : []));
     /** Key used to compare object values for selection equality. */
     dataKey = input('', ...(ngDevMode ? [{ debugName: "dataKey" }] : []));
-    placeholder = input('Sélectionner…', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    placeholder = input('Select…', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
     ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
     hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : []));
@@ -7735,8 +8014,15 @@ class SdsSelect {
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     clearable = input(false, ...(ngDevMode ? [{ debugName: "clearable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     filter = input(false, ...(ngDevMode ? [{ debugName: "filter", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
-    filterPlaceholder = input('Rechercher…', ...(ngDevMode ? [{ debugName: "filterPlaceholder" }] : []));
-    emptyMessage = input('Aucun résultat', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    filterPlaceholder = input('Search…', ...(ngDevMode ? [{ debugName: "filterPlaceholder" }] : []));
+    emptyMessage = input('No results', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    /**
+     * Accessible name of the icon-only clear button (see {@link clearable}). English default; an app
+     * serving more than one language passes a translated value — it is the button's only name.
+     */
+    clearLabel = input('Clear selection', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    /** Accessible name of the filter field inside the panel (see {@link filter}). */
+    filterLabel = input('Search', ...(ngDevMode ? [{ debugName: "filterLabel" }] : []));
     /** Optional projected `<ng-template sdsSelectOption>` — custom option + selected-value rendering. */
     optionTpl = contentChild(SdsSelectOption, ...(ngDevMode ? [{ debugName: "optionTpl" }] : []));
     /** Optional projected `<ng-template sdsSelectEmpty>` — custom no-results content. */
@@ -8092,7 +8378,7 @@ class SdsSelect {
             this.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsSelect, isStandalone: true, selector: "sds-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, optionDisabled: { classPropertyName: "optionDisabled", publicName: "optionDisabled", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "block" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsSelect, isStandalone: true, selector: "sds-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, optionDisabled: { classPropertyName: "optionDisabled", publicName: "optionDisabled", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, filterLabel: { classPropertyName: "filterLabel", publicName: "filterLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "block" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SdsSelect), multi: true },
         ], queries: [{ propertyName: "optionTpl", first: true, predicate: SdsSelectOption, descendants: true, isSignal: true }, { propertyName: "emptyTpl", first: true, predicate: SdsSelectEmpty, descendants: true, isSignal: true }, { propertyName: "footerTpl", first: true, predicate: SdsSelectFooter, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @if (label()) {
@@ -8137,7 +8423,7 @@ class SdsSelect {
           <button
             type="button"
             tabindex="-1"
-            aria-label="Effacer la sélection"
+            [attr.aria-label]="clearLabel()"
             class="mr-1 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full text-ink-faint hover:bg-black/5 hover:text-ink-soft"
             (click)="clear($event)"
           >
@@ -8170,7 +8456,7 @@ class SdsSelect {
                   [value]="filterText()"
                   (input)="onFilter($event)"
                   (keydown)="onFilterKeydown($event)"
-                  aria-label="Rechercher"
+                  [attr.aria-label]="filterLabel()"
                   class="h-9 w-full bg-transparent pl-8 pr-2 text-sm text-ink outline-none placeholder:text-ink-faint"
                 />
               </div>
@@ -8293,7 +8579,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           <button
             type="button"
             tabindex="-1"
-            aria-label="Effacer la sélection"
+            [attr.aria-label]="clearLabel()"
             class="mr-1 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full text-ink-faint hover:bg-black/5 hover:text-ink-soft"
             (click)="clear($event)"
           >
@@ -8326,7 +8612,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                   [value]="filterText()"
                   (input)="onFilter($event)"
                   (keydown)="onFilterKeydown($event)"
-                  aria-label="Rechercher"
+                  [attr.aria-label]="filterLabel()"
                   class="h-9 w-full bg-transparent pl-8 pr-2 text-sm text-ink outline-none placeholder:text-ink-faint"
                 />
               </div>
@@ -8393,7 +8679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     }
   `,
                 }]
-        }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: false }] }], optionValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionValue", required: false }] }], optionDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionDisabled", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceholder", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], optionTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectOption), { isSignal: true }] }], emptyTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectEmpty), { isSignal: true }] }], footerTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectFooter), { isSignal: true }] }], trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }] } });
+        }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: false }] }], optionValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionValue", required: false }] }], optionDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionDisabled", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceholder", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], filterLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterLabel", required: false }] }], optionTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectOption), { isSignal: true }] }], emptyTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectEmpty), { isSignal: true }] }], footerTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectFooter), { isSignal: true }] }], trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }] } });
 
 const SIZES$3 = {
     sm: 'min-h-9 text-sm',
@@ -8440,7 +8726,7 @@ class SdsMultiSelect {
     optionValue = input('', ...(ngDevMode ? [{ debugName: "optionValue" }] : []));
     optionDisabled = input('disabled', ...(ngDevMode ? [{ debugName: "optionDisabled" }] : []));
     dataKey = input('', ...(ngDevMode ? [{ debugName: "dataKey" }] : []));
-    placeholder = input('Sélectionner…', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    placeholder = input('Select…', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
     ariaLabel = input('', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
     hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : []));
@@ -8449,13 +8735,24 @@ class SdsMultiSelect {
     display = input('comma', ...(ngDevMode ? [{ debugName: "display" }] : []));
     /** In comma mode, show a count label once more than this many are selected. */
     maxSelectedLabels = input(3, ...(ngDevMode ? [{ debugName: "maxSelectedLabels", transform: numberAttribute }] : [{ transform: numberAttribute }]));
-    selectedItemsLabel = input('{0} éléments sélectionnés', ...(ngDevMode ? [{ debugName: "selectedItemsLabel" }] : []));
+    selectedItemsLabel = input('{0} items selected', ...(ngDevMode ? [{ debugName: "selectedItemsLabel" }] : []));
     showToggleAll = input(true, ...(ngDevMode ? [{ debugName: "showToggleAll", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     clearable = input(false, ...(ngDevMode ? [{ debugName: "clearable", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     filter = input(false, ...(ngDevMode ? [{ debugName: "filter", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
-    filterPlaceholder = input('Rechercher…', ...(ngDevMode ? [{ debugName: "filterPlaceholder" }] : []));
-    emptyMessage = input('Aucun résultat', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    filterPlaceholder = input('Search…', ...(ngDevMode ? [{ debugName: "filterPlaceholder" }] : []));
+    emptyMessage = input('No results', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    /**
+     * Accessible name of a chip's icon-only remove button (`display="chip"`); `{label}` is the option's
+     * label. English defaults throughout — an app serving more than one language passes translations.
+     */
+    removeLabel = input('Remove {label}', ...(ngDevMode ? [{ debugName: "removeLabel" }] : []));
+    /** Accessible name of the icon-only clear-all button (see {@link clearable}). */
+    clearLabel = input('Clear all', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    /** Accessible name of the filter field inside the panel (see {@link filter}). */
+    filterLabel = input('Search', ...(ngDevMode ? [{ debugName: "filterLabel" }] : []));
+    /** Visible text of the "select all" row (see {@link showToggleAll}). */
+    selectAllLabel = input('Select all', ...(ngDevMode ? [{ debugName: "selectAllLabel" }] : []));
     /** Optional projected `<ng-template sdsSelectOption>` — custom option-row rendering. */
     optionTpl = contentChild(SdsSelectOption, ...(ngDevMode ? [{ debugName: "optionTpl" }] : []));
     /** Optional projected `<ng-template sdsSelectEmpty>` — custom no-results content. */
@@ -8855,7 +9152,7 @@ class SdsMultiSelect {
             this.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsMultiSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsMultiSelect, isStandalone: true, selector: "sds-multi-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, optionDisabled: { classPropertyName: "optionDisabled", publicName: "optionDisabled", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedLabels: { classPropertyName: "maxSelectedLabels", publicName: "maxSelectedLabels", isSignal: true, isRequired: false, transformFunction: null }, selectedItemsLabel: { classPropertyName: "selectedItemsLabel", publicName: "selectedItemsLabel", isSignal: true, isRequired: false, transformFunction: null }, showToggleAll: { classPropertyName: "showToggleAll", publicName: "showToggleAll", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "block" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsMultiSelect, isStandalone: true, selector: "sds-multi-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, optionDisabled: { classPropertyName: "optionDisabled", publicName: "optionDisabled", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedLabels: { classPropertyName: "maxSelectedLabels", publicName: "maxSelectedLabels", isSignal: true, isRequired: false, transformFunction: null }, selectedItemsLabel: { classPropertyName: "selectedItemsLabel", publicName: "selectedItemsLabel", isSignal: true, isRequired: false, transformFunction: null }, showToggleAll: { classPropertyName: "showToggleAll", publicName: "showToggleAll", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceholder: { classPropertyName: "filterPlaceholder", publicName: "filterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, removeLabel: { classPropertyName: "removeLabel", publicName: "removeLabel", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, filterLabel: { classPropertyName: "filterLabel", publicName: "filterLabel", isSignal: true, isRequired: false, transformFunction: null }, selectAllLabel: { classPropertyName: "selectAllLabel", publicName: "selectAllLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "block" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SdsMultiSelect), multi: true },
         ], queries: [{ propertyName: "optionTpl", first: true, predicate: SdsSelectOption, descendants: true, isSignal: true }, { propertyName: "emptyTpl", first: true, predicate: SdsSelectEmpty, descendants: true, isSignal: true }, { propertyName: "footerTpl", first: true, predicate: SdsSelectFooter, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: `
     @if (label()) {
@@ -8888,7 +9185,7 @@ class SdsMultiSelect {
                 <button
                   type="button"
                   tabindex="-1"
-                  [attr.aria-label]="'Retirer ' + opt.label"
+                  [attr.aria-label]="removeLabel().replace('{label}', opt.label)"
                   class="inline-flex h-4 w-4 items-center justify-center rounded-full hover:bg-brand-100"
                   (click)="removeChip($event, opt)"
                 >
@@ -8910,7 +9207,7 @@ class SdsMultiSelect {
           <button
             type="button"
             tabindex="-1"
-            aria-label="Tout effacer"
+            [attr.aria-label]="clearLabel()"
             class="mr-1 inline-flex h-6 w-6 shrink-0 items-center justify-center self-center rounded-full text-ink-faint hover:bg-black/5 hover:text-ink-soft"
             (click)="clear($event)"
           >
@@ -8943,7 +9240,7 @@ class SdsMultiSelect {
                   [value]="filterText()"
                   (input)="onFilter($event)"
                   (keydown)="onFilterKeydown($event)"
-                  aria-label="Rechercher"
+                  [attr.aria-label]="filterLabel()"
                   class="h-9 w-full bg-transparent pl-8 pr-2 text-sm text-ink outline-none placeholder:text-ink-faint"
                 />
               </div>
@@ -8969,7 +9266,7 @@ class SdsMultiSelect {
                   <span class="h-0.5 w-2.5 rounded-full bg-white"></span>
                 }
               </span>
-              Tout sélectionner
+              {{ selectAllLabel() }}
             </button>
           }
 
@@ -9079,7 +9376,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 <button
                   type="button"
                   tabindex="-1"
-                  [attr.aria-label]="'Retirer ' + opt.label"
+                  [attr.aria-label]="removeLabel().replace('{label}', opt.label)"
                   class="inline-flex h-4 w-4 items-center justify-center rounded-full hover:bg-brand-100"
                   (click)="removeChip($event, opt)"
                 >
@@ -9101,7 +9398,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
           <button
             type="button"
             tabindex="-1"
-            aria-label="Tout effacer"
+            [attr.aria-label]="clearLabel()"
             class="mr-1 inline-flex h-6 w-6 shrink-0 items-center justify-center self-center rounded-full text-ink-faint hover:bg-black/5 hover:text-ink-soft"
             (click)="clear($event)"
           >
@@ -9134,7 +9431,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                   [value]="filterText()"
                   (input)="onFilter($event)"
                   (keydown)="onFilterKeydown($event)"
-                  aria-label="Rechercher"
+                  [attr.aria-label]="filterLabel()"
                   class="h-9 w-full bg-transparent pl-8 pr-2 text-sm text-ink outline-none placeholder:text-ink-faint"
                 />
               </div>
@@ -9160,7 +9457,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                   <span class="h-0.5 w-2.5 rounded-full bg-white"></span>
                 }
               </span>
-              Tout sélectionner
+              {{ selectAllLabel() }}
             </button>
           }
 
@@ -9226,29 +9523,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     }
   `,
                 }]
-        }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: false }] }], optionValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionValue", required: false }] }], optionDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionDisabled", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], maxSelectedLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedLabels", required: false }] }], selectedItemsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItemsLabel", required: false }] }], showToggleAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToggleAll", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceholder", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], optionTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectOption), { isSignal: true }] }], emptyTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectEmpty), { isSignal: true }] }], footerTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectFooter), { isSignal: true }] }], trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }] } });
+        }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: false }] }], optionValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionValue", required: false }] }], optionDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionDisabled", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], maxSelectedLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedLabels", required: false }] }], selectedItemsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItemsLabel", required: false }] }], showToggleAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "showToggleAll", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceholder", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], removeLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "removeLabel", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], filterLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterLabel", required: false }] }], selectAllLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllLabel", required: false }] }], optionTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectOption), { isSignal: true }] }], emptyTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectEmpty), { isSignal: true }] }], footerTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsSelectFooter), { isSignal: true }] }], trigger: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }] } });
 
 const SDS_PHONE_COUNTRIES = [
-    { iso2: 'BE', name: 'Belgique', dialCode: '32', lengths: [9], format: '### ## ## ##', example: '470123456' },
+    { iso2: 'BE', name: 'Belgium', dialCode: '32', lengths: [9], format: '### ## ## ##', example: '470123456' },
     { iso2: 'FR', name: 'France', dialCode: '33', lengths: [9], format: '# ## ## ## ##', example: '612345678' },
     { iso2: 'LU', name: 'Luxembourg', dialCode: '352', lengths: [9, 8, 6], format: '### ### ###', example: '628123456' },
-    { iso2: 'NL', name: 'Pays-Bas', dialCode: '31', lengths: [9], format: '# ## ## ## ##', example: '612345678' },
-    { iso2: 'DE', name: 'Allemagne', dialCode: '49', lengths: [10, 11], format: '#### #######', example: '15123456789' },
-    { iso2: 'GB', name: 'Royaume-Uni', dialCode: '44', lengths: [10], format: '#### ######', example: '7400123456' },
-    { iso2: 'IE', name: 'Irlande', dialCode: '353', lengths: [9], format: '## ### ####', example: '850123456' },
-    { iso2: 'CH', name: 'Suisse', dialCode: '41', lengths: [9], format: '## ### ## ##', example: '781234567' },
-    { iso2: 'ES', name: 'Espagne', dialCode: '34', lengths: [9], format: '### ## ## ##', example: '612345678' },
-    { iso2: 'IT', name: 'Italie', dialCode: '39', lengths: [9, 10], format: '### ### ####', example: '3123456789' },
+    { iso2: 'NL', name: 'Netherlands', dialCode: '31', lengths: [9], format: '# ## ## ## ##', example: '612345678' },
+    { iso2: 'DE', name: 'Germany', dialCode: '49', lengths: [10, 11], format: '#### #######', example: '15123456789' },
+    { iso2: 'GB', name: 'United Kingdom', dialCode: '44', lengths: [10], format: '#### ######', example: '7400123456' },
+    { iso2: 'IE', name: 'Ireland', dialCode: '353', lengths: [9], format: '## ### ####', example: '850123456' },
+    { iso2: 'CH', name: 'Switzerland', dialCode: '41', lengths: [9], format: '## ### ## ##', example: '781234567' },
+    { iso2: 'ES', name: 'Spain', dialCode: '34', lengths: [9], format: '### ## ## ##', example: '612345678' },
+    { iso2: 'IT', name: 'Italy', dialCode: '39', lengths: [9, 10], format: '### ### ####', example: '3123456789' },
     { iso2: 'PT', name: 'Portugal', dialCode: '351', lengths: [9], format: '### ### ###', example: '912345678' },
-    { iso2: 'AT', name: 'Autriche', dialCode: '43', lengths: [10, 11], format: '### #######', example: '6641234567' },
-    { iso2: 'DK', name: 'Danemark', dialCode: '45', lengths: [8], format: '## ## ## ##', example: '20123456' },
-    { iso2: 'SE', name: 'Suède', dialCode: '46', lengths: [9], format: '## ### ## ##', example: '701234567' },
-    { iso2: 'NO', name: 'Norvège', dialCode: '47', lengths: [8], format: '### ## ###', example: '40612345' },
-    { iso2: 'PL', name: 'Pologne', dialCode: '48', lengths: [9], format: '### ### ###', example: '512345678' },
-    { iso2: 'US', name: 'États-Unis', dialCode: '1', lengths: [10], format: '(###) ###-####', example: '2015550123' },
+    { iso2: 'AT', name: 'Austria', dialCode: '43', lengths: [10, 11], format: '### #######', example: '6641234567' },
+    { iso2: 'DK', name: 'Denmark', dialCode: '45', lengths: [8], format: '## ## ## ##', example: '20123456' },
+    { iso2: 'SE', name: 'Sweden', dialCode: '46', lengths: [9], format: '## ### ## ##', example: '701234567' },
+    { iso2: 'NO', name: 'Norway', dialCode: '47', lengths: [8], format: '### ## ###', example: '40612345' },
+    { iso2: 'PL', name: 'Poland', dialCode: '48', lengths: [9], format: '### ### ###', example: '512345678' },
+    { iso2: 'US', name: 'United States', dialCode: '1', lengths: [10], format: '(###) ###-####', example: '2015550123' },
     { iso2: 'CA', name: 'Canada', dialCode: '1', lengths: [10], format: '(###) ###-####', example: '2042345678' },
-    { iso2: 'MA', name: 'Maroc', dialCode: '212', lengths: [9], format: '### ## ## ##', example: '612345678' },
-    { iso2: 'TR', name: 'Turquie', dialCode: '90', lengths: [10], format: '### ### ## ##', example: '5012345678' },
+    { iso2: 'MA', name: 'Morocco', dialCode: '212', lengths: [9], format: '### ## ## ##', example: '612345678' },
+    { iso2: 'TR', name: 'Turkey', dialCode: '90', lengths: [10], format: '### ### ## ##', example: '5012345678' },
 ];
 /** Reduce raw input to national-significant digits (drops non-digits & leading trunk zeros). */
 function sdsNormalizeSignificant(raw) {
@@ -9303,7 +9600,7 @@ let nextId$4 = 0;
  * '+32470123456') and Validator (national length is checked per country).
  *
  * @example
- * <sds-phone-input label="Téléphone" defaultCountry="BE"
+ * <sds-phone-input label="Phone" defaultCountry="BE"
  *                 [preferredCountries]="['BE','FR','LU']"
  *                 [(ngModel)]="phone" required />
  */
@@ -9328,43 +9625,67 @@ class SdsPhoneInput {
     onlyCountries = input([], ...(ngDevMode ? [{ debugName: "onlyCountries" }] : []));
     /** Show an example number as a hint when no [hint] is provided. */
     showExampleHint = input(true, ...(ngDevMode ? [{ debugName: "showExampleHint", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
-    requiredMessage = input('Numéro de téléphone requis', ...(ngDevMode ? [{ debugName: "requiredMessage" }] : []));
+    /**
+     * BCP 47 locale for the country names (list, search and the selector's accessible name), resolved
+     * with `Intl.DisplayNames` — e.g. `nl-BE` shows "België". Empty (default) uses the built-in English
+     * names. The search also matches the English name.
+     */
+    locale = input('', ...(ngDevMode ? [{ debugName: "locale" }] : []));
+    requiredMessage = input('Phone number required', ...(ngDevMode ? [{ debugName: "requiredMessage" }] : []));
     /**
      * Accessible name of the country selector. `{country}` is replaced with the selected country's
-     * name. A token rather than a prefix because word order differs per language. French default so
-     * existing consumers are unchanged; translate it in any app serving more than one language.
-     *
-     * Note the interpolated country NAME still comes from the library's built-in country table, which
-     * is French-only — translating this template fixes the wrapper, not the name inside it.
+     * name (localised by {@link locale}). A token rather than a prefix because word order differs per
+     * language. English default; translate it in any app serving more than one language.
      */
-    countryLabel = input('Indicatif pays : {country}', ...(ngDevMode ? [{ debugName: "countryLabel" }] : []));
+    countryLabel = input('Country code: {country}', ...(ngDevMode ? [{ debugName: "countryLabel" }] : []));
     /**
      * Accessible name for the clear button. It is icon-only, so this string is its ONLY accessible
-     * name — a hardcoded French one is simply wrong in every other locale.
+     * name — translate it in any app serving more than one language.
      */
-    clearLabel = input('Effacer', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    clearLabel = input('Clear', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
     /** Accessible name for the country-search field inside the dropdown. */
-    searchLabel = input('Rechercher un pays', ...(ngDevMode ? [{ debugName: "searchLabel" }] : []));
+    searchLabel = input('Search countries', ...(ngDevMode ? [{ debugName: "searchLabel" }] : []));
     /** Placeholder text of the country-search field. */
-    searchPlaceholder = input('Rechercher un pays…', ...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : []));
+    searchPlaceholder = input('Search countries…', ...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : []));
     /** Shown in place of the list when no country matches the filter. */
-    noResultsLabel = input('Aucun pays', ...(ngDevMode ? [{ debugName: "noResultsLabel" }] : []));
+    noResultsLabel = input('No countries found', ...(ngDevMode ? [{ debugName: "noResultsLabel" }] : []));
     /**
      * Built-in validation messages. `{lengths}` is replaced with the country's accepted national
-     * lengths, joined with {@link lengthSeparator}. Siblings of {@link requiredMessage}, which was
-     * already translatable — these two were not, so an English or Dutch app showed French errors.
+     * lengths, joined with {@link lengthSeparator}. English defaults; translate them alongside
+     * {@link requiredMessage}.
      */
-    incompleteMessage = input('Numéro incomplet — {lengths} chiffres attendus', ...(ngDevMode ? [{ debugName: "incompleteMessage" }] : []));
-    invalidMessage = input('Numéro invalide — {lengths} chiffres attendus', ...(ngDevMode ? [{ debugName: "invalidMessage" }] : []));
-    /** Joins the accepted lengths when a country allows more than one (e.g. "8 ou 9"). */
-    lengthSeparator = input(' ou ', ...(ngDevMode ? [{ debugName: "lengthSeparator" }] : []));
+    incompleteMessage = input('Incomplete number — {lengths} digits expected', ...(ngDevMode ? [{ debugName: "incompleteMessage" }] : []));
+    invalidMessage = input('Invalid number — {lengths} digits expected', ...(ngDevMode ? [{ debugName: "invalidMessage" }] : []));
+    /** Joins the accepted lengths when a country allows more than one (e.g. "8 or 9"). */
+    lengthSeparator = input(' or ', ...(ngDevMode ? [{ debugName: "lengthSeparator" }] : []));
     /**
      * Auto-generated example hint (see {@link showExampleHint}). `{number}` is replaced with the
      * formatted international example number.
      */
-    exampleHintTemplate = input('Ex. {number}', ...(ngDevMode ? [{ debugName: "exampleHintTemplate" }] : []));
+    exampleHintTemplate = input('e.g. {number}', ...(ngDevMode ? [{ debugName: "exampleHintTemplate" }] : []));
     /** Emitted with the parsed parts whenever the number or country changes. */
     phoneChange = output();
+    /** `Intl.DisplayNames` for {@link locale}, or null (built-in English names). */
+    regionNames = computed(() => {
+        const locale = this.locale();
+        if (!locale || typeof Intl === 'undefined' || !('DisplayNames' in Intl))
+            return null;
+        try {
+            return new Intl.DisplayNames([locale], { type: 'region' });
+        }
+        catch {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "regionNames" }] : []));
+    /** The country's display name in {@link locale}, falling back to the built-in English name. */
+    countryName(c) {
+        try {
+            return this.regionNames()?.of(c.iso2) ?? c.name;
+        }
+        catch {
+            return c.name;
+        }
+    }
     national = signal('', ...(ngDevMode ? [{ debugName: "national" }] : []));
     countryIso = signal('', ...(ngDevMode ? [{ debugName: "countryIso" }] : []));
     open = signal(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
@@ -9403,7 +9724,8 @@ class SdsPhoneInput {
         const all = this.availableCountries();
         if (!f)
             return all;
-        return all.filter((c) => c.name.toLowerCase().includes(f) ||
+        return all.filter((c) => this.countryName(c).toLowerCase().includes(f) ||
+            c.name.toLowerCase().includes(f) ||
             c.iso2.toLowerCase().includes(f) ||
             c.dialCode.includes(f.replace('+', '')));
     }, ...(ngDevMode ? [{ debugName: "filteredCountries" }] : []));
@@ -9416,7 +9738,7 @@ class SdsPhoneInput {
         const number = `+${c.dialCode} ${sdsFormatNational(c.example, c.format)}`;
         return this.exampleHintTemplate().replace('{number}', number);
     }, ...(ngDevMode ? [{ debugName: "autoHint" }] : []));
-    countryAriaLabel = computed(() => this.countryLabel().replace('{country}', this.country().name), ...(ngDevMode ? [{ debugName: "countryAriaLabel" }] : []));
+    countryAriaLabel = computed(() => this.countryLabel().replace('{country}', this.countryName(this.country())), ...(ngDevMode ? [{ debugName: "countryAriaLabel" }] : []));
     e164 = computed(() => {
         const d = this.national();
         return d ? `+${this.country().dialCode}${d}` : '';
@@ -9732,7 +10054,7 @@ class SdsPhoneInput {
         this.onValidatorChange = fn;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsPhoneInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsPhoneInput, isStandalone: true, selector: "sds-phone-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, defaultCountry: { classPropertyName: "defaultCountry", publicName: "defaultCountry", isSignal: true, isRequired: false, transformFunction: null }, preferredCountries: { classPropertyName: "preferredCountries", publicName: "preferredCountries", isSignal: true, isRequired: false, transformFunction: null }, onlyCountries: { classPropertyName: "onlyCountries", publicName: "onlyCountries", isSignal: true, isRequired: false, transformFunction: null }, showExampleHint: { classPropertyName: "showExampleHint", publicName: "showExampleHint", isSignal: true, isRequired: false, transformFunction: null }, requiredMessage: { classPropertyName: "requiredMessage", publicName: "requiredMessage", isSignal: true, isRequired: false, transformFunction: null }, countryLabel: { classPropertyName: "countryLabel", publicName: "countryLabel", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, searchLabel: { classPropertyName: "searchLabel", publicName: "searchLabel", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, noResultsLabel: { classPropertyName: "noResultsLabel", publicName: "noResultsLabel", isSignal: true, isRequired: false, transformFunction: null }, incompleteMessage: { classPropertyName: "incompleteMessage", publicName: "incompleteMessage", isSignal: true, isRequired: false, transformFunction: null }, invalidMessage: { classPropertyName: "invalidMessage", publicName: "invalidMessage", isSignal: true, isRequired: false, transformFunction: null }, lengthSeparator: { classPropertyName: "lengthSeparator", publicName: "lengthSeparator", isSignal: true, isRequired: false, transformFunction: null }, exampleHintTemplate: { classPropertyName: "exampleHintTemplate", publicName: "exampleHintTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { phoneChange: "phoneChange" }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "block" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsPhoneInput, isStandalone: true, selector: "sds-phone-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, defaultCountry: { classPropertyName: "defaultCountry", publicName: "defaultCountry", isSignal: true, isRequired: false, transformFunction: null }, preferredCountries: { classPropertyName: "preferredCountries", publicName: "preferredCountries", isSignal: true, isRequired: false, transformFunction: null }, onlyCountries: { classPropertyName: "onlyCountries", publicName: "onlyCountries", isSignal: true, isRequired: false, transformFunction: null }, showExampleHint: { classPropertyName: "showExampleHint", publicName: "showExampleHint", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, requiredMessage: { classPropertyName: "requiredMessage", publicName: "requiredMessage", isSignal: true, isRequired: false, transformFunction: null }, countryLabel: { classPropertyName: "countryLabel", publicName: "countryLabel", isSignal: true, isRequired: false, transformFunction: null }, clearLabel: { classPropertyName: "clearLabel", publicName: "clearLabel", isSignal: true, isRequired: false, transformFunction: null }, searchLabel: { classPropertyName: "searchLabel", publicName: "searchLabel", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, noResultsLabel: { classPropertyName: "noResultsLabel", publicName: "noResultsLabel", isSignal: true, isRequired: false, transformFunction: null }, incompleteMessage: { classPropertyName: "incompleteMessage", publicName: "incompleteMessage", isSignal: true, isRequired: false, transformFunction: null }, invalidMessage: { classPropertyName: "invalidMessage", publicName: "invalidMessage", isSignal: true, isRequired: false, transformFunction: null }, lengthSeparator: { classPropertyName: "lengthSeparator", publicName: "lengthSeparator", isSignal: true, isRequired: false, transformFunction: null }, exampleHintTemplate: { classPropertyName: "exampleHintTemplate", publicName: "exampleHintTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { phoneChange: "phoneChange" }, host: { listeners: { "document:click": "onDocumentClick($event)" }, classAttribute: "block" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SdsPhoneInput), multi: true },
             { provide: NG_VALIDATORS, useExisting: forwardRef(() => SdsPhoneInput), multi: true },
         ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, isSignal: true }, { propertyName: "field", first: true, predicate: ["field"], descendants: true, isSignal: true }], ngImport: i0, template: `
@@ -9841,7 +10163,7 @@ class SdsPhoneInput {
               <span class="grid h-5 min-w-7 place-items-center rounded bg-muted px-1 text-[11px] font-semibold tracking-wide text-ink-soft">
                 {{ c.iso2 }}
               </span>
-              <span class="flex-1 truncate">{{ c.name }}</span>
+              <span class="flex-1 truncate">{{ countryName(c) }}</span>
               <span class="text-ink-faint">+{{ c.dialCode }}</span>
             </li>
           } @empty {
@@ -9982,7 +10304,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
               <span class="grid h-5 min-w-7 place-items-center rounded bg-muted px-1 text-[11px] font-semibold tracking-wide text-ink-soft">
                 {{ c.iso2 }}
               </span>
-              <span class="flex-1 truncate">{{ c.name }}</span>
+              <span class="flex-1 truncate">{{ countryName(c) }}</span>
               <span class="text-ink-faint">+{{ c.dialCode }}</span>
             </li>
           } @empty {
@@ -10003,7 +10325,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     }
   `,
                 }]
-        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], defaultCountry: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultCountry", required: false }] }], preferredCountries: [{ type: i0.Input, args: [{ isSignal: true, alias: "preferredCountries", required: false }] }], onlyCountries: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyCountries", required: false }] }], showExampleHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExampleHint", required: false }] }], requiredMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredMessage", required: false }] }], countryLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "countryLabel", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], searchLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchLabel", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], noResultsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsLabel", required: false }] }], incompleteMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "incompleteMessage", required: false }] }], invalidMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalidMessage", required: false }] }], lengthSeparator: [{ type: i0.Input, args: [{ isSignal: true, alias: "lengthSeparator", required: false }] }], exampleHintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "exampleHintTemplate", required: false }] }], phoneChange: [{ type: i0.Output, args: ["phoneChange"] }], anchor: [{ type: i0.ViewChild, args: ['anchor', { isSignal: true }] }], field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], defaultCountry: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultCountry", required: false }] }], preferredCountries: [{ type: i0.Input, args: [{ isSignal: true, alias: "preferredCountries", required: false }] }], onlyCountries: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyCountries", required: false }] }], showExampleHint: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExampleHint", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], requiredMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredMessage", required: false }] }], countryLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "countryLabel", required: false }] }], clearLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearLabel", required: false }] }], searchLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchLabel", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], noResultsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsLabel", required: false }] }], incompleteMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "incompleteMessage", required: false }] }], invalidMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalidMessage", required: false }] }], lengthSeparator: [{ type: i0.Input, args: [{ isSignal: true, alias: "lengthSeparator", required: false }] }], exampleHintTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "exampleHintTemplate", required: false }] }], phoneChange: [{ type: i0.Output, args: ["phoneChange"] }], anchor: [{ type: i0.ViewChild, args: ['anchor', { isSignal: true }] }], field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
 
 const SIZES$1 = {
     sm: 'h-8 min-w-8 text-xs',
@@ -10279,7 +10601,7 @@ class SdsPaginator {
         </label>
       }
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SdsIcon, selector: "sds-icon", inputs: ["name", "size", "strokeWidth"] }, { kind: "component", type: SdsSelect, selector: "sds-select", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "dataKey", "placeholder", "label", "ariaLabel", "hint", "error", "size", "appearance", "disabled", "clearable", "filter", "filterPlaceholder", "emptyMessage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SdsIcon, selector: "sds-icon", inputs: ["name", "size", "strokeWidth"] }, { kind: "component", type: SdsSelect, selector: "sds-select", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "dataKey", "placeholder", "label", "ariaLabel", "hint", "error", "size", "appearance", "disabled", "clearable", "filter", "filterPlaceholder", "emptyMessage", "clearLabel", "filterLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsPaginator, decorators: [{
             type: Component,
@@ -10451,7 +10773,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * @example
  * <sds-tabs [(value)]="active">
  *   <sds-tab-list>
- *     <sds-tab value="0">Détails</sds-tab>
+ *     <sds-tab value="0">Details</sds-tab>
  *     <sds-tab value="1">Historique</sds-tab>
  *   </sds-tab-list>
  *   <sds-tab-panels>
@@ -10968,8 +11290,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  *
  * @example
  * <sds-table [value]="rows" [columns]="cols">
- *   <ng-template sdsCell="statut" let-value let-row="row">
- *     <sds-badge [variant]="row.actif ? 'success' : 'neutral'">{{ value }}</sds-badge>
+ *   <ng-template sdsCell="status" let-value let-row="row">
+ *     <sds-badge [variant]="row.active ? 'success' : 'neutral'">{{ value }}</sds-badge>
  *   </ng-template>
  * </sds-table>
  */
@@ -10993,6 +11315,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 }]
         }], propDecorators: { column: [{ type: i0.Input, args: [{ isSignal: true, alias: "sdsCell", required: true }] }] } });
 
+/**
+ * Supplies a custom template for a column's header cell, matched by its field key. The template
+ * replaces the header's whole content — label and sort button — so it may hold its own controls
+ * (a column with a header template is not sortable from the header). Typical use: a "select all"
+ * checkbox above a checkbox column rendered with `sdsCell`.
+ *
+ * @example
+ * <sds-table [value]="rows" [columns]="cols" dataKey="id">
+ *   <ng-template sdsHeader="select" let-rows="rows">
+ *     <sds-checkbox ariaLabel="Select all rows" [ngModel]="allSelected(rows)"
+ *                   [indeterminate]="someSelected(rows)" (ngModelChange)="selectAll(rows, $event)" />
+ *   </ng-template>
+ *   <ng-template sdsCell="select" let-row="row">
+ *     <sds-checkbox [ariaLabel]="'Select ' + row.name" [ngModel]="isSelected(row)"
+ *                   (ngModelChange)="toggle(row, $event)" />
+ *   </ng-template>
+ * </sds-table>
+ */
+class SdsTableHeader {
+    /** The column `field` whose header this template renders. */
+    column = input.required(...(ngDevMode ? [{ debugName: "column", alias: 'sdsHeader' }] : [{ alias: 'sdsHeader' }]));
+    /** The wrapped template, rendered by the host table via ngTemplateOutlet. */
+    template = inject(TemplateRef);
+    /** Lets the compiler type-check `let-*` bindings against SdsTableHeaderContext. */
+    static ngTemplateContextGuard(_dir, _ctx) {
+        return true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsTableHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.25", type: SdsTableHeader, isStandalone: true, selector: "ng-template[sdsHeader]", inputs: { column: { classPropertyName: "column", publicName: "sdsHeader", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsTableHeader, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'ng-template[sdsHeader]',
+                    standalone: true,
+                }]
+        }], propDecorators: { column: [{ type: i0.Input, args: [{ isSignal: true, alias: "sdsHeader", required: true }] }] } });
+
 /**
  * Supplies the detail template rendered beneath an expanded row when the host
  * `<sds-table>` has `expandable`. Use as a structural template inside the table:
@@ -11000,7 +11360,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * @example
  * <sds-table [value]="rows" [columns]="cols" expandable>
  *   <ng-template sdsRowExpansion let-row>
- *     <div>Détails de {{ row.nom }}</div>
+ *     <div>Details of {{ row.name }}</div>
  *   </ng-template>
  * </sds-table>
  */
@@ -11050,6 +11410,11 @@ let nextId$1 = 0;
  *   across all pages**, not just the current page. Toggling it selects/clears
  *   every filtered row regardless of pagination (this is an intentional
  *   deviation from PrimeNG's per-page select-all).
+ * - **Custom headers:** `<ng-template sdsHeader="field">` replaces a column's header content (label and
+ *   sort button) — e.g. a "select all" checkbox above your own checkbox column. Its context carries the
+ *   filtered `rows` (all pages) and the displayed `pageRows` (see {@link SdsTableHeaderContext}).
+ * - **Labels:** every visible and spoken string is an input with an English default (paginator,
+ *   filter, selection, expansion, editor). An app serving more than one language passes translations.
  *
  * **Editable grid (opt-in).** Set `editable` and give columns an `editor` (`text` · `number` ·
  * `currency` · `select`). The table becomes an ARIA grid with one tab stop: arrow keys move between
@@ -11059,14 +11424,16 @@ let nextId$1 = 0;
  * commits. Each changed commit emits `(cellCommit)` — the host applies it to its data (the table never
  * mutates rows) — and marks the cell dirty until {@link clearDirty}. Errors from `[cellErrors]` show
  * under the cell with `aria-invalid`. Number/currency cells use sds-input-number (live, locale-aware
- * formatting: "11,9" → "€11.90"). Everything else — sort, paging, selection — is unchanged.
+ * formatting: "11,9" → "€11.90"; in a comma locale such as fr-BE or nl-BE a typed "." is taken as the
+ * decimal separator, so "12.50" → "12,50 €"). The `select` editor is a styled native select with the
+ * column header as its name. Everything else — sort, paging, selection — is unchanged.
  *
  * @example
  * <sds-table [value]="staff" [columns]="cols" dataKey="id"
  *           sortable paginator [rows]="10" globalFilter
  *           selectionMode="multiple" [(selection)]="selected">
- *   <ng-template sdsCell="statut" let-value let-row="row">
- *     <sds-badge [variant]="row.actif ? 'success' : 'neutral'">{{ value }}</sds-badge>
+ *   <ng-template sdsCell="status" let-value let-row="row">
+ *     <sds-badge [variant]="row.active ? 'success' : 'neutral'">{{ value }}</sds-badge>
  *   </ng-template>
  * </sds-table>
  *
@@ -11142,6 +11509,20 @@ class SdsTable {
     locale = input('', ...(ngDevMode ? [{ debugName: "locale" }] : []));
     /** Spoken marker of an edited (dirty) cell. */
     dirtyLabel = input('edited', ...(ngDevMode ? [{ debugName: "dirtyLabel" }] : []));
+    /** Empty choice of a `select` editor while the cell has no value (a column's `placeholder` wins). */
+    selectPlaceholder = input('Select…', ...(ngDevMode ? [{ debugName: "selectPlaceholder" }] : []));
+    /**
+     * Selection and expansion labels (English defaults; translate them in a multi-language app). The
+     * checkbox/radio and expander buttons are icon-only, so these strings are their only names.
+     */
+    selectAllLabel = input('Select all rows', ...(ngDevMode ? [{ debugName: "selectAllLabel" }] : []));
+    selectRowLabel = input('Select row', ...(ngDevMode ? [{ debugName: "selectRowLabel" }] : []));
+    /** Screen-reader name of the selection column's header in `single` mode. */
+    selectionColumnLabel = input('Selection', ...(ngDevMode ? [{ debugName: "selectionColumnLabel" }] : []));
+    /** Screen-reader name of the expander column's header (see {@link expandable}). */
+    expandColumnLabel = input('Details', ...(ngDevMode ? [{ debugName: "expandColumnLabel" }] : []));
+    expandRowLabel = input('Expand row', ...(ngDevMode ? [{ debugName: "expandRowLabel" }] : []));
+    collapseRowLabel = input('Collapse row', ...(ngDevMode ? [{ debugName: "collapseRowLabel" }] : []));
     // --- outputs --------------------------------------------------------------
     sortChange = output();
     pageChange = output();
@@ -11168,6 +11549,26 @@ class SdsTable {
     templateFor(field) {
         return this.templateMap().get(field) ?? null;
     }
+    // --- custom header templates ----------------------------------------------
+    headerTemplates = contentChildren(SdsTableHeader, ...(ngDevMode ? [{ debugName: "headerTemplates" }] : []));
+    headerTemplateMap = computed(() => {
+        const map = new Map();
+        for (const h of this.headerTemplates())
+            map.set(h.column(), h.template);
+        return map;
+    }, ...(ngDevMode ? [{ debugName: "headerTemplateMap" }] : []));
+    headerTemplateFor(field) {
+        return this.headerTemplateMap().get(field) ?? null;
+    }
+    headerContext(column, index) {
+        return {
+            $implicit: column,
+            column,
+            index,
+            rows: this.filtered(),
+            pageRows: this.displayRows(),
+        };
+    }
     // --- row-expansion template -----------------------------------------------
     rowExpansion = contentChild(SdsTableRowExpansion, ...(ngDevMode ? [{ debugName: "rowExpansion" }] : []));
     expansionTemplate() {
@@ -11293,7 +11694,8 @@ class SdsTable {
     totalColumnCount = computed(() => this.effectiveColumns().length + this.leadingColumnCount(), ...(ngDevMode ? [{ debugName: "totalColumnCount" }] : []));
     // --- sorting UI -----------------------------------------------------------
     isColumnSortable(col) {
-        return this.sortable() && !!col.sortable;
+        // A custom header template owns the header content, so it has no sort button.
+        return this.sortable() && !!col.sortable && !this.headerTemplateFor(col.field);
     }
     sortIcon(col) {
         if (this.sortField() !== col.field || this.sortOrder() === 0) {
@@ -11653,6 +12055,13 @@ class SdsTable {
         }
         return String(v);
     }
+    /** Shared frame of the in-cell editors (text, select): height, radius, focus ring, error state. */
+    editorClass(row, col) {
+        const tone = this.cellErrorFor(row, col.field)
+            ? 'border-danger ring-danger/25'
+            : 'border-brand-500 ring-brand-500/25';
+        return `h-9 w-full rounded-control border bg-surface text-sm text-ink outline-none ring-2 ${tone}`;
+    }
     gridCellClass(row, col, r, c) {
         const align = ALIGN[col.align ?? 'left'];
         const editing = this.isEditing(r, c);
@@ -11992,7 +12401,7 @@ class SdsTable {
             : 'border-border bg-surface';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsTable, isStandalone: true, selector: "sds-table", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, gridlines: { classPropertyName: "gridlines", publicName: "gridlines", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, showCurrentPageReport: { classPropertyName: "showCurrentPageReport", publicName: "showCurrentPageReport", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageLabel: { classPropertyName: "rowsPerPageLabel", publicName: "rowsPerPageLabel", isSignal: true, isRequired: false, transformFunction: null }, paginationLabel: { classPropertyName: "paginationLabel", publicName: "paginationLabel", isSignal: true, isRequired: false, transformFunction: null }, firstPageLabel: { classPropertyName: "firstPageLabel", publicName: "firstPageLabel", isSignal: true, isRequired: false, transformFunction: null }, previousPageLabel: { classPropertyName: "previousPageLabel", publicName: "previousPageLabel", isSignal: true, isRequired: false, transformFunction: null }, nextPageLabel: { classPropertyName: "nextPageLabel", publicName: "nextPageLabel", isSignal: true, isRequired: false, transformFunction: null }, lastPageLabel: { classPropertyName: "lastPageLabel", publicName: "lastPageLabel", isSignal: true, isRequired: false, transformFunction: null }, pageLinkLabel: { classPropertyName: "pageLinkLabel", publicName: "pageLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, globalFilter: { classPropertyName: "globalFilter", publicName: "globalFilter", isSignal: true, isRequired: false, transformFunction: null }, globalFilterPlaceholder: { classPropertyName: "globalFilterPlaceholder", publicName: "globalFilterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, globalFilterAriaLabel: { classPropertyName: "globalFilterAriaLabel", publicName: "globalFilterAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, globalFilterFields: { classPropertyName: "globalFilterFields", publicName: "globalFilterFields", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, expandable: { classPropertyName: "expandable", publicName: "expandable", isSignal: true, isRequired: false, transformFunction: null }, resizableColumns: { classPropertyName: "resizableColumns", publicName: "resizableColumns", isSignal: true, isRequired: false, transformFunction: null }, reorderableColumns: { classPropertyName: "reorderableColumns", publicName: "reorderableColumns", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, editOn: { classPropertyName: "editOn", publicName: "editOn", isSignal: true, isRequired: false, transformFunction: null }, cellErrors: { classPropertyName: "cellErrors", publicName: "cellErrors", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, dirtyLabel: { classPropertyName: "dirtyLabel", publicName: "dirtyLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", sortChange: "sortChange", pageChange: "pageChange", rowSelect: "rowSelect", rowUnselect: "rowUnselect", lazyLoad: "lazyLoad", rowClick: "rowClick", rowExpand: "rowExpand", rowCollapse: "rowCollapse", colReorder: "colReorder", cellCommit: "cellCommit" }, host: { classAttribute: "block" }, queries: [{ propertyName: "cellTemplates", predicate: SdsTableCell, isSignal: true }, { propertyName: "rowExpansion", first: true, predicate: SdsTableRowExpansion, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "numberEditor", first: true, predicate: SdsInputNumber, descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SdsTable, isStandalone: true, selector: "sds-table", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, gridlines: { classPropertyName: "gridlines", publicName: "gridlines", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, sortable: { classPropertyName: "sortable", publicName: "sortable", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, showCurrentPageReport: { classPropertyName: "showCurrentPageReport", publicName: "showCurrentPageReport", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageLabel: { classPropertyName: "rowsPerPageLabel", publicName: "rowsPerPageLabel", isSignal: true, isRequired: false, transformFunction: null }, paginationLabel: { classPropertyName: "paginationLabel", publicName: "paginationLabel", isSignal: true, isRequired: false, transformFunction: null }, firstPageLabel: { classPropertyName: "firstPageLabel", publicName: "firstPageLabel", isSignal: true, isRequired: false, transformFunction: null }, previousPageLabel: { classPropertyName: "previousPageLabel", publicName: "previousPageLabel", isSignal: true, isRequired: false, transformFunction: null }, nextPageLabel: { classPropertyName: "nextPageLabel", publicName: "nextPageLabel", isSignal: true, isRequired: false, transformFunction: null }, lastPageLabel: { classPropertyName: "lastPageLabel", publicName: "lastPageLabel", isSignal: true, isRequired: false, transformFunction: null }, pageLinkLabel: { classPropertyName: "pageLinkLabel", publicName: "pageLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, globalFilter: { classPropertyName: "globalFilter", publicName: "globalFilter", isSignal: true, isRequired: false, transformFunction: null }, globalFilterPlaceholder: { classPropertyName: "globalFilterPlaceholder", publicName: "globalFilterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, globalFilterAriaLabel: { classPropertyName: "globalFilterAriaLabel", publicName: "globalFilterAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, globalFilterFields: { classPropertyName: "globalFilterFields", publicName: "globalFilterFields", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, expandable: { classPropertyName: "expandable", publicName: "expandable", isSignal: true, isRequired: false, transformFunction: null }, resizableColumns: { classPropertyName: "resizableColumns", publicName: "resizableColumns", isSignal: true, isRequired: false, transformFunction: null }, reorderableColumns: { classPropertyName: "reorderableColumns", publicName: "reorderableColumns", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, editOn: { classPropertyName: "editOn", publicName: "editOn", isSignal: true, isRequired: false, transformFunction: null }, cellErrors: { classPropertyName: "cellErrors", publicName: "cellErrors", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, dirtyLabel: { classPropertyName: "dirtyLabel", publicName: "dirtyLabel", isSignal: true, isRequired: false, transformFunction: null }, selectPlaceholder: { classPropertyName: "selectPlaceholder", publicName: "selectPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, selectAllLabel: { classPropertyName: "selectAllLabel", publicName: "selectAllLabel", isSignal: true, isRequired: false, transformFunction: null }, selectRowLabel: { classPropertyName: "selectRowLabel", publicName: "selectRowLabel", isSignal: true, isRequired: false, transformFunction: null }, selectionColumnLabel: { classPropertyName: "selectionColumnLabel", publicName: "selectionColumnLabel", isSignal: true, isRequired: false, transformFunction: null }, expandColumnLabel: { classPropertyName: "expandColumnLabel", publicName: "expandColumnLabel", isSignal: true, isRequired: false, transformFunction: null }, expandRowLabel: { classPropertyName: "expandRowLabel", publicName: "expandRowLabel", isSignal: true, isRequired: false, transformFunction: null }, collapseRowLabel: { classPropertyName: "collapseRowLabel", publicName: "collapseRowLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", sortChange: "sortChange", pageChange: "pageChange", rowSelect: "rowSelect", rowUnselect: "rowUnselect", lazyLoad: "lazyLoad", rowClick: "rowClick", rowExpand: "rowExpand", rowCollapse: "rowCollapse", colReorder: "colReorder", cellCommit: "cellCommit" }, host: { classAttribute: "block" }, queries: [{ propertyName: "cellTemplates", predicate: SdsTableCell, isSignal: true }, { propertyName: "headerTemplates", predicate: SdsTableHeader, isSignal: true }, { propertyName: "rowExpansion", first: true, predicate: SdsTableRowExpansion, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "numberEditor", first: true, predicate: SdsInputNumber, descendants: true, isSignal: true }], ngImport: i0, template: `
     <div class="rounded-card border border-border bg-surface overflow-hidden">
       <!-- Toolbar: caption + global filter -->
       @if (caption() || globalFilter()) {
@@ -12057,7 +12466,7 @@ class SdsTable {
                   [class.z-10]="scrollHeight()"
                   [class.bg-muted]="scrollHeight()"
                 >
-                  <span class="sr-only">Détails</span>
+                  <span class="sr-only">{{ expandColumnLabel() }}</span>
                 </th>
               }
 
@@ -12076,7 +12485,7 @@ class SdsTable {
                       type="button"
                       role="checkbox"
                       [attr.aria-checked]="headerChecked() ? 'true' : (headerIndeterminate() ? 'mixed' : 'false')"
-                      aria-label="Tout sélectionner"
+                      [attr.aria-label]="selectAllLabel()"
                       [disabled]="loading()"
                       class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                       [class]="checkboxClass(headerChecked(), headerIndeterminate())"
@@ -12089,7 +12498,7 @@ class SdsTable {
                       }
                     </button>
                   } @else {
-                    <span class="sr-only">Sélection</span>
+                    <span class="sr-only">{{ selectionColumnLabel() }}</span>
                   }
                 </th>
               }
@@ -12112,7 +12521,12 @@ class SdsTable {
                   (drop)="onColDrop($event, i)"
                   (dragend)="onColDragEnd()"
                 >
-                  @if (isColumnSortable(col)) {
+                  @if (headerTemplateFor(col.field); as htpl) {
+                    <ng-container
+                      [ngTemplateOutlet]="htpl"
+                      [ngTemplateOutletContext]="headerContext(col, i)"
+                    />
+                  } @else if (isColumnSortable(col)) {
                     <button
                       type="button"
                       [disabled]="loading()"
@@ -12154,7 +12568,7 @@ class SdsTable {
                       type="button"
                       [attr.aria-expanded]="isExpanded(row)"
                       [attr.aria-controls]="isExpanded(row) ? rowDetailId(row) : null"
-                      [attr.aria-label]="isExpanded(row) ? 'Réduire la ligne' : 'Développer la ligne'"
+                      [attr.aria-label]="isExpanded(row) ? collapseRowLabel() : expandRowLabel()"
                       [disabled]="loading()"
                       class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded text-ink-soft hover:text-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                       (click)="onExpanderClick($event, row)"
@@ -12179,7 +12593,7 @@ class SdsTable {
                         type="button"
                         role="checkbox"
                         [attr.aria-checked]="isRowSelected(row) ? 'true' : 'false'"
-                        aria-label="Sélectionner la ligne"
+                        [attr.aria-label]="selectRowLabel()"
                         [disabled]="loading()"
                         class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                         [class]="checkboxClass(isRowSelected(row), false)"
@@ -12194,7 +12608,7 @@ class SdsTable {
                         type="button"
                         role="radio"
                         [attr.aria-checked]="isRowSelected(row) ? 'true' : 'false'"
-                        aria-label="Sélectionner la ligne"
+                        [attr.aria-label]="selectRowLabel()"
                         [disabled]="loading()"
                         class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded-full border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                         [class]="checkboxClass(isRowSelected(row), false)"
@@ -12241,20 +12655,31 @@ class SdsTable {
                       @if (isEditing(i, ci)) {
                         @switch (col.editor) {
                           @case ('select') {
-                            <select
-                              data-sds-cell-editor
-                              class="h-9 w-full rounded-control border border-brand-500 bg-surface px-2 text-sm text-ink outline-none ring-2 ring-brand-500/25"
-                              [attr.aria-label]="col.header"
-                              (change)="onSelectEditorChange($event, col)"
-                              (blur)="onEditorBlur()"
-                            >
-                              @if (draft() === null || draft() === undefined) {
-                                <option value="" disabled selected>{{ col.placeholder ?? '' }}</option>
-                              }
-                              @for (opt of col.options ?? []; track $index; let oi = $index) {
-                                <option [value]="oi" [selected]="opt.value === draft()">{{ opt.label }}</option>
-                              }
-                            </select>
+                            <!-- A native select (dependable inside a grid cell), dressed like the other editors:
+                                 same height, radius, focus ring and padding, a library chevron, dark-mode popup. -->
+                            <div class="relative flex items-center">
+                              <select
+                                data-sds-cell-editor
+                                [class]="editorClass(row, col) + ' cursor-pointer appearance-none pl-2.5 pr-8 dark:scheme-dark'"
+                                [attr.aria-label]="col.header"
+                                [attr.aria-invalid]="cellErrorFor(row, col.field) ? 'true' : null"
+                                [attr.aria-describedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : null"
+                                (change)="onSelectEditorChange($event, col)"
+                                (blur)="onEditorBlur()"
+                              >
+                                @if (draft() === null || draft() === undefined) {
+                                  <option value="" disabled selected>{{ col.placeholder ?? selectPlaceholder() }}</option>
+                                }
+                                @for (opt of col.options ?? []; track $index; let oi = $index) {
+                                  <option [value]="oi" [selected]="opt.value === draft()">{{ opt.label }}</option>
+                                }
+                              </select>
+                              <sds-icon
+                                name="chevron-down"
+                                [size]="16"
+                                class="pointer-events-none absolute right-2.5 text-ink-soft"
+                              />
+                            </div>
                           }
                           @case ('number') {
                             <sds-input-number
@@ -12269,6 +12694,8 @@ class SdsTable {
                               [maxFractionDigits]="col.maxFractionDigits ?? null"
                               [placeholder]="col.placeholder ?? ''"
                               [ariaLabel]="col.header"
+                              [invalid]="!!cellErrorFor(row, col.field)"
+                              [ariaDescribedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : ''"
                               (focusout)="onEditorBlur()"
                             />
                           }
@@ -12286,6 +12713,8 @@ class SdsTable {
                               [maxFractionDigits]="col.maxFractionDigits ?? null"
                               [placeholder]="col.placeholder ?? ''"
                               [ariaLabel]="col.header"
+                              [invalid]="!!cellErrorFor(row, col.field)"
+                              [ariaDescribedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : ''"
                               (focusout)="onEditorBlur()"
                             />
                           }
@@ -12293,10 +12722,12 @@ class SdsTable {
                             <input
                               data-sds-cell-editor
                               type="text"
-                              class="h-9 w-full rounded-control border border-brand-500 bg-surface px-2.5 text-sm text-ink outline-none ring-2 ring-brand-500/25 placeholder:text-ink-faint"
+                              [class]="editorClass(row, col) + ' px-2.5 placeholder:text-ink-faint'"
                               [value]="draftText()"
                               [placeholder]="col.placeholder ?? ''"
                               [attr.aria-label]="col.header"
+                              [attr.aria-invalid]="cellErrorFor(row, col.field) ? 'true' : null"
+                              [attr.aria-describedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : null"
                               (input)="onTextEditorInput($event)"
                               (blur)="onEditorBlur()"
                             />
@@ -12396,7 +12827,7 @@ class SdsTable {
         </div>
       }
     </div>
-  `, isInline: true, dependencies: [{ kind: "component", type: SdsIcon, selector: "sds-icon", inputs: ["name", "size", "strokeWidth"] }, { kind: "component", type: SdsPaginator, selector: "sds-paginator", inputs: ["totalRecords", "first", "rows", "rowsPerPageOptions", "pageLinkSize", "showFirstLastIcon", "showPageLinks", "showCurrentPageReport", "currentPageReportTemplate", "showJumpToPageInput", "rowsPerPageLabel", "jumpToPageLabel", "paginationLabel", "firstPageLabel", "previousPageLabel", "nextPageLabel", "lastPageLabel", "pageLinkLabel", "jumpToPageAriaLabel", "size", "disabled"], outputs: ["firstChange", "rowsChange", "pageChange"] }, { kind: "component", type: SdsInputNumber, selector: "sds-input-number", inputs: ["label", "ariaLabel", "placeholder", "hint", "error", "size", "appearance", "disabled", "readonly", "mode", "locale", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "min", "max", "step", "showButtons", "buttonLayout", "incrementIcon", "decrementIcon", "allowEmpty", "clearable", "clearLabel", "incrementLabel", "decrementLabel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "component", type: SdsIcon, selector: "sds-icon", inputs: ["name", "size", "strokeWidth"] }, { kind: "component", type: SdsPaginator, selector: "sds-paginator", inputs: ["totalRecords", "first", "rows", "rowsPerPageOptions", "pageLinkSize", "showFirstLastIcon", "showPageLinks", "showCurrentPageReport", "currentPageReportTemplate", "showJumpToPageInput", "rowsPerPageLabel", "jumpToPageLabel", "paginationLabel", "firstPageLabel", "previousPageLabel", "nextPageLabel", "lastPageLabel", "pageLinkLabel", "jumpToPageAriaLabel", "size", "disabled"], outputs: ["firstChange", "rowsChange", "pageChange"] }, { kind: "component", type: SdsInputNumber, selector: "sds-input-number", inputs: ["label", "ariaLabel", "placeholder", "hint", "error", "invalid", "ariaDescribedby", "size", "appearance", "disabled", "readonly", "mode", "locale", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "min", "max", "step", "showButtons", "buttonLayout", "incrementIcon", "decrementIcon", "allowEmpty", "clearable", "clearLabel", "incrementLabel", "decrementLabel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SdsTable, decorators: [{
             type: Component,
@@ -12470,7 +12901,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                   [class.z-10]="scrollHeight()"
                   [class.bg-muted]="scrollHeight()"
                 >
-                  <span class="sr-only">Détails</span>
+                  <span class="sr-only">{{ expandColumnLabel() }}</span>
                 </th>
               }
 
@@ -12489,7 +12920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                       type="button"
                       role="checkbox"
                       [attr.aria-checked]="headerChecked() ? 'true' : (headerIndeterminate() ? 'mixed' : 'false')"
-                      aria-label="Tout sélectionner"
+                      [attr.aria-label]="selectAllLabel()"
                       [disabled]="loading()"
                       class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                       [class]="checkboxClass(headerChecked(), headerIndeterminate())"
@@ -12502,7 +12933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                       }
                     </button>
                   } @else {
-                    <span class="sr-only">Sélection</span>
+                    <span class="sr-only">{{ selectionColumnLabel() }}</span>
                   }
                 </th>
               }
@@ -12525,7 +12956,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                   (drop)="onColDrop($event, i)"
                   (dragend)="onColDragEnd()"
                 >
-                  @if (isColumnSortable(col)) {
+                  @if (headerTemplateFor(col.field); as htpl) {
+                    <ng-container
+                      [ngTemplateOutlet]="htpl"
+                      [ngTemplateOutletContext]="headerContext(col, i)"
+                    />
+                  } @else if (isColumnSortable(col)) {
                     <button
                       type="button"
                       [disabled]="loading()"
@@ -12567,7 +13003,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                       type="button"
                       [attr.aria-expanded]="isExpanded(row)"
                       [attr.aria-controls]="isExpanded(row) ? rowDetailId(row) : null"
-                      [attr.aria-label]="isExpanded(row) ? 'Réduire la ligne' : 'Développer la ligne'"
+                      [attr.aria-label]="isExpanded(row) ? collapseRowLabel() : expandRowLabel()"
                       [disabled]="loading()"
                       class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded text-ink-soft hover:text-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                       (click)="onExpanderClick($event, row)"
@@ -12592,7 +13028,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         type="button"
                         role="checkbox"
                         [attr.aria-checked]="isRowSelected(row) ? 'true' : 'false'"
-                        aria-label="Sélectionner la ligne"
+                        [attr.aria-label]="selectRowLabel()"
                         [disabled]="loading()"
                         class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                         [class]="checkboxClass(isRowSelected(row), false)"
@@ -12607,7 +13043,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         type="button"
                         role="radio"
                         [attr.aria-checked]="isRowSelected(row) ? 'true' : 'false'"
-                        aria-label="Sélectionner la ligne"
+                        [attr.aria-label]="selectRowLabel()"
                         [disabled]="loading()"
                         class="grid h-[18px] w-[18px] shrink-0 place-items-center rounded-full border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:ring-offset-1 disabled:opacity-60"
                         [class]="checkboxClass(isRowSelected(row), false)"
@@ -12654,20 +13090,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                       @if (isEditing(i, ci)) {
                         @switch (col.editor) {
                           @case ('select') {
-                            <select
-                              data-sds-cell-editor
-                              class="h-9 w-full rounded-control border border-brand-500 bg-surface px-2 text-sm text-ink outline-none ring-2 ring-brand-500/25"
-                              [attr.aria-label]="col.header"
-                              (change)="onSelectEditorChange($event, col)"
-                              (blur)="onEditorBlur()"
-                            >
-                              @if (draft() === null || draft() === undefined) {
-                                <option value="" disabled selected>{{ col.placeholder ?? '' }}</option>
-                              }
-                              @for (opt of col.options ?? []; track $index; let oi = $index) {
-                                <option [value]="oi" [selected]="opt.value === draft()">{{ opt.label }}</option>
-                              }
-                            </select>
+                            <!-- A native select (dependable inside a grid cell), dressed like the other editors:
+                                 same height, radius, focus ring and padding, a library chevron, dark-mode popup. -->
+                            <div class="relative flex items-center">
+                              <select
+                                data-sds-cell-editor
+                                [class]="editorClass(row, col) + ' cursor-pointer appearance-none pl-2.5 pr-8 dark:scheme-dark'"
+                                [attr.aria-label]="col.header"
+                                [attr.aria-invalid]="cellErrorFor(row, col.field) ? 'true' : null"
+                                [attr.aria-describedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : null"
+                                (change)="onSelectEditorChange($event, col)"
+                                (blur)="onEditorBlur()"
+                              >
+                                @if (draft() === null || draft() === undefined) {
+                                  <option value="" disabled selected>{{ col.placeholder ?? selectPlaceholder() }}</option>
+                                }
+                                @for (opt of col.options ?? []; track $index; let oi = $index) {
+                                  <option [value]="oi" [selected]="opt.value === draft()">{{ opt.label }}</option>
+                                }
+                              </select>
+                              <sds-icon
+                                name="chevron-down"
+                                [size]="16"
+                                class="pointer-events-none absolute right-2.5 text-ink-soft"
+                              />
+                            </div>
                           }
                           @case ('number') {
                             <sds-input-number
@@ -12682,6 +13129,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                               [maxFractionDigits]="col.maxFractionDigits ?? null"
                               [placeholder]="col.placeholder ?? ''"
                               [ariaLabel]="col.header"
+                              [invalid]="!!cellErrorFor(row, col.field)"
+                              [ariaDescribedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : ''"
                               (focusout)="onEditorBlur()"
                             />
                           }
@@ -12699,6 +13148,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                               [maxFractionDigits]="col.maxFractionDigits ?? null"
                               [placeholder]="col.placeholder ?? ''"
                               [ariaLabel]="col.header"
+                              [invalid]="!!cellErrorFor(row, col.field)"
+                              [ariaDescribedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : ''"
                               (focusout)="onEditorBlur()"
                             />
                           }
@@ -12706,10 +13157,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                             <input
                               data-sds-cell-editor
                               type="text"
-                              class="h-9 w-full rounded-control border border-brand-500 bg-surface px-2.5 text-sm text-ink outline-none ring-2 ring-brand-500/25 placeholder:text-ink-faint"
+                              [class]="editorClass(row, col) + ' px-2.5 placeholder:text-ink-faint'"
                               [value]="draftText()"
                               [placeholder]="col.placeholder ?? ''"
                               [attr.aria-label]="col.header"
+                              [attr.aria-invalid]="cellErrorFor(row, col.field) ? 'true' : null"
+                              [attr.aria-describedby]="cellErrorFor(row, col.field) ? cellErrorId(i, ci) : null"
                               (input)="onTextEditorInput($event)"
                               (blur)="onEditorBlur()"
                             />
@@ -12811,7 +13264,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
     </div>
   `,
                 }]
-        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], gridlines: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridlines", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], paginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginator", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], rowsPerPageOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsPerPageOptions", required: false }] }], showCurrentPageReport: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCurrentPageReport", required: false }] }], currentPageReportTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPageReportTemplate", required: false }] }], rowsPerPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsPerPageLabel", required: false }] }], paginationLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationLabel", required: false }] }], firstPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstPageLabel", required: false }] }], previousPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousPageLabel", required: false }] }], nextPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextPageLabel", required: false }] }], lastPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "lastPageLabel", required: false }] }], pageLinkLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageLinkLabel", required: false }] }], globalFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilter", required: false }] }], globalFilterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterPlaceholder", required: false }] }], globalFilterAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterAriaLabel", required: false }] }], globalFilterFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterFields", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], totalRecords: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalRecords", required: false }] }], expandable: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandable", required: false }] }], resizableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizableColumns", required: false }] }], reorderableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderableColumns", required: false }] }], editable: [{ type: i0.Input, args: [{ isSignal: true, alias: "editable", required: false }] }], editOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "editOn", required: false }] }], cellErrors: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellErrors", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], dirtyLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirtyLabel", required: false }] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }], rowSelect: [{ type: i0.Output, args: ["rowSelect"] }], rowUnselect: [{ type: i0.Output, args: ["rowUnselect"] }], lazyLoad: [{ type: i0.Output, args: ["lazyLoad"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowExpand: [{ type: i0.Output, args: ["rowExpand"] }], rowCollapse: [{ type: i0.Output, args: ["rowCollapse"] }], colReorder: [{ type: i0.Output, args: ["colReorder"] }], cellCommit: [{ type: i0.Output, args: ["cellCommit"] }], cellTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdsTableCell), { isSignal: true }] }], rowExpansion: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsTableRowExpansion), { isSignal: true }] }], numberEditor: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SdsInputNumber), { isSignal: true }] }] } });
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], gridlines: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridlines", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], sortable: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortable", required: false }] }], paginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginator", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], rowsPerPageOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsPerPageOptions", required: false }] }], showCurrentPageReport: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCurrentPageReport", required: false }] }], currentPageReportTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPageReportTemplate", required: false }] }], rowsPerPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsPerPageLabel", required: false }] }], paginationLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginationLabel", required: false }] }], firstPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstPageLabel", required: false }] }], previousPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "previousPageLabel", required: false }] }], nextPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextPageLabel", required: false }] }], lastPageLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "lastPageLabel", required: false }] }], pageLinkLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageLinkLabel", required: false }] }], globalFilter: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilter", required: false }] }], globalFilterPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterPlaceholder", required: false }] }], globalFilterAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterAriaLabel", required: false }] }], globalFilterFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterFields", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], totalRecords: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalRecords", required: false }] }], expandable: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandable", required: false }] }], resizableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizableColumns", required: false }] }], reorderableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "reorderableColumns", required: false }] }], editable: [{ type: i0.Input, args: [{ isSignal: true, alias: "editable", required: false }] }], editOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "editOn", required: false }] }], cellErrors: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellErrors", required: false }] }], locale: [{ type: i0.Input, args: [{ isSignal: true, alias: "locale", required: false }] }], dirtyLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirtyLabel", required: false }] }], selectPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectPlaceholder", required: false }] }], selectAllLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllLabel", required: false }] }], selectRowLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectRowLabel", required: false }] }], selectionColumnLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionColumnLabel", required: false }] }], expandColumnLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandColumnLabel", required: false }] }], expandRowLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandRowLabel", required: false }] }], collapseRowLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseRowLabel", required: false }] }], sortChange: [{ type: i0.Output, args: ["sortChange"] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }], rowSelect: [{ type: i0.Output, args: ["rowSelect"] }], rowUnselect: [{ type: i0.Output, args: ["rowUnselect"] }], lazyLoad: [{ type: i0.Output, args: ["lazyLoad"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowExpand: [{ type: i0.Output, args: ["rowExpand"] }], rowCollapse: [{ type: i0.Output, args: ["rowCollapse"] }], colReorder: [{ type: i0.Output, args: ["colReorder"] }], cellCommit: [{ type: i0.Output, args: ["cellCommit"] }], cellTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdsTableCell), { isSignal: true }] }], headerTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdsTableHeader), { isSignal: true }] }], rowExpansion: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdsTableRowExpansion), { isSignal: true }] }], numberEditor: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SdsInputNumber), { isSignal: true }] }] } });
 
 /**
  * A tiny transient-notification bus. Application code calls {@link success} / {@link error} / {@link info}
@@ -12823,7 +13276,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  *
  * ```ts
  * private readonly toasts = inject(SdsToastService);
- * this.toasts.success('Enregistré.');
+ * this.toasts.success('Saved.');
  * ```
  *
  * Mount the host once (e.g. in the shell): `<sds-toast-host />`.
@@ -12873,10 +13326,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
 class SdsToastHost {
     toasts = inject(SdsToastService);
     /**
-     * Accessible name for each toast's close button. French default so existing consumers are unchanged; the
-     * button is icon-only, so an app serving more than one language MUST translate it.
+     * Accessible name for each toast's close button. English default; the button is icon-only, so an app
+     * serving more than one language MUST translate it.
      */
-    closeLabel = input('Fermer', ...(ngDevMode ? [{ debugName: "closeLabel" }] : []));
+    closeLabel = input('Close', ...(ngDevMode ? [{ debugName: "closeLabel" }] : []));
     errors = computed(() => this.toasts.toasts().filter((t) => t.kind === 'error'), ...(ngDevMode ? [{ debugName: "errors" }] : []));
     notices = computed(() => this.toasts.toasts().filter((t) => t.kind !== 'error'), ...(ngDevMode ? [{ debugName: "notices" }] : []));
     icon(kind) {
@@ -13059,11 +13512,11 @@ class SdsThemeToggle {
     /** `surface` for light/glass bars, `on-brand` for the dark brand bar. */
     appearance = input('surface', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
     /**
-     * Accessible names for the two actions. French defaults keep existing consumers unchanged; a
-     * multilingual app must pass translated values.
+     * Accessible names for the two actions. English defaults; a multilingual app must pass translated
+     * values.
      */
-    darkLabel = input('Passer en mode sombre', ...(ngDevMode ? [{ debugName: "darkLabel" }] : []));
-    lightLabel = input('Passer en mode clair', ...(ngDevMode ? [{ debugName: "lightLabel" }] : []));
+    darkLabel = input('Switch to dark mode', ...(ngDevMode ? [{ debugName: "darkLabel" }] : []));
+    lightLabel = input('Switch to light mode', ...(ngDevMode ? [{ debugName: "lightLabel" }] : []));
     iconSize = computed(() => Math.round(this.size() * 0.5), ...(ngDevMode ? [{ debugName: "iconSize" }] : []));
     label = computed(() => (this.isDark() ? this.lightLabel() : this.darkLabel()), ...(ngDevMode ? [{ debugName: "label" }] : []));
     buttonClasses = computed(() => this.appearance() === 'on-brand'
@@ -13204,11 +13657,10 @@ class SdsTopbar {
     /** Show the mobile hamburger that toggles the sidebar drawer (< lg). */
     menuButton = input(true, ...(ngDevMode ? [{ debugName: "menuButton", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /**
-     * Accessible name for the hamburger. Defaults to French so nothing changes for existing consumers,
-     * but any app serving more than one language MUST pass a translated value — an icon-only control's
-     * aria-label is its only name, and a hardcoded one is simply wrong in every other locale.
+     * Accessible name for the hamburger. English default; any app serving more than one language MUST
+     * pass a translated value — an icon-only control's aria-label is its only name.
      */
-    menuLabel = input('Ouvrir le menu', ...(ngDevMode ? [{ debugName: "menuLabel" }] : []));
+    menuLabel = input('Open menu', ...(ngDevMode ? [{ debugName: "menuLabel" }] : []));
     /**
      * `brand` (default) paints the gradient and the wave; `surface` is white on a hairline border;
      * `glass` is a translucent, brand-tinted bar with a backdrop blur.
@@ -13549,7 +14001,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * @example
  * <sds-sidebar appearance="surface" decorations>
  *   <sds-nav-group label="Membres">
- *     <sds-nav-item icon="user-plus" label="Créer un membre" link="/membres/new" />
+ *     <sds-nav-item icon="user-plus" label="Add a member" link="/members/new" />
  *   </sds-nav-group>
  *   <div sdsFooter>…</div>
  * </sds-sidebar>
@@ -13589,12 +14041,12 @@ class SdsSidebar {
         });
     }
     /**
-     * Accessible names for the rail's three icon-only controls. French defaults keep existing consumers
-     * unchanged; a multilingual app must pass translated values.
+     * Accessible names for the rail's three icon-only controls. English defaults; a multilingual app
+     * must pass translated values.
      */
-    collapseLabel = input('Replier le menu', ...(ngDevMode ? [{ debugName: "collapseLabel" }] : []));
-    expandLabel = input('Déplier le menu', ...(ngDevMode ? [{ debugName: "expandLabel" }] : []));
-    closeLabel = input('Fermer le menu', ...(ngDevMode ? [{ debugName: "closeLabel" }] : []));
+    collapseLabel = input('Collapse menu', ...(ngDevMode ? [{ debugName: "collapseLabel" }] : []));
+    expandLabel = input('Expand menu', ...(ngDevMode ? [{ debugName: "expandLabel" }] : []));
+    closeLabel = input('Close menu', ...(ngDevMode ? [{ debugName: "closeLabel" }] : []));
     /** `brand` (default) is the dark rail; `surface` is a light rail with brand accents. */
     appearance = input('brand', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
     /** Add slow-drifting brand-tinted blobs behind the rail (opt-in). */
@@ -14246,8 +14698,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * @example
  * <sds-user-menu name="Souhail AIT SAID" email="souhail@example.com" status="online" appearance="surface">
  *   <sds-menu-item icon="user" label="Profil" link="/profile" />
- *   <sds-menu-item icon="settings" label="Paramètres" link="/settings" />
- *   <sds-menu-item icon="log-out" label="Se déconnecter" tone="danger" (select)="signOut()" />
+ *   <sds-menu-item icon="settings" label="Settings" link="/settings" />
+ *   <sds-menu-item icon="log-out" label="Sign out" tone="danger" (select)="signOut()" />
  * </sds-user-menu>
  */
 class SdsUserMenu {
@@ -14269,7 +14721,7 @@ class SdsUserMenu {
     /** Override the trigger avatar's initials background; defaults per appearance. */
     avatarBgClass = input(null, ...(ngDevMode ? [{ debugName: "avatarBgClass" }] : []));
     /** Accessible name for the trigger (icon/avatar only when details are hidden). */
-    menuLabel = input('Menu du compte', ...(ngDevMode ? [{ debugName: "menuLabel" }] : []));
+    menuLabel = input('Account menu', ...(ngDevMode ? [{ debugName: "menuLabel" }] : []));
     openChange = output();
     open = signal(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
     toggle() {
@@ -14465,7 +14917,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * @example
  * <sds-menu-item icon="user" label="Profil" link="/profile" />                          <!-- in-app route -->
  * <sds-menu-item icon="external-link" label="Site public" href="https://…" target="_blank" />
- * <sds-menu-item icon="log-out" label="Se déconnecter" tone="danger" (select)="signOut()" />
+ * <sds-menu-item icon="log-out" label="Sign out" tone="danger" (select)="signOut()" />
  */
 class SdsMenuItem {
     icon = input(null, ...(ngDevMode ? [{ debugName: "icon" }] : []));
@@ -14593,7 +15045,7 @@ class SdsSearchCommand {
     /** The searchable entries. Order is preserved; when the field is empty they show as quick navigation. */
     items = input([], ...(ngDevMode ? [{ debugName: "items" }] : []));
     /** Placeholder on the trigger pill and the search field. */
-    placeholder = input('Rechercher…', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    placeholder = input('Search…', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     /** Show the built-in trigger pill. Turn off to drive the palette from your own control (`cmd.open()`). */
     showTrigger = input(true, ...(ngDevMode ? [{ debugName: "showTrigger", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /** Enable the global ⌘K / Ctrl-K shortcut. */
@@ -14603,15 +15055,15 @@ class SdsSearchCommand {
     /** `surface` (default) for a light / glass bar; `on-brand` for the dark brand bar. */
     appearance = input('surface', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
     /**
-     * User-facing copy. French defaults; a multilingual app passes translated values (the trigger and the
-     * field share `placeholder`, and `searchLabel` is the accessible name for both).
+     * User-facing copy. English defaults; a multilingual app passes translated values (the trigger and
+     * the field share `placeholder`, and `searchLabel` is the accessible name for both).
      */
-    searchLabel = input('Rechercher', ...(ngDevMode ? [{ debugName: "searchLabel" }] : []));
-    clearLabel = input('Effacer', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
-    emptyLabel = input('Aucun résultat', ...(ngDevMode ? [{ debugName: "emptyLabel" }] : []));
-    selectHint = input('Sélectionner', ...(ngDevMode ? [{ debugName: "selectHint" }] : []));
-    navigateHint = input('Naviguer', ...(ngDevMode ? [{ debugName: "navigateHint" }] : []));
-    closeHint = input('Fermer', ...(ngDevMode ? [{ debugName: "closeHint" }] : []));
+    searchLabel = input('Search', ...(ngDevMode ? [{ debugName: "searchLabel" }] : []));
+    clearLabel = input('Clear', ...(ngDevMode ? [{ debugName: "clearLabel" }] : []));
+    emptyLabel = input('No results', ...(ngDevMode ? [{ debugName: "emptyLabel" }] : []));
+    selectHint = input('Select', ...(ngDevMode ? [{ debugName: "selectHint" }] : []));
+    navigateHint = input('Navigate', ...(ngDevMode ? [{ debugName: "navigateHint" }] : []));
+    closeHint = input('Close', ...(ngDevMode ? [{ debugName: "closeHint" }] : []));
     select = output();
     openChange = output();
     isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
@@ -15085,8 +15537,8 @@ class SdsLanguageSwitcher {
     /** `up` prefers opening the panel above the trigger — for a switcher near the bottom of the page. */
     direction = input('down', ...(ngDevMode ? [{ debugName: "direction" }] : []));
     /** Accessible name for the trigger and panel. */
-    menuLabel = input('Choisir la langue', ...(ngDevMode ? [{ debugName: "menuLabel" }] : []));
-    /** Optional visible header above the list (e.g. "Langue"). Omitted when empty. */
+    menuLabel = input('Choose language', ...(ngDevMode ? [{ debugName: "menuLabel" }] : []));
+    /** Optional visible header above the list (e.g. "Language"). Omitted when empty. */
     heading = input('', ...(ngDevMode ? [{ debugName: "heading" }] : []));
     openChange = output();
     open = signal(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
@@ -15450,5 +15902,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { SDS_ALLERGENS, SDS_ALLERGEN_ICONS, SDS_ALLERGEN_LABELS_EN, SDS_ICONS, SDS_PHONE_COUNTRIES, SdsAccordion, SdsAccordionContent, SdsAccordionHeader, SdsAccordionPanel, SdsAccordionStore, SdsAllergenIcon, SdsAvatar, SdsBadge, SdsBulkBar, SdsButton, SdsCalendar, SdsCard, SdsCheckbox, SdsChecklistRow, SdsDatePicker, SdsFileDrop, SdsIcon, SdsImageCropper, SdsInput, SdsInputNumber, SdsLanguageSwitcher, SdsLocalizedInput, SdsMenu, SdsMenuItem, SdsMenuTrigger, SdsMultiSelect, SdsNavGroup, SdsNavItem, SdsOtpInput, SdsPaginator, SdsPhoneInput, SdsRadio, SdsScore, SdsSearchCommand, SdsSegmented, SdsSelect, SdsSelectEmpty, SdsSelectFooter, SdsSelectOption, SdsShell, SdsSidebar, SdsSortableHandle, SdsSortableItem, SdsSortableList, SdsStatusTile, SdsTab, SdsTabList, SdsTabPanel, SdsTabPanels, SdsTable, SdsTableCell, SdsTableRowExpansion, SdsTabs, SdsTabsStore, SdsTextarea, SdsThemeService, SdsThemeToggle, SdsToastHost, SdsToastService, SdsToggleSwitch, SdsTopbar, SdsTriStateChip, SdsUserMenu, SidebarStore, addDays, addMonths, addMonthsKeepDay, formatDdMmYyyy, formatHhMm, isOutOfRange, isSameDay, isoDay, pad2, sdsFileMatchesAccept, sdsFormatBytes, sdsFormatNational, sdsMatchDialCode, sdsNormalizeSignificant, startOfDay, startOfMonth };
+export { SDS_ALLERGENS, SDS_ALLERGEN_ICONS, SDS_ALLERGEN_LABELS_EN, SDS_ICONS, SDS_PHONE_COUNTRIES, SdsAccordion, SdsAccordionContent, SdsAccordionHeader, SdsAccordionPanel, SdsAccordionStore, SdsAllergenIcon, SdsAvatar, SdsBadge, SdsBulkBar, SdsButton, SdsCalendar, SdsCard, SdsCheckbox, SdsChecklistRow, SdsDatePicker, SdsFileDrop, SdsIcon, SdsImageCropper, SdsInput, SdsInputNumber, SdsLanguageSwitcher, SdsLocalizedInput, SdsMenu, SdsMenuItem, SdsMenuTrigger, SdsMultiSelect, SdsNavGroup, SdsNavItem, SdsOtpInput, SdsPaginator, SdsPhoneInput, SdsRadio, SdsScore, SdsSearchCommand, SdsSegmented, SdsSelect, SdsSelectEmpty, SdsSelectFooter, SdsSelectOption, SdsShell, SdsSidebar, SdsSortableHandle, SdsSortableItem, SdsSortableList, SdsStatusTile, SdsTab, SdsTabList, SdsTabPanel, SdsTabPanels, SdsTable, SdsTableCell, SdsTableHeader, SdsTableRowExpansion, SdsTabs, SdsTabsStore, SdsTextarea, SdsThemeService, SdsThemeToggle, SdsToastHost, SdsToastService, SdsToggleSwitch, SdsTopbar, SdsTriStateChip, SdsUserMenu, SidebarStore, addDays, addMonths, addMonthsKeepDay, formatDdMmYyyy, formatHhMm, isOutOfRange, isSameDay, isoDay, pad2, sdsFileMatchesAccept, sdsFormatBytes, sdsFormatNational, sdsMatchDialCode, sdsNormalizeSignificant, startOfDay, startOfMonth };
 //# sourceMappingURL=besaitech-ng-design-system.mjs.map