@base-ui/react 1.4.0 → 1.4.1

package/esm/navigation-menu/arrow/NavigationMenuArrow.js

@@ -4,7 +4,7 @@ import * as React from 'react';
 import { useNavigationMenuPositionerContext } from "../positioner/NavigationMenuPositionerContext.js";
 import { useNavigationMenuRootContext } from "../root/NavigationMenuRootContext.js";
 import { popupStateMapping } from "../../utils/popupStateMapping.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 
 /**
  * Displays an element pointing toward the navigation menu's current anchor.

package/esm/navigation-menu/backdrop/NavigationMenuBackdrop.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
-import type { TransitionStatus } from "../../utils/useTransitionStatus.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
+import type { TransitionStatus } from "../../internals/useTransitionStatus.js";
 /**
  * A backdrop for the navigation menu popup.
  * Renders a `<div>` element.

package/esm/navigation-menu/backdrop/NavigationMenuBackdrop.js

@@ -1,9 +1,9 @@
 'use client';
 
 import * as React from 'react';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useNavigationMenuRootContext } from "../root/NavigationMenuRootContext.js";
-import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
+import { transitionStatusMapping } from "../../internals/stateAttributesMapping.js";
 import { popupStateMapping as baseMapping } from "../../utils/popupStateMapping.js";
 const stateAttributesMapping = {
   ...baseMapping,

package/esm/navigation-menu/content/NavigationMenuContent.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
-import { TransitionStatus } from "../../utils/useTransitionStatus.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
+import { TransitionStatus } from "../../internals/useTransitionStatus.js";
 /**
  * A container for the content of the navigation menu item that is moved into the popup
  * when the item is active.

package/esm/navigation-menu/content/NavigationMenuContent.js

@@ -4,16 +4,16 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
 import { inertValue } from '@base-ui/utils/inertValue';
+import { EMPTY_OBJECT } from '@base-ui/utils/empty';
 import { FloatingNode } from "../../floating-ui-react/index.js";
 import { contains, getTarget } from "../../floating-ui-react/utils.js";
 import { useNavigationMenuRootContext, useNavigationMenuTreeContext } from "../root/NavigationMenuRootContext.js";
 import { useNavigationMenuItemContext } from "../item/NavigationMenuItemContext.js";
-import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
-import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
-import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
-import { CompositeRoot } from "../../composite/root/CompositeRoot.js";
+import { useTransitionStatus } from "../../internals/useTransitionStatus.js";
+import { useOpenChangeComplete } from "../../internals/useOpenChangeComplete.js";
+import { transitionStatusMapping } from "../../internals/stateAttributesMapping.js";
+import { CompositeRoot } from "../../internals/composite/root/CompositeRoot.js";
 import { popupStateMapping } from "../../utils/popupStateMapping.js";
-import { EMPTY_OBJECT } from "../../utils/constants.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const stateAttributesMapping = {
   ...popupStateMapping,

package/esm/navigation-menu/icon/NavigationMenuIcon.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * An icon that indicates that the trigger button opens a menu.
  *

package/esm/navigation-menu/icon/NavigationMenuIcon.js

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useNavigationMenuRootContext } from "../root/NavigationMenuRootContext.js";
 import { triggerOpenStateMapping } from "../../utils/popupStateMapping.js";
 import { useNavigationMenuItemContext } from "../item/NavigationMenuItemContext.js";

package/esm/navigation-menu/item/NavigationMenuItem.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * An individual navigation menu item.
  * Renders a `<li>` element.

package/esm/navigation-menu/item/NavigationMenuItem.js

@@ -1,9 +1,9 @@
 'use client';
 
 import * as React from 'react';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { NavigationMenuItemContext } from "./NavigationMenuItemContext.js";
-import { useBaseUiId } from "../../utils/useBaseUiId.js";
+import { useBaseUiId } from "../../internals/useBaseUiId.js";
 
 /**
  * An individual navigation menu item.

package/esm/navigation-menu/link/NavigationMenuLink.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * A link in the navigation menu that can be used to navigate to a different page or section.
  * Renders an `<a>` element.

package/esm/navigation-menu/link/NavigationMenuLink.js

@@ -4,9 +4,9 @@ import * as React from 'react';
 import { useFloatingTree } from "../../floating-ui-react/index.js";
 import { useNavigationMenuRootContext, useNavigationMenuTreeContext } from "../root/NavigationMenuRootContext.js";
 import { isOutsideMenuEvent } from "../utils/isOutsideMenuEvent.js";
-import { CompositeItem } from "../../composite/item/CompositeItem.js";
-import { createChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
+import { CompositeItem } from "../../internals/composite/item/CompositeItem.js";
+import { createChangeEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
 
 /**
  * A link in the navigation menu that can be used to navigate to a different page or section.

package/esm/navigation-menu/list/NavigationMenuList.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * Contains a list of navigation menu items.
  * Renders a `<ul>` element.

package/esm/navigation-menu/list/NavigationMenuList.js

@@ -1,15 +1,15 @@
 'use client';
 
 import * as React from 'react';
+import { EMPTY_OBJECT } from '@base-ui/utils/empty';
 import { useDismiss, useHoverFloatingInteraction } from "../../floating-ui-react/index.js";
 import { getTarget } from "../../floating-ui-react/utils.js";
-import { CompositeRoot } from "../../composite/root/CompositeRoot.js";
+import { CompositeRoot } from "../../internals/composite/root/CompositeRoot.js";
 import { useNavigationMenuRootContext, useNavigationMenuTreeContext } from "../root/NavigationMenuRootContext.js";
-import { EMPTY_OBJECT } from "../../utils/constants.js";
 import { NAVIGATION_MENU_TRIGGER_IDENTIFIER } from "../utils/constants.js";
 import { NavigationMenuDismissContext } from "./NavigationMenuDismissContext.js";
 import { getEmptyRootContext } from "../../floating-ui-react/utils/getEmptyRootContext.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 
 /**
  * Contains a list of navigation menu items.

package/esm/navigation-menu/popup/NavigationMenuPopup.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
-import type { TransitionStatus } from "../../utils/useTransitionStatus.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
+import type { TransitionStatus } from "../../internals/useTransitionStatus.js";
 import { Align, Side } from "../../utils/useAnchorPositioning.js";
 /**
  * A container for the navigation menu contents.

package/esm/navigation-menu/popup/NavigationMenuPopup.js

@@ -1,12 +1,12 @@
 'use client';
 
 import * as React from 'react';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useNavigationMenuRootContext } from "../root/NavigationMenuRootContext.js";
-import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
-import { useBaseUiId } from "../../utils/useBaseUiId.js";
+import { transitionStatusMapping } from "../../internals/stateAttributesMapping.js";
+import { useBaseUiId } from "../../internals/useBaseUiId.js";
 import { useNavigationMenuPositionerContext } from "../positioner/NavigationMenuPositionerContext.js";
-import { useDirection } from "../../direction-provider/DirectionContext.js";
+import { useDirection } from "../../internals/direction-context/DirectionContext.js";
 import { popupStateMapping as baseMapping } from "../../utils/popupStateMapping.js";
 const stateAttributesMapping = {
   ...baseMapping,

package/esm/navigation-menu/positioner/NavigationMenuPositioner.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 import { type Align, type Side, type UseAnchorPositioningSharedParameters } from "../../utils/useAnchorPositioning.js";
 /**
  * Positions the navigation menu against the currently active trigger.

package/esm/navigation-menu/positioner/NavigationMenuPositioner.js

@@ -12,7 +12,7 @@ import { useNavigationMenuRootContext, useNavigationMenuTreeContext } from "../r
 import { useNavigationMenuPortalContext } from "../portal/NavigationMenuPortalContext.js";
 import { useAnchorPositioning } from "../../utils/useAnchorPositioning.js";
 import { NavigationMenuPositionerContext } from "./NavigationMenuPositionerContext.js";
-import { DROPDOWN_COLLISION_AVOIDANCE, POPUP_COLLISION_AVOIDANCE } from "../../utils/constants.js";
+import { DROPDOWN_COLLISION_AVOIDANCE, POPUP_COLLISION_AVOIDANCE } from "../../internals/constants.js";
 import { adaptiveOrigin } from "../../utils/adaptiveOriginMiddleware.js";
 import { usePositioner } from "../../utils/usePositioner.js";
 import { jsx as _jsx } from "react/jsx-runtime";

package/esm/navigation-menu/root/NavigationMenuRoot.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
-import { type BaseUIChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
+import { type BaseUIChangeEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
 /**
  * Groups all parts of the navigation menu.
  * Renders a `<nav>` element at the root, or `<div>` element when nested.

package/esm/navigation-menu/root/NavigationMenuRoot.js

@@ -7,12 +7,12 @@ import { useStableCallback } from '@base-ui/utils/useStableCallback';
 import { ownerDocument } from '@base-ui/utils/owner';
 import { FloatingNode, FloatingTree, useFloatingNodeId, useFloatingParentNodeId } from "../../floating-ui-react/index.js";
 import { activeElement, contains } from "../../floating-ui-react/utils.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { NavigationMenuRootContext, NavigationMenuTreeContext, useNavigationMenuRootContext } from "./NavigationMenuRootContext.js";
-import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
-import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
+import { useOpenChangeComplete } from "../../internals/useOpenChangeComplete.js";
+import { useTransitionStatus } from "../../internals/useTransitionStatus.js";
 import { getCssDimensions } from "../../utils/getCssDimensions.js";
-import { REASONS } from "../../utils/reasons.js";
+import { REASONS } from "../../internals/reasons.js";
 import { NavigationMenuPopupCssVars } from "../popup/NavigationMenuPopupCssVars.js";
 import { NavigationMenuPositionerCssVars } from "../positioner/NavigationMenuPositionerCssVars.js";
 import { jsx as _jsx } from "react/jsx-runtime";

package/esm/navigation-menu/root/NavigationMenuRootContext.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { FloatingRootContext } from "../../floating-ui-react/index.js";
-import type { TransitionStatus } from "../../utils/useTransitionStatus.js";
+import type { TransitionStatus } from "../../internals/useTransitionStatus.js";
 import type { NavigationMenuRoot } from "./NavigationMenuRoot.js";
 export type NavigationMenuPopupAutoSizeResetState = {
   abortController: AbortController | null;

package/esm/navigation-menu/trigger/NavigationMenuTrigger.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+import type { BaseUIComponentProps, NativeButtonProps } from "../../internals/types.js";
 /**
  * Opens the navigation menu popup when hovered or clicked, revealing the
  * associated content.

package/esm/navigation-menu/trigger/NavigationMenuTrigger.js

@@ -10,21 +10,22 @@ import { useStableCallback } from '@base-ui/utils/useStableCallback';
 import { useTimeout } from '@base-ui/utils/useTimeout';
 import { useAnimationFrame } from '@base-ui/utils/useAnimationFrame';
 import { useValueAsRef } from '@base-ui/utils/useValueAsRef';
+import { EMPTY_ARRAY } from '@base-ui/utils/empty';
 import { safePolygon, useClick, useFloatingRootContext, useFloatingTree, useHoverReferenceInteraction, useInteractions } from "../../floating-ui-react/index.js";
 import { applySafePolygonPointerEventsMutation, clearSafePolygonPointerEventsMutation, useHoverInteractionSharedState } from "../../floating-ui-react/hooks/useHoverInteractionSharedState.js";
 import { contains, getTabbableAfterElement, getNextTabbable, getPreviousTabbable, isOutsideEvent, stopEvent } from "../../floating-ui-react/utils.js";
 import { useNavigationMenuItemContext } from "../item/NavigationMenuItemContext.js";
 import { useNavigationMenuRootContext, useNavigationMenuTreeContext } from "../root/NavigationMenuRootContext.js";
-import { createChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
-import { EMPTY_ARRAY, ownerVisuallyHidden, PATIENT_CLICK_THRESHOLD } from "../../utils/constants.js";
+import { createChangeEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
+import { ownerVisuallyHidden, PATIENT_CLICK_THRESHOLD } from "../../internals/constants.js";
 import { FocusGuard } from "../../utils/FocusGuard.js";
 import { pressableTriggerOpenStateMapping } from "../../utils/popupStateMapping.js";
-import { TransitionStatusDataAttributes } from "../../utils/stateAttributesMapping.js";
+import { TransitionStatusDataAttributes } from "../../internals/stateAttributesMapping.js";
 import { isOutsideMenuEvent } from "../utils/isOutsideMenuEvent.js";
-import { CompositeItem } from "../../composite/item/CompositeItem.js";
-import { useButton } from "../../use-button/index.js";
-import { useAnimationsFinished } from "../../utils/useAnimationsFinished.js";
+import { CompositeItem } from "../../internals/composite/item/CompositeItem.js";
+import { useButton } from "../../internals/use-button/index.js";
+import { useAnimationsFinished } from "../../internals/useAnimationsFinished.js";
 import { getCssDimensions } from "../../utils/getCssDimensions.js";
 import { NAVIGATION_MENU_TRIGGER_IDENTIFIER } from "../utils/constants.js";
 import { useNavigationMenuDismissContext } from "../list/NavigationMenuDismissContext.js";
@@ -113,7 +114,14 @@ export const NavigationMenuTrigger = /*#__PURE__*/React.forwardRef(function Navi
     popupAutoSizeResetRef.current.abortController = null;
     popupAutoSizeResetRef.current.owner = null;
   });
