@base-ui/react 1.2.0 → 1.3.0

package/field/control/FieldControl.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { FieldRoot } from "../root/FieldRoot.js";
+import { type FieldRootState } from "../root/FieldRoot.js";
 import { BaseUIComponentProps } from "../../utils/types.js";
 import { REASONS } from "../../utils/reasons.js";
 import type { BaseUIChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
@@ -14,8 +14,8 @@ import type { BaseUIChangeEventDetails } from "../../utils/createBaseUIEventDeta
  * Documentation: [Base UI Field](https://base-ui.com/react/components/field)
  */
 export declare const FieldControl: React.ForwardRefExoticComponent<Omit<FieldControlProps, "ref"> & React.RefAttributes<HTMLElement>>;
-export type FieldControlState = FieldRoot.State;
-export interface FieldControlProps extends BaseUIComponentProps<'input', FieldControl.State> {
+export interface FieldControlState extends FieldRootState {}
+export interface FieldControlProps extends BaseUIComponentProps<'input', FieldControlState> {
   /**
    * Callback fired when the `value` changes. Use when controlled.
    */

package/field/description/FieldDescription.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { FieldRoot } from "../root/FieldRoot.js";
+import { type FieldRootState } from "../root/FieldRoot.js";
 import type { BaseUIComponentProps } from "../../utils/types.js";
 /**
  * A paragraph with additional information about the field.
@@ -8,8 +8,8 @@ import type { BaseUIComponentProps } from "../../utils/types.js";
  * Documentation: [Base UI Field](https://base-ui.com/react/components/field)
  */
 export declare const FieldDescription: React.ForwardRefExoticComponent<Omit<FieldDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-export type FieldDescriptionState = FieldRoot.State;
-export interface FieldDescriptionProps extends BaseUIComponentProps<'p', FieldDescription.State> {}
+export interface FieldDescriptionState extends FieldRootState {}
+export interface FieldDescriptionProps extends BaseUIComponentProps<'p', FieldDescriptionState> {}
 export declare namespace FieldDescription {
   type State = FieldDescriptionState;
   type Props = FieldDescriptionProps;

package/field/error/FieldError.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { FieldRoot } from "../root/FieldRoot.js";
+import { type FieldRootState } from "../root/FieldRoot.js";
 import type { BaseUIComponentProps } from "../../utils/types.js";
 import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
 /**
@@ -9,17 +9,20 @@ import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
  * Documentation: [Base UI Field](https://base-ui.com/react/components/field)
  */
 export declare const FieldError: React.ForwardRefExoticComponent<Omit<FieldErrorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export interface FieldErrorState extends FieldRoot.State {
+export interface FieldErrorState extends FieldRootState {
+  /**
+   * The transition status of the component.
+   */
   transitionStatus: TransitionStatus;
 }
-export interface FieldErrorProps extends BaseUIComponentProps<'div', FieldError.State> {
+export interface FieldErrorProps extends BaseUIComponentProps<'div', FieldErrorState> {
   /**
    * Determines whether to show the error message according to the field’s
    * [ValidityState](https://developer.mozilla.org/en-US/docs/Web/API/ValidityState).
    * Specifying `true` will always show the error message, and lets external libraries
    * control the visibility.
    */
-  match?: (boolean | keyof ValidityState) | undefined;
+  match?: boolean | keyof ValidityState | undefined;
 }
 export declare namespace FieldError {
   type State = FieldErrorState;

package/field/error/FieldErrorDataAttributes.d.ts

@@ -27,4 +27,12 @@ export declare enum FieldErrorDataAttributes {
    * Present when the field control is focused.
    */
   focused = "data-focused",
+  /**
+   * Present when the error message is animating in.
+   */
+  startingStyle = "data-starting-style",
+  /**
+   * Present when the error message is animating out.
+   */
+  endingStyle = "data-ending-style",
 }

package/field/error/FieldErrorDataAttributes.js

@@ -4,7 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FieldErrorDataAttributes = void 0;
-let FieldErrorDataAttributes = exports.FieldErrorDataAttributes = /*#__PURE__*/function (FieldErrorDataAttributes) {
+var _stateAttributesMapping = require("../../utils/stateAttributesMapping");
+let FieldErrorDataAttributes = exports.FieldErrorDataAttributes = function (FieldErrorDataAttributes) {
   /**
    * Present when the field is disabled.
    */
@@ -33,5 +34,13 @@ let FieldErrorDataAttributes = exports.FieldErrorDataAttributes = /*#__PURE__*/f
    * Present when the field control is focused.
    */
   FieldErrorDataAttributes["focused"] = "data-focused";
+  /**
+   * Present when the error message is animating in.
+   */
+  FieldErrorDataAttributes[FieldErrorDataAttributes["startingStyle"] = _stateAttributesMapping.TransitionStatusDataAttributes.startingStyle] = "startingStyle";
+  /**
+   * Present when the error message is animating out.
+   */
+  FieldErrorDataAttributes[FieldErrorDataAttributes["endingStyle"] = _stateAttributesMapping.TransitionStatusDataAttributes.endingStyle] = "endingStyle";
   return FieldErrorDataAttributes;
 }({});

package/field/item/FieldItem.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { FieldRoot } from "../root/FieldRoot.js";
+import { type FieldRootState } from "../root/FieldRoot.js";
 import type { BaseUIComponentProps } from "../../utils/types.js";
 /**
  * Groups individual items in a checkbox group or radio group with a label and description.
@@ -8,7 +8,8 @@ import type { BaseUIComponentProps } from "../../utils/types.js";
  * Documentation: [Base UI Field](https://base-ui.com/react/components/field)
  */
 export declare const FieldItem: React.ForwardRefExoticComponent<Omit<FieldItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export interface FieldItemProps extends BaseUIComponentProps<'div', FieldItem.State> {
+export interface FieldItemState extends FieldRootState {}
+export interface FieldItemProps extends BaseUIComponentProps<'div', FieldItemState> {
   /**
    * Whether the wrapped control should ignore user interaction.
    * The `disabled` prop on `<Field.Root>` takes precedence over this.
@@ -17,6 +18,6 @@ export interface FieldItemProps extends BaseUIComponentProps<'div', FieldItem.St
   disabled?: boolean | undefined;
 }
 export declare namespace FieldItem {
-  type State = FieldRoot.State;
+  type State = FieldItemState;
   type Props = FieldItemProps;
 }

package/field/item/FieldItem.js

@@ -37,7 +37,7 @@ const FieldItem = exports.FieldItem = /*#__PURE__*/React.forwardRef(function Fie
   const parentId = checkboxGroupContext?.parent.id;
   // this a more reliable check
   const hasParentCheckbox = checkboxGroupContext?.allValues !== undefined;
-  const initialControlId = hasParentCheckbox ? parentId : undefined;
+  const controlId = hasParentCheckbox ? parentId : undefined;
   const fieldItemContext = React.useMemo(() => ({
     disabled
   }), [disabled]);
@@ -48,7 +48,7 @@ const FieldItem = exports.FieldItem = /*#__PURE__*/React.forwardRef(function Fie
     stateAttributesMapping: _constants.fieldValidityMapping
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_labelableProvider.LabelableProvider, {
-    initialControlId: initialControlId,
+    controlId: controlId,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FieldItemContext.FieldItemContext.Provider, {
       value: fieldItemContext,
       children: element

package/field/label/FieldLabel.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { FieldRoot } from "../root/FieldRoot.js";
+import type { FieldRootState } from "../root/FieldRoot.js";
 import type { BaseUIComponentProps } from "../../utils/types.js";
 /**
  * An accessible label that is automatically associated with the field control.
@@ -8,8 +8,8 @@ import type { BaseUIComponentProps } from "../../utils/types.js";
  * Documentation: [Base UI Field](https://base-ui.com/react/components/field)
  */
 export declare const FieldLabel: React.ForwardRefExoticComponent<Omit<FieldLabelProps, "ref"> & React.RefAttributes<HTMLElement>>;
-export type FieldLabelState = FieldRoot.State;
-export interface FieldLabelProps extends BaseUIComponentProps<'label', FieldLabel.State> {
+export interface FieldLabelState extends FieldRootState {}
+export interface FieldLabelProps extends BaseUIComponentProps<'label', FieldLabelState> {
   /**
    * Whether the component renders a native `<label>` element when replacing it via the `render` prop.
    * Set to `false` if the rendered element is not a label (e.g. `<div>`).

package/field/label/FieldLabel.js

@@ -9,16 +9,11 @@ exports.FieldLabel = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _error = require("@base-ui/utils/error");
 var _safeReact = require("@base-ui/utils/safeReact");
-var _dom = require("@floating-ui/utils/dom");
-var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
-var _owner = require("@base-ui/utils/owner");
-var _useStableCallback = require("@base-ui/utils/useStableCallback");
-var _utils = require("../../floating-ui-react/utils");
 var _FieldRootContext = require("../root/FieldRootContext");
-var _LabelableContext = require("../../labelable-provider/LabelableContext");
 var _constants = require("../utils/constants");
-var _useBaseUiId = require("../../utils/useBaseUiId");
 var _useRenderElement = require("../../utils/useRenderElement");
+var _LabelableContext = require("../../labelable-provider/LabelableContext");
+var _useLabel = require("../../labelable-provider/useLabel");
 /**
  * An accessible label that is automatically associated with the field control.
  * Renders a `<label>` element.
@@ -35,34 +30,12 @@ const FieldLabel = exports.FieldLabel = /*#__PURE__*/React.forwardRef(function F
   } = componentProps;
   const fieldRootContext = (0, _FieldRootContext.useFieldRootContext)(false);
   const {
-    controlId,
-    setLabelId,
     labelId
   } = (0, _LabelableContext.useLabelableContext)();
-  const id = (0, _useBaseUiId.useBaseUiId)(idProp);
   const labelRef = React.useRef(null);
-  const handleInteraction = (0, _useStableCallback.useStableCallback)(event => {
-    const target = (0, _utils.getTarget)(event.nativeEvent);
-    if (target?.closest('button,input,select,textarea')) {
-      return;
-    }
-
-    // Prevent text selection when double clicking label.
-    if (!event.defaultPrevented && event.detail > 1) {
-      event.preventDefault();
-    }
-    if (nativeLabel || !controlId) {
-      return;
-    }
-    const controlElement = (0, _owner.ownerDocument)(event.currentTarget).getElementById(controlId);
-    if ((0, _dom.isHTMLElement)(controlElement)) {
-      controlElement.focus({
-        // Available from Chrome 144+ (January 2026).
-        // Safari and Firefox already support it.
-        // @ts-expect-error not available in types yet
-        focusVisible: true
-      });
-    }
+  const labelProps = (0, _useLabel.useLabel)({
+    id: labelId ?? idProp,
+    native: nativeLabel
   });
   if (process.env.NODE_ENV !== 'production') {
     // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -84,28 +57,10 @@ const FieldLabel = exports.FieldLabel = /*#__PURE__*/React.forwardRef(function F
       }
     }, [nativeLabel]);
   }
-  (0, _useIsoLayoutEffect.useIsoLayoutEffect)(() => {
-    if (id) {
-      setLabelId(id);
-    }
-    return () => {
-      setLabelId(undefined);
-    };
-  }, [id, setLabelId]);
   const element = (0, _useRenderElement.useRenderElement)('label', componentProps, {
     ref: [forwardedRef, labelRef],
     state: fieldRootContext.state,
-    props: [{
-      id: labelId
-    }, nativeLabel ? {
-      htmlFor: controlId ?? undefined,
-      onMouseDown: handleInteraction
-    } : {
-      onClick: handleInteraction,
-      onPointerDown(event) {
-        event.preventDefault();
-      }
-    }, elementProps],
+    props: [labelProps, elementProps],
     stateAttributesMapping: _constants.fieldValidityMapping
   });
   return element;

package/field/root/FieldRoot.d.ts

@@ -31,15 +31,32 @@ export interface FieldRootActions {
   validate: () => void;
 }
 export interface FieldRootState {
-  /** Whether the component should ignore user interaction. */
+  /**
+   * Whether the component should ignore user interaction.
+   */
   disabled: boolean;
+  /**
+   * Whether the field has been touched.
+   */
   touched: boolean;
+  /**
+   * Whether the field value has changed from its initial value.
+   */
   dirty: boolean;
+  /**
+   * Whether the field is valid.
+   */
   valid: boolean | null;
+  /**
+   * Whether the field has a value.
+   */
   filled: boolean;
+  /**
+   * Whether the field is focused.
+   */
   focused: boolean;
 }
-export interface FieldRootProps extends BaseUIComponentProps<'div', FieldRoot.State> {
+export interface FieldRootProps extends BaseUIComponentProps<'div', FieldRootState> {
   /**
    * Whether the component should ignore user interaction.
    * Takes precedence over the `disabled` prop on the `<Field.Control>` component.

package/field/root/FieldRoot.js

@@ -66,7 +66,8 @@ var _jsxRuntime = require("react/jsx-runtime");
     setTouchedUnwrapped(value);
   });
   const shouldValidateOnChange = (0, _useStableCallback.useStableCallback)(() => validationMode === 'onChange' || validationMode === 'onSubmit' && submitAttemptedRef.current);
-  const invalid = Boolean(invalidProp || name && {}.hasOwnProperty.call(errors, name) && errors[name] !== undefined);
+  const hasFormError = !!name && Object.hasOwn(errors, name) && errors[name] !== undefined;
+  const invalid = invalidProp === true || hasFormError;
   const [validityData, setValidityData] = React.useState({
     state: _constants.DEFAULT_VALIDITY_STATE,
     error: '',

package/field/root/FieldRootContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { FieldRoot, FieldValidityData } from "./FieldRoot.js";
+import type { FieldValidityData, FieldRootState } from "./FieldRoot.js";
 import type { Form } from "../../form/index.js";
 import type { UseFieldValidationReturnValue } from "./useFieldValidation.js";
 export interface FieldRootContext {
@@ -20,7 +20,7 @@ export interface FieldRootContext {
   validationMode: Form.ValidationMode;
   validationDebounceTime: number;
   shouldValidateOnChange: () => boolean;
-  state: FieldRoot.State;
+  state: FieldRootState;
   markedDirtyRef: React.RefObject<boolean>;
   validation: UseFieldValidationReturnValue;
 }

package/field/root/FieldRootContext.js

@@ -25,26 +25,19 @@ const FieldRootContext = exports.FieldRootContext = /*#__PURE__*/React.createCon
   },
   setValidityData: _noop.NOOP,
   disabled: undefined,
-  touched: false,
+  touched: _constants.DEFAULT_FIELD_STATE_ATTRIBUTES.touched,
   setTouched: _noop.NOOP,
-  dirty: false,
+  dirty: _constants.DEFAULT_FIELD_STATE_ATTRIBUTES.dirty,
   setDirty: _noop.NOOP,
-  filled: false,
+  filled: _constants.DEFAULT_FIELD_STATE_ATTRIBUTES.filled,
   setFilled: _noop.NOOP,
-  focused: false,
+  focused: _constants.DEFAULT_FIELD_STATE_ATTRIBUTES.focused,
   setFocused: _noop.NOOP,
   validate: () => null,
   validationMode: 'onSubmit',
   validationDebounceTime: 0,
   shouldValidateOnChange: () => false,
-  state: {
-    disabled: false,
-    valid: null,
-    touched: false,
-    dirty: false,
-    filled: false,
-    focused: false
-  },
+  state: _constants.DEFAULT_FIELD_ROOT_STATE,
   markedDirtyRef: {
     current: false
   },

package/field/root/useFieldValidation.js

@@ -197,6 +197,7 @@ function useFieldValidation(params) {
       if (currentFieldData) {
         formRef.current.fields.set(controlId, {
           ...currentFieldData,
+          // Keep Form-level errors part of overall field validity for submit blocking/focus logic.
           ...(0, _getCombinedFieldValidityData.getCombinedFieldValidityData)(nextValidityData, invalid)
         });
       }
@@ -217,9 +218,9 @@ function useFieldValidation(params) {
         commit(event.currentTarget.value, true);
         return;
       }
-      if (invalid) {
-        return;
-      }
+
+      // When validating on change, run client-side validation even if
+      // externally invalid
       const element = event.currentTarget;
       if (element.value === '') {
         // Ignore the debounce time for empty values.
@@ -235,7 +236,7 @@ function useFieldValidation(params) {
         commit(element.value);
       }
     }
-  }, getValidationProps(externalProps)), [getValidationProps, clearErrors, name, timeout, commit, invalid, validationDebounceTime, shouldValidateOnChange]);
+  }, getValidationProps(externalProps)), [getValidationProps, clearErrors, name, timeout, commit, validationDebounceTime, shouldValidateOnChange]);
   return React.useMemo(() => ({
     getValidationProps,
     getInputValidationProps,

package/field/utils/constants.d.ts

@@ -1,3 +1,4 @@
+import type { FieldRootState } from "../root/FieldRoot.js";
 export declare const DEFAULT_VALIDITY_STATE: {
   badInput: boolean;
   customError: boolean;
@@ -11,6 +12,8 @@ export declare const DEFAULT_VALIDITY_STATE: {
   valid: null;
   valueMissing: boolean;
 };
+export declare const DEFAULT_FIELD_STATE_ATTRIBUTES: Pick<FieldRootState, 'valid' | 'touched' | 'dirty' | 'filled' | 'focused'>;
+export declare const DEFAULT_FIELD_ROOT_STATE: FieldRootState;
 export declare const fieldValidityMapping: {
   valid(value: boolean | null): Record<string, string> | null;
 };

package/field/utils/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.fieldValidityMapping = exports.DEFAULT_VALIDITY_STATE = void 0;
+exports.fieldValidityMapping = exports.DEFAULT_VALIDITY_STATE = exports.DEFAULT_FIELD_STATE_ATTRIBUTES = exports.DEFAULT_FIELD_ROOT_STATE = void 0;
 var _FieldControlDataAttributes = require("../control/FieldControlDataAttributes");
 const DEFAULT_VALIDITY_STATE = exports.DEFAULT_VALIDITY_STATE = {
   badInput: false,
@@ -18,6 +18,17 @@ const DEFAULT_VALIDITY_STATE = exports.DEFAULT_VALIDITY_STATE = {
   valid: null,
   valueMissing: false
 };
+const DEFAULT_FIELD_STATE_ATTRIBUTES = exports.DEFAULT_FIELD_STATE_ATTRIBUTES = {
+  valid: null,
+  touched: false,
+  dirty: false,
+  filled: false,
+  focused: false
+};
+const DEFAULT_FIELD_ROOT_STATE = exports.DEFAULT_FIELD_ROOT_STATE = {
+  disabled: false,
+  ...DEFAULT_FIELD_STATE_ATTRIBUTES
+};
 const fieldValidityMapping = exports.fieldValidityMapping = {
   valid(value) {
     if (value === null) {

package/field/validity/FieldValidity.d.ts

@@ -9,7 +9,13 @@ import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
  */
 export declare const FieldValidity: React.FC<FieldValidity.Props>;
 export interface FieldValidityState extends Omit<FieldValidityData, 'state'> {
+  /**
+   * The validity state.
+   */
   validity: FieldValidityData['state'];
+  /**
+   * The transition status of the component.
+   */
   transitionStatus: TransitionStatus;
 }
 export interface FieldValidityProps {
@@ -24,7 +30,7 @@ export interface FieldValidityProps {
    * </Field.Validity>
    * ```
    */
-  children: (state: FieldValidity.State) => React.ReactNode;
+  children: (state: FieldValidityState) => React.ReactNode;
 }
 export declare namespace FieldValidity {
   type State = FieldValidityState;

package/fieldset/legend/FieldsetLegend.d.ts

@@ -13,7 +13,7 @@ export interface FieldsetLegendState {
    */
   disabled: boolean;
 }
-export interface FieldsetLegendProps extends BaseUIComponentProps<'div', FieldsetLegend.State> {}
+export interface FieldsetLegendProps extends BaseUIComponentProps<'div', FieldsetLegendState> {}
 export declare namespace FieldsetLegend {
   type State = FieldsetLegendState;
   type Props = FieldsetLegendProps;

package/fieldset/root/FieldsetRoot.d.ts

@@ -13,7 +13,7 @@ export interface FieldsetRootState {
    */
   disabled: boolean;
 }
-export interface FieldsetRootProps extends BaseUIComponentProps<'fieldset', FieldsetRoot.State> {}
+export interface FieldsetRootProps extends BaseUIComponentProps<'fieldset', FieldsetRootState> {}
 export declare namespace FieldsetRoot {
   type State = FieldsetRootState;
   type Props = FieldsetRootProps;

package/floating-ui-react/components/FloatingDelayGroup.js

@@ -10,7 +10,7 @@ exports.useDelayGroup = useDelayGroup;
 var React = _interopRequireWildcard(require("react"));
 var _useTimeout = require("@base-ui/utils/useTimeout");
 var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
-var _useHover = require("../hooks/useHover");
+var _useHoverShared = require("../hooks/useHoverShared");
 var _createBaseUIEventDetails = require("../../utils/createBaseUIEventDetails");
 var _reasons = require("../../utils/reasons");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -138,7 +138,7 @@ function useDelayGroup(context, options = {
     currentIdRef.current = floatingId;
     delayRef.current = {
       open: 0,
-      close: (0, _useHover.getDelay)(initialDelayRef.current, 'close')
+      close: (0, _useHoverShared.getDelay)(initialDelayRef.current, 'close')
     };
     if (prevId !== null && prevId !== floatingId) {
       setIsInstantPhase(true);

package/floating-ui-react/components/FloatingFocusManager.d.ts

@@ -11,7 +11,7 @@ export interface FloatingFocusManagerProps {
   /**
    * The interaction type used to open the floating element.
    */
-  openInteractionType?: (InteractionType | null) | undefined;
+  openInteractionType?: InteractionType | null | undefined;
   /**
    * Whether or not the focus manager should be disabled. Useful to delay focus
    * management until after a transition completes or some other conditional
@@ -30,7 +30,7 @@ export interface FloatingFocusManagerProps {
    *   or `false`/`undefined` to do nothing.
    * @default true
    */
-  initialFocus?: (boolean | React.RefObject<HTMLElement | null> | ((openType: InteractionType) => boolean | HTMLElement | null | void)) | undefined;
+  initialFocus?: boolean | React.RefObject<HTMLElement | null> | ((openType: InteractionType) => boolean | HTMLElement | null | void) | undefined;
   /**
    * Determines the element to focus when the floating element is closed.
    *
@@ -42,7 +42,7 @@ export interface FloatingFocusManagerProps {
    *   or `false`/`undefined` to do nothing.
    * @default true
    */
-  returnFocus?: (boolean | React.RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void)) | undefined;
+  returnFocus?: boolean | React.RefObject<HTMLElement | null> | ((closeType: InteractionType) => boolean | HTMLElement | null | void) | undefined;
   /**
    * Determines where focus should be restored if focus inside the floating element is lost
    * (such as due to the removal of the currently focused element from the DOM).
@@ -53,7 +53,7 @@ export interface FloatingFocusManagerProps {
    * - `false`: do not restore focus
    * @default false
    */
-  restoreFocus?: (boolean | 'popup') | undefined;
+  restoreFocus?: boolean | 'popup' | undefined;
   /**
    * Determines if focus is “modal”, meaning focus is fully trapped inside the
    * floating element and outside content cannot be accessed. This includes
@@ -72,20 +72,25 @@ export interface FloatingFocusManagerProps {
   /**
    * Overrides the element to focus when tabbing forward out of the floating element.
    */
-  nextFocusableElement?: (HTMLElement | React.RefObject<HTMLElement | null> | null) | undefined;
+  nextFocusableElement?: HTMLElement | React.RefObject<HTMLElement | null> | null | undefined;
   /**
    * Overrides the element to focus when tabbing backward out of the floating element.
    */
-  previousFocusableElement?: (HTMLElement | React.RefObject<HTMLElement | null> | null) | undefined;
+  previousFocusableElement?: HTMLElement | React.RefObject<HTMLElement | null> | null | undefined;
   /**
    * Ref to the focus guard preceding the floating element content.
-   * Can be useful to focus the popup progammatically.
+   * Can be useful to focus the popup programmatically.
    */
   beforeContentFocusGuardRef?: React.RefObject<HTMLSpanElement | null> | undefined;
   /**
    * External FlatingTree to use when the one provided by context can't be used.
    */
   externalTree?: FloatingTreeStore | undefined;
+  /**
+   * Additional elements that should be treated as part of the floating subtree
+   * even if they are rendered outside the floating element itself.
+   */
+  getInsideElements?: (() => Array<Element | null | undefined>) | undefined;
 }
 /**
  * Provides focus management for the floating element.