@ajuarezso/sui-design-system 0.19.0 → 0.20.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ajuarezso/sui-design-system",
-  "version": "0.19.0",
+  "version": "0.20.0",
   "description": "SUI Design System — librería de componentes Angular (SUI 2.0).",
   "license": "UNLICENSED",
   "publishConfig": {

package/types/ajuarezso-sui-design-system.d.ts

@@ -25,7 +25,7 @@ declare const SUI_TAB_BAR: InjectionToken<SuiTabBar>;
 
 type SuiBadgeColor = 'gray' | 'blue' | 'orange' | 'red' | 'green' | 'yellow' | 'purple' | 'sky' | 'pink' | 'teal';
 type SuiBadgeVariant = 'filled' | 'light' | 'lighter' | 'stroke' | 'dark';
-type SuiBadgeSize = 'small' | 'medium';
+type SuiBadgeSize = 'small' | 'medium' | 'large' | 'xlarge';
 type SuiBadgeType = 'basic' | 'with-dot' | 'left-icon' | 'right-icon' | 'number';
 /**
  * Config de badge embebido en otros componentes (checkbox-label, switch-label,
@@ -1531,7 +1531,7 @@ declare class SuiBreadcrumbs {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiBreadcrumbs, "sui-breadcrumbs", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "divider": { "alias": "divider"; "required": false; "isSignal": true; }; }, { "navigate": "navigate"; }, never, never, true, never>;
 }
 
-type SuiButtonGroupItemSize = 'small' | 'xsmall' | '2xsmall';
+type SuiButtonGroupItemSize = 'small' | 'xsmall' | '2xsmall' | 'medium' | 'large';
 /**
  * SUI Button Group Item — SUI Design System 2.0
  *
@@ -1562,6 +1562,11 @@ type SuiButtonGroupItemSize = 'small' | 'xsmall' | '2xsmall';
  *       · both-icons  (226:5344): p4 (cuadrado), gap 4
  *       · only-icon   (226:5348): p4 → 24×24, sin gap
  *
+ *   Extensión SUI (03-10-2026, pedido del dueño) — tamaños para mobile, fuera
+ *   del Figma, con la escala de `sui-button`:
+ *     large (48) — Label/Medium (16/24), icon 20px: px20 py11 · icono px18 · p11 → 48², gap 8 (py −1 del borde)
+ *     medium (40) — Label/Small (14/20), icon 20px: px18 py9 · icono px16 · p9 → 40², gap 8 (py −1 del borde)
+ *
  *   States × visual:
  *     Default:  bg-white-0 + border stroke-soft-200 + text-sub-600
  *     Hover:    bg-weak-50 + border stroke-soft-200 + text-sub-600
@@ -1599,7 +1604,9 @@ declare class SuiButtonGroupItem {
      *   - 'only'  → icon-only:    padding cuadrado (p) → square box
      */
     readonly iconLayout: _angular_core.Signal<"none" | "left" | "right" | "both" | "only">;
-    /** Tamaño del icono en px según size del item (small/xsmall=20, 2xsmall=16) */
+    /** Tamaño del icono en px según size del item (large/medium/small/xsmall=20, 2xsmall=16).
+     *  En large y medium el ícono se queda en 20, igual que `sui-button`: el ícono
+     *  que acompaña texto no escala. */
     readonly iconSize: _angular_core.Signal<number>;
     readonly clicked: _angular_core.OutputEmitterRef<void>;
     protected onClick(): void;
@@ -1634,6 +1641,8 @@ interface SuiButtonGroupEntry {
  *   - Group container: bg-white-0, border 1px stroke-soft-200, rounded:
  *       · small / xsmall → radius-8 (8px)
  *       · 2xsmall        → radius-6 (6px)
+ *   - Extensión SUI (03-10-2026): medium (40, radius-10) y large (48, radius-12)
+ *     para tocar con el dedo en mobile; fuera del Figma, escala de sui-button.
  *   - overflow: clip (corta los bordes externos de items en las esquinas)
  *
  * Behavior:
@@ -2194,7 +2203,8 @@ interface SuiLinkConfig {
     target?: string;
     rel?: string;
 }
-type SuiLinkButtonSize = 'medium' | 'small';
+/** `large` (texto 16) es extensión SUI (03-10-2026) para mobile; Figma trae medium y small. */
+type SuiLinkButtonSize = 'large' | 'medium' | 'small';
 /**
  * SUI Link Button — SUI Design System 2.0
  *
@@ -2206,6 +2216,11 @@ type SuiLinkButtonSize = 'medium' | 'small';
  *     Container          flex / inline-flex, gap=4px, items=center
  *     Medium size        text 14/20/-0.6%, icons 20×20
  *     Small  size        text 12/16/0,     icons 16×16
+ *     Large  size        text 16/24/-1.1%, icons 20×20 — extensión SUI
+ *                        (03-10-2026, pedido del dueño): en mobile el link se
+ *                        lee y se toca con el dedo. Ícono 20 como el sui-button
+ *                        large (texto 16 + ícono 20), no 24: con 24 el chevron
+ *                        pesa más que el texto.
  *     Font features      'ss11' 1, 'calt' 0, 'liga' 0
  *     Underline          (hover / focus / underline=on): línea continua SOLO
  *                        bajo el texto (los iconos chevron NO van subrayados —
@@ -2268,6 +2283,7 @@ declare class SuiLinkButton {
     readonly type: _angular_core.InputSignal<"button" | "submit" | "reset">;
     readonly ariaLabel: _angular_core.InputSignal<string | null>;
     readonly clicked: _angular_core.OutputEmitterRef<MouseEvent>;
+    /** Px de los íconos por tamaño: large 20 · medium 20 · small 16. */
     readonly iconSize: _angular_core.Signal<number>;
     readonly isAnchor: _angular_core.Signal<boolean>;
     onClick(event: MouseEvent): void;
@@ -2275,6 +2291,12 @@ declare class SuiLinkButton {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiLinkButton, "sui-link-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "underline": { "alias": "underline"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "leftIcon": { "alias": "leftIcon"; "required": false; "isSignal": true; }; "rightIcon": { "alias": "rightIcon"; "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, ["*"], true, never>;
 }
 
+/**
+ * Tamaño del checkbox-label. `medium` es el de Figma (control 20, label 14/20);
+ * `large` y `xlarge` son extensión SUI (03-10-2026, pedido del dueño) para mobile:
+ * le pasan el tamaño al sui-checkbox interno (24 / 28) y suben la tipografía.
+ */
+type SuiCheckboxLabelSize = 'medium' | 'large' | 'xlarge';
 /**
  * SUI Checkbox Label — SUI Design System 2.0
  *
@@ -2359,6 +2381,18 @@ declare class SuiCheckboxLabel implements ControlValueAccessor {
     readonly link: _angular_core.InputSignal<string | SuiLinkConfig | null>;
     /** Config resuelta del link (string → { label }, rel automático). */
     protected readonly linkCfg: _angular_core.Signal<SuiLinkConfig | null>;
+    /**
+     * Tamaño. `medium` (default, Figma): control 20, label 14/20.
+     * Extensión SUI (03-10-2026) para tocar en mobile:
+     *   - `large`:  control 24, label 16/24, sublabel y descripción 14/20, badge medium.
+     *   - `xlarge`: control 28, label 16/24, sublabel y descripción 14/20, badge large.
+     * El badge toma este default solo si su config no trae `size`.
+     */
+    readonly size: _angular_core.InputSignal<SuiCheckboxLabelSize>;
+    /** Badge por default según el tamaño (si la config no fija uno). */
+    protected readonly badgeSize: _angular_core.Signal<SuiBadgeSize>;
+    /** El link-button tiene dos tamaños: small (12/16) en Figma, medium (14/20) en mobile. */
+    protected readonly linkSize: _angular_core.Signal<SuiLinkButtonSize>;
     /** Si true, invierte orden: [content] [checkbox] (label a la izquierda). */
     readonly flip: _angular_core.InputSignal<boolean>;
     /** Deshabilita el checkbox + wrapper. */
@@ -2385,7 +2419,7 @@ declare class SuiCheckboxLabel implements ControlValueAccessor {
     registerOnTouched(fn: () => void): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiCheckboxLabel, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCheckboxLabel, "sui-checkbox-label", never, { "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; }; "flip": { "alias": "flip"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; "linkClick": "linkClick"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiCheckboxLabel, "sui-checkbox-label", never, { "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; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; "linkClick": "linkClick"; }, never, never, true, never>;
 }
 
 type SuiCircularProgressBarColor = 'blue' | 'green' | 'orange' | 'red' | 'purple';
@@ -2501,6 +2535,11 @@ declare class SuiCircularProgressBar {
 }
 
 type SuiColorDotColor = 'gray' | 'blue' | 'orange' | 'red' | 'green' | 'yellow' | 'purple' | 'sky' | 'pink' | 'teal';
+/**
+ * Tamaño del dot. `medium` es el de Figma (24). `large` (32) es extensión SUI
+ * (03-10-2026, pedido del dueño) para tocar con el dedo en mobile.
+ */
+type SuiColorDotSize = 'medium' | 'large';
 /**
  * Set canon de 10 colores SUI 2.0 — usable como referencia desde el consumer.
  * Útil para iterar en pickers, badges, tag selectors.
@@ -2585,6 +2624,11 @@ declare class SuiColorDot {
      *   - `disabled` → dot gris pálido, sin pointer events.
      */
     readonly state: _angular_core.InputSignal<"default" | "disabled" | "hover" | "selected">;
+    /**
+     * Tamaño. `medium` (default, Figma 24): dot 16 / hover 14 / selected 12 + anillo 18.
+     * `large` (32, extensión SUI para mobile): dot 22 / hover 18 / selected 16 + anillo 24.
+     */
+    readonly size: _angular_core.InputSignal<SuiColorDotSize>;
     /** aria-label override. */
     readonly ariaLabel: _angular_core.InputSignal<string>;
     readonly clicked: _angular_core.OutputEmitterRef<void>;
@@ -2592,7 +2636,7 @@ declare class SuiColorDot {
     readonly defaultAriaLabel: _angular_core.Signal<string>;
     protected onClick(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiColorDot, never>;
-    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; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
+    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>;
 }
 
 /**
@@ -3095,7 +3139,7 @@ declare class SuiCompactAvatarGroup {
 }
 
 type SuiCompactButtonStyle = 'stroke' | 'ghost' | 'modifiable' | 'white';
-type SuiCompactButtonSize = 'medium' | 'large' | 'xlarge';
+type SuiCompactButtonSize = 'medium' | 'large' | 'xlarge' | '2xlarge' | '3xlarge' | '4xlarge';
 /**
  * SUI Compact Button — SUI Design System 2.0
  *
@@ -3117,6 +3161,8 @@ type SuiCompactButtonSize = 'medium' | 'large' | 'xlarge';
  *   Sizes:
  *     Large:  24×24 container, icon 20×20
  *     Medium: 20×20 container, icon 16×16
+ *     2xlarge 32 / 3xlarge 36 / 4xlarge 40 (extensión SUI, 03-10-2026): para
+ *     tocar con el dedo en mobile; íconos 20 / 20 / 24 como sui-button.
  *
  *   Style=Stroke  (node 189:3645):
  *     bg:     var(--sui-bg-white-0)
@@ -3266,7 +3312,7 @@ declare class SuiCompactSelectForInput<T = string> implements ControlValueAccess
     readonly arrowIcon: _angular_core.Signal<"arrow-up-s-line" | "arrow-down-s-line">;
     readonly displayValue: _angular_core.Signal<string>;
     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>;
-    readonly flagSizePx: _angular_core.Signal<20 | 16>;
+    readonly flagSizePx: _angular_core.Signal<16 | 20>;
     onHostClick(event: Event): void;
     protected onMenuOpenedChange(open: boolean): void;
     protected selectItem(item: SuiCompactSelectForInputItem<T>): void;
@@ -5576,7 +5622,7 @@ declare class SuiFileUpload {
     protected readonly inputRef: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
     protected readonly dragging: _angular_core.WritableSignal<boolean>;
     protected readonly internalError: _angular_core.WritableSignal<string | null>;
-    protected readonly state: _angular_core.Signal<"default" | "error" | "disabled" | "dragover">;
+    protected readonly state: _angular_core.Signal<"error" | "default" | "disabled" | "dragover">;
     protected readonly resolvedTitle: _angular_core.Signal<string>;
     protected readonly resolvedSubtitle: _angular_core.Signal<string>;
     protected readonly resolvedErrorMessage: _angular_core.Signal<string | null>;
@@ -6224,7 +6270,7 @@ declare class SuiImageUpload {
     protected readonly sizePx: _angular_core.Signal<number>;
     /** Camera icon px en el empty state. xl escala a 20, resto 16
      *  (matchea el escalado del contenedor 32→40 en SCSS). */
-    protected readonly iconSize: _angular_core.Signal<20 | 16>;
+    protected readonly iconSize: _angular_core.Signal<16 | 20>;
     protected readonly hasSrc: _angular_core.Signal<boolean>;
     protected readonly state: _angular_core.Signal<"filled" | "disabled" | "dragover" | "empty">;
     protected readonly resolvedTitle: _angular_core.Signal<string>;
@@ -7994,7 +8040,7 @@ declare class SuiNotification {
     readonly dismissible: _angular_core.InputSignal<boolean>;
     readonly unread: _angular_core.InputSignal<boolean>;
     /** Item body type. 'basic' keeps the legacy/alert layout (no body slot). */
-    readonly type: _angular_core.InputSignal<"basic" | "file" | "button" | "message">;
+    readonly type: _angular_core.InputSignal<"basic" | "button" | "file" | "message">;
     /** When true, item paints the Figma hover bg + reveals the more-2-line button. */
     readonly showMore: _angular_core.InputSignal<boolean>;
     /** Forces the hover affordance visible (e.g. keyboard-focused row). */
@@ -8870,6 +8916,12 @@ declare class SuiRadioCard implements ControlValueAccessor {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiRadioCard, "sui-radio-card", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "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; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "emoji": { "alias": "emoji"; "required": false; "isSignal": true; }; "iconSrc": { "alias": "iconSrc"; "required": false; "isSignal": true; }; "imageUrl": { "alias": "imageUrl"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "selected": "selected"; }, never, never, true, never>;
 }
 
+/**
+ * Tamaño del radio-label. `medium` es el de Figma (control 20, label 14/20);
+ * `large` y `xlarge` son extensión SUI (03-10-2026, pedido del dueño) para mobile:
+ * le pasan el tamaño al sui-radio interno (24 / 28) y suben la tipografía.
+ */
+type SuiRadioLabelSize = 'medium' | 'large' | 'xlarge';
 /**
  * SUI Radio Label — SUI Design System 2.0
  *
@@ -8923,6 +8975,18 @@ declare class SuiRadioLabel {
     readonly link: _angular_core.InputSignal<string | SuiLinkConfig | null>;
     /** Config resuelta del link (string → { label }, rel automático). */
     protected readonly linkCfg: _angular_core.Signal<SuiLinkConfig | null>;
+    /**
+     * Tamaño. `medium` (default, Figma): control 20, label 14/20.
+     * Extensión SUI (03-10-2026) para tocar en mobile:
+     *   - `large`:  control 24, label 16/24, sublabel y descripción 14/20, badge medium.
+     *   - `xlarge`: control 28, label 16/24, sublabel y descripción 14/20, badge large.
+     * El badge toma este default solo si su config no trae `size`.
+     */
+    readonly size: _angular_core.InputSignal<SuiRadioLabelSize>;
+    /** Badge por default según el tamaño (si la config no fija uno). */
+    protected readonly badgeSize: _angular_core.Signal<SuiBadgeSize>;
+    /** El link-button tiene dos tamaños: small (12/16) en Figma, medium (14/20) en mobile. */
+    protected readonly linkSize: _angular_core.Signal<SuiLinkButtonSize>;
     /** Si true, invierte orden: [content] [radio] (radio a la derecha). */
     readonly flip: _angular_core.InputSignal<boolean>;
     /** Deshabilita el radio + wrapper. */
@@ -8941,7 +9005,7 @@ declare class SuiRadioLabel {
     private select;
     onLinkClick(event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiRadioLabel, never>;
-    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; }; "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>;
+    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>;
 }
 
 declare class SuiRadioGroup implements ControlValueAccessor {
@@ -9762,9 +9826,17 @@ declare class SuiSidebar {
  *      el untouched del range slider.
  */
 type SuiSliderType = 'single' | 'range';
+/**
+ * Tamaño del slider. `medium` es el de Figma (manija 16, riel 6). `large` es
+ * extensión SUI (03-10-2026, pedido del dueño) para mobile: manija 24, riel 8,
+ * punto interno 8 y label 14/20 — la manija de 16 es muy chica para el dedo.
+ */
+type SuiSliderSize = 'medium' | 'large';
 declare class SuiSlider implements ControlValueAccessor {
     private readonly hostRef;
     readonly type: _angular_core.InputSignal<SuiSliderType>;
+    /** `medium` (default, Figma) o `large` (mobile, extensión SUI). */
+    readonly size: _angular_core.InputSignal<SuiSliderSize>;
     /** Rango numérico de la escala. */
     readonly min: _angular_core.InputSignal<number>;
     readonly max: _angular_core.InputSignal<number>;
@@ -9795,9 +9867,9 @@ declare class SuiSlider implements ControlValueAccessor {
     private readonly _cvaValue;
     private readonly _useCvaValue;
     /** Handle siendo arrastrado: null | 'single' | 'min' | 'max'. */
-    readonly dragging: _angular_core.WritableSignal<"min" | "max" | "single" | null>;
+    readonly dragging: _angular_core.WritableSignal<"single" | "min" | "max" | null>;
     /** Handle bajo hover (para tooltip): igual dominio que dragging. */
-    readonly hovering: _angular_core.WritableSignal<"min" | "max" | "single" | null>;
+    readonly hovering: _angular_core.WritableSignal<"single" | "min" | "max" | null>;
     private clamp;
     readonly effectiveValue: _angular_core.Signal<number>;
     readonly effectiveMin: _angular_core.Signal<number>;
@@ -9835,7 +9907,7 @@ declare class SuiSlider implements ControlValueAccessor {
     onThumbEnter(handle: 'single' | 'min' | 'max'): void;
     onThumbLeave(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiSlider, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSlider, "sui-slider", never, { "type": { "alias": "type"; "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>;
+    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>;
 }
 
 type SuiSocialButtonBrand = 'apple' | 'x-twitter' | 'google' | 'facebook' | 'linkedin' | 'github' | 'dropbox';
@@ -9951,6 +10023,11 @@ declare class SuiSocialButton {
 
 type SuiStatusBadgeStatus = 'completed' | 'pending' | 'failed' | 'information' | 'disabled';
 type SuiStatusBadgeAppearance = 'stroke' | 'light';
+/**
+ * Tamaño. `medium` (24) es el de Figma y el default. `large` 28 y `xlarge` 32
+ * son extensión SUI (03-10-2026) para mobile, donde el estado se lee de lejos.
+ */
+type SuiStatusBadgeSize = 'medium' | 'large' | 'xlarge';
 /**
  * SUI Status Badge — SUI Design System 2.0
  *
@@ -9959,7 +10036,8 @@ type SuiStatusBadgeAppearance = 'stroke' | 'light';
  *
  * Componente separado del `sui-badge` regular. A diferencia del Badge:
  *   - radius 6 (NO full)
- *   - solo medium size (font Label/X Small 12/16/0)
+ *   - Figma trae solo medium (font Label/X Small 12/16/0); large/xlarge son
+ *     extensión SUI para mobile (ver «Tamaños» abajo)
  *   - solo 2 styles: stroke + light (NO filled/lighter/dark)
  *   - status enum cerrado (5 valores) — cada uno con su icono semántico fijo
  *   - withDot reemplaza el icono por un dot de 6×6 (diámetro 6px) con el color del status
@@ -9999,11 +10077,17 @@ type SuiStatusBadgeAppearance = 'stroke' | 'light';
  *   - 'information' → state-information + ri-information-fill
  *   - 'disabled'    → state-faded   + ri-forbid-fill
  *
+ * Tamaños — extensión SUI (03-10-2026, pedido del dueño):
+ *   El frame 171:5100 trae 20 símbolos, TODOS Medium (24px). Para mobile se
+ *   sumaron dos más grandes, en la escala del sui-button (28 · 32) y no en la
+ *   del sui-badge (24 · 28): el status-badge ya parte de 24, así que un
+ *   «large 24» no cambiaría nada.
+ *     medium  24 · Label/X Small 12/16 · icono 12 en caja 16 · dot 6 (default, Figma)
+ *     large   28 · Label/Small 14/20   · icono 16 en caja 20 · dot 8
+ *     xlarge  32 · Label/Medium 16/24  · icono 20 en caja 24 · dot 8
+ *   No hay `small`: Figma no lo trae y en web 24 ya es el mínimo legible.
+ *
  * PENDING VERIFY (no críticos):
- *   - Small size del Status Badge: CONFIRMADO que NO existe — el frame 171:5100
- *     contiene 20 símbolos (5 status × 2 styles × 2 withDot), TODOS Medium (24px
- *     de alto). No hay eje Size en este componente. Si el DS agrega Small más
- *     adelante, recién ahí se introduce el input `size`.
  *   - Hover/focus states: CONFIRMADO display-only — el frame no expone ningún
  *     eje de interacción (ni Disabled como estado, salvo el status semántico
  *     'disabled' que es un valor de contenido, no un state CSS).
@@ -10022,6 +10106,10 @@ declare class SuiStatusBadge {
      * linter trata de parsear como CSS y rompe con valores como "light").
      */
     readonly appearance: _angular_core.InputSignal<SuiStatusBadgeAppearance>;
+    /** Tamaño: medium 24 (default, Figma) · large 28 · xlarge 32 (mobile). */
+    readonly size: _angular_core.InputSignal<SuiStatusBadgeSize>;
+    /** Px del glyph del sui-icon interno por tamaño (12 / 16 / 20). */
+    readonly iconSize: _angular_core.Signal<number>;
     /**
      * Si `true`, reemplaza el icono semántico por un dot 6×6 (diámetro 6px,
      * radio 3px — confirmado en Figma 171:5156) del color del status.
@@ -10046,11 +10134,11 @@ declare class SuiStatusBadge {
     readonly iconName: _angular_core.Signal<string>;
     private readonly iconoDelStatus;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiStatusBadge, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiStatusBadge, "sui-status-badge", never, { "status": { "alias": "status"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "withDot": { "alias": "withDot"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiStatusBadge, "sui-status-badge", never, { "status": { "alias": "status"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "withDot": { "alias": "withDot"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 type SuiStepperVariant = 'dot' | 'horizontal' | 'vertical';
-type SuiStepperSize = 'small' | 'xsmall';
+type SuiStepperSize = 'small' | 'xsmall' | 'medium';
 type SuiStepperState = 'default' | 'active' | 'completed' | 'error';
 interface SuiStepperItem {
     /** Etiqueta del step. Ignorada en variant='dot'. */
@@ -10091,7 +10179,13 @@ interface SuiStepperItemView {
  * @input count         Cantidad de dots (variant='dot' only). Si se pasan steps,
  *                      tiene precedencia el length de steps.
  * @input currentStep   0-indexed; index < cur = completed, === cur = active, > cur = default
- * @input size          'small' | 'xsmall' — solo aplica a variant='dot'
+ * @input size          'small' | 'xsmall' | 'medium'.
+ *                      small/xsmall (Figma) solo cambian el dot (8 / 4); horizontal y
+ *                      vertical miden igual en los dos (indicador 20).
+ *                      medium — extensión SUI (03-10-2026, pedido del dueño) para
+ *                      mobile — agranda los tres variants: dot 10, indicador 24,
+ *                      número Label/Small (14/20), label Paragraph/Medium (16/24),
+ *                      card vertical de 44 de alto (24 + padding 10×2).
  * @input interactive   Si true, los steps son clickeables y emiten stepClick
  *
  * @output stepClick    Index del step clickeado (solo si interactive=true)
@@ -10140,6 +10234,9 @@ declare class SuiStepper {
     readonly interactive: _angular_core.InputSignal<boolean>;
     readonly ariaLabel: _angular_core.InputSignal<string>;
     readonly stepClick: _angular_core.OutputEmitterRef<number>;
+    /** Ícono del indicador (completed / error): 24 en medium, 20 en los de Figma.
+     *  Es el indicador mismo, por eso crece; separador y chevron se quedan en 20. */
+    readonly indicatorIconPx: _angular_core.Signal<number>;
     /**
      * Vista pre-computada de items. Una sola pasada por cambio de inputs:
      *  - resuelve length: steps.length || count (para variant=dot sin labels)
@@ -10706,6 +10803,12 @@ declare class SuiSwitchLabel implements ControlValueAccessor {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSwitchLabel, "sui-switch-label", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "sublabel": { "alias": "sublabel"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "link": { "alias": "link"; "required": false; "isSignal": true; }; "flip": { "alias": "flip"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; }, { "activeChange": "activeChange"; "linkClick": "linkClick"; }, never, never, true, never>;
 }
 
+/**
+ * Tamaño del chip. `medium` (36 px) es el de siempre y el default: quien no
+ * pase `size` no ve ningún cambio. `small` (32) para web densa; `large` (40)
+ * para mobile, donde se toca con el dedo. Extensión SUI (03-10-2026).
+ */
+type SuiTabChipsSize = 'small' | 'medium' | 'large';
 interface SuiTabChipItem {
     /** Valor único del chip (lo que devuelve `value`). */
     value: string;
@@ -10734,8 +10837,12 @@ interface SuiTabChipItem {
  *     [chips]="['Hamburguesas', 'Pizzas', 'Bebidas']"
  *     [(value)]="selected"
  *     [sticky]="true"
+ *     [size]="bp.isMobile() ? 'large' : 'medium'"
  *   />
  *
+ * Tamaños (extensión SUI, 03-10-2026): small 32 · medium 36 (default) ·
+ * large 40. Los tres con texto label-sm 14; cambia el alto y el aire lateral.
+ *
  *   También acepta objetos:
  *   <sui-tab-chips
  *     [chips]="[{value:'h', label:'Hamburguesas'}, {value:'p', label:'Pizzas'}]"
@@ -10749,6 +10856,8 @@ declare class SuiTabChips implements AfterViewInit, OnDestroy {
     readonly value: _angular_core.ModelSignal<string>;
     /** Si true, el componente queda sticky al top del scroll container. */
     readonly sticky: _angular_core.InputSignal<boolean>;
+    /** Tamaño de los chips: small 32 · medium 36 (default) · large 40 (mobile). */
+    readonly size: _angular_core.InputSignal<SuiTabChipsSize>;
     /** Auto-scroll horizontal del chip activo al cambiar `value`. */
     readonly autoScroll: _angular_core.InputSignal<boolean>;
     sentinelRef?: ElementRef<HTMLDivElement>;
@@ -10764,7 +10873,7 @@ declare class SuiTabChips implements AfterViewInit, OnDestroy {
     protected select(value: string): void;
     private scrollToChip;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTabChips, never>;
-    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; }; "autoScroll": { "alias": "autoScroll"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    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>;
 }
 
 /**
@@ -11256,7 +11365,7 @@ declare class SuiSegmentedControl<T = string> implements AfterViewInit {
     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>;
 }
 
-type SuiTagInputSize = 'xsmall' | 'small' | 'medium';
+type SuiTagInputSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
 /**
  * SUI Tag Input — SUI Design System 2.0
  *
@@ -11279,6 +11388,11 @@ type SuiTagInputSize = 'xsmall' | 'small' | 'medium';
  *   - small  (Small 36):   py=8px, pl=10px, pr=8px, gap=8px, radius=8px
  *   - medium (Medium 40):  py=10px, pl=12px, pr=10px, gap=8px, radius=10px (default)
  *
+ *   - large  (48, extensión SUI 03-10-2026): py=12−1, pl=14, pr=12, gap=10, radius=12
+ *   - xlarge (52, extensión SUI 03-10-2026): py=14−1, pl=16, pr=14, gap=10, radius=12
+ *     Mismos valores que `sui-input` large/xlarge, para que un tag-input y un input
+ *     del mismo formulario midan igual en mobile.
+ *
  *   El alto se deriva del line-height(20) del texto + 2×py. No height explícito.
  *
  *   - Texto input/placeholder: Paragraph/Small (Inter 14 / 20 / -0.084px ≈ -0.006em),
@@ -11356,6 +11470,12 @@ declare class SuiTagInput implements ControlValueAccessor {
     readonly rightIcon: _angular_core.InputSignal<string | boolean>;
     /** Nombre resuelto del icono trailing (null = no se renderiza). */
     protected readonly rightIconCfg: _angular_core.Signal<string | null>;
+    /**
+     * El tamaño que se le pasa al `sui-form-label`. Igual que en `sui-input`: el
+     * label no crece con el campo; en large y xlarge crece el área de toque, no la
+     * jerarquía del formulario (y `SuiFormLabelSize` llega hasta medium).
+     */
+    protected readonly labelSize: _angular_core.Signal<SuiFormLabelSize>;
     readonly label: _angular_core.InputSignal<string | null>;
     readonly sublabel: _angular_core.InputSignal<string | null>;
     readonly required: _angular_core.InputSignal<boolean>;
@@ -11408,6 +11528,11 @@ declare class SuiTagInput implements ControlValueAccessor {
 }
 
 type SuiTagStyle = 'stroke' | 'gray';
+/**
+ * Tamaño. `medium` (24) es el de Figma y el default. `large` 32 y `xlarge` 40
+ * son extensión SUI (03-10-2026) para mobile, con la X de quitar más grande.
+ */
+type SuiTagSize = 'medium' | 'large' | 'xlarge';
 /**
  * SUI Tag — SUI Design System 2.0
  *
@@ -11428,6 +11553,7 @@ type SuiTagStyle = 'stroke' | 'gray';
  *
  * EXACT (pulled, verified pixel/token):
  *  - Container: border-radius 6px (--sui-radius-6), height 24px (py=4px + 16px line).
+ *    (24 es `medium`, el default; ver TAMAÑOS abajo para large/xlarge.)
  *    NOTE: distinto del badge (radius-full 999px) — NO confundir.
  *  - Typography: Label/X Small (Inter Medium, 12px / line 16 / tracking 0, NO uppercase),
  *    font-feature 'ss11' 1, 'calt' 0, 'liga' 0. Label color text-sub-600 (#5c5c5c).
@@ -11490,12 +11616,25 @@ type SuiTagStyle = 'stroke' | 'gray';
  *    contenido proyectado (avatar/flag con color propio) NO se puede forzar a gris
  *    desde el host — el consumer debe atenuar su propio leading si lo requiere.
  *
+ * TAMAÑOS — extensión SUI (03-10-2026, pedido del dueño):
+ *  Figma trae solo 24 px, con una X de 16 que en mobile queda muy por debajo de
+ *  los 44 del dedo. Se suman dos tamaños en la escala del sui-button:
+ *    medium  24 · Label/X Small 12/16 · leading 16 · X 16 (default, Figma)
+ *    large   32 · Label/Small 14/20   · leading 20 · X 20
+ *    xlarge  40 · Label/Medium 16/24  · leading 20 · X 24
+ *  En large/xlarge la X además se agranda por dentro (::before invisible) para
+ *  que el área táctil llegue al alto del tag sin cambiar cómo se ve.
+ *
  * CUSTOM (no en Figma — add-on local): ninguno por ahora. extraFeatures del
  * reporte de auditoría estaba vacío.
  */
 declare class SuiTag {
     /** Visual style. `stroke` = white bg + soft border; `gray` = weak-50 bg, no border. Default stroke. */
     readonly tagStyle: _angular_core.InputSignal<SuiTagStyle>;
+    /** Tamaño: medium 24 (default, Figma) · large 32 · xlarge 40 (mobile). */
+    readonly size: _angular_core.InputSignal<SuiTagSize>;
+    /** Px del glyph de la X por tamaño (16 / 20 / 24). */
+    readonly dismissIconSize: _angular_core.Signal<number>;
     /**
      * True cuando hay un leading element proyectado (icon/avatar/flag/brand/company)
      * en `[data-slot=start]`. Ajusta el padding (pl=4) y agrega gap=4 leading↔texto.
@@ -11521,7 +11660,7 @@ declare class SuiTag {
     readonly showsSublabel: _angular_core.Signal<boolean>;
     protected onDismiss(event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiTag, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiTag, "sui-tag", never, { "tagStyle": { "alias": "tagStyle"; "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>;
+    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>;
 }
 
 /**
@@ -12666,4 +12805,4 @@ declare class SuiTooltipPanel {
 }
 
 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_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, formatDateInput, formatDateShort, formatMonthYear, formatTime, isSameTime, normalizeHex, pad2, parseTime, to12h, to24h };
-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, SuiCheckboxSize, SuiCircularProgressBarColor, SuiCircularProgressBarSize, SuiColorDotColor, SuiCommandMenuItemSize, SuiCommandMenuItemType, SuiCompactAvatarGroupAppearance, SuiCompactAvatarGroupSize, SuiCompactButtonSize, SuiCompactButtonStyle, SuiCompactSelectForInputItem, SuiCompactSelectForInputSize, SuiCompactSelectItem, SuiCompactSelectSize, SuiCompactSelectType, SuiContentCardType, SuiContentDividerItem, SuiContentDividerType, SuiContentLabelBadgePlacement, SuiContentLabelSize, SuiContentLabelType, SuiCounterInputSize, SuiDateRange, SuiDatepickerCalendars, SuiDatepickerMode, SuiDayCellType, SuiDividerOrientation, SuiDrawerFooterType, SuiDrawerHeaderSize, SuiDrawerHeaderType, SuiDropdownItemMode, SuiDropdownItemSize, SuiDropdownMenuPopupRole, SuiDropdownMenuPosition, SuiEmojiName, SuiEmojiSize, SuiEmptyStateAction, 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, SuiOtpInputType, SuiPaginationInfoFormat, SuiPaginationSize, SuiPaginationType, SuiPasswordStrengthCondition, SuiPasswordStrengthLevel, SuiPaymentIconSize, SuiPaymentIconType, SuiPopoverFooter, SuiPopoverPosition, SuiProductCardFallback, SuiProductCardImage, SuiProgressBarColor, SuiProgressBarLabelType, SuiProgressBarSize, SuiRadioCardType, SuiRadioSize, SuiRadioValue, SuiRatingAlignment, SuiRatingAppearance, SuiRatingReviewLink, SuiRatingSize, SuiRatingType, SuiRichEditorAction, SuiRichEditorCommand, SuiRichEditorItemState, SuiRichEditorItemType, SuiRichEditorLayout, SuiSegmentedControlItem, SuiSegmentedControlSize, SuiSelectOption, SuiSelectSize, SuiSelectType, SuiSidebarBrandConfig, SuiSidebarIndicatorColor, SuiSidebarItem, SuiSidebarMobileMode, SuiSidebarProfile, SuiSidebarSearchConfig, SuiSliderType, SuiSocialButtonBrand, SuiSocialButtonStyle, SuiStatusBadgeAppearance, SuiStatusBadgeStatus, SuiStepperItem, SuiStepperSize, SuiStepperState, SuiStepperVariant, SuiStoreCardData, SuiSwitchCardType, SuiSwitchSize, SuiTabBar, SuiTabChipItem, SuiTabMenuHorizontalItem, SuiTabMenuHorizontalSize, SuiTabMenuVerticalItem, SuiTabMenuVerticalStyle, SuiTableCellMisc, SuiTableCellPriority, SuiTableColumn, SuiTableSize, SuiTagInputSize, SuiTagStyle, SuiTimeDurationPreset, SuiTimeFormat, SuiTimePeriod, SuiTimePickerItemDirection, SuiTimePickerStatusType, SuiTimeValue, SuiToastAction, SuiToastData, SuiToastItem, SuiToastPosition, SuiToastStyle, SuiToastVariant, SuiTooltipLargeData, SuiTooltipPosition, SuiTooltipSize, SuiTooltipTheme, SuiTooltipThemeInput, SuiTopbarAccent, SuiTopbarAction, SuiTopbarEntry, SuiTopbarSearchConfig, SuiTopbarUserConfig };
+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, SuiContentCardType, SuiContentDividerItem, SuiContentDividerType, SuiContentLabelBadgePlacement, SuiContentLabelSize, SuiContentLabelType, SuiCounterInputSize, SuiDateRange, SuiDatepickerCalendars, SuiDatepickerMode, SuiDayCellType, SuiDividerOrientation, SuiDrawerFooterType, SuiDrawerHeaderSize, SuiDrawerHeaderType, SuiDropdownItemMode, SuiDropdownItemSize, SuiDropdownMenuPopupRole, SuiDropdownMenuPosition, SuiEmojiName, SuiEmojiSize, SuiEmptyStateAction, 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, SuiOtpInputType, SuiPaginationInfoFormat, SuiPaginationSize, SuiPaginationType, SuiPasswordStrengthCondition, SuiPasswordStrengthLevel, SuiPaymentIconSize, SuiPaymentIconType, SuiPopoverFooter, SuiPopoverPosition, SuiProductCardFallback, SuiProductCardImage, 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, SuiSwitchCardType, SuiSwitchSize, SuiTabBar, SuiTabChipItem, SuiTabChipsSize, SuiTabMenuHorizontalItem, SuiTabMenuHorizontalSize, SuiTabMenuVerticalItem, SuiTabMenuVerticalStyle, SuiTableCellMisc, SuiTableCellPriority, SuiTableColumn, SuiTableSize, SuiTagInputSize, SuiTagSize, SuiTagStyle, SuiTimeDurationPreset, SuiTimeFormat, SuiTimePeriod, SuiTimePickerItemDirection, SuiTimePickerStatusType, SuiTimeValue, SuiToastAction, SuiToastData, SuiToastItem, SuiToastPosition, SuiToastStyle, SuiToastVariant, SuiTooltipLargeData, SuiTooltipPosition, SuiTooltipSize, SuiTooltipTheme, SuiTooltipThemeInput, SuiTopbarAccent, SuiTopbarAction, SuiTopbarEntry, SuiTopbarSearchConfig, SuiTopbarUserConfig };