@base-ui/react 1.4.0 → 1.5.0

package/esm/autocomplete/trigger/AutocompleteTrigger.d.ts

@@ -1,7 +1,7 @@
 import type * as React from 'react';
 import type { FieldRootState } from "../../field/root/FieldRoot.js";
 import type { Side } from "../../utils/useAnchorPositioning.js";
-import type { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+import type { BaseUIComponentProps, NativeButtonProps } from "../../internals/types.js";
 /**
  * A button that opens the popup.
  * Renders a `<button>` element.

package/esm/autocomplete/trigger/AutocompleteTriggerDataAttributes.d.ts

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

package/esm/autocomplete/trigger/AutocompleteTriggerDataAttributes.js

@@ -26,11 +26,11 @@ export let AutocompleteTriggerDataAttributes = function (AutocompleteTriggerData
    */
   AutocompleteTriggerDataAttributes["required"] = "data-required";
   /**
-   * Present when the component is in valid state (when wrapped in Field.Root).
+   * Present when the component is in a valid state (when wrapped in Field.Root).
    */
   AutocompleteTriggerDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the component is in invalid state (when wrapped in Field.Root).
+   * Present when the component is in an invalid state (when wrapped in Field.Root).
    */
   AutocompleteTriggerDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/avatar/fallback/AvatarFallback.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { BaseUIComponentProps } from "../../utils/types.js";
+import { BaseUIComponentProps } from "../../internals/types.js";
 import type { AvatarRootState } from "../root/AvatarRoot.js";
 /**
  * Rendered when the image fails to load or when no image is provided.

package/esm/avatar/fallback/AvatarFallback.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { useTimeout } from '@base-ui/utils/useTimeout';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useAvatarRootContext } from "../root/AvatarRootContext.js";
 import { avatarStateAttributesMapping } from "../root/stateAttributesMapping.js";
 

package/esm/avatar/image/AvatarImage.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { BaseUIComponentProps } from "../../utils/types.js";
+import { BaseUIComponentProps } from "../../internals/types.js";
 import type { AvatarRootState } from "../root/AvatarRoot.js";
-import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
+import { type TransitionStatus } from "../../internals/useTransitionStatus.js";
 import { ImageLoadingStatus } from "./useImageLoadingStatus.js";
 /**
  * The image to be displayed in the avatar.

package/esm/avatar/image/AvatarImage.js

@@ -3,12 +3,12 @@
 import * as React from 'react';
 import { useStableCallback } from '@base-ui/utils/useStableCallback';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useAvatarRootContext } from "../root/AvatarRootContext.js";
 import { avatarStateAttributesMapping } from "../root/stateAttributesMapping.js";
-import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
-import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
-import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
+import { useOpenChangeComplete } from "../../internals/useOpenChangeComplete.js";
+import { transitionStatusMapping } from "../../internals/stateAttributesMapping.js";
+import { useTransitionStatus } from "../../internals/useTransitionStatus.js";
 import { useImageLoadingStatus } from "./useImageLoadingStatus.js";
 const stateAttributesMapping = {
   ...avatarStateAttributesMapping,
@@ -52,10 +52,6 @@ export const AvatarImage = /*#__PURE__*/React.forwardRef(function AvatarImage(co
       handleLoadingStatusChange(imageLoadingStatus);
     }
   }, [imageLoadingStatus, handleLoadingStatusChange]);
-  const state = {
-    imageLoadingStatus,
-    transitionStatus
-  };
   useOpenChangeComplete({
     open: isVisible,
     ref: imageRef,
@@ -65,6 +61,10 @@ export const AvatarImage = /*#__PURE__*/React.forwardRef(function AvatarImage(co
       }
     }
   });