-  React.useEffect(cancelAutoSizeReset, [isActiveItem, cancelAutoSizeReset]);
+  useIsoLayoutEffect(() => {
+    if (isActiveItem) {
+      return;
+    }
+    mutationFrame.cancel();
+    sizeFrame.cancel();
+    cancelAutoSizeReset();
+  }, [isActiveItem, mutationFrame, sizeFrame, cancelAutoSizeReset]);
   function setAutoSizes() {
     if (!popupElement) {
       return;
@@ -177,6 +185,9 @@ export const NavigationMenuTrigger = /*#__PURE__*/React.forwardRef(function Navi
     positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerWidth, `${syncPositioner ? currentWidth : measuredWidth}px`);
     positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerHeight, `${syncPositioner ? currentHeight : measuredHeight}px`);
     sizeFrame.request(() => {
+      if (!isActiveItemRef.current) {
+        return;
+      }
       popupElement.style.setProperty(NavigationMenuPopupCssVars.popupWidth, `${measuredWidth}px`);
       popupElement.style.setProperty(NavigationMenuPopupCssVars.popupHeight, `${measuredHeight}px`);
       if (syncPositioner) {
@@ -208,6 +219,9 @@ export const NavigationMenuTrigger = /*#__PURE__*/React.forwardRef(function Navi
         const measuredHeight = height || currentHeight || prevSizeRef.current.height;
         setSharedFixedSizes(currentWidth, currentHeight);
         sizeFrame.request(() => {
+          if (!isActiveItemRef.current) {
+            return;
+          }
           setSharedFixedSizes(measuredWidth, measuredHeight);
           scheduleAutoSizeReset();
         });

package/esm/navigation-menu/viewport/NavigationMenuViewport.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * The clipping viewport of the navigation menu's current content.
  * Renders a `<div>` element.

package/esm/navigation-menu/viewport/NavigationMenuViewport.js

@@ -4,7 +4,7 @@ import * as React from 'react';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
 import { useId } from '@base-ui/utils/useId';
 import { inertValue } from '@base-ui/utils/inertValue';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useNavigationMenuRootContext } from "../root/NavigationMenuRootContext.js";
 import { FocusGuard } from "../../utils/FocusGuard.js";
 import { getNextTabbable, getPreviousTabbable, isOutsideEvent, contains } from "../../floating-ui-react/utils.js";

package/esm/number-field/decrement/NumberFieldDecrement.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+import { BaseUIComponentProps, NativeButtonProps } from "../../internals/types.js";
 import type { NumberFieldRootState } from "../root/NumberFieldRoot.js";
 /**
  * A stepper button that decreases the field value when clicked.

package/esm/number-field/decrement/NumberFieldDecrement.js

@@ -1,8 +1,8 @@
 'use client';
 
 import * as React from 'react';
-import { useRenderElement } from "../../utils/useRenderElement.js";
-import { useButton } from "../../use-button/index.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
+import { useButton } from "../../internals/use-button/index.js";
 import { useNumberFieldRootContext } from "../root/NumberFieldRootContext.js";
 import { useNumberFieldButton } from "../root/useNumberFieldButton.js";
 import { stateAttributesMapping } from "../utils/stateAttributesMapping.js";

package/esm/number-field/decrement/NumberFieldDecrementDataAttributes.d.ts

@@ -16,11 +16,11 @@ export declare enum NumberFieldDecrementDataAttributes {
    */
   required = "data-required",
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   valid = "data-valid",
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   invalid = "data-invalid",
   /**

package/esm/number-field/decrement/NumberFieldDecrementDataAttributes.js

@@ -16,11 +16,11 @@ export let NumberFieldDecrementDataAttributes = /*#__PURE__*/function (NumberFie
    */
   NumberFieldDecrementDataAttributes["required"] = "data-required";
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   NumberFieldDecrementDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   NumberFieldDecrementDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/number-field/group/NumberFieldGroup.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { NumberFieldRootState } from "../root/NumberFieldRoot.js";
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * Groups the input with the increment and decrement buttons.
  * Renders a `<div>` element.

package/esm/number-field/group/NumberFieldGroup.js

@@ -3,7 +3,7 @@
 import * as React from 'react';
 import { useNumberFieldRootContext } from "../root/NumberFieldRootContext.js";
 import { stateAttributesMapping } from "../utils/stateAttributesMapping.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 
 /**
  * Groups the input with the increment and decrement buttons.

package/esm/number-field/group/NumberFieldGroupDataAttributes.d.ts

@@ -16,11 +16,11 @@ export declare enum NumberFieldGroupDataAttributes {
    */
   required = "data-required",
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   valid = "data-valid",
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   invalid = "data-invalid",
   /**

package/esm/number-field/group/NumberFieldGroupDataAttributes.js

@@ -16,11 +16,11 @@ export let NumberFieldGroupDataAttributes = /*#__PURE__*/function (NumberFieldGr
    */
   NumberFieldGroupDataAttributes["required"] = "data-required";
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   NumberFieldGroupDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   NumberFieldGroupDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/number-field/increment/NumberFieldIncrement.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+import type { BaseUIComponentProps, NativeButtonProps } from "../../internals/types.js";
 import type { NumberFieldRootState } from "../root/NumberFieldRoot.js";
 /**
  * A stepper button that increases the field value when clicked.

package/esm/number-field/increment/NumberFieldIncrement.js

@@ -1,8 +1,8 @@
 'use client';
 
 import * as React from 'react';
-import { useRenderElement } from "../../utils/useRenderElement.js";
-import { useButton } from "../../use-button/index.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
+import { useButton } from "../../internals/use-button/index.js";
 import { useNumberFieldRootContext } from "../root/NumberFieldRootContext.js";
 import { useNumberFieldButton } from "../root/useNumberFieldButton.js";
 import { stateAttributesMapping } from "../utils/stateAttributesMapping.js";

package/esm/number-field/increment/NumberFieldIncrementDataAttributes.d.ts

@@ -16,11 +16,11 @@ export declare enum NumberFieldIncrementDataAttributes {
    */
   required = "data-required",
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   valid = "data-valid",
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   invalid = "data-invalid",
   /**

package/esm/number-field/increment/NumberFieldIncrementDataAttributes.js

@@ -16,11 +16,11 @@ export let NumberFieldIncrementDataAttributes = /*#__PURE__*/function (NumberFie
    */
   NumberFieldIncrementDataAttributes["required"] = "data-required";
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   NumberFieldIncrementDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   NumberFieldIncrementDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/number-field/input/NumberFieldInput.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 import type { NumberFieldRootState } from "../root/NumberFieldRoot.js";
 /**
  * The native input control in the number field.

package/esm/number-field/input/NumberFieldInput.js

@@ -3,19 +3,19 @@
 import * as React from 'react';
 import { stopEvent } from "../../floating-ui-react/utils.js";
 import { useNumberFieldRootContext } from "../root/NumberFieldRootContext.js";
-import { useFieldRootContext } from "../../field/root/FieldRootContext.js";
-import { useRegisterFieldControl } from "../../field/root/useRegisterFieldControl.js";
-import { fieldValidityMapping } from "../../field/utils/constants.js";
-import { useFormContext } from "../../form/FormContext.js";
-import { useLabelableContext } from "../../labelable-provider/LabelableContext.js";
+import { useFieldRootContext } from "../../internals/field-root-context/FieldRootContext.js";
+import { useRegisterFieldControl } from "../../internals/field-register-control/useRegisterFieldControl.js";
+import { fieldValidityMapping } from "../../internals/field-constants/constants.js";
+import { useFormContext } from "../../internals/form-context/FormContext.js";
+import { useLabelableContext } from "../../internals/labelable-provider/LabelableContext.js";
 import { DEFAULT_STEP } from "../utils/constants.js";
 import { ARABIC_DETECT_RE, PERSIAN_DETECT_RE, HAN_DETECT_RE, FULLWIDTH_DETECT_RE, getNumberLocaleDetails, parseNumber, ANY_MINUS_RE, ANY_PLUS_RE, ANY_MINUS_DETECT_RE, ANY_PLUS_DETECT_RE } from "../utils/parse.js";
 import { stateAttributesMapping as numberFieldStateAttributesMapping } from "../utils/stateAttributesMapping.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
-import { createChangeEventDetails, createGenericEventDetails } from "../../utils/createBaseUIEventDetails.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
+import { createChangeEventDetails, createGenericEventDetails } from "../../internals/createBaseUIEventDetails.js";
 import { formatNumber, formatNumberMaxPrecision } from "../../utils/formatNumber.js";
-import { useValueChanged } from "../../utils/useValueChanged.js";
-import { REASONS } from "../../utils/reasons.js";
+import { useValueChanged } from "../../internals/useValueChanged.js";
+import { REASONS } from "../../internals/reasons.js";
 const stateAttributesMapping = {
   ...fieldValidityMapping,
   ...numberFieldStateAttributesMapping

package/esm/number-field/input/NumberFieldInputDataAttributes.d.ts

@@ -16,11 +16,11 @@ export declare enum NumberFieldInputDataAttributes {
    */
   required = "data-required",
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   valid = "data-valid",
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   invalid = "data-invalid",
   /**

package/esm/number-field/input/NumberFieldInputDataAttributes.js

@@ -16,11 +16,11 @@ export let NumberFieldInputDataAttributes = /*#__PURE__*/function (NumberFieldIn
    */
   NumberFieldInputDataAttributes["required"] = "data-required";
   /**
-   * Present when the number field is in valid state (when wrapped in Field.Root).
+   * Present when the number field is in a valid state (when wrapped in Field.Root).
    */
   NumberFieldInputDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the number field is in invalid state (when wrapped in Field.Root).
+   * Present when the number field is in an invalid state (when wrapped in Field.Root).
    */
   NumberFieldInputDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/number-field/root/NumberFieldRoot.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import type { FieldRootState } from "../../field/root/FieldRoot.js";
-import type { BaseUIComponentProps } from "../../utils/types.js";
+import type { BaseUIComponentProps } from "../../internals/types.js";
 import type { ChangeEventCustomProperties } from "../utils/types.js";
-import { type BaseUIChangeEventDetails, type BaseUIGenericEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
+import { type BaseUIChangeEventDetails, type BaseUIGenericEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
 /**
  * Groups all parts of the number field and manages its state.
  * Renders a `<div>` element.

package/esm/number-field/root/NumberFieldRoot.js

@@ -13,16 +13,16 @@ import { ownerDocument } from '@base-ui/utils/owner';
 import { isIOS } from '@base-ui/utils/detectBrowser';
 import { activeElement } from "../../floating-ui-react/utils.js";
 import { NumberFieldRootContext } from "./NumberFieldRootContext.js";
-import { useFieldRootContext } from "../../field/root/FieldRootContext.js";
-import { useLabelableId } from "../../labelable-provider/useLabelableId.js";
+import { useFieldRootContext } from "../../internals/field-root-context/FieldRootContext.js";
+import { useLabelableId } from "../../internals/labelable-provider/useLabelableId.js";
 import { stateAttributesMapping } from "../utils/stateAttributesMapping.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { getNumberLocaleDetails, PERMILLE, PERCENTAGES, SPACE_SEPARATOR_RE, BASE_NON_NUMERIC_SYMBOLS, MINUS_SIGNS_WITH_ASCII, PLUS_SIGNS_WITH_ASCII } from "../utils/parse.js";
 import { formatNumber, formatNumberMaxPrecision } from "../../utils/formatNumber.js";
 import { DEFAULT_STEP } from "../utils/constants.js";
 import { toValidatedNumber } from "../utils/validate.js";
-import { createChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
+import { createChangeEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
 
 /**
  * Groups all parts of the number field and manages its state.