@eui/ecl 22.0.0-alpha.28 → 22.0.0-alpha.29

package/docs/json/documentation.json

@@ -30333,42 +30333,50 @@
         },
         {
             "name": "EclRadioDirective",
-            "id": "directive-EclRadioDirective-9cb71060b851b826cfddc34c55b4f68a056f7c71001e82656b6b52ef864902c36eb8a959e6b944f0982ce7dfdda545e81cb509b1ec1bfc4f2ef9c77ec7474ffc",
+            "id": "directive-EclRadioDirective-d280696d12234cefb3aa0d134d20a5f0302e41e58b7c1884a4914e230e0b189204d25c6216cbed3293f024b8cdab94aec8b7ff609fb58ce43dc89654623c81a0",
             "file": "packages/ecl/components/ecl-radio/ecl-radio.directive.ts",
             "type": "directive",
             "description": "<p>Directive that applies the ECL radio button styling and behavior.</p>\n<p>Should be applied to native radio input elements to enhance them\nwith ECL styles and support for invalid, disabled and binary states.</p>\n",
             "rawdescription": "\n\nDirective that applies the ECL radio button styling and behavior.\n\nShould be applied to native radio input elements to enhance them\nwith ECL styles and support for invalid, disabled and binary states.\n",
-            "sourceCode": "import { booleanAttribute, Directive, DoCheck, forwardRef, HostBinding, Input, input, contentChild } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclRadioHelpComponent } from './ecl-radio-help.component';\nimport { EclRadioLabelComponent } from './ecl-radio-label.component';\n\n/**\n * Directive that applies the ECL radio button styling and behavior.\n *\n * Should be applied to native radio input elements to enhance them\n * with ECL styles and support for invalid, disabled and binary states.\n */\n@Directive({\n    selector: '[eclRadio]',\n})\nexport class EclRadioDirective extends ECLBaseDirective implements DoCheck {\n    /**\n     * Adds the `ecl-radio--binary` class when true.\n     */\n    readonly isBinary = input<boolean, unknown>(undefined, { transform: booleanAttribute });\n\n    /**\n     * Adds the `ecl-radio--disabled` class to the host element when true.\n     */\n    @Input({ transform: booleanAttribute })\n    @HostBinding('class.ecl-radio--disabled')\n    isDisabled = false;\n\n    /**\n     * Adds the `ecl-radio--invalid` class to the host element when true.\n     */\n    @Input({ transform: booleanAttribute })\n    @HostBinding('class.ecl-radio--invalid')\n    isInvalid = false;\n\n    /**\n     * Reference to the projected EclRadioLabelComponent, if present.\n     * Used to synchronize disabled and invalid states with the label.\n     */\n    readonly eclRadioLabelComponent = contentChild(forwardRef(() => EclRadioLabelComponent));\n\n    /**\n     * Reference to the projected EclRadioHelpComponent, if present.\n     * Used to synchronize the disabled state with the help text.\n     */\n    readonly eclRadioHelpComponent = contentChild(forwardRef(() => EclRadioHelpComponent));\n\n    /**\n     * Returns the CSS classes to apply on the host element.\n     * Includes the base `ecl-radio` class and the binary modifier if applicable.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio'), this.isBinary() ? 'ecl-radio--binary' : ''].join(' ').trim();\n    }\n\n    /**\n     * Angular lifecycle hook called during every change detection run.\n     * Used to update child components with the current disabled and invalid states.\n     */\n    ngDoCheck(): void {\n        this.updateChildElements();\n    }\n\n    private updateChildElements(): void {\n        const eclRadioLabelComponent = this.eclRadioLabelComponent();\n        if (eclRadioLabelComponent) {\n            eclRadioLabelComponent.isInvalid = this.isInvalid;\n            eclRadioLabelComponent.isDisabled = this.isDisabled;\n        }\n\n        const eclRadioHelpComponent = this.eclRadioHelpComponent();\n        if (eclRadioHelpComponent) {\n            eclRadioHelpComponent.isDisabled = this.isDisabled;\n        }\n    }\n}\n",
+            "sourceCode": "import { booleanAttribute, computed, Directive, effect, forwardRef, input, signal, contentChild } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclRadioHelpComponent } from './ecl-radio-help.component';\nimport { EclRadioLabelComponent } from './ecl-radio-label.component';\n\n/**\n * Directive that applies the ECL radio button styling and behavior.\n *\n * Should be applied to native radio input elements to enhance them\n * with ECL styles and support for invalid, disabled and binary states.\n */\n@Directive({\n    selector: '[eclRadio]',\n    host: {\n        '[class]': 'cssClasses',\n        '[class.ecl-radio--disabled]': 'isDisabled()',\n        '[class.ecl-radio--invalid]': 'isInvalid()',\n    },\n})\nexport class EclRadioDirective extends ECLBaseDirective {\n    /**\n     * Adds the `ecl-radio--binary` class when true.\n     */\n    readonly isBinary = input<boolean, unknown>(undefined, { transform: booleanAttribute });\n\n    /**\n     * Consumer-provided disabled state, bound as an attribute on the host element.\n     */\n    readonly disabledInput = input<boolean, unknown>(false, { transform: booleanAttribute, alias: 'isDisabled' });\n\n    /**\n     * Consumer-provided invalid state, bound as an attribute on the host element.\n     */\n    readonly invalidInput = input<boolean, unknown>(false, { transform: booleanAttribute, alias: 'isInvalid' });\n\n    /**\n     * Disabled state derived from the child `eclRadioInput` form control, if any.\n     * Overrides the consumer-provided value when the control drives the state.\n     */\n    private readonly controlDisabled = signal<boolean | undefined>(undefined);\n\n    /**\n     * Invalid state derived from the child `eclRadioInput` form control, if any.\n     * Overrides the consumer-provided value when the control drives the state.\n     */\n    private readonly controlInvalid = signal<boolean | undefined>(undefined);\n\n    /**\n     * Effective disabled state, preferring the form-control-driven value when present.\n     * Adds the `ecl-radio--disabled` class to the host element when true.\n     *\n     * Precedence: when a child `eclRadioInput` is bound to a form control it calls\n     * `setControlState`, making `controlDisabled` a concrete boolean that takes over.\n     * While `controlDisabled` is `undefined` (no form control in play), the `??`\n     * falls back to the consumer-provided `disabledInput` attribute value.\n     */\n    readonly isDisabled = computed(() => this.controlDisabled() ?? this.disabledInput());\n\n    /**\n     * Effective invalid state, preferring the form-control-driven value when present.\n     * Adds the `ecl-radio--invalid` class to the host element when true.\n     *\n     * Precedence: when a child `eclRadioInput` is bound to a form control it calls\n     * `setControlState`, making `controlInvalid` a concrete boolean that takes over.\n     * While `controlInvalid` is `undefined` (no form control in play), the `??`\n     * falls back to the consumer-provided `invalidInput` attribute value.\n     */\n    readonly isInvalid = computed(() => this.controlInvalid() ?? this.invalidInput());\n\n    /**\n     * Reference to the projected EclRadioLabelComponent, if present.\n     * Used to synchronize disabled and invalid states with the label.\n     */\n    readonly eclRadioLabelComponent = contentChild(forwardRef(() => EclRadioLabelComponent));\n\n    /**\n     * Reference to the projected EclRadioHelpComponent, if present.\n     * Used to synchronize the disabled state with the help text.\n     */\n    readonly eclRadioHelpComponent = contentChild(forwardRef(() => EclRadioHelpComponent));\n\n    constructor() {\n        super();\n        this.synchronizeChildElements();\n    }\n\n    /**\n     * Returns the CSS classes to apply on the host element.\n     * Includes the base `ecl-radio` class and the binary modifier if applicable.\n     */\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio'), this.isBinary() ? 'ecl-radio--binary' : ''].join(' ').trim();\n    }\n\n    /**\n     * Called by the child `eclRadioInput` directive to propagate the disabled and\n     * invalid states derived from the associated form control.\n     */\n    setControlState(isInvalid: boolean, isDisabled: boolean): void {\n        this.controlInvalid.set(isInvalid);\n        this.controlDisabled.set(isDisabled);\n    }\n\n    /**\n     * Keeps the projected label and help components in sync with the\n     * directive's disabled and invalid states whenever they change.\n     */\n    private synchronizeChildElements(): void {\n        effect(() => {\n            const isDisabled = this.isDisabled();\n            const isInvalid = this.isInvalid();\n\n            const eclRadioLabelComponent = this.eclRadioLabelComponent();\n            if (eclRadioLabelComponent) {\n                eclRadioLabelComponent.isInvalid.set(isInvalid);\n                eclRadioLabelComponent.isDisabled.set(isDisabled);\n            }\n\n            const eclRadioHelpComponent = this.eclRadioHelpComponent();\n            if (eclRadioHelpComponent) {\n                eclRadioHelpComponent.isDisabled.set(isDisabled);\n            }\n        });\n    }\n}\n",
             "selector": "[eclRadio]",
             "providers": [],
             "hostDirectives": [],
             "standalone": false,
             "inputsClass": [
                 {
-                    "coverageIgnore": false,
-                    "required": false,
                     "name": "isDisabled",
+                    "coverageIgnore": false,
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nAdds the `ecl-radio--disabled` class to the host element when true.\n",
-                    "description": "<p>Adds the <code>ecl-radio--disabled</code> class to the host element when true.</p>\n",
-                    "line": 26,
                     "type": "boolean",
-                    "decorators": []
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Consumer-provided disabled state, bound as an attribute on the host element.</p>\n",
+                    "line": 29,
+                    "rawdescription": "\n\nConsumer-provided disabled state, bound as an attribute on the host element.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
                 },
                 {
-                    "coverageIgnore": false,
-                    "required": false,
                     "name": "isInvalid",
+                    "coverageIgnore": false,
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nAdds the `ecl-radio--invalid` class to the host element when true.\n",
-                    "description": "<p>Adds the <code>ecl-radio--invalid</code> class to the host element when true.</p>\n",
-                    "line": 33,
                     "type": "boolean",
-                    "decorators": []
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Consumer-provided invalid state, bound as an attribute on the host element.</p>\n",
+                    "line": 34,
+                    "rawdescription": "\n\nConsumer-provided invalid state, bound as an attribute on the host element.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
                 },
                 {
                     "name": "isBinary",
@@ -30380,7 +30388,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "<p>Adds the <code>ecl-radio--binary</code> class when true.</p>\n",
-                    "line": 19,
+                    "line": 24,
                     "rawdescription": "\n\nAdds the `ecl-radio--binary` class when true.\n",
                     "modifierKind": [
                         148
@@ -30434,20 +30442,7 @@
             "outputsClass": [],
             "deprecated": false,
             "deprecationMessage": "",
-            "hostBindings": [
-                {
-                    "coverageIgnore": false,
-                    "name": "class",
-                    "actualName": "cssClasses",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nReturns the CSS classes to apply on the host element.\nIncludes the base `ecl-radio` class and the binary modifier if applicable.\n",
-                    "description": "<p>Returns the CSS classes to apply on the host element.\nIncludes the base <code>ecl-radio</code> class and the binary modifier if applicable.</p>\n",
-                    "line": 52,
-                    "type": "string",
-                    "decorators": []
-                }
-            ],
+            "hostBindings": [],
             "hostListeners": [],
             "propertiesClass": [
                 {
@@ -30460,7 +30455,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "<p>Reference to the projected EclRadioHelpComponent, if present.\nUsed to synchronize the disabled state with the help text.</p>\n",
-                    "line": 45,
+                    "line": 80,
                     "rawdescription": "\n\nReference to the projected EclRadioHelpComponent, if present.\nUsed to synchronize the disabled state with the help text.\n",
                     "modifierKind": [
                         148
@@ -30476,26 +30471,99 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "<p>Reference to the projected EclRadioLabelComponent, if present.\nUsed to synchronize disabled and invalid states with the label.</p>\n",
-                    "line": 39,
+                    "line": 74,
                     "rawdescription": "\n\nReference to the projected EclRadioLabelComponent, if present.\nUsed to synchronize disabled and invalid states with the label.\n",
                     "modifierKind": [
                         148
                     ]
+                },
+                {
+                    "name": "isDisabled",
+                    "coverageIgnore": false,
+                    "defaultValue": "computed(() => this.controlDisabled() ?? this.disabledInput())",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "unknown",
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Effective disabled state, preferring the form-control-driven value when present.\nAdds the <code>ecl-radio--disabled</code> class to the host element when true.</p>\n<p>Precedence: when a child <code>eclRadioInput</code> is bound to a form control it calls\n<code>setControlState</code>, making <code>controlDisabled</code> a concrete boolean that takes over.\nWhile <code>controlDisabled</code> is <code>undefined</code> (no form control in play), the <code>??</code>\nfalls back to the consumer-provided <code>disabledInput</code> attribute value.</p>\n",
+                    "line": 57,
+                    "rawdescription": "\n\nEffective disabled state, preferring the form-control-driven value when present.\nAdds the `ecl-radio--disabled` class to the host element when true.\n\nPrecedence: when a child `eclRadioInput` is bound to a form control it calls\n`setControlState`, making `controlDisabled` a concrete boolean that takes over.\nWhile `controlDisabled` is `undefined` (no form control in play), the `??`\nfalls back to the consumer-provided `disabledInput` attribute value.\n",
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "isInvalid",
+                    "coverageIgnore": false,
+                    "defaultValue": "computed(() => this.controlInvalid() ?? this.invalidInput())",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "unknown",
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Effective invalid state, preferring the form-control-driven value when present.\nAdds the <code>ecl-radio--invalid</code> class to the host element when true.</p>\n<p>Precedence: when a child <code>eclRadioInput</code> is bound to a form control it calls\n<code>setControlState</code>, making <code>controlInvalid</code> a concrete boolean that takes over.\nWhile <code>controlInvalid</code> is <code>undefined</code> (no form control in play), the <code>??</code>\nfalls back to the consumer-provided <code>invalidInput</code> attribute value.</p>\n",
+                    "line": 68,
+                    "rawdescription": "\n\nEffective invalid state, preferring the form-control-driven value when present.\nAdds the `ecl-radio--invalid` class to the host element when true.\n\nPrecedence: when a child `eclRadioInput` is bound to a form control it calls\n`setControlState`, making `controlInvalid` a concrete boolean that takes over.\nWhile `controlInvalid` is `undefined` (no form control in play), the `??`\nfalls back to the consumer-provided `invalidInput` attribute value.\n",
+                    "modifierKind": [
+                        148
+                    ]
                 }
             ],
             "methodsClass": [
                 {
-                    "name": "ngDoCheck",
+                    "name": "setControlState",
                     "coverageIgnore": false,
-                    "args": [],
+                    "args": [
+                        {
+                            "name": "isInvalid",
+                            "type": "boolean",
+                            "optional": false,
+                            "dotDotDotToken": false,
+                            "deprecated": false,
+                            "deprecationMessage": ""
+                        },
+                        {
+                            "name": "isDisabled",
+                            "type": "boolean",
+                            "optional": false,
+                            "dotDotDotToken": false,
+                            "deprecated": false,
+                            "deprecationMessage": ""
+                        }
+                    ],
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 60,
+                    "line": 99,
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nAngular lifecycle hook called during every change detection run.\nUsed to update child components with the current disabled and invalid states.\n",
-                    "description": "<p>Angular lifecycle hook called during every change detection run.\nUsed to update child components with the current disabled and invalid states.</p>\n"
+                    "rawdescription": "\n\nCalled by the child `eclRadioInput` directive to propagate the disabled and\ninvalid states derived from the associated form control.\n",
+                    "description": "<p>Called by the child <code>eclRadioInput</code> directive to propagate the disabled and\ninvalid states derived from the associated form control.</p>\n",
+                    "jsdoctags": [
+                        {
+                            "name": "isInvalid",
+                            "type": "boolean",
+                            "optional": false,
+                            "dotDotDotToken": false,
+                            "deprecated": false,
+                            "deprecationMessage": "",
+                            "tagName": {
+                                "text": "param"
+                            }
+                        },
+                        {
+                            "name": "isDisabled",
+                            "type": "boolean",
+                            "optional": false,
+                            "dotDotDotToken": false,
+                            "deprecated": false,
+                            "deprecationMessage": "",
+                            "tagName": {
+                                "text": "param"
+                            }
+                        }
+                    ]
                 },
                 {
                     "name": "getCssClasses",
@@ -30539,8 +30607,8 @@
             "coverageIgnore": false,
             "jsdoctags": [
                 {
-                    "pos": 312,
-                    "end": 531,
+                    "pos": 309,
+                    "end": 528,
                     "kind": 321,
                     "id": 0,
                     "flags": 16777216,
@@ -30552,9 +30620,15 @@
             "extends": [
                 "ECLBaseDirective"
             ],
-            "implements": [
-                "DoCheck"
-            ],
+            "constructorObj": {
+                "name": "constructor",
+                "description": "",
+                "deprecated": false,
+                "deprecationMessage": "",
+                "args": [],
+                "line": 80,
+                "rawdescription": "\n"
+            },
             "accessors": {
                 "cssClasses": {
                     "name": "cssClasses",
@@ -30562,7 +30636,7 @@
                         "name": "cssClasses",
                         "type": "string",
                         "returnType": "string",
-                        "line": 52,
+                        "line": 91,
                         "rawdescription": "\n\nReturns the CSS classes to apply on the host element.\nIncludes the base `ecl-radio` class and the binary modifier if applicable.\n",
                         "description": "<p>Returns the CSS classes to apply on the host element.\nIncludes the base <code>ecl-radio</code> class and the binary modifier if applicable.</p>\n"
                     }
@@ -30574,22 +30648,18 @@
                     {
                         "name": "ECLBaseDirective",
                         "type": "directive"
-                    },
-                    {
-                        "name": "DoCheck",
-                        "type": "interface"
                     }
                 ]
             }
         },
         {
             "name": "EclRadioInputDirective",
-            "id": "directive-EclRadioInputDirective-2af680fc7801c158cfd5ef02c8b7f9ddb997a370bb180182a91b5f5e4a973c0f0dd0c215009b46c2940ceb941ab0c3ca32588b8824dcc299ec6d1697736f5979",
+            "id": "directive-EclRadioInputDirective-10a189efbe575a1843b6fb45d66303fcf752d2315ff524cb3686d6929a4d9c080d649b789a65ca416689eea03dfff742ae91dea5bf44d5ce455326bde285ac2b",
             "file": "packages/ecl/components/ecl-radio/ecl-radio-input.directive.ts",
             "type": "directive",
             "description": "<p>Directive that decorates native <input> elements to be styled as ECL radio inputs.</p>\n<p>Applies the proper ECL CSS classes and integrates with Angular forms\nto reflect validation states (invalid, disabled) in the parent ECL radio directive.\nShould be used together with the eclRadio directive.</p>\n",
             "rawdescription": "\n\nDirective that decorates native <input> elements to be styled as ECL radio inputs.\n\nApplies the proper ECL CSS classes and integrates with Angular forms\nto reflect validation states (invalid, disabled) in the parent ECL radio directive.\nShould be used together with the eclRadio directive.\n",
-            "sourceCode": "import { Directive, HostBinding, ChangeDetectorRef, DoCheck, inject } from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { EclRadioDirective } from './ecl-radio.directive';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive that decorates native <input> elements to be styled as ECL radio inputs.\n *\n * Applies the proper ECL CSS classes and integrates with Angular forms\n * to reflect validation states (invalid, disabled) in the parent ECL radio directive.\n * Should be used together with the eclRadio directive.\n */\n@Directive({\n    selector: 'input[eclRadioInput]',\n})\nexport class EclRadioInputDirective extends ECLBaseDirective implements DoCheck {\n    eclRadio = inject(EclRadioDirective);\n    protected ngControl = inject(NgControl, { optional: true, self: true });\n    protected cd = inject(ChangeDetectorRef);\n\n    /**\n     * Returns the CSS classes applied to the host input element.\n     * Includes the base ecl-radio__input class.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio__input')].join(' ').trim();\n    }\n\n    ngDoCheck(): void {\n        if (this.ngControl) {\n            if (this.eclRadio) {\n                this.eclRadio.isInvalid = this.ngControl.invalid && this.ngControl.touched;\n                this.eclRadio.isDisabled = this.ngControl.disabled;\n            }\n        }\n    }\n}\n",
+            "sourceCode": "import { Directive, ChangeDetectorRef, DoCheck, inject } from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { EclRadioDirective } from './ecl-radio.directive';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive that decorates native <input> elements to be styled as ECL radio inputs.\n *\n * Applies the proper ECL CSS classes and integrates with Angular forms\n * to reflect validation states (invalid, disabled) in the parent ECL radio directive.\n * Should be used together with the eclRadio directive.\n */\n@Directive({\n    selector: 'input[eclRadioInput]',\n    host: {\n        '[class]': 'cssClasses',\n    },\n})\nexport class EclRadioInputDirective extends ECLBaseDirective implements DoCheck {\n    eclRadio = inject(EclRadioDirective);\n    protected ngControl = inject(NgControl, { optional: true, self: true });\n    protected cd = inject(ChangeDetectorRef);\n\n    /**\n     * Returns the CSS classes applied to the host input element.\n     * Includes the base ecl-radio__input class.\n     */\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio__input')].join(' ').trim();\n    }\n\n    ngDoCheck(): void {\n        if (this.ngControl) {\n            if (this.eclRadio) {\n                this.eclRadio.setControlState(\n                    this.ngControl.invalid && this.ngControl.touched,\n                    this.ngControl.disabled,\n                );\n            }\n        }\n    }\n}\n",
             "selector": "input[eclRadioInput]",
             "providers": [],
             "hostDirectives": [],
@@ -30642,20 +30712,7 @@
             "outputsClass": [],
             "deprecated": false,
             "deprecationMessage": "",
-            "hostBindings": [
-                {
-                    "coverageIgnore": false,
-                    "name": "class",
-                    "actualName": "cssClasses",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nReturns the CSS classes applied to the host input element.\nIncludes the base ecl-radio__input class.\n",
-                    "description": "<p>Returns the CSS classes applied to the host input element.\nIncludes the base ecl-radio__input class.</p>\n",
-                    "line": 26,
-                    "type": "string",
-                    "decorators": []
-                }
-            ],
+            "hostBindings": [],
             "hostListeners": [],
             "propertiesClass": [
                 {
@@ -30668,7 +30725,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 19,
+                    "line": 22,
                     "rawdescription": "\n",
                     "modifierKind": [
                         124
@@ -30684,7 +30741,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 17,
+                    "line": 20,
                     "rawdescription": "\n"
                 },
                 {
@@ -30697,7 +30754,7 @@
                     "indexKey": "",
                     "optional": false,
                     "description": "",
-                    "line": 18,
+                    "line": 21,
                     "rawdescription": "\n",
                     "modifierKind": [
                         124
@@ -30712,7 +30769,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 30,
+                    "line": 32,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "rawdescription": "\n",
@@ -30760,8 +30817,8 @@
             "coverageIgnore": false,
             "jsdoctags": [
                 {
-                    "pos": 246,
-                    "end": 557,
+                    "pos": 233,
+                    "end": 544,
                     "kind": 321,
                     "id": 0,
                     "flags": 16777216,
@@ -30783,7 +30840,7 @@
                         "name": "cssClasses",
                         "type": "string",
                         "returnType": "string",
-                        "line": 26,
+                        "line": 28,
                         "rawdescription": "\n\nReturns the CSS classes applied to the host input element.\nIncludes the base ecl-radio__input class.\n",
                         "description": "<p>Returns the CSS classes applied to the host input element.\nIncludes the base ecl-radio__input class.</p>\n"
                     }
@@ -75763,10 +75820,11 @@
         },
         {
             "name": "EclRadioHelpComponent",
-            "id": "component-EclRadioHelpComponent-aa9c5686af7ebcaf4496b7a6c4dfd71c37f885454a7fd965c110357d3d9df1cbf4f1e51fa842baede60be9d480a9c3d9e2071c71f6d6d1a588c00ad94f8ad11e",
+            "id": "component-EclRadioHelpComponent-8682250cbf62413cd43d481ee0fe5dd5f51ae76218789eace6dd5c564147e04ec8424020fcd6ebbb45fdb5cf49bd19993fcc2994793f93828f72c29c24d9d285",
             "file": "packages/ecl/components/ecl-radio/ecl-radio-help.component.ts",
             "encapsulation": [],
             "entryComponents": [],
+            "host": {},
             "inputs": [],
             "outputs": [],
             "providers": [],
@@ -75781,17 +75839,21 @@
             "hostDirectives": [],
             "inputsClass": [
                 {
-                    "coverageIgnore": false,
-                    "required": false,
                     "name": "isDisabled",
+                    "coverageIgnore": false,
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nAdds styling for a disabled help text.\n",
-                    "description": "<p>Adds styling for a disabled help text.</p>\n",
-                    "line": 21,
                     "type": "boolean",
-                    "decorators": []
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Adds styling for a disabled help text.</p>\n<p>Exposed as a model so the parent <code>eclRadio</code> directive can synchronize\nthe disabled state onto the projected help text.</p>\n",
+                    "line": 26,
+                    "rawdescription": "\n\nAdds styling for a disabled help text.\n\nExposed as a model so the parent `eclRadio` directive can synchronize\nthe disabled state onto the projected help text.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
                 },
                 {
                     "coverageIgnore": false,
@@ -75837,8 +75899,43 @@
                     }
                 }
             ],
-            "outputsClass": [],
-            "propertiesClass": [],
+            "outputsClass": [
+                {
+                    "name": "isDisabled",
+                    "coverageIgnore": false,
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "boolean",
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Adds styling for a disabled help text.</p>\n<p>Exposed as a model so the parent <code>eclRadio</code> directive can synchronize\nthe disabled state onto the projected help text.</p>\n",
+                    "line": 26,
+                    "rawdescription": "\n\nAdds styling for a disabled help text.\n\nExposed as a model so the parent `eclRadio` directive can synchronize\nthe disabled state onto the projected help text.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
+                }
+            ],
+            "propertiesClass": [
+                {
+                    "name": "cssClasses",
+                    "coverageIgnore": false,
+                    "defaultValue": "computed(() => [this.getCssClasses('ecl-radio__help')].join(' ').trim())",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "unknown",
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Returns the CSS classes applied to the host element.\nIncludes the base ecl-radio__help class.</p>\n",
+                    "line": 32,
+                    "rawdescription": "\n\nReturns the CSS classes applied to the host element.\nIncludes the base ecl-radio__help class.\n",
+                    "modifierKind": [
+                        148
+                    ]
+                }
+            ],
             "methodsClass": [
                 {
                     "name": "getCssClasses",
@@ -75882,34 +75979,21 @@
             "coverageIgnore": false,
             "deprecated": false,
             "deprecationMessage": "",
-            "hostBindings": [
-                {
-                    "coverageIgnore": false,
-                    "name": "class",
-                    "actualName": "cssClasses",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nReturns the CSS classes applied to the host element.\nIncludes the base ecl-radio__help class.\n",
-                    "description": "<p>Returns the CSS classes applied to the host element.\nIncludes the base ecl-radio__help class.</p>\n",
-                    "line": 28,
-                    "type": "string",
-                    "decorators": []
-                }
-            ],
+            "hostBindings": [],
             "hostListeners": [],
             "standalone": false,
             "imports": [],
             "description": "<p>Component that displays help text for the ECL radio input.</p>\n<p>Supports styling for the disabled state and applies the proper ECL CSS classes.\nShould be placed inside a component using eclRadio.</p>\n",
             "rawdescription": "\n\nComponent that displays help text for the ECL radio input.\n\nSupports styling for the disabled state and applies the proper ECL CSS classes.\nShould be placed inside a component using eclRadio.\n",
             "type": "component",
-            "sourceCode": "import { Component, HostBinding, Input, booleanAttribute } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Component that displays help text for the ECL radio input.\n *\n * Supports styling for the disabled state and applies the proper ECL CSS classes.\n * Should be placed inside a component using eclRadio.\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: '[eclRadioHelp]',\n    templateUrl: './ecl-radio-help.component.html',\n})\nexport class EclRadioHelpComponent extends ECLBaseDirective {\n    /**\n     * Adds styling for a disabled help text.\n     */\n    @Input({ transform: booleanAttribute }) \n    @HostBinding('class.ecl-radio__help--disabled')\n    isDisabled = false;\n\n    /**\n     * Returns the CSS classes applied to the host element.\n     * Includes the base ecl-radio__help class.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio__help')].join(' ').trim();\n    }\n}\n",
+            "sourceCode": "import { Component, computed, model } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Component that displays help text for the ECL radio input.\n *\n * Supports styling for the disabled state and applies the proper ECL CSS classes.\n * Should be placed inside a component using eclRadio.\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: '[eclRadioHelp]',\n    templateUrl: './ecl-radio-help.component.html',\n    host: {\n        '[class]': 'cssClasses()',\n        '[class.ecl-radio__help--disabled]': 'isDisabled()',\n    },\n})\nexport class EclRadioHelpComponent extends ECLBaseDirective {\n    /**\n     * Adds styling for a disabled help text.\n     *\n     * Exposed as a model so the parent `eclRadio` directive can synchronize\n     * the disabled state onto the projected help text.\n     */\n    readonly isDisabled = model(false);\n\n    /**\n     * Returns the CSS classes applied to the host element.\n     * Includes the base ecl-radio__help class.\n     */\n    readonly cssClasses = computed(() => [this.getCssClasses('ecl-radio__help')].join(' ').trim());\n}\n",
             "assetsDirs": [],
             "styleUrlsData": "",
             "stylesData": "",
             "jsdoctags": [
                 {
-                    "pos": 132,
-                    "end": 342,
+                    "pos": 111,
+                    "end": 321,
                     "kind": 321,
                     "id": 0,
                     "flags": 16777216,
@@ -75921,19 +76005,6 @@
             "extends": [
                 "ECLBaseDirective"
             ],
-            "accessors": {
-                "cssClasses": {
-                    "name": "cssClasses",
-                    "getSignature": {
-                        "name": "cssClasses",
-                        "type": "string",
-                        "returnType": "string",
-                        "line": 28,
-                        "rawdescription": "\n\nReturns the CSS classes applied to the host element.\nIncludes the base ecl-radio__help class.\n",
-                        "description": "<p>Returns the CSS classes applied to the host element.\nIncludes the base ecl-radio__help class.</p>\n"
-                    }
-                }
-            },
             "relationships": {
                 "incoming": [],
                 "outgoing": [
@@ -75947,12 +76018,13 @@
         },
         {
             "name": "EclRadioLabelComponent",
-            "id": "component-EclRadioLabelComponent-08dbcd3e37b7abd378cc068f59f6fe55675c6bfa80d40db2fed0ed7ca7cc8f641af7dcb5a693384058de359d9ab121394f9c4ed516fc513761f0277671f5a05c",
+            "id": "component-EclRadioLabelComponent-c396c3de709de50e401e3301a8bf1db29740ad9164218ea6b18bd59f739e78f22070ba26bbe926e505f0c2de4883d8474500f62f4b19bfa7114fe3acb7af44c3",
             "file": "packages/ecl/components/ecl-radio/ecl-radio-label.component.ts",
             "encapsulation": [
                 "ViewEncapsulation.None"
             ],
             "entryComponents": [],
+            "host": {},
             "inputs": [],
             "outputs": [],
             "providers": [],
@@ -75967,30 +76039,38 @@
             "hostDirectives": [],
             "inputsClass": [
                 {
-                    "coverageIgnore": false,
-                    "required": false,
                     "name": "isDisabled",
+                    "coverageIgnore": false,
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nAdds styling for a disabled state.\n",
-                    "description": "<p>Adds styling for a disabled state.</p>\n",
-                    "line": 25,
                     "type": "boolean",
-                    "decorators": []
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Adds styling for a disabled state.</p>\n<p>Exposed as a model so the parent <code>eclRadio</code> directive can synchronize\nthe disabled state onto the label.</p>\n",
+                    "line": 34,
+                    "rawdescription": "\n\nAdds styling for a disabled state.\n\nExposed as a model so the parent `eclRadio` directive can synchronize\nthe disabled state onto the label.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
                 },
                 {
-                    "coverageIgnore": false,
-                    "required": false,
                     "name": "isInvalid",
+                    "coverageIgnore": false,
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nAdds styling for an invalid state.\n",
-                    "description": "<p>Adds styling for an invalid state.</p>\n",
-                    "line": 20,
                     "type": "boolean",
-                    "decorators": []
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Adds styling for an invalid state.</p>\n<p>Exposed as a model so the parent <code>eclRadio</code> directive can synchronize\nthe invalid state onto the label.</p>\n",
+                    "line": 26,
+                    "rawdescription": "\n\nAdds styling for an invalid state.\n\nExposed as a model so the parent `eclRadio` directive can synchronize\nthe invalid state onto the label.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
                 },
                 {
                     "coverageIgnore": false,
@@ -76036,7 +76116,42 @@
                     }
                 }
             ],
-            "outputsClass": [],
+            "outputsClass": [
+                {
+                    "name": "isDisabled",
+                    "coverageIgnore": false,
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "boolean",
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Adds styling for a disabled state.</p>\n<p>Exposed as a model so the parent <code>eclRadio</code> directive can synchronize\nthe disabled state onto the label.</p>\n",
+                    "line": 34,
+                    "rawdescription": "\n\nAdds styling for a disabled state.\n\nExposed as a model so the parent `eclRadio` directive can synchronize\nthe disabled state onto the label.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
+                },
+                {
+                    "name": "isInvalid",
+                    "coverageIgnore": false,
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "boolean",
+                    "indexKey": "",
+                    "optional": false,
+                    "description": "<p>Adds styling for an invalid state.</p>\n<p>Exposed as a model so the parent <code>eclRadio</code> directive can synchronize\nthe invalid state onto the label.</p>\n",
+                    "line": 26,
+                    "rawdescription": "\n\nAdds styling for an invalid state.\n\nExposed as a model so the parent `eclRadio` directive can synchronize\nthe invalid state onto the label.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
+                }
+            ],
             "propertiesClass": [],
             "methodsClass": [
                 {
@@ -76081,34 +76196,21 @@
             "coverageIgnore": false,
             "deprecated": false,
             "deprecationMessage": "",
-            "hostBindings": [
-                {
-                    "coverageIgnore": false,
-                    "name": "class",
-                    "actualName": "cssClasses",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nReturns the CSS classes applied to the host element.\nIncludes the base `ecl-radio__label` class.\n",
-                    "description": "<p>Returns the CSS classes applied to the host element.\nIncludes the base <code>ecl-radio__label</code> class.</p>\n",
-                    "line": 32,
-                    "type": "string",
-                    "decorators": []
-                }
-            ],
+            "hostBindings": [],
             "hostListeners": [],
             "standalone": false,
             "imports": [],
             "description": "<p>Component representing a label for an ECL radio button.</p>\n<p>Used inside an element with the [eclRadio] directive to provide\na styled label that can reflect the radio&#39;s state.</p>\n",
             "rawdescription": "\n\nComponent representing a label for an ECL radio button.\n\nUsed inside an element with the [eclRadio] directive to provide\na styled label that can reflect the radio's state.\n",
             "type": "component",
-            "sourceCode": "import { Component, HostBinding, Input, ViewEncapsulation, booleanAttribute } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Component representing a label for an ECL radio button.\n *\n * Used inside an element with the [eclRadio] directive to provide\n * a styled label that can reflect the radio's state.\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: '[eclRadioLabel]',\n    templateUrl: './ecl-radio-label.component.html',\n    encapsulation: ViewEncapsulation.None,\n})\nexport class EclRadioLabelComponent extends ECLBaseDirective {\n    /**\n     * Adds styling for an invalid state.\n     */\n    @Input({ transform: booleanAttribute }) isInvalid = false;\n\n    /**\n     * Adds styling for a disabled state.\n     */\n    @Input({ transform: booleanAttribute }) isDisabled = false;\n\n    /**\n     * Returns the CSS classes applied to the host element.\n     * Includes the base `ecl-radio__label` class.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio__label')].join(' ').trim();\n    }\n}\n",
+            "sourceCode": "import { Component, ViewEncapsulation, model } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Component representing a label for an ECL radio button.\n *\n * Used inside an element with the [eclRadio] directive to provide\n * a styled label that can reflect the radio's state.\n */\n@Component({\n    // eslint-disable-next-line @angular-eslint/component-selector\n    selector: '[eclRadioLabel]',\n    templateUrl: './ecl-radio-label.component.html',\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        '[class]': 'cssClasses',\n    },\n})\nexport class EclRadioLabelComponent extends ECLBaseDirective {\n    /**\n     * Adds styling for an invalid state.\n     *\n     * Exposed as a model so the parent `eclRadio` directive can synchronize\n     * the invalid state onto the label.\n     */\n    readonly isInvalid = model(false);\n\n    /**\n     * Adds styling for a disabled state.\n     *\n     * Exposed as a model so the parent `eclRadio` directive can synchronize\n     * the disabled state onto the label.\n     */\n    readonly isDisabled = model(false);\n\n    /**\n     * Returns the CSS classes applied to the host element.\n     * Includes the base `ecl-radio__label` class.\n     */\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-radio__label')].join(' ').trim();\n    }\n}\n",
             "assetsDirs": [],
             "styleUrlsData": "",
             "stylesData": "",
             "jsdoctags": [
                 {
-                    "pos": 151,
-                    "end": 341,
+                    "pos": 120,
+                    "end": 310,
                     "kind": 321,
                     "id": 0,
                     "flags": 16777216,
@@ -76127,7 +76229,7 @@
                         "name": "cssClasses",
                         "type": "string",
                         "returnType": "string",
-                        "line": 32,
+                        "line": 40,
                         "rawdescription": "\n\nReturns the CSS classes applied to the host element.\nIncludes the base `ecl-radio__label` class.\n",
                         "description": "<p>Returns the CSS classes applied to the host element.\nIncludes the base <code>ecl-radio__label</code> class.</p>\n"
                     }
@@ -76142,7 +76244,7 @@
                     }
                 ]
             },
-            "templateData": "<span class=\"ecl-radio__box\" [class.ecl-radio__box--disabled]=\"isDisabled\" [class.ecl-radio__box--invalid]=\"isInvalid\">\n    <span class=\"ecl-radio__box-inner\"></span>\n</span>\n\n<ng-content></ng-content>\n"
+            "templateData": "<span class=\"ecl-radio__box\" [class.ecl-radio__box--disabled]=\"isDisabled()\" [class.ecl-radio__box--invalid]=\"isInvalid()\">\n    <span class=\"ecl-radio__box-inner\"></span>\n</span>\n\n<ng-content></ng-content>\n"
         },
         {
             "name": "EclRangeBubbleComponent",