+  const state = {
+    imageLoadingStatus,
+    transitionStatus
+  };
   const element = useRenderElement('img', componentProps, {
     state,
     ref: [forwardedRef, imageRef],

package/esm/avatar/image/AvatarImageDataAttributes.js

@@ -1,4 +1,4 @@
-import { TransitionStatusDataAttributes } from "../../utils/stateAttributesMapping.js";
+import { TransitionStatusDataAttributes } from "../../internals/stateAttributesMapping.js";
 export let AvatarImageDataAttributes = function (AvatarImageDataAttributes) {
   /**
    * Present when the image is animating in.

package/esm/avatar/image/useImageLoadingStatus.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
-import { NOOP } from "../../utils/noop.js";
+import { NOOP } from "../../internals/noop.js";
 export function useImageLoadingStatus(src, {
   referrerPolicy,
   crossOrigin

package/esm/avatar/root/AvatarRoot.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { BaseUIComponentProps } from "../../utils/types.js";
+import { BaseUIComponentProps } from "../../internals/types.js";
 /**
  * Displays a user's profile picture, initials, or fallback icon.
  * Renders a `<span>` element.

package/esm/avatar/root/AvatarRoot.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 { AvatarRootContext } from "./AvatarRootContext.js";
 import { avatarStateAttributesMapping } from "./stateAttributesMapping.js";
 

package/esm/button/Button.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";
 /**
  * A button component that can be used to trigger actions.
  * Renders a `<button>` element.

package/esm/button/Button.js

@@ -1,8 +1,8 @@
 'use client';
 
 import * as React from 'react';
-import { useButton } from "../use-button/useButton.js";
-import { useRenderElement } from "../utils/useRenderElement.js";
+import { useButton } from "../internals/use-button/useButton.js";
+import { useRenderElement } from "../internals/useRenderElement.js";
 /**
  * A button component that can be used to trigger actions.
  * Renders a `<button>` element.

package/esm/checkbox/indicator/CheckboxIndicator.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { CheckboxRootState } from "../root/CheckboxRoot.js";
-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";
 /**
  * Indicates whether the checkbox is ticked.
  * Renders a `<span>` element.

package/esm/checkbox/indicator/CheckboxIndicator.js

@@ -2,12 +2,12 @@
 
 import * as React from 'react';
 import { useCheckboxRootContext } from "../root/CheckboxRootContext.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
 import { useStateAttributesMapping } from "../utils/useStateAttributesMapping.js";
-import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
-import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
-import { transitionStatusMapping } from "../../utils/stateAttributesMapping.js";
-import { fieldValidityMapping } from "../../field/utils/constants.js";
+import { useOpenChangeComplete } from "../../internals/useOpenChangeComplete.js";
+import { useTransitionStatus } from "../../internals/useTransitionStatus.js";
+import { transitionStatusMapping } from "../../internals/stateAttributesMapping.js";
+import { fieldValidityMapping } from "../../internals/field-constants/constants.js";
 
 /**
  * Indicates whether the checkbox is ticked.
@@ -45,11 +45,11 @@ export const CheckboxIndicator = /*#__PURE__*/React.forwardRef(function Checkbox
     }
   });
   const baseStateAttributesMapping = useStateAttributesMapping(rootState);
-  const stateAttributesMapping = React.useMemo(() => ({
+  const stateAttributesMapping = {
     ...baseStateAttributesMapping,
     ...transitionStatusMapping,
     ...fieldValidityMapping
-  }), [baseStateAttributesMapping]);
+  };
   const shouldRender = keepMounted || mounted;
   const element = useRenderElement('span', componentProps, {
     ref: [forwardedRef, indicatorRef],

package/esm/checkbox/indicator/CheckboxIndicatorDataAttributes.d.ts

@@ -32,11 +32,11 @@ export declare enum CheckboxIndicatorDataAttributes {
    */
   endingStyle = "data-ending-style",
   /**
-   * Present when the checkbox is in valid state (when wrapped in Field.Root).
+   * Present when the checkbox is in a valid state (when wrapped in Field.Root).
    */
   valid = "data-valid",
   /**
-   * Present when the checkbox is in invalid state (when wrapped in Field.Root).
+   * Present when the checkbox is in an invalid state (when wrapped in Field.Root).
    */
   invalid = "data-invalid",
   /**

package/esm/checkbox/indicator/CheckboxIndicatorDataAttributes.js

@@ -1,4 +1,4 @@
-import { TransitionStatusDataAttributes } from "../../utils/stateAttributesMapping.js";
+import { TransitionStatusDataAttributes } from "../../internals/stateAttributesMapping.js";
 export let CheckboxIndicatorDataAttributes = function (CheckboxIndicatorDataAttributes) {
   /**
    * Present when the checkbox is checked.
@@ -33,11 +33,11 @@ export let CheckboxIndicatorDataAttributes = function (CheckboxIndicatorDataAttr
    */
   CheckboxIndicatorDataAttributes[CheckboxIndicatorDataAttributes["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle";
   /**
-   * Present when the checkbox is in valid state (when wrapped in Field.Root).
+   * Present when the checkbox is in a valid state (when wrapped in Field.Root).
    */
   CheckboxIndicatorDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the checkbox is in invalid state (when wrapped in Field.Root).
+   * Present when the checkbox is in an invalid state (when wrapped in Field.Root).
    */
   CheckboxIndicatorDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/checkbox/root/CheckboxRoot.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import type { BaseUIComponentProps, NonNativeButtonProps } from "../../utils/types.js";
+import type { BaseUIComponentProps, NonNativeButtonProps } from "../../internals/types.js";
 import type { FieldRootState } from "../../field/root/FieldRoot.js";
-import { BaseUIChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
+import { BaseUIChangeEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
 export declare const PARENT_CHECKBOX = "data-parent";
 /**
  * Represents the checkbox itself.

package/esm/checkbox/root/CheckboxRoot.js

@@ -3,28 +3,29 @@
 import * as React from 'react';
 import { EMPTY_OBJECT } from '@base-ui/utils/empty';
 import { useControlled } from '@base-ui/utils/useControlled';
-import { useStableCallback } from '@base-ui/utils/useStableCallback';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
 import { useMergedRefs } from '@base-ui/utils/useMergedRefs';
 import { useRefWithInit } from '@base-ui/utils/useRefWithInit';
 import { visuallyHidden, visuallyHiddenInput } from '@base-ui/utils/visuallyHidden';
-import { NOOP } from "../../utils/noop.js";
+import { ownerWindow } from '@base-ui/utils/owner';
+import { getDefaultFormSubmitter } from '@base-ui/utils/getDefaultFormSubmitter';
+import { NOOP } from "../../internals/noop.js";
 import { useStateAttributesMapping } from "../utils/useStateAttributesMapping.js";
-import { useRenderElement } from "../../utils/useRenderElement.js";
-import { useBaseUiId } from "../../utils/useBaseUiId.js";
+import { useRenderElement } from "../../internals/useRenderElement.js";
+import { useBaseUiId } from "../../internals/useBaseUiId.js";
 import { mergeProps } from "../../merge-props/index.js";
-import { useButton } from "../../use-button/useButton.js";
-import { useFieldRootContext } from "../../field/root/FieldRootContext.js";
-import { useRegisterFieldControl } from "../../field/root/useRegisterFieldControl.js";
+import { useButton } from "../../internals/use-button/useButton.js";
+import { useFieldRootContext } from "../../internals/field-root-context/FieldRootContext.js";
+import { useRegisterFieldControl } from "../../internals/field-register-control/useRegisterFieldControl.js";
 import { useFieldItemContext } from "../../field/item/FieldItemContext.js";
-import { useFormContext } from "../../form/FormContext.js";
-import { useLabelableContext } from "../../labelable-provider/LabelableContext.js";
-import { useAriaLabelledBy } from "../../labelable-provider/useAriaLabelledBy.js";
+import { useFormContext } from "../../internals/form-context/FormContext.js";
+import { useLabelableContext } from "../../internals/labelable-provider/LabelableContext.js";
+import { useAriaLabelledBy } from "../../internals/labelable-provider/useAriaLabelledBy.js";
 import { useCheckboxGroupContext } from "../../checkbox-group/CheckboxGroupContext.js";
 import { CheckboxRootContext } from "./CheckboxRootContext.js";
-import { createChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { REASONS } from "../../utils/reasons.js";
-import { useValueChanged } from "../../utils/useValueChanged.js";
+import { createChangeEventDetails } from "../../internals/createBaseUIEventDetails.js";
+import { REASONS } from "../../internals/reasons.js";
+import { useValueChanged } from "../../internals/useValueChanged.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const PARENT_CHECKBOX = 'data-parent';
 
@@ -46,7 +47,7 @@ export const CheckboxRoot = /*#__PURE__*/React.forwardRef(function CheckboxRoot(
     indeterminate = false,
     inputRef: inputRefProp,
     name: nameProp,
-    onCheckedChange: onCheckedChangeProp,
+    onCheckedChange,
     parent = false,
     readOnly = false,
     render,
@@ -102,7 +103,6 @@ export const CheckboxRoot = /*#__PURE__*/React.forwardRef(function CheckboxRoot(
       groupProps = groupContext.parent.getChildProps(value);
     }
   }
-  const onCheckedChange = useStableCallback(onCheckedChangeProp);
   const {
     checked: groupChecked = checkedProp,
     indeterminate: groupIndeterminate = indeterminate,
@@ -138,7 +138,7 @@ export const CheckboxRoot = /*#__PURE__*/React.forwardRef(function CheckboxRoot(
     hasRegisteredRef.current = true;
     registerControlId(controlSourceRef.current, inputId);
     return undefined;
-  }, [inputId, groupContext, registerControlId, parent, controlSourceRef]);
+  }, [inputId, registerControlId, controlSourceRef]);
   React.useEffect(() => {
     const controlSource = controlSourceRef.current;
     return () => {
@@ -149,11 +149,7 @@ export const CheckboxRoot = /*#__PURE__*/React.forwardRef(function CheckboxRoot(
       registerControlId(controlSource, undefined);
     };
   }, [registerControlId, controlSourceRef]);
-  useRegisterFieldControl(controlRef, {
-    enabled: !groupContext,
-    id,
-    value: checked
-  });
+  useRegisterFieldControl(controlRef, id, checked, undefined, !groupContext);
   const inputRef = React.useRef(null);
   const mergedInputRef = useMergedRefs(inputRefProp, inputRef, validation.inputRef);
   const ariaLabelledBy = useAriaLabelledBy(ariaLabelledByProp, labelId, inputRef, !nativeButton, inputId ?? undefined);
@@ -205,7 +201,7 @@ export const CheckboxRoot = /*#__PURE__*/React.forwardRef(function CheckboxRoot(
       const nextChecked = event.currentTarget.checked;
       const details = createChangeEventDetails(REASONS.none, event.nativeEvent);
       groupOnChange?.(nextChecked, details);
-      onCheckedChange(nextChecked, details);
+      onCheckedChange?.(nextChecked, details);
       if (details.isCanceled) {
         return;
       }
@@ -270,12 +266,54 @@ export const CheckboxRoot = /*#__PURE__*/React.forwardRef(function CheckboxRoot(
           validation.commit(groupContext ? groupValue : inputEl.checked);
         }
       },
+      onKeyDown(event) {
+        if (event.key !== 'Enter') {
+          return;
+        }
+
+        // Let consumer `preventDefault()` handlers opt out while defensively stopping
+        // any remaining Base UI Enter handling from treating the checkbox as a button.
+        event.preventBaseUIHandler();
+        if (event.defaultPrevented) {
+          return;
+        }
+        const formToSubmit = inputRef.current?.form ?? null;
+        const currentTarget = event.currentTarget;
+        const nativeEvent = event.nativeEvent;
+        const originalPreventDefault = event.preventDefault;
+        const originalNativePreventDefault = nativeEvent.preventDefault;
+        let preventDefaultCalledAfterPropagation = false;
+        event.preventDefault = () => {
+          preventDefaultCalledAfterPropagation = true;
+          originalPreventDefault.call(event);
+        };
+        nativeEvent.preventDefault = () => {
+          preventDefaultCalledAfterPropagation = true;
+          originalNativePreventDefault.call(nativeEvent);
+        };
+
+        // Enter should not activate/toggle the checkbox. Cancel the native button behavior
+        // without setting React's synthetic `defaultPrevented`, so ancestor React handlers
+        // can still opt out by calling `preventDefault()` during propagation.
+        originalNativePreventDefault.call(nativeEvent);
+        ownerWindow(currentTarget).queueMicrotask(() => {
+          event.preventDefault = originalPreventDefault;
+          nativeEvent.preventDefault = originalNativePreventDefault;
+          if (!preventDefaultCalledAfterPropagation) {
+            getDefaultFormSubmitter(formToSubmit)?.click();
+          }
+        });
+      },
       onClick(event) {
         if (readOnly || disabled) {
           return;
         }
         event.preventDefault();
-        inputRef.current?.dispatchEvent(new PointerEvent('click', {
+        const input = inputRef.current;
+        if (!input) {
+          return;
+        }
+        input.dispatchEvent(new (ownerWindow(input).PointerEvent)('click', {
           bubbles: true,
           shiftKey: event.shiftKey,
           ctrlKey: event.ctrlKey,

package/esm/checkbox/root/CheckboxRootDataAttributes.d.ts

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

package/esm/checkbox/root/CheckboxRootDataAttributes.js

@@ -24,11 +24,11 @@ export let CheckboxRootDataAttributes = /*#__PURE__*/function (CheckboxRootDataA
    */
   CheckboxRootDataAttributes["required"] = "data-required";
   /**
-   * Present when the checkbox is in valid state (when wrapped in Field.Root).
+   * Present when the checkbox is in a valid state (when wrapped in Field.Root).
    */
   CheckboxRootDataAttributes["valid"] = "data-valid";
   /**
-   * Present when the checkbox is in invalid state (when wrapped in Field.Root).
+   * Present when the checkbox is in an invalid state (when wrapped in Field.Root).
    */
   CheckboxRootDataAttributes["invalid"] = "data-invalid";
   /**

package/esm/checkbox/utils/useStateAttributesMapping.d.ts

@@ -1,3 +1,3 @@
-import type { StateAttributesMapping } from "../../utils/getStateAttributesProps.js";
+import type { StateAttributesMapping } from "../../internals/getStateAttributesProps.js";
 import type { CheckboxRootState } from "../root/CheckboxRoot.js";
 export declare function useStateAttributesMapping(state: CheckboxRootState): StateAttributesMapping<CheckboxRootState>;

package/esm/checkbox/utils/useStateAttributesMapping.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { CheckboxRootDataAttributes } from "../root/CheckboxRootDataAttributes.js";
-import { fieldValidityMapping } from "../../field/utils/constants.js";
+import { fieldValidityMapping } from "../../internals/field-constants/constants.js";
 export function useStateAttributesMapping(state) {
   return React.useMemo(() => ({
     checked(value) {

package/esm/checkbox-group/CheckboxGroup.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import type { FieldRootState } from "../field/root/FieldRoot.js";
-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";
 /**
  * Provides a shared state to a series of checkboxes.
  *

package/esm/checkbox-group/CheckboxGroup.js

@@ -3,19 +3,19 @@
 import * as React from 'react';
 import { useControlled } from '@base-ui/utils/useControlled';
 import { useStableCallback } from '@base-ui/utils/useStableCallback';
-import { useBaseUiId } from "../utils/useBaseUiId.js";
-import { useRenderElement } from "../utils/useRenderElement.js";
+import { EMPTY_ARRAY } from '@base-ui/utils/empty';
+import { useBaseUiId } from "../internals/useBaseUiId.js";
+import { useRenderElement } from "../internals/useRenderElement.js";
 import { CheckboxGroupContext } from "./CheckboxGroupContext.js";
-import { useFieldRootContext } from "../field/root/FieldRootContext.js";
-import { useRegisterFieldControl } from "../field/root/useRegisterFieldControl.js";
-import { useLabelableContext } from "../labelable-provider/LabelableContext.js";
-import { fieldValidityMapping } from "../field/utils/constants.js";
+import { useFieldRootContext } from "../internals/field-root-context/FieldRootContext.js";
+import { useRegisterFieldControl } from "../internals/field-register-control/useRegisterFieldControl.js";
+import { useLabelableContext } from "../internals/labelable-provider/LabelableContext.js";
+import { fieldValidityMapping } from "../internals/field-constants/constants.js";
 import { PARENT_CHECKBOX } from "../checkbox/root/CheckboxRoot.js";
 import { useCheckboxGroupParent } from "./useCheckboxGroupParent.js";
-import { useFormContext } from "../form/FormContext.js";
-import { useValueChanged } from "../utils/useValueChanged.js";
-import { areArraysEqual } from "../utils/areArraysEqual.js";
-import { EMPTY_ARRAY } from "../utils/constants.js";
+import { useFormContext } from "../internals/form-context/FormContext.js";
+import { useValueChanged } from "../internals/useValueChanged.js";
+import { areArraysEqual } from "../internals/areArraysEqual.js";
 
 /**
  * Provides a shared state to a series of checkboxes.
@@ -85,11 +85,7 @@ export const CheckboxGroup = /*#__PURE__*/React.forwardRef(function CheckboxGrou
       controlRef.current = element;
     }
   }, []);
-  useRegisterFieldControl(controlRef, {
-    enabled: !!fieldName,
-    id,
-    value
-  });
+  useRegisterFieldControl(controlRef, id, value, undefined, !!fieldName);
   const resolvedValue = value ?? EMPTY_ARRAY;
   useValueChanged(resolvedValue, () => {
     if (fieldName) {

package/esm/checkbox-group/CheckboxGroupContext.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import type { UseFieldValidationReturnValue } from "../field/root/useFieldValidation.js";
 import type { UseCheckboxGroupParentReturnValue } from "./useCheckboxGroupParent.js";
-import type { BaseUIChangeEventDetails } from "../utils/createBaseUIEventDetails.js";
-import type { BaseUIEventReasons } from "../utils/reasons.js";
+import type { BaseUIChangeEventDetails } from "../internals/createBaseUIEventDetails.js";
+import type { BaseUIEventReasons } from "../internals/reasons.js";
 export interface CheckboxGroupContext {
   value: string[] | undefined;
   defaultValue: string[] | undefined;

package/esm/checkbox-group/useCheckboxGroupParent.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { BaseUIChangeEventDetails } from "../utils/createBaseUIEventDetails.js";
-import type { BaseUIEventReasons } from "../utils/reasons.js";
+import type { BaseUIChangeEventDetails } from "../internals/createBaseUIEventDetails.js";
+import type { BaseUIEventReasons } from "../internals/reasons.js";
 export declare function useCheckboxGroupParent(params: UseCheckboxGroupParentParameters): UseCheckboxGroupParentReturnValue;
 export interface UseCheckboxGroupParentParameters {
   allValues?: string[] | undefined;

package/esm/checkbox-group/useCheckboxGroupParent.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { useStableCallback } from '@base-ui/utils/useStableCallback';
-import { useBaseUiId } from "../utils/useBaseUiId.js";
+import { useBaseUiId } from "../internals/useBaseUiId.js";
 const EMPTY = [];
 export function useCheckboxGroupParent(params) {
   const {

package/esm/collapsible/panel/CollapsiblePanel.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { BaseUIComponentProps } from "../../utils/types.js";
+import { BaseUIComponentProps } from "../../internals/types.js";
 import type { CollapsibleRootState } from "../root/CollapsibleRoot.js";
-import type { TransitionStatus } from "../../utils/useTransitionStatus.js";
+import type { TransitionStatus } from "../../internals/useTransitionStatus.js";
 /**
  * A panel with the collapsible contents.
  * Renders a `<div>` element.