@radix-ng/primitives 1.0.5 → 1.0.7

package/fesm2022/radix-ng-primitives-select.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { inject, model, signal, computed, ElementRef, input, booleanAttribute, output, untracked, effect, Directive, InjectionToken, Injector, DestroyRef, afterNextRender, linkedSignal, isDevMode, forwardRef } from '@angular/core';
+import { inject, model, signal, computed, ElementRef, input, booleanAttribute, output, effect, untracked, Directive, InjectionToken, Injector, DestroyRef, afterNextRender, linkedSignal, contentChild, forwardRef, isDevMode } from '@angular/core';
 import * as i3 from '@radix-ng/primitives/core';
-import { isEqual, getActiveElement, createContext, injectId, createFloatingRootContext, useTransitionStatus, isNullish, createCancelableChangeEventDetails, provideFloatingTree, provideFloatingRootContext, RDX_FLOATING_ROOT_CONTEXT, RDX_FLOATING_REGISTRATION, useListHighlight, useAnchoredScrollLock, RdxFloatingNodeRegistration, handleAndDispatchCustomEvent, rdxDevError, setupInternalBackdrop } from '@radix-ng/primitives/core';
+import { isEqual, getActiveElement, createContext, injectId, createFloatingRootContext, useTransitionStatus, isNullish, createCancelableChangeEventDetails, provideFloatingTree, provideFloatingRootContext, RDX_FLOATING_ROOT_CONTEXT, RDX_FLOATING_REGISTRATION, useListHighlight, useAnchoredScrollLock, RdxFloatingNodeRegistration, handleAndDispatchCustomEvent, resizeEffect, clamp, rdxDevError, setupInternalBackdrop } from '@radix-ng/primitives/core';
 import { injectDirection } from '@radix-ng/primitives/direction-provider';
 import * as i2 from '@radix-ng/primitives/floating-focus-manager';
 import { getInteractionTypeFromEvent, provideFloatingFocusManagerConfig, RdxFloatingFocusManager, createRdxTriggerInteraction } from '@radix-ng/primitives/floating-focus-manager';
@@ -70,6 +70,8 @@ const context$2 = () => {
         openInteractionType: context.openInteractionType,
         closeInteractionType: context.closeInteractionType,
         disabled: context.disabled,
+        readOnly: context.readOnly,
+        required: context.required,
         modal: context.modal,
         isEmptyModelValue: context.isEmptyModelValue,
         transitionStatus: context.transitionStatus,
@@ -102,31 +104,48 @@ const [injectSelectRootContext, provideSelectRootContext] = createContext('RdxSe
 class RdxSelectRoot {
     constructor() {
         this.contentId = injectId('rdx-select-content-');
-        this.open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+        this.open = model(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
         /** Whether the current open was initiated by **touch** (ADR 0016 §3 — gates the anchored scroll lock). */
-        this.openedByTouch = signal(false, ...(ngDevMode ? [{ debugName: "openedByTouch" }] : /* istanbul ignore next */ []));
+        this.openedByTouch = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "openedByTouch" }] : /* istanbul ignore next */ []));
         /** How the select was opened. Base UI names this state `openMethod`. */
-        this.openInteractionType = signal(null, ...(ngDevMode ? [{ debugName: "openInteractionType" }] : /* istanbul ignore next */ []));
+        this.openInteractionType = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "openInteractionType" }] : /* istanbul ignore next */ []));
         /** How the select was closed. */
-        this.closeInteractionType = signal(null, ...(ngDevMode ? [{ debugName: "closeInteractionType" }] : /* istanbul ignore next */ []));
+        this.closeInteractionType = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "closeInteractionType" }] : /* istanbul ignore next */ []));
         /** Public Base UI-aligned alias for the open interaction type. */
-        this.openMethod = computed(() => this.openInteractionType(), ...(ngDevMode ? [{ debugName: "openMethod" }] : /* istanbul ignore next */ []));
+        this.openMethod = computed(() => this.openInteractionType(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "openMethod" }] : /* istanbul ignore next */ []));
         /** Per-popup floating root context (ADR 0015) — `open` / `triggers` / reference for the dismissal engine. */
         this.floatingContext = createFloatingRootContext({
             ownerDocument: inject(ElementRef).nativeElement.ownerDocument,
             open: () => this.open()
         });
