@ajuarezso/sui-design-system 0.21.0 → 0.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (114) hide show
  1. package/docs/INDEX.md +30 -35
  2. package/docs/sui-accordion/README.md +171 -0
  3. package/docs/sui-activity-feed/README.md +154 -0
  4. package/docs/sui-activity-filter/README.md +100 -0
  5. package/docs/sui-alert/README.md +28 -19
  6. package/docs/sui-app-store-badge/README.md +5 -4
  7. package/docs/sui-avatar/README.md +16 -16
  8. package/docs/sui-avatar-group/README.md +4 -4
  9. package/docs/sui-badge/README.md +27 -9
  10. package/docs/sui-banner/README.md +10 -9
  11. package/docs/sui-brand-logo/README.md +3 -3
  12. package/docs/sui-breadcrumbs/README.md +1 -1
  13. package/docs/sui-button/README.md +64 -21
  14. package/docs/sui-button-group/README.md +6 -4
  15. package/docs/sui-button-group-item/README.md +3 -3
  16. package/docs/sui-card/README.md +17 -19
  17. package/docs/sui-chart-legend/README.md +8 -7
  18. package/docs/sui-checkbox/README.md +11 -6
  19. package/docs/sui-checkbox-card/README.md +24 -19
  20. package/docs/sui-checkbox-label/README.md +32 -10
  21. package/docs/sui-circular-progress-bar/README.md +2 -0
  22. package/docs/sui-color-dot/README.md +1 -1
  23. package/docs/sui-color-picker/README.md +22 -7
  24. package/docs/sui-command-menu-footer/README.md +100 -0
  25. package/docs/sui-command-menu-item/README.md +140 -0
  26. package/docs/sui-command-menu-search/README.md +105 -0
  27. package/docs/sui-compact-avatar-group/README.md +4 -3
  28. package/docs/sui-compact-button/README.md +41 -44
  29. package/docs/sui-compact-select/README.md +12 -5
  30. package/docs/sui-compact-select-for-input/README.md +5 -2
  31. package/docs/sui-content-card/README.md +6 -5
  32. package/docs/sui-content-divider/README.md +4 -4
  33. package/docs/sui-content-label/README.md +11 -6
  34. package/docs/sui-counter-input/README.md +21 -17
  35. package/docs/sui-date-selector/README.md +16 -12
  36. package/docs/sui-datepicker/README.md +46 -28
  37. package/docs/sui-day-cell/README.md +17 -8
  38. package/docs/sui-day-label/README.md +2 -2
  39. package/docs/sui-divider/README.md +5 -5
  40. package/docs/sui-drawer-footer/README.md +19 -5
  41. package/docs/sui-dropdown-caption/README.md +92 -0
  42. package/docs/sui-dropdown-item/README.md +163 -0
  43. package/docs/sui-dropdown-menu/README.md +196 -0
  44. package/docs/sui-dropdown-search/README.md +113 -0
  45. package/docs/sui-emoji/README.md +6 -6
  46. package/docs/sui-empty-state/README.md +13 -23
  47. package/docs/sui-fancy-button/README.md +24 -18
  48. package/docs/sui-file-icon/README.md +1 -1
  49. package/docs/sui-file-upload/README.md +3 -0
  50. package/docs/sui-file-upload-card/README.md +8 -7
  51. package/docs/sui-filter/README.md +181 -0
  52. package/docs/sui-flag/README.md +3 -2
  53. package/docs/sui-form-hint/README.md +12 -8
  54. package/docs/sui-form-label/README.md +11 -16
  55. package/docs/sui-href/README.md +85 -0
  56. package/docs/sui-icon/README.md +4 -3
  57. package/docs/sui-image-upload/README.md +28 -16
  58. package/docs/sui-img-retry/README.md +107 -0
  59. package/docs/sui-inline-input/README.md +7 -6
  60. package/docs/sui-inline-select/README.md +8 -5
  61. package/docs/sui-input/README.md +27 -33
  62. package/docs/sui-integration-switch/README.md +14 -7
  63. package/docs/sui-kbd/README.md +4 -4
  64. package/docs/sui-key-icon/README.md +6 -2
  65. package/docs/sui-link-button/README.md +21 -17
  66. package/docs/sui-modal/README.md +238 -0
  67. package/docs/sui-modal-footer/README.md +178 -0
  68. package/docs/sui-modal-header/README.md +115 -0
  69. package/docs/sui-modal-sheet/README.md +170 -0
  70. package/docs/sui-notification/README.md +8 -6
  71. package/docs/sui-notification-footer/README.md +2 -2
  72. package/docs/sui-notification-tab-menu/README.md +5 -3
  73. package/docs/sui-page-header/README.md +123 -0
  74. package/docs/sui-pagination/README.md +8 -5
  75. package/docs/sui-password-strength/README.md +1 -1
  76. package/docs/sui-period-range/README.md +18 -14
  77. package/docs/sui-popover/README.md +13 -7
  78. package/docs/sui-product-card/README.md +14 -10
  79. package/docs/sui-progress-bar/README.md +4 -2
  80. package/docs/sui-progress-bar-label/README.md +2 -0
  81. package/docs/sui-radio/README.md +14 -7
  82. package/docs/sui-radio-card/README.md +12 -12
  83. package/docs/sui-radio-label/README.md +36 -11
  84. package/docs/sui-rating/README.md +28 -9
  85. package/docs/sui-rich-editor/README.md +3 -3
  86. package/docs/sui-segmented-control/README.md +33 -19
  87. package/docs/sui-select/README.md +40 -33
  88. package/docs/sui-sidebar/README.md +216 -0
  89. package/docs/sui-slider/README.md +7 -0
  90. package/docs/sui-social-button/README.md +24 -11
  91. package/docs/sui-status-badge/README.md +7 -3
  92. package/docs/sui-stepper/README.md +30 -17
  93. package/docs/sui-store-card/README.md +9 -4
  94. package/docs/sui-switch/README.md +16 -11
  95. package/docs/sui-switch-card/README.md +18 -16
  96. package/docs/sui-switch-label/README.md +25 -11
  97. package/docs/sui-tab-chips/README.md +56 -39
  98. package/docs/sui-tab-menu-horizontal/README.md +19 -11
  99. package/docs/sui-tab-menu-vertical/README.md +10 -5
  100. package/docs/sui-table/README.md +264 -0
  101. package/docs/sui-tag/README.md +25 -11
  102. package/docs/sui-tag-input/README.md +25 -12
  103. package/docs/sui-textarea/README.md +23 -20
  104. package/docs/sui-time-picker/README.md +39 -30
  105. package/docs/sui-toast/README.md +27 -22
  106. package/docs/sui-tooltip/README.md +14 -17
  107. package/docs/sui-topbar/README.md +153 -0
  108. package/docs/sui-topbar-button/README.md +95 -0
  109. package/docs/sui-topbar-item/README.md +97 -0
  110. package/docs/sui-topbar-user/README.md +83 -0
  111. package/fesm2022/ajuarezso-sui-design-system.mjs +1076 -242
  112. package/fesm2022/ajuarezso-sui-design-system.mjs.map +1 -1
  113. package/package.json +1 -1
  114. package/types/ajuarezso-sui-design-system.d.ts +616 -280
@@ -1,5 +1,5 @@
1
1
  import * as _angular_core from '@angular/core';
2
- import { InjectionToken, Signal, TemplateRef, ElementRef, OnDestroy, AfterViewInit, QueryList } from '@angular/core';
2
+ import { InjectionToken, Signal, TemplateRef, ElementRef, OnDestroy, AfterViewInit, OnInit, QueryList } from '@angular/core';
3
3
  import { ControlValueAccessor } from '@angular/forms';
4
4
  export { addMonths, isSameDay, subMonths } from 'date-fns';
5
5
 
