@radix-ng/primitives 1.0.4 → 1.0.6

package/types/radix-ng-primitives-radio.d.ts

@@ -1,41 +1,48 @@
 import * as _angular_core from '@angular/core';
-import { ModelSignal, InputSignal, InputSignalWithTransform, Signal, InjectionToken } from '@angular/core';
+import { Signal } from '@angular/core';
+import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
+import { RdxFormValueControl, BooleanInput, RdxCancelableChangeEventDetails } from '@radix-ng/primitives/core';
 import { ControlValueAccessor } from '@angular/forms';
-import { BooleanInput, RdxFormValueControl, RdxCancelableChangeEventDetails } from '@radix-ng/primitives/core';
 import * as i1 from '@radix-ng/primitives/composite';
-import * as i1$1 from '@radix-ng/primitives/visually-hidden';
+import * as _radix_ng_primitives_radio from '@radix-ng/primitives/radio';
 
 type RdxRadioValueChangeReason = 'none';
-interface RadioGroupProps {
-    value: ModelSignal<string | null>;
-    defaultValue: InputSignal<string | undefined>;
-    name: InputSignal<string | undefined>;
-    form: InputSignal<string | undefined>;
-    disabled: InputSignalWithTransform<boolean, BooleanInput>;
-    readonly: InputSignalWithTransform<boolean, BooleanInput>;
-    required: InputSignalWithTransform<boolean, BooleanInput>;
-    disabledState: Signal<boolean>;
-}
-interface RadioGroupDirective extends RadioGroupProps {
-    select(value: string | null, event?: Event, reason?: RdxRadioValueChangeReason): void;
-    onTouched(): void;
-    setArrowNavigation(value: boolean): void;
-    isArrowNavigation(): boolean;
-}
 
 type RdxRadioValueChangeEventDetails = RdxCancelableChangeEventDetails<RdxRadioValueChangeReason>;
 interface RdxRadioValueChangeEvent {
     value: string;
     eventDetails: RdxRadioValueChangeEventDetails;
 }
