@radix-ng/primitives 1.0.10 → 1.1.1

package/types/radix-ng-primitives-signal-forms.d.ts

@@ -1,5 +1,6 @@
 import * as i0 from '@angular/core';
 import { FieldTree } from '@angular/forms/signals';
+import { BooleanInput } from '@radix-ng/primitives/core';
 
 /**
  * Bridges an Angular **Signal Forms** field into an enclosing `rdxFieldRoot` — with **no duplicate
@@ -16,9 +17,9 @@ import { FieldTree } from '@angular/forms/signals';
  *
  * It owns no model and runs no validation — Signal Forms remains the source of truth. It only registers
  * an {@link RdxFieldState} provider on the ancestor Field context so the field's `invalid` / `disabled` /
- * `required` / `dirty` / `touched` data-attributes and the error *content* (`rdxFieldError.messages()`)
- * read authoritative Signal Forms state. `filled` / `focused` stay on Field's DOM heuristic (partial
- * ownership — the seam supports it).
+ * `required` / `dirty` / `touched` data-attributes, tri-state pending validity, and the error *content*
+ * (`rdxFieldError.messages()`) read authoritative Signal Forms state. `filled` / `focused` stay on
+ * Field's DOM heuristic (partial ownership — the seam supports it).
  *
  * It reports the **actual** Signal Forms state only; the `Field` decides *when* to display it from its
  * `validationMode` (default `'onBlur'` — neutral until the field is touched or the form submitted). So an
@@ -51,9 +52,13 @@ declare class RdxSignalField {
  *
  * Registers an {@link RdxFormState} provider so the Form's aggregate `data-invalid` / `data-dirty` /
  * `data-touched` / `data-submitting` attributes and the submit guard read authoritative Signal Forms
- * state. This adapter owns only client-side state and `name`-routing; server errors stay a separate
- * eager channel applied through `rdxFormRoot[errors]`, and Signal Forms' own `submit()` owns the
- * submit lifecycle.
+ * state. By default this adapter owns only client-side state and `name`-routing; server errors stay a
+ * separate eager channel applied through `rdxFormRoot[errors]`. Add `rdxSignalSubmit` to delegate native
+ * submission to Signal Forms' own `submit()` lifecycle instead of `rdxFormRoot.onFormSubmit`:
+ *
+ * ```html
+ * <form rdxFormRoot [rdxSignalForm]="loginForm" rdxSignalSubmit>…</form>
+ * ```
  *
  * `errorsFor(name)` routes a field's errors to a `rdxFieldRoot` by its `name`, walking the `FieldTree`
  * so dotted paths into nested object/array fields resolve too (`address.street`, `items.0.name`). A
@@ -62,13 +67,22 @@ declare class RdxSignalField {
  * a field carries both, `rdxFieldError.messages()` deduplicates by text so the shared message is not
  * shown twice.
  *
- * See ADR 0018.
+ * See ADR 0018 and ADR 0020.
  *
  * @group Components
  */
 declare class RdxSignalForm {
     /** The Signal Forms root field (from `form(...)`) whose aggregate state drives the enclosing Form. */
     readonly form: i0.InputSignal<FieldTree<unknown>>;
+    /**
+     * Delegate native submission to Angular Signal Forms' `submit()` lifecycle. Opt-in so adding the
+     * state adapter to an existing 1.x form cannot silently replace its `(onFormSubmit)` side effects.
+     * The bound `form()` must define `submission.action`; Angular reports a descriptive error otherwise.
+     *
+     * @group Props
+     * @defaultValue false
+     */
+    readonly signalSubmit: i0.InputSignalWithTransform<boolean, BooleanInput>;
     private readonly formContext;
     constructor();
     /**
@@ -84,7 +98,7 @@ declare class RdxSignalForm {
     /** The current Signal Forms root field state (a `FieldTree` is callable). */
     private state;
     static ɵfac: i0.ɵɵFactoryDeclaration<RdxSignalForm, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxSignalForm, "form[rdxFormRoot][rdxSignalForm]", ["rdxSignalForm"], { "form": { "alias": "rdxSignalForm"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxSignalForm, "form[rdxFormRoot][rdxSignalForm]", ["rdxSignalForm"], { "form": { "alias": "rdxSignalForm"; "required": true; "isSignal": true; }; "signalSubmit": { "alias": "rdxSignalSubmit"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare const _importsSignalForms: (typeof RdxSignalField | typeof RdxSignalForm)[];

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

@@ -189,7 +189,7 @@ declare class RdxSliderRoot extends RdxFormUiControlBase {
     readonly format: _angular_core.InputSignal<Intl.NumberFormatOptions | undefined>;
     /** Locale used for value formatting. */
     readonly locale: _angular_core.InputSignal<string | undefined>;
-    /** Name of the hidden inputs rendered by each thumb, for form submission. */
+    /** Name of the native range input rendered by each thumb, for form submission. */
     readonly name: _angular_core.InputSignal<string | undefined>;
     /** Id of the form the slider belongs to. */
     readonly form: _angular_core.InputSignal<string | undefined>;
@@ -231,6 +231,7 @@ declare class RdxSliderRoot extends RdxFormUiControlBase {
     lastChangeEvent: Event | undefined;
     /** @ignore */
     readonly isDisabled: Signal<boolean>;
+    private readonly nativeFormControl;
     /** @ignore */
     readonly inset: Signal<boolean>;
     /** @ignore */

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

@@ -11,6 +11,8 @@ import { RdxCancelableChangeEventDetails, RdxFormUiControlBase, RdxFormCheckboxC
  */
 declare class RdxSwitchInput {
     protected readonly rootContext: _radix_ng_primitives_switch.RdxSwitchContext;
+    private readonly input;
+    constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSwitchInput, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSwitchInput, "input[rdxSwitchInput]", ["rdxSwitchInput"], {}, {}, never, never, true, never>;
 }
@@ -58,8 +60,10 @@ declare class RdxSwitchRoot extends RdxFormUiControlBase implements RdxFormCheck
      * @default false
      */
     readonly required: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
-    /** Name of the hidden form input rendered by `[rdxSwitchInput]`. */
+    /** Native form field name. */
     readonly name: _angular_core.InputSignal<string | undefined>;
+    /** Associates the switch with an external form by id. */
+    readonly form: _angular_core.InputSignal<string | undefined>;
     /**
      * Value submitted with the form when the switch is on.
      *
@@ -71,6 +75,11 @@ declare class RdxSwitchRoot extends RdxFormUiControlBase implements RdxFormCheck
      * @default 'on'
      */
     readonly submitValue: _angular_core.InputSignal<string>;
+    /**
+     * Value submitted while the switch is off. When omitted, the off state contributes no entry,
+     * matching native checkbox behavior.
+     */
+    readonly uncheckedValue: _angular_core.InputSignal<string | undefined>;
     readonly ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
     readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
     /** Event handler called when the checked state of the switch changes. */
@@ -79,6 +88,8 @@ declare class RdxSwitchRoot extends RdxFormUiControlBase implements RdxFormCheck
     readonly checkedState: _angular_core.Signal<boolean>;
     /** @ignore */
     protected readonly isDisabled: _angular_core.Signal<boolean>;
+    private readonly nativeInput;
+    private readonly nativeInputOwnsValue;
     /** @ignore */
     readonly invalidState: _angular_core.Signal<boolean>;
     /** @ignore */
@@ -95,8 +106,10 @@ declare class RdxSwitchRoot extends RdxFormUiControlBase implements RdxFormCheck
     markAsTouched(): void;
     /** @ignore Toggles the checked state unless disabled or read-only. */
     toggle(event?: Event): void;
+    /** @ignore Register the optional native checkbox so it owns checked-value serialization. */
+    registerNativeInput(input: HTMLInputElement): () => void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxSwitchRoot, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSwitchRoot, "button[rdxSwitchRoot]", ["rdxSwitchRoot"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "defaultChecked": { "alias": "defaultChecked"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "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; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "submitValue": { "alias": "value"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "onCheckedChange": "onCheckedChange"; }, never, never, true, [{ directive: typeof i1.RdxControlValueAccessor; inputs: { "value": "checked"; "disabled": "disabled"; }; outputs: {}; }]>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxSwitchRoot, "button[rdxSwitchRoot]", ["rdxSwitchRoot"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "defaultChecked": { "alias": "defaultChecked"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "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; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "submitValue": { "alias": "value"; "required": false; "isSignal": true; }; "uncheckedValue": { "alias": "uncheckedValue"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "aria-labelledby"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "onCheckedChange": "onCheckedChange"; }, never, never, true, [{ directive: typeof i1.RdxControlValueAccessor; inputs: { "value": "checked"; "disabled": "disabled"; }; outputs: {}; }]>;
 }
 
 /**
@@ -119,12 +132,15 @@ interface RdxSwitchContext {
     readonly readonly: Signal<boolean>;
     /** Whether the switch must be on to submit the owning form. */
     readonly required: Signal<boolean>;
-    /** Name of the hidden form input. */
+    /** Native form field name. */
     readonly name: Signal<string | undefined>;
+    /** Optional id of an external owning form. */
+    readonly form: Signal<string | undefined>;
     /** Value submitted with the form when the switch is on. */
     readonly value: Signal<string>;
     readonly ariaLabel: Signal<string | undefined>;
     readonly ariaLabelledBy: Signal<string | undefined>;
+    registerNativeInput(input: HTMLInputElement): () => void;
     markAsTouched(): void;
 }
 declare const injectSwitchContext: i1.InjectContext<RdxSwitchContext>;

package/types/radix-ng-primitives-time-field.d.ts

@@ -4,11 +4,12 @@ import * as _radix_ng_primitives_core from '@radix-ng/primitives/core';
 import { RdxFormUiControlBase, RdxFormValueControl, TimeValue, HourCycle, Granularity, Direction, BooleanInput, DateStep, Formatter, SegmentValueObj, SegmentPart } from '@radix-ng/primitives/core';
 import * as _internationalized_date from '@internationalized/date';
 
-declare class RdxTimeFieldRootDirective extends RdxFormUiControlBase implements RdxFormValueControl<TimeValue | undefined> {
+declare class RdxTimeFieldRootDirective extends RdxFormUiControlBase implements RdxFormValueControl<TimeValue | null> {
     /**
-     * The controlled checked state of the calendar.
+     * The controlled time value. `null` represents an empty field and keeps the value addressable as
+     * an Angular Signal Forms child field (`undefined` denotes an absent optional path).
      */
-    readonly value: _angular_core.ModelSignal<TimeValue | undefined>;
+    readonly value: _angular_core.ModelSignal<TimeValue | null>;
     /**
      * The hour cycle to use for formatting times. Defaults to the locale preference
      */
@@ -89,7 +90,7 @@ declare class RdxTimeFieldRootDirective extends RdxFormUiControlBase implements
     readonly inferredGranularity: Signal<Granularity>;
     readonly convertedMinValue: Signal<_internationalized_date.CalendarDateTime | _internationalized_date.ZonedDateTime | undefined>;
     readonly convertedMaxValue: Signal<_internationalized_date.CalendarDateTime | _internationalized_date.ZonedDateTime | undefined>;
-    readonly convertedModelValue: _angular_core.WritableSignal<TimeValue | undefined>;
+    readonly convertedModelValue: _angular_core.WritableSignal<TimeValue | null>;
     readonly convertedPlaceholder: _angular_core.WritableSignal<TimeValue>;
     /**
      * The per-segment values. Writable so segment editing (via `useDateField`) can
@@ -121,6 +122,8 @@ declare class RdxTimeFieldRootDirective extends RdxFormUiControlBase implements
     private readonly userInteracted;
     /** @ignore Mark the field touched (model + `touch` output) for Signal Forms. Called on segment blur. */
     markAsTouched(): void;
+    /** Reset segment interaction so the form-owned value write remains pristine. */
+    reset(): void;
     /**
      * @ignore
      */
@@ -228,7 +231,7 @@ declare class RdxTimeFieldInputDirective {
 
 interface TimeFieldContextToken {
     locale: InputSignal<string>;
-    value: ModelSignal<TimeValue | undefined>;
+    value: ModelSignal<TimeValue | null>;
     /** The controlled placeholder; may be `undefined`. Use `convertedPlaceholder` for segment math. */
     placeholder: Signal<TimeValue | undefined>;
     isInvalid: Signal<boolean>;
@@ -243,7 +246,7 @@ interface TimeFieldContextToken {
     segmentValues: WritableSignal<SegmentValueObj>;
     focusNext: () => void;
     setFocusedElement: (el: HTMLElement) => void;
-    convertedModelValue: WritableSignal<TimeValue | undefined>;
+    convertedModelValue: WritableSignal<TimeValue | null>;
     convertedPlaceholder: WritableSignal<TimeValue>;
     step$: Signal<DateStep>;
 }

package/types/radix-ng-primitives-toggle-group.d.ts

@@ -49,6 +49,10 @@ declare abstract class RdxToggleGroupBase extends RdxFormUiControlBase implement
     readonly value: _angular_core.ModelSignal<string[] | undefined>;
     /** The values pressed when the group is initially rendered (uncontrolled). */
     readonly defaultValue: _angular_core.InputSignal<string[] | undefined>;
+    /** Native form field name. Pressed values are submitted as repeated entries under this name. */
+    readonly name: _angular_core.InputSignal<string | undefined>;
+    /** Associates the group with an external form by id. */
+    readonly form: _angular_core.InputSignal<string | undefined>;
     /**
      * Whether multiple items can be pressed at the same time.
      *
@@ -94,7 +98,7 @@ declare abstract class RdxToggleGroupBase extends RdxFormUiControlBase implement
     /** @ignore */
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxToggleGroupBase, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggleGroupBase, never, never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxToggleGroupBase, never, never, { "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; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "onValueChange": "onValueChange"; }, never, never, true, never>;
 }
 
 /**

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

@@ -231,7 +231,7 @@ declare class RdxTooltip {
 declare class RdxTooltipArrow {
     protected readonly rootContext: _radix_ng_primitives_tooltip.RdxTooltipContext;
     private readonly wrapper;
-    protected readonly side: _angular_core.Signal<"top" | "right" | "bottom" | "left" | undefined>;
+    protected readonly side: _angular_core.Signal<i1$1.SideOrLogical | undefined>;
     protected readonly align: _angular_core.Signal<"start" | "center" | "end" | undefined>;
     protected readonly uncentered: _angular_core.Signal<boolean>;
     protected readonly isVisuallyHidden: boolean;
@@ -245,7 +245,7 @@ declare class RdxTooltipArrow {
 declare class RdxTooltipPopup {
     protected readonly rootContext: _radix_ng_primitives_tooltip.RdxTooltipContext;
     private readonly wrapper;
-    protected readonly side: _angular_core.Signal<"top" | "right" | "bottom" | "left" | undefined>;
+    protected readonly side: _angular_core.Signal<i1$1.SideOrLogical | undefined>;
     protected readonly align: _angular_core.Signal<"start" | "center" | "end" | undefined>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<RdxTooltipPopup, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<RdxTooltipPopup, "[rdxTooltipPopup]", never, {}, {}, never, never, true, [{ directive: typeof i1$1.RdxPopperContent; inputs: {}; outputs: {}; }]>;