-        this.value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+        this.value = model(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+        /** Initial value for the uncontrolled case. Applied once on init; `value`/`[(value)]` take over after. */
+        this.defaultValue = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "defaultValue" }] : /* istanbul ignore next */ []));
+        /** Whether the select is initially open (uncontrolled). Applied once on init. */
+        this.defaultOpen = input(false, { ...(ngDevMode ? { debugName: "defaultOpen" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         this.multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        /** When `true`, the value cannot be changed by the user (the popup can still be opened to view it). */
+        this.readOnly = input(false, { ...(ngDevMode ? { debugName: "readOnly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        /** Marks the control as required — reflected on the trigger as `aria-required` / `data-required`. */
+        this.required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         /** Whether the popup is modal: locks page scroll and makes outside content inert while open. */
         this.modal = input(true, { ...(ngDevMode ? { debugName: "modal" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
         this.dirInput = input(undefined, { ...(ngDevMode ? { debugName: "dirInput" } : /* istanbul ignore next */ {}), alias: 'dir' });
         this.dir = injectDirection(this.dirInput);
         /** How item values are compared for equality — a function `(a, b) => boolean` or an object key. */
-        this.isItemEqualToValue = input(...(ngDevMode ? [undefined, { debugName: "isItemEqualToValue" }] : /* istanbul ignore next */ []));
+        this.isItemEqualToValue = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "isItemEqualToValue" }] : /* istanbul ignore next */ []));
         /** Converts a value to its display label (used by `RdxSelectValue`). */
-        this.itemToStringLabel = input(...(ngDevMode ? [undefined, { debugName: "itemToStringLabel" }] : /* istanbul ignore next */ []));
+        this.itemToStringLabel = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "itemToStringLabel" }] : /* istanbul ignore next */ []));
         /** Emits before an open-state change is committed; call `eventDetails.cancel()` to veto it. */
         this.onOpenChange = output();
         /** Emits before a value change is committed; call `eventDetails.cancel()` to veto it. */
@@ -144,8 +163,12 @@ class RdxSelectRoot {
                 return value.length === 0;
             }
             return isNullish(value);
-        }, ...(ngDevMode ? [{ debugName: "isEmptyModelValue" }] : /* istanbul ignore next */ []));
-        this.optionsSet = signal(new Set(), ...(ngDevMode ? [{ debugName: "optionsSet" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isEmptyModelValue" }] : /* istanbul ignore next */ []));
+        this.hasAppliedDefaultValue = false;
+        this.hasAppliedDefaultOpen = false;
+        this.optionsSet = signal(new Set(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "optionsSet" }] : /* istanbul ignore next */ []));
         // The native `select` only associates the correct default value if the corresponding
         // `option` is rendered as a child **at the same time** as itself.
         // Because it might take a few renders for our items to gather the information to build
@@ -155,13 +178,33 @@ class RdxSelectRoot {
             return Array.from(this.optionsSet())
                 .map((option) => option.value)
                 .join(';');
-        }, ...(ngDevMode ? [{ debugName: "nativeSelectKey" }] : /* istanbul ignore next */ []));
-        this.triggerElement = signal(null, ...(ngDevMode ? [{ debugName: "triggerElement" }] : /* istanbul ignore next */ []));
-        this.valueElement = signal(null, ...(ngDevMode ? [{ debugName: "valueElement" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "nativeSelectKey" }] : /* istanbul ignore next */ []));
+        this.triggerElement = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "triggerElement" }] : /* istanbul ignore next */ []));
+        this.valueElement = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "valueElement" }] : /* istanbul ignore next */ []));
         this.triggerPointerDownPosRef = signal({
             x: 0,
             y: 0
-        }, ...(ngDevMode ? [{ debugName: "triggerPointerDownPosRef" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "triggerPointerDownPosRef" }] : /* istanbul ignore next */ []));
+        // Seed the uncontrolled value/open exactly once, then hand off to the model (so a later user
+        // change is not snapped back by the still-set default input).
+        effect(() => {
+            const defaultValue = this.defaultValue();
+            if (!this.hasAppliedDefaultValue && defaultValue !== undefined) {
+                this.hasAppliedDefaultValue = true;
+                this.value.set(defaultValue);
+            }
+        });
+        effect(() => {
+            const defaultOpen = this.defaultOpen();
+            if (!this.hasAppliedDefaultOpen && defaultOpen) {
+                this.hasAppliedDefaultOpen = true;
+                this.open.set(defaultOpen);
+            }
+        });
         let previousOpen = untracked(this.open);
         effect(() => {
             const open = this.open();
@@ -192,10 +235,16 @@ class RdxSelectRoot {
         return Array.from(this.optionsSet()).find((option) => valueComparator(value, option.value, this.isItemEqualToValue()));
     }
     setValue(value, reason = 'none', event = new Event('select.value-change')) {
+        if (this.readOnly()) {
+            return false;
+        }
         const nextValue = this.multiple()
             ? (() => {
                 const current = this.value();
                 const array = Array.isArray(current) ? [...current] : [];
+                if (value === undefined) {
+                    return array;
+                }
                 const index = array.findIndex((i) => compare(i, value, this.isItemEqualToValue()));
                 index === -1 ? array.push(value) : array.splice(index, 1);
                 return [...array];
@@ -206,12 +255,7 @@ class RdxSelectRoot {
         if (eventDetails.isCanceled()) {
             return false;
         }
-        if (this.multiple()) {
-            this.value.set(nextValue);
-        }
-        else {
-            this.value.set(nextValue);
-        }
+        this.value.set(nextValue);
         return true;
     }
     setOpen(open, reason = 'none', event) {
@@ -232,15 +276,15 @@ class RdxSelectRoot {
         }
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectRoot, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxSelectRoot, isStandalone: true, selector: "[rdxSelectRoot]", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, dirInput: { classPropertyName: "dirInput", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, isItemEqualToValue: { classPropertyName: "isItemEqualToValue", publicName: "isItemEqualToValue", isSignal: true, isRequired: false, transformFunction: null }, itemToStringLabel: { classPropertyName: "itemToStringLabel", publicName: "itemToStringLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", value: "valueChange", onOpenChange: "onOpenChange", onValueChange: "onValueChange", onOpenChangeComplete: "onOpenChangeComplete" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectRoot, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxSelectRoot, isStandalone: true, selector: "[rdxSelectRoot]", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, dirInput: { classPropertyName: "dirInput", publicName: "dir", isSignal: true, isRequired: false, transformFunction: null }, isItemEqualToValue: { classPropertyName: "isItemEqualToValue", publicName: "isItemEqualToValue", isSignal: true, isRequired: false, transformFunction: null }, itemToStringLabel: { classPropertyName: "itemToStringLabel", publicName: "itemToStringLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", value: "valueChange", onOpenChange: "onOpenChange", onValueChange: "onValueChange", onOpenChangeComplete: "onOpenChangeComplete" }, providers: [
             provideSelectRootContext(context$2),
             // New floating foundation (ADR 0015/0017) — the dismissal capability reads this shared context.
             provideFloatingTree(),
             provideFloatingRootContext(() => inject(RdxSelectRoot).floatingContext)
         ], exportAs: ["rdxSelectRoot"], hostDirectives: [{ directive: i1.RdxPopper }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectRoot, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectRoot, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectRoot]',
@@ -253,7 +297,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                     ],
                     hostDirectives: [RdxPopper]
                 }]
-        }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], dirInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], isItemEqualToValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "isItemEqualToValue", required: false }] }], itemToStringLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemToStringLabel", required: false }] }], onOpenChange: [{ type: i0.Output, args: ["onOpenChange"] }], onValueChange: [{ type: i0.Output, args: ["onValueChange"] }], onOpenChangeComplete: [{ type: i0.Output, args: ["onOpenChangeComplete"] }] } });
+        }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], defaultValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultValue", required: false }] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], dirInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "dir", required: false }] }], isItemEqualToValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "isItemEqualToValue", required: false }] }], itemToStringLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemToStringLabel", required: false }] }], onOpenChange: [{ type: i0.Output, args: ["onOpenChange"] }], onValueChange: [{ type: i0.Output, args: ["onValueChange"] }], onOpenChangeComplete: [{ type: i0.Output, args: ["onOpenChangeComplete"] }] } });
 
 /**
  * An overlay rendered beneath the popup in `modal` mode. Place it inside the portal/presence; style
@@ -265,19 +309,20 @@ class RdxSelectBackdrop {
     constructor() {
         this.rootContext = injectSelectRootContext();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectBackdrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectBackdrop, isStandalone: true, selector: "[rdxSelectBackdrop]", host: { attributes: { "aria-hidden": "true" }, properties: { "attr.data-state": "rootContext.open() ? \"open\" : \"closed\"", "attr.data-open": "rootContext.open() ? \"\" : undefined", "attr.data-closed": "rootContext.open() ? undefined : \"\"" } }, exportAs: ["rdxSelectBackdrop"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectBackdrop, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectBackdrop, isStandalone: true, selector: "[rdxSelectBackdrop]", host: { attributes: { "aria-hidden": "true" }, properties: { "attr.data-open": "rootContext.open() ? \"\" : undefined", "attr.data-closed": "rootContext.open() ? undefined : \"\"", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined" } }, exportAs: ["rdxSelectBackdrop"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectBackdrop, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectBackdrop, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectBackdrop]',
                     exportAs: 'rdxSelectBackdrop',
                     host: {
                         'aria-hidden': 'true',
-                        '[attr.data-state]': 'rootContext.open() ? "open" : "closed"',
                         '[attr.data-open]': 'rootContext.open() ? "" : undefined',
-                        '[attr.data-closed]': 'rootContext.open() ? undefined : ""'
+                        '[attr.data-closed]': 'rootContext.open() ? undefined : ""',
+                        '[attr.data-starting-style]': 'rootContext.transitionStatus() === "starting" ? "" : undefined',
+                        '[attr.data-ending-style]': 'rootContext.transitionStatus() === "ending" ? "" : undefined'
                     }
                 }]
         }] });
@@ -286,10 +331,10 @@ class RdxSelectGroup {
     constructor() {
         this.id = injectId('rdx-select-group-');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectGroup, isStandalone: true, selector: "[rdxSelectGroup]", host: { attributes: { "role": "group" }, properties: { "attr.aria-labelledby": "id" } }, exportAs: ["rdxSelectGroup"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectGroup, isStandalone: true, selector: "[rdxSelectGroup]", host: { attributes: { "role": "group" }, properties: { "attr.aria-labelledby": "id" } }, exportAs: ["rdxSelectGroup"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectGroup]',
@@ -302,10 +347,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
         }] });
 
 class RdxSelectGroupLabel {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectGroupLabel, isStandalone: true, selector: "[rdxSelectGroupLabel]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectGroupLabel, isStandalone: true, selector: "[rdxSelectGroupLabel]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectGroupLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectGroupLabel, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectGroupLabel]',
@@ -319,10 +364,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  * @group Components
  */
 class RdxSelectIcon {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectIcon, isStandalone: true, selector: "[rdxSelectIcon]", host: { attributes: { "aria-hidden": "true" } }, exportAs: ["rdxSelectIcon"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectIcon, isStandalone: true, selector: "[rdxSelectIcon]", host: { attributes: { "aria-hidden": "true" } }, exportAs: ["rdxSelectIcon"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectIcon, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectIcon]',
@@ -333,6 +378,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 }]
         }] });
 