-declare class RdxRadioGroupDirective implements RadioGroupProps, RadioGroupDirective, ControlValueAccessor, RdxFormValueControl<string | null> {
+interface RadioRootContext {
+    value: Signal<string | null>;
+    disabledState: Signal<boolean>;
+    readonly: Signal<boolean>;
+    required: Signal<boolean>;
+    name: Signal<string | undefined>;
+    form: Signal<string | undefined>;
+    select(value: string | null, event?: Event, reason?: RdxRadioValueChangeReason): void;
+    setArrowNavigation(value: boolean): void;
+    isArrowNavigation(): boolean;
+}
+declare const injectRadioRootContext: _radix_ng_primitives_core.InjectContext<RadioRootContext>;
+declare const provideRadioRootContext: (useFactory: () => RadioRootContext) => _angular_core.Provider;
+declare class RdxRadioGroupDirective implements ControlValueAccessor, RdxFormValueControl<string | null> {
     private readonly elementRef;
     private readonly compositeRoot;
+    /**
+     * The selected value. Deliberately typed as `string` (not Base UI's generic `Value`):
+     * a radio group maps onto native radio inputs whose form value is a string, so values are
+     * the option identifiers. Use the string key of your option as the value.
+     */
     readonly value: _angular_core.ModelSignal<string | null>;
     readonly defaultValue: _angular_core.InputSignal<string | undefined>;
     readonly name: _angular_core.InputSignal<string | undefined>;
     readonly form: _angular_core.InputSignal<string | undefined>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether the user should be unable to select a different radio button. Bound in templates as
+     * `readOnly` (Base UI spelling); the TS member stays `readonly` for cross-primitive consistency.
+     */
     readonly readonly: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     readonly required: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /**
@@ -43,7 +50,7 @@ declare class RdxRadioGroupDirective implements RadioGroupProps, RadioGroupDirec
      */
     readonly onValueChange: _angular_core.OutputEmitterRef<RdxRadioValueChangeEvent>;
     private readonly disable;
-    readonly disabledState: _angular_core.Signal<boolean>;
+    readonly disabledState: Signal<boolean>;
     private readonly arrowNavigation;
     private readonly itemMetadata;
     private readonly disabledIndices;
@@ -87,31 +94,85 @@ declare class RdxRadioGroupDirective implements RadioGroupProps, RadioGroupDirec
     setArrowNavigation(value: boolean): void;
     isArrowNavigation(): boolean;
     protected onKeydown(): void;
+    /**
+     * Marks the control touched when focus leaves the whole group (Base UI `RadioGroup` parity and the
+     * ADR 0004 CVA strategy) — moving focus between items stays inside, so `relatedTarget` is checked.
+     */
+    protected onFocusOut(event: FocusEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRadioGroupDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioGroupDirective, "[rdxRadioRoot]", ["rdxRadioRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, [{ directive: typeof i1.RdxCompositeRoot; inputs: {}; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioGroupDirective, "[rdxRadioRoot]", ["rdxRadioRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, [{ directive: typeof i1.RdxCompositeRoot; inputs: {}; outputs: {}; }]>;
+}
+
+declare class RdxRadioIndicatorDirective {
+    protected readonly itemContext: _radix_ng_primitives_radio.RadioItemContext;
+    /** Keep the indicator in the DOM when unchecked so CSS exit animations can play. */
+    readonly keepMounted: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    protected readonly isVisible: _angular_core.Signal<boolean>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRadioIndicatorDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioIndicatorDirective, "[rdxRadioIndicator]", ["rdxRadioIndicator"], { "keepMounted": { "alias": "keepMounted"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * The hidden native radio input that mirrors the item state for form submission, native validation,
+ * and `<label>` activation. Place it inside an `rdxRadioItem`.
+ *
+ * @see https://base-ui.com/react/components/radio
+ */
+declare class RdxRadioItemInputDirective {
+    private readonly rootContext;
+    private readonly itemContext;
+    private readonly input;
+    readonly name: _angular_core.Signal<string | undefined>;
+    readonly form: _angular_core.Signal<string | undefined>;
+    readonly value: _angular_core.Signal<string | undefined>;
+    readonly checked: _angular_core.Signal<boolean>;
+    readonly required: _angular_core.Signal<boolean>;
+    readonly disabled: _angular_core.Signal<boolean>;
+    constructor();
+    /**
+     * Selects this item when the native input is checked — covers `<label>` activation,
+     * where clicking the label toggles the hidden radio input rather than the visible item.
+     * `select()` is a no-op when the value is already current, so the programmatic
+     * `change` dispatched above does not re-trigger selection.
+     * @ignore
+     */
+    protected onInputChange(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRadioItemInputDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioItemInputDirective, "input[rdxRadioItemInput]", ["rdxRadioItemInput"], {}, {}, never, never, true, never>;
 }
 
-declare const RdxRadioItemToken: InjectionToken<RdxRadioItemDirective>;
-declare function injectRadioItem(): RdxRadioItemDirective;
+interface RadioItemContext {
+    value: Signal<string>;
+    checkedState: Signal<boolean>;
+    disabledState: Signal<boolean>;
+    readonlyState: Signal<boolean>;
+    requiredState: Signal<boolean>;
+}
+declare const injectRadioItemContext: _radix_ng_primitives_core.InjectContext<RadioItemContext>;
+declare const provideRadioItemContext: (useFactory: () => RadioItemContext) => _angular_core.Provider;
 declare class RdxRadioItemDirective {
-    private readonly radioGroup;
-    private readonly elementRef;
-    private readonly renderer;
+    private readonly rootContext;
     private readonly compositeItem;
-    private readonly destroyRef;
-    private readonly inputElement;
-    private previousCheckedState;
+    private readonly elementRef;
     readonly value: _angular_core.InputSignal<string>;
     readonly id: _angular_core.InputSignal<string | undefined>;
     readonly required: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether the user should be unable to select this radio button. Bound in templates as
+     * `readOnly` (Base UI spelling); the TS member stays `readonly` for cross-primitive consistency.
+     */
     readonly readonly: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
-    readonly nativeButton: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
-    readonly nativeButtonState: _angular_core.Signal<boolean>;
-    readonly disabledState: _angular_core.Signal<boolean>;
-    readonly readonlyState: _angular_core.Signal<boolean>;
-    readonly requiredState: _angular_core.Signal<boolean>;
-    readonly checkedState: _angular_core.Signal<boolean>;
+    /**
+     * Whether the host is a native `<button>`. Detected from the host tag (unlike Base UI's explicit
+     * `nativeButton` prop, the rendered element is statically known in Angular templates), and used to
+     * apply `type="button"` and the native `disabled` attribute.
+     */
+    protected readonly isNativeButton: boolean;
+    readonly disabledState: Signal<boolean>;
+    readonly readonlyState: Signal<boolean>;
+    readonly requiredState: Signal<boolean>;
+    readonly checkedState: Signal<boolean>;
     private readonly ARROW_KEYS;
     constructor();
     /** @ignore */
@@ -123,35 +184,9 @@ declare class RdxRadioItemDirective {
     /** @ignore */
     onFocus(event?: FocusEvent): void;
     private isAllowedArrowKey;
-    private createHiddenInput;
-    private syncHiddenInput;
-    private setOptionalAttribute;
-    private setBooleanAttribute;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRadioItemDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioItemDirective, "[rdxRadioItem]", ["rdxRadioItem"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "nativeButton": { "alias": "nativeButton"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxCompositeItem; inputs: {}; outputs: {}; }]>;
-}
-
-declare class RdxRadioIndicatorDirective {
-    protected readonly radioGroup: RadioGroupDirective;
-    protected readonly radioItem: RdxRadioItemDirective;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRadioIndicatorDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioIndicatorDirective, "[rdxRadioIndicator]", ["rdxRadioIndicator"], {}, {}, never, never, true, never>;
-}
-
-declare class RdxRadioItemInputDirective {
-    private readonly radioItem;
-    private readonly radioGroup;
-    private readonly input;
-    readonly name: _angular_core.Signal<string | undefined>;
-    readonly form: _angular_core.Signal<string | undefined>;
-    readonly value: _angular_core.Signal<string | undefined>;
-    readonly checked: _angular_core.Signal<boolean>;
-    readonly required: _angular_core.Signal<boolean>;
-    readonly disabled: _angular_core.Signal<boolean>;
-    constructor();
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxRadioItemInputDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioItemInputDirective, "input[rdxRadioItemInput]", ["rdxRadioItemInput"], {}, {}, never, never, true, [{ directive: typeof i1$1.RdxVisuallyHiddenDirective; inputs: { "feature": "feature"; }; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxRadioItemDirective, "[rdxRadioItem]", ["rdxRadioItem"], { "value": { "alias": "value"; "required": true; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readOnly"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.RdxCompositeItem; inputs: {}; outputs: {}; }]>;
 }
 
-export { RdxRadioGroupDirective, RdxRadioIndicatorDirective, RdxRadioItemDirective, RdxRadioItemInputDirective, RdxRadioItemToken, injectRadioItem };
-export type { RdxRadioValueChangeEvent, RdxRadioValueChangeEventDetails, RdxRadioValueChangeReason };
+export { RdxRadioGroupDirective, RdxRadioIndicatorDirective, RdxRadioItemDirective, RdxRadioItemInputDirective, injectRadioItemContext, injectRadioRootContext, provideRadioItemContext, provideRadioRootContext };
+export type { RadioItemContext, RadioRootContext, RdxRadioValueChangeEvent, RdxRadioValueChangeEventDetails, RdxRadioValueChangeReason };