@radix-ng/primitives 0.13.0 → 0.15.0

package/compodoc/documentation.json

@@ -196,12 +196,12 @@
         },
         {
             "name": "RdxAvatarFallbackProps",
-            "id": "interface-RdxAvatarFallbackProps-c8b14c99cbd7da2781b645483e75a4570eeed5794a58213d451c684aa433daae179c9caf3344d550af77ce8860288512938a0baeebc80e0a49f0c38a4557d5fc",
+            "id": "interface-RdxAvatarFallbackProps-3ec0a285681b4e3cef007c029710e37483fa80c00cbfcce5147fbcb173c808e1606e55fea16a94eb028b2692758b9c15c983bf6f8e5d3bb38210d8ba1d5d3ec0",
             "file": "avatar/src/avatar-fallback.directive.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { isPlatformBrowser } from '@angular/common';\nimport { Directive, inject, Input, NgZone, numberAttribute, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';\nimport { injectAvatar } from './avatar-root.directive';\nimport { injectAvatarConfig } from './avatar.config';\n\nexport interface RdxAvatarFallbackProps {\n    delayMs?: number;\n}\n\n@Directive({\n    selector: 'span[rdxAvatarFallback]',\n    exportAs: 'rdxAvatarFallback',\n    standalone: true,\n    host: {\n        '[style.display]': 'visible ? null : \"none\"'\n    }\n})\nexport class RdxAvatarFallbackDirective implements RdxAvatarFallbackProps, OnInit, OnDestroy {\n    private readonly avatar = injectAvatar();\n\n    private readonly config = injectAvatarConfig();\n\n    private readonly ngZone = inject(NgZone);\n\n    private readonly platformId = inject(PLATFORM_ID);\n\n    /**\n     * Define a delay before the fallback is shown.\n     * This is useful to only show the fallback for those with slower connections.\n     * @default 0\n     */\n    @Input({ alias: 'rdxDelayMs', transform: numberAttribute }) delayMs: number = this.config.delayMs;\n\n    protected get visible(): boolean {\n        return this.delayElapsed && this.avatar._state() !== 'loaded';\n    }\n\n    /**\n     * Determine the delay has elapsed, and we can show the fallback.\n     */\n    private delayElapsed = false;\n\n    private timeoutId: ReturnType<typeof setTimeout> | null = null;\n\n    ngOnInit(): void {\n        if (isPlatformBrowser(this.platformId)) {\n            this.ngZone.runOutsideAngular(() => {\n                this.timeoutId = globalThis.setTimeout(() => {\n                    this.ngZone.run(() => {\n                        this.delayElapsed = true;\n                    });\n                }, this.delayMs);\n            });\n        }\n    }\n\n    ngOnDestroy(): void {\n        if (isPlatformBrowser(this.platformId) && this.timeoutId !== null) {\n            globalThis.clearTimeout(this.timeoutId);\n        }\n    }\n}\n",
+            "sourceCode": "import { isPlatformBrowser } from '@angular/common';\nimport {\n    Directive,\n    inject,\n    Input,\n    NgZone,\n    numberAttribute,\n    OnDestroy,\n    OnInit,\n    PLATFORM_ID,\n    signal\n} from '@angular/core';\nimport { injectAvatar } from './avatar-root.directive';\nimport { injectAvatarConfig } from './avatar.config';\n\nexport interface RdxAvatarFallbackProps {\n    delayMs?: number;\n}\n\n@Directive({\n    selector: 'span[rdxAvatarFallback]',\n    exportAs: 'rdxAvatarFallback',\n    standalone: true,\n    host: {\n        '[style.display]': 'visible() ? null : \"none\"'\n    }\n})\nexport class RdxAvatarFallbackDirective implements RdxAvatarFallbackProps, OnInit, OnDestroy {\n    private readonly avatar = injectAvatar();\n\n    private readonly config = injectAvatarConfig();\n\n    private readonly ngZone = inject(NgZone);\n\n    private readonly platformId = inject(PLATFORM_ID);\n\n    /**\n     * Define a delay before the fallback is shown.\n     * This is useful to only show the fallback for those with slower connections.\n     * @default 0\n     */\n    @Input({ alias: 'rdxDelayMs', transform: numberAttribute }) delayMs: number = this.config.delayMs;\n\n    readonly visible = signal(false);\n\n    /**\n     * Determine the delay has elapsed, and we can show the fallback.\n     */\n    private delayElapsed = false;\n\n    private timeoutId: ReturnType<typeof setTimeout> | null = null;\n\n    ngOnInit(): void {\n        if (isPlatformBrowser(this.platformId)) {\n            this.ngZone.runOutsideAngular(() => {\n                this.timeoutId = globalThis.setTimeout(() => {\n                    this.ngZone.run(() => {\n                        this.delayElapsed = true;\n                        this.updateVisibility();\n                    });\n                }, this.delayMs);\n            });\n        }\n    }\n\n    ngOnDestroy(): void {\n        if (isPlatformBrowser(this.platformId) && this.timeoutId !== null) {\n            globalThis.clearTimeout(this.timeoutId);\n        }\n    }\n\n    private updateVisibility(): void {\n        this.visible.set(this.delayElapsed && this.avatar._state() !== 'loaded');\n    }\n}\n",
             "properties": [
                 {
                     "name": "delayMs",
@@ -210,7 +210,7 @@
                     "type": "number",
                     "optional": true,
                     "description": "",
-                    "line": 7
+                    "line": 17
                 }
             ],
             "indexSignatures": [],
@@ -244,12 +244,12 @@
         },
         {
             "name": "SeparatorProps",
-            "id": "interface-SeparatorProps-4949c922492b142101253d6d48cac42ca3a0b376ad10b5fc62486d2835799ec052bf8e91d3d2a6a0299a4b21e857e6b1eb34ce436753e284358d6e3349cd248b",
+            "id": "interface-SeparatorProps-b69bdacfd17a9613b054bf8ca89fdc318eb7cac4d0d01179b19d405de3894ec017075d1b44c9d9a19e23ca7070398a1ce34ec61a992e0b6e21349554d1300827",
             "file": "separator/src/separator.directive.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { booleanAttribute, Directive, Input } from '@angular/core';\n\nconst DEFAULT_ORIENTATION = 'horizontal';\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst ORIENTATIONS = ['horizontal', 'vertical'] as const;\n\nexport type Orientation = (typeof ORIENTATIONS)[number];\n\nexport interface SeparatorProps {\n    /**\n     * Either `vertical` or `horizontal`. Defaults to `horizontal`.\n     */\n    orientation?: Orientation;\n    /**\n     * Whether the component is purely decorative. When true, accessibility-related attributes\n     * are updated so that the rendered element is removed from the accessibility tree.\n     */\n    decorative?: boolean;\n}\n\n@Directive({\n    selector: 'div[rdxSeparatorRoot]',\n    standalone: true,\n    host: {\n        '[attr.role]': 'decorative ? \"none\" : \"separator\"',\n        // `aria-orientation` defaults to `horizontal` so we only need it if `orientation` is vertical\n        '[attr.aria-orientation]': '!decorative && orientation === \"vertical\" ? \"vertical\" : null',\n        '[attr.data-orientation]': 'orientation'\n    }\n})\nexport class RdxSeparatorRootDirective implements SeparatorProps {\n    @Input() orientation: Orientation = DEFAULT_ORIENTATION;\n\n    @Input({ transform: booleanAttribute }) decorative = false;\n}\n",
+            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, computed, Directive, input } from '@angular/core';\n\nconst DEFAULT_ORIENTATION = 'horizontal';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst ORIENTATIONS = ['horizontal', 'vertical'] as const;\n\nexport type Orientation = (typeof ORIENTATIONS)[number];\n\nexport interface SeparatorProps {\n    /**\n     * Either `vertical` or `horizontal`. Defaults to `horizontal`.\n     */\n    orientation?: Orientation;\n    /**\n     * Whether the component is purely decorative. When true, accessibility-related attributes\n     * are updated so that the rendered element is removed from the accessibility tree.\n     */\n    decorative?: boolean;\n}\n\n/**\n * Directive that adds accessible and configurable separator element to the DOM.\n * This can be either horizontal or vertical and optionally decorative (which removes\n * it from the accessibility tree).\n */\n@Directive({\n    selector: 'div[rdxSeparatorRoot]',\n    standalone: true,\n    host: {\n        '[attr.role]': 'computedRole()',\n        '[attr.aria-orientation]': 'computedAriaOrientation()',\n\n        '[attr.data-orientation]': 'orientation()'\n    }\n})\nexport class RdxSeparatorRootDirective {\n    /**\n     * Orientation of the separator, can be either 'horizontal' or 'vertical'.\n     * Defaults to 'horizontal'.\n     */\n    readonly orientation = input<Orientation>(DEFAULT_ORIENTATION);\n\n    /**\n     * If true, the separator will be considered decorative and removed from\n     * the accessibility tree. Defaults to false.\n     */\n    readonly decorative = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n    /**\n     * Computes the `role` attribute for the separator. If `decorative` is true,\n     * the role is set to \"none\", otherwise it is \"separator\".\n     */\n    protected readonly computedRole = computed(() => (this.decorative() ? 'none' : 'separator'));\n\n    /**\n     * Computes the `aria-orientation` attribute. It is set to \"vertical\" only if\n     * the separator is not decorative and the orientation is set to \"vertical\".\n     * For horizontal orientation, the attribute is omitted.\n     */\n    protected readonly computedAriaOrientation = computed(() =>\n        !this.decorative() && this.orientation() === 'vertical' ? 'vertical' : null\n    );\n}\n",
             "properties": [
                 {
                     "name": "decorative",
@@ -258,7 +258,7 @@
                     "type": "boolean",
                     "optional": true,
                     "description": "<p>Whether the component is purely decorative. When true, accessibility-related attributes\nare updated so that the rendered element is removed from the accessibility tree.</p>\n",
-                    "line": 18,
+                    "line": 20,
                     "rawdescription": "\n\nWhether the component is purely decorative. When true, accessibility-related attributes\nare updated so that the rendered element is removed from the accessibility tree.\n"
                 },
                 {
@@ -268,7 +268,7 @@
                     "type": "Orientation",
                     "optional": true,
                     "description": "<p>Either <code>vertical</code> or <code>horizontal</code>. Defaults to <code>horizontal</code>.</p>\n",
-                    "line": 13,
+                    "line": 15,
                     "rawdescription": "\n\nEither `vertical` or `horizontal`. Defaults to `horizontal`.\n"
                 }
             ],