+/**
+ * Wraps an array around itself at a given start index
+ * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
+ */
+function wrapArray(array, startIndex) {
+    return array.map((_, index) => array[(startIndex + index) % array.length]);
+}
+/**
+ * This is the "meat" of the typeahead matching logic. It takes in all the values,
+ * the search and the current match, and returns the next match (or `undefined`).
+ *
+ * We normalize the search because if a user has repeatedly pressed a character,
+ * we want the exact same behavior as if we only had that one character
+ * (ie. cycle through options starting with that character)
+ *
+ * We also reorder the values by wrapping the array around the current match.
+ * This is so we always look forward from the current match, and picking the first
+ * match will always be the correct one.
+ *
+ * Finally, if the normalized search is exactly one character, we exclude the
+ * current match from the values because otherwise it would be the first to match always
+ * and focus would never move. This is as opposed to the regular case, where we
+ * don't want focus to move if the current match still matches.
+ */
+function getNextMatch(values, search, currentMatch) {
+    const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
+    const normalizedSearch = isRepeated ? search[0] : search;
+    const currentMatchIndex = currentMatch ? values.indexOf(currentMatch) : -1;
+    let wrappedValues = wrapArray(values, Math.max(currentMatchIndex, 0));
+    const excludeCurrentMatch = normalizedSearch.length === 1;
+    if (excludeCurrentMatch)
+        wrappedValues = wrappedValues.filter((v) => v !== currentMatch);
+    const nextMatch = wrappedValues.find((value) => value.toLowerCase().startsWith(normalizedSearch.toLowerCase()));
+    return nextMatch !== currentMatch ? nextMatch : undefined;
+}
+
 const context$1 = () => {
     const context = inject(RdxSelectPopup);
     return {
@@ -405,7 +486,8 @@ class RdxSelectPopup {
          * **ancestor** — can read them without injecting the composite list (which the popup provides as
          * a descendant, so an upward `inject` would not find it).
          */
-        this.items = computed(() => this.compositeList.items(), ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+        this.items = computed(() => this.compositeList.items(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
         /**
          * Highlight-model navigation over the collected items (DOM order). `loop` is disabled so arrow
          * navigation stops at the first / last item instead of wrapping around — matching native
@@ -418,15 +500,23 @@ class RdxSelectPopup {
             loop: signal(false),
             injector: this.injector
         });
-        this.selectedItem = signal(undefined, ...(ngDevMode ? [{ debugName: "selectedItem" }] : /* istanbul ignore next */ []));
-        this.selectedItemText = signal(undefined, ...(ngDevMode ? [{ debugName: "selectedItemText" }] : /* istanbul ignore next */ []));
-        this.firstValidItemFoundRef = signal(false, ...(ngDevMode ? [{ debugName: "firstValidItemFoundRef" }] : /* istanbul ignore next */ []));
-        this.viewport = signal(undefined, ...(ngDevMode ? [{ debugName: "viewport" }] : /* istanbul ignore next */ []));
-        this.isPositioned = signal(false, ...(ngDevMode ? [{ debugName: "isPositioned" }] : /* istanbul ignore next */ []));
+        this.selectedItem = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedItem" }] : /* istanbul ignore next */ []));
+        this.selectedItemText = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedItemText" }] : /* istanbul ignore next */ []));
+        this.firstValidItemFoundRef = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "firstValidItemFoundRef" }] : /* istanbul ignore next */ []));
+        this.viewport = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "viewport" }] : /* istanbul ignore next */ []));
+        this.isPositioned = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isPositioned" }] : /* istanbul ignore next */ []));
         // Tracks whether the last interaction was the keyboard, so the highlight doesn't jump to an item
         // the cursor happens to rest on when arrow-key navigation scrolls the list.
         this.keyboardActive = false;
         this.hasHighlightedOpen = false;
+        // Typeahead buffer (APG listbox): printable characters accumulate for 1s and jump the highlight to
+        // the next item whose text matches.
+        this.typeaheadSearch = '';
         /**
          * Event handler called when the escape key is down.
          * Can be prevented.
@@ -437,7 +527,8 @@ class RdxSelectPopup {
          * Can be prevented.
          */
         this.pointerDownOutside = output();