@@ -268,7 +268,7 @@ declare class SuiAccordion {
268
268
  * Si `true`, el contenido proyectado no se monta en el DOM hasta que el
269
269
  * accordion se abra por primera vez. Una vez montado queda en el DOM
270
270
  * (no se desmuenta al cerrar). Útil cuando hay muchos accordions con
271
- * contenido pesado y querés evitar pagar el cost de Angular CD para
271
+ * contenido pesado y quieres evitar pagar el cost de Angular CD para
272
272
  * componentes nunca abiertos.
273
273
  *
274
274
  * Default `false` (comportamiento clásico: contenido siempre en DOM,
@@ -881,6 +881,10 @@ declare class SuiActivityFilter {
881
881
  type SuiAlertVariant = 'info' | 'success' | 'warning' | 'error' | 'feature';
882
882
  type SuiAlertStyle = 'filled' | 'light' | 'lighter' | 'stroke' | 'stroke-dark';
883
883
  type SuiAlertSize = 'xsmall' | 'small' | 'large' | 'xlarge';
884
+ /** Cómo se anuncia el alert al lector de pantalla. `auto` (default): `alert`
885
+ * (asertivo) para error y warning, `status` (cortés) para el resto. `none`:
886
+ * sin rol propio, para cuando el contenedor ya anuncia (el toast). */
887
+ type SuiAlertRole = 'auto' | 'alert' | 'status' | 'none';
884
888
  /**
885
889
  * Action declarativo del alert. Canon SUI (Figma 170:1465 con
886
890
  * `doubleLink=true`): action[0] usa `underline: true`, el resto plain.
@@ -1021,6 +1025,13 @@ declare class SuiAlert {
1021
1025
  * Convención canon: action[0].underline = true (primary), rest plain.
1022
1026
  */
1023
1027
  readonly actions: _angular_core.InputSignal<readonly SuiAlertAction[]>;
1028
+ /**
1029
+ * Rol ARIA del alert (fix a11y 04-10-2026). Antes era `role="alert"` fijo:
1030
+ * los alerts informativos que solo explican se anunciaban de forma asertiva
1031
+ * al cargar la pantalla. Ver `SuiAlertRole`.
1032
+ */
1033
+ readonly ariaRole: _angular_core.InputSignal<SuiAlertRole>;
1034
+ readonly resolvedRole: _angular_core.Signal<"alert" | "status" | null>;
1024
1035
  readonly dismissed: _angular_core.WritableSignal<boolean>;
1025
1036
  readonly closed: _angular_core.OutputEmitterRef<void>;
1026
1037
  readonly iconName: _angular_core.Signal<string>;
@@ -1052,7 +1063,7 @@ declare class SuiAlert {
1052
1063
  readonly iconSize: _angular_core.Signal<number>;
1053
1064
  onDismiss(): void;
1054
1065
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiAlert, never>;
1055
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiAlert, "sui-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "variantStyle": { "alias": "variantStyle"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "autoHideOnDismiss": { "alias": "autoHideOnDismiss"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["[slot=action]"], true, never>;
1066
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiAlert, "sui-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "variantStyle": { "alias": "variantStyle"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "autoHideOnDismiss": { "alias": "autoHideOnDismiss"; "required": false; "isSignal": true; }; "actions": { "alias": "actions"; "required": false; "isSignal": true; }; "ariaRole": { "alias": "ariaRole"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["[slot=action]"], true, never>;
1056
1067
  }
1057
1068
 
1058
1069
  type SuiAppStoreBadgeCompany = 'app-store' | 'mac-app-store' | 'amazon-appstore' | 'galaxy-store' | 'huawei-appgallery' | 'f-droid' | 'google-play' | 'microsoft-store';
@@ -1592,7 +1603,7 @@ declare class SuiButtonGroupItem {
1592
1603
  /** aria-label para icon-only buttons */
1593
1604
  readonly ariaLabel: _angular_core.InputSignal<string>;
1594
1605
  /** Estado del data-attribute para CSS scoping */
1595
- readonly state: _angular_core.Signal<"default" | "disabled" | "active">;
1606
+ readonly state: _angular_core.Signal<"default" | "active" | "disabled">;
1596
1607
  /** True cuando solo tiene icon (left o right) sin label */
1597
1608
  readonly onlyIcon: _angular_core.Signal<boolean>;
1598
1609
  /**
@@ -1769,7 +1780,12 @@ declare class SuiButton {
1769
1780
  readonly leftIcon: _angular_core.InputSignal<string | null>;
1770
1781
  readonly rightIcon: _angular_core.InputSignal<string | null>;
1771
1782
  readonly type: _angular_core.InputSignal<"button" | "submit" | "reset">;
1772
- /** Intercept click/Enter/Space — cuando type=submit, busca el form padre y
1783
+ private _spacePressed;
1784
+ private _esDelHost;
1785
+ _onEnter(event: Event): void;
1786
+ _onSpaceDown(event: Event): void;
1787
+ _onSpaceUp(event: Event): void;
1788
+ /** Intercept click — cuando type=submit, busca el form padre y
1773
1789
  dispara requestSubmit(). Reset hace lo mismo con form.reset(). Disabled
1774
1790
  bloquea todo. */
1775
1791
  _onClick(event: Event): void;
@@ -2038,6 +2054,9 @@ declare class SuiCheckbox implements ControlValueAccessor {
2038
2054
  readonly checked: _angular_core.ModelSignal<boolean>;
2039
2055
  readonly indeterminate: _angular_core.InputSignal<boolean>;
2040
2056
  readonly disabled: _angular_core.InputSignal<boolean>;
2057
+ /** false = fuera del orden de Tab (tabindex -1). Para cuando un padre (card,
2058
+ * label) es el control enfocable y este checkbox solo dibuja el estado. */
2059
+ readonly focusable: _angular_core.InputSignal<boolean>;
2041
2060
  private readonly _disabledByForm;
2042
2061
  readonly isDisabled: _angular_core.Signal<boolean>;
2043
2062
  private _onChange;
@@ -2048,7 +2067,7 @@ declare class SuiCheckbox implements ControlValueAccessor {
2048
2067
  registerOnTouched(fn: any): void;
2049
2068
  setDisabledState(isDisabled: boolean): void;
2050
2069
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiCheckbox, never>;
2051
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCheckbox, "sui-checkbox", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
2070
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCheckbox, "sui-checkbox", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "focusable": { "alias": "focusable"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
2052
2071
  }
2053
2072
 
2054
2073
  type SuiCheckboxCardType = 'basic' | 'left-icon' | 'avatar' | 'card-provider' | 'brand' | 'company';
@@ -2164,7 +2183,7 @@ declare class SuiCheckboxCard implements ControlValueAccessor {
2164
2183
  /** RemixIcon name (sin prefijo "ri-") para type='left-icon'. */
2165
2184
  readonly icon: _angular_core.InputSignal<string | null>;
2166
2185
  /** Emoji del catálogo SUI_EMOJI_MAP — alternativa a icon para type='left-icon'. */
2167
- readonly emoji: _angular_core.InputSignal<"warning" | "label" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
2186
+ readonly emoji: _angular_core.InputSignal<"label" | "warning" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
2168
2187
  /** URL directa al emoji para type='left-icon'. Precedencia: icon > emoji > iconSrc. */
2169
2188
  readonly iconSrc: _angular_core.InputSignal<string | null>;
2170
2189
  /** URL de imagen para type='avatar'. Si falla, fallback a iniciales del label. */
@@ -2308,7 +2327,7 @@ declare class SuiLinkButton {
2308
2327
  * `large` y `xlarge` son extensión SUI (03-10-2026, pedido del dueño) para mobile:
2309
2328
  * le pasan el tamaño al sui-checkbox interno (24 / 28) y suben la tipografía.
2310
2329
  */
2311
- type SuiCheckboxLabelSize = 'medium' | 'large' | 'xlarge';
2330
+ type SuiCheckboxLabelSize = 'medium' | 'large' | 'xlarge' | '2xlarge';
2312
2331
  /**
2313
2332
  * SUI Checkbox Label — SUI Design System 2.0
2314
2333
  *
@@ -2373,6 +2392,12 @@ type SuiCheckboxLabelSize = 'medium' | 'large' | 'xlarge';
2373
2392
  * <sui-checkbox-label label="Confirmar" [flip]="true" [(active)]="confirm" />
2374
2393
  */
2375
2394
  declare class SuiCheckboxLabel implements ControlValueAccessor {
2395
+ private static _nextId;
2396
+ /** El sui-checkbox interno es el tab stop: toma su nombre del texto del label
2397
+ * (aria-labelledby) y su descripción de la descripción (revisión 04-10-2026;
2398
+ * antes un lector anunciaba «casilla, no marcada» sin el texto). */
2399
+ protected readonly labelId: string;
2400
+ protected readonly descriptionId: string;
2376
2401
  /** Texto principal del label. */
2377
2402
  readonly label: _angular_core.InputSignal<string>;
2378
2403
  /** Sublabel opcional (12/16 sub-600 al lado del label). */
@@ -2396,11 +2421,17 @@ declare class SuiCheckboxLabel implements ControlValueAccessor {
2396
2421
  /**
2397
2422
  * Tamaño. `medium` (default, Figma): control 20, label 14/20.
2398
2423
  * Extensión SUI (03-10-2026) para tocar en mobile:
2399
- * - `large`: control 24, label 16/24, sublabel y descripción 14/20, badge medium.
2400
- * - `xlarge`: control 28, label 16/24, sublabel y descripción 14/20, badge large.
2424
+ * - `large`: control 24, label 16/24, sublabel y descripción 12/16 (dueño 04-10-2026), badge medium.
2425
+ * - `xlarge`: control 28, label 16/24, sublabel y descripción 12/16 (dueño 04-10-2026), badge large.
2426
+ * - `2xlarge` (canon, dueño 04-10-2026: piso táctil 44 en el teléfono): la
2427
+ * fila mide 44 como mínimo (`min-height`), control 28 (el mayor del
2428
+ * checkbox), label 16/24, sublabel y descripción 12/16, badge large.
2401
2429
  * El badge toma este default solo si su config no trae `size`.
2402
2430
  */
2403
2431
  readonly size: _angular_core.InputSignal<SuiCheckboxLabelSize>;
2432
+ /** Size del sui-checkbox interno: `2xlarge` es un alto de fila, el control
2433
+ * se queda en su tamaño mayor (28). */
2434
+ protected readonly controlSize: _angular_core.Signal<SuiCheckboxSize>;
2404
2435
  /** Badge por default según el tamaño (si la config no fija uno). */
2405
2436
  protected readonly badgeSize: _angular_core.Signal<SuiBadgeSize>;
2406
2437
  /** El link-button tiene dos tamaños: small (12/16) en Figma, medium (14/20) en mobile. */
@@ -2635,7 +2666,7 @@ declare class SuiColorDot {
2635
2666
  * - `selected` → dot 12×12 + ring 2px.
2636
2667
  * - `disabled` → dot gris pálido, sin pointer events.
2637
2668
  */
2638
- readonly state: _angular_core.InputSignal<"default" | "disabled" | "selected" | "hover">;
2669
+ readonly state: _angular_core.InputSignal<"default" | "disabled" | "hover" | "selected">;
2639
2670
  /**
2640
2671
  * Tamaño. `medium` (default, Figma 24): dot 16 / hover 14 / selected 12 + anillo 18.
2641
2672
  * `large` (32, extensión SUI para mobile): dot 22 / hover 18 / selected 16 + anillo 24.
@@ -2651,6 +2682,9 @@ declare class SuiColorDot {
2651
2682
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiColorDot, "sui-color-dot", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "customHex": { "alias": "customHex"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
2652
2683
  }
2653
2684
 
2685
+ /** Tamaño del color picker: `medium` (trigger 38, default) · `large` (trigger
2686
+ * 44, size nuevo 04-10-2026 — piso táctil 44 en el teléfono). */
2687
+ type SuiColorPickerSize = 'medium' | 'large';
2654
2688
  /**
2655
2689
  * SUI Color Picker — SUI Design System 2.0
2656
2690
  *
@@ -2764,6 +2798,10 @@ declare class SuiColorPicker {
2764
2798
  /** Muestra el label del formato ("Hex") + chevron arriba del input. */
2765
2799
  readonly showFormatLabel: _angular_core.InputSignal<boolean>;
2766
2800
  readonly disabled: _angular_core.InputSignal<boolean>;
2801
+ /** `medium` (default): trigger de 38, puntos de 24 · `large`: trigger de 44
2802
+ * con texto 16 y puntos del panel de 32 separados 12 (paso de 44) — size
2803
+ * nuevo 04-10-2026 (dueño: piso táctil 44 en el teléfono). */
2804
+ readonly size: _angular_core.InputSignal<SuiColorPickerSize>;
2767
2805
  /** aria-label del trigger. */
2768
2806
  readonly ariaLabel: _angular_core.InputSignal<string>;
2769
2807
  /** Emitido cuando el value cambia (cualquier interacción). */
@@ -2849,6 +2887,9 @@ declare class SuiColorPicker {
2849
2887
  readonly opacityColor: _angular_core.Signal<string>;
2850
2888
  /** Color con alpha aplicado (rgba) para el thumb del opacity slider. */
2851
2889
  readonly opacityThumbColor: _angular_core.Signal<string>;
2890
+ /** Color de la muestra del trigger: el token del preset (igual que
2891
+ * sui-color-dot) o el color libre con alpha. */
2892
+ readonly swatchColor: _angular_core.Signal<string>;
2852
2893
  /** Color del dot preview en el trigger (con alpha si aplica). */
2853
2894
  readonly previewColor: _angular_core.Signal<string>;
2854
2895
  /** Round del hue para aria-valuenow (sin pipe) */
@@ -2889,7 +2930,7 @@ declare class SuiColorPicker {
2889
2930
  protected onOpacityFieldCommit(ev: Event): void;
2890
2931
  protected onEyedropper(): Promise<void>;
2891
2932
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiColorPicker, never>;
2892
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiColorPicker, "sui-color-picker", never, { "colors": { "alias": "colors"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "recommendedLabel": { "alias": "recommendedLabel"; "required": false; "isSignal": true; }; "presetsOnly": { "alias": "presetsOnly"; "required": false; "isSignal": true; }; "alpha": { "alias": "alpha"; "required": false; "isSignal": true; }; "eyedropper": { "alias": "eyedropper"; "required": false; "isSignal": true; }; "showFormatLabel": { "alias": "showFormatLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "change": "change"; }, never, never, true, never>;
2933
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiColorPicker, "sui-color-picker", never, { "colors": { "alias": "colors"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "recommendedLabel": { "alias": "recommendedLabel"; "required": false; "isSignal": true; }; "presetsOnly": { "alias": "presetsOnly"; "required": false; "isSignal": true; }; "alpha": { "alias": "alpha"; "required": false; "isSignal": true; }; "eyedropper": { "alias": "eyedropper"; "required": false; "isSignal": true; }; "showFormatLabel": { "alias": "showFormatLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "change": "change"; }, never, never, true, never>;
2893
2934
  }
2894
2935
 
2895
2936
  /**
@@ -3151,7 +3192,7 @@ declare class SuiCompactAvatarGroup {
3151
3192
  }
3152
3193
 
3153
3194
  type SuiCompactButtonStyle = 'stroke' | 'ghost' | 'modifiable' | 'white';
3154
- type SuiCompactButtonSize = 'medium' | 'large' | 'xlarge' | '2xlarge' | '3xlarge' | '4xlarge';
3195
+ type SuiCompactButtonSize = 'medium' | 'large' | 'xlarge' | '2xlarge' | '3xlarge' | '4xlarge' | '5xlarge';
3155
3196
  /**
3156
3197
  * SUI Compact Button — SUI Design System 2.0
3157
3198
  *
@@ -3175,6 +3216,8 @@ type SuiCompactButtonSize = 'medium' | 'large' | 'xlarge' | '2xlarge' | '3xlarge
3175
3216
  * Medium: 20×20 container, icon 16×16
3176
3217
  * 2xlarge 32 / 3xlarge 36 / 4xlarge 40 (extensión SUI, 03-10-2026): para
3177
3218
  * tocar con el dedo en mobile; íconos 20 / 20 / 24 como sui-button.
3219
+ * 5xlarge 44 (dueño, 04-10-2026: piso táctil 44 en el teléfono): ícono 24,
3220
+ * el mismo de 4xlarge — crece el área, no el dibujo del ícono.
3178
3221
  *
3179
3222
  * Style=Stroke (node 189:3645):
3180
3223
  * bg: var(--sui-bg-white-0)
@@ -3326,7 +3369,7 @@ declare class SuiCompactSelectForInput<T = string> implements ControlValueAccess
3326
3369
  readonly arrowIcon: _angular_core.Signal<"arrow-up-s-line" | "arrow-down-s-line">;
3327
3370
  readonly displayValue: _angular_core.Signal<string>;
3328
3371
  readonly displayFlag: _angular_core.Signal<"abkhazia" | "afghanistan" | "aland-islands" | "albania" | "algeria" | "american-samoa" | "andorra" | "angola" | "anguilla" | "antigua-and-barbuda" | "argentina" | "armenia" | "aruba" | "australia" | "austria" | "azerbaijan" | "azores-islands" | "bahamas" | "bahrain" | "balearic-islands" | "bangladesh" | "barbados" | "basque-country" | "belarus" | "belgium" | "belize" | "benin" | "bermuda" | "bhutan" | "bolivia" | "bonaire" | "bosnia-and-herzegovina" | "botswana" | "brazil" | "british-columbia" | "british-indian-ocean-territory" | "british-virgin-islands" | "brunei" | "bulgaria" | "burkina-faso" | "burundi" | "cambodia" | "cameroon" | "canada" | "canary-islands" | "cape-verde" | "cayman-islands" | "central-african-republic" | "ceuta" | "chad" | "chile" | "china" | "christmas-island" | "cocos-island" | "colombia" | "comoros" | "cook-islands" | "corsica" | "costa-rica" | "croatia" | "cuba" | "curacao" | "cyprus" | "czech-republic" | "democratic-republic-of-congo" | "denmark" | "djibouti" | "dominica" | "dominican-republic" | "east-timor" | "ecuador" | "egypt" | "el-salvador" | "england" | "equatorial-guinea" | "eritrea" | "estonia" | "ethiopia" | "european-union" | "falkland-islands" | "faroe-islands" | "fiji" | "finland" | "france" | "french-polynesia" | "gabon" | "galapagos-islands" | "gambia" | "georgia" | "germany" | "ghana" | "gibraltar" | "greece" | "greenland" | "grenada" | "guam" | "guatemala" | "guernsey" | "guinea-bissau" | "guinea" | "guyana" | "haiti" | "hawaii" | "honduras" | "hong-kong" | "hungary" | "iceland" | "india" | "indonesia" | "iran" | "iraq" | "ireland" | "isle-of-man" | "israel" | "italy" | "ivory-coast" | "jamaica" | "japan" | "jersey" | "jordan" | "kazakhstan" | "kenya" | "kiribati" | "kosovo" | "kuwait" | "kyrgyzstan" | "laos" | "latvia" | "lebanon" | "lesotho" | "liberia" | "libya" | "liechtenstein" | "lithuania" | "luxembourg" | "macao" | "madagascar" | "madeira" | "malawi" | "malaysia" | "maldives" | "mali" | "malta" | "marshall-island" | "martinique" | "mauritania" | "mauritus" | "melilla" | "mexico" | "micronesia" | "moldova" | "monaco" | "mongolia" | "montenegro" | "montserrat" | "morocco" | "mozambique" | "myanmar" | "namibia" | "nato" | "nauru" | "nepal" | "netherlands" | "new-zealand" | "nicaragua" | "niger" | "nigeria" | "niue" | "norfolk-island" | "north-korea" | "northern-cyprus" | "northern-marianas-islands" | "norway" | "oman" | "orkney-islands" | "ossetia" | "pakistan" | "palau" | "palestine" | "panama" | "papua-new-guinea" | "paraguay" | "peru" | "philippines" | "pitcairn-islands" | "poland" | "portugal" | "puerto-rico" | "qatar" | "rapa-nui" | "republic-of-macedonia" | "republic-of-the-congo" | "romania" | "russia" | "rwanda" | "saba-island" | "sahrawi-arab-democratic-republic" | "saint-kitts-and-nevis" | "samoa" | "san-marino" | "sao-tome-and-prince" | "sardinia" | "saudi-arabia" | "scotland" | "senegal" | "serbia" | "seychelles" | "sierra-leone" | "singapore" | "sint-eustatius" | "sint-maarten" | "slovakia" | "slovania" | "solomon-islands" | "somalia" | "somaliland" | "south-africa" | "south-korea" | "south-sudan" | "spain" | "sri-lanka" | "st-barts" | "st-lucia" | "st-vincent-and-the-grenadines" | "sudan" | "suriname" | "swaziland" | "sweden" | "switzerland" | "syria" | "taijikistan" | "taiwan" | "tanzania" | "thailand" | "tibet" | "togo" | "tokelau" | "tonga" | "transnistria" | "trinidad-and-tobago" | "tunisia" | "turkey" | "turkmenistan" | "turks-and-caicos" | "tuvalu" | "uganda" | "ukraine" | "united-arab-emirates" | "united-kingdom" | "united-nations" | "united-states" | "uruguay" | "uzbekistan" | "vanuatu" | "vatican-city" | "venezuela" | "vietnam" | "virgin-islands" | "wales" | "yemen" | "zambia" | "zimbabwe" | null>;
3329
- readonly flagSizePx: _angular_core.Signal<16 | 20>;
3372
+ readonly flagSizePx: _angular_core.Signal<20 | 16>;
3330
3373
  onHostClick(event: Event): void;
3331
3374
  protected onMenuOpenedChange(open: boolean): void;
3332
3375
  protected selectItem(item: SuiCompactSelectForInputItem<T>): void;
@@ -3412,6 +3455,13 @@ declare class SuiCompactSelect<T = string> implements ControlValueAccessor {
3412
3455
  readonly selected: _angular_core.ModelSignal<SuiCompactSelectItem<T> | null>;
3413
3456
  readonly error: _angular_core.InputSignal<boolean>;
3414
3457
  readonly disabled: _angular_core.InputSignal<boolean>;
3458
+ /**
3459
+ * Nombre accesible del trigger (fix a11y 04-10-2026). Imprescindible con
3460
+ * `type="icon"`, que no muestra texto: sin esto el lector anunciaba «botón»
3461
+ * sin decir qué elige. Sin `ariaLabel`, el tipo icon usa el label del ítem
3462
+ * elegido o el placeholder.
3463
+ */
3464
+ readonly ariaLabel: _angular_core.InputSignal<string | null>;
3415
3465
  readonly clicked: _angular_core.OutputEmitterRef<Event>;
3416
3466
  readonly selectedChange: _angular_core.OutputEmitterRef<SuiCompactSelectItem<T>>;
3417
3467
  /** Disabled state desde FormControl (vía setDisabledState del CVA). */
@@ -3451,13 +3501,14 @@ declare class SuiCompactSelect<T = string> implements ControlValueAccessor {
3451
3501
  onTriggerClick(event: Event): void;
3452
3502
  /** Sincroniza isOpen y dispara _onTouched cuando el menu se abre. */
3453
3503
  protected onMenuOpenedChange(open: boolean): void;
3504
+ protected readonly triggerAriaLabel: _angular_core.Signal<string | null>;
3454
3505
  protected selectItem(item: SuiCompactSelectItem<T>): void;
3455
3506
  writeValue(value: T | null): void;
3456
3507
  registerOnChange(fn: (v: T | null) => void): void;
3457
3508
  registerOnTouched(fn: () => void): void;
3458
3509
  setDisabledState(isDisabled: boolean): void;
3459
3510
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiCompactSelect<any>, never>;
3460
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCompactSelect<any>, "sui-compact-select", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "flag": { "alias": "flag"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "selected": "selectedChange"; "clicked": "clicked"; "selectedChange": "selectedChange"; }, never, never, true, never>;
3511
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCompactSelect<any>, "sui-compact-select", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "flag": { "alias": "flag"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "selected": "selectedChange"; "clicked": "clicked"; "selectedChange": "selectedChange"; }, never, never, true, never>;
3461
3512
  }
3462
3513
 
3463
3514
  /**
@@ -3540,6 +3591,11 @@ type SuiContentLabelBadgePlacement = 'trailing' | 'title';
3540
3591
  * label="Ana Torres" description="ana@correo.com" />
3541
3592
  */
3542
3593
  declare class SuiContentLabel {
3594
+ private static _nextId;
3595
+ /** El toggle (sui-switch) toma su nombre del label (aria-labelledby) y su
3596
+ * descripción de la descripción (revisión 04-10-2026). */
3597
+ protected readonly labelId: string;
3598
+ protected readonly descriptionId: string;
3543
3599
  /** Tipo de leading visual. */
3544
3600
  readonly type: _angular_core.InputSignal<SuiContentLabelType>;
3545
3601
  /** Size del set: medium (leading 40, Label/Small) | large (leading 48, Label/Medium). */
@@ -4012,6 +4068,11 @@ declare class SuiCounterInput implements ControlValueAccessor {
4012
4068
  readonly ariaLabel: _angular_core.InputSignal<string | null>;
4013
4069
  readonly decrementLabel: _angular_core.InputSignal<string>;
4014
4070
  readonly incrementLabel: _angular_core.InputSignal<string>;
4071
+ /** a11y (04-10-2026): el spinbutton toma su nombre del label visible
4072
+ * (aria-labelledby) salvo que se pase `ariaLabel`, y se describe con el hint. */
4073
+ protected readonly _labelId: string;
4074
+ protected readonly _hintId: string;
4075
+ protected readonly _hintMessage: _angular_core.Signal<string | null>;
4015
4076
  private readonly _disabledByForm;
4016
4077
  readonly isDisabled: _angular_core.Signal<boolean>;
4017
4078
  private readonly _cvaValue;
@@ -4034,6 +4095,10 @@ declare class SuiCounterInput implements ControlValueAccessor {
4034
4095
  private commit;
4035
4096
  decrement(): void;
4036
4097
  increment(): void;
4098
+ /** a11y (04-10-2026): patrón spinbutton — el valor es enfocable y responde a
4099
+ * flechas ↑/↓ (un paso) y a Inicio/Fin (al mínimo/máximo, solo si están
4100
+ * definidos). Antes solo se operaba con los botones − / +. */
4101
+ onSpinKeydown(event: KeyboardEvent): void;
4037
4102
  writeValue(v: number): void;
4038
4103
  registerOnChange(fn: (v: number) => void): void;
4039
4104
  registerOnTouched(fn: () => void): void;
@@ -4042,6 +4107,12 @@ declare class SuiCounterInput implements ControlValueAccessor {
4042
4107
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCounterInput, "sui-counter-input", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "decrementLabel": { "alias": "decrementLabel"; "required": false; "isSignal": true; }; "incrementLabel": { "alias": "incrementLabel"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
4043
4108
  }
4044
4109
 
4110
+ /**
4111
+ * medium (default) = 36 de alto con flechas de 24 (Figma 442:192). large = 52
4112
+ * de alto con flechas de 44 y texto 16/24: canon del dueño 04-10-2026 (piso
4113
+ * táctil de 44 en el teléfono).
4114
+ */
4115
+ type SuiDateSelectorSize = 'medium' | 'large';
4045
4116
  /**
4046
4117
  * SUI Date Selector — SUI Design System 2.0
4047
4118
  *
@@ -4082,12 +4153,14 @@ declare class SuiDateSelector {
4082
4153
  readonly rightIcon: _angular_core.InputSignal<boolean>;
4083
4154
  /** Disabled global — deshabilita ambos arrows. */
4084
4155
  readonly disabled: _angular_core.InputSignal<boolean>;
4156
+ /** medium 36 con flechas de 24 (default) · large 52 con flechas de 44 (dueño 04-10-2026). */
4157
+ readonly size: _angular_core.InputSignal<SuiDateSelectorSize>;
4085
4158
  readonly prev: _angular_core.OutputEmitterRef<void>;
4086
4159
  readonly next: _angular_core.OutputEmitterRef<void>;
4087
4160
  onPrev(): void;
4088
4161
  onNext(): void;
4089
4162
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiDateSelector, never>;
4090
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiDateSelector, "sui-date-selector", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "leftIcon": { "alias": "leftIcon"; "required": false; "isSignal": true; }; "rightIcon": { "alias": "rightIcon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "prev": "prev"; "next": "next"; }, never, never, true, never>;
4163
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiDateSelector, "sui-date-selector", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "leftIcon": { "alias": "leftIcon"; "required": false; "isSignal": true; }; "rightIcon": { "alias": "rightIcon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "prev": "prev"; "next": "next"; }, never, never, true, never>;
4091
4164
  }
4092
4165
 
4093
4166
  type DatepickerPresetId = 'today' | 'last-7' | 'last-30' | 'last-3-months' | 'last-12-months' | 'month-to-date' | 'year-to-date' | 'all-time';
@@ -4140,6 +4213,9 @@ declare const DAY_LABELS_ES: readonly string[];
4140
4213
  * minúscula; la regla de copy del proyecto es sentence case). Fix 03-10-2026. */
4141
4214
  declare function formatMonthYear(date: Date): string;
4142
4215
  declare function formatDateShort(date: Date): string;
4216
+ /** «martes 7 de octubre de 2026» — nombre accesible de una celda de día
4217
+ * (fix 04-10-2026: antes se leía «Día 7», sin mes ni año). */
4218
+ declare function formatDateLong(date: Date): string;
4143
4219
  declare function formatDateInput(date: Date): string;
4144
4220
 
4145
4221
  type SuiDatepickerMode = 'date' | 'range';
@@ -4149,8 +4225,11 @@ type SuiDatepickerCalendars = 1 | 2;
4149
4225
  * `small` y `large` son extensión SUI (03-10-2026): large es el de mobile, el
4150
4226
  * mismo alto que sui-input/sui-select large. Con large (y siempre en mobile)
4151
4227
  * las flechas de mes miden 40 y Cancelar/Aplicar van en large.
4228
+ * `xlarge` (canon del dueño 04-10-2026, piso táctil de 44 en el teléfono):
4229
+ * campo de 52, días de 44 × 44, flechas de mes de 44, rangos predefinidos
4230
+ * de 44 y Cancelar/Aplicar en large.
4152
4231
  */
4153
- type SuiDatepickerSize = 'small' | 'medium' | 'large';
4232
+ type SuiDatepickerSize = 'small' | 'medium' | 'large' | 'xlarge';
4154
4233
  interface SuiDateRange {
4155
4234
  start: Date | null;
4156
4235
  end: Date | null;
@@ -4245,7 +4324,7 @@ declare class SuiDatepicker implements ControlValueAccessor {
4245
4324
  readonly calendars: _angular_core.InputSignal<SuiDatepickerCalendars>;
4246
4325
  /** Renderiza el calendar inline (sin trigger ni popover). */
4247
4326
  readonly inline: _angular_core.InputSignal<boolean>;
4248
- /** Alto del campo: small 36 · medium 40 (default) · large 48 (ver SuiDatepickerSize). */
4327
+ /** Alto del campo: small 36 · medium 40 (default) · large 48 · xlarge 52 con días de 44 (ver SuiDatepickerSize). */
4249
4328
  readonly size: _angular_core.InputSignal<SuiDatepickerSize>;
4250
4329
  /** Placeholder del input cuando no hay valor seleccionado. */
4251
4330
  readonly placeholder: _angular_core.InputSignal<string>;
@@ -4294,6 +4373,12 @@ declare class SuiDatepicker implements ControlValueAccessor {
4294
4373
  * tocarlos con el dedo (extensión SUI, 03-10-2026); small (36, Figma) si no.
4295
4374
  */
4296
4375
  readonly footerButtonSize: _angular_core.Signal<"small" | "large">;
4376
+ /**
4377
+ * Tamaño de las piezas del panel (días, flechas de mes, rangos predefinidos):
4378
+ * `large` (44) solo con el campo xlarge — canon del dueño 04-10-2026, piso
4379
+ * táctil de 44. Con el resto de sizes, las piezas de siempre (medium).
4380
+ */
4381
+ readonly partSize: _angular_core.Signal<"medium" | "large">;
4297
4382
  readonly effectiveCalendars: _angular_core.Signal<SuiDatepickerCalendars>;
4298
4383
  private _onChange;
4299
4384
  private _onTouched;
@@ -4315,8 +4400,22 @@ declare class SuiDatepicker implements ControlValueAccessor {
4315
4400
  */
4316
4401
  private _toRows;
4317
4402
  readonly dayLabels: readonly string[];
4403
+ /** Preset «Todo el tiempo» aplicado: su valor es `{ start: null, end: null }`,
4404
+ * igual que «nada elegido», así que se recuerda aparte para el trigger. */
4405
+ private readonly _todoElTiempoAplicado;
4318
4406
  /** Texto del trigger input. */
4319
4407
  readonly triggerText: _angular_core.Signal<string>;
4408
+ /** ¿El trigger muestra un valor (no el placeholder)? Pinta el texto oscuro. */
4409
+ readonly hasDisplayValue: _angular_core.Signal<boolean>;
4410
+ /** Nombre del panel para el lector de pantalla (role dialog / group). */
4411
+ readonly panelAriaLabel: _angular_core.Signal<"Elegir período" | "Elegir fecha">;
4412
+ /** «martes 7 de octubre de 2026» para cada celda (antes «Día 7»). */
4413
+ cellAriaLabel(cell: CalendarCell): string;
4414
+ /** a11y (04-10-2026): flechas dentro de la grilla mueven el foco entre los
4415
+ * días habilitados (← → un día, ↑ ↓ una semana), Inicio/Fin a la punta de
4416
+ * la semana. No cambia de mes: la grilla ya trae los días de los meses
4417
+ * vecinos que completan las semanas. */
4418
+ onGridKeydown(event: KeyboardEvent): void;
4320
4419
  /** Texto del Range hint del footer. */
4321
4420
  readonly rangeHint: _angular_core.Signal<string | null>;
4322
4421
  toggle(): void;
@@ -4350,6 +4449,12 @@ declare class SuiDatepicker implements ControlValueAccessor {
4350
4449
  }
4351
4450
 
4352
4451
  type SuiDayCellType = 'basic' | 'range';
4452
+ /**
4453
+ * medium (default) = 40 × 40 (Figma 437:174). large = 44 × 44, texto 16/24:
4454
+ * canon del dueño 04-10-2026 (piso táctil de 44 en el teléfono). En 390 px
4455
+ * entran 7 × 44 con gap 4 (332).
4456
+ */
4457
+ type SuiDayCellSize = 'medium' | 'large';
4353
4458
  /**
4354
4459
  * SUI Day Cell — SUI Design System 2.0
4355
4460
  *
@@ -4403,6 +4508,8 @@ declare class SuiDayCell {
4403
4508
  readonly day: _angular_core.InputSignal<string | number>;
4404
4509
  /** Type=Basic (default) o Range (entre extremos / extremo del range). */
4405
4510
  readonly type: _angular_core.InputSignal<SuiDayCellType>;
4511
+ /** medium 40 × 40 (default) · large 44 × 44 (piso táctil, dueño 04-10-2026). */
4512
+ readonly size: _angular_core.InputSignal<SuiDayCellSize>;
4406
4513
  /** Position dentro del range — solo aplica si type=range. */
4407
4514
  readonly rangePosition: _angular_core.InputSignal<"start" | "end" | "in" | null>;
4408
4515
  /** Selected (mode date) o range extremo (start/end con bg primary). */
@@ -4418,10 +4525,13 @@ declare class SuiDayCell {
4418
4525
  /** aria-label personalizado para el button (default "Día {N}"). */
4419
4526
  readonly ariaLabel: _angular_core.InputSignal<string | null>;
4420
4527
  readonly clicked: _angular_core.OutputEmitterRef<MouseEvent>;
4528
+ /** a11y (04-10-2026): seleccionado = `selected` (mode date) o un extremo del
4529
+ * rango (inicio/fin); antes los extremos del rango no se anunciaban. */
4530
+ readonly ariaSelected: _angular_core.Signal<boolean>;
4421
4531
  readonly resolvedAriaLabel: _angular_core.Signal<string>;
4422
4532
  onClick(event: MouseEvent): void;
4423
4533
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiDayCell, never>;
4424
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiDayCell, "sui-day-cell", never, { "day": { "alias": "day"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "rangePosition": { "alias": "rangePosition"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "marked": { "alias": "marked"; "required": false; "isSignal": true; }; "today": { "alias": "today"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "outOfMonth": { "alias": "outOfMonth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
4534
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiDayCell, "sui-day-cell", never, { "day": { "alias": "day"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "rangePosition": { "alias": "rangePosition"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "marked": { "alias": "marked"; "required": false; "isSignal": true; }; "today": { "alias": "today"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "outOfMonth": { "alias": "outOfMonth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
4425
4535
  }
4426
4536
 
4427
4537
  /**
@@ -4457,6 +4567,10 @@ declare class SuiDivider {
4457
4567
  }
4458
4568
 
4459
4569
  type SuiDrawerFooterType = 'stretch' | 'basic' | 'checkbox' | 'toggle' | 'stepper' | 'link-button';
4570
+ /** Tamaño de los botones del pie (escala del sui-button): `medium` 40 (Figma,
4571
+ * default) · `large` 48 para el teléfono — size nuevo 04-10-2026 (dueño: piso
4572
+ * táctil 44). En `large` el texto del checkbox/switch sube a 16. */
4573
+ type SuiDrawerFooterSize = 'medium' | 'large';
4460
4574
  /**
4461
4575
  * SUI Drawer Footer — SUI Design System 2.0
4462
4576
  *
@@ -4533,6 +4647,9 @@ type SuiDrawerFooterType = 'stretch' | 'basic' | 'checkbox' | 'toggle' | 'steppe
4533
4647
  */
4534
4648
  declare class SuiDrawerFooter {
4535
4649
  readonly type: _angular_core.InputSignal<SuiDrawerFooterType>;
4650
+ /** Botones del pie: `medium` 40 (default) · `large` 48 para el teléfono
4651
+ * (04-10-2026, piso táctil 44). */
4652
+ readonly size: _angular_core.InputSignal<SuiDrawerFooterSize>;
4536
4653
  /** Botón primario (filled primary-base) — string shorthand (solo label) o
4537
4654
  * SuiFooterButtonConfig { label, disabled? }. Interfaz compartida con
4538
4655
  * sui-filter-panel-footer. */
@@ -4580,7 +4697,7 @@ declare class SuiDrawerFooter {
4580
4697
  onSecondary(event: Event): void;
4581
4698
  onLink(event: MouseEvent): void;
4582
4699
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiDrawerFooter, never>;
4583
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiDrawerFooter, "sui-drawer-footer", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "primaryButton": { "alias": "primaryButton"; "required": false; "isSignal": true; }; "secondaryButton": { "alias": "secondaryButton"; "required": false; "isSignal": true; }; "checkboxLabel": { "alias": "checkboxLabel"; "required": false; "isSignal": true; }; "checkboxActive": { "alias": "checkboxActive"; "required": false; "isSignal": true; }; "toggleLabel": { "alias": "toggleLabel"; "required": false; "isSignal": true; }; "toggleActive": { "alias": "toggleActive"; "required": false; "isSignal": true; }; "stepper": { "alias": "stepper"; "required": false; "isSignal": true; }; "link": { "alias": "link"; "required": false; "isSignal": true; }; }, { "checkboxActive": "checkboxActiveChange"; "toggleActive": "toggleActiveChange"; "primaryClick": "primaryClick"; "secondaryClick": "secondaryClick"; "linkClick": "linkClick"; }, never, never, true, never>;
4700
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiDrawerFooter, "sui-drawer-footer", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "primaryButton": { "alias": "primaryButton"; "required": false; "isSignal": true; }; "secondaryButton": { "alias": "secondaryButton"; "required": false; "isSignal": true; }; "checkboxLabel": { "alias": "checkboxLabel"; "required": false; "isSignal": true; }; "checkboxActive": { "alias": "checkboxActive"; "required": false; "isSignal": true; }; "toggleLabel": { "alias": "toggleLabel"; "required": false; "isSignal": true; }; "toggleActive": { "alias": "toggleActive"; "required": false; "isSignal": true; }; "stepper": { "alias": "stepper"; "required": false; "isSignal": true; }; "link": { "alias": "link"; "required": false; "isSignal": true; }; }, { "checkboxActive": "checkboxActiveChange"; "toggleActive": "toggleActiveChange"; "primaryClick": "primaryClick"; "secondaryClick": "secondaryClick"; "linkClick": "linkClick"; }, never, never, true, never>;
4584
4701
  }
4585
4702
 
4586
4703
  type SuiDrawerHeaderType = 'basic' | 'left-icon';
@@ -4761,7 +4878,7 @@ type SuiDropdownItemMode = 'menuitem' | 'option';
4761
4878
  *
4762
4879
  * Item individual usado dentro de un dropdown menu, command palette, country
4763
4880
  * picker, account switcher, etc. Compone otros SUI via slots — el tipo del
4764
- * item viene de QUÉ poné el consumer en [slot=leading]:
4881
+ * item viene de QUÉ pone el consumer en [slot=leading]:
4765
4882
  * - sui-icon → basic
4766
4883
  * - sui-flag → country
4767
4884
  * - sui-avatar → avatar
@@ -5130,8 +5247,8 @@ declare const SUI_EMOJI_MAP: {
5130
5247
  type SuiEmojiName = keyof typeof SUI_EMOJI_MAP;
5131
5248
  type SuiEmojiSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
5132
5249
  declare class SuiEmoji {
5133
- /** Nombre del emoji del catálogo. Si se proveé `src`, este se ignora. */
5134
- readonly name: _angular_core.InputSignal<"warning" | "label" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
5250
+ /** Nombre del emoji del catálogo. Si se provee `src`, este se ignora. */
5251
+ readonly name: _angular_core.InputSignal<"label" | "warning" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
5135
5252
  /** URL directa al emoji (override del catálogo). Útil para usar emojis fuera del map. */
5136
5253
  readonly src: _angular_core.InputSignal<string | null>;
5137
5254
  /** Tamaño del emoji. */
@@ -5258,7 +5375,7 @@ declare class SuiEmptyState {
5258
5375
  declare const EMPTY_STATE_FOX_EMOJI = "https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Animals/Fox.png";
5259
5376
 
5260
5377
  type SuiFancyButtonType = 'primary' | 'neutral' | 'basic' | 'destructive';
5261
- type SuiFancyButtonSize = 'medium' | 'small' | 'xsmall';
5378
+ type SuiFancyButtonSize = 'large' | 'medium' | 'small' | 'xsmall';
5262
5379
  /**
5263
5380
  * SUI Fancy Button — SUI Design System 2.0
5264
5381
  *
@@ -5316,7 +5433,9 @@ type SuiFancyButtonSize = 'medium' | 'small' | 'xsmall';
5316
5433
  * border-inset: 1px solid rgba(255,255,255,.12)
5317
5434
  * shadow: 0 0 0 1px var(--sui-state-error-base), 0 1px 2px rgba(14,18,27,.24)
5318
5435
  *
5319
- * Sizes (alineado con sui-button — mismo Medium/Small/X-Small):
5436
+ * Sizes (alineado con sui-button — mismo Large/Medium/Small/X-Small):
5437
+ * Large (48): p=12/14, h=48, Label/Medium 16/24 — size nuevo 04-10-2026
5438
+ * (dueño: piso táctil 44 en el teléfono; espeja el large de sui-button)
5320
5439
  * Medium (40): p=10, gap=4, h=40
5321
5440
  * Small (36): p=8, gap=4, h=36
5322
5441
  * X-Small (32): p=6, gap=4, h=32
@@ -5687,13 +5806,13 @@ declare class SuiFileUpload {
5687
5806
  protected readonly inputRef: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
5688
5807
  protected readonly dragging: _angular_core.WritableSignal<boolean>;
5689
5808
  protected readonly internalError: _angular_core.WritableSignal<string | null>;
5690
- protected readonly state: _angular_core.Signal<"error" | "default" | "disabled" | "dragover">;
5809
+ protected readonly state: _angular_core.Signal<"default" | "error" | "disabled" | "dragover">;
5691
5810
  protected readonly resolvedTitle: _angular_core.Signal<string>;
5692
5811
  protected readonly resolvedSubtitle: _angular_core.Signal<string>;
5693
5812
  protected readonly resolvedErrorMessage: _angular_core.Signal<string | null>;
5694
5813
  /** Icon size px. Figma verified = 24 (medium). small/large/xlarge escalan +4
5695
5814
  * (small 20 → medium 24 → large 28 → xlarge 32) — extensión de proyecto. */
5696
- protected readonly iconSize: _angular_core.Signal<20 | 24 | 28 | 32>;
5815
+ protected readonly iconSize: _angular_core.Signal<20 | 24 | 32 | 28>;
5697
5816
  onClick(): void;
5698
5817
  /** Browse File button — abre el picker. stopPropagation evita doble-open
5699
5818
  * (el host también es clickeable). */
@@ -6339,9 +6458,9 @@ declare class SuiImageUpload {
6339
6458
  protected readonly sizePx: _angular_core.Signal<number>;
6340
6459
  /** Camera icon px en el empty state. xl escala a 20, resto 16
6341
6460
  * (matchea el escalado del contenedor 32→40 en SCSS). */
6342
- protected readonly iconSize: _angular_core.Signal<16 | 20>;
6461
+ protected readonly iconSize: _angular_core.Signal<20 | 16>;
6343
6462
  /** Ícono del lápiz y el tacho (editable): 20 en botones de 40, 16 en sm (32). */
6344
- protected readonly ctrlIconSize: _angular_core.Signal<16 | 20>;
6463
+ protected readonly ctrlIconSize: _angular_core.Signal<20 | 16>;
6345
6464
  protected readonly hasSrc: _angular_core.Signal<boolean>;
6346
6465
  /** Hay imagen y se muestra el botón «Quitar» debajo (sin `editable`). */
6347
6466
  protected readonly conQuitar: _angular_core.Signal<boolean>;
@@ -6351,6 +6470,10 @@ declare class SuiImageUpload {
6351
6470
  protected readonly resolvedTitle: _angular_core.Signal<string>;
6352
6471
  protected readonly resolvedSubtitle: _angular_core.Signal<string>;
6353
6472
  onHostClick(): void;
6473
+ /** Enter/Espacio sobre el host vacío. Solo cuenta si el foco está en el
6474
+ * host: un Enter que burbujea desde «Quitar» (que borra la imagen y deja el
6475
+ * host vacío en ese mismo tick) no debe abrir el selector. */
6476
+ onHostKey(e: Event): void;
6354
6477
  onChangeClick(e: MouseEvent): void;
6355
6478
  /**
6356
6479
  * Reabre el selector de archivo.
@@ -6645,6 +6768,12 @@ declare class SuiInput implements ControlValueAccessor {
6645
6768
  * existente se mueve.
6646
6769
  */
6647
6770
  protected readonly clearPx: _angular_core.Signal<number>;
6771
+ /** a11y (04-10-2026): ids propios por instancia para enlazar el label
6772
+ * (`for`), el hint/error (`aria-describedby`) con el <input>. */
6773
+ protected readonly _controlId: string;
6774
+ protected readonly _hintId: string;
6775
+ /** El texto debajo del campo: el error manda sobre el hint. */
6776
+ protected readonly _hintMessage: _angular_core.Signal<string | null>;
6648
6777
  protected readonly labelSize: _angular_core.Signal<SuiFormLabelSize>;
6649
6778
  readonly error: _angular_core.InputSignal<boolean>;
6650
6779
  readonly errorMessage: _angular_core.InputSignal<string | null>;
@@ -6696,7 +6825,7 @@ declare class SuiInput implements ControlValueAccessor {
6696
6825
  * Cuando un pointerdown ocurre fuera del host del componente, hace blur en
6697
6826
  * el input — cierra el teclado iOS al tocar zonas no-interactivas. Default
6698
6827
  * `true` porque es el comportamiento natural esperado en mobile (Apple/Google
6699
- * lo hacen así nativamente). Pasá `false` solo si el consumer maneja el blur
6828
+ * lo hacen así nativamente). Pasa `false` solo si el consumer maneja el blur
6700
6829
  * manualmente o necesita preservar focus en flows complejos.
6701
6830
  */
6702
6831
  readonly closeOnOutsideClick: _angular_core.InputSignal<boolean>;
@@ -6873,6 +7002,9 @@ declare class SuiInput implements ControlValueAccessor {
6873
7002
 
6874
7003
  type SuiIntegrationSwitchType = 'horizontal' | 'vertical';
6875
7004
  type SuiIntegrationSwitchAppearance = 'card' | 'list';
7005
+ /** Tamaño del botón «Administrar»: `medium` 38 (default) · `large` 44 con texto
7006
+ * 16 — size nuevo 04-10-2026 (dueño: piso táctil 44 en el teléfono). */
7007
+ type SuiIntegrationSwitchSize = 'medium' | 'large';
6876
7008
  /**
6877
7009
  * Config del manage button embebido. Un solo input `[manage]` reemplaza al
6878
7010
  * trío showManage/manageLabel/manageIcon (mismo patrón objeto que
@@ -6957,8 +7089,17 @@ interface SuiIntegrationManageConfig {
6957
7089
  * <sui-integration-switch title="..." [manage]="false" />
6958
7090
  */
6959
7091
  declare class SuiIntegrationSwitch implements ControlValueAccessor {
7092
+ private static _nextId;
7093
+ /** El sui-switch interno toma su nombre del título (aria-labelledby) y su
7094
+ * descripción de la descripción: antes el lector decía solo «interruptor»
7095
+ * (revisión 04-10-2026). */
7096
+ protected readonly titleId: string;
7097
+ protected readonly descriptionId: string;
6960
7098
  readonly type: _angular_core.InputSignal<SuiIntegrationSwitchType>;
6961
7099
  readonly appearance: _angular_core.InputSignal<SuiIntegrationSwitchAppearance>;
7100
+ /** Botón «Administrar»: `medium` 38 (default) · `large` 44 para el teléfono
7101
+ * (04-10-2026, piso táctil 44). */
7102
+ readonly size: _angular_core.InputSignal<SuiIntegrationSwitchSize>;
6962
7103
  readonly title: _angular_core.InputSignal<string>;
6963
7104
  readonly description: _angular_core.InputSignal<string | null>;
6964
7105
  /** URL al logo de la marca (SVG/PNG). Renderizado como <img> dentro del circle. */
@@ -7004,7 +7145,7 @@ declare class SuiIntegrationSwitch implements ControlValueAccessor {
7004
7145
  registerOnTouched(fn: () => void): void;
7005
7146
  setDisabledState(isDisabled: boolean): void;
7006
7147
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiIntegrationSwitch, never>;
7007
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiIntegrationSwitch, "sui-integration-switch", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "brandIconSrc": { "alias": "brandIconSrc"; "required": false; "isSignal": true; }; "brandIcon": { "alias": "brandIcon"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "manage": { "alias": "manage"; "required": false; "isSignal": true; }; "showToggle": { "alias": "showToggle"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "activeChange": "activeChange"; "manageClick": "manageClick"; }, never, ["[sui-integration-brand]"], true, never>;
7148
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiIntegrationSwitch, "sui-integration-switch", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "brandIconSrc": { "alias": "brandIconSrc"; "required": false; "isSignal": true; }; "brandIcon": { "alias": "brandIcon"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "manage": { "alias": "manage"; "required": false; "isSignal": true; }; "showToggle": { "alias": "showToggle"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "activeChange": "activeChange"; "manageClick": "manageClick"; }, never, ["[sui-integration-brand]"], true, never>;
7008
7149
  }
7009
7150
 
7010
7151
  /**
@@ -7883,15 +8024,15 @@ declare class SuiModalFooter {
7883
8024
  * que se reusa el componente (canon: ningún `<button>` custom donde un SUI sirve).
7884
8025
  *
7885
8026
  * API:
7886
- * - usePrefix: string ('Use') — texto antes de las teclas
7887
- * - useSuffix: string ('to navigate') — texto después de las teclas
8027
+ * - usePrefix: string ('Usa') — texto antes de las teclas
8028
+ * - useSuffix: string ('para moverte') — texto después de las teclas
7888
8029
  * - manage: SuiLinkConfig | string | boolean | null (true) — link de gestión
7889
- * (Figma prop `button`): true = label default 'Manage Notification';
8030
+ * (Figma prop `button`): true = label default 'Administrar notificaciones';
7890
8031
  * string = label custom; SuiLinkConfig { label, href?, target?, rel? }
7891
8032
  * = <a> real con rel automático 'noopener noreferrer' si
7892
8033
  * target='_blank'; false/null = oculto.
7893
8034
  * (Patrón canon `link` de sui-checkbox-label.)
7894
- * - (manageClick): output<MouseEvent> — click en "Manage Notification"
8035
+ * - (manageClick): output<MouseEvent> — click en «Administrar notificaciones»
7895
8036
  *
7896
8037
  * Uso:
7897
8038
  * <sui-notification-footer (manageClick)="abrirAjustes()" />
@@ -8025,6 +8166,11 @@ declare class SuiNotificationTabMenu<T = string> {
8025
8166
  readonly filterLabel: _angular_core.InputSignal<string>;
8026
8167
  readonly tabChange: _angular_core.OutputEmitterRef<T>;
8027
8168
  readonly filterClick: _angular_core.OutputEmitterRef<MouseEvent>;
8169
+ private readonly tabItems?;
8170
+ /** Índice del único tab con tabindex 0: el activo (o el primero). */
8171
+ protected readonly tabStopIndex: _angular_core.Signal<number>;
8172
+ /** ← → mueven el foco y activan (con vuelta); Home/End a los extremos. */
8173
+ protected onKeydown(event: KeyboardEvent): void;
8028
8174
  isActive(tab: SuiNotificationTab<T>): boolean;
8029
8175
  select(tab: SuiNotificationTab<T>): void;
8030
8176
  onFilter(event: MouseEvent): void;
@@ -8526,6 +8672,11 @@ declare class SuiPaymentIcon {
8526
8672
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiPaymentIcon, "sui-payment-icon", never, { "type": { "alias": "type"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
8527
8673
  }
8528
8674
 
8675
+ /**
8676
+ * medium (default) = 36 de alto (Figma 443:341). large = 44, texto 16/24:
8677
+ * canon del dueño 04-10-2026 (piso táctil de 44 en el teléfono).
8678
+ */
8679
+ type SuiPeriodRangeSize = 'medium' | 'large';
8529
8680
  /**
8530
8681
  * SUI Period Range — SUI Design System 2.0
8531
8682
  *
@@ -8566,18 +8717,21 @@ declare class SuiPeriodRange {
8566
8717
  readonly active: _angular_core.InputSignal<boolean>;
8567
8718
  /** Disabled — no clickeable. */
8568
8719
  readonly disabled: _angular_core.InputSignal<boolean>;
8720
+ /** medium 36 (default) · large 44 (piso táctil, dueño 04-10-2026). */
8721
+ readonly size: _angular_core.InputSignal<SuiPeriodRangeSize>;
8569
8722
  readonly clicked: _angular_core.OutputEmitterRef<void>;
8570
8723
  onClick(): void;
8571
8724
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiPeriodRange, never>;
8572
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiPeriodRange, "sui-period-range", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
8725
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiPeriodRange, "sui-period-range", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
8573
8726
  }
8574
8727
 
8575
8728
  type SuiPopoverPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' | 'right-top' | 'right-center' | 'right-bottom' | 'left-top' | 'left-center' | 'left-bottom';
8576
8729
  /** Tipo de footer del popover (Figma 4456:83048). `none` = sin footer. */
8577
8730
  type SuiPopoverFooter = 'none' | 'stretch' | 'text-stepper' | 'stepper';
8578
8731
  /** Tamaño de los botones del pie (escala del sui-button): `small` 36 (Figma,
8579
- default) · `medium` 40 para mobile — extensión SUI (03-10-2026). */
8580
- type SuiPopoverSize = 'small' | 'medium';
8732
+ default) · `medium` 40 — extensión SUI (03-10-2026) · `large` 48 para el
8733
+ teléfono — size nuevo 04-10-2026 (dueño: piso táctil 44). */
8734
+ type SuiPopoverSize = 'small' | 'medium' | 'large';
8581
8735
  declare class SuiPopover {
8582
8736
  /** Placement axis del tail relativo al trigger (12 variantes Figma). */
8583
8737
  readonly position: _angular_core.InputSignal<SuiPopoverPosition>;
@@ -8605,8 +8759,8 @@ declare class SuiPopover {
8605
8759
  current: number;
8606
8760
  total: number;
8607
8761
  } | null>;
8608
- /** Botones del pie: `small` 36 (Figma, default) · `medium` 40 para mobile —
8609
- * extensión SUI (03-10-2026). */
8762
+ /** Botones del pie: `small` 36 (Figma, default) · `medium` 40 — extensión
8763
+ * SUI (03-10-2026) · `large` 48 para el teléfono (04-10-2026). */
8610
8764
  readonly size: _angular_core.InputSignal<SuiPopoverSize>;
8611
8765
  /** Click en el botón X de dismiss. */
8612
8766
  readonly dismissed: _angular_core.OutputEmitterRef<void>;
@@ -8689,9 +8843,12 @@ declare class SuiProgressBar {
8689
8843
  readonly color: _angular_core.InputSignal<SuiProgressBarColor>;
8690
8844
  readonly size: _angular_core.InputSignal<SuiProgressBarSize>;
8691
8845
  readonly ariaLabel: _angular_core.InputSignal<string | null>;
8846
+ /** Id del texto visible que nombra la barra (p. ej. su título). */
8847
+ readonly ariaLabelledby: _angular_core.InputSignal<string | null>;
8848
+ readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
8692
8849
  readonly clampedValue: _angular_core.Signal<number>;
8693
8850
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiProgressBar, never>;
8694
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiProgressBar, "sui-progress-bar", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
8851
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiProgressBar, "sui-progress-bar", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
8695
8852
  }
8696
8853
 
8697
8854
  type SuiProgressBarLabelType = 'on-top' | 'on-right';
@@ -8784,6 +8941,9 @@ declare class SuiProgressBarLabel {
8784
8941
  readonly color: _angular_core.InputSignal<SuiProgressBarColor>;
8785
8942
  readonly size: _angular_core.InputSignal<SuiProgressBarSize>;
8786
8943
  readonly ariaLabel: _angular_core.InputSignal<string | null>;
8944
+ /** a11y (04-10-2026): el título visible nombra la barra (aria-labelledby);
8945
+ * antes, sin ariaLabel, la barra quedaba sin nombre aunque se viera el título. */
8946
+ protected readonly _titleId: string;
8787
8947
  readonly linkClick: _angular_core.OutputEmitterRef<void>;
8788
8948
  /** Config resuelta del link (string → { label }, rel automático). */
8789
8949
  protected readonly linkCfg: _angular_core.Signal<SuiLinkConfig | null>;
@@ -8797,6 +8957,56 @@ declare class SuiProgressBarLabel {
8797
8957
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiProgressBarLabel, "sui-progress-bar-label", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "percentage": { "alias": "percentage"; "required": false; "isSignal": true; }; "showBottom": { "alias": "showBottom"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "link": { "alias": "link"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "linkClick": "linkClick"; }, never, never, true, never>;
8798
8958
  }
8799
8959
 
8960
+ /**
8961
+ * Lo que el grupo necesita de cada opción para el patrón radiogroup de WAI-ARIA
8962
+ * (un solo tab stop + flechas). Lo implementan sui-radio, sui-radio-label y
8963
+ * sui-radio-card; cada uno se registra al iniciar y se da de baja al destruirse.
8964
+ */
8965
+ interface SuiRadioGroupItem {
8966
+ /** Valor de la opción (el mismo que compara el grupo). */
8967
+ value(): unknown;
8968
+ /** Deshabilitada por input, por form o por el grupo. */
8969
+ isDisabled(): boolean;
8970
+ /** Elemento que recibe el foco (el host con role=radio). */
8971
+ readonly el: HTMLElement;
8972
+ /** Selecciona la opción por su camino normal (emite sus outputs). */
8973
+ activateFromGroup(): void;
8974
+ }
8975
+ /**
8976
+ * Grupo de radios con selección exclusiva + ControlValueAccessor.
8977
+ *
8978
+ * Teclado (patrón radiogroup, revisión 04-10-2026): un solo tab stop —la
8979
+ * opción marcada, o la primera habilitada si no hay ninguna— y las flechas
8980
+ * (↑ ↓ ← →) mueven el foco a la opción vecina y la seleccionan, saltando las
8981
+ * deshabilitadas y dando la vuelta en los extremos.
8982
+ */
8983
+ declare class SuiRadioGroup implements ControlValueAccessor {
8984
+ readonly value: _angular_core.WritableSignal<any>;
8985
+ /** Deshabilitado por el FormControl (setDisabledState): apaga todas las opciones. */
8986
+ readonly disabled: _angular_core.WritableSignal<boolean>;
8987
+ private readonly _items;
8988
+ /** La única opción con tabindex 0: la marcada, o la primera habilitada. */
8989
+ readonly tabStop: _angular_core.Signal<SuiRadioGroupItem | null>;
8990
+ private _onChange;
8991
+ private _onTouched;
8992
+ register(item: SuiRadioGroupItem): void;
8993
+ unregister(item: SuiRadioGroupItem): void;
8994
+ /** tabindex que le toca a una opción registrada. */
8995
+ tabIndexFor(item: SuiRadioGroupItem): '0' | '-1';
8996
+ select(v: any): void;
8997
+ onKeydown(e: KeyboardEvent): void;
8998
+ /** Orden del DOM (no el de registro): así las flechas siguen lo que se ve. */
8999
+ private _ordered;
9000
+ writeValue(v: any): void;
9001
+ registerOnChange(fn: any): void;
9002
+ registerOnTouched(fn: any): void;
9003
+ /** Antes no hacía nada (revisión 04-10-2026): deshabilitar el FormControl
9004
+ * ahora deshabilita todas las opciones del grupo. */
9005
+ setDisabledState(isDisabled: boolean): void;
9006
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiRadioGroup, never>;
9007
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiRadioGroup, "sui-radio-group", never, {}, {}, never, ["*"], true, never>;
9008
+ }
9009
+
8800
9010
  type SuiRadioValue = string | number | null;
8801
9011
  type SuiRadioSize = 'medium' | 'large' | 'xlarge';
8802
9012
  /**
@@ -8829,18 +9039,28 @@ type SuiRadioSize = 'medium' | 'large' | 'xlarge';
8829
9039
  * with ControlValueAccessor support. Each radio declares a [value] input.
8830
9040
  * Standalone mode: [(standaloneChecked)] two-way binding (legacy toggle behaviour).
8831
9041
  */
8832
- declare class SuiRadio {
9042
+ declare class SuiRadio implements OnInit, SuiRadioGroupItem {
8833
9043
  private readonly group;
9044
+ private readonly destroyRef;
9045
+ readonly el: HTMLElement;
8834
9046
  readonly size: _angular_core.InputSignal<SuiRadioSize>;
8835
9047
  readonly value: _angular_core.InputSignal<SuiRadioValue>;
8836
9048
  readonly disabled: _angular_core.InputSignal<boolean>;
9049
+ /** false = fuera del orden de Tab y del roving del grupo. Para cuando un
9050
+ * padre (sui-radio-label) es el radio enfocable y este solo dibuja. */
9051
+ readonly focusable: _angular_core.InputSignal<boolean>;
9052
+ /** Deshabilitado por input o por el grupo (FormControl deshabilitado). */
9053
+ readonly isDisabled: _angular_core.Signal<boolean>;
9054
+ readonly tabIndex: _angular_core.Signal<"0" | "-1">;
8837
9055
  /** Standalone mode (no group): keeps legacy toggle behaviour */
8838
9056
  readonly standaloneChecked: _angular_core.ModelSignal<boolean>;
8839
9057
  /** Resolved checked state: group-driven or standalone */
8840
9058
  readonly checked: _angular_core.Signal<boolean>;
9059
+ ngOnInit(): void;
9060
+ activateFromGroup(): void;
8841
9061
  onToggle(e: Event): void;
8842
9062
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiRadio, never>;
8843
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiRadio, "sui-radio", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "standaloneChecked": { "alias": "standaloneChecked"; "required": false; "isSignal": true; }; }, { "standaloneChecked": "standaloneCheckedChange"; }, never, never, true, never>;
9063
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiRadio, "sui-radio", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "focusable": { "alias": "focusable"; "required": false; "isSignal": true; }; "standaloneChecked": { "alias": "standaloneChecked"; "required": false; "isSignal": true; }; }, { "standaloneChecked": "standaloneCheckedChange"; }, never, never, true, never>;
8844
9064
  }
8845
9065
 
8846
9066
  type SuiRadioCardType = 'basic' | 'left-icon' | 'avatar' | 'card-provider' | 'brand' | 'company';
@@ -8935,8 +9155,10 @@ type SuiRadioCardType = 'basic' | 'left-icon' | 'avatar' | 'card-provider' | 'br
8935
9155
  *
8936
9156
  * iOS WKWebView fix: touch listeners en host (CLAUDE.md).
8937
9157
  */
8938
- declare class SuiRadioCard implements ControlValueAccessor {
9158
+ declare class SuiRadioCard implements ControlValueAccessor, OnInit, SuiRadioGroupItem {
8939
9159
  private readonly group;
9160
+ private readonly destroyRef;
9161
+ readonly el: HTMLElement;
8940
9162
  /** Tipo del leading slot — gobierna qué se renderiza a la izquierda. */
8941
9163
  readonly type: _angular_core.InputSignal<SuiRadioCardType>;
8942
9164
  /** Tamaño del radio interno (custom) — lo decide el padre (componente dumb). */
@@ -8962,7 +9184,7 @@ declare class SuiRadioCard implements ControlValueAccessor {
8962
9184
  * Emoji del catálogo SUI_EMOJI_MAP — alternativa a icon para type='left-icon'.
8963
9185
  * Si ambos están, icon tiene precedencia.
8964
9186
  */
8965
- readonly emoji: _angular_core.InputSignal<"warning" | "label" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
9187
+ readonly emoji: _angular_core.InputSignal<"label" | "warning" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
8966
9188
  /**
8967
9189
  * URL directa al emoji para type='left-icon'. Útil cuando el consumer ya tiene
8968
9190
  * la URL (ej. FLUENT_EMOJI map del proyecto) y no quiere registrar el emoji
@@ -8989,6 +9211,7 @@ declare class SuiRadioCard implements ControlValueAccessor {
8989
9211
  readonly selected: _angular_core.OutputEmitterRef<string>;
8990
9212
  private readonly _disabledByForm;
8991
9213
  readonly isDisabled: _angular_core.Signal<boolean>;
9214
+ readonly tabIndex: _angular_core.Signal<"0" | "-1">;
8992
9215
  /** Estado checked resuelto: group-driven > form/standalone. */
8993
9216
  readonly isChecked: _angular_core.Signal<boolean>;
8994
9217
  /** True si type requiere render del slot leading. */
@@ -8998,6 +9221,8 @@ declare class SuiRadioCard implements ControlValueAccessor {
8998
9221
  readonly initialsFromLabel: _angular_core.Signal<string>;
8999
9222
  private _onChange;
9000
9223
  private _onTouched;
9224
+ ngOnInit(): void;
9225
+ activateFromGroup(): void;
9001
9226
  onToggle(e: Event): void;
9002
9227
  /** writeValue: con FormControl que guarda el value seleccionado, marcamos
9003
9228
  checked si el value del FormControl matchea nuestro value. */
@@ -9014,7 +9239,7 @@ declare class SuiRadioCard implements ControlValueAccessor {
9014
9239
  * `large` y `xlarge` son extensión SUI (03-10-2026, pedido del dueño) para mobile:
9015
9240
  * le pasan el tamaño al sui-radio interno (24 / 28) y suben la tipografía.
9016
9241
  */
9017
- type SuiRadioLabelSize = 'medium' | 'large' | 'xlarge';
9242
+ type SuiRadioLabelSize = 'medium' | 'large' | 'xlarge' | '2xlarge';
9018
9243
  /**
9019
9244
  * SUI Radio Label — SUI Design System 2.0
9020
9245
  *
@@ -9048,8 +9273,13 @@ type SuiRadioLabelSize = 'medium' | 'large' | 'xlarge';
9048
9273
  * [link]="{ label: 'Ver precios', href: '/precios' }" />
9049
9274
  * </sui-radio-group>
9050
9275
  */
9051
- declare class SuiRadioLabel {
9276
+ declare class SuiRadioLabel implements OnInit, SuiRadioGroupItem {
9277
+ private static _nextId;
9052
9278
  private readonly group;
9279
+ private readonly destroyRef;
9280
+ readonly el: HTMLElement;
9281
+ protected readonly labelId: string;
9282
+ protected readonly descriptionId: string;
9053
9283
  /** Valor que representa esta opción dentro del grupo. */
9054
9284
  readonly value: _angular_core.InputSignal<string>;
9055
9285
  /** Texto principal del label. */
@@ -9071,11 +9301,17 @@ declare class SuiRadioLabel {
9071
9301
  /**
9072
9302
  * Tamaño. `medium` (default, Figma): control 20, label 14/20.
9073
9303
  * Extensión SUI (03-10-2026) para tocar en mobile:
9074
- * - `large`: control 24, label 16/24, sublabel y descripción 14/20, badge medium.
9075
- * - `xlarge`: control 28, label 16/24, sublabel y descripción 14/20, badge large.
9304
+ * - `large`: control 24, label 16/24, sublabel y descripción 12/16 (dueño 04-10-2026), badge medium.
9305
+ * - `xlarge`: control 28, label 16/24, sublabel y descripción 12/16 (dueño 04-10-2026), badge large.
9306
+ * - `2xlarge` (canon, dueño 04-10-2026: piso táctil 44 en el teléfono): la
9307
+ * fila mide 44 como mínimo (`min-height`), control 28 (el mayor del
9308
+ * radio), label 16/24, sublabel y descripción 12/16, badge large.
9076
9309
  * El badge toma este default solo si su config no trae `size`.
9077
9310
  */
9078
9311
  readonly size: _angular_core.InputSignal<SuiRadioLabelSize>;
9312
+ /** Size del sui-radio interno: `2xlarge` es un alto de fila, el control se
9313
+ * queda en su tamaño mayor (28). */
9314
+ protected readonly controlSize: _angular_core.Signal<SuiRadioSize>;
9079
9315
  /** Badge por default según el tamaño (si la config no fija uno). */
9080
9316
  protected readonly badgeSize: _angular_core.Signal<SuiBadgeSize>;
9081
9317
  /** El link-button tiene dos tamaños: small (12/16) en Figma, medium (14/20) en mobile. */
@@ -9091,8 +9327,11 @@ declare class SuiRadioLabel {
9091
9327
  /** Click en el Link Button (stop-propagation interno — no selecciona). */
9092
9328
  readonly linkClick: _angular_core.OutputEmitterRef<MouseEvent>;
9093
9329
  readonly isDisabled: _angular_core.Signal<boolean>;
9330
+ readonly tabIndex: _angular_core.Signal<"0" | "-1">;
9094
9331
  /** Checked resuelto: group-driven > standalone. */
9095
9332
  readonly isChecked: _angular_core.Signal<boolean>;
9333
+ ngOnInit(): void;
9334
+ activateFromGroup(): void;
9096
9335
  onLabelClick(event: MouseEvent): void;
9097
9336
  onKeySelect(event: Event): void;
9098
9337
  private select;
@@ -9101,22 +9340,9 @@ declare class SuiRadioLabel {
9101
9340
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiRadioLabel, "sui-radio-label", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "link": { "alias": "link"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "flip": { "alias": "flip"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "selected": "selected"; "linkClick": "linkClick"; }, never, never, true, never>;
9102
9341
  }
9103
9342
 
9104
- declare class SuiRadioGroup implements ControlValueAccessor {
9105
- readonly value: _angular_core.WritableSignal<any>;
9106
- private _onChange;
9107
- private _onTouched;
9108
- select(v: any): void;
9109
- writeValue(v: any): void;
9110
- registerOnChange(fn: any): void;
9111
- registerOnTouched(fn: any): void;
9112
- setDisabledState(_isDisabled: boolean): void;
9113
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiRadioGroup, never>;
9114
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiRadioGroup, "sui-radio-group", never, {}, {}, never, ["*"], true, never>;
9115
- }
9116
-
9117
9343
  type SuiRatingAppearance = 'inline' | 'cell' | 'bar' | 'bar-area';
9118
9344
  type SuiRatingType = 'star' | 'heart' | 'emoji' | 'number';
9119
- type SuiRatingSize = 'small' | 'medium' | 'large' | 'xlarge';
9345
+ type SuiRatingSize = 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge';
9120
9346
  type SuiRatingAlignment = 'inline' | 'vertical' | 'horizontal';
9121
9347
  interface SuiRatingReviewLink {
9122
9348
  label: string;
@@ -9209,13 +9435,16 @@ interface SuiRatingCellView {
9209
9435
  * - medium: 20px (default)
9210
9436
  * - large: 24px
9211
9437
  * - xlarge: 28px (project extension, no-Figma — sigue el incremento Δ4px medium→large→xlarge)
9438
+ * - 2xlarge: estrella de 32 dentro de un botón de 44 × 44 — para PEDIR la nota
9439
+ * en el teléfono (canon, dueño 04-10-2026: piso táctil 44). En bar, la
9440
+ * celda pasa de 36 a 44 de alto (ícono sigue en 20, número en 16).
9212
9441
  * En appearance='bar' los íconos son siempre 20px (cell width 64px fijo).
9213
9442
  *
9214
9443
  * @input appearance 'inline' | 'cell' | 'bar' | 'bar-area' (default: 'inline')
9215
9444
  * @input type 'star' | 'heart' | 'emoji' | 'number' (default: 'star')
9216
9445
  * @input value model<number> — current value 0..max
9217
9446
  * @input max número de cells (default: 5)
9218
- * @input size 'small' | 'medium' | 'large' | 'xlarge' (default: 'medium')
9447
+ * @input size 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge' (default: 'medium')
9219
9448
  * @input readonly deshabilita clicks (display only)
9220
9449
  * @input halfStep inline + readonly: renderiza half-fill basado en value decimal
9221
9450
  * @input showValue inline: muestra "4.5" al lado de los íconos
@@ -9249,6 +9478,7 @@ interface SuiRatingCellView {
9249
9478
  * disabled deshabilita clicks/hover igual que readonly=true (ver isInteractive).
9250
9479
  */
9251
9480
  declare class SuiRating implements ControlValueAccessor {
9481
+ private readonly el;
9252
9482
  readonly appearance: _angular_core.InputSignal<SuiRatingAppearance>;
9253
9483
  readonly type: _angular_core.InputSignal<SuiRatingType>;
9254
9484
  readonly value: _angular_core.ModelSignal<number>;
@@ -9264,7 +9494,7 @@ declare class SuiRating implements ControlValueAccessor {
9264
9494
  * Lista de emojis para type='emoji'. Default: 5 caras de Fluent Emoji animado
9265
9495
  * (homologado iOS/Android — mismos PNG en todos los devices, no native font).
9266
9496
  * Cada string es un `name` válido de SUI_EMOJI_MAP (ver sui-emoji.ts).
9267
- * Si pasás un string que NO está en el map, sui-emoji renderea broken image.
9497
+ * Si pasas un string que NO está en el map, sui-emoji renderea broken image.
9268
9498
  */
9269
9499
  readonly emojis: _angular_core.InputSignal<string[]>;
9270
9500
  readonly ariaLabel: _angular_core.InputSignal<string>;
@@ -9301,9 +9531,22 @@ declare class SuiRating implements ControlValueAccessor {
9301
9531
  readonly cells: _angular_core.Signal<SuiRatingCellView[]>;
9302
9532
  /** Tamaño del icon en px.
9303
9533
  * - appearance='cell' → SIEMPRE 32px (Figma Rating Cell 532:4160, independiente de size).
9304
- * - appearance='inline' → según size input (small 16 / medium 20 / large 24 / xlarge 28).
9534
+ * - appearance='inline' → según size input (small 16 / medium 20 / large 24 / xlarge 28 / 2xlarge 32 en un botón de 44).
9305
9535
  * bar/bar-area usan 20px hardcoded en el template (no pasan por aquí). */
9306
9536
  readonly iconPx: _angular_core.Signal<number>;
9537
+ /** Rol del host: `img` para la nota de solo lectura (o `group` si trae link), `radiogroup` para pedirla. */
9538
+ protected readonly hostRole: _angular_core.Signal<"group" | "img" | "radiogroup">;
9539
+ /** Nombre accesible: interactivo = `ariaLabel`; readonly = «Calificación: 4,5 de 5, 120 calificaciones». */
9540
+ protected readonly hostAriaLabel: _angular_core.Signal<string>;
9541
+ /** Índice (1..max) de la celda con tabindex 0: la elegida, o la primera. */
9542
+ protected readonly tabStopIndex: _angular_core.Signal<number>;
9543
+ /**
9544
+ * Patrón radiogroup (interactivo, igual que un radio nativo): ← ↑ bajan la
9545
+ * nota, → ↓ la suben, Home/End
9546
+ * van a 1 / max. Las flechas eligen (como cualquier radio). Sin vuelta: de 5
9547
+ * no se salta a 1 con una flecha.
9548
+ */
9549
+ onKeydown(event: KeyboardEvent): void;
9307
9550
  /** Formato user-facing del rating value: "4.5" sin trailing zeros. */
9308
9551
  readonly valueLabel: _angular_core.Signal<string>;
9309
9552
  /** Formato corto del review count: 1234 → "1.2K", 5200 → "5.2K", 950 → "950". */
@@ -9494,7 +9737,8 @@ declare class SuiRichEditor {
9494
9737
  * La lista acompaña desde el 03-10-2026 (extensión SUI): las opciones son
9495
9738
  * `sui-dropdown-item` de 36 (Figma) hasta medium, 44 en large y 48 en xlarge,
9496
9739
  * y ≥ 44 en mobile (≤ 767 px) con cualquier size. Lo resuelve sui-select.scss
9497
- * sobre los ítems del panel; el dropdown-item no se toca.
9740
+ * sobre los ítems del panel; el dropdown-item no se toca. En large y xlarge el
9741
+ * texto (valor, placeholder y opciones) va en 16/24 (regla del 03-10-2026).
9498
9742
  */
9499
9743
  type SuiSelectSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
9500
9744
  /**
@@ -9574,6 +9818,16 @@ declare class SuiSelect<T = any> implements ControlValueAccessor {
9574
9818
  readonly errorMessage: _angular_core.InputSignal<string | null>;
9575
9819
  readonly label: _angular_core.InputSignal<string | null>;
9576
9820
  readonly hint: _angular_core.InputSignal<string | null>;
9821
+ /** a11y (04-10-2026): el combobox toma su nombre del label visible
9822
+ * (aria-labelledby), apunta al listbox abierto (aria-controls) y anuncia la
9823
+ * opción resaltada con las flechas (aria-activedescendant), porque el foco
9824
+ * se queda en el trigger. */
9825
+ protected readonly _labelId: string;
9826
+ protected readonly _listboxId: string;
9827
+ protected readonly _hintId: string;
9828
+ protected _optionId(i: number): string;
9829
+ /** El texto debajo del campo: el error manda sobre el hint. */
9830
+ protected readonly _hintMessage: _angular_core.Signal<string | null>;
9577
9831
  /** Tipo de left-decoration del trigger (Figma Select[1.1] Type variant). */
9578
9832
  readonly type: _angular_core.InputSignal<SuiSelectType>;
9579
9833
  /** Left-decoration del trigger — true = icono default por type, string =
@@ -9942,6 +10196,11 @@ declare class SuiSlider implements ControlValueAccessor {
9942
10196
  * numérico actual del slider (value en single; "min–max" en range).
9943
10197
  */
9944
10198
  readonly amount: _angular_core.InputSignal<string | null>;
10199
+ /** Unidad para el lector de pantalla (`aria-valuetext`: «12 km»). En single,
10200
+ * si se pasa `amount` manda ese texto. */
10201
+ readonly unit: _angular_core.InputSignal<string | null>;
10202
+ /** Nombre accesible cuando no hay `label` visible (o para reemplazarlo). */
10203
+ readonly ariaLabel: _angular_core.InputSignal<string | null>;
9945
10204
  /** Muestra tooltip flotante sobre el thumb activo (hover/drag). */
9946
10205
  readonly tooltip: _angular_core.InputSignal<boolean>;
9947
10206
  /** Fuerza el tooltip siempre visible (no solo en hover/drag). */
@@ -9976,6 +10235,14 @@ declare class SuiSlider implements ControlValueAccessor {
9976
10235
  readonly rangeMaxColored: _angular_core.Signal<boolean>;
9977
10236
  /** Texto del label de la derecha. */
9978
10237
  readonly amountText: _angular_core.Signal<string>;
10238
+ /** El label visible nombra a la manija (antes no estaba enlazado). */
10239
+ protected readonly _labelId: string;
10240
+ /** «12 km»: el valor con su unidad, o null si no hay unidad. */
10241
+ valueText(v: number): string | null;
10242
+ /** Single: el texto de `amount` (lo que se ve) o el valor con la unidad. */
10243
+ readonly singleValueText: _angular_core.Signal<string | null>;
10244
+ /** Range: cada manija dice cuál es («Precio, mínimo» / «Precio, máximo»). */
10245
+ thumbLabel(extremo: 'mínimo' | 'máximo'): string;
9979
10246
  private showTooltipFor;
9980
10247
  readonly showSingleTooltip: _angular_core.Signal<boolean>;
9981
10248
  readonly showMinTooltip: _angular_core.Signal<boolean>;
@@ -9999,11 +10266,12 @@ declare class SuiSlider implements ControlValueAccessor {
9999
10266
  onThumbEnter(handle: 'single' | 'min' | 'max'): void;
10000
10267
  onThumbLeave(): void;
10001
10268
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiSlider, never>;
10002
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSlider, "sui-slider", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "amount": { "alias": "amount"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "tooltipAlways": { "alias": "tooltipAlways"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "minValue": { "alias": "minValue"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "minValueChange": "minValueChange"; "maxValueChange": "maxValueChange"; }, never, never, true, never>;
10269
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSlider, "sui-slider", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "amount": { "alias": "amount"; "required": false; "isSignal": true; }; "unit": { "alias": "unit"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "tooltipAlways": { "alias": "tooltipAlways"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "minValue": { "alias": "minValue"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "minValueChange": "minValueChange"; "maxValueChange": "maxValueChange"; }, never, never, true, never>;
10003
10270
  }
10004
10271
 
10005
10272
  type SuiSocialButtonBrand = 'apple' | 'x-twitter' | 'google' | 'facebook' | 'linkedin' | 'github' | 'dropbox';
10006
10273
  type SuiSocialButtonStyle = 'filled' | 'stroke';
10274
+ type SuiSocialButtonSize = 'medium' | 'large';
10007
10275
  /**
10008
10276
  * SUI Social Button — SUI Design System 2.0
10009
10277
  *
@@ -10075,6 +10343,9 @@ declare class SuiSocialButton {
10075
10343
  readonly brand: _angular_core.InputSignal<SuiSocialButtonBrand>;
10076
10344
  readonly variantStyle: _angular_core.InputSignal<SuiSocialButtonStyle>;
10077
10345
  readonly onlyIcon: _angular_core.InputSignal<boolean>;
10346
+ /** `medium` (40, default) · `large` (48, size nuevo 04-10-2026: piso táctil
10347
+ * 44 en el teléfono; espeja el large de sui-button). */
10348
+ readonly size: _angular_core.InputSignal<SuiSocialButtonSize>;
10078
10349
  readonly label: _angular_core.InputSignal<string | null>;
10079
10350
  readonly disabled: _angular_core.InputSignal<boolean>;
10080
10351
  /** Loading state — reemplaza el logo por un spinner y deshabilita el botón. ExtraFeature. */
@@ -10110,7 +10381,7 @@ declare class SuiSocialButton {
10110
10381
  readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
10111
10382
  onClick(event: MouseEvent): void;
10112
10383
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiSocialButton, never>;
10113
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSocialButton, "sui-social-button", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "variantStyle": { "alias": "variantStyle"; "required": false; "isSignal": true; }; "onlyIcon": { "alias": "onlyIcon"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
10384
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSocialButton, "sui-social-button", never, { "brand": { "alias": "brand"; "required": true; "isSignal": true; }; "variantStyle": { "alias": "variantStyle"; "required": false; "isSignal": true; }; "onlyIcon": { "alias": "onlyIcon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
10114
10385
  }
10115
10386
 
10116
10387
  type SuiStatusBadgeStatus = 'completed' | 'pending' | 'failed' | 'information' | 'disabled';
@@ -10377,10 +10648,11 @@ interface SuiStoreCardData {
10377
10648
  }
10378
10649
  /**
10379
10650
  * Tamaño del corazón de favorito, en la escala del sui-button. `small` (36, el
10380
- * de siempre) es el default; `medium` (40) es extensión SUI (03-10-2026) para
10381
- * tocarlo con el dedo en mobile.
10651
+ * de siempre) es el default; `medium` (40) es extensión SUI (03-10-2026);
10652
+ * `large` (44) es el size nuevo del 04-10-2026 (dueño: piso táctil 44 en el
10653
+ * teléfono): corazón de 44 y la nota tocable en 44 de alto.
10382
10654
  */
10383
- type SuiStoreCardSize = 'small' | 'medium';
10655
+ type SuiStoreCardSize = 'small' | 'medium' | 'large';
10384
10656
  interface PreviewBadge {
10385
10657
  label: string;
10386
10658
  variant: 'draft' | 'pending' | 'rejected';
@@ -10393,8 +10665,8 @@ declare class SuiStoreCard {
10393
10665
  /** Ruta base del detalle: la tarjeta navega a `[linkBase, store.id]`. El
10394
10666
  * default es la ruta del cliente de Master Pedidos; otra app pasa la suya. */
10395
10667
  readonly linkBase: _angular_core.InputSignal<string>;
10396
- /** Corazón de favorito: `small` 36 (default) · `medium` 40 para mobile —
10397
- * extensión SUI (03-10-2026). */
10668
+ /** Corazón de favorito: `small` 36 (default) · `medium` 40 — extensión SUI
10669
+ * (03-10-2026) · `large` 44 para el teléfono (04-10-2026). */
10398
10670
  readonly size: _angular_core.InputSignal<SuiStoreCardSize>;
10399
10671
  /**
10400
10672
  * El texto de Envío y el de Distancia, ya escritos por quien llama.
@@ -10435,7 +10707,7 @@ declare class SuiStoreCard {
10435
10707
  logoUrl: string | null;
10436
10708
  }>;
10437
10709
  readonly link: _angular_core.Signal<string[] | null>;
10438
- /** Glyph del corazón: 18 en small, 20 en medium. */
10710
+ /** Glyph del corazón: 18 en small, 20 en medium y large. */
10439
10711
  readonly favIconSize: _angular_core.Signal<20 | 18>;
10440
10712
  readonly initial: _angular_core.Signal<string>;
10441
10713
  /**
@@ -10540,9 +10812,10 @@ interface SuiProductCardImage {
10540
10812
  /**
10541
10813
  * Tamaño de los botones del pie («+», lápiz y stepper), en la escala del
10542
10814
  * sui-button. `small` (36, el de siempre) es el default; `medium` (40) es
10543
- * extensión SUI (03-10-2026) para tocar con el dedo en mobile.
10815
+ * extensión SUI (03-10-2026); `large` (44) es el size nuevo del 04-10-2026
10816
+ * (dueño: piso táctil 44 en el teléfono).
10544
10817
  */
10545
- type SuiProductCardSize = 'small' | 'medium';
10818
+ type SuiProductCardSize = 'small' | 'medium' | 'large';
10546
10819
  /** Config del fallback sin imagen. */
10547
10820
  interface SuiProductCardFallback {
10548
10821
  /** `'name'` = banda de color + nombre (default) · `'icon'` = ícono. */
@@ -10593,8 +10866,8 @@ declare class SuiProductCard {
10593
10866
  * tachado debajo. Igual o menor → se ignora. El porcentaje se calcula, no se
10594
10867
  * pasa: un tercer número podría quedar desincronizado de los otros dos. */
10595
10868
  readonly precioLista: _angular_core.InputSignal<number | null>;
10596
- /** Tamaño de los botones del pie: `small` 36 (default) · `medium` 40 para
10597
- * mobile — extensión SUI (03-10-2026). */
10869
+ /** Tamaño de los botones del pie: `small` 36 (default) · `medium` 40 —
10870
+ * extensión SUI (03-10-2026) · `large` 44 para el teléfono (04-10-2026). */
10598
10871
  readonly size: _angular_core.InputSignal<SuiProductCardSize>;
10599
10872
  /** Tap en la card (abrir detalle del producto). */
10600
10873
  readonly openDetail: _angular_core.OutputEmitterRef<void>;
@@ -10612,10 +10885,10 @@ declare class SuiProductCard {
10612
10885
  pct: number;
10613
10886
  antes: string;
10614
10887
  } | null>;
10615
- /** Glyph del «+» / lápiz: 18 en small, 20 en medium. */
10888
+ /** Glyph del «+» / lápiz: 18 en small, 20 en medium y large. */
10616
10889
  readonly iconSize: _angular_core.Signal<20 | 18>;
10617
- /** Glyph del stepper: 16 en small, 20 en medium. */
10618
- readonly stepIconSize: _angular_core.Signal<16 | 20>;
10890
+ /** Glyph del stepper: 16 en small, 20 en medium y large. */
10891
+ readonly stepIconSize: _angular_core.Signal<20 | 16>;
10619
10892
  readonly showStepper: _angular_core.Signal<boolean>;
10620
10893
  /** Config resuelta de la imagen (string → { url }; `position` default 50).
10621
10894
  * null = sin imagen → fallback. */
@@ -10677,6 +10950,9 @@ declare class SuiSwitch implements ControlValueAccessor {
10677
10950
  readonly checked: _angular_core.InputSignal<boolean>;
10678
10951
  readonly checkedChange: _angular_core.OutputEmitterRef<boolean>;
10679
10952
  readonly disabled: _angular_core.InputSignal<boolean>;
10953
+ /** false = fuera del orden de Tab (tabindex -1). Para cuando un padre es el
10954
+ * control enfocable y este switch solo dibuja el estado. */
10955
+ readonly focusable: _angular_core.InputSignal<boolean>;
10680
10956
  private readonly _disabledByForm;
10681
10957
  readonly isDisabled: _angular_core.Signal<boolean>;
10682
10958
  /** CVA buffer — usado SOLO en form mode (formControlName/formControl).
@@ -10693,7 +10969,7 @@ declare class SuiSwitch implements ControlValueAccessor {
10693
10969
  registerOnTouched(fn: any): void;
10694
10970
  setDisabledState(isDisabled: boolean): void;
10695
10971
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiSwitch, never>;
10696
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSwitch, "sui-switch", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "checkedChange": "checkedChange"; }, never, never, true, never>;
10972
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSwitch, "sui-switch", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "focusable": { "alias": "focusable"; "required": false; "isSignal": true; }; }, { "checkedChange": "checkedChange"; }, never, never, true, never>;
10697
10973
  }
10698
10974
 
10699
10975
  type SuiSwitchCardType = 'basic' | 'left-icon' | 'avatar' | 'card-provider' | 'brand' | 'company';
@@ -10765,6 +11041,9 @@ type SuiSwitchCardType = 'basic' | 'left-icon' | 'avatar' | 'card-provider' | 'b
10765
11041
  * iOS WKWebView fix: touch listeners en host (CLAUDE.md).
10766
11042
  */
10767
11043
  declare class SuiSwitchCard implements ControlValueAccessor {
11044
+ private static _nextId;
11045
+ protected readonly labelId: string;
11046
+ protected readonly descriptionId: string;
10768
11047
  readonly type: _angular_core.InputSignal<SuiSwitchCardType>;
10769
11048
  /** Tamaño del switch interno — lo decide el padre (componente dumb). */
10770
11049
  readonly size: _angular_core.InputSignal<SuiSwitchSize>;
@@ -10777,7 +11056,7 @@ declare class SuiSwitchCard implements ControlValueAccessor {
10777
11056
  * `<sui-icon>` proyectado vía `[sui-switch-card-leading]` y se renderiza
10778
11057
  * con las MISMAS dimensiones (20×20 dentro del círculo de 40px).
10779
11058
  */
10780
- readonly emoji: _angular_core.InputSignal<"warning" | "label" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
11059
+ readonly emoji: _angular_core.InputSignal<"label" | "warning" | "pensive-face" | "confused-face" | "neutral-face" | "slightly-smiling-face" | "grinning-face-smiling-eyes" | "thinking-face" | "grinning-face" | "smiling-face-hearts" | "face-with-rolling-eyes" | "face-screaming" | "partying-face" | "star-struck" | "sleeping-face" | "package" | "receipt" | "money-bag" | "money-with-wings" | "shopping-cart" | "shopping-bags" | "card-index-dividers" | "bell" | "bell-with-slash" | "pushpin" | "mobile-phone" | "gear" | "locked" | "unlocked" | "wrench" | "hammer" | "magnifying-glass-tilted-left" | "spiral-calendar" | "bar-chart" | "delivery-truck" | "motorcycle" | "rocket" | "house" | "office-building" | "shop" | "dollar-banknote" | "glowing-star" | "kick-scooter" | "check-mark" | "check-mark-button" | "cross-mark" | "no-entry" | "sparkles" | "party-popper" | "waving-hand" | "thumbs-up" | "clapping-hands" | "handshake" | "busts-in-silhouette" | "pizza" | "hamburger" | "taco" | "birthday-cake" | null>;
10781
11060
  /**
10782
11061
  * URL de imagen para type='avatar' — se renderiza con sui-avatar size=lg
10783
11062
  * (40×40 redonda). Si la imagen falla, fallback automático a iniciales del
@@ -10809,7 +11088,6 @@ declare class SuiSwitchCard implements ControlValueAccessor {
10809
11088
  private _onChange;
10810
11089
  private _onTouched;
10811
11090
  onCardClick(e: MouseEvent): void;
10812
- onCardKey(e: Event): void;
10813
11091
  /** Reacciona al event del switch hijo — re-emite hacia el parent. */
10814
11092
  onSwitchChange(value: boolean): void;
10815
11093
  /** Emite intent hacia el parent. NO muta el state internamente (input es
@@ -10823,6 +11101,8 @@ declare class SuiSwitchCard implements ControlValueAccessor {
10823
11101
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSwitchCard, "sui-switch-card", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "emoji": { "alias": "emoji"; "required": false; "isSignal": true; }; "imageUrl": { "alias": "imageUrl"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "checkedChange": "checkedChange"; }, never, ["[sui-switch-card-leading]"], true, never>;
10824
11102
  }
10825
11103
 
11104
+ /** Sizes de la fila: los del switch + `2xlarge` (fila de 44, dueño 04-10-2026). */
11105
+ type SuiSwitchLabelSize = SuiSwitchSize | '2xlarge';
10826
11106
  /**
10827
11107
  * SUI Switch Label — SUI Design System 2.0
10828
11108
  *
@@ -10881,11 +11161,21 @@ declare class SuiSwitchCard implements ControlValueAccessor {
10881
11161
  * />
10882
11162
  */
10883
11163
  declare class SuiSwitchLabel implements ControlValueAccessor {
11164
+ private static _nextId;
11165
+ /** El sui-switch interno es el tab stop: toma su nombre del texto del label
11166
+ * (aria-labelledby) y su descripción de la descripción (revisión 04-10-2026). */
11167
+ protected readonly labelId: string;
11168
+ protected readonly descriptionId: string;
10884
11169
  readonly label: _angular_core.InputSignal<string>;
10885
11170
  readonly sublabel: _angular_core.InputSignal<string | null>;
10886
11171
  readonly description: _angular_core.InputSignal<string | null>;
10887
- /** Tamaño del switch interno — lo decide el padre (componente dumb). */
10888
- readonly size: _angular_core.InputSignal<SuiSwitchSize>;
11172
+ /** Tamaño del switch interno y del texto (large/xlarge → 16/24) — lo decide el padre (componente dumb).
11173
+ * `2xlarge` (canon, dueño 04-10-2026: piso táctil 44 en el teléfono): la fila
11174
+ * mide 44 como mínimo, switch 48 × 28 (el mayor), label 16/24, descripción 12. */
11175
+ readonly size: _angular_core.InputSignal<SuiSwitchLabelSize>;
11176
+ /** Size del sui-switch interno: `2xlarge` es un alto de fila, el switch se
11177
+ * queda en su tamaño mayor (xlarge, 48 × 28). */
11178
+ protected readonly controlSize: _angular_core.Signal<SuiSwitchSize>;
10889
11179
  /** Badge junto al label — string shorthand ('NEW') o SuiBadgeConfig
10890
11180
  (label + color/variant/size, tipado como sui-badge). null = sin badge. */
10891
11181
  readonly badge: _angular_core.InputSignal<string | SuiBadgeConfig | null>;
@@ -10936,8 +11226,9 @@ declare class SuiSwitchLabel implements ControlValueAccessor {
10936
11226
  * Tamaño del chip. `medium` (36 px) es el de siempre y el default: quien no
10937
11227
  * pase `size` no ve ningún cambio. `small` (32) para web densa; `large` (40)
10938
11228
  * para mobile, donde se toca con el dedo. Extensión SUI (03-10-2026).
11229
+ * `xlarge` (44) es el piso táctil del teléfono (canon del dueño, 04-10-2026).
10939
11230
  */
10940
- type SuiTabChipsSize = 'small' | 'medium' | 'large';
11231
+ type SuiTabChipsSize = 'small' | 'medium' | 'large' | 'xlarge';
10941
11232
  interface SuiTabChipItem {
10942
11233
  /** Valor único del chip (lo que devuelve `value`). */
10943
11234
  value: string;
@@ -10970,7 +11261,8 @@ interface SuiTabChipItem {
10970
11261
  * />
10971
11262
  *
10972
11263
  * Tamaños (extensión SUI, 03-10-2026): small 32 · medium 36 (default) ·
10973
- * large 40. Los tres con texto label-sm 14; cambia el alto y el aire lateral.
11264
+ * large 40. small y medium con texto label-sm 14; large en label-md 16/24 (regla
11265
+ * del 03-10-2026). Cambia el alto y el aire lateral.
10974
11266
  *
10975
11267
  * También acepta objetos:
10976
11268
  * <sui-tab-chips
@@ -10995,11 +11287,25 @@ declare class SuiTabChips implements AfterViewInit, OnDestroy {
10995
11287
  protected readonly stuck: _angular_core.WritableSignal<boolean>;
10996
11288
  /** Normaliza el input a SuiTabChipItem[] para iteración uniforme. */
10997
11289
  protected readonly normalizedChips: _angular_core.Signal<SuiTabChipItem[]>;
11290
+ /**
11291
+ * Chip que tiene el tab stop (roving tabindex). `null` = el activo. Las
11292
+ * flechas mueven el foco SIN seleccionar (activación manual: cada filtro
11293
+ * recarga datos); Enter/Espacio —el click nativo del <button>— selecciona.
11294
+ */
11295
+ private readonly _focusValue;
11296
+ /** Valor del único chip con tabindex 0: el enfocado con flechas, o el activo. */
11297
+ protected readonly tabStopValue: _angular_core.Signal<string>;
11298
+ /** Nombre accesible del chip: la cuenta va en el nombre («Pendientes, 3»). */
11299
+ protected chipAriaLabel(chip: SuiTabChipItem): string | null;
10998
11300
  private _intersectionObserver?;
10999
11301
  constructor();
11000
11302
  ngAfterViewInit(): void;
11001
11303
  ngOnDestroy(): void;
11002
11304
  protected select(value: string): void;
11305
+ /** Al salir del grupo el tab stop vuelve al chip activo (patrón de tabs). */
11306
+ protected onFocusout(event: FocusEvent): void;
11307
+ /** Flechas ← → / Home / End: mueven el foco entre chips (con wrap). */
11308
+ protected onKeydown(event: KeyboardEvent): void;
11003
11309
  private scrollToChip;
11004
11310
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTabChips, never>;
11005
11311
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTabChips, "sui-tab-chips", never, { "chips": { "alias": "chips"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "sticky": { "alias": "sticky"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "autoScroll": { "alias": "autoScroll"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
@@ -11345,6 +11651,15 @@ declare class SuiTabMenuHorizontal<T = string> {
11345
11651
  /** Glyph del ícono de la pestaña: 24 en xlarge, 20 en el resto. */
11346
11652
  readonly iconSize: _angular_core.Signal<20 | 24>;
11347
11653
  readonly tabChange: _angular_core.OutputEmitterRef<T>;
11654
+ private readonly tabItems?;
11655
+ /** Índice del único tab con tabindex 0: el activo, o el primero habilitado. */
11656
+ protected readonly tabStopIndex: _angular_core.Signal<number>;
11657
+ /**
11658
+ * Patrón tablist (WAI-ARIA, activación automática — a11y 04-10-2026):
11659
+ * ← → mueven el foco y activan la pestaña, con vuelta al inicio y
11660
+ * saltando las deshabilitadas; Home/End van a la primera/última.
11661
+ */
11662
+ protected onKeydown(event: KeyboardEvent): void;
11348
11663
  isActive(tab: SuiTabMenuHorizontalItem<T>): boolean;
11349
11664
  select(tab: SuiTabMenuHorizontalItem<T>): void;
11350
11665
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTabMenuHorizontal<any>, never>;
@@ -11372,51 +11687,6 @@ interface SuiTabMenuVerticalItem<T = string> {
11372
11687
  number?: number;
11373
11688
  disabled?: boolean;
11374
11689
  }
11375
- /**
11376
- * SUI Tab Menu Vertical — SUI Design System 2.0
11377
- *
11378
- * Figma file: 8p1k72aKKvzJV4XcvPS4VO
11379
- * Componente Figma: "Tab Menu Vertical [1.1]"
11380
- * 3516:10411 — set (Style=Card|List × Quantity 02–08 × divider)
11381
- * 3516:10412 — Card Quantity=03 con divider 'SELECT MENU'
11382
- * 3515:10326 — Tab Menu Vertical Items [1.1] (State × Active; leftIcon/rightIcon/number)
11383
- * 3515:10341 — Item Active/On (bg-weak-50)
11384
- *
11385
- * Navegación lateral (sidebar nav) con dos estilos de contenedor: Card (con
11386
- * borde/fondo/sombra) o List (plano).
11387
- *
11388
- * EXACT specs (Figma):
11389
- * Item (3515:10327/10341): gap 6px, padding 8px, radius-8, w-full, label flex-1
11390
- * text-left, overflow-clip
11391
- * Active/On: bg-weak-50 + text strong-950; leftIcon PRIMARY-BASE (verificado
11392
- * 2026-06-21 vía variable_defs + screenshot de 3515:10341 — difiere
11393
- * del horizontal, cuyo icono activo es strong-950, a propósito)
11394
- * Hover/Off: bg-weak-50 (igual fill que el active) + text strong-950 (3515:10334)
11395
- * Default/Off (Card): bg-white-0 + text/icon sub-600
11396
- * Default/Off (List): transparent + text/icon sub-600
11397
- * Container Card (3516:10412): bg-white-0, border 1px stroke-soft-200, p-10px,
11398
- * radius-16, shadow-x-small, flex-col gap-8px, overflow-clip
11399
- * Container List: flat (sin border/bg/shadow/padding), gap-8px
11400
- * Divider label (Content Divider [1.1] reusado): px-8px py-4px, text-soft-400,
11401
- * Subheading/XSmall (12px/16px line, +4% / 0.48px), uppercase
11402
- * number: badge state/error/base, p-2px, radius-full, text static-white
11403
- * rightIcon (chevron): pill bg-white-0, p-1px, radius-full, shadow-x-small,
11404
- * arrow-right-s-line 18px
11405
- *
11406
- * PENDING VERIFY:
11407
- * - El set de Figma no expone eje `size`; usa un único tamaño (item p-8px /
11408
- * icon 20px), por eso este componente NO tiene input `size`.
11409
- * - `disabled` por ítem es extensión SUI (Figma no muestra estado Disabled).
11410
- *
11411
- * Historia: hasta la v0.2.x este componente vivía como
11412
- * `<sui-tabs variant="vertical">`; en la v0.3.0 se separó en componente propio
11413
- * (junto a `sui-segmented-control` y `sui-tab-menu-horizontal`) espejando los
11414
- * tres sets independientes de Figma. Renombres vs la API vieja:
11415
- * - input `verticalStyle` → `menuStyle` (el prefijo "vertical" quedó
11416
- * redundante con el nombre del componente; no se usa `style` a secas para
11417
- * no chocar con el atributo HTML global `style`).
11418
- * - item `badge` → `number` y `chevron` → `rightIcon` (props del Figma).
11419
- */
11420
11690
  declare class SuiTabMenuVertical<T = string> {
11421
11691
  readonly tabs: _angular_core.InputSignal<SuiTabMenuVerticalItem<T>[]>;
11422
11692
  readonly active: _angular_core.ModelSignal<T | undefined>;
@@ -11428,13 +11698,26 @@ declare class SuiTabMenuVertical<T = string> {
11428
11698
  */
11429
11699
  readonly dividerLabel: _angular_core.InputSignal<string>;
11430
11700
  readonly tabChange: _angular_core.OutputEmitterRef<T>;
11701
+ private readonly tabItems?;
11702
+ /** id del divider: nombra el tablist (aria-labelledby). */
11703
+ protected readonly dividerId: string;
11704
+ /** Índice del único tab con tabindex 0: el activo, o el primero habilitado. */
11705
+ protected readonly tabStopIndex: _angular_core.Signal<number>;
11706
+ /**
11707
+ * Patrón tablist (WAI-ARIA, activación automática — a11y 04-10-2026):
11708
+ * ↑ ↓ mueven el foco y activan la pestaña, con vuelta al inicio y
11709
+ * saltando las deshabilitadas; Home/End van a la primera/última.
11710
+ */
11711
+ protected onKeydown(event: KeyboardEvent): void;
11431
11712
  isActive(tab: SuiTabMenuVerticalItem<T>): boolean;
11432
11713
  select(tab: SuiTabMenuVerticalItem<T>): void;
11433
11714
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTabMenuVertical<any>, never>;
11434
11715
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTabMenuVertical<any>, "sui-tab-menu-vertical", never, { "tabs": { "alias": "tabs"; "required": true; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "menuStyle": { "alias": "menuStyle"; "required": false; "isSignal": true; }; "dividerLabel": { "alias": "dividerLabel"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; "tabChange": "tabChange"; }, never, never, true, never>;
11435
11716
  }
11436
11717
 
11437
- type SuiSegmentedControlSize = 'small' | 'medium' | 'large' | 'xlarge';
11718
+ /** `2xlarge` (44 por segmento, también solo ícono): piso táctil del teléfono,
11719
+ * canon del dueño 04-10-2026. Los demás sizes no cambian. */
11720
+ type SuiSegmentedControlSize = 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge';
11438
11721
  interface SuiSegmentedControlItem<T = string> {
11439
11722
  value: T;
11440
11723
  label: string;
@@ -11469,7 +11752,7 @@ interface SuiSegmentedControlItem<T = string> {
11469
11752
  * Disabled: color discreto text-disabled-300 (NO opacity)
11470
11753
  *
11471
11754
  * EXTRA FEATURES (extensión SUI, el set de Figma no expone eje `size`):
11472
- * - prop `size` (small/medium/large/xlarge); solo medium está 1:1 con Figma.
11755
+ * - prop `size` (small/medium/large/xlarge/2xlarge); solo medium está 1:1 con Figma.
11473
11756
  * - prop `disabled` por ítem.
11474
11757
  *
11475
11758
  * Historia: hasta la v0.2.x este componente vivía como `<sui-tabs variant="segment">`;
@@ -11480,6 +11763,8 @@ declare class SuiSegmentedControl<T = string> implements AfterViewInit {
11480
11763
  readonly tabs: _angular_core.InputSignal<SuiSegmentedControlItem<T>[]>;
11481
11764
  readonly active: _angular_core.ModelSignal<T | undefined>;
11482
11765
  readonly size: _angular_core.InputSignal<SuiSegmentedControlSize>;
11766
+ /** Nombre accesible del grupo («Tipo de entrega»). Sin él, el lector anuncia solo «grupo de radio». */
11767
+ readonly ariaLabel: _angular_core.InputSignal<string | null>;
11483
11768
  readonly tabChange: _angular_core.OutputEmitterRef<T>;
11484
11769
  segmentItems?: QueryList<ElementRef<HTMLElement>>;
11485
11770
  segmentTrack?: ElementRef<HTMLElement>;
@@ -11491,10 +11776,160 @@ declare class SuiSegmentedControl<T = string> implements AfterViewInit {
11491
11776
  constructor();
11492
11777
  ngAfterViewInit(): void;
11493
11778
  private updateIndicator;
11779
+ /** Índice del único ítem con tabindex 0: el activo, o el primero habilitado. */
11780
+ protected readonly tabStopIndex: _angular_core.Signal<number>;
11781
+ /**
11782
+ * Patrón radiogroup (WAI-ARIA): ← → ↑ ↓ mueven el foco Y eligen, con vuelta
11783
+ * al inicio; Home/End al primero/último. Los deshabilitados se saltan.
11784
+ */
11785
+ protected onKeydown(event: KeyboardEvent): void;
11494
11786
  isActive(tab: SuiSegmentedControlItem<T>): boolean;
11495
11787
  select(tab: SuiSegmentedControlItem<T>): void;
11496
11788
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiSegmentedControl<any>, never>;
11497
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSegmentedControl<any>, "sui-segmented-control", never, { "tabs": { "alias": "tabs"; "required": true; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; "tabChange": "tabChange"; }, never, never, true, never>;
11789
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSegmentedControl<any>, "sui-segmented-control", never, { "tabs": { "alias": "tabs"; "required": true; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; "tabChange": "tabChange"; }, never, never, true, never>;
11790
+ }
11791
+
11792
+ type SuiTagStyle = 'stroke' | 'gray';
11793
+ /**
11794
+ * Tamaño. `medium` (24) es el de Figma y el default. `large` 32 y `xlarge` 40
11795
+ * son extensión SUI (03-10-2026) para mobile, con la X de quitar más grande.
11796
+ */
11797
+ type SuiTagSize = 'medium' | 'large' | 'xlarge';
11798
+ /**
11799
+ * SUI Tag — SUI Design System 2.0
11800
+ *
11801
+ * Figma file: 8p1k72aKKvzJV4XcvPS4VO
11802
+ * Component set: Tag [1.1] (frame 431:16147)
11803
+ * Matrix: Type(6) × Style(2: Stroke, Gray) × State(4) × Dismiss(2) = 96 variants.
11804
+ *
11805
+ * Variants pulled for verification (get_design_context + get_variable_defs):
11806
+ * - 431:16543 Basic / Stroke / Default / Dismiss=On
11807
+ * - 431:18054 Basic / Gray / Default / Dismiss=On
11808
+ * - 431:16548 LeftIcon/ Stroke / Default / Dismiss=On (pushpin-fill leading 16×16)
11809
+ * - 431:17022 Basic / Stroke / Hover / Dismiss=On
11810
+ * - 431:17141 Basic / Stroke / Active / Dismiss=On
11811
+ * - 431:18049 Basic / Gray / Hover / Dismiss=On
11812
+ * - 431:18064 Basic / Gray / Active / Dismiss=On
11813
+ * - 431:17379 Basic / Stroke / Disabled/ Dismiss=On
11814
+ * - 431:18059 Basic / Gray / Disabled/ Dismiss=On
11815
+ *
11816
+ * EXACT (pulled, verified pixel/token):
11817
+ * - Container: border-radius 6px (--sui-radius-6), height 24px (py=4px + 16px line).
11818
+ * (24 es `medium`, el default; ver TAMAÑOS abajo para large/xlarge.)
11819
+ * NOTE: distinto del badge (radius-full 999px) — NO confundir.
11820
+ * - Typography: Label/X Small (Inter Medium, 12px / line 16 / tracking 0, NO uppercase),
11821
+ * font-feature 'ss11' 1, 'calt' 0, 'liga' 0. Label color text-sub-600 (#5c5c5c).
11822
+ * - Sublabel: Inter Regular 12/16, color text-soft-400 (#a3a3a3), gap 2px al label.
11823
+ * - Padding básico (Basic, no leading): pl=8 pr=8 py=4. Con dismiss: pl=8 pr=4 py=4
11824
+ * (la X 16×16 come el espacio derecho). Con leading element: padding 4px all-around
11825
+ * (pl=4) + gap 4px entre leading y el bloque de texto.
11826
+ * - Leading element + dismiss icon: ambos son slots 16×16. gap leading↔texto = 4px;
11827
+ * gap label↔sublabel↔close = 2px (bloque "Text" interno).
11828
+ * - close-fill dismiss: glyph X (asset 41:8907, ≈ RemixIcon close); renderizado con
11829
+ * <sui-icon name="close-line"> 16px (canon RemixIcon, sin dependencia de asset).
11830
+ * Color del glyph por estado (verificado node-by-node, NO hereda del label):
11831
+ * Default (Stroke y Gray) → icon-soft-400 (#a3a3a3) — 431:16547 / 431:18058
11832
+ * Active → icon-strong-950 (#171717) — 431:17141 / 431:18064
11833
+ * Disabled → icon-disabled-300 (#d1d1d1) — 431:17379 / 431:18059
11834
+ * Hover del PROPIO botón close (affordance) → strong-950 (decisión local, no en Figma).
11835
+ * NO usa sui-compact-button: en Figma el close es un glyph 16×16 plano (sin bg/border/
11836
+ * shadow/padding), mientras sui-compact-button es un container 20×20 con padding 2px y
11837
+ * estilos de botón — metería un cuadro 20px en un tag de 24px y rompería el layout.
11838
+ *
11839
+ * - State tokens (verified node-by-node):
11840
+ * Stroke Default → bg white-0 / border soft-200 / text+icon sub-600
11841
+ * Stroke Hover → bg weak-50 / border soft-200 / text+icon sub-600 (431:17022)
11842
+ * Stroke Active → bg white-0 / border strong-950 / text+icon strong-950 (431:17141)
11843
+ * Stroke Disabled → bg weak-50 / NO border / text+icon disabled-300 (431:17379)
11844
+ * Gray Default → bg weak-50 / NO border / text sub-600 / icon soft-400
11845
+ * Gray Hover → bg white-0 / border soft-200 / text sub-600 / icon soft-400 (431:18049)
11846
+ * Gray Active → bg white-0 / border strong-950 / text+icon strong-950 (431:18064)
11847
+ * Gray Disabled → bg weak-50 / NO border / text+icon disabled-300 (431:18059)
11848
+ *
11849
+ * ARQUITECTURA — Type via proyección (NO 6 enums rígidos con assets baked):
11850
+ * Los 6 "Type" de Figma (Basic, Left Icon, Avatar, Country, Brand, Company)
11851
+ * colapsan a dos casos: SIN leading element vs CON leading element 16×16 + gap-4.
11852
+ * El leading se proyecta vía `[data-slot=start]`, así el consumer pasa:
11853
+ * - Left Icon → <sui-icon name="..." data-slot="start" size="16">
11854
+ * - Avatar → <sui-avatar size="xs" data-slot="start" ...> (xs=20, escalado por CSS a 16)
11855
+ * - Country → <sui-flag name="peru" size="xs" data-slot="start"> (xs=16)
11856
+ * - Brand/Company → <img data-slot="start" ... 16×16>
11857
+ * Esto evita baked-in flags/brands/avatars (que requerirían descargar 262 flags +
11858
+ * logos de marca arbitrarios) y mantiene el componente agnóstico al contenido.
11859
+ * El input `leading` (boolean) ajusta padding/gap cuando hay leading element.
11860
+ *
11861
+ * INTERACTIVITY:
11862
+ * Figma documenta Hover/Active states → el tag PUEDE ser interactivo (clickeable).
11863
+ * `interactive` input habilita los estilos :hover/:active del host. Si el tag no es
11864
+ * clickeable (solo display), `interactive=false` (default) los suprime. El dismiss
11865
+ * button SIEMPRE tiene su propio hover/active independiente del host.
11866
+ *
11867
+ * PENDING VERIFY (inferido, sin confirmar pixel-exacto en Figma):
11868
+ * - Avatar leading a 16×16: sui-avatar size más chico es xs=20 (no hay 16). Se
11869
+ * escala vía CSS (width/height 16) en el slot. Figma muestra el avatar a 16×16
11870
+ * exacto — el escalado CSS de un avatar 20 podría diferir ~sub-pixel del asset.
11871
+ * - Hover/Active como estados :hover/:active CSS reales (no data-attr forzados):
11872
+ * Figma los modela como variantes State separadas. Se mapean a pseudo-clases
11873
+ * cuando `interactive=true`. Si un consumer necesita forzar el estado visual
11874
+ * (ej. en un storybook/preview), no hay input `state` explícito — se asume que
11875
+ * el pseudo-estado real del DOM basta.
11876
+ * - Disabled icon color: Figma Disabled solo se pulló en Basic (sin leading). Se
11877
+ * asume disabled-300 también para el leading icon/avatar/flag proyectado, pero el
11878
+ * contenido proyectado (avatar/flag con color propio) NO se puede forzar a gris
11879
+ * desde el host — el consumer debe atenuar su propio leading si lo requiere.
11880
+ *
11881
+ * TAMAÑOS — extensión SUI (03-10-2026, pedido del dueño):
11882
+ * Figma trae solo 24 px, con una X de 16 que en mobile queda muy por debajo de
11883
+ * los 44 del dedo. Se suman dos tamaños en la escala del sui-button:
11884
+ * medium 24 · Label/X Small 12/16 · leading 16 · X 16 (default, Figma)
11885
+ * large 32 · Label/Small 14/20 · leading 20 · X 20
11886
+ * xlarge 40 · Label/Medium 16/24 · leading 20 · X 24
11887
+ * En large/xlarge la X además se agranda por dentro (::before invisible) para
11888
+ * que el área táctil llegue al alto del tag sin cambiar cómo se ve.
11889
+ *
11890
+ * CUSTOM (no en Figma — add-on local): ninguno por ahora. extraFeatures del
11891
+ * reporte de auditoría estaba vacío.
11892
+ */
11893
+ declare class SuiTag {
11894
+ /** Visual style. `stroke` = white bg + soft border; `gray` = weak-50 bg, no border. Default stroke. */
11895
+ readonly tagStyle: _angular_core.InputSignal<SuiTagStyle>;
11896
+ /** Tamaño: medium 24 (default, Figma) · large 32 · xlarge 40 (mobile). */
11897
+ readonly size: _angular_core.InputSignal<SuiTagSize>;
11898
+ /** Px del glyph de la X por tamaño (16 / 20 / 24). */
11899
+ readonly dismissIconSize: _angular_core.Signal<number>;
11900
+ /**
11901
+ * True cuando hay un leading element proyectado (icon/avatar/flag/brand/company)
11902
+ * en `[data-slot=start]`. Ajusta el padding (pl=4) y agrega gap=4 leading↔texto.
11903
+ * El consumer DEBE setearlo cuando proyecta un start slot.
11904
+ */
11905
+ readonly leading: _angular_core.InputSignal<boolean>;
11906
+ /** Texto secundario opcional (ej. '(4)'), render en text-soft-400, gap 2px tras el label. */
11907
+ readonly sublabel: _angular_core.InputSignal<string>;
11908
+ /** Muestra el botón de cierre (X 16×16) al final del tag. Emite `(dismiss)`. */
11909
+ readonly dismissible: _angular_core.InputSignal<boolean>;
11910
+ /**
11911
+ * Habilita los estilos :hover / :active del host (Figma States Hover/Active).
11912
+ * Solo cuando el tag entero es clickeable. Default false (tag de display puro).
11913
+ */
11914
+ readonly interactive: _angular_core.InputSignal<boolean>;
11915
+ /** Estado deshabilitado: override de tokens a disabled-300, pointer-events none. */
11916
+ readonly disabled: _angular_core.InputSignal<boolean>;
11917
+ /** aria-label opcional para el botón de cierre. Default 'Quitar'. */
11918
+ readonly dismissLabel: _angular_core.InputSignal<string>;
11919
+ /** Emitido al clickear el botón de cierre (solo si dismissible y no disabled). */
11920
+ readonly dismiss: _angular_core.OutputEmitterRef<void>;
11921
+ /** True cuando hay sublabel no vacío para renderizar el span secundario. */
11922
+ readonly showsSublabel: _angular_core.Signal<boolean>;
11923
+ private readonly _el;
11924
+ private _spacePressed;
11925
+ /** Solo el host interactivo y con el foco en él (no la X de adentro). */
11926
+ private _teclaMia;
11927
+ _onEnter(event: Event): void;
11928
+ _onSpaceDown(event: Event): void;
11929
+ _onSpaceUp(event: Event): void;
11930
+ protected onDismiss(event: MouseEvent): void;
11931
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTag, never>;
11932
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTag, "sui-tag", never, { "tagStyle": { "alias": "tagStyle"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "leading": { "alias": "leading"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "dismissLabel": { "alias": "dismissLabel"; "required": false; "isSignal": true; }; }, { "dismiss": "dismiss"; }, never, ["[data-slot=start]", "*"], true, never>;
11498
11933
  }
11499
11934
 
11500
11935
  type SuiTagInputSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
@@ -11608,11 +12043,26 @@ declare class SuiTagInput implements ControlValueAccessor {
11608
12043
  * jerarquía del formulario (y `SuiFormLabelSize` llega hasta medium).
11609
12044
  */
11610
12045
  protected readonly labelSize: _angular_core.Signal<SuiFormLabelSize>;
12046
+ /**
12047
+ * Size de los chips (fix 04-10-2026, revisión de átomos y moléculas): antes
12048
+ * los chips iban siempre en medium y su X medía 16 aunque el campo fuera
12049
+ * large o xlarge. Ahora el chip acompaña al campo grande:
12050
+ * xsmall · small · medium → tag medium (24, X 16) — sin cambio
12051
+ * large → tag large (32, X 20, se toca en 32)
12052
+ * xlarge → tag xlarge (40, X 24, se toca en 44 en el teléfono)
12053
+ */
12054
+ protected readonly tagSize: _angular_core.Signal<SuiTagSize>;
11611
12055
  readonly label: _angular_core.InputSignal<string | null>;
11612
12056
  readonly sublabel: _angular_core.InputSignal<string | null>;
11613
12057
  readonly required: _angular_core.InputSignal<boolean>;
11614
12058
  readonly tooltip: _angular_core.InputSignal<string | null>;
11615
12059
  readonly hint: _angular_core.InputSignal<string | null>;
12060
+ /** a11y (04-10-2026): ids propios por instancia para enlazar el label
12061
+ * (`for`) y el hint/error (`aria-describedby`) con el control. */
12062
+ protected readonly _controlId: string;
12063
+ protected readonly _hintId: string;
12064
+ /** El texto debajo del campo: el error manda sobre el hint. */
12065
+ protected readonly _hintMessage: _angular_core.Signal<string | null>;
11616
12066
  /** Permite que coma además de Enter agregue un tag. Default false (solo Enter). */
11617
12067
  readonly commaSeparator: _angular_core.InputSignal<boolean>;
11618
12068
  /** Permite tags duplicados. Default false (dedupe case-sensitive). */
@@ -11659,142 +12109,6 @@ declare class SuiTagInput implements ControlValueAccessor {
11659
12109
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTagInput, "sui-tag-input", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "rightIcon": { "alias": "rightIcon"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "commaSeparator": { "alias": "commaSeparator"; "required": false; "isSignal": true; }; "allowDuplicates": { "alias": "allowDuplicates"; "required": false; "isSignal": true; }; "maxTags": { "alias": "maxTags"; "required": false; "isSignal": true; }; "addOnBlur": { "alias": "addOnBlur"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "tagAdded": "tagAdded"; "tagRemoved": "tagRemoved"; }, never, ["[slot=right]"], true, never>;
11660
12110
  }
11661
12111
 
11662
- type SuiTagStyle = 'stroke' | 'gray';
11663
- /**
11664
- * Tamaño. `medium` (24) es el de Figma y el default. `large` 32 y `xlarge` 40
11665
- * son extensión SUI (03-10-2026) para mobile, con la X de quitar más grande.
11666
- */
11667
- type SuiTagSize = 'medium' | 'large' | 'xlarge';
11668
- /**
11669
- * SUI Tag — SUI Design System 2.0
11670
- *
11671
- * Figma file: 8p1k72aKKvzJV4XcvPS4VO
11672
- * Component set: Tag [1.1] (frame 431:16147)
11673
- * Matrix: Type(6) × Style(2: Stroke, Gray) × State(4) × Dismiss(2) = 96 variants.
11674
- *
11675
- * Variants pulled for verification (get_design_context + get_variable_defs):
11676
- * - 431:16543 Basic / Stroke / Default / Dismiss=On
11677
- * - 431:18054 Basic / Gray / Default / Dismiss=On
11678
- * - 431:16548 LeftIcon/ Stroke / Default / Dismiss=On (pushpin-fill leading 16×16)
11679
- * - 431:17022 Basic / Stroke / Hover / Dismiss=On
11680
- * - 431:17141 Basic / Stroke / Active / Dismiss=On
11681
- * - 431:18049 Basic / Gray / Hover / Dismiss=On
11682
- * - 431:18064 Basic / Gray / Active / Dismiss=On
11683
- * - 431:17379 Basic / Stroke / Disabled/ Dismiss=On
11684
- * - 431:18059 Basic / Gray / Disabled/ Dismiss=On
11685
- *
11686
- * EXACT (pulled, verified pixel/token):
11687
- * - Container: border-radius 6px (--sui-radius-6), height 24px (py=4px + 16px line).
11688
- * (24 es `medium`, el default; ver TAMAÑOS abajo para large/xlarge.)
11689
- * NOTE: distinto del badge (radius-full 999px) — NO confundir.
11690
- * - Typography: Label/X Small (Inter Medium, 12px / line 16 / tracking 0, NO uppercase),
11691
- * font-feature 'ss11' 1, 'calt' 0, 'liga' 0. Label color text-sub-600 (#5c5c5c).
11692
- * - Sublabel: Inter Regular 12/16, color text-soft-400 (#a3a3a3), gap 2px al label.
11693
- * - Padding básico (Basic, no leading): pl=8 pr=8 py=4. Con dismiss: pl=8 pr=4 py=4
11694
- * (la X 16×16 come el espacio derecho). Con leading element: padding 4px all-around
11695
- * (pl=4) + gap 4px entre leading y el bloque de texto.
11696
- * - Leading element + dismiss icon: ambos son slots 16×16. gap leading↔texto = 4px;
11697
- * gap label↔sublabel↔close = 2px (bloque "Text" interno).
11698
- * - close-fill dismiss: glyph X (asset 41:8907, ≈ RemixIcon close); renderizado con
11699
- * <sui-icon name="close-line"> 16px (canon RemixIcon, sin dependencia de asset).
11700
- * Color del glyph por estado (verificado node-by-node, NO hereda del label):
11701
- * Default (Stroke y Gray) → icon-soft-400 (#a3a3a3) — 431:16547 / 431:18058
11702
- * Active → icon-strong-950 (#171717) — 431:17141 / 431:18064
11703
- * Disabled → icon-disabled-300 (#d1d1d1) — 431:17379 / 431:18059
11704
- * Hover del PROPIO botón close (affordance) → strong-950 (decisión local, no en Figma).
11705
- * NO usa sui-compact-button: en Figma el close es un glyph 16×16 plano (sin bg/border/
11706
- * shadow/padding), mientras sui-compact-button es un container 20×20 con padding 2px y
11707
- * estilos de botón — metería un cuadro 20px en un tag de 24px y rompería el layout.
11708
- *
11709
- * - State tokens (verified node-by-node):
11710
- * Stroke Default → bg white-0 / border soft-200 / text+icon sub-600
11711
- * Stroke Hover → bg weak-50 / border soft-200 / text+icon sub-600 (431:17022)
11712
- * Stroke Active → bg white-0 / border strong-950 / text+icon strong-950 (431:17141)
11713
- * Stroke Disabled → bg weak-50 / NO border / text+icon disabled-300 (431:17379)
11714
- * Gray Default → bg weak-50 / NO border / text sub-600 / icon soft-400
11715
- * Gray Hover → bg white-0 / border soft-200 / text sub-600 / icon soft-400 (431:18049)
11716
- * Gray Active → bg white-0 / border strong-950 / text+icon strong-950 (431:18064)
11717
- * Gray Disabled → bg weak-50 / NO border / text+icon disabled-300 (431:18059)
11718
- *
11719
- * ARQUITECTURA — Type via proyección (NO 6 enums rígidos con assets baked):
11720
- * Los 6 "Type" de Figma (Basic, Left Icon, Avatar, Country, Brand, Company)
11721
- * colapsan a dos casos: SIN leading element vs CON leading element 16×16 + gap-4.
11722
- * El leading se proyecta vía `[data-slot=start]`, así el consumer pasa:
11723
- * - Left Icon → <sui-icon name="..." data-slot="start" size="16">
11724
- * - Avatar → <sui-avatar size="xs" data-slot="start" ...> (xs=20, escalado por CSS a 16)
11725
- * - Country → <sui-flag name="peru" size="xs" data-slot="start"> (xs=16)
11726
- * - Brand/Company → <img data-slot="start" ... 16×16>
11727
- * Esto evita baked-in flags/brands/avatars (que requerirían descargar 262 flags +
11728
- * logos de marca arbitrarios) y mantiene el componente agnóstico al contenido.
11729
- * El input `leading` (boolean) ajusta padding/gap cuando hay leading element.
11730
- *
11731
- * INTERACTIVITY:
11732
- * Figma documenta Hover/Active states → el tag PUEDE ser interactivo (clickeable).
11733
- * `interactive` input habilita los estilos :hover/:active del host. Si el tag no es
11734
- * clickeable (solo display), `interactive=false` (default) los suprime. El dismiss
11735
- * button SIEMPRE tiene su propio hover/active independiente del host.
11736
- *
11737
- * PENDING VERIFY (inferido, sin confirmar pixel-exacto en Figma):
11738
- * - Avatar leading a 16×16: sui-avatar size más chico es xs=20 (no hay 16). Se
11739
- * escala vía CSS (width/height 16) en el slot. Figma muestra el avatar a 16×16
11740
- * exacto — el escalado CSS de un avatar 20 podría diferir ~sub-pixel del asset.
11741
- * - Hover/Active como estados :hover/:active CSS reales (no data-attr forzados):
11742
- * Figma los modela como variantes State separadas. Se mapean a pseudo-clases
11743
- * cuando `interactive=true`. Si un consumer necesita forzar el estado visual
11744
- * (ej. en un storybook/preview), no hay input `state` explícito — se asume que
11745
- * el pseudo-estado real del DOM basta.
11746
- * - Disabled icon color: Figma Disabled solo se pulló en Basic (sin leading). Se
11747
- * asume disabled-300 también para el leading icon/avatar/flag proyectado, pero el
11748
- * contenido proyectado (avatar/flag con color propio) NO se puede forzar a gris
11749
- * desde el host — el consumer debe atenuar su propio leading si lo requiere.
11750
- *
11751
- * TAMAÑOS — extensión SUI (03-10-2026, pedido del dueño):
11752
- * Figma trae solo 24 px, con una X de 16 que en mobile queda muy por debajo de
11753
- * los 44 del dedo. Se suman dos tamaños en la escala del sui-button:
11754
- * medium 24 · Label/X Small 12/16 · leading 16 · X 16 (default, Figma)
11755
- * large 32 · Label/Small 14/20 · leading 20 · X 20
11756
- * xlarge 40 · Label/Medium 16/24 · leading 20 · X 24
11757
- * En large/xlarge la X además se agranda por dentro (::before invisible) para
11758
- * que el área táctil llegue al alto del tag sin cambiar cómo se ve.
11759
- *
11760
- * CUSTOM (no en Figma — add-on local): ninguno por ahora. extraFeatures del
11761
- * reporte de auditoría estaba vacío.
11762
- */
11763
- declare class SuiTag {
11764
- /** Visual style. `stroke` = white bg + soft border; `gray` = weak-50 bg, no border. Default stroke. */
11765
- readonly tagStyle: _angular_core.InputSignal<SuiTagStyle>;
11766
- /** Tamaño: medium 24 (default, Figma) · large 32 · xlarge 40 (mobile). */
11767
- readonly size: _angular_core.InputSignal<SuiTagSize>;
11768
- /** Px del glyph de la X por tamaño (16 / 20 / 24). */
11769
- readonly dismissIconSize: _angular_core.Signal<number>;
11770
- /**
11771
- * True cuando hay un leading element proyectado (icon/avatar/flag/brand/company)
11772
- * en `[data-slot=start]`. Ajusta el padding (pl=4) y agrega gap=4 leading↔texto.
11773
- * El consumer DEBE setearlo cuando proyecta un start slot.
11774
- */
11775
- readonly leading: _angular_core.InputSignal<boolean>;
11776
- /** Texto secundario opcional (ej. '(4)'), render en text-soft-400, gap 2px tras el label. */
11777
- readonly sublabel: _angular_core.InputSignal<string>;
11778
- /** Muestra el botón de cierre (X 16×16) al final del tag. Emite `(dismiss)`. */
11779
- readonly dismissible: _angular_core.InputSignal<boolean>;
11780
- /**
11781
- * Habilita los estilos :hover / :active del host (Figma States Hover/Active).
11782
- * Solo cuando el tag entero es clickeable. Default false (tag de display puro).
11783
- */
11784
- readonly interactive: _angular_core.InputSignal<boolean>;
11785
- /** Estado deshabilitado: override de tokens a disabled-300, pointer-events none. */
11786
- readonly disabled: _angular_core.InputSignal<boolean>;
11787
- /** aria-label opcional para el botón de cierre. Default 'Quitar'. */
11788
- readonly dismissLabel: _angular_core.InputSignal<string>;
11789
- /** Emitido al clickear el botón de cierre (solo si dismissible y no disabled). */
11790
- readonly dismiss: _angular_core.OutputEmitterRef<void>;
11791
- /** True cuando hay sublabel no vacío para renderizar el span secundario. */
11792
- readonly showsSublabel: _angular_core.Signal<boolean>;
11793
- protected onDismiss(event: MouseEvent): void;
11794
- static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTag, never>;
11795
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTag, "sui-tag", never, { "tagStyle": { "alias": "tagStyle"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "leading": { "alias": "leading"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "dismissLabel": { "alias": "dismissLabel"; "required": false; "isSignal": true; }; }, { "dismiss": "dismiss"; }, never, ["[data-slot=start]", "*"], true, never>;
11796
- }
11797
-
11798
12112
  /**
11799
12113
  * Tamaño del campo — los mismos nombres que `sui-input` para que un formulario
11800
12114
  * pase el mismo `size` a los dos. Cambia el padding y el radio (el alto lo
@@ -11912,6 +12226,12 @@ declare class SuiTextarea implements ControlValueAccessor {
11912
12226
  readonly errorMessage: _angular_core.InputSignal<string | null>;
11913
12227
  readonly label: _angular_core.InputSignal<string | null>;
11914
12228
  readonly hint: _angular_core.InputSignal<string | null>;
12229
+ /** a11y (04-10-2026): ids propios por instancia para enlazar el label
12230
+ * (`for`) y el hint/error (`aria-describedby`) con el control. */
12231
+ protected readonly _controlId: string;
12232
+ protected readonly _hintId: string;
12233
+ /** El texto debajo del campo: el error manda sobre el hint. */
12234
+ protected readonly _hintMessage: _angular_core.Signal<string | null>;
11915
12235
  readonly autocomplete: _angular_core.InputSignal<string | null>;
11916
12236
  readonly resizable: _angular_core.InputSignal<boolean>;
11917
12237
  /**
@@ -12226,13 +12546,15 @@ interface ColumnItem {
12226
12546
  * @input placeholder / disabled / size
12227
12547
  * @input format — '12h' (default, AM/PM) | '24h'
12228
12548
  * @input step — incremento de minutos en la lista (default 5)
12229
- * @input durationPresets — pills de duración rápida (default 15/30/45/60 min)
12549
+ * @input durationPresets — pills de duración rápida (default [] — ver la nota del input)
12230
12550
  * @input inline — renderiza el panel sin trigger ni popover
12231
12551
  * @input showFooter — muestra Cancel/Apply (default true)
12232
12552
  * @model value — SuiTimeValue | null (two-way + CVA)
12233
12553
  */
12234
- /** `large` (48) es extensión SUI (03-10-2026) para mobile. */
12235
- type SuiTimePickerSize = 'small' | 'medium' | 'large';
12554
+ /** `large` (48) es extensión SUI (03-10-2026) para mobile. `xlarge` (52) es
12555
+ * canon del dueño 04-10-2026 (piso táctil de 44 en el teléfono): campo de 52,
12556
+ * filas de 44 con texto 16 y Cancelar/Aplicar en large. */
12557
+ type SuiTimePickerSize = 'small' | 'medium' | 'large' | 'xlarge';
12236
12558
  declare class SuiTimePicker implements ControlValueAccessor {
12237
12559
  readonly label: _angular_core.InputSignal<string | null>;
12238
12560
  readonly sublabel: _angular_core.InputSignal<string | null>;
@@ -12247,17 +12569,28 @@ declare class SuiTimePicker implements ControlValueAccessor {
12247
12569
  * Alto del campo: small 36 · medium 40 (default) · large 48 (extensión SUI,
12248
12570
  * 03-10-2026, para mobile: mismo alto que sui-input/sui-select large). En
12249
12571
  * large las filas del panel miden 44 y Cancelar/Aplicar van en large.
12572
+ * xlarge (52): canon del dueño 04-10-2026, el mismo panel que large con el
12573
+ * campo de 52 (el alto de sui-input xlarge).
12250
12574
  */
12251
12575
  readonly size: _angular_core.InputSignal<SuiTimePickerSize>;
12252
12576
  /** sui-form-label no tiene large: el label queda en medium. */
12253
12577
  protected readonly labelSize: _angular_core.Signal<"small" | "medium">;
12254
- /** Botones del footer: large (48) con el campo large; small (36) si no. */
12578
+ /** Panel grande (filas de 44 con texto 16) con el campo large o xlarge. */
12579
+ protected readonly panelLarge: _angular_core.Signal<boolean>;
12580
+ /**
12581
+ * Botones del footer: large (48) con el campo large/xlarge y SIEMPRE en
12582
+ * mobile (fix 04-10-2026, como el sui-datepicker: Cancelar/Aplicar se tocan
12583
+ * con el dedo aunque el campo vaya en medium); small (36, Figma) si no.
12584
+ */
12255
12585
  protected readonly footerButtonSize: _angular_core.Signal<"small" | "large">;
12256
12586
  /** Formato de display: '12h' (AM/PM) o '24h'. */
12257
12587
  readonly format: _angular_core.InputSignal<SuiTimeFormat>;
12258
12588
  /** Incremento de minutos de la lista (1, 5, 15, ...). Default 5. */
12259
12589
  readonly step: _angular_core.InputSignal<number>;
12260
- /** Pills de duración rápida bajo las columnas. [] para ocultarlas. */
12590
+ /** Pills de duración rápida bajo las columnas. Default `[]` (fix 04-10-2026):
12591
+ * los presets se aplican como «tiempo desde la medianoche» («30 min» → 12:30
12592
+ * AM), así que de fábrica rompían la hora; los 7 usos de la app ya pasaban
12593
+ * `[]`. Para mostrarlos, pasar `DEFAULT_DURATION_PRESETS` o una lista propia. */
12261
12594
  readonly durationPresets: _angular_core.InputSignal<readonly SuiTimeDurationPreset[]>;
12262
12595
  /** Renderiza el panel inline (sin trigger ni popover). */
12263
12596
  readonly inline: _angular_core.InputSignal<boolean>;
@@ -12280,6 +12613,9 @@ declare class SuiTimePicker implements ControlValueAccessor {
12280
12613
  ng-template se declara en este componente. */
12281
12614
  private readonly _columnEls;
12282
12615
  private readonly _injector;
12616
+ private readonly _destroyRef;
12617
+ /** Mobile (≤767 px), el mismo corte que sui-datepicker. */
12618
+ private readonly _isMobile;
12283
12619
  private _onChange;
12284
12620
  private _onTouched;
12285
12621
  constructor();
@@ -12960,5 +13296,5 @@ declare class SuiTooltipPanel {
12960
13296
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTooltipPanel, "sui-tooltip-panel", never, { "text": { "alias": "text"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "theme": { "alias": "theme"; "required": false; "isSignal": true; }; "showArrow": { "alias": "showArrow"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "dismissed": "dismissed"; }, never, never, true, never>;
12961
13297
  }
12962
13298
 
12963
- export { DAY_LABELS_ES, DEFAULT_DURATION_PRESETS, DEFAULT_PRESETS, EMPTY_STATE_FOX_EMOJI, SUI_BRAND_LOGO_COMPANIES, SUI_CHART_LEGEND_COLORS, SUI_CHART_LEGEND_HEX, SUI_CHART_SERIES_COLORS, SUI_COLOR_DOT_COLORS, SUI_COLOR_DOT_HEX, SUI_CUSTOM_ICONS, SUI_EMOJI_MAP, SUI_EMOJI_STATIC, SUI_FLAG_NAMES, SUI_HEX_TO_COLOR, SUI_IMAGE_UPLOAD_ACCEPT, SUI_KEY_ICON_COLORS, SUI_KEY_ICON_SIZES, SUI_NAVBAR_VISIBILITY, SUI_PASSWORD_STRENGTH_DEFAULT_CONDITIONS, SUI_PASSWORD_STRENGTH_DEFAULT_LEVEL_LABELS, SUI_PAYMENT_ICON_TYPES, SUI_PRODUCT_FALLBACK_COLORS, SUI_TAB_BAR, SuiAccordion, SuiAccordionContent, SuiActivityFeed, SuiActivityFilter, SuiAlert, SuiAppStoreBadge, SuiAvatar, SuiAvatarGroup, SuiBadge, SuiBanner, SuiBrandLogo, SuiBreadcrumbItem, SuiBreadcrumbs, SuiButton, SuiButtonGroup, SuiButtonGroupItem, SuiCard, SuiChartLegend, SuiChartLegendDot, SuiCheckbox, SuiCheckboxCard, SuiCheckboxLabel, SuiCircularProgressBar, SuiColorDot, SuiColorPicker, SuiCommandMenuFooter, SuiCommandMenuItem, SuiCommandMenuSearch, SuiCompactAvatarGroup, SuiCompactButton, SuiCompactSelect, SuiCompactSelectForInput, SuiContentCard, SuiContentDivider, SuiContentLabel, SuiCounterInput, SuiDateSelector, SuiDatepicker, SuiDayCell, SuiDayLabel, SuiDivider, SuiDrawerFooter, SuiDrawerHeader, SuiDropdownCaption, SuiDropdownItem, SuiDropdownMenu, SuiDropdownPanel, SuiDropdownSearch, SuiEmoji, SuiEmptyState, SuiFancyButton, SuiFileIcon, SuiFileUpload, SuiFileUploadCard, SuiFilterBar, SuiFilterItem, SuiFilterPanelFooter, SuiFilterPanelHeader, SuiFlag, SuiFormHint, SuiFormLabel, SuiHref, SuiIcon, SuiImageUpload, SuiImageUploadProfile, SuiImgRetry, SuiInlineInput, SuiInlineSelect, SuiInput, SuiIntegrationSwitch, SuiKbd, SuiKeyIcon, SuiLinkButton, SuiLogo, SuiModal, SuiModalFooter, SuiModalHeader, SuiModalSheet, SuiNotification, SuiNotificationFooter, SuiNotificationTabMenu, SuiOtpInput, SuiPageHeader, SuiPagination, SuiPasswordStrength, SuiPaymentIcon, SuiPeriodRange, SuiPopover, SuiProductCard, SuiProgressBar, SuiProgressBarLabel, SuiRadio, SuiRadioCard, SuiRadioGroup, SuiRadioLabel, SuiRating, SuiRichEditor, SuiRichEditorItem, SuiSegmentedControl, SuiSelect, SuiSidebar, SuiSlider, SuiSocialButton, SuiStatusBadge, SuiStepper, SuiStoreCard, SuiSwitch, SuiSwitchCard, SuiSwitchLabel, SuiTabChips, SuiTabMenuHorizontal, SuiTabMenuVertical, SuiTable, SuiTableCellDirective, SuiTag, SuiTagInput, SuiTextarea, SuiTimePicker, SuiTimePickerDuration, SuiTimePickerItem, SuiTimePickerStatus, SuiToastOutlet, SuiToastService, SuiTooltip, SuiTooltipPanel, SuiTopbar, SuiTopbarButton, SuiTopbarItem, SuiTopbarUser, buildCalendarGrid, buildHourList, buildMinuteList, esImagenAceptada, formatDateInput, formatDateShort, formatMonthYear, formatTime, isSameTime, normalizeHex, pad2, parseTime, to12h, to24h };
12964
- export type { CalendarCell, CalendarRow, DatepickerPreset, DatepickerPresetId, SuiAccordionFlipIcon, SuiActivityAvatarRef, SuiActivityFeedItem, SuiActivityFile, SuiActivityFilterState, SuiActivityTask, SuiActivityTaskState, SuiAlertAction, SuiAlertSize, SuiAlertStyle, SuiAlertVariant, SuiAppStoreBadgeAppearance, SuiAppStoreBadgeCompany, SuiAvatarColor, SuiAvatarConfig, SuiAvatarGroupItem, SuiAvatarSize, SuiAvatarStatus, SuiAvatarTopBadge, SuiBadgeColor, SuiBadgeConfig, SuiBadgeSize, SuiBadgeType, SuiBadgeVariant, SuiBannerStyle, SuiBannerVariant, SuiBrandLogoCompany, SuiBrandLogoSize, SuiBrandLogoStyle, SuiBreadcrumbDivider, SuiBreadcrumbEntry, SuiButtonColor, SuiButtonGroupEntry, SuiButtonGroupItemSize, SuiButtonSize, SuiButtonVariant, SuiCardSize, SuiCardVariant, SuiChartLegendColor, SuiChartLegendItem, SuiCheckboxCardType, SuiCheckboxLabelSize, SuiCheckboxSize, SuiCircularProgressBarColor, SuiCircularProgressBarSize, SuiColorDotColor, SuiColorDotSize, SuiCommandMenuItemSize, SuiCommandMenuItemType, SuiCompactAvatarGroupAppearance, SuiCompactAvatarGroupSize, SuiCompactButtonSize, SuiCompactButtonStyle, SuiCompactSelectForInputItem, SuiCompactSelectForInputSize, SuiCompactSelectItem, SuiCompactSelectSize, SuiCompactSelectType, SuiContentCardSize, SuiContentCardType, SuiContentDividerItem, SuiContentDividerType, SuiContentLabelBadgePlacement, SuiContentLabelSize, SuiContentLabelType, SuiCounterInputSize, SuiDateRange, SuiDatepickerCalendars, SuiDatepickerMode, SuiDatepickerSize, SuiDayCellType, SuiDividerOrientation, SuiDrawerFooterType, SuiDrawerHeaderSize, SuiDrawerHeaderType, SuiDropdownItemMode, SuiDropdownItemSize, SuiDropdownMenuPopupRole, SuiDropdownMenuPosition, SuiEmojiName, SuiEmojiSize, SuiEmptyStateAction, SuiEmptyStateSize, SuiFancyButtonSize, SuiFancyButtonType, SuiFileIconColor, SuiFileIconSize, SuiFileUploadCardFile, SuiFileUploadCardState, SuiFileUploadSize, SuiFilterItemState, SuiFlagName, SuiFlagSize, SuiFooterButtonConfig, SuiFormHintVariant, SuiFormLabelSize, SuiImageUploadProfileAlignment, SuiImageUploadProfileLabels, SuiImageUploadProfileType, SuiImageUploadShape, SuiImageUploadSize, SuiInlineSelectItem, SuiInlineSelectType, SuiInputEnterKeyHint, SuiInputMode, SuiInputSize, SuiInputType, SuiIntegrationManageConfig, SuiIntegrationSwitchAppearance, SuiIntegrationSwitchType, SuiKbdVariant, SuiKeyIconColor, SuiKeyIconSize, SuiKeyIconStyle, SuiLinkButtonSize, SuiLinkButtonVariant, SuiLinkConfig, SuiLogoOrientation, SuiLogoSize, SuiModalHeaderVariant, SuiModalIconVariant, SuiModalSize, SuiModalStatusAlignment, SuiNavbarVisibility, SuiNotificationStyle, SuiNotificationTab, SuiNotificationVariant, SuiOtpInputSize, SuiOtpInputType, SuiPaginationInfoFormat, SuiPaginationSize, SuiPaginationType, SuiPasswordStrengthCondition, SuiPasswordStrengthLevel, SuiPaymentIconSize, SuiPaymentIconType, SuiPopoverFooter, SuiPopoverPosition, SuiPopoverSize, SuiProductCardFallback, SuiProductCardImage, SuiProductCardSize, SuiProgressBarColor, SuiProgressBarLabelType, SuiProgressBarSize, SuiRadioCardType, SuiRadioLabelSize, SuiRadioSize, SuiRadioValue, SuiRatingAlignment, SuiRatingAppearance, SuiRatingReviewLink, SuiRatingSize, SuiRatingType, SuiRichEditorAction, SuiRichEditorCommand, SuiRichEditorItemState, SuiRichEditorItemType, SuiRichEditorLayout, SuiSegmentedControlItem, SuiSegmentedControlSize, SuiSelectOption, SuiSelectSize, SuiSelectType, SuiSidebarBrandConfig, SuiSidebarIndicatorColor, SuiSidebarItem, SuiSidebarMobileMode, SuiSidebarProfile, SuiSidebarSearchConfig, SuiSliderSize, SuiSliderType, SuiSocialButtonBrand, SuiSocialButtonStyle, SuiStatusBadgeAppearance, SuiStatusBadgeSize, SuiStatusBadgeStatus, SuiStepperItem, SuiStepperSize, SuiStepperState, SuiStepperVariant, SuiStoreCardData, SuiStoreCardSize, SuiSwitchCardType, SuiSwitchSize, SuiTabBar, SuiTabChipItem, SuiTabChipsSize, SuiTabMenuHorizontalItem, SuiTabMenuHorizontalSize, SuiTabMenuVerticalItem, SuiTabMenuVerticalStyle, SuiTableCellMisc, SuiTableCellPriority, SuiTableColumn, SuiTableSize, SuiTagInputSize, SuiTagSize, SuiTagStyle, SuiTextareaSize, SuiTimeDurationPreset, SuiTimeFormat, SuiTimePeriod, SuiTimePickerItemDirection, SuiTimePickerSize, SuiTimePickerStatusType, SuiTimeValue, SuiToastAction, SuiToastData, SuiToastItem, SuiToastPosition, SuiToastStyle, SuiToastVariant, SuiTooltipLargeData, SuiTooltipPosition, SuiTooltipSize, SuiTooltipTheme, SuiTooltipThemeInput, SuiTopbarAccent, SuiTopbarAction, SuiTopbarEntry, SuiTopbarSearchConfig, SuiTopbarUserConfig };
13299
+ export { DAY_LABELS_ES, DEFAULT_DURATION_PRESETS, DEFAULT_PRESETS, EMPTY_STATE_FOX_EMOJI, SUI_BRAND_LOGO_COMPANIES, SUI_CHART_LEGEND_COLORS, SUI_CHART_LEGEND_HEX, SUI_CHART_SERIES_COLORS, SUI_COLOR_DOT_COLORS, SUI_COLOR_DOT_HEX, SUI_CUSTOM_ICONS, SUI_EMOJI_MAP, SUI_EMOJI_STATIC, SUI_FLAG_NAMES, SUI_HEX_TO_COLOR, SUI_IMAGE_UPLOAD_ACCEPT, SUI_KEY_ICON_COLORS, SUI_KEY_ICON_SIZES, SUI_NAVBAR_VISIBILITY, SUI_PASSWORD_STRENGTH_DEFAULT_CONDITIONS, SUI_PASSWORD_STRENGTH_DEFAULT_LEVEL_LABELS, SUI_PAYMENT_ICON_TYPES, SUI_PRODUCT_FALLBACK_COLORS, SUI_TAB_BAR, SuiAccordion, SuiAccordionContent, SuiActivityFeed, SuiActivityFilter, SuiAlert, SuiAppStoreBadge, SuiAvatar, SuiAvatarGroup, SuiBadge, SuiBanner, SuiBrandLogo, SuiBreadcrumbItem, SuiBreadcrumbs, SuiButton, SuiButtonGroup, SuiButtonGroupItem, SuiCard, SuiChartLegend, SuiChartLegendDot, SuiCheckbox, SuiCheckboxCard, SuiCheckboxLabel, SuiCircularProgressBar, SuiColorDot, SuiColorPicker, SuiCommandMenuFooter, SuiCommandMenuItem, SuiCommandMenuSearch, SuiCompactAvatarGroup, SuiCompactButton, SuiCompactSelect, SuiCompactSelectForInput, SuiContentCard, SuiContentDivider, SuiContentLabel, SuiCounterInput, SuiDateSelector, SuiDatepicker, SuiDayCell, SuiDayLabel, SuiDivider, SuiDrawerFooter, SuiDrawerHeader, SuiDropdownCaption, SuiDropdownItem, SuiDropdownMenu, SuiDropdownPanel, SuiDropdownSearch, SuiEmoji, SuiEmptyState, SuiFancyButton, SuiFileIcon, SuiFileUpload, SuiFileUploadCard, SuiFilterBar, SuiFilterItem, SuiFilterPanelFooter, SuiFilterPanelHeader, SuiFlag, SuiFormHint, SuiFormLabel, SuiHref, SuiIcon, SuiImageUpload, SuiImageUploadProfile, SuiImgRetry, SuiInlineInput, SuiInlineSelect, SuiInput, SuiIntegrationSwitch, SuiKbd, SuiKeyIcon, SuiLinkButton, SuiLogo, SuiModal, SuiModalFooter, SuiModalHeader, SuiModalSheet, SuiNotification, SuiNotificationFooter, SuiNotificationTabMenu, SuiOtpInput, SuiPageHeader, SuiPagination, SuiPasswordStrength, SuiPaymentIcon, SuiPeriodRange, SuiPopover, SuiProductCard, SuiProgressBar, SuiProgressBarLabel, SuiRadio, SuiRadioCard, SuiRadioGroup, SuiRadioLabel, SuiRating, SuiRichEditor, SuiRichEditorItem, SuiSegmentedControl, SuiSelect, SuiSidebar, SuiSlider, SuiSocialButton, SuiStatusBadge, SuiStepper, SuiStoreCard, SuiSwitch, SuiSwitchCard, SuiSwitchLabel, SuiTabChips, SuiTabMenuHorizontal, SuiTabMenuVertical, SuiTable, SuiTableCellDirective, SuiTag, SuiTagInput, SuiTextarea, SuiTimePicker, SuiTimePickerDuration, SuiTimePickerItem, SuiTimePickerStatus, SuiToastOutlet, SuiToastService, SuiTooltip, SuiTooltipPanel, SuiTopbar, SuiTopbarButton, SuiTopbarItem, SuiTopbarUser, buildCalendarGrid, buildHourList, buildMinuteList, esImagenAceptada, formatDateInput, formatDateLong, formatDateShort, formatMonthYear, formatTime, isSameTime, normalizeHex, pad2, parseTime, to12h, to24h };
13300
+ export type { CalendarCell, CalendarRow, DatepickerPreset, DatepickerPresetId, SuiAccordionFlipIcon, SuiActivityAvatarRef, SuiActivityFeedItem, SuiActivityFile, SuiActivityFilterState, SuiActivityTask, SuiActivityTaskState, SuiAlertAction, SuiAlertRole, SuiAlertSize, SuiAlertStyle, SuiAlertVariant, SuiAppStoreBadgeAppearance, SuiAppStoreBadgeCompany, SuiAvatarColor, SuiAvatarConfig, SuiAvatarGroupItem, SuiAvatarSize, SuiAvatarStatus, SuiAvatarTopBadge, SuiBadgeColor, SuiBadgeConfig, SuiBadgeSize, SuiBadgeType, SuiBadgeVariant, SuiBannerStyle, SuiBannerVariant, SuiBrandLogoCompany, SuiBrandLogoSize, SuiBrandLogoStyle, SuiBreadcrumbDivider, SuiBreadcrumbEntry, SuiButtonColor, SuiButtonGroupEntry, SuiButtonGroupItemSize, SuiButtonSize, SuiButtonVariant, SuiCardSize, SuiCardVariant, SuiChartLegendColor, SuiChartLegendItem, SuiCheckboxCardType, SuiCheckboxLabelSize, SuiCheckboxSize, SuiCircularProgressBarColor, SuiCircularProgressBarSize, SuiColorDotColor, SuiColorDotSize, SuiColorPickerSize, SuiCommandMenuItemSize, SuiCommandMenuItemType, SuiCompactAvatarGroupAppearance, SuiCompactAvatarGroupSize, SuiCompactButtonSize, SuiCompactButtonStyle, SuiCompactSelectForInputItem, SuiCompactSelectForInputSize, SuiCompactSelectItem, SuiCompactSelectSize, SuiCompactSelectType, SuiContentCardSize, SuiContentCardType, SuiContentDividerItem, SuiContentDividerType, SuiContentLabelBadgePlacement, SuiContentLabelSize, SuiContentLabelType, SuiCounterInputSize, SuiDateRange, SuiDateSelectorSize, SuiDatepickerCalendars, SuiDatepickerMode, SuiDatepickerSize, SuiDayCellSize, SuiDayCellType, SuiDividerOrientation, SuiDrawerFooterSize, SuiDrawerFooterType, SuiDrawerHeaderSize, SuiDrawerHeaderType, SuiDropdownItemMode, SuiDropdownItemSize, SuiDropdownMenuPopupRole, SuiDropdownMenuPosition, SuiEmojiName, SuiEmojiSize, SuiEmptyStateAction, SuiEmptyStateSize, SuiFancyButtonSize, SuiFancyButtonType, SuiFileIconColor, SuiFileIconSize, SuiFileUploadCardFile, SuiFileUploadCardState, SuiFileUploadSize, SuiFilterItemState, SuiFlagName, SuiFlagSize, SuiFooterButtonConfig, SuiFormHintVariant, SuiFormLabelSize, SuiImageUploadProfileAlignment, SuiImageUploadProfileLabels, SuiImageUploadProfileType, SuiImageUploadShape, SuiImageUploadSize, SuiInlineSelectItem, SuiInlineSelectType, SuiInputEnterKeyHint, SuiInputMode, SuiInputSize, SuiInputType, SuiIntegrationManageConfig, SuiIntegrationSwitchAppearance, SuiIntegrationSwitchSize, SuiIntegrationSwitchType, SuiKbdVariant, SuiKeyIconColor, SuiKeyIconSize, SuiKeyIconStyle, SuiLinkButtonSize, SuiLinkButtonVariant, SuiLinkConfig, SuiLogoOrientation, SuiLogoSize, SuiModalHeaderVariant, SuiModalIconVariant, SuiModalSize, SuiModalStatusAlignment, SuiNavbarVisibility, SuiNotificationStyle, SuiNotificationTab, SuiNotificationVariant, SuiOtpInputSize, SuiOtpInputType, SuiPaginationInfoFormat, SuiPaginationSize, SuiPaginationType, SuiPasswordStrengthCondition, SuiPasswordStrengthLevel, SuiPaymentIconSize, SuiPaymentIconType, SuiPeriodRangeSize, SuiPopoverFooter, SuiPopoverPosition, SuiPopoverSize, SuiProductCardFallback, SuiProductCardImage, SuiProductCardSize, SuiProgressBarColor, SuiProgressBarLabelType, SuiProgressBarSize, SuiRadioCardType, SuiRadioGroupItem, SuiRadioLabelSize, SuiRadioSize, SuiRadioValue, SuiRatingAlignment, SuiRatingAppearance, SuiRatingReviewLink, SuiRatingSize, SuiRatingType, SuiRichEditorAction, SuiRichEditorCommand, SuiRichEditorItemState, SuiRichEditorItemType, SuiRichEditorLayout, SuiSegmentedControlItem, SuiSegmentedControlSize, SuiSelectOption, SuiSelectSize, SuiSelectType, SuiSidebarBrandConfig, SuiSidebarIndicatorColor, SuiSidebarItem, SuiSidebarMobileMode, SuiSidebarProfile, SuiSidebarSearchConfig, SuiSliderSize, SuiSliderType, SuiSocialButtonBrand, SuiSocialButtonSize, SuiSocialButtonStyle, SuiStatusBadgeAppearance, SuiStatusBadgeSize, SuiStatusBadgeStatus, SuiStepperItem, SuiStepperSize, SuiStepperState, SuiStepperVariant, SuiStoreCardData, SuiStoreCardSize, SuiSwitchCardType, SuiSwitchLabelSize, SuiSwitchSize, SuiTabBar, SuiTabChipItem, SuiTabChipsSize, SuiTabMenuHorizontalItem, SuiTabMenuHorizontalSize, SuiTabMenuVerticalItem, SuiTabMenuVerticalStyle, SuiTableCellMisc, SuiTableCellPriority, SuiTableColumn, SuiTableSize, SuiTagInputSize, SuiTagSize, SuiTagStyle, SuiTextareaSize, SuiTimeDurationPreset, SuiTimeFormat, SuiTimePeriod, SuiTimePickerItemDirection, SuiTimePickerSize, SuiTimePickerStatusType, SuiTimeValue, SuiToastAction, SuiToastData, SuiToastItem, SuiToastPosition, SuiToastStyle, SuiToastVariant, SuiTooltipLargeData, SuiTooltipPosition, SuiTooltipSize, SuiTooltipTheme, SuiTooltipThemeInput, SuiTopbarAccent, SuiTopbarAction, SuiTopbarEntry, SuiTopbarSearchConfig, SuiTopbarUserConfig };