@@ -279,12 +279,12 @@
         },
         {
             "name": "SwitchProps",
-            "id": "interface-SwitchProps-b38377551dbe8df1a02039592e5cef35095983dcd5cf8461966049b698303e9d4ded61b0f28af5c82665d0aff8fcc25fb00bfaedb3395ad35300c8a9a4cd7331",
+            "id": "interface-SwitchProps-a1d1ce9095ddd803dd1679e08e7914e7bbc821178d609e91909c39171ce2013fa88949495d3569fcd36dc50f9ffd58e50d69a30df9f1344c8d7f6610de2d389f",
             "file": "switch/src/switch-root.directive.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n    booleanAttribute,\n    computed,\n    Directive,\n    EventEmitter,\n    inject,\n    InjectionToken,\n    input,\n    InputSignalWithTransform,\n    model,\n    ModelSignal,\n    Output\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nexport const RdxSwitchToken = new InjectionToken<RdxSwitchRootDirective>('RdxSwitchToken');\n\nexport function injectSwitch(): RdxSwitchRootDirective {\n    return inject(RdxSwitchToken);\n}\n\nexport interface SwitchProps {\n    checked?: ModelSignal<boolean>;\n    defaultChecked?: boolean;\n    required?: InputSignalWithTransform<boolean, BooleanInput>;\n    onCheckedChange?: EventEmitter<boolean>;\n}\n\nlet idIterator = 0;\n\n@Directive({\n    selector: 'button[rdxSwitchRoot]',\n    exportAs: 'rdxSwitchRoot',\n    standalone: true,\n    providers: [\n        { provide: RdxSwitchToken, useExisting: RdxSwitchRootDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxSwitchRootDirective, multi: true }\n    ],\n    host: {\n        role: 'switch',\n        type: 'button',\n        '[id]': 'elementId()',\n        '[attr.aria-checked]': 'checked()',\n        '[attr.aria-required]': 'required',\n        '[attr.data-state]': 'checked() ? \"checked\" : \"unchecked\"',\n        '[attr.data-disabled]': 'disabledState() ? \"true\" : null',\n        '[attr.disabled]': 'disabledState() ? disabledState() : null',\n\n        '(focus)': '_onTouched?.()',\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxSwitchRootDirective implements SwitchProps, ControlValueAccessor {\n    readonly id = input<string>(`rdx-switch-${idIterator++}`);\n    protected readonly elementId = computed(() => (this.id() ? this.id() : null));\n\n    // When true, indicates that the user must check\n    // the switch before the owning form can be submitted.\n    readonly required = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    // The controlled state of the switch\n    readonly checked = model<boolean>(false);\n\n    // When true, prevents the user from interacting with the switch.\n    readonly disabled = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    /*\n     * @ignore\n     */\n    readonly disabledState = computed(() => this.disabled());\n\n    @Output() onCheckedChange = new EventEmitter<boolean>();\n\n    /**\n     * The method to be called in order to update ngModel.\n     */\n    _onChange?: (checked: boolean) => void;\n\n    /**\n     * onTouch function registered via registerOnTouch (ControlValueAccessor).\n     */\n    _onTouched?: () => void;\n\n    /**\n     * Registers a function to call when the checked state changes.\n     * @param fn Function to call on change.\n     */\n    registerOnChange(fn: (checked: boolean) => void): void {\n        this._onChange = fn;\n    }\n\n    /**\n     * Registers a function to call when the component is touched.\n     * @param fn Function to call on touch.\n     */\n    registerOnTouched(fn: () => void): void {\n        this._onTouched = fn;\n    }\n\n    /**\n     * Writes a new value to the model.\n     * @param checked The new checked value.\n     */\n    writeValue(checked: boolean): void {\n        this.checked.set(checked);\n    }\n\n    /**\n     * Toggles the checked state of the switch.\n     * If the switch is disabled, the function returns early.\n     */\n    protected toggle(): void {\n        if (this.disabledState()) {\n            return;\n        }\n\n        this.checked.set(!this.checked());\n        this._onChange?.(this.checked());\n\n        this.onCheckedChange.emit(this.checked());\n    }\n}\n",
+            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n    booleanAttribute,\n    computed,\n    Directive,\n    inject,\n    InjectionToken,\n    input,\n    InputSignalWithTransform,\n    model,\n    ModelSignal,\n    output,\n    OutputEmitterRef\n} from '@angular/core';\n\nexport const RdxSwitchToken = new InjectionToken<RdxSwitchRootDirective>('RdxSwitchToken');\n\nexport function injectSwitch(): RdxSwitchRootDirective {\n    return inject(RdxSwitchToken);\n}\n\nexport interface SwitchProps {\n    checked?: ModelSignal<boolean>;\n    defaultChecked?: boolean;\n    required?: InputSignalWithTransform<boolean, BooleanInput>;\n    onCheckedChange?: OutputEmitterRef<boolean>;\n}\n\nlet idIterator = 0;\n\n@Directive({\n    selector: 'button[rdxSwitchRoot]',\n    exportAs: 'rdxSwitchRoot',\n    standalone: true,\n    providers: [\n        { provide: RdxSwitchToken, useExisting: RdxSwitchRootDirective }],\n    host: {\n        role: 'switch',\n        type: 'button',\n        '[id]': 'elementId()',\n        '[attr.aria-checked]': 'checked()',\n        '[attr.aria-required]': 'required',\n        '[attr.data-state]': 'checked() ? \"checked\" : \"unchecked\"',\n        '[attr.data-disabled]': 'disabledState() ? \"true\" : null',\n        '[attr.disabled]': 'disabledState() ? disabledState() : null',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxSwitchRootDirective implements SwitchProps {\n    readonly id = input<string>(`rdx-switch-${idIterator++}`);\n    protected readonly elementId = computed(() => (this.id() ? this.id() : null));\n\n    /**\n     * When true, indicates that the user must check the switch before the owning form can be submitted.\n     */\n    readonly required = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    /**\n     * The controlled state of the switch. Must be used in conjunction with onCheckedChange.\n     */\n    readonly checked = model<boolean>(false);\n\n    /**\n     * When true, prevents the user from interacting with the switch.\n     */\n    readonly disabled = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    /*\n     * @ignore\n     */\n    readonly disabledState = computed(() => this.disabled());\n\n    /**\n     * Event handler called when the state of the switch changes.\n     */\n    readonly onCheckedChange = output<boolean>();\n\n    /**\n     * Toggles the checked state of the switch.\n     * If the switch is disabled, the function returns early.\n     */\n    protected toggle(): void {\n        if (this.disabledState()) {\n            return;\n        }\n\n        this.checked.set(!this.checked());\n\n        this.onCheckedChange.emit(this.checked());\n    }\n}\n",
             "properties": [
                 {
                     "name": "checked",
@@ -293,7 +293,7 @@
                     "type": "ModelSignal<boolean>",
                     "optional": true,
                     "description": "",
-                    "line": 24
+                    "line": 23
                 },
                 {
                     "name": "defaultChecked",
@@ -302,16 +302,16 @@
                     "type": "boolean",
                     "optional": true,
                     "description": "",
-                    "line": 25
+                    "line": 24
                 },
                 {
                     "name": "onCheckedChange",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "type": "EventEmitter<boolean>",
+                    "type": "OutputEmitterRef<boolean>",
                     "optional": true,
                     "description": "",
-                    "line": 27
+                    "line": 26
                 },
                 {
                     "name": "required",
@@ -320,7 +320,7 @@
                     "type": "InputSignalWithTransform<boolean | BooleanInput>",
                     "optional": true,
                     "description": "",
-                    "line": 26
+                    "line": 25
                 }
             ],
             "indexSignatures": [],
@@ -493,12 +493,12 @@
         },
         {
             "name": "ToggleProps",
-            "id": "interface-ToggleProps-94be1eb58011efa799af90258505424aecc8486ac9fba7c7b9b37fe9fcc03ea74abc8b303a3dd63c6070953df747036cd920029be0c77da56a93076514dcc4c6",
+            "id": "interface-ToggleProps-0bcbd664ea72aa02f90b3331238e8a118a14b8566bd36067013921c606f502814694751ab854825b1057106f71febb584ae15da9ebef63dc60001540db7e5906",
             "file": "toggle/src/toggle.directive.ts",
             "deprecated": false,
             "deprecationMessage": "",
             "type": "interface",
-            "sourceCode": "import { Directive, EventEmitter, input, model, Output } from '@angular/core';\n\nexport interface ToggleProps {\n    /**\n     * The controlled state of the toggle.\n     */\n    pressed?: boolean;\n    /**\n     * The state of the toggle when initially rendered. Use `defaultPressed`\n     * if you do not need to control the state of the toggle.\n     * @defaultValue false\n     */\n    defaultPressed?: boolean;\n    /**\n     * The callback that fires when the state of the toggle changes.\n     */\n    onPressedChange?: EventEmitter<boolean>;\n}\n\n@Directive({\n    selector: 'button[rdxToggle]',\n    exportAs: 'rdxToggle',\n    standalone: true,\n    host: {\n        type: 'button',\n        '[attr.aria-pressed]': 'pressed()',\n        '[attr.data-state]': 'pressed() ? \"on\" : \"off\"',\n        '[attr.data-disabled]': 'disabled()',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxToggleDirective {\n    readonly defaultPressed = input<boolean>(false);\n    readonly pressed = model<boolean>(this.defaultPressed());\n    readonly disabled = input<boolean>(false);\n\n    /**\n     * Event emitted when the toggle is pressed.\n     */\n    @Output() readonly onPressedChange = new EventEmitter<boolean>();\n\n    protected toggle(): void {\n        if (!this.disabled()) {\n            this.pressed.set(!this.pressed());\n            this.onPressedChange.emit(this.pressed());\n        }\n    }\n}\n",
+            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, input, model, output, OutputEmitterRef } from '@angular/core';\n\nexport interface ToggleProps {\n    /**\n     * The controlled state of the toggle.\n     */\n    pressed?: boolean;\n\n    /**\n     * The state of the toggle when initially rendered. Use `defaultPressed`\n     * if you do not need to control the state of the toggle.\n     * @defaultValue false\n     */\n    defaultPressed?: boolean;\n\n    /**\n     * The callback that fires when the state of the toggle changes.\n     */\n    onPressedChange?: OutputEmitterRef<boolean>;\n\n    /**\n     * Whether the toggle is disabled.\n     * @defaultValue false\n     */\n    disabled?: boolean;\n}\n\n@Directive({\n    selector: '[rdxToggle]',\n    exportAs: 'rdxToggle',\n    standalone: true,\n    host: {\n        type: 'button',\n        '[attr.aria-pressed]': 'pressed()',\n        '[attr.data-state]': 'pressed() ? \"on\" : \"off\"',\n        '[attr.data-disabled]': 'disabled()',\n        '[disabled]': 'disabled()',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxToggleDirective {\n    /**\n     * The pressed state of the toggle when it is initially rendered.\n     * Use when you do not need to control its pressed state.\n     */\n    readonly defaultPressed = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n    /**\n     * The controlled pressed state of the toggle.\n     * Must be used in conjunction with `onPressedChange`.\n     */\n    readonly pressed = model<boolean>(this.defaultPressed());\n\n    /**\n     * When true, prevents the user from interacting with the toggle.\n     */\n    readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n    /**\n     * Event handler called when the pressed state of the toggle changes.\n     */\n    readonly onPressedChange = output<boolean>();\n\n    protected toggle(): void {\n        if (!this.disabled()) {\n            this.pressed.set(!this.pressed());\n            this.onPressedChange.emit(this.pressed());\n        }\n    }\n}\n",
             "properties": [
                 {
                     "name": "defaultPressed",
@@ -507,19 +507,49 @@
                     "type": "boolean",
                     "optional": true,
                     "description": "<p>The state of the toggle when initially rendered. Use <code>defaultPressed</code>\nif you do not need to control the state of the toggle.</p>\n",
-                    "line": 13,
+                    "line": 15,
                     "rawdescription": "\n\nThe state of the toggle when initially rendered. Use `defaultPressed`\nif you do not need to control the state of the toggle.\n",
                     "jsdoctags": [
                         {
-                            "pos": 347,
-                            "end": 372,
+                            "pos": 424,
+                            "end": 449,
+                            "flags": 16777216,
+                            "modifierFlagsCache": 0,
+                            "transformFlags": 0,
+                            "kind": 334,
+                            "tagName": {
+                                "pos": 425,
+                                "end": 437,
+                                "flags": 16777216,
+                                "modifierFlagsCache": 0,
+                                "transformFlags": 0,
+                                "kind": 80,
+                                "escapedText": "defaultValue"
+                            },
+                            "comment": "<p>false</p>\n"
+                        }
+                    ]
+                },
+                {
+                    "name": "disabled",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "boolean",
+                    "optional": true,
+                    "description": "<p>Whether the toggle is disabled.</p>\n",
+                    "line": 26,
+                    "rawdescription": "\n\nWhether the toggle is disabled.\n",
+                    "jsdoctags": [
+                        {
+                            "pos": 672,
+                            "end": 697,
                             "flags": 16777216,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 348,
-                                "end": 360,
+                                "pos": 673,
+                                "end": 685,
                                 "flags": 16777216,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -534,10 +564,10 @@
                     "name": "onPressedChange",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "type": "EventEmitter<boolean>",
+                    "type": "OutputEmitterRef<boolean>",
                     "optional": true,
                     "description": "<p>The callback that fires when the state of the toggle changes.</p>\n",
-                    "line": 17,
+                    "line": 20,
                     "rawdescription": "\n\nThe callback that fires when the state of the toggle changes.\n"
                 },
                 {
@@ -547,7 +577,7 @@
                     "type": "boolean",
                     "optional": true,
                     "description": "<p>The controlled state of the toggle.</p>\n",
-                    "line": 7,
+                    "line": 8,
                     "rawdescription": "\n\nThe controlled state of the toggle.\n"
                 }
             ],
@@ -559,8 +589,8 @@
     ],
     "injectables": [
         {
-            "name": "AlertDialogService",
-            "id": "injectable-AlertDialogService-8d428f987df697adb3ff9b46401d634adbe4fbab8d25020545ec97ce84f75c2f3bb2d4d9f85b618d8eeaed93609fbf75d33baab663fd5086249e232966e5e79d",
+            "name": "RdxAlertDialogService",
+            "id": "injectable-RdxAlertDialogService-c42754b80223a5530d730417173e6eb90164a45164d767268b011c59e9012ff88d313a8ba20407a578b1a07d48bc540233a05a6f1c033230e0cf1deeda736aee",
             "file": "alert-dialog/src/alert-dialog.service.ts",
             "properties": [],
             "methods": [
@@ -632,7 +662,7 @@
             "deprecationMessage": "",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { Overlay, OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport { Injectable, TemplateRef, ViewContainerRef } from '@angular/core';\n\n@Injectable({\n    providedIn: 'root'\n})\nexport class AlertDialogService {\n    private overlayRef: OverlayRef | null | undefined;\n    private dialogContent:\n        | {\n              viewContainerRef: ViewContainerRef;\n              template: TemplateRef<any>;\n          }\n        | undefined;\n\n    constructor(private overlay: Overlay) {}\n\n    setDialogContent(viewContainerRef: ViewContainerRef, template: TemplateRef<any>) {\n        this.dialogContent = { viewContainerRef, template };\n    }\n\n    open() {\n        if (!this.dialogContent) {\n            throw new Error('Dialog content is not set');\n        }\n\n        this.overlayRef = this.overlay.create({\n            hasBackdrop: true,\n            backdropClass: 'cdk-overlay-dark-backdrop',\n            positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically()\n        });\n\n        const templatePortal = new TemplatePortal(this.dialogContent.template, this.dialogContent.viewContainerRef);\n        this.overlayRef.attach(templatePortal);\n\n        this.overlayRef.keydownEvents().subscribe((event) => {\n            if (event.key === 'Escape' || event.code === 'Escape') {\n                this.close();\n            }\n        });\n        this.overlayRef.backdropClick().subscribe(() => this.close());\n    }\n\n    close() {\n        if (this.overlayRef) {\n            this.overlayRef.dispose();\n            this.overlayRef = null;\n        }\n    }\n}\n",
+            "sourceCode": "import { Overlay, OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport { Injectable, TemplateRef, ViewContainerRef } from '@angular/core';\n\n@Injectable({\n    providedIn: 'root'\n})\nexport class RdxAlertDialogService {\n    private overlayRef: OverlayRef | null | undefined;\n    private dialogContent:\n        | {\n              viewContainerRef: ViewContainerRef;\n              template: TemplateRef<any>;\n          }\n        | undefined;\n\n    constructor(private overlay: Overlay) {}\n\n    setDialogContent(viewContainerRef: ViewContainerRef, template: TemplateRef<any>) {\n        this.dialogContent = { viewContainerRef, template };\n    }\n\n    open() {\n        if (!this.dialogContent) {\n            throw new Error('Dialog content is not set');\n        }\n\n        this.overlayRef = this.overlay.create({\n            hasBackdrop: true,\n            backdropClass: 'cdk-overlay-dark-backdrop',\n            positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically()\n        });\n\n        const templatePortal = new TemplatePortal(this.dialogContent.template, this.dialogContent.viewContainerRef);\n        this.overlayRef.attach(templatePortal);\n\n        this.overlayRef.keydownEvents().subscribe((event) => {\n            if (event.key === 'Escape' || event.code === 'Escape') {\n                this.close();\n            }\n        });\n        this.overlayRef.backdropClick().subscribe(() => this.close());\n    }\n\n    close() {\n        if (this.overlayRef) {\n            this.overlayRef.dispose();\n            this.overlayRef = null;\n        }\n    }\n}\n",
             "constructorObj": {
                 "name": "constructor",
                 "description": "",
@@ -1103,226 +1133,6 @@
         }
     ],
     "directives": [
-        {
-            "name": "AlertDialogCancelDirective",
-            "id": "directive-AlertDialogCancelDirective-ec486d3f2722528a718f88338533047b00f831f74a494264f69d6c4a190cde897fe0fc0316dfc2379fbda1fa9c2b4c3c47d8445604113be819acd9d8aa46aad0",
-            "file": "alert-dialog/src/alert-dialog-cancel.directive.ts",
-            "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { Directive, inject } from '@angular/core';\nimport { AlertDialogService } from './alert-dialog.service';\n\n@Directive({\n    selector: '[rdxAlertDialogCancel]',\n    standalone: true,\n    host: {\n        '(click)': 'onClick()'\n    }\n})\nexport class AlertDialogCancelDirective {\n    private readonly alertDialogService = inject(AlertDialogService);\n\n    onClick() {\n        this.alertDialogService.close();\n    }\n}\n",
-            "selector": "[rdxAlertDialogCancel]",
-            "providers": [],
-            "hostDirectives": [],
-            "standalone": true,
-            "inputsClass": [],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [
-                {
-                    "name": "onClick",
-                    "args": [],
-                    "optional": false,
-                    "returnType": "void",
-                    "typeParameters": [],
-                    "line": 14,
-                    "deprecated": false,
-                    "deprecationMessage": ""
-                }
-            ],
-            "extends": []
-        },
-        {
-            "name": "AlertDialogContentDirective",
-            "id": "directive-AlertDialogContentDirective-fc5389414aee2ba13bf816c13ff24988883abbde938768bd1416238547bb3f21f1eec0996df1099cb0a248c9cbcd801e7e4586643221faa866010c5bc2981cc5",
-            "file": "alert-dialog/src/alert-dialog-content.directive.ts",
-            "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { CdkTrapFocus } from '@angular/cdk/a11y';\nimport { Directive, ElementRef, inject, Input, Renderer2 } from '@angular/core';\n\n@Directive({\n    selector: '[rdxAlertDialogContent]',\n    hostDirectives: [\n        {\n            directive: CdkTrapFocus\n        }\n    ],\n    standalone: true,\n    host: {\n        '[attr.data-state]': 'open',\n        '[attr.cdkTrapFocusAutoCapture]': 'true'\n    }\n})\nexport class AlertDialogContentDirective {\n    private readonly renderer = inject(Renderer2);\n    private readonly elementRef = inject(ElementRef);\n\n    @Input() set maxWidth(value: string) {\n        this.renderer.setStyle(this.elementRef.nativeElement, 'maxWidth', value);\n    }\n}\n",
-            "selector": "[rdxAlertDialogContent]",
-            "providers": [],
-            "hostDirectives": [
-                {
-                    "name": "CdkTrapFocus",
-                    "inputs": [],
-                    "outputs": []
-                }
-            ],
-            "standalone": true,
-            "inputsClass": [
-                {
-                    "name": "maxWidth",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "line": 21,
-                    "type": "string",
-                    "decorators": []
-                }
-            ],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [],
-            "extends": [],
-            "accessors": {
-                "maxWidth": {
-                    "name": "maxWidth",
-                    "setSignature": {
-                        "name": "maxWidth",
-                        "type": "void",
-                        "deprecated": false,
-                        "deprecationMessage": "",
-                        "args": [
-                            {
-                                "name": "value",
-                                "type": "string",
-                                "deprecated": false,
-                                "deprecationMessage": ""
-                            }
-                        ],
-                        "returnType": "void",
-                        "line": 21,
-                        "jsdoctags": [
-                            {
-                                "name": "value",
-                                "type": "string",
-                                "deprecated": false,
-                                "deprecationMessage": "",
-                                "tagName": {
-                                    "text": "param"
-                                }
-                            }
-                        ]
-                    }
-                }
-            }
-        },
-        {
-            "name": "AlertDialogRootDirective",
-            "id": "directive-AlertDialogRootDirective-6d55043842c1b716957eb02fa934bad8a762c5a8f858e51cd0713938af47093c4103291bdd6195269978940b957c77900a759a1a7eacd12e33f954f59518f57e",
-            "file": "alert-dialog/src/alert-dialog-root.directive.ts",
-            "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { Directive, inject, Input, TemplateRef, ViewContainerRef } from '@angular/core';\nimport { AlertDialogService } from './alert-dialog.service';\n\n@Directive({\n    selector: '[rdxAlertDialogRoot]',\n    standalone: true\n})\nexport class AlertDialogRootDirective {\n    private readonly viewContainerRef = inject(ViewContainerRef);\n    private readonly alertDialogService = inject(AlertDialogService);\n\n    @Input() set content(template: TemplateRef<any>) {\n        this.alertDialogService.setDialogContent(this.viewContainerRef, template);\n    }\n}\n",
-            "selector": "[rdxAlertDialogRoot]",
-            "providers": [],
-            "hostDirectives": [],
-            "standalone": true,
-            "inputsClass": [
-                {
-                    "name": "content",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "line": 12,
-                    "type": "TemplateRef<any>",
-                    "decorators": []
-                }
-            ],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [],
-            "extends": [],
-            "accessors": {
-                "content": {
-                    "name": "content",
-                    "setSignature": {
-                        "name": "content",
-                        "type": "void",
-                        "deprecated": false,
-                        "deprecationMessage": "",
-                        "args": [
-                            {
-                                "name": "template",
-                                "type": "TemplateRef<any>",
-                                "deprecated": false,
-                                "deprecationMessage": ""
-                            }
-                        ],
-                        "returnType": "void",
-                        "line": 12,
-                        "jsdoctags": [
-                            {
-                                "name": "template",
-                                "type": "TemplateRef<any>",
-                                "deprecated": false,
-                                "deprecationMessage": "",
-                                "tagName": {
-                                    "text": "param"
-                                }
-                            }
-                        ]
-                    }
-                }
-            }
-        },
-        {
-            "name": "AlertDialogTitleDirective",
-            "id": "directive-AlertDialogTitleDirective-f00d6c32a66df82c82b0e83689b047ca8b2a3e61239b43ead945e45ccfb480dba01e597dcfe1c7cf5ab4bf44ffd1178cc0c4f8514924f04d3326dedfa8790dbd",
-            "file": "alert-dialog/src/alert-dialog-title.directive.ts",
-            "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { Directive } from '@angular/core';\n\n@Directive({\n    selector: '[rdxAlertDialogTitle]',\n    standalone: true\n})\nexport class AlertDialogTitleDirective {}\n",
-            "selector": "[rdxAlertDialogTitle]",
-            "providers": [],
-            "hostDirectives": [],
-            "standalone": true,
-            "inputsClass": [],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [],
-            "extends": []
-        },
-        {
-            "name": "AlertDialogTriggerDirective",
-            "id": "directive-AlertDialogTriggerDirective-dd69bd1802ec0fddc8a5056a6ad30b0b655ef4f889001904d4dad8fdd78a9c4a067ade3b6466973c049824d81b5610184f01409bcb6d4c71c3ea70c781a1ffe9",
-            "file": "alert-dialog/src/alert-dialog-trigger.directive.ts",
-            "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { Directive, inject } from '@angular/core';\nimport { AlertDialogService } from './alert-dialog.service';\n\n@Directive({\n    selector: '[rdxAlertDialogTrigger]',\n    standalone: true,\n    host: {\n        '(click)': 'handleClick()'\n    }\n})\nexport class AlertDialogTriggerDirective {\n    private readonly alertDialogService = inject(AlertDialogService);\n\n    handleClick() {\n        this.alertDialogService.open();\n    }\n}\n",
-            "selector": "[rdxAlertDialogTrigger]",
-            "providers": [],
-            "hostDirectives": [],
-            "standalone": true,
-            "inputsClass": [],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [
-                {
-                    "name": "handleClick",
-                    "args": [],
-                    "optional": false,
-                    "returnType": "void",
-                    "typeParameters": [],
-                    "line": 14,
-                    "deprecated": false,
-                    "deprecationMessage": ""
-                }
-            ],
-            "extends": []
-        },
         {
             "name": "OnMountDirective",
             "id": "directive-OnMountDirective-f1da695b0136450bf11acf48f95325bc4b4fcbd954ee2e2f98ecf0edecfc8aad023d6ca9d3f1c28ca07481a5526c6276e09a761bc8f572e200a4d94da96f8b33",
@@ -1806,12 +1616,12 @@
         },
         {
             "name": "RdxAccordionRootDirective",
-            "id": "directive-RdxAccordionRootDirective-10d8a19eb9dbac7fa16983682fe623646459db26dae1a3d1f305a74e16df863887ca2542a15fcd0cc06a6e619116ea449e759774d02f5243fa12d3b1db290a70",
+            "id": "directive-RdxAccordionRootDirective-f822c50ab367745ad4ae025b12316e626316425ea7d640415a16f915b90f04f64342b55cdda3c06cfeba6beed6a2238f674bc766003e254db3fb55588e3e4871",
             "file": "accordion/src/accordion-root.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { FocusKeyManager } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport { UniqueSelectionDispatcher } from '@angular/cdk/collections';\nimport { ENTER, SPACE } from '@angular/cdk/keycodes';\nimport {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    forwardRef,\n    inject,\n    InjectionToken,\n    Input,\n    OnDestroy,\n    Output,\n    QueryList\n} from '@angular/core';\nimport { merge, Subject, Subscription } from 'rxjs';\nimport { RdxAccordionItemDirective } from './accordion-item.directive';\n\nexport type RdxAccordionType = 'single' | 'multiple';\nexport type RdxAccordionOrientation = 'horizontal' | 'vertical';\n\nexport const RdxAccordionRootToken = new InjectionToken<RdxAccordionRootDirective>('RdxAccordionRootDirective');\n\nlet nextId = 0;\n\n@Directive({\n    selector: '[rdxAccordionRoot]',\n    standalone: true,\n    providers: [\n        { provide: RdxAccordionRootToken, useExisting: RdxAccordionRootDirective },\n        { provide: UniqueSelectionDispatcher, useClass: UniqueSelectionDispatcher }\n    ],\n    host: {\n        '[attr.data-orientation]': 'orientation',\n        '(keydown)': 'handleKeydown($event)'\n    }\n})\nexport class RdxAccordionRootDirective implements AfterContentInit, OnDestroy {\n    /**\n     * @ignore\n     */\n    protected readonly selectionDispatcher = inject(UniqueSelectionDispatcher);\n    /**\n     * @ignore\n     */\n    protected readonly dir = inject(Directionality, { optional: true });\n\n    /**\n     * @ignore\n     */\n    protected keyManager: FocusKeyManager<RdxAccordionItemDirective>;\n\n    /**\n     * @ignore\n     */\n    readonly id: string = `rdx-accordion-${nextId++}`;\n\n    /**\n     * @ignore\n     */\n    readonly openCloseAllActions = new Subject<boolean>();\n\n    get isMultiple(): boolean {\n        return this.type === 'multiple';\n    }\n\n    /** Whether the Accordion is disabled. */\n    @Input({ transform: booleanAttribute }) disabled: boolean;\n\n    /**\n     * The orientation of the accordion.\n     */\n    @Input() orientation: RdxAccordionOrientation = 'vertical';\n    /**\n     * @private\n     * @ignore\n     */\n    @ContentChildren(forwardRef(() => RdxAccordionItemDirective), { descendants: true })\n    items: QueryList<RdxAccordionItemDirective>;\n\n    /**\n     * The value of the item to expand when initially rendered and type is \"single\". Use when you do not need to control the state of the items.\n     */\n    @Input()\n    set defaultValue(value: string[] | string) {\n        if (value !== this._defaultValue) {\n            this._defaultValue = Array.isArray(value) ? value : [value];\n        }\n    }\n\n    get defaultValue(): string[] | string {\n        return this.isMultiple ? this._defaultValue : this._defaultValue[0];\n    }\n\n    /**\n     * Determines whether one or multiple items can be opened at the same time.\n     */\n    @Input() type: RdxAccordionType = 'single';\n    /**\n     * @ignore\n     */\n    @Input() collapsible = true;\n    /**\n     * The controlled value of the item to expand\n     */\n    @Input()\n    set value(value: string[] | string) {\n        if (value !== this._value) {\n            this._value = Array.isArray(value) ? value : [value];\n\n            this.selectionDispatcher.notify(this.value as unknown as string, this.id);\n        }\n    }\n\n    get value(): string[] | string {\n        if (this._value === undefined) {\n            return this.defaultValue;\n        }\n\n        return this.isMultiple ? this._value : this._value[0];\n    }\n\n    @Output() readonly onValueChange: EventEmitter<void> = new EventEmitter<void>();\n\n    private _value?: string[];\n    private _defaultValue: string[] | string = [];\n\n    private onValueChangeSubscription: Subscription;\n\n    /**\n     * @ignore\n     */\n    ngAfterContentInit(): void {\n        this.selectionDispatcher.notify((this._value ?? this._defaultValue) as unknown as string, this.id);\n\n        this.keyManager = new FocusKeyManager(this.items).withHomeAndEnd();\n\n        if (this.orientation === 'horizontal') {\n            this.keyManager.withHorizontalOrientation(this.dir?.value || 'ltr');\n        } else {\n            this.keyManager.withVerticalOrientation();\n        }\n\n        this.onValueChangeSubscription = merge(...this.items.map((item) => item.expandedChange)).subscribe(() =>\n            this.onValueChange.emit()\n        );\n    }\n\n    /**\n     * @ignore\n     */\n    ngOnDestroy() {\n        this.openCloseAllActions.complete();\n        this.onValueChangeSubscription.unsubscribe();\n    }\n\n    /**\n     * @ignore\n     */\n    handleKeydown(event: KeyboardEvent) {\n        if (!this.keyManager.activeItem) {\n            this.keyManager.setFirstItemActive();\n        }\n\n        const activeItem = this.keyManager.activeItem;\n\n        if (\n            (event.keyCode === ENTER || event.keyCode === SPACE) &&\n            !this.keyManager.isTyping() &&\n            activeItem &&\n            !activeItem.disabled\n        ) {\n            event.preventDefault();\n            activeItem.toggle();\n        } else {\n            this.keyManager.onKeydown(event);\n        }\n    }\n\n    /** Opens all enabled accordion items in an accordion where multi is enabled.\n     * @ignore\n     */\n    openAll(): void {\n        if (this.isMultiple) {\n            this.openCloseAllActions.next(true);\n        }\n    }\n\n    /** Closes all enabled accordion items.\n     * @ignore\n     */\n    closeAll(): void {\n        this.openCloseAllActions.next(false);\n    }\n\n    /**\n     * @ignore\n     */\n    setActiveItem(item: RdxAccordionItemDirective) {\n        this.keyManager.setActiveItem(item);\n    }\n}\n",
+            "sourceCode": "import { FocusKeyManager } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport { UniqueSelectionDispatcher } from '@angular/cdk/collections';\nimport { ENTER, SPACE, TAB } from '@angular/cdk/keycodes';\nimport {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    forwardRef,\n    inject,\n    InjectionToken,\n    Input,\n    OnDestroy,\n    Output,\n    QueryList\n} from '@angular/core';\nimport { merge, Subject, Subscription } from 'rxjs';\nimport { RdxAccordionItemDirective } from './accordion-item.directive';\n\nexport type RdxAccordionType = 'single' | 'multiple';\nexport type RdxAccordionOrientation = 'horizontal' | 'vertical';\n\nexport const RdxAccordionRootToken = new InjectionToken<RdxAccordionRootDirective>('RdxAccordionRootDirective');\n\nlet nextId = 0;\n\n@Directive({\n    selector: '[rdxAccordionRoot]',\n    standalone: true,\n    providers: [\n        { provide: RdxAccordionRootToken, useExisting: RdxAccordionRootDirective },\n        { provide: UniqueSelectionDispatcher, useClass: UniqueSelectionDispatcher }\n    ],\n    host: {\n        '[attr.data-orientation]': 'orientation',\n        '(keydown)': 'handleKeydown($event)'\n    }\n})\nexport class RdxAccordionRootDirective implements AfterContentInit, OnDestroy {\n    /**\n     * @ignore\n     */\n    protected readonly selectionDispatcher = inject(UniqueSelectionDispatcher);\n    /**\n     * @ignore\n     */\n    protected readonly dir = inject(Directionality, { optional: true });\n\n    /**\n     * @ignore\n     */\n    protected keyManager: FocusKeyManager<RdxAccordionItemDirective>;\n\n    /**\n     * @ignore\n     */\n    readonly id: string = `rdx-accordion-${nextId++}`;\n\n    /**\n     * @ignore\n     */\n    readonly openCloseAllActions = new Subject<boolean>();\n\n    get isMultiple(): boolean {\n        return this.type === 'multiple';\n    }\n\n    /** Whether the Accordion is disabled. */\n    @Input({ transform: booleanAttribute }) disabled: boolean;\n\n    /**\n     * The orientation of the accordion.\n     */\n    @Input() orientation: RdxAccordionOrientation = 'vertical';\n    /**\n     * @private\n     * @ignore\n     */\n    @ContentChildren(forwardRef(() => RdxAccordionItemDirective), { descendants: true })\n    items: QueryList<RdxAccordionItemDirective>;\n\n    /**\n     * The value of the item to expand when initially rendered and type is \"single\". Use when you do not need to control the state of the items.\n     */\n    @Input()\n    set defaultValue(value: string[] | string) {\n        if (value !== this._defaultValue) {\n            this._defaultValue = Array.isArray(value) ? value : [value];\n        }\n    }\n\n    get defaultValue(): string[] | string {\n        return this.isMultiple ? this._defaultValue : this._defaultValue[0];\n    }\n\n    /**\n     * Determines whether one or multiple items can be opened at the same time.\n     */\n    @Input() type: RdxAccordionType = 'single';\n    /**\n     * @ignore\n     */\n    @Input() collapsible = true;\n    /**\n     * The controlled value of the item to expand\n     */\n    @Input()\n    set value(value: string[] | string) {\n        if (value !== this._value) {\n            this._value = Array.isArray(value) ? value : [value];\n\n            this.selectionDispatcher.notify(this.value as unknown as string, this.id);\n        }\n    }\n\n    get value(): string[] | string {\n        if (this._value === undefined) {\n            return this.defaultValue;\n        }\n\n        return this.isMultiple ? this._value : this._value[0];\n    }\n\n    @Output() readonly onValueChange: EventEmitter<void> = new EventEmitter<void>();\n\n    private _value?: string[];\n    private _defaultValue: string[] | string = [];\n\n    private onValueChangeSubscription: Subscription;\n\n    /**\n     * @ignore\n     */\n    ngAfterContentInit(): void {\n        this.selectionDispatcher.notify((this._value ?? this._defaultValue) as unknown as string, this.id);\n\n        this.keyManager = new FocusKeyManager(this.items).withHomeAndEnd();\n\n        if (this.orientation === 'horizontal') {\n            this.keyManager.withHorizontalOrientation(this.dir?.value || 'ltr');\n        } else {\n            this.keyManager.withVerticalOrientation();\n        }\n\n        this.onValueChangeSubscription = merge(...this.items.map((item) => item.expandedChange)).subscribe(() =>\n            this.onValueChange.emit()\n        );\n    }\n\n    /**\n     * @ignore\n     */\n    ngOnDestroy() {\n        this.openCloseAllActions.complete();\n        this.onValueChangeSubscription.unsubscribe();\n    }\n\n    /**\n     * @ignore\n     */\n    handleKeydown(event: KeyboardEvent) {\n        if (!this.keyManager.activeItem) {\n            this.keyManager.setFirstItemActive();\n        }\n\n        const activeItem = this.keyManager.activeItem;\n\n        if (\n            (event.keyCode === ENTER || event.keyCode === SPACE) &&\n            !this.keyManager.isTyping() &&\n            activeItem &&\n            !activeItem.disabled\n        ) {\n            event.preventDefault();\n            activeItem.toggle();\n        } else if (event.keyCode === TAB && event.shiftKey) {\n            if (this.keyManager.activeItemIndex === 0) return;\n\n            this.keyManager.setPreviousItemActive();\n            event.preventDefault();\n        } else if (event.keyCode === TAB) {\n            if (this.keyManager.activeItemIndex === this.items.length - 1) return;\n\n            this.keyManager.setNextItemActive();\n            event.preventDefault();\n        } else {\n            this.keyManager.onKeydown(event);\n        }\n    }\n\n    /** Opens all enabled accordion items in an accordion where multi is enabled.\n     * @ignore\n     */\n    openAll(): void {\n        if (this.isMultiple) {\n            this.openCloseAllActions.next(true);\n        }\n    }\n\n    /** Closes all enabled accordion items.\n     * @ignore\n     */\n    closeAll(): void {\n        this.openCloseAllActions.next(false);\n    }\n\n    /**\n     * @ignore\n     */\n    setActiveItem(item: RdxAccordionItemDirective) {\n        this.keyManager.setActiveItem(item);\n    }\n}\n",
             "selector": "[rdxAccordionRoot]",
             "providers": [
                 {
@@ -2077,19 +1887,295 @@
             "extends": []
         },
         {
-            "name": "RdxAutoFocusDirective",
-            "id": "directive-RdxAutoFocusDirective-36fdd916db27dba985b1c2f77905595edbce993570293a337d7b80f0efa4ef852996b041e5caad932322228c1d26e64ac067d0aac41a4e3e390475bed79dfb5d",
-            "file": "core/src/auto-focus.directive.ts",
+            "name": "RdxAlertDialogCancelDirective",
+            "id": "directive-RdxAlertDialogCancelDirective-d80bbcc24200cb95f19a5dd6a1f1e57d6c949b31566fc80c29d4b81d4558efdd1c5b7e257efa93d549ad088e73be6fd00e831786aebf3c43c6e5bffcd69fe53a",
+            "file": "alert-dialog/src/alert-dialog-cancel.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { booleanAttribute, Directive, ElementRef, inject, Input, NgZone } from '@angular/core';\n\n/*\n * <div [rdxAutoFocus]=\"true\"></div>\n */\n\n@Directive({\n    selector: '[rdxAutoFocus]',\n    standalone: true\n})\nexport class RdxAutoFocusDirective {\n    #elementRef = inject(ElementRef);\n    #ngZone = inject(NgZone);\n\n    private _autoSelect = false;\n\n    /**\n     * @default false\n     */\n    @Input({ alias: 'rdxAutoFocus', transform: booleanAttribute })\n    set autoFocus(value: boolean) {\n        if (value) {\n            // Note: Running this outside Angular's zone because `element.focus()` does not trigger change detection.\n            this.#ngZone.runOutsideAngular(() =>\n                // Note: `element.focus()` causes re-layout which might lead to frame drops on slower devices.\n                // https://gist.github.com/paulirish/5d52fb081b3570c81e3a#setting-focus\n                // `setTimeout` is a macrotask executed within the current rendering frame.\n                // Animation tasks are executed in the next rendering frame.\n                reqAnimationFrame(() => {\n                    this.#elementRef.nativeElement.focus();\n                    if (this._autoSelect && this.#elementRef.nativeElement.select) {\n                        this.#elementRef.nativeElement.select();\n                    }\n                })\n            );\n        }\n    }\n\n    // Setter for autoSelect attribute to enable text selection when autoFocus is true.\n    @Input({ transform: booleanAttribute })\n    set autoSelect(value: boolean) {\n        this._autoSelect = value;\n    }\n}\n\nconst availablePrefixes = ['moz', 'ms', 'webkit'];\n\nfunction requestAnimationFramePolyfill(): typeof requestAnimationFrame {\n    let lastTime = 0;\n\n    return function (callback: FrameRequestCallback): number {\n        const currTime = new Date().getTime();\n        const timeToCall = Math.max(0, 16 - (currTime - lastTime));\n\n        const id = setTimeout(() => {\n            callback(currTime + timeToCall);\n        }, timeToCall) as any;\n\n        lastTime = currTime + timeToCall;\n\n        return id;\n    };\n}\n\n// Function to get the appropriate requestAnimationFrame method with fallback to polyfill.\nfunction getRequestAnimationFrame(): typeof requestAnimationFrame {\n    if (typeof window === 'undefined') {\n        return () => 0;\n    }\n    if (window.requestAnimationFrame) {\n        // https://github.com/vuejs/vue/issues/4465\n        return window.requestAnimationFrame.bind(window);\n    }\n\n    const prefix = availablePrefixes.filter((key) => `${key}RequestAnimationFrame` in window)[0];\n\n    return prefix ? (window as any)[`${prefix}RequestAnimationFrame`] : requestAnimationFramePolyfill();\n}\n\n// Get the requestAnimationFrame function or its polyfill.\nconst reqAnimationFrame = getRequestAnimationFrame();\n",
-            "selector": "[rdxAutoFocus]",
+            "sourceCode": "import { Directive, inject } from '@angular/core';\nimport { RdxAlertDialogService } from './alert-dialog.service';\n\n@Directive({\n    selector: '[rdxAlertDialogCancel]',\n    standalone: true,\n    host: {\n        '(click)': 'onClick()'\n    }\n})\nexport class RdxAlertDialogCancelDirective {\n    private readonly alertDialogService = inject(RdxAlertDialogService);\n\n    onClick() {\n        this.alertDialogService.close();\n    }\n}\n",
+            "selector": "[rdxAlertDialogCancel]",
             "providers": [],
             "hostDirectives": [],
             "standalone": true,
-            "inputsClass": [
-                {
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [
+                {
+                    "name": "onClick",
+                    "args": [],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 14,
+                    "deprecated": false,
+                    "deprecationMessage": ""
+                }
+            ],
+            "extends": []
+        },
+        {
+            "name": "RdxAlertDialogContentDirective",
+            "id": "directive-RdxAlertDialogContentDirective-bcd379f8a36aafcdcddf8ed7d03e62ca30b760e9666397ded9ec4f69b08fb8dc849894cf891d03d233b5f79939f9aa7b388f8104e7d360a6a5469a40bc815680",
+            "file": "alert-dialog/src/alert-dialog-content.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { CdkTrapFocus } from '@angular/cdk/a11y';\nimport { Directive, ElementRef, inject, Input, Renderer2 } from '@angular/core';\n\n@Directive({\n    selector: '[rdxAlertDialogContent]',\n    standalone: true,\n    hostDirectives: [\n        {\n            directive: CdkTrapFocus\n        }\n    ],\n    host: {\n        '[attr.data-state]': '\"open\"',\n        '[attr.cdkTrapFocusAutoCapture]': 'true'\n    }\n})\nexport class RdxAlertDialogContentDirective {\n    private readonly renderer = inject(Renderer2);\n    private readonly elementRef = inject(ElementRef);\n\n    @Input() set maxWidth(value: string) {\n        this.renderer.setStyle(this.elementRef.nativeElement, 'maxWidth', value);\n    }\n}\n",
+            "selector": "[rdxAlertDialogContent]",
+            "providers": [],
+            "hostDirectives": [
+                {
+                    "name": "CdkTrapFocus",
+                    "inputs": [],
+                    "outputs": []
+                }
+            ],
+            "standalone": true,
+            "inputsClass": [
+                {
+                    "name": "maxWidth",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "line": 21,
+                    "type": "string",
+                    "decorators": []
+                }
+            ],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [],
+            "extends": [],
+            "accessors": {
+                "maxWidth": {
+                    "name": "maxWidth",
+                    "setSignature": {
+                        "name": "maxWidth",
+                        "type": "void",
+                        "deprecated": false,
+                        "deprecationMessage": "",
+                        "args": [
+                            {
+                                "name": "value",
+                                "type": "string",
+                                "deprecated": false,
+                                "deprecationMessage": ""
+                            }
+                        ],
+                        "returnType": "void",
+                        "line": 21,
+                        "jsdoctags": [
+                            {
+                                "name": "value",
+                                "type": "string",
+                                "deprecated": false,
+                                "deprecationMessage": "",
+                                "tagName": {
+                                    "text": "param"
+                                }
+                            }
+                        ]
+                    }
+                }
+            }
+        },
+        {
+            "name": "RdxAlertDialogRootDirective",
+            "id": "directive-RdxAlertDialogRootDirective-4cb3487f643dbbef236c48379c7da78bf400ec2cf09d4ac725947e8c86e7dd0bebe63e406112cb8e58de641f984309e1b643ea857d8312574530a815a448a79e",
+            "file": "alert-dialog/src/alert-dialog-root.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { Directive, inject, Input, TemplateRef, ViewContainerRef } from '@angular/core';\nimport { RdxAlertDialogService } from './alert-dialog.service';\n\n@Directive({\n    selector: '[rdxAlertDialogRoot]',\n    standalone: true\n})\nexport class RdxAlertDialogRootDirective {\n    private readonly viewContainerRef = inject(ViewContainerRef);\n    private readonly alertDialogService = inject(RdxAlertDialogService);\n\n    @Input() set content(template: TemplateRef<any>) {\n        this.alertDialogService.setDialogContent(this.viewContainerRef, template);\n    }\n}\n",
+            "selector": "[rdxAlertDialogRoot]",
+            "providers": [],
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [
+                {
+                    "name": "content",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "line": 12,
+                    "type": "TemplateRef<any>",
+                    "decorators": []
+                }
+            ],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [],
+            "extends": [],
+            "accessors": {
+                "content": {
+                    "name": "content",
+                    "setSignature": {
+                        "name": "content",
+                        "type": "void",
+                        "deprecated": false,
+                        "deprecationMessage": "",
+                        "args": [
+                            {
+                                "name": "template",
+                                "type": "TemplateRef<any>",
+                                "deprecated": false,
+                                "deprecationMessage": ""
+                            }
+                        ],
+                        "returnType": "void",
+                        "line": 12,
+                        "jsdoctags": [
+                            {
+                                "name": "template",
+                                "type": "TemplateRef<any>",
+                                "deprecated": false,
+                                "deprecationMessage": "",
+                                "tagName": {
+                                    "text": "param"
+                                }
+                            }
+                        ]
+                    }
+                }
+            }
+        },
+        {
+            "name": "RdxAlertDialogTitleDirective",
+            "id": "directive-RdxAlertDialogTitleDirective-9c00bcacce12a6a8a942c7696d936890dc26e3a7654205edf07def508039eb099fad0368f7b5eca7f5aea4efc156b3802d63cd96c52abcc6ff5190d70e0c09b5",
+            "file": "alert-dialog/src/alert-dialog-title.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { Directive } from '@angular/core';\n\n@Directive({\n    selector: '[rdxAlertDialogTitle]',\n    standalone: true\n})\nexport class RdxAlertDialogTitleDirective {}\n",
+            "selector": "[rdxAlertDialogTitle]",
+            "providers": [],
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [],
+            "extends": []
+        },
+        {
+            "name": "RdxAlertDialogTriggerDirective",
+            "id": "directive-RdxAlertDialogTriggerDirective-422c72ac6dd420ea1027d9205052dc8fadb62cc127fc0dfd24099d56c973163df8719acef428bf74d102c4a5e6bd0a6aaf2f1957bb11a35ff9866ad4eb80e9b0",
+            "file": "alert-dialog/src/alert-dialog-trigger.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { Directive, inject } from '@angular/core';\nimport { RdxAlertDialogService } from './alert-dialog.service';\n\n@Directive({\n    selector: '[rdxAlertDialogTrigger]',\n    standalone: true,\n    host: {\n        '(click)': 'handleClick()'\n    }\n})\nexport class RdxAlertDialogTriggerDirective {\n    private readonly alertDialogService = inject(RdxAlertDialogService);\n\n    handleClick() {\n        this.alertDialogService.open();\n    }\n}\n",
+            "selector": "[rdxAlertDialogTrigger]",
+            "providers": [],
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [
+                {
+                    "name": "handleClick",
+                    "args": [],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 14,
+                    "deprecated": false,
+                    "deprecationMessage": ""
+                }
+            ],
+            "extends": []
+        },
+        {
+            "name": "RdxAspectRatioDirective",
+            "id": "directive-RdxAspectRatioDirective-b883c7bbe79c382fa6312aba8d6b55b2774a26494dc6d49d77e3d654fd0e27d8142fce11b91158010431c1e125d8b1cd424acbf9cd93a07c2c3020863090e54b",
+            "file": "aspect-ratio/src/aspect-ratio.directive.ts",
+            "type": "directive",
+            "description": "<p>Directive to maintain an aspect ratio for an element.\nThe element will have its <code>padding-bottom</code> dynamically calculated\nbased on the provided aspect ratio to maintain the desired ratio.\nThe content inside the element will be positioned absolutely.</p>\n",
+            "rawdescription": "\n\nDirective to maintain an aspect ratio for an element.\nThe element will have its `padding-bottom` dynamically calculated\nbased on the provided aspect ratio to maintain the desired ratio.\nThe content inside the element will be positioned absolutely.\n",
+            "sourceCode": "import { NumberInput } from '@angular/cdk/coercion';\nimport {\n    AfterViewInit,\n    computed,\n    Directive,\n    ElementRef,\n    inject,\n    input,\n    numberAttribute,\n    Renderer2\n} from '@angular/core';\n\n/**\n * Directive to maintain an aspect ratio for an element.\n * The element will have its `padding-bottom` dynamically calculated\n * based on the provided aspect ratio to maintain the desired ratio.\n * The content inside the element will be positioned absolutely.\n */\n@Directive({\n    selector: '[rdxAspectRatio]',\n    exportAs: 'rdxAspectRatio',\n    standalone: true,\n    host: {\n        '[style.position]': `'relative'`,\n        '[style.width]': `'100%'`,\n        '[style.padding-bottom]': 'paddingBottom()'\n    }\n})\nexport class RdxAspectRatioDirective implements AfterViewInit {\n    private element = inject(ElementRef);\n    private renderer = inject(Renderer2);\n\n    /**\n     * The desired aspect ratio (e.g., 16/9).\n     * By default, it is set to 1 (which results in a square, 1:1).\n     */\n    readonly ratio = input<number, NumberInput>(1, { transform: numberAttribute });\n\n    /**\n     * Dynamically computed `padding-bottom` style for the element.\n     * This value is calculated based on the inverse of the aspect ratio.\n     *\n     * If the ratio is zero, it defaults to `0%` to avoid division by zero.\n     */\n    protected readonly paddingBottom = computed(() => {\n        const ratioValue = this.ratio();\n        return `${ratioValue !== 0 ? (1 / ratioValue) * 100 : 0}%`;\n    });\n\n    ngAfterViewInit() {\n        const content = this.element.nativeElement.firstElementChild;\n        if (content) {\n            // Set the content to cover the entire element with absolute positioning\n            this.renderer.setStyle(content, 'position', 'absolute');\n            this.renderer.setStyle(content, 'inset', '0');\n        }\n    }\n}\n",
+            "selector": "[rdxAspectRatio]",
+            "providers": [],
+            "exportAs": "rdxAspectRatio",
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [
+                {
+                    "name": "paddingBottom",
+                    "defaultValue": "computed(() => {\n        const ratioValue = this.ratio();\n        return `${ratioValue !== 0 ? (1 / ratioValue) * 100 : 0}%`;\n    })",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>Dynamically computed <code>padding-bottom</code> style for the element.\nThis value is calculated based on the inverse of the aspect ratio.</p>\n<p>If the ratio is zero, it defaults to <code>0%</code> to avoid division by zero.</p>\n",
+                    "line": 45,
+                    "rawdescription": "\n\nDynamically computed `padding-bottom` style for the element.\nThis value is calculated based on the inverse of the aspect ratio.\n\nIf the ratio is zero, it defaults to `0%` to avoid division by zero.\n",
+                    "modifierKind": [
+                        124,
+                        148
+                    ]
+                },
+                {
+                    "name": "ratio",
+                    "defaultValue": "input<number, NumberInput>(1, { transform: numberAttribute })",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>The desired aspect ratio (e.g., 16/9).\nBy default, it is set to 1 (which results in a square, 1:1).</p>\n",
+                    "line": 37,
+                    "rawdescription": "\n\nThe desired aspect ratio (e.g., 16/9).\nBy default, it is set to 1 (which results in a square, 1:1).\n",
+                    "modifierKind": [
+                        148
+                    ]
+                }
+            ],
+            "methodsClass": [],
+            "extends": [],
+            "implements": [
+                "AfterViewInit"
+            ]
+        },
+        {
+            "name": "RdxAutoFocusDirective",
+            "id": "directive-RdxAutoFocusDirective-36fdd916db27dba985b1c2f77905595edbce993570293a337d7b80f0efa4ef852996b041e5caad932322228c1d26e64ac067d0aac41a4e3e390475bed79dfb5d",
+            "file": "core/src/auto-focus.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { booleanAttribute, Directive, ElementRef, inject, Input, NgZone } from '@angular/core';\n\n/*\n * <div [rdxAutoFocus]=\"true\"></div>\n */\n\n@Directive({\n    selector: '[rdxAutoFocus]',\n    standalone: true\n})\nexport class RdxAutoFocusDirective {\n    #elementRef = inject(ElementRef);\n    #ngZone = inject(NgZone);\n\n    private _autoSelect = false;\n\n    /**\n     * @default false\n     */\n    @Input({ alias: 'rdxAutoFocus', transform: booleanAttribute })\n    set autoFocus(value: boolean) {\n        if (value) {\n            // Note: Running this outside Angular's zone because `element.focus()` does not trigger change detection.\n            this.#ngZone.runOutsideAngular(() =>\n                // Note: `element.focus()` causes re-layout which might lead to frame drops on slower devices.\n                // https://gist.github.com/paulirish/5d52fb081b3570c81e3a#setting-focus\n                // `setTimeout` is a macrotask executed within the current rendering frame.\n                // Animation tasks are executed in the next rendering frame.\n                reqAnimationFrame(() => {\n                    this.#elementRef.nativeElement.focus();\n                    if (this._autoSelect && this.#elementRef.nativeElement.select) {\n                        this.#elementRef.nativeElement.select();\n                    }\n                })\n            );\n        }\n    }\n\n    // Setter for autoSelect attribute to enable text selection when autoFocus is true.\n    @Input({ transform: booleanAttribute })\n    set autoSelect(value: boolean) {\n        this._autoSelect = value;\n    }\n}\n\nconst availablePrefixes = ['moz', 'ms', 'webkit'];\n\nfunction requestAnimationFramePolyfill(): typeof requestAnimationFrame {\n    let lastTime = 0;\n\n    return function (callback: FrameRequestCallback): number {\n        const currTime = new Date().getTime();\n        const timeToCall = Math.max(0, 16 - (currTime - lastTime));\n\n        const id = setTimeout(() => {\n            callback(currTime + timeToCall);\n        }, timeToCall) as any;\n\n        lastTime = currTime + timeToCall;\n\n        return id;\n    };\n}\n\n// Function to get the appropriate requestAnimationFrame method with fallback to polyfill.\nfunction getRequestAnimationFrame(): typeof requestAnimationFrame {\n    if (typeof window === 'undefined') {\n        return () => 0;\n    }\n    if (window.requestAnimationFrame) {\n        // https://github.com/vuejs/vue/issues/4465\n        return window.requestAnimationFrame.bind(window);\n    }\n\n    const prefix = availablePrefixes.filter((key) => `${key}RequestAnimationFrame` in window)[0];\n\n    return prefix ? (window as any)[`${prefix}RequestAnimationFrame`] : requestAnimationFramePolyfill();\n}\n\n// Get the requestAnimationFrame function or its polyfill.\nconst reqAnimationFrame = getRequestAnimationFrame();\n",
+            "selector": "[rdxAutoFocus]",
+            "providers": [],
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [
+                {
                     "required": false,
                     "name": "autoSelect",
                     "deprecated": false,
@@ -2203,12 +2289,12 @@
         },
         {
             "name": "RdxAvatarFallbackDirective",
-            "id": "directive-RdxAvatarFallbackDirective-c8b14c99cbd7da2781b645483e75a4570eeed5794a58213d451c684aa433daae179c9caf3344d550af77ce8860288512938a0baeebc80e0a49f0c38a4557d5fc",
+            "id": "directive-RdxAvatarFallbackDirective-3ec0a285681b4e3cef007c029710e37483fa80c00cbfcce5147fbcb173c808e1606e55fea16a94eb028b2692758b9c15c983bf6f8e5d3bb38210d8ba1d5d3ec0",
             "file": "avatar/src/avatar-fallback.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { isPlatformBrowser } from '@angular/common';\nimport { Directive, inject, Input, NgZone, numberAttribute, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';\nimport { injectAvatar } from './avatar-root.directive';\nimport { injectAvatarConfig } from './avatar.config';\n\nexport interface RdxAvatarFallbackProps {\n    delayMs?: number;\n}\n\n@Directive({\n    selector: 'span[rdxAvatarFallback]',\n    exportAs: 'rdxAvatarFallback',\n    standalone: true,\n    host: {\n        '[style.display]': 'visible ? null : \"none\"'\n    }\n})\nexport class RdxAvatarFallbackDirective implements RdxAvatarFallbackProps, OnInit, OnDestroy {\n    private readonly avatar = injectAvatar();\n\n    private readonly config = injectAvatarConfig();\n\n    private readonly ngZone = inject(NgZone);\n\n    private readonly platformId = inject(PLATFORM_ID);\n\n    /**\n     * Define a delay before the fallback is shown.\n     * This is useful to only show the fallback for those with slower connections.\n     * @default 0\n     */\n    @Input({ alias: 'rdxDelayMs', transform: numberAttribute }) delayMs: number = this.config.delayMs;\n\n    protected get visible(): boolean {\n        return this.delayElapsed && this.avatar._state() !== 'loaded';\n    }\n\n    /**\n     * Determine the delay has elapsed, and we can show the fallback.\n     */\n    private delayElapsed = false;\n\n    private timeoutId: ReturnType<typeof setTimeout> | null = null;\n\n    ngOnInit(): void {\n        if (isPlatformBrowser(this.platformId)) {\n            this.ngZone.runOutsideAngular(() => {\n                this.timeoutId = globalThis.setTimeout(() => {\n                    this.ngZone.run(() => {\n                        this.delayElapsed = true;\n                    });\n                }, this.delayMs);\n            });\n        }\n    }\n\n    ngOnDestroy(): void {\n        if (isPlatformBrowser(this.platformId) && this.timeoutId !== null) {\n            globalThis.clearTimeout(this.timeoutId);\n        }\n    }\n}\n",
+            "sourceCode": "import { isPlatformBrowser } from '@angular/common';\nimport {\n    Directive,\n    inject,\n    Input,\n    NgZone,\n    numberAttribute,\n    OnDestroy,\n    OnInit,\n    PLATFORM_ID,\n    signal\n} from '@angular/core';\nimport { injectAvatar } from './avatar-root.directive';\nimport { injectAvatarConfig } from './avatar.config';\n\nexport interface RdxAvatarFallbackProps {\n    delayMs?: number;\n}\n\n@Directive({\n    selector: 'span[rdxAvatarFallback]',\n    exportAs: 'rdxAvatarFallback',\n    standalone: true,\n    host: {\n        '[style.display]': 'visible() ? null : \"none\"'\n    }\n})\nexport class RdxAvatarFallbackDirective implements RdxAvatarFallbackProps, OnInit, OnDestroy {\n    private readonly avatar = injectAvatar();\n\n    private readonly config = injectAvatarConfig();\n\n    private readonly ngZone = inject(NgZone);\n\n    private readonly platformId = inject(PLATFORM_ID);\n\n    /**\n     * Define a delay before the fallback is shown.\n     * This is useful to only show the fallback for those with slower connections.\n     * @default 0\n     */\n    @Input({ alias: 'rdxDelayMs', transform: numberAttribute }) delayMs: number = this.config.delayMs;\n\n    readonly visible = signal(false);\n\n    /**\n     * Determine the delay has elapsed, and we can show the fallback.\n     */\n    private delayElapsed = false;\n\n    private timeoutId: ReturnType<typeof setTimeout> | null = null;\n\n    ngOnInit(): void {\n        if (isPlatformBrowser(this.platformId)) {\n            this.ngZone.runOutsideAngular(() => {\n                this.timeoutId = globalThis.setTimeout(() => {\n                    this.ngZone.run(() => {\n                        this.delayElapsed = true;\n                        this.updateVisibility();\n                    });\n                }, this.delayMs);\n            });\n        }\n    }\n\n    ngOnDestroy(): void {\n        if (isPlatformBrowser(this.platformId) && this.timeoutId !== null) {\n            globalThis.clearTimeout(this.timeoutId);\n        }\n    }\n\n    private updateVisibility(): void {\n        this.visible.set(this.delayElapsed && this.avatar._state() !== 'loaded');\n    }\n}\n",
             "selector": "span[rdxAvatarFallback]",
             "providers": [],
             "exportAs": "rdxAvatarFallback",
@@ -2223,15 +2309,15 @@
                     "deprecationMessage": "",
                     "jsdoctags": [
                         {
-                            "pos": 979,
-                            "end": 995,
+                            "pos": 1025,
+                            "end": 1041,
                             "flags": 16842752,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 980,
-                                "end": 987,
+                                "pos": 1026,
+                                "end": 1033,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -2243,7 +2329,7 @@
                     ],
                     "rawdescription": "\n\nDefine a delay before the fallback is shown.\nThis is useful to only show the fallback for those with slower connections.\n",
                     "description": "<p>Define a delay before the fallback is shown.\nThis is useful to only show the fallback for those with slower connections.</p>\n",
-                    "line": 32,
+                    "line": 42,
                     "type": "number",
                     "decorators": []
                 }
@@ -2253,25 +2339,28 @@
             "deprecationMessage": "",
             "hostBindings": [],
             "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [],
-            "extends": [],
-            "implements": [
+            "propertiesClass": [
+                {
+                    "name": "visible",
+                    "defaultValue": "signal(false)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 44,
+                    "modifierKind": [
+                        148
+                    ]
+                }
+            ],
+            "methodsClass": [],
+            "extends": [],
+            "implements": [
                 "RdxAvatarFallbackProps",
                 "OnInit",
                 "OnDestroy"
-            ],
-            "accessors": {
-                "visible": {
-                    "name": "visible",
-                    "getSignature": {
-                        "name": "visible",
-                        "type": "boolean",
-                        "returnType": "boolean",
-                        "line": 34
-                    }
-                }
-            }
+            ]
         },
         {
             "name": "RdxAvatarImageDirective",
@@ -5114,7 +5203,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 53,
+                    "line": 55,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "modifierKind": [
@@ -5158,12 +5247,12 @@
         },
         {
             "name": "RdxDropdownMenuItemDirective",
-            "id": "directive-RdxDropdownMenuItemDirective-13cda40a7ed8e6a6314a3eb8ba71f9e25c833b83e4f117b562ba13d4d8558c1d445e01e110b0f479af40bf3a9581f4fbbdc922444331b98ad17f7b55a9ae9730",
+            "id": "directive-RdxDropdownMenuItemDirective-d0a62e1d8c17431571b907aeae565640da58d6cfc5b5ae0019a6bb9b3df14cd324bf7ecf2674d726e4a7926b389b453b465d9592627a36b965ddd620e2d5f1d8",
             "file": "dropdown-menu/src/dropdown-menu-item.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { CDK_MENU, CdkMenuItem } from '@angular/cdk/menu';\nimport { booleanAttribute, Directive, ElementRef, EventEmitter, inject, Input, Output } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { RdxDropdownMenuContentDirective } from './dropdown-menu-content.directive';\n\n@Directive({\n    selector: '[rdxDropdownMenuItem]',\n    standalone: true,\n    host: {\n        type: 'button',\n        // todo horizontal ?\n        '[attr.data-orientation]': '\"vertical\"',\n        '[attr.data-highlighted]': 'highlighted ? \"\" : null',\n        '[attr.data-disabled]': 'disabled ? \"\" : null',\n        '[attr.disabled]': 'disabled ? \"\" : null',\n        '(pointermove)': 'onPointerMove()',\n        '(focus)': 'menu.highlighted.next(this)',\n        '(keydown)': 'onKeydown($event)'\n    },\n    providers: [\n        { provide: CdkMenuItem, useExisting: RdxDropdownMenuItemDirective },\n        { provide: CDK_MENU, useExisting: RdxDropdownMenuContentDirective }\n    ]\n})\nexport class RdxDropdownMenuItemDirective extends CdkMenuItem {\n    protected readonly menu = inject(RdxDropdownMenuContentDirective);\n    protected readonly nativeElement = inject(ElementRef).nativeElement;\n\n    highlighted = false;\n\n    @Input({ transform: booleanAttribute }) override disabled: boolean = false;\n\n    @Output() readonly onSelect = new EventEmitter<void>();\n\n    constructor() {\n        super();\n\n        this.menu.highlighted.pipe(takeUntilDestroyed()).subscribe((value) => {\n            if (value !== this) {\n                this.highlighted = false;\n            }\n        });\n\n        this.triggered.subscribe(this.onSelect);\n    }\n\n    protected onPointerMove() {\n        this.nativeElement.focus({ preventScroll: true });\n        this.menu.updateActiveItem(this);\n    }\n\n    protected onKeydown(event: KeyboardEvent) {\n        if (this.nativeElement.tagName !== 'BUTTON' && ['Enter', ' '].includes(event.key)) {\n            event.preventDefault();\n        }\n\n        if (event.key === 'Escape') {\n            if (!this.menu.closeOnEscape) {\n                event.stopPropagation();\n            } else {\n                this.menu.onEscapeKeyDown(event);\n            }\n        }\n    }\n}\n",
+            "sourceCode": "import { CDK_MENU, CdkMenuItem } from '@angular/cdk/menu';\nimport { booleanAttribute, Directive, ElementRef, EventEmitter, inject, Input, Output } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { RdxDropdownMenuContentDirective } from './dropdown-menu-content.directive';\n\n@Directive({\n    selector: '[rdxDropdownMenuItem]',\n    standalone: true,\n    host: {\n        type: 'button',\n        // todo horizontal ?\n        '[attr.data-orientation]': '\"vertical\"',\n        '[attr.data-highlighted]': 'highlighted ? \"\" : null',\n        '[attr.data-disabled]': 'disabled ? \"\" : null',\n        '[attr.disabled]': 'disabled ? \"\" : null',\n        '(pointermove)': 'onPointerMove()',\n        '(focus)': 'menu.highlighted.next(this)',\n        '(keydown)': 'onKeydown($event)'\n    },\n    providers: [\n        { provide: CdkMenuItem, useExisting: RdxDropdownMenuItemDirective },\n        { provide: CDK_MENU, useExisting: RdxDropdownMenuContentDirective }\n    ]\n})\nexport class RdxDropdownMenuItemDirective extends CdkMenuItem {\n    protected readonly menu = inject(RdxDropdownMenuContentDirective);\n    protected readonly nativeElement = inject(ElementRef).nativeElement;\n\n    highlighted = false;\n\n    @Input({ transform: booleanAttribute }) override disabled: boolean = false;\n\n    @Output() readonly onSelect = new EventEmitter<void>();\n\n    constructor() {\n        super();\n\n        this.menu.highlighted.pipe(takeUntilDestroyed()).subscribe((value) => {\n            if (value !== this) {\n                this.highlighted = false;\n            }\n        });\n\n        this.triggered.subscribe(this.onSelect);\n    }\n\n    protected onPointerMove() {\n        if (!this.highlighted) {\n            this.nativeElement.focus({ preventScroll: true });\n            this.menu.updateActiveItem(this);\n        }\n    }\n\n    protected onKeydown(event: KeyboardEvent) {\n        if (this.nativeElement.tagName !== 'BUTTON' && ['Enter', ' '].includes(event.key)) {\n            event.preventDefault();\n        }\n\n        if (event.key === 'Escape') {\n            if (!this.menu.closeOnEscape) {\n                event.stopPropagation();\n            } else {\n                this.menu.onEscapeKeyDown(event);\n            }\n        }\n    }\n}\n",
             "selector": "[rdxDropdownMenuItem]",
             "providers": [
                 {
@@ -5257,7 +5346,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 53,
+                    "line": 55,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "modifierKind": [
@@ -5492,7 +5581,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 53,
+                    "line": 55,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "modifierKind": [
@@ -5817,7 +5906,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 53,
+                    "line": 55,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "modifierKind": [
@@ -7216,12 +7305,12 @@
         },
         {
             "name": "RdxRadioGroupDirective",
-            "id": "directive-RdxRadioGroupDirective-0210d1b2e785c23c9259a7092690bbb97cc9dddaf295b590b5f1351229ac7c9df0d64be418ef696e73bf83866aa56e2e09c7d20044a8bacb2a5c7b358beede80",
+            "id": "directive-RdxRadioGroupDirective-6cd2bb486dcb41fcb3fe8c43f1f0e3f5fef08e9e5e35f9d9d5729e7bff3ec4cd98abc08817c80eceff4190327cce0daa0354559761520611b1e00456eb511063",
             "file": "radio/src/radio-root.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { FocusKeyManager } from '@angular/cdk/a11y';\nimport { DOWN_ARROW, ENTER, LEFT_ARROW, RIGHT_ARROW, SPACE, TAB, UP_ARROW } from '@angular/cdk/keycodes';\nimport {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    Input,\n    OnDestroy,\n    Output,\n    QueryList\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Subject, takeUntil } from 'rxjs';\nimport { RdxRadioItemDirective } from './radio-item.directive';\nimport { RadioGroupDirective, RadioGroupProps, RDX_RADIO_GROUP } from './radio-tokens';\n\n@Directive({\n    selector: '[rdxRadioRoot]',\n    exportAs: 'rdxRadioRoot',\n    standalone: true,\n    providers: [\n        { provide: RDX_RADIO_GROUP, useExisting: RdxRadioGroupDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxRadioGroupDirective, multi: true }\n    ],\n    host: {\n        role: 'radiogroup',\n        '[attr.aria-orientation]': '_orientation',\n        '[attr.data-disabled]': 'disabled ? \"\" : null',\n        '[attr.tabindex]': '-1',\n        '[attr.dir]': 'dir',\n        '(keydown)': '_onKeydown($event)',\n        '(focusin)': '_onFocusin($event)'\n    }\n})\nexport class RdxRadioGroupDirective\n    implements RadioGroupProps, RadioGroupDirective, ControlValueAccessor, AfterContentInit, OnDestroy\n{\n    @ContentChildren(RdxRadioItemDirective, { descendants: true }) radioItems!: QueryList<RdxRadioItemDirective>;\n    private focusKeyManager!: FocusKeyManager<RdxRadioItemDirective>;\n    private destroy$ = new Subject<void>();\n\n    name?: string | undefined;\n    @Input() value?: string;\n\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    @Input() dir?: string;\n\n    @Input() defaultValue?: string;\n\n    /**\n     * The orientation of the radio group only vertical.\n     * Horizontal radio buttons can sometimes be challenging to scan and localize.\n     * The horizontal arrangement of radio buttons may also lead to difficulties in determining which\n     * label corresponds to which button: whether the label is above or below the button.\n     * @default 'vertical'\n     */\n    readonly _orientation = 'vertical';\n\n    /**\n     * Event handler called when the value changes.\n     */\n    @Output() readonly onValueChange = new EventEmitter<string>();\n\n    /**\n     * The callback function to call when the value of the radio group changes.\n     */\n    private onChange: (value: string) => void = () => {\n        /* Empty */\n    };\n\n    /**\n     * The callback function to call when the radio group is touched.\n     */\n    onTouched: () => void = () => {\n        /* Empty */\n    };\n\n    ngAfterContentInit() {\n        this.focusKeyManager = new FocusKeyManager(this.radioItems).withWrap().withVerticalOrientation();\n\n        this.radioItems.changes.pipe(takeUntil(this.destroy$)).subscribe(() => {\n            this.updateActiveItem();\n        });\n\n        this.updateActiveItem(false);\n    }\n\n    ngOnDestroy() {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    /**\n     * Select a radio item.\n     * @param value The value of the radio item to select.\n     */\n    select(value: string): void {\n        this.value = value;\n        this.onValueChange.emit(value);\n        this.onChange?.(value);\n        this.updateActiveItem();\n        this.onTouched();\n    }\n\n    /**\n     * Update the value of the radio group.\n     * @param value The new value of the radio group.\n     * @internal\n     */\n    writeValue(value: string): void {\n        this.value = value;\n        if (this.radioItems) {\n            this.updateActiveItem(false);\n        }\n    }\n\n    /**\n     * Register a callback function to call when the value of the radio group changes.\n     * @param fn The callback function to call when the value of the radio group changes.\n     * @internal\n     */\n    registerOnChange(fn: (value: string) => void): void {\n        this.onChange = fn;\n    }\n\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    /**\n     * Set the disabled state of the radio group.\n     * @param isDisabled Whether the radio group is disabled.\n     * @internal\n     */\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n    }\n\n    /**\n     * When focus leaves the radio group.\n     */\n    _onFocusin(event: FocusEvent): void {\n        const target = event.target as HTMLElement;\n        const radioItem = this.radioItems.find((item) => item.element.nativeElement === target);\n        if (radioItem) {\n            this.focusKeyManager.setActiveItem(radioItem);\n        }\n    }\n\n    _onKeydown(event: KeyboardEvent): void {\n        if (this.disabled) return;\n\n        switch (event.keyCode) {\n            case ENTER:\n            case SPACE:\n                event.preventDefault();\n                this.selectFocusedItem();\n                break;\n            case DOWN_ARROW:\n            case RIGHT_ARROW:\n                event.preventDefault();\n                this.focusKeyManager.setNextItemActive();\n                this.selectFocusedItem();\n                break;\n            case UP_ARROW:\n            case LEFT_ARROW:\n                event.preventDefault();\n                this.focusKeyManager.setPreviousItemActive();\n                this.selectFocusedItem();\n                break;\n            case TAB:\n                this.tabNavigation(event);\n                break;\n            default:\n                this.focusKeyManager.onKeydown(event);\n        }\n    }\n\n    private selectFocusedItem(): void {\n        const focusedItem = this.focusKeyManager.activeItem;\n        if (focusedItem) {\n            this.select(focusedItem.value);\n        }\n    }\n\n    private updateActiveItem(setFocus = true): void {\n        const activeItem = this.radioItems.find((item) => item.value === this.value);\n        if (activeItem) {\n            this.focusKeyManager.setActiveItem(activeItem);\n        } else if (this.radioItems.length > 0 && setFocus) {\n            this.focusKeyManager.setFirstItemActive();\n        }\n    }\n\n    private tabNavigation(event: KeyboardEvent): void {\n        event.preventDefault();\n        const checkedItem = this.radioItems.find((item) => item.checked);\n        if (checkedItem) {\n            checkedItem.focus();\n        } else if (this.radioItems.first) {\n            this.radioItems.first.focus();\n        }\n    }\n}\n",
+            "sourceCode": "import { FocusKeyManager } from '@angular/cdk/a11y';\nimport { DOWN_ARROW, ENTER, LEFT_ARROW, RIGHT_ARROW, SPACE, TAB, UP_ARROW } from '@angular/cdk/keycodes';\nimport {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    Input,\n    OnDestroy,\n    Output,\n    QueryList\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Subject, takeUntil } from 'rxjs';\nimport { RdxRadioItemDirective } from './radio-item.directive';\nimport { RadioGroupDirective, RadioGroupProps, RDX_RADIO_GROUP } from './radio-tokens';\n\n@Directive({\n    selector: '[rdxRadioRoot]',\n    exportAs: 'rdxRadioRoot',\n    standalone: true,\n    providers: [\n        { provide: RDX_RADIO_GROUP, useExisting: RdxRadioGroupDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxRadioGroupDirective, multi: true }\n    ],\n    host: {\n        role: 'radiogroup',\n        '[attr.aria-orientation]': '_orientation',\n        '[attr.data-disabled]': 'disabled ? \"\" : null',\n        '[attr.tabindex]': '-1',\n        '[attr.dir]': 'dir',\n        '(keydown)': 'onKeydown($event)',\n        '(focusin)': 'onFocusin($event)'\n    }\n})\nexport class RdxRadioGroupDirective\n    implements RadioGroupProps, RadioGroupDirective, ControlValueAccessor, AfterContentInit, OnDestroy\n{\n    @ContentChildren(RdxRadioItemDirective, { descendants: true }) radioItems!: QueryList<RdxRadioItemDirective>;\n    private focusKeyManager!: FocusKeyManager<RdxRadioItemDirective>;\n    private destroy$ = new Subject<void>();\n\n    name?: string | undefined;\n    @Input() value?: string;\n\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    @Input() dir?: string;\n\n    @Input() defaultValue?: string;\n\n    /**\n     * The orientation of the radio group only vertical.\n     * Horizontal radio buttons can sometimes be challenging to scan and localize.\n     * The horizontal arrangement of radio buttons may also lead to difficulties in determining which\n     * label corresponds to which button: whether the label is above or below the button.\n     * @default 'vertical'\n     */\n    readonly _orientation = 'vertical';\n\n    /**\n     * Event handler called when the value changes.\n     */\n    @Output() readonly onValueChange = new EventEmitter<string>();\n\n    /**\n     * The callback function to call when the value of the radio group changes.\n     */\n    private onChange: (value: string) => void = () => {\n        /* Empty */\n    };\n\n    /**\n     * The callback function to call when the radio group is touched.\n     */\n    onTouched: () => void = () => {\n        /* Empty */\n    };\n\n    ngAfterContentInit() {\n        this.focusKeyManager = new FocusKeyManager(this.radioItems).withWrap().withVerticalOrientation();\n\n        this.radioItems.changes.pipe(takeUntil(this.destroy$)).subscribe(() => {\n            this.updateActiveItem();\n        });\n\n        this.updateActiveItem(false);\n    }\n\n    ngOnDestroy() {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    /**\n     * Select a radio item.\n     * @param value The value of the radio item to select.\n     */\n    select(value: string): void {\n        this.value = value;\n        this.onValueChange.emit(value);\n        this.onChange?.(value);\n        this.updateActiveItem();\n        this.onTouched();\n    }\n\n    /**\n     * Update the value of the radio group.\n     * @param value The new value of the radio group.\n     * @internal\n     */\n    writeValue(value: string): void {\n        this.value = value;\n        if (this.radioItems) {\n            this.updateActiveItem(false);\n        }\n    }\n\n    /**\n     * Register a callback function to call when the value of the radio group changes.\n     * @param fn The callback function to call when the value of the radio group changes.\n     * @internal\n     */\n    registerOnChange(fn: (value: string) => void): void {\n        this.onChange = fn;\n    }\n\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    /**\n     * Set the disabled state of the radio group.\n     * @param isDisabled Whether the radio group is disabled.\n     * @internal\n     */\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n    }\n\n    /**\n     * When focus leaves the radio group.\n     */\n    protected onFocusin(event: FocusEvent): void {\n        const target = event.target as HTMLElement;\n        const radioItem = this.radioItems.find((item) => item.element.nativeElement === target);\n        if (radioItem) {\n            this.focusKeyManager.setActiveItem(radioItem);\n        }\n    }\n\n    protected onKeydown(event: KeyboardEvent): void {\n        if (this.disabled) return;\n\n        switch (event.keyCode) {\n            case ENTER:\n            case SPACE:\n                event.preventDefault();\n                this.selectFocusedItem();\n                break;\n            case DOWN_ARROW:\n            case RIGHT_ARROW:\n                event.preventDefault();\n                this.focusKeyManager.setNextItemActive();\n                this.selectFocusedItem();\n                break;\n            case UP_ARROW:\n            case LEFT_ARROW:\n                event.preventDefault();\n                this.focusKeyManager.setPreviousItemActive();\n                this.selectFocusedItem();\n                break;\n            case TAB:\n                this.tabNavigation(event);\n                break;\n            default:\n                this.focusKeyManager.onKeydown(event);\n        }\n    }\n\n    private selectFocusedItem(): void {\n        const focusedItem = this.focusKeyManager.activeItem;\n        if (focusedItem) {\n            this.select(focusedItem.value);\n        }\n    }\n\n    private updateActiveItem(setFocus = true): void {\n        const activeItem = this.radioItems.find((item) => item.value === this.value);\n        if (activeItem) {\n            this.focusKeyManager.setActiveItem(activeItem);\n        } else if (this.radioItems.length > 0 && setFocus) {\n            this.focusKeyManager.setFirstItemActive();\n        }\n    }\n\n    private tabNavigation(event: KeyboardEvent): void {\n        event.preventDefault();\n        const checkedItem = this.radioItems.find((item) => item.checked);\n        if (checkedItem) {\n            checkedItem.focus();\n        } else if (this.radioItems.first) {\n            this.radioItems.first.focus();\n        }\n    }\n}\n",
             "selector": "[rdxRadioRoot]",
             "providers": [
                 {
@@ -7304,15 +7393,15 @@
                     ],
                     "jsdoctags": [
                         {
-                            "pos": 2106,
-                            "end": 2131,
+                            "pos": 2104,
+                            "end": 2129,
                             "flags": 16842752,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 2107,
-                                "end": 2114,
+                                "pos": 2105,
+                                "end": 2112,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -7364,7 +7453,7 @@
             ],
             "methodsClass": [
                 {
-                    "name": "_onFocusin",
+                    "name": "onFocusin",
                     "args": [
                         {
                             "name": "event",
@@ -7381,6 +7470,9 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nWhen focus leaves the radio group.\n",
                     "description": "<p>When focus leaves the radio group.</p>\n",
+                    "modifierKind": [
+                        124
+                    ],
                     "jsdoctags": [
                         {
                             "name": "event",
@@ -7394,7 +7486,7 @@
                     ]
                 },
                 {
-                    "name": "_onKeydown",
+                    "name": "onKeydown",
                     "args": [
                         {
                             "name": "event",
@@ -7409,6 +7501,9 @@
                     "line": 153,
                     "deprecated": false,
                     "deprecationMessage": "",
+                    "modifierKind": [
+                        124
+                    ],
                     "jsdoctags": [
                         {
                             "name": "event",
@@ -7472,8 +7567,8 @@
                     "jsdoctags": [
                         {
                             "name": {
-                                "pos": 3092,
-                                "end": 3097,
+                                "pos": 3090,
+                                "end": 3095,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -7484,8 +7579,8 @@
                             "deprecated": false,
                             "deprecationMessage": "",
                             "tagName": {
-                                "pos": 3086,
-                                "end": 3091,
+                                "pos": 3084,
+                                "end": 3089,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -7687,35 +7782,31 @@
         },
         {
             "name": "RdxSeparatorRootDirective",
-            "id": "directive-RdxSeparatorRootDirective-4949c922492b142101253d6d48cac42ca3a0b376ad10b5fc62486d2835799ec052bf8e91d3d2a6a0299a4b21e857e6b1eb34ce436753e284358d6e3349cd248b",
+            "id": "directive-RdxSeparatorRootDirective-b69bdacfd17a9613b054bf8ca89fdc318eb7cac4d0d01179b19d405de3894ec017075d1b44c9d9a19e23ca7070398a1ce34ec61a992e0b6e21349554d1300827",
             "file": "separator/src/separator.directive.ts",
             "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { booleanAttribute, Directive, Input } from '@angular/core';\n\nconst DEFAULT_ORIENTATION = 'horizontal';\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst ORIENTATIONS = ['horizontal', 'vertical'] as const;\n\nexport type Orientation = (typeof ORIENTATIONS)[number];\n\nexport interface SeparatorProps {\n    /**\n     * Either `vertical` or `horizontal`. Defaults to `horizontal`.\n     */\n    orientation?: Orientation;\n    /**\n     * Whether the component is purely decorative. When true, accessibility-related attributes\n     * are updated so that the rendered element is removed from the accessibility tree.\n     */\n    decorative?: boolean;\n}\n\n@Directive({\n    selector: 'div[rdxSeparatorRoot]',\n    standalone: true,\n    host: {\n        '[attr.role]': 'decorative ? \"none\" : \"separator\"',\n        // `aria-orientation` defaults to `horizontal` so we only need it if `orientation` is vertical\n        '[attr.aria-orientation]': '!decorative && orientation === \"vertical\" ? \"vertical\" : null',\n        '[attr.data-orientation]': 'orientation'\n    }\n})\nexport class RdxSeparatorRootDirective implements SeparatorProps {\n    @Input() orientation: Orientation = DEFAULT_ORIENTATION;\n\n    @Input({ transform: booleanAttribute }) decorative = false;\n}\n",
+            "description": "<p>Directive that adds accessible and configurable separator element to the DOM.\nThis can be either horizontal or vertical and optionally decorative (which removes\nit from the accessibility tree).</p>\n",
+            "rawdescription": "\n\nDirective that adds accessible and configurable separator element to the DOM.\nThis can be either horizontal or vertical and optionally decorative (which removes\nit from the accessibility tree).\n",
+            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, computed, Directive, input } from '@angular/core';\n\nconst DEFAULT_ORIENTATION = 'horizontal';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst ORIENTATIONS = ['horizontal', 'vertical'] as const;\n\nexport type Orientation = (typeof ORIENTATIONS)[number];\n\nexport interface SeparatorProps {\n    /**\n     * Either `vertical` or `horizontal`. Defaults to `horizontal`.\n     */\n    orientation?: Orientation;\n    /**\n     * Whether the component is purely decorative. When true, accessibility-related attributes\n     * are updated so that the rendered element is removed from the accessibility tree.\n     */\n    decorative?: boolean;\n}\n\n/**\n * Directive that adds accessible and configurable separator element to the DOM.\n * This can be either horizontal or vertical and optionally decorative (which removes\n * it from the accessibility tree).\n */\n@Directive({\n    selector: 'div[rdxSeparatorRoot]',\n    standalone: true,\n    host: {\n        '[attr.role]': 'computedRole()',\n        '[attr.aria-orientation]': 'computedAriaOrientation()',\n\n        '[attr.data-orientation]': 'orientation()'\n    }\n})\nexport class RdxSeparatorRootDirective {\n    /**\n     * Orientation of the separator, can be either 'horizontal' or 'vertical'.\n     * Defaults to 'horizontal'.\n     */\n    readonly orientation = input<Orientation>(DEFAULT_ORIENTATION);\n\n    /**\n     * If true, the separator will be considered decorative and removed from\n     * the accessibility tree. Defaults to false.\n     */\n    readonly decorative = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n    /**\n     * Computes the `role` attribute for the separator. If `decorative` is true,\n     * the role is set to \"none\", otherwise it is \"separator\".\n     */\n    protected readonly computedRole = computed(() => (this.decorative() ? 'none' : 'separator'));\n\n    /**\n     * Computes the `aria-orientation` attribute. It is set to \"vertical\" only if\n     * the separator is not decorative and the orientation is set to \"vertical\".\n     * For horizontal orientation, the attribute is omitted.\n     */\n    protected readonly computedAriaOrientation = computed(() =>\n        !this.decorative() && this.orientation() === 'vertical' ? 'vertical' : null\n    );\n}\n",
             "selector": "div[rdxSeparatorRoot]",
             "providers": [],
             "hostDirectives": [],
             "standalone": true,
             "inputsClass": [
-                {
-                    "required": false,
-                    "name": "decorative",
-                    "defaultValue": "false",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "line": 34,
-                    "type": "boolean",
-                    "decorators": []
-                },
                 {
                     "name": "orientation",
                     "defaultValue": "DEFAULT_ORIENTATION",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "line": 32,
-                    "type": "Orientation",
-                    "decorators": []
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>Orientation of the separator, can be either &#39;horizontal&#39; or &#39;vertical&#39;.\nDefaults to &#39;horizontal&#39;.</p>\n",
+                    "line": 43,
+                    "rawdescription": "\n\nOrientation of the separator, can be either 'horizontal' or 'vertical'.\nDefaults to 'horizontal'.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
                 }
             ],
             "outputsClass": [],
@@ -7723,12 +7814,69 @@
             "deprecationMessage": "",
             "hostBindings": [],
             "hostListeners": [],
-            "propertiesClass": [],
+            "propertiesClass": [
+                {
+                    "name": "computedAriaOrientation",
+                    "defaultValue": "computed(() =>\n        !this.decorative() && this.orientation() === 'vertical' ? 'vertical' : null\n    )",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>Computes the <code>aria-orientation</code> attribute. It is set to &quot;vertical&quot; only if\nthe separator is not decorative and the orientation is set to &quot;vertical&quot;.\nFor horizontal orientation, the attribute is omitted.</p>\n",
+                    "line": 62,
+                    "rawdescription": "\n\nComputes the `aria-orientation` attribute. It is set to \"vertical\" only if\nthe separator is not decorative and the orientation is set to \"vertical\".\nFor horizontal orientation, the attribute is omitted.\n",
+                    "modifierKind": [
+                        124,
+                        148
+                    ]
+                },
+                {
+                    "name": "computedRole",
+                    "defaultValue": "computed(() => (this.decorative() ? 'none' : 'separator'))",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>Computes the <code>role</code> attribute for the separator. If <code>decorative</code> is true,\nthe role is set to &quot;none&quot;, otherwise it is &quot;separator&quot;.</p>\n",
+                    "line": 55,
+                    "rawdescription": "\n\nComputes the `role` attribute for the separator. If `decorative` is true,\nthe role is set to \"none\", otherwise it is \"separator\".\n",
+                    "modifierKind": [
+                        124,
+                        148
+                    ]
+                },
+                {
+                    "name": "decorative",
+                    "defaultValue": "input<boolean, BooleanInput>(false, { transform: booleanAttribute })",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>If true, the separator will be considered decorative and removed from\nthe accessibility tree. Defaults to false.</p>\n",
+                    "line": 49,
+                    "rawdescription": "\n\nIf true, the separator will be considered decorative and removed from\nthe accessibility tree. Defaults to false.\n",
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "orientation",
+                    "defaultValue": "DEFAULT_ORIENTATION",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>Orientation of the separator, can be either &#39;horizontal&#39; or &#39;vertical&#39;.\nDefaults to &#39;horizontal&#39;.</p>\n",
+                    "line": 43,
+                    "rawdescription": "\n\nOrientation of the separator, can be either 'horizontal' or 'vertical'.\nDefaults to 'horizontal'.\n",
+                    "modifierKind": [
+                        148
+                    ],
+                    "required": false
+                }
+            ],
             "methodsClass": [],
-            "extends": [],
-            "implements": [
-                "SeparatorProps"
-            ]
+            "extends": []
         },
         {
             "name": "RdxSliderDirective",
@@ -7893,21 +8041,17 @@
         },
         {
             "name": "RdxSwitchRootDirective",
-            "id": "directive-RdxSwitchRootDirective-b38377551dbe8df1a02039592e5cef35095983dcd5cf8461966049b698303e9d4ded61b0f28af5c82665d0aff8fcc25fb00bfaedb3395ad35300c8a9a4cd7331",
+            "id": "directive-RdxSwitchRootDirective-a1d1ce9095ddd803dd1679e08e7914e7bbc821178d609e91909c39171ce2013fa88949495d3569fcd36dc50f9ffd58e50d69a30df9f1344c8d7f6610de2d389f",
             "file": "switch/src/switch-root.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n    booleanAttribute,\n    computed,\n    Directive,\n    EventEmitter,\n    inject,\n    InjectionToken,\n    input,\n    InputSignalWithTransform,\n    model,\n    ModelSignal,\n    Output\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nexport const RdxSwitchToken = new InjectionToken<RdxSwitchRootDirective>('RdxSwitchToken');\n\nexport function injectSwitch(): RdxSwitchRootDirective {\n    return inject(RdxSwitchToken);\n}\n\nexport interface SwitchProps {\n    checked?: ModelSignal<boolean>;\n    defaultChecked?: boolean;\n    required?: InputSignalWithTransform<boolean, BooleanInput>;\n    onCheckedChange?: EventEmitter<boolean>;\n}\n\nlet idIterator = 0;\n\n@Directive({\n    selector: 'button[rdxSwitchRoot]',\n    exportAs: 'rdxSwitchRoot',\n    standalone: true,\n    providers: [\n        { provide: RdxSwitchToken, useExisting: RdxSwitchRootDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxSwitchRootDirective, multi: true }\n    ],\n    host: {\n        role: 'switch',\n        type: 'button',\n        '[id]': 'elementId()',\n        '[attr.aria-checked]': 'checked()',\n        '[attr.aria-required]': 'required',\n        '[attr.data-state]': 'checked() ? \"checked\" : \"unchecked\"',\n        '[attr.data-disabled]': 'disabledState() ? \"true\" : null',\n        '[attr.disabled]': 'disabledState() ? disabledState() : null',\n\n        '(focus)': '_onTouched?.()',\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxSwitchRootDirective implements SwitchProps, ControlValueAccessor {\n    readonly id = input<string>(`rdx-switch-${idIterator++}`);\n    protected readonly elementId = computed(() => (this.id() ? this.id() : null));\n\n    // When true, indicates that the user must check\n    // the switch before the owning form can be submitted.\n    readonly required = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    // The controlled state of the switch\n    readonly checked = model<boolean>(false);\n\n    // When true, prevents the user from interacting with the switch.\n    readonly disabled = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    /*\n     * @ignore\n     */\n    readonly disabledState = computed(() => this.disabled());\n\n    @Output() onCheckedChange = new EventEmitter<boolean>();\n\n    /**\n     * The method to be called in order to update ngModel.\n     */\n    _onChange?: (checked: boolean) => void;\n\n    /**\n     * onTouch function registered via registerOnTouch (ControlValueAccessor).\n     */\n    _onTouched?: () => void;\n\n    /**\n     * Registers a function to call when the checked state changes.\n     * @param fn Function to call on change.\n     */\n    registerOnChange(fn: (checked: boolean) => void): void {\n        this._onChange = fn;\n    }\n\n    /**\n     * Registers a function to call when the component is touched.\n     * @param fn Function to call on touch.\n     */\n    registerOnTouched(fn: () => void): void {\n        this._onTouched = fn;\n    }\n\n    /**\n     * Writes a new value to the model.\n     * @param checked The new checked value.\n     */\n    writeValue(checked: boolean): void {\n        this.checked.set(checked);\n    }\n\n    /**\n     * Toggles the checked state of the switch.\n     * If the switch is disabled, the function returns early.\n     */\n    protected toggle(): void {\n        if (this.disabledState()) {\n            return;\n        }\n\n        this.checked.set(!this.checked());\n        this._onChange?.(this.checked());\n\n        this.onCheckedChange.emit(this.checked());\n    }\n}\n",
+            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n    booleanAttribute,\n    computed,\n    Directive,\n    inject,\n    InjectionToken,\n    input,\n    InputSignalWithTransform,\n    model,\n    ModelSignal,\n    output,\n    OutputEmitterRef\n} from '@angular/core';\n\nexport const RdxSwitchToken = new InjectionToken<RdxSwitchRootDirective>('RdxSwitchToken');\n\nexport function injectSwitch(): RdxSwitchRootDirective {\n    return inject(RdxSwitchToken);\n}\n\nexport interface SwitchProps {\n    checked?: ModelSignal<boolean>;\n    defaultChecked?: boolean;\n    required?: InputSignalWithTransform<boolean, BooleanInput>;\n    onCheckedChange?: OutputEmitterRef<boolean>;\n}\n\nlet idIterator = 0;\n\n@Directive({\n    selector: 'button[rdxSwitchRoot]',\n    exportAs: 'rdxSwitchRoot',\n    standalone: true,\n    providers: [\n        { provide: RdxSwitchToken, useExisting: RdxSwitchRootDirective }],\n    host: {\n        role: 'switch',\n        type: 'button',\n        '[id]': 'elementId()',\n        '[attr.aria-checked]': 'checked()',\n        '[attr.aria-required]': 'required',\n        '[attr.data-state]': 'checked() ? \"checked\" : \"unchecked\"',\n        '[attr.data-disabled]': 'disabledState() ? \"true\" : null',\n        '[attr.disabled]': 'disabledState() ? disabledState() : null',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxSwitchRootDirective implements SwitchProps {\n    readonly id = input<string>(`rdx-switch-${idIterator++}`);\n    protected readonly elementId = computed(() => (this.id() ? this.id() : null));\n\n    /**\n     * When true, indicates that the user must check the switch before the owning form can be submitted.\n     */\n    readonly required = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    /**\n     * The controlled state of the switch. Must be used in conjunction with onCheckedChange.\n     */\n    readonly checked = model<boolean>(false);\n\n    /**\n     * When true, prevents the user from interacting with the switch.\n     */\n    readonly disabled = input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    });\n\n    /*\n     * @ignore\n     */\n    readonly disabledState = computed(() => this.disabled());\n\n    /**\n     * Event handler called when the state of the switch changes.\n     */\n    readonly onCheckedChange = output<boolean>();\n\n    /**\n     * Toggles the checked state of the switch.\n     * If the switch is disabled, the function returns early.\n     */\n    protected toggle(): void {\n        if (this.disabledState()) {\n            return;\n        }\n\n        this.checked.set(!this.checked());\n\n        this.onCheckedChange.emit(this.checked());\n    }\n}\n",
             "selector": "button[rdxSwitchRoot]",
             "providers": [
                 {
                     "name": "{ provide: RdxSwitchToken, useExisting: RdxSwitchRootDirective }",
                     "type": "directive"
-                },
-                {
-                    "name": "{ provide: NG_VALUE_ACCESSOR, useExisting: RdxSwitchRootDirective, multi: true }",
-                    "type": "directive"
                 }
             ],
             "exportAs": "rdxSwitchRoot",
@@ -7921,49 +8065,21 @@
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 65,
+                    "description": "<p>The controlled state of the switch. Must be used in conjunction with onCheckedChange.</p>\n",
+                    "line": 64,
+                    "rawdescription": "\n\nThe controlled state of the switch. Must be used in conjunction with onCheckedChange.\n",
                     "modifierKind": [
                         148
                     ],
                     "required": false
                 }
             ],
-            "outputsClass": [
-                {
-                    "name": "onCheckedChange",
-                    "defaultValue": "new EventEmitter<boolean>()",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "line": 77,
-                    "type": "EventEmitter"
-                }
-            ],
+            "outputsClass": [],
             "deprecated": false,
             "deprecationMessage": "",
             "hostBindings": [],
             "hostListeners": [],
             "propertiesClass": [
-                {
-                    "name": "_onChange",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "type": "function",
-                    "optional": true,
-                    "description": "<p>The method to be called in order to update ngModel.</p>\n",
-                    "line": 82,
-                    "rawdescription": "\n\nThe method to be called in order to update ngModel.\n"
-                },
-                {
-                    "name": "_onTouched",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "type": "function",
-                    "optional": true,
-                    "description": "<p>onTouch function registered via registerOnTouch (ControlValueAccessor).</p>\n",
-                    "line": 87,
-                    "rawdescription": "\n\nonTouch function registered via registerOnTouch (ControlValueAccessor).\n"
-                },
                 {
                     "name": "checked",
                     "defaultValue": "false",
@@ -7971,8 +8087,9 @@
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 65,
+                    "description": "<p>The controlled state of the switch. Must be used in conjunction with onCheckedChange.</p>\n",
+                    "line": 64,
+                    "rawdescription": "\n\nThe controlled state of the switch. Must be used in conjunction with onCheckedChange.\n",
                     "modifierKind": [
                         148
                     ],
@@ -7985,8 +8102,9 @@
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 68,
+                    "description": "<p>When true, prevents the user from interacting with the switch.</p>\n",
+                    "line": 69,
+                    "rawdescription": "\n\nWhen true, prevents the user from interacting with the switch.\n",
                     "modifierKind": [
                         148
                     ]
@@ -7999,7 +8117,7 @@
                     "type": "",
                     "optional": false,
                     "description": "",
-                    "line": 75,
+                    "line": 76,
                     "modifierKind": [
                         148
                     ]
@@ -8012,7 +8130,7 @@
                     "type": "",
                     "optional": false,
                     "description": "",
-                    "line": 56,
+                    "line": 52,
                     "modifierKind": [
                         124,
                         148
@@ -8026,141 +8144,48 @@
                     "type": "",
                     "optional": false,
                     "description": "",
-                    "line": 55,
+                    "line": 51,
                     "modifierKind": [
                         148
                     ]
                 },
                 {
-                    "name": "required",
-                    "defaultValue": "input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    })",
+                    "name": "onCheckedChange",
+                    "defaultValue": "output<boolean>()",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 60,
+                    "description": "<p>Event handler called when the state of the switch changes.</p>\n",
+                    "line": 81,
+                    "rawdescription": "\n\nEvent handler called when the state of the switch changes.\n",
                     "modifierKind": [
                         148
                     ]
-                }
-            ],
-            "methodsClass": [
-                {
-                    "name": "registerOnChange",
-                    "args": [
-                        {
-                            "name": "fn",
-                            "type": "function",
-                            "deprecated": false,
-                            "deprecationMessage": "",
-                            "function": [
-                                {
-                                    "name": "checked",
-                                    "type": "boolean",
-                                    "deprecated": false,
-                                    "deprecationMessage": ""
-                                }
-                            ]
-                        }
-                    ],
-                    "optional": false,
-                    "returnType": "void",
-                    "typeParameters": [],
-                    "line": 93,
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nRegisters a function to call when the checked state changes.\n",
-                    "description": "<p>Registers a function to call when the checked state changes.</p>\n",
-                    "jsdoctags": [
-                        {
-                            "name": {
-                                "pos": 2720,
-                                "end": 2722,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "fn"
-                            },
-                            "type": "function",
-                            "deprecated": false,
-                            "deprecationMessage": "",
-                            "function": [
-                                {
-                                    "name": "checked",
-                                    "type": "boolean",
-                                    "deprecated": false,
-                                    "deprecationMessage": ""
-                                }
-                            ],
-                            "tagName": {
-                                "pos": 2714,
-                                "end": 2719,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "param"
-                            },
-                            "comment": "<p>Function to call on change.</p>\n"
-                        }
-                    ]
                 },
                 {
-                    "name": "registerOnTouched",
-                    "args": [
-                        {
-                            "name": "fn",
-                            "type": "function",
-                            "deprecated": false,
-                            "deprecationMessage": "",
-                            "function": []
-                        }
-                    ],
-                    "optional": false,
-                    "returnType": "void",
-                    "typeParameters": [],
-                    "line": 101,
+                    "name": "required",
+                    "defaultValue": "input<boolean, BooleanInput>(false, {\n        transform: booleanAttribute\n    })",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nRegisters a function to call when the component is touched.\n",
-                    "description": "<p>Registers a function to call when the component is touched.</p>\n",
-                    "jsdoctags": [
-                        {
-                            "name": {
-                                "pos": 2945,
-                                "end": 2947,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "fn"
-                            },
-                            "type": "function",
-                            "deprecated": false,
-                            "deprecationMessage": "",
-                            "function": [],
-                            "tagName": {
-                                "pos": 2939,
-                                "end": 2944,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "param"
-                            },
-                            "comment": "<p>Function to call on touch.</p>\n"
-                        }
+                    "type": "",
+                    "optional": false,
+                    "description": "<p>When true, indicates that the user must check the switch before the owning form can be submitted.</p>\n",
+                    "line": 57,
+                    "rawdescription": "\n\nWhen true, indicates that the user must check the switch before the owning form can be submitted.\n",
+                    "modifierKind": [
+                        148
                     ]
-                },
+                }
+            ],
+            "methodsClass": [
                 {
                     "name": "toggle",
                     "args": [],
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 117,
+                    "line": 87,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "rawdescription": "\n\nToggles the checked state of the switch.\nIf the switch is disabled, the function returns early.\n",
@@ -8168,57 +8193,11 @@
                     "modifierKind": [
                         124
                     ]
-                },
-                {
-                    "name": "writeValue",
-                    "args": [
-                        {
-                            "name": "checked",
-                            "type": "boolean",
-                            "deprecated": false,
-                            "deprecationMessage": ""
-                        }
-                    ],
-                    "optional": false,
-                    "returnType": "void",
-                    "typeParameters": [],
-                    "line": 109,
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nWrites a new value to the model.\n",
-                    "description": "<p>Writes a new value to the model.</p>\n",
-                    "jsdoctags": [
-                        {
-                            "name": {
-                                "pos": 3128,
-                                "end": 3135,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "checked"
-                            },
-                            "type": "boolean",
-                            "deprecated": false,
-                            "deprecationMessage": "",
-                            "tagName": {
-                                "pos": 3122,
-                                "end": 3127,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "param"
-                            },
-                            "comment": "<p>The new checked value.</p>\n"
-                        }
-                    ]
                 }
             ],
             "extends": [],
             "implements": [
-                "SwitchProps",
-                "ControlValueAccessor"
+                "SwitchProps"
             ]
         },
         {
@@ -8642,91 +8621,65 @@
         },
         {
             "name": "RdxToggleDirective",
-            "id": "directive-RdxToggleDirective-94be1eb58011efa799af90258505424aecc8486ac9fba7c7b9b37fe9fcc03ea74abc8b303a3dd63c6070953df747036cd920029be0c77da56a93076514dcc4c6",
+            "id": "directive-RdxToggleDirective-0bcbd664ea72aa02f90b3331238e8a118a14b8566bd36067013921c606f502814694751ab854825b1057106f71febb584ae15da9ebef63dc60001540db7e5906",
             "file": "toggle/src/toggle.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import { Directive, EventEmitter, input, model, Output } from '@angular/core';\n\nexport interface ToggleProps {\n    /**\n     * The controlled state of the toggle.\n     */\n    pressed?: boolean;\n    /**\n     * The state of the toggle when initially rendered. Use `defaultPressed`\n     * if you do not need to control the state of the toggle.\n     * @defaultValue false\n     */\n    defaultPressed?: boolean;\n    /**\n     * The callback that fires when the state of the toggle changes.\n     */\n    onPressedChange?: EventEmitter<boolean>;\n}\n\n@Directive({\n    selector: 'button[rdxToggle]',\n    exportAs: 'rdxToggle',\n    standalone: true,\n    host: {\n        type: 'button',\n        '[attr.aria-pressed]': 'pressed()',\n        '[attr.data-state]': 'pressed() ? \"on\" : \"off\"',\n        '[attr.data-disabled]': 'disabled()',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxToggleDirective {\n    readonly defaultPressed = input<boolean>(false);\n    readonly pressed = model<boolean>(this.defaultPressed());\n    readonly disabled = input<boolean>(false);\n\n    /**\n     * Event emitted when the toggle is pressed.\n     */\n    @Output() readonly onPressedChange = new EventEmitter<boolean>();\n\n    protected toggle(): void {\n        if (!this.disabled()) {\n            this.pressed.set(!this.pressed());\n            this.onPressedChange.emit(this.pressed());\n        }\n    }\n}\n",
-            "selector": "button[rdxToggle]",
+            "sourceCode": "import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, input, model, output, OutputEmitterRef } from '@angular/core';\n\nexport interface ToggleProps {\n    /**\n     * The controlled state of the toggle.\n     */\n    pressed?: boolean;\n\n    /**\n     * The state of the toggle when initially rendered. Use `defaultPressed`\n     * if you do not need to control the state of the toggle.\n     * @defaultValue false\n     */\n    defaultPressed?: boolean;\n\n    /**\n     * The callback that fires when the state of the toggle changes.\n     */\n    onPressedChange?: OutputEmitterRef<boolean>;\n\n    /**\n     * Whether the toggle is disabled.\n     * @defaultValue false\n     */\n    disabled?: boolean;\n}\n\n@Directive({\n    selector: '[rdxToggle]',\n    exportAs: 'rdxToggle',\n    standalone: true,\n    host: {\n        type: 'button',\n        '[attr.aria-pressed]': 'pressed()',\n        '[attr.data-state]': 'pressed() ? \"on\" : \"off\"',\n        '[attr.data-disabled]': 'disabled()',\n        '[disabled]': 'disabled()',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxToggleDirective {\n    /**\n     * The pressed state of the toggle when it is initially rendered.\n     * Use when you do not need to control its pressed state.\n     */\n    readonly defaultPressed = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n    /**\n     * The controlled pressed state of the toggle.\n     * Must be used in conjunction with `onPressedChange`.\n     */\n    readonly pressed = model<boolean>(this.defaultPressed());\n\n    /**\n     * When true, prevents the user from interacting with the toggle.\n     */\n    readonly disabled = input<boolean, BooleanInput>(false, { transform: booleanAttribute });\n\n    /**\n     * Event handler called when the pressed state of the toggle changes.\n     */\n    readonly onPressedChange = output<boolean>();\n\n    protected toggle(): void {\n        if (!this.disabled()) {\n            this.pressed.set(!this.pressed());\n            this.onPressedChange.emit(this.pressed());\n        }\n    }\n}\n",
+            "selector": "[rdxToggle]",
             "providers": [],
             "exportAs": "rdxToggle",
             "hostDirectives": [],
             "standalone": true,
-            "inputsClass": [
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [
                 {
                     "name": "defaultPressed",
-                    "defaultValue": "false",
+                    "defaultValue": "input<boolean, BooleanInput>(false, { transform: booleanAttribute })",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 34,
+                    "description": "<p>The pressed state of the toggle when it is initially rendered.\nUse when you do not need to control its pressed state.</p>\n",
+                    "line": 48,
+                    "rawdescription": "\n\nThe pressed state of the toggle when it is initially rendered.\nUse when you do not need to control its pressed state.\n",
                     "modifierKind": [
                         148
-                    ],
-                    "required": false
+                    ]
                 },
                 {
                     "name": "disabled",
-                    "defaultValue": "false",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "type": "",
-                    "optional": false,
-                    "description": "",
-                    "line": 36,
-                    "modifierKind": [
-                        148
-                    ],
-                    "required": false
-                }
-            ],
-            "outputsClass": [
-                {
-                    "name": "onPressedChange",
-                    "defaultValue": "new EventEmitter<boolean>()",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "rawdescription": "\n\nEvent emitted when the toggle is pressed.\n",
-                    "description": "<p>Event emitted when the toggle is pressed.</p>\n",
-                    "line": 41,
-                    "type": "EventEmitter"
-                }
-            ],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [
-                {
-                    "name": "defaultPressed",
-                    "defaultValue": "false",
+                    "defaultValue": "input<boolean, BooleanInput>(false, { transform: booleanAttribute })",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 34,
+                    "description": "<p>When true, prevents the user from interacting with the toggle.</p>\n",
+                    "line": 59,
+                    "rawdescription": "\n\nWhen true, prevents the user from interacting with the toggle.\n",
                     "modifierKind": [
                         148
-                    ],
-                    "required": false
+                    ]
                 },
                 {
-                    "name": "disabled",
-                    "defaultValue": "false",
+                    "name": "onPressedChange",
+                    "defaultValue": "output<boolean>()",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 36,
+                    "description": "<p>Event handler called when the pressed state of the toggle changes.</p>\n",
+                    "line": 64,
+                    "rawdescription": "\n\nEvent handler called when the pressed state of the toggle changes.\n",
                     "modifierKind": [
                         148
-                    ],
-                    "required": false
+                    ]
                 },
                 {
                     "name": "pressed",
@@ -8735,8 +8688,9 @@
                     "deprecationMessage": "",
                     "type": "",
                     "optional": false,
-                    "description": "",
-                    "line": 35,
+                    "description": "<p>The controlled pressed state of the toggle.\nMust be used in conjunction with <code>onPressedChange</code>.</p>\n",
+                    "line": 54,
+                    "rawdescription": "\n\nThe controlled pressed state of the toggle.\nMust be used in conjunction with `onPressedChange`.\n",
                     "modifierKind": [
                         148
                     ]
@@ -8749,7 +8703,7 @@
                     "optional": false,
                     "returnType": "void",
                     "typeParameters": [],
-                    "line": 43,
+                    "line": 66,
                     "deprecated": false,
                     "deprecationMessage": "",
                     "modifierKind": [
@@ -8759,102 +8713,14 @@
             ],
             "extends": []
         },
-        {
-            "name": "RdxToggleGroupButtonDirective",
-            "id": "directive-RdxToggleGroupButtonDirective-eaacd7b8661bf44dd75ecc33aaaf4b8c67bacd659999808fc901edc3cab910438b9a7d4392a7ddd2055f8cc6b0d2fb3be6a4d9711b9f05dbccff195fadf52a51",
-            "file": "toggle-group/src/toggle-group-button.directive.ts",
-            "type": "directive",
-            "description": "",
-            "rawdescription": "\n",
-            "sourceCode": "import { booleanAttribute, Directive, Input, OnChanges, SimpleChanges } from '@angular/core';\nimport { RdxToggleGroupButtonToken } from './toggle-group-button.token';\nimport { injectToggleGroup } from './toggle-group.token';\n\n@Directive({\n    selector: 'button[rdxToggleGroupButton]',\n    standalone: true,\n    providers: [{ provide: RdxToggleGroupButtonToken, useExisting: RdxToggleGroupButtonDirective }],\n    host: {\n        role: 'radio',\n        '[attr.aria-checked]': 'checked',\n        '[attr.aria-disabled]': 'disabled || toggleGroup.disabled',\n        '[attr.data-disabled]': 'disabled || toggleGroup.disabled',\n        '[attr.data-state]': 'checked ? \"on\" : \"off\"',\n        '[attr.data-orientation]': 'toggleGroup.orientation',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxToggleGroupButtonDirective implements OnChanges {\n    /**\n     * Access the toggle group.\n     * @ignore\n     */\n    protected readonly toggleGroup = injectToggleGroup();\n\n    /**\n     * The value of this toggle button.\n     */\n    @Input({ required: true }) value!: string;\n\n    /**\n     * Whether this toggle button is disabled.\n     * @default false\n     */\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    /**\n     * Whether this toggle button is checked.\n     */\n    protected get checked(): boolean {\n        return this.toggleGroup.isSelected(this.value);\n    }\n\n    /**\n     * @ignore\n     */\n    ngOnChanges(changes: SimpleChanges): void {\n        if ('disabled' in changes) {\n            // TODO\n        }\n    }\n\n    /**\n     * @ignore\n     */\n    toggle(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.toggleGroup.toggle(this.value);\n    }\n\n    /**\n     * Ensure the disabled state is propagated to the roving focus item.\n     * @internal\n     * @ignore\n     */\n    updateDisabled(): void {\n        // TODO\n    }\n}\n",
-            "selector": "button[rdxToggleGroupButton]",
-            "providers": [
-                {
-                    "name": "{ provide: RdxToggleGroupButtonToken, useExisting: RdxToggleGroupButtonDirective }",
-                    "type": "directive"
-                }
-            ],
-            "hostDirectives": [],
-            "standalone": true,
-            "inputsClass": [
-                {
-                    "required": false,
-                    "name": "disabled",
-                    "defaultValue": "false",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "jsdoctags": [
-                        {
-                            "pos": 1132,
-                            "end": 1152,
-                            "flags": 16842752,
-                            "modifierFlagsCache": 0,
-                            "transformFlags": 0,
-                            "kind": 334,
-                            "tagName": {
-                                "pos": 1133,
-                                "end": 1140,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "default"
-                            },
-                            "comment": "<p>false</p>\n"
-                        }
-                    ],
-                    "rawdescription": "\n\nWhether this toggle button is disabled.\n",
-                    "description": "<p>Whether this toggle button is disabled.</p>\n",
-                    "line": 36,
-                    "type": "boolean",
-                    "decorators": []
-                },
-                {
-                    "required": true,
-                    "name": "value",
-                    "deprecated": false,
-                    "deprecationMessage": "",
-                    "optional": false,
-                    "rawdescription": "\n\nThe value of this toggle button.\n",
-                    "description": "<p>The value of this toggle button.</p>\n",
-                    "line": 30,
-                    "type": "string",
-                    "decorators": []
-                }
-            ],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
-            "methodsClass": [],
-            "extends": [],
-            "implements": [
-                "OnChanges"
-            ],
-            "accessors": {
-                "checked": {
-                    "name": "checked",
-                    "getSignature": {
-                        "name": "checked",
-                        "type": "boolean",
-                        "returnType": "boolean",
-                        "line": 41,
-                        "rawdescription": "\n\nWhether this toggle button is checked.\n",
-                        "description": "<p>Whether this toggle button is checked.</p>\n"
-                    }
-                }
-            }
-        },
         {
             "name": "RdxToggleGroupDirective",
-            "id": "directive-RdxToggleGroupDirective-0cb70c4d717536b45c29f8751aa5d947fc03b5f2d5685f87673c06050799a46fa34eb6ec382b822b931a8b5f77b502abc73f36e8cb7f0a9304ec3dea40d00b8c",
+            "id": "directive-RdxToggleGroupDirective-a2eb5e3e27c5981ca8cf0a2e50c25e5b9e62fc0c2edf2e6374621ba9697612b4b4e71418691a2d27fe9df21928c6d0c2dfaef44cfd17788bbedf16de4943dc49",
             "file": "toggle-group/src/toggle-group.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    Input,\n    OnChanges,\n    QueryList,\n    SimpleChanges\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';\nimport { RdxToggleGroupButtonToken } from './toggle-group-button.token';\nimport { RdxToggleGroupToken } from './toggle-group.token';\n\n@Directive({\n    selector: '[rdxToggleGroup]',\n    standalone: true,\n    providers: [\n        { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupDirective, multi: true }\n    ],\n    host: {\n        role: 'group',\n        '[attr.data-orientation]': 'orientation',\n        '(focusout)': 'onTouched?.()'\n    }\n})\nexport class RdxToggleGroupDirective implements OnChanges, AfterContentInit, ControlValueAccessor {\n    /**\n     * The selected toggle button.\n     */\n    @Input() value: string | null = null;\n\n    /**\n     * The orientation of the toggle group.\n     * @default 'horizontal'\n     */\n    @Input() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n    /**\n     * Whether the toggle group is disabled.\n     * @default false\n     */\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    /**\n     * Whether the toggle group roving focus should wrap.\n     * @default true\n     */\n    @Input({ transform: booleanAttribute }) wrap = true;\n\n    /**\n     * Event emitted when the selected toggle button changes.\n     */\n    @Input() readonly valueChange = new EventEmitter<string | null>();\n\n    /**\n     * Access the buttons in the toggle group.\n     */\n    @ContentChildren(RdxToggleGroupButtonToken)\n    protected buttons?: QueryList<RdxToggleGroupButtonDirective>;\n\n    /**\n     * The value change callback.\n     */\n    private onChange?: (value: string | null) => void;\n\n    /**\n     * onTouch function registered via registerOnTouch (ControlValueAccessor).\n     */\n    protected onTouched?: () => void;\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if ('disabled' in changes) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n    }\n\n    ngAfterContentInit(): void {\n        if (this.disabled) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n    }\n\n    /**\n     * Determine if a value is selected.\n     * @param value The value to check.\n     * @returns Whether the value is selected.\n     * @internal\n     */\n    isSelected(value: string): boolean {\n        return this.value === value;\n    }\n\n    /**\n     * Toggle a value.\n     * @param value The value to toggle.\n     * @internal\n     */\n    toggle(value: string): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.value = this.value === value ? null : value;\n        this.valueChange.emit(this.value);\n        this.onChange?.(this.value);\n    }\n\n    /**\n     * Select a value from Angular forms.\n     * @param value The value to select.\n     * @internal\n     */\n    writeValue(value: string): void {\n        this.value = value;\n    }\n\n    /**\n     * Register a callback to be called when the value changes.\n     * @param fn The callback to register.\n     * @internal\n     */\n    registerOnChange(fn: (value: string | null) => void): void {\n        this.onChange = fn;\n    }\n\n    /**\n     * Register a callback to be called when the toggle group is touched.\n     * @param fn The callback to register.\n     * @internal\n     */\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    /**\n     * Set the disabled state of the toggle group.\n     * @param isDisabled Whether the toggle group is disabled.\n     * @internal\n     */\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n        this.buttons?.forEach((button) => button.updateDisabled());\n    }\n}\n",
+            "sourceCode": "import { FocusKeyManager } from '@angular/cdk/a11y';\nimport {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    Input,\n    OnChanges,\n    QueryList,\n    SimpleChanges\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport type { RdxToggleGroupItemDirective } from './toggle-group-item.directive';\nimport { RdxToggleGroupItemToken } from './toggle-group-item.token';\nimport { RdxToggleGroupToken } from './toggle-group.token';\n\n@Directive({\n    selector: '[rdxToggleGroup]',\n    exportAs: 'rdxToggleGroup',\n    standalone: true,\n    providers: [\n        { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupDirective, multi: true }\n    ],\n    host: {\n        role: 'group',\n        '[attr.data-orientation]': 'orientation',\n\n        '(focusout)': 'onTouched?.()',\n        '(focusin)': 'onFocusIn()',\n        '(keydown)': 'handleKeydown($event)'\n    }\n})\nexport class RdxToggleGroupDirective implements OnChanges, AfterContentInit, ControlValueAccessor {\n    /**\n     * The selected toggle button.\n     */\n    @Input() value: string | null = null;\n\n    /**\n     * The orientation of the toggle group.\n     * @default 'horizontal'\n     */\n    @Input() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n    /**\n     * Whether the toggle group is disabled.\n     * @default false\n     */\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    /**\n     * Whether the toggle group roving focus should wrap.\n     * @default true\n     */\n    @Input({ transform: booleanAttribute }) wrap = true;\n\n    /**\n     * Event emitted when the selected toggle button changes.\n     */\n    @Input() readonly valueChange = new EventEmitter<string | null>();\n\n    /**\n     * Access the buttons in the toggle group.\n     */\n    @ContentChildren(RdxToggleGroupItemToken)\n    protected buttons?: QueryList<RdxToggleGroupItemDirective>;\n\n    /**\n     * FocusKeyManager to manage keyboard interactions.\n     */\n    private keyManager!: FocusKeyManager<RdxToggleGroupItemDirective>;\n\n    /**\n     * The value change callback.\n     */\n    private onChange?: (value: string | null) => void;\n\n    /**\n     * onTouch function registered via registerOnTouch (ControlValueAccessor).\n     */\n    protected onTouched?: () => void;\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if ('disabled' in changes) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n    }\n\n    ngAfterContentInit(): void {\n        if (this.disabled) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n\n        if (this.buttons) {\n            this.keyManager = new FocusKeyManager(this.buttons).withWrap();\n        }\n    }\n\n    protected onFocusIn(): void {\n        if (!this.keyManager.activeItem) {\n            this.keyManager.setFirstItemActive();\n        }\n    }\n\n    protected handleKeydown(event: KeyboardEvent): void {\n        switch (event.key) {\n            case 'ArrowRight':\n            case 'ArrowDown':\n                this.keyManager.setNextItemActive();\n                event.preventDefault();\n                break;\n            case 'ArrowLeft':\n            case 'ArrowUp':\n                this.keyManager.setPreviousItemActive();\n                event.preventDefault();\n                break;\n            case 'Home':\n                this.keyManager.setFirstItemActive();\n                event.preventDefault();\n                break;\n            case 'End':\n                this.keyManager.setLastItemActive();\n                event.preventDefault();\n                break;\n            case 'Enter':\n            case ' ':\n                // eslint-disable-next-line no-case-declarations\n                const activeItem = this.keyManager.activeItem;\n                if (activeItem) {\n                    activeItem.toggle();\n                }\n                event.preventDefault();\n                break;\n            default:\n                break;\n        }\n    }\n\n    /**\n     * Determine if a value is selected.\n     * @param value The value to check.\n     * @returns Whether the value is selected.\n     * @internal\n     */\n    isSelected(value: string): boolean {\n        return this.value === value;\n    }\n\n    /**\n     * Toggle a value.\n     * @param value The value to toggle.\n     * @internal\n     */\n    toggle(value: string): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.value = this.value === value ? null : value;\n        this.valueChange.emit(this.value);\n        this.onChange?.(this.value);\n    }\n\n    /**\n     * Select a value from Angular forms.\n     * @param value The value to select.\n     * @internal\n     */\n    writeValue(value: string): void {\n        this.value = value;\n    }\n\n    /**\n     * Register a callback to be called when the value changes.\n     * @param fn The callback to register.\n     * @internal\n     */\n    registerOnChange(fn: (value: string | null) => void): void {\n        this.onChange = fn;\n    }\n\n    /**\n     * Register a callback to be called when the toggle group is touched.\n     * @param fn The callback to register.\n     * @internal\n     */\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    /**\n     * Set the disabled state of the toggle group.\n     * @param isDisabled Whether the toggle group is disabled.\n     * @internal\n     */\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n        this.buttons?.forEach((button) => button.updateDisabled());\n    }\n}\n",
             "selector": "[rdxToggleGroup]",
             "providers": [
                 {
@@ -8866,6 +8732,7 @@
                     "type": "directive"
                 }
             ],
+            "exportAs": "rdxToggleGroup",
             "hostDirectives": [],
             "standalone": true,
             "inputsClass": [
@@ -8877,15 +8744,15 @@
                     "deprecationMessage": "",
                     "jsdoctags": [
                         {
-                            "pos": 1291,
-                            "end": 1311,
+                            "pos": 1451,
+                            "end": 1471,
                             "flags": 16842752,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 1292,
-                                "end": 1299,
+                                "pos": 1452,
+                                "end": 1459,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -8897,7 +8764,7 @@
                     ],
                     "rawdescription": "\n\nWhether the toggle group is disabled.\n",
                     "description": "<p>Whether the toggle group is disabled.</p>\n",
-                    "line": 46,
+                    "line": 51,
                     "type": "boolean",
                     "decorators": []
                 },
@@ -8908,15 +8775,15 @@
                     "deprecationMessage": "",
                     "jsdoctags": [
                         {
-                            "pos": 1132,
-                            "end": 1159,
+                            "pos": 1292,
+                            "end": 1319,
                             "flags": 16842752,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 1133,
-                                "end": 1140,
+                                "pos": 1293,
+                                "end": 1300,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -8928,7 +8795,7 @@
                     ],
                     "rawdescription": "\n\nThe orientation of the toggle group.\n",
                     "description": "<p>The orientation of the toggle group.</p>\n",
-                    "line": 40,
+                    "line": 45,
                     "type": "\"horizontal\" | \"vertical\"",
                     "decorators": []
                 },
@@ -8939,7 +8806,7 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nThe selected toggle button.\n",
                     "description": "<p>The selected toggle button.</p>\n",
-                    "line": 34,
+                    "line": 39,
                     "type": "string | null",
                     "decorators": []
                 },
@@ -8950,7 +8817,7 @@
                     "deprecationMessage": "",
                     "rawdescription": "\n\nEvent emitted when the selected toggle button changes.\n",
                     "description": "<p>Event emitted when the selected toggle button changes.</p>\n",
-                    "line": 57,
+                    "line": 62,
                     "type": "any",
                     "decorators": []
                 },
@@ -8962,15 +8829,15 @@
                     "deprecationMessage": "",
                     "jsdoctags": [
                         {
-                            "pos": 1450,
-                            "end": 1469,
+                            "pos": 1610,
+                            "end": 1629,
                             "flags": 16842752,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 1451,
-                                "end": 1458,
+                                "pos": 1611,
+                                "end": 1618,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -8982,7 +8849,7 @@
                     ],
                     "rawdescription": "\n\nWhether the toggle group roving focus should wrap.\n",
                     "description": "<p>Whether the toggle group roving focus should wrap.</p>\n",
-                    "line": 52,
+                    "line": 57,
                     "type": "boolean",
                     "decorators": []
                 }
@@ -8997,15 +8864,15 @@
                     "name": "buttons",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "type": "QueryList<RdxToggleGroupButtonDirective>",
+                    "type": "QueryList<RdxToggleGroupItemDirective>",
                     "optional": true,
                     "description": "<p>Access the buttons in the toggle group.</p>\n",
-                    "line": 63,
+                    "line": 68,
                     "rawdescription": "\n\nAccess the buttons in the toggle group.\n",
                     "decorators": [
                         {
                             "name": "ContentChildren",
-                            "stringifiedArguments": "RdxToggleGroupButtonToken"
+                            "stringifiedArguments": "RdxToggleGroupItemToken"
                         }
                     ],
                     "modifierKind": [
@@ -9020,14 +8887,59 @@
                     "type": "function",
                     "optional": true,
                     "description": "<p>onTouch function registered via registerOnTouch (ControlValueAccessor).</p>\n",
-                    "line": 73,
+                    "line": 83,
                     "rawdescription": "\n\nonTouch function registered via registerOnTouch (ControlValueAccessor).\n",
                     "modifierKind": [
                         124
                     ]
                 }
             ],
-            "methodsClass": [],
+            "methodsClass": [
+                {
+                    "name": "handleKeydown",
+                    "args": [
+                        {
+                            "name": "event",
+                            "type": "KeyboardEvent",
+                            "deprecated": false,
+                            "deprecationMessage": ""
+                        }
+                    ],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 107,
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "modifierKind": [
+                        124
+                    ],
+                    "jsdoctags": [
+                        {
+                            "name": "event",
+                            "type": "KeyboardEvent",
+                            "deprecated": false,
+                            "deprecationMessage": "",
+                            "tagName": {
+                                "text": "param"
+                            }
+                        }
+                    ]
+                },
+                {
+                    "name": "onFocusIn",
+                    "args": [],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 101,
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "modifierKind": [
+                        124
+                    ]
+                }
+            ],
             "extends": [],
             "implements": [
                 "OnChanges",
@@ -9036,44 +8948,41 @@
             ]
         },
         {
-            "name": "RdxToggleGroupMultiDirective",
-            "id": "directive-RdxToggleGroupMultiDirective-f3beaa34f2f86e55f7ac23cdd00ed5ae4eb938c2eeabb8428eab97c777fceb078eb424788ea139cb8152f27c9a119b5d22744c52e746508c37c8fb0796ccec55",
-            "file": "toggle-group/src/toggle-group-multi.directive.ts",
+            "name": "RdxToggleGroupItemDirective",
+            "id": "directive-RdxToggleGroupItemDirective-687d59a75d8d7f33d385f82fdc4bbce77cba1472dd53ad79bfb1dd48559c4ba1bc22d43207e97a0d2bda91a93cd9845a9e7906ffd2dc266f20cdaaf277ce96db",
+            "file": "toggle-group/src/toggle-group-item.directive.ts",
             "type": "directive",
             "description": "",
             "rawdescription": "\n",
-            "sourceCode": "import {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    Input,\n    OnChanges,\n    QueryList,\n    SimpleChanges\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';\nimport { RdxToggleGroupButtonToken } from './toggle-group-button.token';\nimport { RdxToggleGroupToken } from './toggle-group.token';\n\n@Directive({\n    selector: '[rdxToggleGroupMulti]',\n    standalone: true,\n    providers: [\n        { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultiDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultiDirective, multi: true }\n    ],\n    host: {\n        role: 'group',\n        '[attr.data-orientation]': 'orientation',\n        '(focusout)': 'onTouched?.()'\n    }\n})\nexport class RdxToggleGroupMultiDirective implements OnChanges, AfterContentInit, ControlValueAccessor {\n    /**\n     * The selected toggle button.\n     */\n    @Input('rdxToggleGroupMultiValue') value: ReadonlyArray<string> = [];\n\n    /**\n     * The orientation of the toggle group.\n     * @default 'horizontal'\n     */\n    @Input('rdxToggleGroupMultiOrientation') orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n    /**\n     * Whether the toggle group is disabled.\n     * @default false\n     */\n    @Input({ alias: 'rdxToggleGroupMultiDisabled', transform: booleanAttribute }) disabled = false;\n\n    /**\n     * Whether the toggle group roving focus should wrap.\n     * @default true\n     */\n    @Input({ alias: 'rdxToggleGroupMultiWrap', transform: booleanAttribute }) wrap = true;\n\n    /**\n     * Event emitted when the selected toggle button changes.\n     */\n    @Input('rdxToggleGroupMultiValueChange') readonly valueChange = new EventEmitter<ReadonlyArray<string>>();\n\n    /**\n     * Access the buttons in the toggle group.\n     * @ignore\n     */\n    @ContentChildren(RdxToggleGroupButtonToken)\n    protected buttons?: QueryList<RdxToggleGroupButtonDirective>;\n\n    /**\n     * The value change callback.\n     * @ignore\n     */\n    private onChange?: (value: ReadonlyArray<string>) => void;\n\n    /**\n     * onTouch function registered via registerOnTouch (ControlValueAccessor).\n     * @ignore\n     */\n    protected onTouched?: () => void;\n\n    /**\n     * @ignore\n     */\n    ngOnChanges(changes: SimpleChanges): void {\n        if ('disabled' in changes) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n    }\n\n    /**\n     * @ignore\n     */\n    ngAfterContentInit(): void {\n        if (this.disabled) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n    }\n\n    /**\n     * Determine if a value is selected.\n     * @param value The value to check.\n     * @returns Whether the value is selected.\n     * @ignore\n     */\n    isSelected(value: string): boolean {\n        return this.value.includes(value);\n    }\n\n    /**\n     * Toggle a value.\n     * @param value The value to toggle.\n     * @ignore\n     */\n    toggle(value: string): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.value = this.value.includes(value) ? this.value.filter((v) => v !== value) : [...this.value, value];\n\n        this.valueChange.emit(this.value);\n        this.onChange?.(this.value);\n    }\n\n    /**\n     * Select a value from Angular forms.\n     * @param value The value to select.\n     * @ignore\n     */\n    writeValue(value: ReadonlyArray<string>): void {\n        this.value = value;\n    }\n\n    /**\n     * Register a callback to be called when the value changes.\n     * @param fn The callback to register.\n     * @ignore\n     */\n    registerOnChange(fn: (value: ReadonlyArray<string>) => void): void {\n        this.onChange = fn;\n    }\n\n    /**\n     * Register a callback to be called when the toggle group is touched.\n     * @param fn The callback to register.\n     * @ignore\n     */\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    /**\n     * Set the disabled state of the toggle group.\n     * @param isDisabled Whether the toggle group is disabled.\n     * @ignore\n     */\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n        this.buttons?.forEach((button) => button.updateDisabled());\n    }\n}\n",
-            "selector": "[rdxToggleGroupMulti]",
+            "sourceCode": "import { FocusableOption } from '@angular/cdk/a11y';\nimport { booleanAttribute, Directive, ElementRef, inject, Input, OnChanges, SimpleChanges } from '@angular/core';\nimport { RdxToggleGroupItemToken } from './toggle-group-item.token';\nimport { injectToggleGroup } from './toggle-group.token';\n\n@Directive({\n    selector: '[rdxToggleGroupItem]',\n    exportAs: 'rdxToggleGroupItem',\n    standalone: true,\n    providers: [{ provide: RdxToggleGroupItemToken, useExisting: RdxToggleGroupItemDirective }],\n    host: {\n        role: 'radio',\n        '[attr.aria-checked]': 'checked',\n        '[attr.aria-disabled]': 'disabled || toggleGroup.disabled',\n        '[attr.aria-pressed]': 'undefined',\n\n        '[attr.data-disabled]': 'disabled || toggleGroup.disabled',\n        '[attr.data-state]': 'checked ? \"on\" : \"off\"',\n        '[attr.data-orientation]': 'toggleGroup.orientation',\n\n        '(click)': 'toggle()'\n    }\n})\nexport class RdxToggleGroupItemDirective implements OnChanges, FocusableOption {\n    /**\n     * Access the toggle group.\n     * @ignore\n     */\n    protected readonly toggleGroup = injectToggleGroup();\n\n    private readonly elementRef = inject(ElementRef);\n    /**\n     * The value of this toggle button.\n     */\n    @Input({ required: true }) value!: string;\n\n    /**\n     * Whether this toggle button is disabled.\n     * @default false\n     */\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    /**\n     * Whether this toggle button is checked.\n     */\n    protected get checked(): boolean {\n        return this.toggleGroup.isSelected(this.value);\n    }\n\n    /**\n     * @ignore\n     */\n    ngOnChanges(changes: SimpleChanges): void {\n        if ('disabled' in changes) {\n            // TODO\n        }\n    }\n\n    /**\n     * @ignore\n     */\n    focus(): void {\n        this.elementRef.nativeElement.focus();\n    }\n\n    /**\n     * @ignore\n     */\n    toggle(): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.toggleGroup.toggle(this.value);\n    }\n\n    /**\n     * Ensure the disabled state is propagated to the roving focus item.\n     * @internal\n     * @ignore\n     */\n    updateDisabled(): void {\n        // TODO\n    }\n}\n",
+            "selector": "[rdxToggleGroupItem]",
             "providers": [
                 {
-                    "name": "{ provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultiDirective }",
-                    "type": "directive"
-                },
-                {
-                    "name": "{ provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultiDirective, multi: true }",
+                    "name": "{ provide: RdxToggleGroupItemToken, useExisting: RdxToggleGroupItemDirective }",
                     "type": "directive"
                 }
             ],
+            "exportAs": "rdxToggleGroupItem",
             "hostDirectives": [],
             "standalone": true,
             "inputsClass": [
                 {
                     "required": false,
-                    "name": "rdxToggleGroupMultiDisabled",
+                    "name": "disabled",
                     "defaultValue": "false",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "jsdoctags": [
                         {
-                            "pos": 1375,
-                            "end": 1395,
+                            "pos": 1339,
+                            "end": 1359,
                             "flags": 16842752,
                             "modifierFlagsCache": 0,
                             "transformFlags": 0,
                             "kind": 334,
                             "tagName": {
-                                "pos": 1376,
-                                "end": 1383,
+                                "pos": 1340,
+                                "end": 1347,
                                 "flags": 16842752,
                                 "modifierFlagsCache": 0,
                                 "transformFlags": 0,
@@ -9083,110 +8992,546 @@
                             "comment": "<p>false</p>\n"
                         }
                     ],
-                    "rawdescription": "\n\nWhether the toggle group is disabled.\n",
-                    "description": "<p>Whether the toggle group is disabled.</p>\n",
-                    "line": 46,
+                    "rawdescription": "\n\nWhether this toggle button is disabled.\n",
+                    "description": "<p>Whether this toggle button is disabled.</p>\n",
+                    "line": 41,
                     "type": "boolean",
                     "decorators": []
                 },
                 {
-                    "name": "rdxToggleGroupMultiOrientation",
-                    "defaultValue": "'horizontal'",
+                    "required": true,
+                    "name": "value",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "optional": false,
+                    "rawdescription": "\n\nThe value of this toggle button.\n",
+                    "description": "<p>The value of this toggle button.</p>\n",
+                    "line": 35,
+                    "type": "string",
+                    "decorators": []
+                }
+            ],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [],
+            "extends": [],
+            "implements": [
+                "OnChanges",
+                "FocusableOption"
+            ],
+            "accessors": {
+                "checked": {
+                    "name": "checked",
+                    "getSignature": {
+                        "name": "checked",
+                        "type": "boolean",
+                        "returnType": "boolean",
+                        "line": 46,
+                        "rawdescription": "\n\nWhether this toggle button is checked.\n",
+                        "description": "<p>Whether this toggle button is checked.</p>\n"
+                    }
+                }
+            }
+        },
+        {
+            "name": "RdxToggleGroupMultipleDirective",
+            "id": "directive-RdxToggleGroupMultipleDirective-02fedd3015562ba7140c1e0e2cb6727c520f803ac25988f382a2311a05795cbbec8daa1138b5833c3d67ef1215b6b3445a922a154ea56120e578e0b7bb540642",
+            "file": "toggle-group/src/toggle-group-multiple.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { FocusKeyManager } from '@angular/cdk/a11y';\nimport {\n    AfterContentInit,\n    booleanAttribute,\n    ContentChildren,\n    Directive,\n    EventEmitter,\n    Input,\n    OnChanges,\n    QueryList,\n    SimpleChanges\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport type { RdxToggleGroupItemDirective } from './toggle-group-item.directive';\nimport { RdxToggleGroupItemToken } from './toggle-group-item.token';\nimport { RdxToggleGroupToken } from './toggle-group.token';\n\n@Directive({\n    selector: '[rdxToggleGroupMultiple]',\n    exportAs: 'rdxToggleGroupMultiple',\n    standalone: true,\n    providers: [\n        { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultipleDirective },\n        { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultipleDirective, multi: true }\n    ],\n    host: {\n        role: 'group',\n        '[attr.data-orientation]': 'orientation',\n\n        '(keydown)': 'handleKeydown($event)',\n        '(focusin)': 'onFocusIn()',\n        '(focusout)': 'onTouched?.()'\n    }\n})\nexport class RdxToggleGroupMultipleDirective implements OnChanges, AfterContentInit, ControlValueAccessor {\n    /**\n     * The selected toggle button.\n     */\n    @Input() value: ReadonlyArray<string> = [];\n\n    /**\n     * The orientation of the toggle group.\n     * @default 'horizontal'\n     */\n    @Input() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n    /**\n     * Whether the toggle group is disabled.\n     * @default false\n     */\n    @Input({ transform: booleanAttribute }) disabled = false;\n\n    /**\n     * Whether the toggle group roving focus should wrap.\n     * @default true\n     */\n    @Input({ transform: booleanAttribute }) wrap = true;\n\n    /**\n     * Event emitted when the selected toggle button changes.\n     */\n    @Input() readonly valueChange = new EventEmitter<ReadonlyArray<string>>();\n\n    /**\n     * Access the buttons in the toggle group.\n     * @ignore\n     */\n    @ContentChildren(RdxToggleGroupItemToken)\n    protected buttons?: QueryList<RdxToggleGroupItemDirective>;\n\n    /**\n     * FocusKeyManager to manage keyboard interactions.\n     */\n    private keyManager!: FocusKeyManager<RdxToggleGroupItemDirective>;\n\n    /**\n     * The value change callback.\n     * @ignore\n     */\n    private onChange?: (value: ReadonlyArray<string>) => void;\n\n    /**\n     * onTouch function registered via registerOnTouch (ControlValueAccessor).\n     * @ignore\n     */\n    protected onTouched?: () => void;\n\n    /**\n     * @ignore\n     */\n    ngOnChanges(changes: SimpleChanges): void {\n        if ('disabled' in changes) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n    }\n\n    /**\n     * @ignore\n     */\n    ngAfterContentInit(): void {\n        if (this.disabled) {\n            this.buttons?.forEach((button) => button.updateDisabled());\n        }\n\n        if (this.buttons) {\n            this.keyManager = new FocusKeyManager(this.buttons).withWrap();\n        }\n    }\n\n    protected onFocusIn(): void {\n        if (!this.keyManager.activeItem) {\n            this.keyManager.setFirstItemActive();\n        }\n    }\n\n    protected handleKeydown(event: KeyboardEvent): void {\n        switch (event.key) {\n            case 'ArrowRight':\n            case 'ArrowDown':\n                this.keyManager.setNextItemActive();\n                event.preventDefault();\n                break;\n            case 'ArrowLeft':\n            case 'ArrowUp':\n                this.keyManager.setPreviousItemActive();\n                event.preventDefault();\n                break;\n            case 'Home':\n                this.keyManager.setFirstItemActive();\n                event.preventDefault();\n                break;\n            case 'End':\n                this.keyManager.setLastItemActive();\n                event.preventDefault();\n                break;\n            case 'Enter':\n            case ' ':\n                // eslint-disable-next-line no-case-declarations\n                const activeItem = this.keyManager.activeItem;\n                if (activeItem) {\n                    activeItem.toggle();\n                }\n                event.preventDefault();\n                break;\n            default:\n                break;\n        }\n    }\n\n    /**\n     * Determine if a value is selected.\n     * @param value The value to check.\n     * @returns Whether the value is selected.\n     * @ignore\n     */\n    isSelected(value: string): boolean {\n        return this.value.includes(value);\n    }\n\n    /**\n     * Toggle a value.\n     * @param value The value to toggle.\n     * @ignore\n     */\n    toggle(value: string): void {\n        if (this.disabled) {\n            return;\n        }\n\n        this.value = this.value.includes(value) ? this.value.filter((v) => v !== value) : [...this.value, value];\n\n        this.valueChange.emit(this.value);\n        this.onChange?.(this.value);\n    }\n\n    /**\n     * Select a value from Angular forms.\n     * @param value The value to select.\n     * @ignore\n     */\n    writeValue(value: ReadonlyArray<string>): void {\n        this.value = value;\n    }\n\n    /**\n     * Register a callback to be called when the value changes.\n     * @param fn The callback to register.\n     * @ignore\n     */\n    registerOnChange(fn: (value: ReadonlyArray<string>) => void): void {\n        this.onChange = fn;\n    }\n\n    /**\n     * Register a callback to be called when the toggle group is touched.\n     * @param fn The callback to register.\n     * @ignore\n     */\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    /**\n     * Set the disabled state of the toggle group.\n     * @param isDisabled Whether the toggle group is disabled.\n     * @ignore\n     */\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n        this.buttons?.forEach((button) => button.updateDisabled());\n    }\n}\n",
+            "selector": "[rdxToggleGroupMultiple]",
+            "providers": [
+                {
+                    "name": "{ provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultipleDirective }",
+                    "type": "directive"
+                },
+                {
+                    "name": "{ provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultipleDirective, multi: true }",
+                    "type": "directive"
+                }
+            ],
+            "exportAs": "rdxToggleGroupMultiple",
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [
+                {
+                    "required": false,
+                    "name": "disabled",
+                    "defaultValue": "false",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "jsdoctags": [
+                        {
+                            "pos": 1497,
+                            "end": 1517,
+                            "flags": 16842752,
+                            "modifierFlagsCache": 0,
+                            "transformFlags": 0,
+                            "kind": 334,
+                            "tagName": {
+                                "pos": 1498,
+                                "end": 1505,
+                                "flags": 16842752,
+                                "modifierFlagsCache": 0,
+                                "transformFlags": 0,
+                                "kind": 80,
+                                "escapedText": "default"
+                            },
+                            "comment": "<p>false</p>\n"
+                        }
+                    ],
+                    "rawdescription": "\n\nWhether the toggle group is disabled.\n",
+                    "description": "<p>Whether the toggle group is disabled.</p>\n",
+                    "line": 51,
+                    "type": "boolean",
+                    "decorators": []
+                },
+                {
+                    "name": "orientation",
+                    "defaultValue": "'horizontal'",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "jsdoctags": [
+                        {
+                            "pos": 1338,
+                            "end": 1365,
+                            "flags": 16842752,
+                            "modifierFlagsCache": 0,
+                            "transformFlags": 0,
+                            "kind": 334,
+                            "tagName": {
+                                "pos": 1339,
+                                "end": 1346,
+                                "flags": 16842752,
+                                "modifierFlagsCache": 0,
+                                "transformFlags": 0,
+                                "kind": 80,
+                                "escapedText": "default"
+                            },
+                            "comment": "<p>&#39;horizontal&#39;</p>\n"
+                        }
+                    ],
+                    "rawdescription": "\n\nThe orientation of the toggle group.\n",
+                    "description": "<p>The orientation of the toggle group.</p>\n",
+                    "line": 45,
+                    "type": "\"horizontal\" | \"vertical\"",
+                    "decorators": []
+                },
+                {
+                    "name": "value",
+                    "defaultValue": "[]",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nThe selected toggle button.\n",
+                    "description": "<p>The selected toggle button.</p>\n",
+                    "line": 39,
+                    "type": "ReadonlyArray<string>",
+                    "decorators": []
+                },
+                {
+                    "name": "valueChange",
+                    "defaultValue": "new EventEmitter<ReadonlyArray<string>>()",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "rawdescription": "\n\nEvent emitted when the selected toggle button changes.\n",
+                    "description": "<p>Event emitted when the selected toggle button changes.</p>\n",
+                    "line": 62,
+                    "type": "any",
+                    "decorators": []
+                },
+                {
+                    "required": false,
+                    "name": "wrap",
+                    "defaultValue": "true",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "jsdoctags": [
+                        {
+                            "pos": 1656,
+                            "end": 1675,
+                            "flags": 16842752,
+                            "modifierFlagsCache": 0,
+                            "transformFlags": 0,
+                            "kind": 334,
+                            "tagName": {
+                                "pos": 1657,
+                                "end": 1664,
+                                "flags": 16842752,
+                                "modifierFlagsCache": 0,
+                                "transformFlags": 0,
+                                "kind": 80,
+                                "escapedText": "default"
+                            },
+                            "comment": "<p>true</p>\n"
+                        }
+                    ],
+                    "rawdescription": "\n\nWhether the toggle group roving focus should wrap.\n",
+                    "description": "<p>Whether the toggle group roving focus should wrap.</p>\n",
+                    "line": 57,
+                    "type": "boolean",
+                    "decorators": []
+                }
+            ],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [],
+            "methodsClass": [
+                {
+                    "name": "handleKeydown",
+                    "args": [
+                        {
+                            "name": "event",
+                            "type": "KeyboardEvent",
+                            "deprecated": false,
+                            "deprecationMessage": ""
+                        }
+                    ],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 116,
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "modifierKind": [
+                        124
+                    ],
+                    "jsdoctags": [
+                        {
+                            "name": "event",
+                            "type": "KeyboardEvent",
+                            "deprecated": false,
+                            "deprecationMessage": "",
+                            "tagName": {
+                                "text": "param"
+                            }
+                        }
+                    ]
+                },
+                {
+                    "name": "onFocusIn",
+                    "args": [],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 110,
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "modifierKind": [
+                        124
+                    ]
+                }
+            ],
+            "extends": [],
+            "implements": [
+                "OnChanges",
+                "AfterContentInit",
+                "ControlValueAccessor"
+            ]
+        },
+        {
+            "name": "RdxVisuallyHiddenDirective",
+            "id": "directive-RdxVisuallyHiddenDirective-2486bcf46a8ae494e882cd43e8d4b6dc3f610595bc3d915c03f7c3e5d435d294e61608376a6489be59457c1034173d53dafe6b6d1d97c1290a2d9fdc1cb377de",
+            "file": "visually-hidden/src/visually-hidden.directive.ts",
+            "type": "directive",
+            "description": "<p>&lt;span rdxVisuallyHidden [feature]=&quot;&#39;fully-hidden&#39;&quot;&gt;\n  <ng-content></ng-content>\n</span></p>\n<p>&lt;button (click)=&quot;directiveInstance.feature.set(&#39;focusable&#39;)&quot;&gt;Make Focusable</button>\n&lt;button (click)=&quot;directiveInstance.feature.set(&#39;fully-hidden&#39;)&quot;&gt;Hide</button></p>\n",
+            "rawdescription": "\n\n\n<span rdxVisuallyHidden [feature]=\"'fully-hidden'\">\n  <ng-content></ng-content>\n</span>\n\n<button (click)=\"directiveInstance.feature.set('focusable')\">Make Focusable</button>\n<button (click)=\"directiveInstance.feature.set('fully-hidden')\">Hide</button>\n",
+            "sourceCode": "import { Directive, input } from '@angular/core';\n\n/**\n *\n * <span rdxVisuallyHidden [feature]=\"'fully-hidden'\">\n *   <ng-content></ng-content>\n * </span>\n *\n * <button (click)=\"directiveInstance.feature.set('focusable')\">Make Focusable</button>\n * <button (click)=\"directiveInstance.feature.set('fully-hidden')\">Hide</button>\n */\n@Directive({\n    selector: '[rdxVisuallyHidden]',\n    standalone: true,\n    host: {\n        '[attr.aria-hidden]': 'feature() === \"focusable\" ? \"true\" : null',\n        '[hidden]': 'feature() === \"fully-hidden\" ? true : null',\n        '[attr.tabindex]': 'feature() === \"fully-hidden\" ? \"-1\" : null',\n        '[style.position]': '\"absolute\"',\n        '[style.border]': '\"0\"',\n        '[style.width]': '\"1px\"',\n        '[style.display]': 'feature() === \"focusable\" ? \"inline-block\" : \"none\"',\n        '[style.height]': '\"1px\"',\n        '[style.padding]': '\"0\"',\n        '[style.margin]': '\"-1px\"',\n        '[style.overflow]': '\"hidden\"',\n        '[style.clip]': '\"rect(0, 0, 0, 0)\"',\n        '[style.white-space]': '\"nowrap\"',\n        '[style.word-wrap]': '\"normal\"'\n    }\n})\nexport class RdxVisuallyHiddenDirective {\n    readonly feature = input<'focusable' | 'fully-hidden'>('focusable');\n}\n",
+            "selector": "[rdxVisuallyHidden]",
+            "providers": [],
+            "hostDirectives": [],
+            "standalone": true,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [
+                {
+                    "name": "feature",
+                    "defaultValue": "input<'focusable' | 'fully-hidden'>('focusable')",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 33,
+                    "modifierKind": [
+                        148
+                    ]
+                }
+            ],
+            "methodsClass": [],
+            "extends": []
+        },
+        {
+            "name": "RdxVisuallyHiddenInputBubbleDirective",
+            "id": "directive-RdxVisuallyHiddenInputBubbleDirective-f224287b6276012f697c2f366e570f826079a8257239ee8db19e9c603d52302e7bd2be94651ae4bea39a68f8c64173a96c05c0c52cd869ef10c2fdf92aff5bdd",
+            "file": "visually-hidden/src/visually-hidden-input-bubble.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n\n\n",
+            "sourceCode": "import { Directive, effect, ElementRef, inject, input } from '@angular/core';\nimport { RdxVisuallyHiddenDirective } from './visually-hidden.directive';\n\n/**\n *\n */\n@Directive({\n    selector: '[rdxVisuallyHiddenInputBubble]',\n    standalone: true,\n    hostDirectives: [{ directive: RdxVisuallyHiddenDirective, inputs: ['feature: feature'] }],\n    host: {\n        '[attr.name]': 'name()',\n        '[attr.required]': 'required()',\n        '[attr.disabled]': 'disabled()',\n        '[attr.checked]': 'checked()',\n        '[value]': 'value()',\n        '(change)': 'onChange()'\n    }\n})\nexport class RdxVisuallyHiddenInputBubbleDirective<T> {\n    private readonly elementRef = inject(ElementRef);\n\n    readonly name = input<string>('');\n    readonly value = input<T | null>(null);\n    readonly checked = input<boolean | undefined>(undefined);\n    readonly required = input<boolean | undefined>(undefined);\n    readonly disabled = input<boolean | undefined>(undefined);\n    readonly feature = input<string>('fully-hidden');\n\n    constructor() {\n        effect(() => {\n            this.updateInputValue();\n        });\n    }\n\n    protected onChange() {\n        this.updateInputValue();\n    }\n\n    private updateInputValue() {\n        let valueChanged = false;\n        let checkedChanged = false;\n\n        // Check if the value has changed before applying the update\n        const currentValue = this.inputElement.value;\n        const newValue = String(this.value());\n\n        if (currentValue !== newValue) {\n            this.inputElement.value = newValue;\n            valueChanged = true;\n        }\n\n        if (this.inputElement.type === 'checkbox' || this.inputElement.type === 'radio') {\n            const currentChecked = this.inputElement.checked;\n            const newChecked = !!this.checked();\n\n            if (currentChecked !== newChecked) {\n                this.inputElement.checked = newChecked;\n                checkedChanged = true;\n            }\n        }\n\n        if (valueChanged || checkedChanged) {\n            this.dispatchInputEvents();\n        }\n    }\n\n    private get inputElement() {\n        return this.elementRef.nativeElement;\n    }\n\n    private dispatchInputEvents() {\n        const inputEvent = new Event('input', { bubbles: true });\n        const changeEvent = new Event('change', { bubbles: true });\n\n        this.inputElement.dispatchEvent(inputEvent);\n        this.inputElement.dispatchEvent(changeEvent);\n    }\n}\n",
+            "selector": "[rdxVisuallyHiddenInputBubble]",
+            "providers": [],
+            "hostDirectives": [
+                {
+                    "name": "RdxVisuallyHiddenDirective",
+                    "inputs": [
+                        "feature: feature"
+                    ],
+                    "outputs": []
+                }
+            ],
+            "standalone": true,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [
+                {
+                    "name": "checked",
+                    "defaultValue": "input<boolean | undefined>(undefined)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 25,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "disabled",
+                    "defaultValue": "input<boolean | undefined>(undefined)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 27,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "feature",
+                    "defaultValue": "input<string>('fully-hidden')",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 28,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "name",
+                    "defaultValue": "input<string>('')",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 23,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "required",
+                    "defaultValue": "input<boolean | undefined>(undefined)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 26,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "value",
+                    "defaultValue": "input<T | null>(null)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 24,
+                    "modifierKind": [
+                        148
+                    ]
+                }
+            ],
+            "methodsClass": [
+                {
+                    "name": "onChange",
+                    "args": [],
+                    "optional": false,
+                    "returnType": "void",
+                    "typeParameters": [],
+                    "line": 36,
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "modifierKind": [
+                        124
+                    ]
+                }
+            ],
+            "extends": [],
+            "constructorObj": {
+                "name": "constructor",
+                "description": "",
+                "deprecated": false,
+                "deprecationMessage": "",
+                "args": [],
+                "line": 28
+            }
+        },
+        {
+            "name": "RdxVisuallyHiddenInputDirective",
+            "id": "directive-RdxVisuallyHiddenInputDirective-8de94a85e1953c9b820ea4160db45b0ed69d36f12bebf0283fa16f999ab74275a02156bdb61a122f4328e156fcc635e9727894c3f73df0b14fad1e35f0b51065",
+            "file": "visually-hidden/src/visually-hidden-input.directive.ts",
+            "type": "directive",
+            "description": "",
+            "rawdescription": "\n",
+            "sourceCode": "import { Directive, ElementRef, OnInit, computed, inject, input } from '@angular/core';\nimport { RdxVisuallyHiddenInputBubbleDirective } from './visually-hidden-input-bubble.directive';\n\n@Directive({\n    selector: '[rdxVisuallyHiddenInput]',\n    standalone: true,\n    hostDirectives: [\n        {\n            directive: RdxVisuallyHiddenInputBubbleDirective,\n            inputs: [\n                'feature: feature',\n                'name: name ',\n                'value: value',\n                'checked: checked',\n                'disabled: disabled',\n                'required: required'\n            ]\n        }\n    ]\n})\nexport class RdxVisuallyHiddenInputDirective<T> implements OnInit {\n    private readonly elementRef = inject(ElementRef);\n\n    readonly name = input<string>('');\n    readonly value = input<T | null>(null);\n    readonly checked = input<boolean | undefined>(undefined);\n    readonly required = input<boolean | undefined>(undefined);\n    readonly disabled = input<boolean | undefined>(undefined);\n    readonly feature = input<'focusable' | 'fully-hidden'>('fully-hidden');\n\n    readonly parsedValue = computed<{ name: string; value: any }[]>(() => {\n        const value = this.value();\n        const name = this.name();\n\n        if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') {\n            return [{ name, value }];\n        }\n\n        if (Array.isArray(value)) {\n            return value.flatMap((obj, index) => {\n                if (typeof obj === 'object') {\n                    return Object.entries(obj).map(([key, val]) => ({\n                        name: `[${name}][${index}][${key}]`,\n                        value: val\n                    }));\n                } else {\n                    return { name: `[${name}][${index}]`, value: obj };\n                }\n            });\n        }\n\n        if (value !== null && typeof value === 'object') {\n            return Object.entries(value).map(([key, val]) => ({\n                name: `[${name}][${key}]`,\n                value: val\n            }));\n        }\n\n        return [];\n    });\n\n    ngOnInit() {\n        const parsedValues = this.parsedValue();\n\n        parsedValues.forEach((parsed) => {\n            const inputElement = this.elementRef.nativeElement;\n            inputElement.setAttribute('name', parsed.name);\n            inputElement.setAttribute('value', parsed.value);\n        });\n    }\n}\n",
+            "selector": "[rdxVisuallyHiddenInput]",
+            "providers": [],
+            "hostDirectives": [
+                {
+                    "name": "RdxVisuallyHiddenInputBubbleDirective",
+                    "inputs": [
+                        "feature: feature",
+                        "name: name ",
+                        "value: value",
+                        "checked: checked",
+                        "disabled: disabled",
+                        "required: required"
+                    ],
+                    "outputs": []
+                }
+            ],
+            "standalone": true,
+            "inputsClass": [],
+            "outputsClass": [],
+            "deprecated": false,
+            "deprecationMessage": "",
+            "hostBindings": [],
+            "hostListeners": [],
+            "propertiesClass": [
+                {
+                    "name": "checked",
+                    "defaultValue": "input<boolean | undefined>(undefined)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 28,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "disabled",
+                    "defaultValue": "input<boolean | undefined>(undefined)",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "jsdoctags": [
-                        {
-                            "pos": 1184,
-                            "end": 1211,
-                            "flags": 16842752,
-                            "modifierFlagsCache": 0,
-                            "transformFlags": 0,
-                            "kind": 334,
-                            "tagName": {
-                                "pos": 1185,
-                                "end": 1192,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "default"
-                            },
-                            "comment": "<p>&#39;horizontal&#39;</p>\n"
-                        }
-                    ],
-                    "rawdescription": "\n\nThe orientation of the toggle group.\n",
-                    "description": "<p>The orientation of the toggle group.</p>\n",
-                    "line": 40,
-                    "type": "\"horizontal\" | \"vertical\"",
-                    "decorators": []
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 30,
+                    "modifierKind": [
+                        148
+                    ]
                 },
                 {
-                    "name": "rdxToggleGroupMultiValue",
-                    "defaultValue": "[]",
+                    "name": "feature",
+                    "defaultValue": "input<'focusable' | 'fully-hidden'>('fully-hidden')",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nThe selected toggle button.\n",
-                    "description": "<p>The selected toggle button.</p>\n",
-                    "line": 34,
-                    "type": "ReadonlyArray<string>",
-                    "decorators": []
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 31,
+                    "modifierKind": [
+                        148
+                    ]
                 },
                 {
-                    "name": "rdxToggleGroupMultiValueChange",
-                    "defaultValue": "new EventEmitter<ReadonlyArray<string>>()",
+                    "name": "name",
+                    "defaultValue": "input<string>('')",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "rawdescription": "\n\nEvent emitted when the selected toggle button changes.\n",
-                    "description": "<p>Event emitted when the selected toggle button changes.</p>\n",
-                    "line": 57,
-                    "type": "any",
-                    "decorators": []
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 26,
+                    "modifierKind": [
+                        148
+                    ]
                 },
                 {
-                    "required": false,
-                    "name": "rdxToggleGroupMultiWrap",
-                    "defaultValue": "true",
+                    "name": "parsedValue",
+                    "defaultValue": "computed<{ name: string; value: any }[]>(() => {\n        const value = this.value();\n        const name = this.name();\n\n        if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') {\n            return [{ name, value }];\n        }\n\n        if (Array.isArray(value)) {\n            return value.flatMap((obj, index) => {\n                if (typeof obj === 'object') {\n                    return Object.entries(obj).map(([key, val]) => ({\n                        name: `[${name}][${index}][${key}]`,\n                        value: val\n                    }));\n                } else {\n                    return { name: `[${name}][${index}]`, value: obj };\n                }\n            });\n        }\n\n        if (value !== null && typeof value === 'object') {\n            return Object.entries(value).map(([key, val]) => ({\n                name: `[${name}][${key}]`,\n                value: val\n            }));\n        }\n\n        return [];\n    })",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "jsdoctags": [
-                        {
-                            "pos": 1572,
-                            "end": 1591,
-                            "flags": 16842752,
-                            "modifierFlagsCache": 0,
-                            "transformFlags": 0,
-                            "kind": 334,
-                            "tagName": {
-                                "pos": 1573,
-                                "end": 1580,
-                                "flags": 16842752,
-                                "modifierFlagsCache": 0,
-                                "transformFlags": 0,
-                                "kind": 80,
-                                "escapedText": "default"
-                            },
-                            "comment": "<p>true</p>\n"
-                        }
-                    ],
-                    "rawdescription": "\n\nWhether the toggle group roving focus should wrap.\n",
-                    "description": "<p>Whether the toggle group roving focus should wrap.</p>\n",
-                    "line": 52,
-                    "type": "boolean",
-                    "decorators": []
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 33,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "required",
+                    "defaultValue": "input<boolean | undefined>(undefined)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 29,
+                    "modifierKind": [
+                        148
+                    ]
+                },
+                {
+                    "name": "value",
+                    "defaultValue": "input<T | null>(null)",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "optional": false,
+                    "description": "",
+                    "line": 27,
+                    "modifierKind": [
+                        148
+                    ]
                 }
             ],
-            "outputsClass": [],
-            "deprecated": false,
-            "deprecationMessage": "",
-            "hostBindings": [],
-            "hostListeners": [],
-            "propertiesClass": [],
             "methodsClass": [],
             "extends": [],
             "implements": [
-                "OnChanges",
-                "AfterContentInit",
-                "ControlValueAccessor"
+                "OnInit"
             ]
         },
         {
@@ -10456,6 +10801,74 @@
                 }
             ]
         },
+        {
+            "name": "RdxAlertDialogModule",
+            "id": "module-RdxAlertDialogModule-d3e998524d0054b4cfd40d33a96bac63142ac9c816f7cbeb8a25c35948987be3cebdf91feea730c87aa648b7d973c885ddfae5dd0158133e7654ca87fa3de6b8",
+            "description": "",
+            "deprecationMessage": "",
+            "deprecated": false,
+            "file": "alert-dialog/index.ts",
+            "methods": [],
+            "sourceCode": "import { NgModule } from '@angular/core';\nimport { RdxAlertDialogCancelDirective } from './src/alert-dialog-cancel.directive';\nimport { RdxAlertDialogContentDirective } from './src/alert-dialog-content.directive';\nimport { RdxAlertDialogRootDirective } from './src/alert-dialog-root.directive';\nimport { RdxAlertDialogTitleDirective } from './src/alert-dialog-title.directive';\nimport { RdxAlertDialogTriggerDirective } from './src/alert-dialog-trigger.directive';\n\nexport * from './src/alert-dialog-cancel.directive';\nexport * from './src/alert-dialog-content.directive';\nexport * from './src/alert-dialog-root.directive';\nexport * from './src/alert-dialog-title.directive';\nexport * from './src/alert-dialog-trigger.directive';\n\nexport * from './src/alert-dialog.service';\n\nconst _imports = [\n    RdxAlertDialogRootDirective,\n    RdxAlertDialogContentDirective,\n    RdxAlertDialogCancelDirective,\n    RdxAlertDialogTriggerDirective,\n    RdxAlertDialogTitleDirective\n];\n\n@NgModule({\n    imports: [..._imports],\n    exports: [..._imports]\n})\nexport class RdxAlertDialogModule {}\n",
+            "children": [
+                {
+                    "type": "providers",
+                    "elements": []
+                },
+                {
+                    "type": "declarations",
+                    "elements": []
+                },
+                {
+                    "type": "imports",
+                    "elements": [
+                        {
+                            "name": "RdxAccordionContentDirective"
+                        },
+                        {
+                            "name": "RdxAccordionHeaderDirective"
+                        },
+                        {
+                            "name": "RdxAccordionItemDirective"
+                        },
+                        {
+                            "name": "RdxAccordionRootDirective"
+                        },
+                        {
+                            "name": "RdxAccordionTriggerDirective"
+                        }
+                    ]
+                },
+                {
+                    "type": "exports",
+                    "elements": [
+                        {
+                            "name": "RdxAccordionContentDirective"
+                        },
+                        {
+                            "name": "RdxAccordionHeaderDirective"
+                        },
+                        {
+                            "name": "RdxAccordionItemDirective"
+                        },
+                        {
+                            "name": "RdxAccordionRootDirective"
+                        },
+                        {
+                            "name": "RdxAccordionTriggerDirective"
+                        }
+                    ]
+                },
+                {
+                    "type": "bootstrap",
+                    "elements": []
+                },
+                {
+                    "type": "classes",
+                    "elements": []
+                }
+            ]
+        },
         {
             "name": "RdxContextMenuModule",
             "id": "module-RdxContextMenuModule-ae9a10be40adfa46fc65f5b123ada1b03497abba3f3f504d7b4b139f166b94164ca84a4daf2d6f2982807dbca7e074074ae7c773f91ddc7535160a8b3fbf93f9",
@@ -10795,6 +11208,16 @@
                 "type": "[]",
                 "defaultValue": "[\n    RdxAccordionContentDirective,\n    RdxAccordionHeaderDirective,\n    RdxAccordionItemDirective,\n    RdxAccordionRootDirective,\n    RdxAccordionTriggerDirective\n]"
             },
+            {
+                "name": "_imports",
+                "ctype": "miscellaneous",
+                "subtype": "variable",
+                "file": "alert-dialog/index.ts",
+                "deprecated": false,
+                "deprecationMessage": "",
+                "type": "[]",
+                "defaultValue": "[\n    RdxAlertDialogRootDirective,\n    RdxAlertDialogContentDirective,\n    RdxAlertDialogCancelDirective,\n    RdxAlertDialogTriggerDirective,\n    RdxAlertDialogTitleDirective\n]"
+            },
             {
                 "name": "_imports",
                 "ctype": "miscellaneous",
@@ -11240,14 +11663,14 @@
                 "defaultValue": "new InjectionToken<RdxSwitchRootDirective>('RdxSwitchToken')"
             },
             {
-                "name": "RdxToggleGroupButtonToken",
+                "name": "RdxToggleGroupItemToken",
                 "ctype": "miscellaneous",
                 "subtype": "variable",
-                "file": "toggle-group/src/toggle-group-button.token.ts",
+                "file": "toggle-group/src/toggle-group-item.token.ts",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "new InjectionToken<RdxToggleGroupButtonDirective>('RdxToggleGroupButtonToken')"
+                "defaultValue": "new InjectionToken<RdxToggleGroupItemDirective>('RdxToggleGroupItemToken')"
             },
             {
                 "name": "RdxToggleGroupToken",
@@ -11257,7 +11680,7 @@
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "",
-                "defaultValue": "new InjectionToken<RdxToggleGroupDirective | RdxToggleGroupMultiDirective>(\n    'RdxToggleGroupToken'\n)"
+                "defaultValue": "new InjectionToken<RdxToggleGroupDirective | RdxToggleGroupMultipleDirective>(\n    'RdxToggleGroupToken'\n)"
             },
             {
                 "name": "reqAnimationFrame",
@@ -11362,6 +11785,16 @@
                 "defaultValue": "<T>(\n    zone: NgZone,\n    element: HTMLElement,\n    startFn: TransitionStartFn<T>,\n    options: TransitionOptions<T>\n): Observable<void> => {\n    let context = options.context || <T>{};\n\n    const transitionTimerDelayMs = options.transitionTimerDelayMs ?? 5;\n    const state = options.state ?? 'stop';\n\n    const running = TransitionsMap.get(element);\n\n    if (running) {\n        switch (state) {\n            case 'continue':\n                return EMPTY;\n            case 'stop':\n                zone.run(() => running.transition$.complete());\n                context = { ...running.context, ...context };\n                TransitionsMap.delete(element);\n                break;\n        }\n    }\n    const endFn = startFn(element, options.animation, context) || noopFn;\n\n    if (!options.animation || window.getComputedStyle(element).transitionProperty === 'none') {\n        zone.run(() => endFn());\n        return of(undefined).pipe(runInZone(zone));\n    }\n\n    const transition$ = new Subject<void>();\n    const finishTransition$ = new Subject<void>();\n    const stop$ = transition$.pipe(endWith(true));\n\n    TransitionsMap.set(element, {\n        transition$,\n        complete: () => {\n            finishTransition$.next();\n            finishTransition$.complete();\n        },\n        context\n    });\n\n    const transitionDurationMs = getTransitionDurationMs(element);\n\n    zone.runOutsideAngular(() => {\n        const transitionEnd$ = fromEvent<TransitionEvent>(element, 'transitionend').pipe(\n            filter(({ target }) => target === element),\n            takeUntil(stop$)\n        );\n        const timer$ = timer(transitionDurationMs + transitionTimerDelayMs).pipe(takeUntil(stop$));\n\n        race(timer$, transitionEnd$, finishTransition$)\n            .pipe(takeUntil(stop$))\n            .subscribe(() => {\n                TransitionsMap.delete(element);\n                zone.run(() => {\n                    endFn();\n                    transition$.next();\n                    transition$.complete();\n                });\n            });\n    });\n\n    return transition$.asObservable();\n}",
                 "rawdescription": "Manages the presence of an element with optional transition animation.",
                 "description": "<p>Manages the presence of an element with optional transition animation.</p>\n"
+            },
+            {
+                "name": "WINDOW",
+                "ctype": "miscellaneous",
+                "subtype": "variable",
+                "file": "core/src/window.ts",
+                "deprecated": false,
+                "deprecationMessage": "",
+                "type": "",
+                "defaultValue": "new InjectionToken<Window & typeof globalThis>('An abstraction over global window object', {\n    factory: () => {\n        const { defaultView } = injectDocument();\n        if (!defaultView) {\n            throw new Error('Window is not available');\n        }\n        return defaultView;\n    }\n})"
             }
         ],
         "functions": [
@@ -11550,6 +11983,27 @@
                 "description": "",
                 "args": []
             },
+            {
+                "name": "injectDocument",
+                "file": "core/src/document.ts",
+                "ctype": "miscellaneous",
+                "subtype": "function",
+                "deprecated": false,
+                "deprecationMessage": "",
+                "description": "",
+                "args": [],
+                "returnType": "Document"
+            },
+            {
+                "name": "injectIsClient",
+                "file": "core/src/is-client.ts",
+                "ctype": "miscellaneous",
+                "subtype": "function",
+                "deprecated": false,
+                "deprecationMessage": "",
+                "description": "",
+                "args": []
+            },
             {
                 "name": "injectNgControl",
                 "file": "core/src/inject-ng-control.ts",
@@ -11699,18 +12153,17 @@
                 "deprecationMessage": "",
                 "description": "",
                 "args": [],
-                "returnType": "RdxToggleGroupDirective | RdxToggleGroupMultiDirective"
+                "returnType": "RdxToggleGroupDirective | RdxToggleGroupMultipleDirective"
             },
             {
-                "name": "injectToggleGroupButton",
-                "file": "toggle-group/src/toggle-group-button.token.ts",
+                "name": "injectWindow",
+                "file": "core/src/window.ts",
                 "ctype": "miscellaneous",
                 "subtype": "function",
                 "deprecated": false,
                 "deprecationMessage": "",
                 "description": "",
-                "args": [],
-                "returnType": "RdxToggleGroupButtonDirective"
+                "args": []
             },
             {
                 "name": "isDismissed",
@@ -12456,6 +12909,18 @@
                     "defaultValue": "[\n    RdxAccordionContentDirective,\n    RdxAccordionHeaderDirective,\n    RdxAccordionItemDirective,\n    RdxAccordionRootDirective,\n    RdxAccordionTriggerDirective\n]"
                 }
             ],
+            "alert-dialog/index.ts": [
+                {
+                    "name": "_imports",
+                    "ctype": "miscellaneous",
+                    "subtype": "variable",
+                    "file": "alert-dialog/index.ts",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "[]",
+                    "defaultValue": "[\n    RdxAlertDialogRootDirective,\n    RdxAlertDialogContentDirective,\n    RdxAlertDialogCancelDirective,\n    RdxAlertDialogTriggerDirective,\n    RdxAlertDialogTitleDirective\n]"
+                }
+            ],
             "context-menu/index.ts": [
                 {
                     "name": "_imports",
@@ -13016,16 +13481,16 @@
                     "defaultValue": "new InjectionToken<RdxCollapsibleRootDirective>('RdxCollapsibleRootToken')"
                 }
             ],
-            "toggle-group/src/toggle-group-button.token.ts": [
+            "toggle-group/src/toggle-group-item.token.ts": [
                 {
-                    "name": "RdxToggleGroupButtonToken",
+                    "name": "RdxToggleGroupItemToken",
                     "ctype": "miscellaneous",
                     "subtype": "variable",
-                    "file": "toggle-group/src/toggle-group-button.token.ts",
+                    "file": "toggle-group/src/toggle-group-item.token.ts",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "new InjectionToken<RdxToggleGroupButtonDirective>('RdxToggleGroupButtonToken')"
+                    "defaultValue": "new InjectionToken<RdxToggleGroupItemDirective>('RdxToggleGroupItemToken')"
                 }
             ],
             "toggle-group/src/toggle-group.token.ts": [
@@ -13037,7 +13502,7 @@
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "",
-                    "defaultValue": "new InjectionToken<RdxToggleGroupDirective | RdxToggleGroupMultiDirective>(\n    'RdxToggleGroupToken'\n)"
+                    "defaultValue": "new InjectionToken<RdxToggleGroupDirective | RdxToggleGroupMultipleDirective>(\n    'RdxToggleGroupToken'\n)"
                 }
             ],
             "switch/index.ts": [
@@ -13097,6 +13562,18 @@
                     "type": "TransitionStartFn",
                     "defaultValue": "({ classList }: HTMLElement) => {\n    classList.add('showing');\n    return () => {\n        classList.remove('show', 'showing');\n    };\n}"
                 }
+            ],
+            "core/src/window.ts": [
+                {
+                    "name": "WINDOW",
+                    "ctype": "miscellaneous",
+                    "subtype": "variable",
+                    "file": "core/src/window.ts",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "type": "",
+                    "defaultValue": "new InjectionToken<Window & typeof globalThis>('An abstraction over global window object', {\n    factory: () => {\n        const { defaultView } = injectDocument();\n        if (!defaultView) {\n            throw new Error('Window is not available');\n        }\n        return defaultView;\n    }\n})"
+                }
             ]
         },
         "groupedFunctions": {
@@ -13450,6 +13927,31 @@
                     "args": []
                 }
             ],
+            "core/src/document.ts": [
+                {
+                    "name": "injectDocument",
+                    "file": "core/src/document.ts",
+                    "ctype": "miscellaneous",
+                    "subtype": "function",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "description": "",
+                    "args": [],
+                    "returnType": "Document"
+                }
+            ],
+            "core/src/is-client.ts": [
+                {
+                    "name": "injectIsClient",
+                    "file": "core/src/is-client.ts",
+                    "ctype": "miscellaneous",
+                    "subtype": "function",
+                    "deprecated": false,
+                    "deprecationMessage": "",
+                    "description": "",
+                    "args": []
+                }
+            ],
             "core/src/inject-ng-control.ts": [
                 {
                     "name": "injectNgControl",
@@ -13608,20 +14110,19 @@
                     "deprecationMessage": "",
                     "description": "",
                     "args": [],
-                    "returnType": "RdxToggleGroupDirective | RdxToggleGroupMultiDirective"
+                    "returnType": "RdxToggleGroupDirective | RdxToggleGroupMultipleDirective"
                 }
             ],
-            "toggle-group/src/toggle-group-button.token.ts": [
+            "core/src/window.ts": [
                 {
-                    "name": "injectToggleGroupButton",
-                    "file": "toggle-group/src/toggle-group-button.token.ts",
+                    "name": "injectWindow",
+                    "file": "core/src/window.ts",
                     "ctype": "miscellaneous",
                     "subtype": "function",
                     "deprecated": false,
                     "deprecationMessage": "",
                     "description": "",
-                    "args": [],
-                    "returnType": "RdxToggleGroupButtonDirective"
+                    "args": []
                 }
             ],
             "dialog/src/dialog-ref.ts": [