-        this.content = signal(null, ...(ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []));
+        this.content = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []));
         /**
          * The positioner — now an **ancestor** element — provides {@link RDX_SELECT_POSITIONER_TOKEN}
          * (Popper or item-aligned). We react to its `placed` to highlight and scroll the selected item
@@ -459,6 +550,9 @@ class RdxSelectPopup {
         effect(() => {
             if (!this.rootContext.open()) {
                 this.hasHighlightedOpen = false;
+                // Reset the "first valid item" seed so the next open re-resolves it (otherwise the
+                // selected/first-item highlight seed is stale on reopen).
+                this.firstValidItemFoundRef.set(false);
                 return;
             }
             if (!this.isPositioned() || this.hasHighlightedOpen) {
@@ -482,7 +576,8 @@ class RdxSelectPopup {
         // `modal === false`. The gate keys on `open` (not mounted) so it releases at close-start. A
         // **touch** open never uses item-aligned mode (the positioner falls back), so the lock there is
         // driven by `modal` alone and the anchored helper only engages when the popup is viewport-width (§3).
-        const itemAlignedActive = computed(() => this.positioner?.alignItemWithTriggerActive?.() ?? false, ...(ngDevMode ? [{ debugName: "itemAlignedActive" }] : /* istanbul ignore next */ []));
+        const itemAlignedActive = computed(() => this.positioner?.alignItemWithTriggerActive?.() ?? false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "itemAlignedActive" }] : /* istanbul ignore next */ []));
         useAnchoredScrollLock(computed(() => (itemAlignedActive() || this.rootContext.modal()) && this.rootContext.open()), {
             touchOpen: () => this.rootContext.openedByTouch(),
             element: () => this.currentElement.nativeElement
@@ -490,6 +585,7 @@ class RdxSelectPopup {
         // The popup's animation determines when the open/close transition (onOpenChangeComplete) is done.
         const unregisterTransition = this.rootContext.registerTransitionElement(this.currentElement.nativeElement);
         inject(DestroyRef).onDestroy(unregisterTransition);
+        inject(DestroyRef).onDestroy(() => clearTimeout(this.typeaheadTimer));
         // The popup (listbox) is this layer's floating element — the inside surface for containment.
         this.floatingContext.setFloatingElement(this.currentElement.nativeElement);
         // Dismissal (ADR 0015): Escape or an outside press closes the select. Focus-out does NOT close it
@@ -630,10 +726,36 @@ class RdxSelectPopup {
                     this.highlight.last();
                     break;
             }
+            return;
+        }
+        // Typeahead: a single printable character jumps the highlight to the next matching item.
+        if (keyEvent.key.length === 1 && !keyEvent.ctrlKey && !keyEvent.altKey && !keyEvent.metaKey) {
+            this.handleTypeahead(keyEvent.key);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPopup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectPopup, isStandalone: true, selector: "[rdxSelectPopup]", outputs: { escapeKeyDown: "escapeKeyDown", pointerDownOutside: "pointerDownOutside" }, host: { attributes: { "role": "listbox", "tabindex": "-1" }, listeners: { "keydown": "handleKeyDown($event)" }, properties: { "id": "rootContext.contentId", "attr.aria-activedescendant": "highlight.activeId()", "attr.aria-multiselectable": "rootContext.multiple() ? \"true\" : undefined", "attr.data-state": "rootContext.open() ? \"open\" : \"closed\"", "attr.data-open": "rootContext.open() ? \"\" : undefined", "attr.data-closed": "rootContext.open() ? undefined : \"\"", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined", "dir": "rootContext.dir()", "style": "{\n            display: 'flex',\n            flexDirection: 'column',\n            outline: 'none'\n        }" } }, providers: [
+    /** Accumulates printable keys for 1s and moves the highlight to the next item whose text matches. */
+    handleTypeahead(key) {
+        this.typeaheadSearch += key;
+        clearTimeout(this.typeaheadTimer);
+        this.typeaheadTimer = setTimeout(() => (this.typeaheadSearch = ''), 1000);
+        const navigableItems = this.items().filter((item) => !item.metadata()?.disabled);
+        const values = navigableItems.map((item) => this.itemText(item));
+        const current = this.highlight.highlightedItem();
+        const nextMatch = getNextMatch(values, this.typeaheadSearch, current ? this.itemText(current) : undefined);
+        if (nextMatch === undefined) {
+            return;
+        }
+        const match = navigableItems[values.indexOf(nextMatch)];
+        if (match) {
+            this.keyboardActive = true;
+            this.highlight.set(match);
+        }
+    }
+    itemText(item) {
+        return (item.metadata()?.textValue || item.element.textContent || '').trim();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPopup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectPopup, isStandalone: true, selector: "[rdxSelectPopup]", outputs: { escapeKeyDown: "escapeKeyDown", pointerDownOutside: "pointerDownOutside" }, host: { attributes: { "role": "listbox", "tabindex": "-1" }, listeners: { "keydown": "handleKeyDown($event)" }, properties: { "id": "rootContext.contentId", "attr.aria-activedescendant": "highlight.activeId()", "attr.aria-multiselectable": "rootContext.multiple() ? \"true\" : undefined", "attr.data-open": "rootContext.open() ? \"\" : undefined", "attr.data-closed": "rootContext.open() ? undefined : \"\"", "attr.data-starting-style": "rootContext.transitionStatus() === \"starting\" ? \"\" : undefined", "attr.data-ending-style": "rootContext.transitionStatus() === \"ending\" ? \"\" : undefined", "dir": "rootContext.dir()", "style": "{\n            display: 'flex',\n            flexDirection: 'column',\n            outline: 'none'\n        }" } }, providers: [
             provideSelectPopupContext(context$1),
             provideFloatingFocusManagerConfig(() => {
                 const rootContext = injectSelectRootContext();
@@ -651,7 +773,7 @@ class RdxSelectPopup {
             })
         ], hostDirectives: [{ directive: i1.RdxPopperContent }, { directive: i2.RdxFloatingFocusManager, inputs: ["returnFocus", "finalFocus"] }, { directive: i3.RdxFloatingNodeRegistration }, { directive: i4.RdxCompositeList }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPopup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPopup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectPopup]',
@@ -684,7 +806,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                         '[id]': 'rootContext.contentId',
                         '[attr.aria-activedescendant]': 'highlight.activeId()',
                         '[attr.aria-multiselectable]': 'rootContext.multiple() ? "true" : undefined',
-                        '[attr.data-state]': 'rootContext.open() ? "open" : "closed"',
                         '[attr.data-open]': 'rootContext.open() ? "" : undefined',
                         '[attr.data-closed]': 'rootContext.open() ? undefined : ""',
                         '[attr.data-starting-style]': 'rootContext.transitionStatus() === "starting" ? "" : undefined',
@@ -719,13 +840,18 @@ class RdxSelectItem {
         this.contentContext = injectSelectPopupContext();
         this.listItem = inject(RdxCompositeListItem, { self: true });
         this.currentElement = inject(ElementRef);
-        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
-        this.textValue = input('', ...(ngDevMode ? [{ debugName: "textValue" }] : /* istanbul ignore next */ []));
+        this.value = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+        this.textValue = input('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "textValue" }] : /* istanbul ignore next */ []));
         this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-        this.textValue$ = linkedSignal(this.textValue, ...(ngDevMode ? [{ debugName: "textValue$" }] : /* istanbul ignore next */ []));
-        this.isSelected = computed(() => valueComparator(this.rootContext.value(), this.value(), this.rootContext.isItemEqualToValue()), ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
+        this.textValue$ = linkedSignal(this.textValue, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "textValue$" }] : /* istanbul ignore next */ []));
+        this.isSelected = computed(() => valueComparator(this.rootContext.value(), this.value(), this.rootContext.isItemEqualToValue()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
         /** Highlighted via the highlight model (keyboard / hover), not DOM focus. */
-        this.isHighlighted = computed(() => this.contentContext.isHighlighted(this.currentElement.nativeElement), ...(ngDevMode ? [{ debugName: "isHighlighted" }] : /* istanbul ignore next */ []));
+        this.isHighlighted = computed(() => this.contentContext.isHighlighted(this.currentElement.nativeElement), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isHighlighted" }] : /* istanbul ignore next */ []));
         /** Item id, referenced by the popup's `aria-activedescendant`. */
         this.id = injectId('rdx-select-item-');
         this.textId = injectId('rdx-select-item-text-');
@@ -780,10 +906,10 @@ class RdxSelectItem {
         if (SELECTION_KEYS.includes(keyEvent.key))
             this.onPointerUp(keyEvent);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxSelectItem, isStandalone: true, selector: "[rdxSelectItem]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "option" }, listeners: { "pointerup": "onPointerUp($event)", "pointerleave": "onPointerLeave($event)", "pointermove": "onPointerMove($event)" }, properties: { "attr.id": "id", "attr.aria-selected": "isSelected()", "attr.aria-disabled": "disabled() ? \"true\" : undefined", "attr.data-state": "isSelected() ? \"checked\" : \"unchecked\"", "attr.data-selected": "isSelected() ? \"\" : undefined", "attr.data-highlighted": "isHighlighted() ? \"\" : undefined", "attr.data-disabled": "disabled() ? \"\" : undefined" } }, providers: [provideSelectItemContext(context)], exportAs: ["rdxSelectItem"], hostDirectives: [{ directive: i4.RdxCompositeListItem }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxSelectItem, isStandalone: true, selector: "[rdxSelectItem]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "option" }, listeners: { "pointerup": "onPointerUp($event)", "pointerleave": "onPointerLeave($event)", "pointermove": "onPointerMove($event)" }, properties: { "attr.id": "id", "attr.aria-selected": "isSelected()", "attr.aria-disabled": "disabled() ? \"true\" : undefined", "attr.data-selected": "isSelected() ? \"\" : undefined", "attr.data-highlighted": "isHighlighted() ? \"\" : undefined", "attr.data-disabled": "disabled() ? \"\" : undefined" } }, providers: [provideSelectItemContext(context)], exportAs: ["rdxSelectItem"], hostDirectives: [{ directive: i4.RdxCompositeListItem }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItem, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectItem]',
@@ -795,7 +921,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                         '[attr.id]': 'id',
                         '[attr.aria-selected]': 'isSelected()',
                         '[attr.aria-disabled]': 'disabled() ? "true" : undefined',
-                        '[attr.data-state]': 'isSelected() ? "checked" : "unchecked"',
                         '[attr.data-selected]': 'isSelected() ? "" : undefined',
                         '[attr.data-highlighted]': 'isHighlighted() ? "" : undefined',
                         '[attr.data-disabled]': 'disabled() ? "" : undefined',
@@ -806,14 +931,233 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], textValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "textValue", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 
+class RdxSelectItemAlignedPositionContent {
+    constructor() {
+        this.currentElementRef = inject(ElementRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemAlignedPositionContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectItemAlignedPositionContent, isStandalone: true, selector: "[rdxSelectItemAlignedPositionContent]", host: { properties: { "style": "{\n            boxSizing: 'border-box',\n            display: 'flex',\n            flexDirection: 'column'\n        }" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemAlignedPositionContent, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxSelectItemAlignedPositionContent]',
+                    host: {
+                        '[style]': `{
+            boxSizing: 'border-box',
+            display: 'flex',
+            flexDirection: 'column'
+        }`
+                    }
+                }]
+        }] });
+
+class RdxSelectItemAlignedPosition {
+    constructor() {
+        this.currentElement = inject(ElementRef);
+        this.rootContext = injectSelectRootContext();
+        /**
+         * The popup is now a **descendant** (item-aligned-position is the outer positioner), so read the
+         * viewport / selected-item measurements off the popup instance instead of injecting its context.
+         */
+        this.popup = contentChild.required(RdxSelectPopup);
+        this.placed = output();
+        /**
+         * Whether item-aligned positioning is active (Base UI `alignItemWithTriggerActive`): open **and not**
+         * touch-opened. A touch open falls back to a plain anchored dropdown ({@link positionBelowTrigger}).
+         * Read by the popup's scroll-lock policy — an active item-aligned popup locks even when `modal=false`.
+         */
+        this.alignItemWithTriggerActive = computed(() => this.rootContext.open() && !this.rootContext.openedByTouch(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "alignItemWithTriggerActive" }] : /* istanbul ignore next */ []));
+        this.contentZIndex = signal('', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "contentZIndex" }] : /* istanbul ignore next */ []));
+        this.shouldExpandOnScrollRef = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "shouldExpandOnScrollRef" }] : /* istanbul ignore next */ []));
+        this.contentWrapperElement = signal(this.currentElement.nativeElement, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "contentWrapperElement" }] : /* istanbul ignore next */ []));
+        this.contentElement = contentChild.required(RdxSelectItemAlignedPositionContent);
+        afterNextRender(() => {
+            this.position();
+            if (this.contentElement().currentElementRef.nativeElement) {
+                this.contentZIndex.set(window.getComputedStyle(this.contentElement().currentElementRef.nativeElement).zIndex);
+            }
+        });
+        const injector = inject(Injector);
+        // Resize and position when trigger element changes
+        resizeEffect({
+            injector,
+            element: this.rootContext.triggerElement,
+            onResize: () => this.position()
+        });
+    }
+    position() {
+        // Base UI parity: a touch-opened select does NOT align the item with the trigger (the macOS-style
+        // overlay is awkward on mobile). Fall back to a plain anchored dropdown below the trigger.
+        if (!this.alignItemWithTriggerActive()) {
+            this.positionBelowTrigger();
+            return;
+        }
+        if (this.rootContext.triggerElement() &&
+            this.rootContext.valueElement() &&
+            this.contentWrapperElement() &&
+            this.contentElement().currentElementRef.nativeElement &&
+            this.popup().viewport() &&
+            this.popup().selectedItem() &&
+            this.popup().selectedItemText()) {
+            const triggerRect = this.rootContext.triggerElement().getBoundingClientRect();
+            // -----------------------------------------------------------------------------------------
+            //  Horizontal positioning
+            // -----------------------------------------------------------------------------------------
+            const contentRect = this.currentElement.nativeElement.getBoundingClientRect();
+            const valueNodeRect = this.rootContext.valueElement().getBoundingClientRect();
+            const itemTextRect = this.popup().selectedItemText().getBoundingClientRect();
+            if (this.rootContext.dir() !== 'rtl') {
+                const itemTextOffset = itemTextRect.left - contentRect.left;
+                const left = valueNodeRect.left - itemTextOffset;
+                const leftDelta = triggerRect.left - left;
+                const minContentWidth = triggerRect.width + leftDelta;
+                const contentWidth = Math.max(minContentWidth, contentRect.width);
+                const rightEdge = window.innerWidth - CONTENT_MARGIN;
+                const clampedLeft = clamp(left, CONTENT_MARGIN, Math.max(CONTENT_MARGIN, rightEdge - contentWidth));
+                this.contentWrapperElement().style.minWidth = `${minContentWidth}px`;
+                this.contentWrapperElement().style.left = `${clampedLeft}px`;
+            }
+            else {
+                const itemTextOffset = contentRect.right - itemTextRect.right;
+                const right = window.innerWidth - valueNodeRect.right - itemTextOffset;
+                const rightDelta = window.innerWidth - triggerRect.right - right;
+                const minContentWidth = triggerRect.width + rightDelta;
+                const contentWidth = Math.max(minContentWidth, contentRect.width);
+                const leftEdge = window.innerWidth - CONTENT_MARGIN;
+                const clampedRight = clamp(right, CONTENT_MARGIN, Math.max(CONTENT_MARGIN, leftEdge - contentWidth));
+                this.contentWrapperElement().style.minWidth = `${minContentWidth}px`;
+                this.contentWrapperElement().style.right = `${clampedRight}px`;
+            }
+            // -----------------------------------------------------------------------------------------
+            // Vertical positioning
+            // -----------------------------------------------------------------------------------------
+            const items = this.popup()
+                .items()
+                .map((i) => i.element);
+            const availableHeight = window.innerHeight - CONTENT_MARGIN * 2;
+            const itemsHeight = this.popup().viewport().scrollHeight;
+            const contentStyles = window.getComputedStyle(this.currentElement.nativeElement);
+            const contentBorderTopWidth = Number.parseInt(contentStyles.borderTopWidth, 10);
+            const contentPaddingTop = Number.parseInt(contentStyles.paddingTop, 10);
+            const contentBorderBottomWidth = Number.parseInt(contentStyles.borderBottomWidth, 10);
+            const contentPaddingBottom = Number.parseInt(contentStyles.paddingBottom, 10);
+            const fullContentHeight = contentBorderTopWidth +
+                contentPaddingTop +
+                itemsHeight +
+                contentPaddingBottom +
+                contentBorderBottomWidth;
+            const minContentHeight = Math.min(this.popup().selectedItem().offsetHeight * 5, fullContentHeight);
+            const viewportStyles = window.getComputedStyle(this.popup().viewport());
+            const viewportPaddingTop = Number.parseInt(viewportStyles.paddingTop, 10);
+            const viewportPaddingBottom = Number.parseInt(viewportStyles.paddingBottom, 10);
+            const topEdgeToTriggerMiddle = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN;
+            const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle;
+            const selectedItemHalfHeight = this.popup().selectedItem().offsetHeight / 2;
+            const itemOffsetMiddle = this.popup().selectedItem().offsetTop + selectedItemHalfHeight;
+            const contentTopToItemMiddle = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle;
+            const itemMiddleToContentBottom = fullContentHeight - contentTopToItemMiddle;
+            const willAlignWithoutTopOverflow = contentTopToItemMiddle <= topEdgeToTriggerMiddle;
+            if (willAlignWithoutTopOverflow) {
+                const isLastItem = this.popup().selectedItem() === items[items.length - 1];
+                this.contentWrapperElement().style.bottom = `${0}px`;
+                const viewportOffsetBottom = this.currentElement.nativeElement.clientHeight -
+                    this.popup().viewport().offsetTop -
+                    this.popup().viewport().offsetHeight;
+                const clampedTriggerMiddleToBottomEdge = Math.max(triggerMiddleToBottomEdge, selectedItemHalfHeight +
+                    // viewport might have padding bottom, include it to avoid a scrollable viewport
+                    (isLastItem ? viewportPaddingBottom : 0) +
+                    viewportOffsetBottom +
+                    contentBorderBottomWidth);
+                const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge;
+                this.contentWrapperElement().style.height = `${height}px`;
+            }
+            else {
+                const isFirstItem = this.popup().selectedItem() === items[0];
+                this.contentWrapperElement().style.top = `${0}px`;
+                const clampedTopEdgeToTriggerMiddle = Math.max(topEdgeToTriggerMiddle, contentBorderTopWidth +
+                    this.popup().viewport().offsetTop +
+                    // viewport might have padding top, include it to avoid a scrollable viewport
+                    (isFirstItem ? viewportPaddingTop : 0) +
+                    selectedItemHalfHeight);
+                const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom;
+                this.contentWrapperElement().style.height = `${height}px`;
+                this.popup().viewport().scrollTop =
+                    contentTopToItemMiddle - topEdgeToTriggerMiddle + this.popup().viewport().offsetTop;
+            }
+            this.contentWrapperElement().style.margin = `${CONTENT_MARGIN}px 0`;
+            this.contentWrapperElement().style.minHeight = `${minContentHeight}px`;
+            this.contentWrapperElement().style.maxHeight = `${availableHeight}px`;
+            // -----------------------------------------------------------------------------------------
+            this.placed.emit();
+            // we don't want the initial scroll position adjustment to trigger "expand on scroll"
+            // so we explicitly turn it on only after they've registered.
+            requestAnimationFrame(() => this.shouldExpandOnScrollRef.set(true));
+        }
+    }
+    /**
+     * Touch fallback (Base UI disables item-alignment on touch): position the popup as a plain anchored
+     * dropdown just below the trigger, clamped to the viewport, with no item alignment or pre-scroll.
+     */
+    positionBelowTrigger() {
+        const trigger = this.rootContext.triggerElement();
+        const wrapper = this.contentWrapperElement();
+        if (!trigger || !wrapper) {
+            return;
+        }
+        const triggerRect = trigger.getBoundingClientRect();
+        const availableHeight = window.innerHeight - CONTENT_MARGIN * 2;
+        const maxLeft = Math.max(CONTENT_MARGIN, window.innerWidth - CONTENT_MARGIN - triggerRect.width);
+        wrapper.style.left = `${clamp(triggerRect.left, CONTENT_MARGIN, maxLeft)}px`;
+        wrapper.style.top = `${triggerRect.bottom}px`;
+        wrapper.style.bottom = '';
+        wrapper.style.height = '';
+        wrapper.style.margin = `${CONTENT_MARGIN}px 0`;
+        wrapper.style.minWidth = `${triggerRect.width}px`;
+        wrapper.style.maxHeight = `${availableHeight}px`;
+        this.placed.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemAlignedPosition, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.0.2", type: RdxSelectItemAlignedPosition, isStandalone: true, selector: "[rdxSelectItemAlignedPosition]", outputs: { placed: "placed" }, host: { properties: { "style": "{\n            display: 'flex',\n            flexDirection: 'column',\n            position: 'fixed',\n            zIndex: contentZIndex(),\n        }" } }, providers: [
+            {
+                provide: RDX_SELECT_POSITIONER_TOKEN,
+                useExisting: forwardRef(() => RdxSelectItemAlignedPosition)
+            }
+        ], queries: [{ propertyName: "popup", first: true, predicate: RdxSelectPopup, descendants: true, isSignal: true }, { propertyName: "contentElement", first: true, predicate: RdxSelectItemAlignedPositionContent, descendants: true, isSignal: true }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemAlignedPosition, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxSelectItemAlignedPosition]',
+                    providers: [
+                        {
+                            provide: RDX_SELECT_POSITIONER_TOKEN,
+                            useExisting: forwardRef(() => RdxSelectItemAlignedPosition)
+                        }
+                    ],
+                    host: {
+                        '[style]': `{
+            display: 'flex',
+            flexDirection: 'column',
+            position: 'fixed',
+            zIndex: contentZIndex(),
+        }`
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { popup: [{ type: i0.ContentChild, args: [i0.forwardRef(() => RdxSelectPopup), { isSignal: true }] }], placed: [{ type: i0.Output, args: ["placed"] }], contentElement: [{ type: i0.ContentChild, args: [i0.forwardRef(() => RdxSelectItemAlignedPositionContent), { isSignal: true }] }] } });
+
 class RdxSelectItemIndicator {
     constructor() {
         this.itemContext = injectSelectItemContext();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectItemIndicator, isStandalone: true, selector: "[rdxSelectItemIndicator]", host: { properties: { "attr.aria-hidden": "true", "hidden": "!itemContext.isSelected()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemIndicator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectItemIndicator, isStandalone: true, selector: "[rdxSelectItemIndicator]", host: { properties: { "attr.aria-hidden": "true", "hidden": "!itemContext.isSelected()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectItemIndicator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemIndicator, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectItemIndicator]',
@@ -836,7 +1180,8 @@ class RdxSelectItemText {
                 disabled: this.itemContext.disabled(),
                 textContent: this.elementRef.nativeElement.textContent ?? this.itemContext.value()?.toString() ?? ''
             };
-        }, ...(ngDevMode ? [{ debugName: "optionProps" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "optionProps" }] : /* istanbul ignore next */ []));
         afterNextRender(() => {
             this.itemContext.onItemTextChange(this.elementRef.nativeElement);
             this.contentContext.itemTextRefCallback(this.elementRef.nativeElement, this.itemContext.value(), this.itemContext.disabled());
@@ -847,10 +1192,10 @@ class RdxSelectItemText {
             this.rootContext.onOptionRemove(this.optionProps);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectItemText, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectItemText, isStandalone: true, selector: "[rdxSelectItemText]", host: { properties: { "id": "itemContext.textId" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemText, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectItemText, isStandalone: true, selector: "[rdxSelectItemText]", host: { properties: { "id": "itemContext.textId" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectItemText, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectItemText, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectItemText]',
@@ -864,7 +1209,8 @@ class RdxSelectList {
     constructor() {
         this.contentContext = injectSelectPopupContext();
         this.elementRef = inject((ElementRef));
-        this.prevScrollTopRef = signal(0, ...(ngDevMode ? [{ debugName: "prevScrollTopRef" }] : /* istanbul ignore next */ []));
+        this.prevScrollTopRef = signal(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "prevScrollTopRef" }] : /* istanbul ignore next */ []));
         afterNextRender(() => {
             this.contentContext?.onViewportChange(this.elementRef.nativeElement);
         });
@@ -873,10 +1219,10 @@ class RdxSelectList {
         const viewport = event.currentTarget;
         this.prevScrollTopRef.set(viewport.scrollTop);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectList, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectList, isStandalone: true, selector: "[rdxSelectList]", host: { attributes: { "role": "presentation" }, listeners: { "scroll": "handleScroll($event)" }, properties: { "attr.data-rdx-select-list": "\"\"", "style": "{\n            position: 'relative',\n            flex: 1,\n            overflow: 'hidden auto',\n            scrollbarWidth: 'none'\n        }" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectList, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectList, isStandalone: true, selector: "[rdxSelectList]", host: { attributes: { "role": "presentation" }, listeners: { "scroll": "handleScroll($event)" }, properties: { "attr.data-rdx-select-list": "\"\"", "style": "{\n            position: 'relative',\n            flex: 1,\n            overflow: 'hidden auto',\n            scrollbarWidth: 'none'\n        }" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectList, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectList, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectList]',
@@ -904,10 +1250,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
  * `document.body` while the select is closed.
  */
 class RdxSelectPortal {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectPortal, isStandalone: true, selector: "ng-template[rdxSelectPortal]", providers: [provideRdxPresenceContext(() => ({ present: injectSelectRootContext().open }))], exportAs: ["rdxSelectPortal"], hostDirectives: [{ directive: i1$1.RdxPortalPresence, inputs: ["container", "container"] }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPortal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectPortal, isStandalone: true, selector: "ng-template[rdxSelectPortal]", providers: [provideRdxPresenceContext(() => ({ present: injectSelectRootContext().open }))], exportAs: ["rdxSelectPortal"], hostDirectives: [{ directive: i1$1.RdxPortalPresence, inputs: ["container", "container"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPortal, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPortal, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[rdxSelectPortal]',
@@ -929,10 +1275,10 @@ class RdxSelectPortalMisuseGuard {
                 'rdxSelectPortalPresence has been removed.', 'components/select');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPortalMisuseGuard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectPortalMisuseGuard, isStandalone: true, selector: "[rdxSelectPortal]:not(ng-template)", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPortalMisuseGuard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectPortalMisuseGuard, isStandalone: true, selector: "[rdxSelectPortal]:not(ng-template)", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPortalMisuseGuard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPortalMisuseGuard, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectPortal]:not(ng-template)'
@@ -963,14 +1309,14 @@ class RdxSelectPositioner extends RdxPopperContentWrapper {
             cutout: () => rootContext.triggerElement()
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPositioner, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectPositioner, isStandalone: true, selector: "[rdxSelectPositioner]", host: { properties: { "style": "positionerStyle" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPositioner, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectPositioner, isStandalone: true, selector: "[rdxSelectPositioner]", host: { properties: { "style": "positionerStyle" } }, providers: [
             ...provideRdxPopperContentWrapper(RdxSelectPositioner),
             provideRdxPopperContentConfig({ align: 'start', updatePositionStrategy: 'always' }),
             { provide: RDX_SELECT_POSITIONER_TOKEN, useExisting: forwardRef(() => RdxSelectPositioner) }
         ], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectPositioner, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectPositioner, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectPositioner]',
@@ -987,16 +1333,146 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
+class RdxSelectScrollButtonBase {
+    constructor() {
+        this.contentContext = injectSelectPopupContext();
+        this.autoScrollTimerRef = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "autoScrollTimerRef" }] : /* istanbul ignore next */ []));
+        this.autoScroll = output();
+        effect(() => {
+            this.contentContext.highlightedItem()?.element.scrollIntoView({ block: 'nearest' });
+        });
+        inject(DestroyRef).onDestroy(() => {
+            this.clearAutoScrollTimer();
+        });
+    }
+    clearAutoScrollTimer() {
+        if (this.autoScrollTimerRef() !== null) {
+            window.clearInterval(this.autoScrollTimerRef());
+            this.autoScrollTimerRef.set(null);
+        }
+    }
+    handlePointerDown() {
+        if (this.autoScrollTimerRef() === null) {
+            this.autoScrollTimerRef.set(window.setInterval(() => {
+                this.autoScroll.emit();
+            }, 50));
+        }
+    }
+    handlePointerMove() {
+        this.contentContext.onItemLeave?.();
+        if (this.autoScrollTimerRef() === null) {
+            this.autoScrollTimerRef.set(window.setInterval(() => {
+                this.autoScroll.emit();
+            }, 50));
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectScrollButtonBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectScrollButtonBase, isStandalone: true, selector: "[rdxSelectScrollButtonBase]", outputs: { autoScroll: "autoScroll" }, host: { listeners: { "pointerdown": "handlePointerDown()", "pointermove": "handlePointerMove()", "pointerleave": "clearAutoScrollTimer()" }, properties: { "attr.aria-hidden": "true", "style": "{\n            flexShrink: 0\n        }" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectScrollButtonBase, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxSelectScrollButtonBase]',
+                    host: {
+                        '[attr.aria-hidden]': 'true',
+                        '(pointerdown)': 'handlePointerDown()',
+                        '(pointermove)': 'handlePointerMove()',
+                        '(pointerleave)': 'clearAutoScrollTimer()',
+                        '[style]': `{
+            flexShrink: 0
+        }`
+                    }
+                }]
+        }], ctorParameters: () => [], propDecorators: { autoScroll: [{ type: i0.Output, args: ["autoScroll"] }] } });
+
+class RdxSelectScrollDownButton {
+    constructor() {
+        this.contentContext = injectSelectPopupContext();
+        this.canScrollDown = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "canScrollDown" }] : /* istanbul ignore next */ []));
+        inject(RdxSelectScrollButtonBase).autoScroll.subscribe(() => {
+            const { viewport, selectedItem } = this.contentContext;
+            if (viewport() && selectedItem()) {
+                viewport().scrollTop = viewport().scrollTop + selectedItem().offsetHeight;
+            }
+        });
+        effect((cleanup) => {
+            if (this.contentContext.viewport() && this.contentContext.isPositioned()) {
+                const viewport = this.contentContext.viewport();
+                const handleScroll = () => {
+                    const maxScroll = viewport.scrollHeight - viewport.clientHeight;
+                    // we use Math.ceil here because if the UI is zoomed-in
+                    // `scrollTop` is not always reported as an integer
+                    this.canScrollDown.set(Math.ceil(viewport.scrollTop) < maxScroll);
+                };
+                handleScroll();
+                viewport.addEventListener('scroll', handleScroll);
+                cleanup(() => viewport.removeEventListener('scroll', handleScroll));
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectScrollDownButton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectScrollDownButton, isStandalone: true, selector: "[rdxSelectScrollDownButton]", host: { properties: { "hidden": "!canScrollDown()" } }, hostDirectives: [{ directive: RdxSelectScrollButtonBase }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectScrollDownButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxSelectScrollDownButton]',
+                    hostDirectives: [RdxSelectScrollButtonBase],
+                    host: {
+                        '[hidden]': '!canScrollDown()'
+                    }
+                }]
+        }], ctorParameters: () => [] });
+
+class RdxSelectScrollUpButton {
+    constructor() {
+        this.contentContext = injectSelectPopupContext();
+        this.canScrollUp = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "canScrollUp" }] : /* istanbul ignore next */ []));
+        inject(RdxSelectScrollButtonBase).autoScroll.subscribe(() => {
+            const { viewport, selectedItem } = this.contentContext;
+            if (viewport() && selectedItem()) {
+                viewport().scrollTop = viewport().scrollTop - selectedItem().offsetHeight;
+            }
+        });
+        effect((cleanup) => {
+            if (this.contentContext.viewport() && this.contentContext.isPositioned()) {
+                const viewport = this.contentContext.viewport();
+                const handleScroll = () => {
+                    this.canScrollUp.set(viewport.scrollTop > 0);
+                };
+                handleScroll();
+                viewport.addEventListener('scroll', handleScroll);
+                cleanup(() => viewport.removeEventListener('scroll', handleScroll));
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectScrollUpButton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectScrollUpButton, isStandalone: true, selector: "[rdxSelectScrollUpButton]", host: { properties: { "hidden": "!canScrollUp()" } }, hostDirectives: [{ directive: RdxSelectScrollButtonBase }], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectScrollUpButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdxSelectScrollUpButton]',
+                    hostDirectives: [RdxSelectScrollButtonBase],
+                    host: {
+                        '[hidden]': '!canScrollUp()'
+                    }
+                }]
+        }], ctorParameters: () => [] });
+
 /**
  * A visual divider between groups of items.
  *
  * @group Components
  */
 class RdxSelectSeparator {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.9", type: RdxSelectSeparator, isStandalone: true, selector: "[rdxSelectSeparator]", host: { attributes: { "role": "separator", "aria-hidden": "true" } }, exportAs: ["rdxSelectSeparator"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.2", type: RdxSelectSeparator, isStandalone: true, selector: "[rdxSelectSeparator]", host: { attributes: { "role": "separator", "aria-hidden": "true" } }, exportAs: ["rdxSelectSeparator"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectSeparator, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rdxSelectSeparator]',
@@ -1015,9 +1491,11 @@ class RdxSelectTrigger {
         this.elementRef = inject(ElementRef);
         this.fieldRootContext = injectFieldRootContext(true);
         /** The trigger id; Field labels and descriptions reference it for accessible relationships. */
-        this.id = input(injectId('rdx-select-trigger-'), ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+        this.id = input(injectId('rdx-select-trigger-'), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
         this.disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-        this.isDisabled = computed(() => this.rootContext.disabled() || this.disabled() || Boolean(this.fieldRootContext?.disabledState()), ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+        this.isDisabled = computed(() => this.rootContext.disabled() || this.disabled() || Boolean(this.fieldRootContext?.disabledState()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
         this.triggerInteraction = createRdxTriggerInteraction({
             trigger: () => this.elementRef.nativeElement,
             activeTrigger: () => this.rootContext.triggerElement(),
@@ -1025,10 +1503,16 @@ class RdxSelectTrigger {
             disabled: () => this.isDisabled(),
             contentId: () => this.rootContext.contentId
         });
-        this.invalidState = computed(() => Boolean(this.fieldRootContext?.invalidState()), ...(ngDevMode ? [{ debugName: "invalidState" }] : /* istanbul ignore next */ []));
-        this.requiredState = computed(() => Boolean(this.fieldRootContext?.requiredState()), ...(ngDevMode ? [{ debugName: "requiredState" }] : /* istanbul ignore next */ []));
-        this.filledState = computed(() => !this.rootContext.isEmptyModelValue() || Boolean(this.fieldRootContext?.filledState()), ...(ngDevMode ? [{ debugName: "filledState" }] : /* istanbul ignore next */ []));
-        this.focusedState = computed(() => Boolean(this.fieldRootContext?.focusedState()), ...(ngDevMode ? [{ debugName: "focusedState" }] : /* istanbul ignore next */ []));
+        this.invalidState = computed(() => Boolean(this.fieldRootContext?.invalidState()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "invalidState" }] : /* istanbul ignore next */ []));
+        this.requiredState = computed(() => this.rootContext.required() || Boolean(this.fieldRootContext?.requiredState()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "requiredState" }] : /* istanbul ignore next */ []));
+        this.readOnlyState = computed(() => this.rootContext.readOnly(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "readOnlyState" }] : /* istanbul ignore next */ []));
+        this.filledState = computed(() => !this.rootContext.isEmptyModelValue() || Boolean(this.fieldRootContext?.filledState()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "filledState" }] : /* istanbul ignore next */ []));
+        this.focusedState = computed(() => Boolean(this.fieldRootContext?.focusedState()), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "focusedState" }] : /* istanbul ignore next */ []));
         this.describedBy = computed(() => {
             if (!this.fieldRootContext) {
                 return undefined;
@@ -1038,7 +1522,8 @@ class RdxSelectTrigger {
                 ...(this.fieldRootContext.invalidState() ? this.fieldRootContext.errorIds() : [])
             ];
             return ids.length ? ids.join(' ') : undefined;
-        }, ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
         this.dataAttr = attr;
         afterNextRender(() => {
             this.rootContext.onTriggerChange(this.elementRef);
@@ -1113,10 +1598,10 @@ class RdxSelectTrigger {
         this.fieldRootContext?.setFocused(false);
         this.fieldRootContext?.setTouched(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxSelectTrigger, isStandalone: true, selector: "button[rdxSelectTrigger]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "combobox", "type": "button" }, listeners: { "click": "onClickHandler($event)", "pointerdown": "onPointerDown($event)", "pointerup": "onPointerUp($event)", "keydown": "onKeydown($event)", "focus": "onFocus()", "blur": "onBlur()" }, properties: { "attr.id": "id()", "attr.aria-describedby": "describedBy()", "attr.aria-controls": "triggerInteraction.ariaControls()", "attr.aria-invalid": "invalidState() ? \"true\" : undefined", "attr.aria-required": "requiredState() ? \"true\" : undefined", "attr.disabled": "isDisabled() ? \"\" : undefined", "dir": "rootContext.dir()", "attr.data-state": "triggerInteraction.dataState()", "attr.data-popup-open": "triggerInteraction.dataPopupOpen()", "attr.data-placeholder": "dataAttr(rootContext.isEmptyModelValue())", "attr.data-disabled": "dataAttr(isDisabled())", "attr.data-invalid": "dataAttr(invalidState())", "attr.data-valid": "dataAttr(!invalidState())", "attr.data-required": "dataAttr(requiredState())", "attr.data-filled": "dataAttr(filledState())", "attr.data-focused": "dataAttr(focusedState())" } }, hostDirectives: [{ directive: i1.RdxPopperAnchor }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxSelectTrigger, isStandalone: true, selector: "button[rdxSelectTrigger]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "combobox", "type": "button" }, listeners: { "click": "onClickHandler($event)", "pointerdown": "onPointerDown($event)", "pointerup": "onPointerUp($event)", "keydown": "onKeydown($event)", "focus": "onFocus()", "blur": "onBlur()" }, properties: { "attr.id": "id()", "attr.aria-describedby": "describedBy()", "attr.aria-controls": "triggerInteraction.ariaControls()", "attr.aria-invalid": "invalidState() ? \"true\" : undefined", "attr.aria-required": "requiredState() ? \"true\" : undefined", "attr.aria-readonly": "readOnlyState() ? \"true\" : undefined", "attr.disabled": "isDisabled() ? \"\" : undefined", "dir": "rootContext.dir()", "attr.data-popup-open": "triggerInteraction.dataPopupOpen()", "attr.data-placeholder": "dataAttr(rootContext.isEmptyModelValue())", "attr.data-disabled": "dataAttr(isDisabled())", "attr.data-invalid": "dataAttr(invalidState())", "attr.data-valid": "dataAttr(!invalidState())", "attr.data-required": "dataAttr(requiredState())", "attr.data-readonly": "dataAttr(readOnlyState())", "attr.data-filled": "dataAttr(filledState())", "attr.data-focused": "dataAttr(focusedState())" } }, hostDirectives: [{ directive: i1.RdxPopperAnchor }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[rdxSelectTrigger]',
@@ -1129,15 +1614,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                         '[attr.aria-controls]': 'triggerInteraction.ariaControls()',
                         '[attr.aria-invalid]': 'invalidState() ? "true" : undefined',
                         '[attr.aria-required]': 'requiredState() ? "true" : undefined',
+                        '[attr.aria-readonly]': 'readOnlyState() ? "true" : undefined',
                         '[attr.disabled]': 'isDisabled() ? "" : undefined',
                         '[dir]': 'rootContext.dir()',
-                        '[attr.data-state]': 'triggerInteraction.dataState()',
                         '[attr.data-popup-open]': 'triggerInteraction.dataPopupOpen()',
                         '[attr.data-placeholder]': 'dataAttr(rootContext.isEmptyModelValue())',
                         '[attr.data-disabled]': 'dataAttr(isDisabled())',
                         '[attr.data-invalid]': 'dataAttr(invalidState())',
                         '[attr.data-valid]': 'dataAttr(!invalidState())',
                         '[attr.data-required]': 'dataAttr(requiredState())',
+                        '[attr.data-readonly]': 'dataAttr(readOnlyState())',
                         '[attr.data-filled]': 'dataAttr(filledState())',
                         '[attr.data-focused]': 'dataAttr(focusedState())',
                         '(click)': 'onClickHandler($event)',
@@ -1154,10 +1640,12 @@ class RdxSelectValue {
     constructor() {
         this.rootContext = injectSelectRootContext();
         this.elementRef = inject(ElementRef);
-        this.placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.placeholder = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
         this.slotText = computed(() => {
             return this.selectedLabel().length ? this.selectedLabel().join(', ') : this.placeholder();
-        }, ...(ngDevMode ? [{ debugName: "slotText" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "slotText" }] : /* istanbul ignore next */ []));
         this.selectedLabel = computed(() => {
             const options = Array.from(this.rootContext.optionsSet());
             const customLabel = this.rootContext.itemToStringLabel();
@@ -1171,15 +1659,16 @@ class RdxSelectValue {
             const value = this.rootContext.value();
             const list = Array.isArray(value) ? value.map((v) => labelFor(v)) : [labelFor(value)];
             return list.filter(Boolean);
-        }, ...(ngDevMode ? [{ debugName: "selectedLabel" }] : /* istanbul ignore next */ []));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "selectedLabel" }] : /* istanbul ignore next */ []));
         afterNextRender(() => {
             this.rootContext.valueElement.set(this.elementRef.nativeElement);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectValue, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.9", type: RdxSelectValue, isStandalone: true, selector: "span[rdxSelectValue]", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.pointer-events": "\"none\"" } }, exportAs: ["rdxSelectedValue"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectValue, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: RdxSelectValue, isStandalone: true, selector: "span[rdxSelectValue]", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.pointer-events": "\"none\"" } }, exportAs: ["rdxSelectedValue"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: RdxSelectValue, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: RdxSelectValue, decorators: [{
             type: Directive,
             args: [{
                     selector: 'span[rdxSelectValue]',
@@ -1204,6 +1693,10 @@ const _importsSelect = [
     RdxSelectGroupLabel,
     RdxSelectGroup,
     RdxSelectPositioner,
+    RdxSelectItemAlignedPosition,
+    RdxSelectItemAlignedPositionContent,
+    RdxSelectScrollUpButton,
+    RdxSelectScrollDownButton,
     RdxSelectIcon,
     RdxSelectSeparator,
     RdxSelectBackdrop
@@ -1213,5 +1706,5 @@ const _importsSelect = [
  * Generated bundle index. Do not edit.
  */
 
-export { CONTENT_MARGIN, OPEN_KEYS, RDX_SELECT_POSITIONER_TOKEN, RdxSelectBackdrop, RdxSelectGroup, RdxSelectGroupLabel, RdxSelectIcon, RdxSelectItem, RdxSelectItemIndicator, RdxSelectItemText, RdxSelectList, RdxSelectPopup, RdxSelectPortal, RdxSelectPortalMisuseGuard, RdxSelectPositioner, RdxSelectRoot, RdxSelectSeparator, RdxSelectTrigger, RdxSelectValue, SELECTION_KEYS, _importsSelect, compare, focusFirst, injectSelectItemContext, injectSelectPopupContext, injectSelectRootContext, provideSelectItemContext, provideSelectPopupContext, provideSelectRootContext, shouldShowPlaceholder, valueComparator };
+export { CONTENT_MARGIN, OPEN_KEYS, RDX_SELECT_POSITIONER_TOKEN, RdxSelectBackdrop, RdxSelectGroup, RdxSelectGroupLabel, RdxSelectIcon, RdxSelectItem, RdxSelectItemAlignedPosition, RdxSelectItemAlignedPositionContent, RdxSelectItemIndicator, RdxSelectItemText, RdxSelectList, RdxSelectPopup, RdxSelectPortal, RdxSelectPortalMisuseGuard, RdxSelectPositioner, RdxSelectRoot, RdxSelectScrollButtonBase, RdxSelectScrollDownButton, RdxSelectScrollUpButton, RdxSelectSeparator, RdxSelectTrigger, RdxSelectValue, SELECTION_KEYS, _importsSelect, compare, focusFirst, injectSelectItemContext, injectSelectPopupContext, injectSelectRootContext, provideSelectItemContext, provideSelectPopupContext, provideSelectRootContext, shouldShowPlaceholder, valueComparator };
 //# sourceMappingURL=radix-ng-primitives-select.mjs.map