ps-helix 4.1.0 → 5.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ps-helix",
-  "version": "4.1.0",
+  "version": "5.0.0",
   "description": "Helix Design System - A comprehensive Angular component library",
   "author": "Fabrice PEREZ - Product designer at PACK Solutions",
   "license": "MIT",

package/src/lib/styles/themes/dark.css

@@ -139,28 +139,28 @@
   --text-on-dark: #FFFFFF;
   --text-on-light: #0a0d16;
 
-  /* Primary Colors - Use insurer context with fallbacks (lighter shades for dark theme contrast) */
-  --primary-color: var(--insurer-primary-color, #8178F7);
-  --primary-color-light: var(--insurer-primary-color-light, #8A7FED);
-  --primary-color-lighter: var(--insurer-primary-color-lighter, #A99FF7);
-  --primary-color-dark: var(--insurer-primary-color-dark, #4A3FD9);
-  --primary-color-darker: var(--insurer-primary-color-darker, #3730A3);
-  --primary-color-text: var(--insurer-primary-color-text, #FFFFFF);
-  --primary-color-rgb: var(--insurer-primary-color-rgb, 107, 95, 227);
+  /* Primary Colors - Use customer context with fallbacks (lighter shades for dark theme contrast) */
+  --primary-color: var(--customer-primary-color, #8178F7);
+  --primary-color-light: var(--customer-primary-color-light, #8A7FED);
+  --primary-color-lighter: var(--customer-primary-color-lighter, #A99FF7);
+  --primary-color-dark: var(--customer-primary-color-dark, #4A3FD9);
+  --primary-color-darker: var(--customer-primary-color-darker, #3730A3);
+  --primary-color-text: var(--customer-primary-color-text, #FFFFFF);
+  --primary-color-rgb: var(--customer-primary-color-rgb, 107, 95, 227);
 
   /* Primary Gradients - Automatically adapt to custom colors */
   --primary-gradient: linear-gradient(to right, var(--primary-color), var(--primary-color-light));
   --primary-gradient-hover: linear-gradient(to right, var(--primary-color), var(--primary-color-lighter));
   --primary-gradient-reversed: linear-gradient(to left, var(--primary-color-dark), var(--primary-color-light));
 
-  /* Secondary Colors - Use insurer context with fallbacks (gray tones for dark theme) */
-  --secondary-color: var(--insurer-secondary-color, #5B5A5A);
-  --secondary-color-light: var(--insurer-secondary-color-light, #838181);
-  --secondary-color-lighter: var(--insurer-secondary-color-lighter, #9E9D9D);
-  --secondary-color-dark: var(--insurer-secondary-color-dark, #4E4D4D);
-  --secondary-color-darker: var(--insurer-secondary-color-darker, #3D3838);
-  --secondary-color-text: var(--insurer-secondary-color-text, #FFFFFF);
-  --secondary-color-rgb: var(--insurer-secondary-color-rgb, 48, 48, 48);
+  /* Secondary Colors - Use customer context with fallbacks (gray tones for dark theme) */
+  --secondary-color: var(--customer-secondary-color, #5B5A5A);
+  --secondary-color-light: var(--customer-secondary-color-light, #838181);
+  --secondary-color-lighter: var(--customer-secondary-color-lighter, #9E9D9D);
+  --secondary-color-dark: var(--customer-secondary-color-dark, #4E4D4D);
+  --secondary-color-darker: var(--customer-secondary-color-darker, #3D3838);
+  --secondary-color-text: var(--customer-secondary-color-text, #FFFFFF);
+  --secondary-color-rgb: var(--customer-secondary-color-rgb, 48, 48, 48);
 
   /* Success Colors */
   --success-color: #12B94F;

package/src/lib/styles/themes/light.css

@@ -223,28 +223,28 @@
   --pink-800: #9D174D;
   --pink-900: #831843;
 
-  /* Primary Colors - Use insurer context with fallbacks */
-  --primary-color: var(--insurer-primary-color, #0B0191);
-  --primary-color-light: var(--insurer-primary-color-light, #0F02C4);
-  --primary-color-lighter: var(--insurer-primary-color-lighter, #4A3FD9);
-  --primary-color-dark: var(--insurer-primary-color-dark, #09017A);
-  --primary-color-darker: var(--insurer-primary-color-darker, #07015E);
-  --primary-color-text: var(--insurer-primary-color-text, #FFFFFF);
-  --primary-color-rgb: var(--insurer-primary-color-rgb, 11, 1, 145);
+  /* Primary Colors - Use customer context with fallbacks */
+  --primary-color: var(--customer-primary-color, #0B0191);
+  --primary-color-light: var(--customer-primary-color-light, #0F02C4);
+  --primary-color-lighter: var(--customer-primary-color-lighter, #4A3FD9);
+  --primary-color-dark: var(--customer-primary-color-dark, #09017A);
+  --primary-color-darker: var(--customer-primary-color-darker, #07015E);
+  --primary-color-text: var(--customer-primary-color-text, #FFFFFF);
+  --primary-color-rgb: var(--customer-primary-color-rgb, 11, 1, 145);
 
   /* Primary Gradients - Automatically adapt to custom colors */
   --primary-gradient: linear-gradient(to right, var(--primary-color-darker), var(--primary-color-light));
   --primary-gradient-hover: linear-gradient(to right, var(--primary-color-dark), var(--primary-color-lighter));
   --primary-gradient-reversed: linear-gradient(to left, var(--primary-color-darker), var(--primary-color-light));
 
-  /* Secondary Colors - Use insurer context with fallbacks (gray tones for light theme) */
-  --secondary-color: var(--insurer-secondary-color, #5E5E5E);
-  --secondary-color-light: var(--insurer-secondary-color-light, #7B7B7B);
-  --secondary-color-lighter: var(--insurer-secondary-color-lighter, #969696);
-  --secondary-color-dark: var(--insurer-secondary-color-dark, #404040);
-  --secondary-color-darker: var(--insurer-secondary-color-darker, #2B2B2B);
-  --secondary-color-text: var(--insurer-secondary-color-text, #FFFFFF);
-  --secondary-color-rgb: var(--insurer-secondary-color-rgb, 94, 94, 94);
+  /* Secondary Colors - Use customer context with fallbacks (gray tones for light theme) */
+  --secondary-color: var(--customer-secondary-color, #5E5E5E);
+  --secondary-color-light: var(--customer-secondary-color-light, #7B7B7B);
+  --secondary-color-lighter: var(--customer-secondary-color-lighter, #969696);
+  --secondary-color-dark: var(--customer-secondary-color-dark, #404040);
+  --secondary-color-darker: var(--customer-secondary-color-darker, #2B2B2B);
+  --secondary-color-text: var(--customer-secondary-color-text, #FFFFFF);
+  --secondary-color-rgb: var(--customer-secondary-color-rgb, 94, 94, 94);
 
   /* Success Colors */
   --success-color: #0F853A;

package/src/lib/styles/tokens/spacing.tokens.css

@@ -12,6 +12,10 @@
   --spacing-3xl: 4rem;        /* 64px */
   --spacing-4xl: 5rem;        /* 80px */
 
+  /* Form field semantic spacing */
+  --form-field-gap: var(--spacing-xs);  /* label <-> control <-> message */
+  --form-label-gap: var(--spacing-sm);  /* control <-> inline label (checkbox/radio/switch) */
+
   /* Negative spacing scale (for negative margins) */
   --negative-spacing-xxs: -0.125rem;
   --negative-spacing-xs: -0.25rem;

package/types/ps-helix.d.ts

@@ -167,7 +167,7 @@ declare class PshBadgeComponent<T = number> {
 /**
  * Apparences disponibles pour le bouton
  */
-type ButtonAppearance = 'filled' | 'outline' | 'rounded' | 'text';
+type ButtonAppearance = 'filled' | 'outline' | 'text';
 /**
  * Variantes disponibles pour le bouton
  */
@@ -705,6 +705,14 @@ interface DropdownItem<T = string> {
     /** État actif */
     active?: boolean;
 }
+/**
+ * Apparences disponibles pour le dropdown
+ */
+type DropdownAppearance = 'filled' | 'outline' | 'text';
+/**
+ * Variantes disponibles pour le dropdown
+ */
+type DropdownVariant = 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
 /**
  * Tailles disponibles pour le dropdown
  */
@@ -717,26 +725,35 @@ type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end'
  * Configuration complète du dropdown
  */
 interface DropdownConfig {
-    /** Variante visuelle */
-    variant?: 'primary' | 'secondary' | 'outline' | 'text';
+    /** Apparence visuelle */
+    appearance?: DropdownAppearance;
+    /** Variante de couleur */
+    variant?: DropdownVariant;
     /** Taille du dropdown */
     size?: DropdownSize;
     /** Position du menu */
     placement?: DropdownPlacement;
     /** État désactivé */
     disabled?: boolean;
+    /** Mode icône seule (masque le label et le caret) */
+    iconOnly?: boolean;
+    /** Texte accessible (aria-label) quand iconOnly est actif */
+    iconOnlyText?: string;
 }
 
 declare class PshDropdownComponent<T = string> implements OnDestroy {
     private elementRef;
     private clickOutsideHandler;
-    variant: _angular_core.InputSignal<"primary" | "secondary" | "text" | "outline">;
+    appearance: _angular_core.InputSignal<DropdownAppearance>;
+    variant: _angular_core.InputSignal<DropdownVariant>;
     size: _angular_core.InputSignal<DropdownSize>;
     placement: _angular_core.InputSignal<DropdownPlacement>;
     items: _angular_core.InputSignal<DropdownItem<T>[]>;
     label: _angular_core.InputSignal<string>;
     icon: _angular_core.InputSignal<string | undefined>;
     ariaLabel: _angular_core.InputSignal<string | undefined>;
+    iconOnly: _angular_core.InputSignal<boolean>;
+    iconOnlyText: _angular_core.InputSignal<string | undefined>;
     disabled: _angular_core.ModelSignal<boolean>;
     private isOpenSignal;
     private selectedItemSignal;
@@ -746,6 +763,7 @@ declare class PshDropdownComponent<T = string> implements OnDestroy {
     closed: _angular_core.OutputEmitterRef<void>;
     isOpen: _angular_core.Signal<boolean>;
     selectedItem: _angular_core.Signal<DropdownItem<T> | null>;
+    isIconOnly: _angular_core.Signal<boolean>;
     computedAriaLabel: _angular_core.Signal<string>;
     state: _angular_core.Signal<string>;
     private getState;
@@ -763,7 +781,7 @@ declare class PshDropdownComponent<T = string> implements OnDestroy {
     private focusItemAtIndex;
     ngOnDestroy(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshDropdownComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshDropdownComponent<any>, "psh-dropdown", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "selected": "selected"; "opened": "opened"; "closed": "closed"; }, never, ["[dropdown-trigger]", "[dropdown-menu]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshDropdownComponent<any>, "psh-dropdown", never, { "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "iconOnly": { "alias": "iconOnly"; "required": false; "isSignal": true; }; "iconOnlyText": { "alias": "iconOnlyText"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "selected": "selected"; "opened": "opened"; "closed": "closed"; }, never, ["[dropdown-trigger]", "[dropdown-menu]"], true, never>;
 }
 
 type InputType = 'text' | 'password' | 'email' | 'tel' | 'url' | 'search' | 'date' | 'number';
@@ -866,6 +884,94 @@ declare class PshInputComponent implements ControlValueAccessor, FormValueContro
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshInputComponent, "psh-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "iconStart": { "alias": "iconStart"; "required": false; "isSignal": true; }; "iconEnd": { "alias": "iconEnd"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "suggestions": { "alias": "suggestions"; "required": false; "isSignal": true; }; "autocompleteConfig": { "alias": "autocompleteConfig"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "readonly": "readonlyChange"; "loading": "loadingChange"; "touched": "touchedChange"; "inputFocus": "inputFocus"; "inputBlur": "inputBlur"; "suggestionSelect": "suggestionSelect"; }, never, ["[input-label]", "[input-error]", "[input-success]", "[input-hint]"], true, never>;
 }
 
+type TextareaVariant = 'outlined' | 'filled';
+type TextareaSize = 'small' | 'medium' | 'large';
+type TextareaResize = 'none' | 'vertical' | 'horizontal' | 'both';
+interface TextareaConfig {
+    variant: TextareaVariant;
+    size: TextareaSize;
+    resize: TextareaResize;
+    disabled: boolean;
+    required: boolean;
+    readonly: boolean;
+    fullWidth: boolean;
+    showLabel: boolean;
+    showCharacterCount: boolean;
+    autoSize: boolean;
+    rows: number;
+    maxLength?: number;
+    label: string;
+    placeholder: string;
+    hint: string | null | undefined;
+    error: string | null | undefined;
+    success: string | null | undefined;
+    ariaLabel: string | null;
+}
+declare const TEXTAREA_LABELS: {
+    readonly characterCountSuffix: "caractères";
+    readonly characterCountSeparator: "/";
+};
+
+declare class PshTextareaComponent implements ControlValueAccessor, FormValueControl<string> {
+    private readonly elementRef;
+    private readonly cdr;
+    private static nextId;
+    readonly textareaId: string;
+    readonly value: _angular_core.ModelSignal<string>;
+    readonly disabled: _angular_core.ModelSignal<boolean>;
+    readonly readonly: _angular_core.ModelSignal<boolean>;
+    readonly touched: _angular_core.ModelSignal<boolean>;
+    variant: _angular_core.InputSignal<TextareaVariant>;
+    size: _angular_core.InputSignal<TextareaSize>;
+    resize: _angular_core.InputSignal<TextareaResize>;
+    rows: _angular_core.InputSignal<number>;
+    maxLength: _angular_core.InputSignal<number | undefined>;
+    autoSize: _angular_core.InputSignal<boolean>;
+    showCharacterCount: _angular_core.InputSignal<boolean>;
+    fullWidth: _angular_core.InputSignal<boolean>;
+    required: _angular_core.InputSignal<boolean>;
+    showLabel: _angular_core.InputSignal<boolean>;
+    label: _angular_core.InputSignal<string>;
+    placeholder: _angular_core.InputSignal<string>;
+    hint: _angular_core.InputSignal<string | null | undefined>;
+    error: _angular_core.InputSignal<string | null | undefined>;
+    success: _angular_core.InputSignal<string | null | undefined>;
+    ariaLabel: _angular_core.InputSignal<string | null>;
+    private readonly focusedSignal;
+    inputFocus: _angular_core.OutputEmitterRef<void>;
+    inputBlur: _angular_core.OutputEmitterRef<void>;
+    private textareaRef?;
+    focused: _angular_core.Signal<boolean>;
+    effectiveResize: _angular_core.Signal<TextareaResize>;
+    characterCount: _angular_core.Signal<{
+        current: number;
+        max: number | undefined;
+    }>;
+    isOverLimit: _angular_core.Signal<boolean>;
+    isAtLimit: _angular_core.Signal<boolean>;
+    shouldShowCount: _angular_core.Signal<boolean>;
+    hasError: _angular_core.Signal<boolean>;
+    computedAriaLabel: _angular_core.Signal<string | null>;
+    describedBy: _angular_core.Signal<string | null>;
+    state: _angular_core.Signal<"success" | "default" | "disabled" | "error" | "readonly" | "focused">;
+    characterCountLabel: "caractères";
+    constructor();
+    private onChange;
+    private onTouched;
+    writeValue(value: unknown): void;
+    registerOnChange(fn: (value: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    handleInput(event: Event): void;
+    handleFocus(): void;
+    handleBlur(): void;
+    focus(): void;
+    private applyAutoSize;
+    protected hasLabelContent(): boolean;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshTextareaComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshTextareaComponent, "psh-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "resize": { "alias": "resize"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "autoSize": { "alias": "autoSize"; "required": false; "isSignal": true; }; "showCharacterCount": { "alias": "showCharacterCount"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "readonly": "readonlyChange"; "touched": "touchedChange"; "inputFocus": "inputFocus"; "inputBlur": "inputBlur"; }, never, ["[textarea-label]", "[textarea-error]", "[textarea-success]", "[textarea-hint]"], true, never>;
+}
+
 /**
  * Type pour le mode d'affichage du menu
  */
@@ -1472,6 +1578,7 @@ interface SelectOptionGroup<T> {
     disabled?: boolean;
 }
 type SelectSize = 'small' | 'medium' | 'large';
+type SelectVariant = 'outlined' | 'filled';
 interface SearchConfig {
     debounceTime: number;
     placeholder: string;
@@ -1490,6 +1597,7 @@ declare class PshSelectComponent<T = unknown> implements ControlValueAccessor, F
     readonly disabled: _angular_core.ModelSignal<boolean>;
     readonly touched: _angular_core.ModelSignal<boolean>;
     size: _angular_core.InputSignal<SelectSize>;
+    variant: _angular_core.InputSignal<SelectVariant>;
     searchable: _angular_core.InputSignal<boolean>;
     multiple: _angular_core.InputSignal<boolean>;
     clearable: _angular_core.InputSignal<boolean>;
@@ -1549,7 +1657,7 @@ declare class PshSelectComponent<T = unknown> implements ControlValueAccessor, F
     private focusFirst;
     private focusLast;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshSelectComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshSelectComponent<any>, "psh-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "multiplePlaceholder": { "alias": "multiplePlaceholder"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "maxSelections": { "alias": "maxSelections"; "required": false; "isSignal": true; }; "minSelections": { "alias": "minSelections"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "searchConfig": { "alias": "searchConfig"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; "opened": "opened"; "closed": "closed"; "searched": "searched"; "scrollEnd": "scrollEnd"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshSelectComponent<any>, "psh-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "multiplePlaceholder": { "alias": "multiplePlaceholder"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "maxSelections": { "alias": "maxSelections"; "required": false; "isSignal": true; }; "minSelections": { "alias": "minSelections"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "searchConfig": { "alias": "searchConfig"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; "opened": "opened"; "closed": "closed"; "searched": "searched"; "scrollEnd": "scrollEnd"; }, never, never, true, never>;
 }
 
 /**
@@ -2100,7 +2208,7 @@ declare class PshTableComponent {
     emptyMessage: _angular_core.InputSignal<string>;
     noResultsMessage: _angular_core.InputSignal<string>;
     globalSearchPlaceholder: _angular_core.InputSignal<string>;
-    tableLayout: _angular_core.InputSignal<"fixed" | "auto">;
+    tableLayout: _angular_core.InputSignal<"auto" | "fixed">;
     truncateText: _angular_core.InputSignal<boolean>;
     expandable: _angular_core.InputSignal<boolean>;
     singleExpand: _angular_core.InputSignal<boolean>;
@@ -2403,19 +2511,30 @@ type Theme = 'light' | 'dark';
 interface ThemeConfig {
     isDark: boolean;
     name: Theme;
-    insurerTheme?: {
+    customerTheme?: {
         primaryColor: string;
         secondaryColor?: string;
     };
 }
 
-interface InsurerContextService {
+type ContrastTarget = 'AA' | 'AAA';
+
+/**
+ * Contract for applications that want to override brand colors.
+ * Kept generic (customer) so it can fit any vertical.
+ */
+interface CustomerContextService {
     primaryColor(): string;
     secondaryColor(): string;
 }
-declare const INSURER_CONTEXT_SERVICE: InjectionToken<InsurerContextService>;
+declare const CUSTOMER_CONTEXT_SERVICE: InjectionToken<CustomerContextService>;
+interface PshThemeOptions {
+    targetContrast?: ContrastTarget;
+}
+declare const PSH_THEME_OPTIONS: InjectionToken<PshThemeOptions>;
 declare class ThemeService {
-    private insurerContext;
+    private customerContext;
+    private options;
     private isDarkThemeSignal;
     private themeNameSignal;
     private lastChangeSignal;
@@ -2431,19 +2550,18 @@ declare class ThemeService {
     toggleTheme(): void;
     updateTheme(name: Theme): void;
     /**
-     * Applique les couleurs de l'assureur aux variables CSS
-     * Génère automatiquement toutes les variantes et les gradients
-     * Si aucun contexte assureur n'est fourni, les fallbacks CSS des thèmes sont utilisés
-     */
-    applyInsurerTheme(): void;
-    /**
-     * Initialise le thème au démarrage de l'application
-     * Utilise la préférence stockée ou le thème par défaut 'light'
+     * Applies the customer brand colors to CSS variables, automatically
+     * deriving variants in OKLCH and enforcing WCAG contrast against the
+     * current theme background. If the provided color is not accessible
+     * as a UI color, it is silently adjusted so UI components stay readable.
+     * The original brand color is preserved in --customer-*-color-source
+     * for purely decorative use (logos, marketing surfaces).
      */
+    applyCustomerTheme(): void;
+    private applyPalette;
+    private derivePalette;
+    private ensureIfInteractive;
     private initializeTheme;
-    /**
-     * Sauvegarde la préférence de thème dans le localStorage
-     */
     private saveThemePreference;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThemeService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<ThemeService>;
@@ -2488,5 +2606,5 @@ declare class ScrollService {
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<ScrollService>;
 }
 
-export { CHECKBOX_CONFIG, INPUT_LABELS, INSURER_CONTEXT_SERVICE, MODAL_CONFIG, ModalService, NgxTranslateProvider, PAGINATION_CONFIG, PROGRESSBAR_CONFIG, PshAlertComponent, PshAvatarComponent, PshBadgeComponent, PshButtonComponent, PshCardComponent, PshCheckboxComponent, PshCollapseComponent, PshDropdownComponent, PshFlowStepComponent, PshHorizontalCardComponent, PshInfoCardComponent, PshInputComponent, PshMenuComponent, PshModalComponent, PshPaginationComponent, PshProgressbarComponent, PshRadioComponent, PshSelectComponent, PshSidebarComponent, PshSpinLoaderComponent, PshStatCardComponent, PshStateFlowIndicatorComponent, PshStepComponent, PshStepperComponent, PshSwitchComponent, PshTabBarComponent, PshTabComponent, PshTableComponent, PshTabsComponent, PshTagComponent, PshToastComponent, PshToastService, PshTooltipComponent, RADIO_CONFIG, RADIO_STYLES, SIDEBAR_CONFIG, SPINLOADER_CONFIG, STATE_FLOW_INDICATOR_CONFIG, STEPPER_CONFIG, SWITCH_CONFIG, ScrollService, TABLE_CONFIG, TABS_CONFIG, TAB_BAR_CONFIG, TAG_CONFIG, TOAST_CONFIG, TOOLTIP_CONFIG, TRANSLATION_PROVIDER, ThemeService, ToastComponent, ToastService, provideTranslation };
-export type { AlertConfig, AlertLabels, AlertRole, AlertSize, AlertType, AutocompleteConfig, AvatarConfig, AvatarShape, AvatarSize, AvatarStatus, BadgeDisplayType, BadgePosition, BadgeSize, BadgeVariant, ButtonAppearance, ButtonIconPosition, ButtonSize, ButtonVariant, CardActionsAlignment, CardColorVariant, CardDensity, CardVariant, CheckboxConfig, CheckboxLabelPosition, CheckboxSize, CollapseSize, CollapseVariant, DropdownConfig, DropdownItem, DropdownPlacement, DropdownSize, FlowStepConfig, IconPosition, InfoCardData, InfoCardOptions, InfoCardVariant, InputConfig, InputSize, InputType, InputVariant, InsurerContextService, MenuItem, MenuMode, MenuVariant, ModalConfig, ModalSize, PaginationConfig, PaginationSize, PaginationVariant, ProgressbarConfig, ProgressbarLabelPosition, ProgressbarMode, ProgressbarSize, ProgressbarVariant, RadioConfig, RadioSize, SearchConfig, SelectOption, SelectOptionGroup, SelectSize, SidebarConfig, SidebarMode, SidebarPosition, SpinLoaderColor, SpinLoaderConfig, SpinLoaderSize, SpinLoaderVariant, StatCardLayout, StatCardVariant, StatTagVariant, StateFlowIndicatorAriaLabels, StateFlowIndicatorConfig, StateFlowIndicatorSize, StepConfig, StepperAriaLabels, StepperConfig, StepperVariant, SuggestionResult, SwitchConfig, SwitchSize, Tab, TabBarChangeEvent, TabBarConfig, TabBarItem, TabChangeEvent, TableCellContext, TableColumn, TableConfig, TableExpandedRowContext, TableRow, TableRowClickEvent, TableRowExpandEvent, TableSort, TabsConfig, TabsSize, TabsVariant, TagConfig, TagSize, TagVariant, Theme, ThemeConfig, Toast, ToastConfig, ToastPosition, ToastType, TooltipConfig, TooltipPosition, TooltipVariant, TranslationConfig, TranslationEntry, TranslationProvider };
+export { CHECKBOX_CONFIG, CUSTOMER_CONTEXT_SERVICE, INPUT_LABELS, MODAL_CONFIG, ModalService, NgxTranslateProvider, PAGINATION_CONFIG, PROGRESSBAR_CONFIG, PSH_THEME_OPTIONS, PshAlertComponent, PshAvatarComponent, PshBadgeComponent, PshButtonComponent, PshCardComponent, PshCheckboxComponent, PshCollapseComponent, PshDropdownComponent, PshFlowStepComponent, PshHorizontalCardComponent, PshInfoCardComponent, PshInputComponent, PshMenuComponent, PshModalComponent, PshPaginationComponent, PshProgressbarComponent, PshRadioComponent, PshSelectComponent, PshSidebarComponent, PshSpinLoaderComponent, PshStatCardComponent, PshStateFlowIndicatorComponent, PshStepComponent, PshStepperComponent, PshSwitchComponent, PshTabBarComponent, PshTabComponent, PshTableComponent, PshTabsComponent, PshTagComponent, PshTextareaComponent, PshToastComponent, PshToastService, PshTooltipComponent, RADIO_CONFIG, RADIO_STYLES, SIDEBAR_CONFIG, SPINLOADER_CONFIG, STATE_FLOW_INDICATOR_CONFIG, STEPPER_CONFIG, SWITCH_CONFIG, ScrollService, TABLE_CONFIG, TABS_CONFIG, TAB_BAR_CONFIG, TAG_CONFIG, TEXTAREA_LABELS, TOAST_CONFIG, TOOLTIP_CONFIG, TRANSLATION_PROVIDER, ThemeService, ToastComponent, ToastService, provideTranslation };
+export type { AlertConfig, AlertLabels, AlertRole, AlertSize, AlertType, AutocompleteConfig, AvatarConfig, AvatarShape, AvatarSize, AvatarStatus, BadgeDisplayType, BadgePosition, BadgeSize, BadgeVariant, ButtonAppearance, ButtonIconPosition, ButtonSize, ButtonVariant, CardActionsAlignment, CardColorVariant, CardDensity, CardVariant, CheckboxConfig, CheckboxLabelPosition, CheckboxSize, CollapseSize, CollapseVariant, CustomerContextService, DropdownAppearance, DropdownConfig, DropdownItem, DropdownPlacement, DropdownSize, DropdownVariant, FlowStepConfig, IconPosition, InfoCardData, InfoCardOptions, InfoCardVariant, InputConfig, InputSize, InputType, InputVariant, MenuItem, MenuMode, MenuVariant, ModalConfig, ModalSize, PaginationConfig, PaginationSize, PaginationVariant, ProgressbarConfig, ProgressbarLabelPosition, ProgressbarMode, ProgressbarSize, ProgressbarVariant, PshThemeOptions, RadioConfig, RadioSize, SearchConfig, SelectOption, SelectOptionGroup, SelectSize, SelectVariant, SidebarConfig, SidebarMode, SidebarPosition, SpinLoaderColor, SpinLoaderConfig, SpinLoaderSize, SpinLoaderVariant, StatCardLayout, StatCardVariant, StatTagVariant, StateFlowIndicatorAriaLabels, StateFlowIndicatorConfig, StateFlowIndicatorSize, StepConfig, StepperAriaLabels, StepperConfig, StepperVariant, SuggestionResult, SwitchConfig, SwitchSize, Tab, TabBarChangeEvent, TabBarConfig, TabBarItem, TabChangeEvent, TableCellContext, TableColumn, TableConfig, TableExpandedRowContext, TableRow, TableRowClickEvent, TableRowExpandEvent, TableSort, TabsConfig, TabsSize, TabsVariant, TagConfig, TagSize, TagVariant, TextareaConfig, TextareaResize, TextareaSize, TextareaVariant, Theme, ThemeConfig, Toast, ToastConfig, ToastPosition, ToastType, TooltipConfig, TooltipPosition, TooltipVariant, TranslationConfig, TranslationEntry, TranslationProvider };