@base-ui/react 1.1.0 → 1.3.0

package/dialog/store/DialogStore.d.ts

@@ -18,8 +18,9 @@ type Context = PopupStoreContext<DialogRoot.ChangeEventDetails> & {
   readonly popupRef: React.RefObject<HTMLElement | null>;
   readonly backdropRef: React.RefObject<HTMLDivElement | null>;
   readonly internalBackdropRef: React.RefObject<HTMLDivElement | null>;
-  readonly onNestedDialogOpen?: (ownChildrenCount: number) => void;
-  readonly onNestedDialogClose?: () => void;
+  readonly outsidePressEnabledRef: React.MutableRefObject<boolean>;
+  readonly onNestedDialogOpen?: ((ownChildrenCount: number) => void) | undefined;
+  readonly onNestedDialogClose?: (() => void) | undefined;
 };
 declare const selectors: {
   modal: (state: State<unknown>) => boolean | "trap-focus";
@@ -31,21 +32,261 @@ declare const selectors: {
   titleElementId: (state: State<unknown>) => string | undefined;
   viewportElement: (state: State<unknown>) => HTMLElement | null;
   role: (state: State<unknown>) => "dialog" | "alertdialog";
-  open: (state: PopupStoreState<unknown>) => boolean;
-  mounted: (state: PopupStoreState<unknown>) => boolean;
-  transitionStatus: (state: PopupStoreState<unknown>) => import("../../utils/useTransitionStatus.js").TransitionStatus;
-  floatingRootContext: (state: PopupStoreState<unknown>) => import("../../floating-ui-react/components/FloatingRootStore.js").FloatingRootStore;
-  preventUnmountingOnClose: (state: PopupStoreState<unknown>) => boolean;
-  payload: (state: PopupStoreState<unknown>) => unknown;
-  activeTriggerId: (state: PopupStoreState<unknown>) => string | null;
-  activeTriggerElement: (state: PopupStoreState<unknown>) => Element | null;
-  isTriggerActive: (state: PopupStoreState<unknown>, triggerId: string | undefined) => boolean;
-  isOpenedByTrigger: (state: PopupStoreState<unknown>, triggerId: string | undefined) => boolean;
-  isMountedByTrigger: (state: PopupStoreState<unknown>, triggerId: string | undefined) => boolean;
-  triggerProps: (state: PopupStoreState<unknown>, isActive: boolean) => import("../../index.js").HTMLProps;
-  popupProps: (state: PopupStoreState<unknown>) => import("../../index.js").HTMLProps;
-  popupElement: (state: PopupStoreState<unknown>) => HTMLElement | null;
-  positionerElement: (state: PopupStoreState<unknown>) => HTMLElement | null;
+  open: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => boolean;
+  mounted: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => boolean;
+  transitionStatus: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => import("../../utils/useTransitionStatus.js").TransitionStatus;
+  floatingRootContext: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => import("../../floating-ui-react/components/FloatingRootStore.js").FloatingRootStore;
+  preventUnmountingOnClose: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => boolean;
+  payload: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => unknown;
+  activeTriggerId: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => string | null;
+  activeTriggerElement: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => Element | null;
+  isTriggerActive: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }, triggerId: string | undefined) => boolean;
+  isOpenedByTrigger: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }, triggerId: string | undefined) => boolean;
+  isMountedByTrigger: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }, triggerId: string | undefined) => boolean;
+  triggerProps: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }, isActive: boolean) => import("../../index.js").HTMLProps;
+  popupProps: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => import("../../index.js").HTMLProps;
+  popupElement: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => HTMLElement | null;
+  positionerElement: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    preventUnmountingOnClose: boolean;
+    payload: unknown;
+    activeTriggerId: string | null;
+    activeTriggerElement: Element | null;
+    readonly triggerIdProp: string | null | undefined;
+    popupElement: HTMLElement | null;
+    positionerElement: HTMLElement | null;
+    activeTriggerProps: import("../../index.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => HTMLElement | null;
 };
 export declare class DialogStore<Payload> extends ReactStore<Readonly<State<Payload>>, Context, typeof selectors> {
   constructor(initialState?: Partial<State<Payload>>);

package/dialog/store/DialogStore.js

@@ -26,6 +26,9 @@ class DialogStore extends _store.ReactStore {
       popupRef: /*#__PURE__*/React.createRef(),
       backdropRef: /*#__PURE__*/React.createRef(),
       internalBackdropRef: /*#__PURE__*/React.createRef(),
+      outsidePressEnabledRef: {
+        current: true
+      },
       triggerElements: new _popups.PopupTriggerMap(),
       onOpenChange: undefined,
       onOpenChangeComplete: undefined

package/dialog/title/DialogTitle.d.ts

@@ -7,7 +7,7 @@ import { type BaseUIComponentProps } from "../../utils/types.js";
  * Documentation: [Base UI Dialog](https://base-ui.com/react/components/dialog)
  */
 export declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogTitleProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
-export interface DialogTitleProps extends BaseUIComponentProps<'h2', DialogTitle.State> {}
+export interface DialogTitleProps extends BaseUIComponentProps<'h2', DialogTitleState> {}
 export interface DialogTitleState {}
 export declare namespace DialogTitle {
   type Props = DialogTitleProps;

package/dialog/trigger/DialogTrigger.d.ts

@@ -11,21 +11,21 @@ export declare const DialogTrigger: DialogTrigger;
 export interface DialogTrigger {
   <Payload>(componentProps: DialogTriggerProps<Payload> & React.RefAttributes<HTMLElement>): React.JSX.Element;
 }
-export interface DialogTriggerProps<Payload = unknown> extends NativeButtonProps, BaseUIComponentProps<'button', DialogTrigger.State> {
+export interface DialogTriggerProps<Payload = unknown> extends NativeButtonProps, BaseUIComponentProps<'button', DialogTriggerState> {
   /**
    * A handle to associate the trigger with a dialog.
    * Can be created with the Dialog.createHandle() method.
    */
-  handle?: DialogHandle<Payload>;
+  handle?: DialogHandle<Payload> | undefined;
   /**
    * A payload to pass to the dialog when it is opened.
    */
-  payload?: Payload;
+  payload?: Payload | undefined;
   /**
    * ID of the trigger. In addition to being forwarded to the rendered element,
    * it is also used to specify the active trigger for the dialogs in controlled mode (with the DialogRoot `triggerId` prop).
    */
-  id?: string;
+  id?: string | undefined;
 }
 export interface DialogTriggerState {
   /**

package/dialog/trigger/DialogTrigger.js

@@ -37,7 +37,7 @@ const DialogTrigger = exports.DialogTrigger = /*#__PURE__*/React.forwardRef(func
   const dialogRootContext = (0, _DialogRootContext.useDialogRootContext)(true);
   const store = handle?.store ?? dialogRootContext?.store;
   if (!store) {
-    throw /* FIXME (minify-errors-in-prod): Unminifyable error in production! */new Error(process.env.NODE_ENV !== "production" ? 'Base UI: <Dialog.Trigger> must be used within <Dialog.Root> or provided with a handle.' : (0, _formatErrorMessage2.default)(79));
+    throw new Error(process.env.NODE_ENV !== "production" ? 'Base UI: <Dialog.Trigger> must be used within <Dialog.Root> or provided with a handle.' : (0, _formatErrorMessage2.default)(79));
   }
   const thisTriggerId = (0, _useBaseUiId.useBaseUiId)(idProp);
   const floatingContext = store.useState('floatingRootContext');
@@ -60,10 +60,10 @@ const DialogTrigger = exports.DialogTrigger = /*#__PURE__*/React.forwardRef(func
     enabled: floatingContext != null
   });
   const localInteractionProps = (0, _floatingUiReact.useInteractions)([click]);
-  const state = React.useMemo(() => ({
+  const state = {
     disabled,
     open: isOpenedByThisTrigger
-  }), [disabled, isOpenedByThisTrigger]);
+  };
   const rootTriggerProps = store.useState('triggerProps', isMountedByThisTrigger);
   return (0, _useRenderElement.useRenderElement)('button', componentProps, {
     state,

package/dialog/viewport/DialogViewport.d.ts

@@ -13,6 +13,9 @@ export interface DialogViewportState {
    * Whether the dialog is currently open.
    */
   open: boolean;
+  /**
+   * The transition status of the component.
+   */
   transitionStatus: TransitionStatus;
   /**
    * Whether the dialog is nested within another dialog.

package/dialog/viewport/DialogViewport.js

@@ -51,12 +51,12 @@ const DialogViewport = exports.DialogViewport = /*#__PURE__*/React.forwardRef(fu
   const nestedOpenDialogCount = store.useState('nestedOpenDialogCount');
   const mounted = store.useState('mounted');
   const nestedDialogOpen = nestedOpenDialogCount > 0;
-  const state = React.useMemo(() => ({
+  const state = {
     open,
     nested,
     transitionStatus,
     nestedDialogOpen
-  }), [open, nested, transitionStatus, nestedDialogOpen]);
+  };
   const shouldRender = keepMounted || mounted;
   return (0, _useRenderElement.useRenderElement)('div', componentProps, {
     enabled: shouldRender,
@@ -66,6 +66,9 @@ const DialogViewport = exports.DialogViewport = /*#__PURE__*/React.forwardRef(fu
     props: [{
       role: 'presentation',
       hidden: !mounted,
+      style: {
+        pointerEvents: !open ? 'none' : undefined
+      },
       children
     }, elementProps]
   });

package/direction-provider/DirectionProvider.d.ts

@@ -6,14 +6,16 @@ import { type TextDirection } from "./DirectionContext.js";
  * Documentation: [Base UI Direction Provider](https://base-ui.com/react/utils/direction-provider)
  */
 export declare const DirectionProvider: React.FC<DirectionProvider.Props>;
+export interface DirectionProviderState {}
 export interface DirectionProviderProps {
   children?: React.ReactNode;
   /**
    * The reading direction of the text
    * @default 'ltr'
    */
-  direction?: TextDirection;
+  direction?: TextDirection | undefined;
 }
 export declare namespace DirectionProvider {
+  type State = DirectionProviderState;
   type Props = DirectionProviderProps;
 }

package/drawer/backdrop/DrawerBackdrop.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { type TransitionStatus } from "../../utils/useTransitionStatus.js";
+import { type BaseUIComponentProps } from "../../utils/types.js";
+/**
+ * An overlay displayed beneath the popup.
+ * Renders a `<div>` element.
+ *
+ * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
+ */
+export declare const DrawerBackdrop: React.ForwardRefExoticComponent<Omit<DrawerBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface DrawerBackdropProps extends BaseUIComponentProps<'div', DrawerBackdropState> {
+  /**
+   * Whether the backdrop is forced to render even when nested.
+   * @default false
+   */
+  forceRender?: boolean | undefined;
+}
+export interface DrawerBackdropState {
+  /**
+   * Whether the drawer is currently open.
+   */
+  open: boolean;
+  /**
+   * The transition status of the component.
+   */
+  transitionStatus: TransitionStatus;
+}
+export declare namespace DrawerBackdrop {
+  type Props = DrawerBackdropProps;
+  type State = DrawerBackdropState;
+}

package/drawer/backdrop/DrawerBackdrop.js

@@ -0,0 +1,63 @@
+"use strict";
+'use client';
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DrawerBackdrop = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _DialogRootContext = require("../../dialog/root/DialogRootContext");
+var _useRenderElement = require("../../utils/useRenderElement");
+var _popupStateMapping = require("../../utils/popupStateMapping");
+var _stateAttributesMapping = require("../../utils/stateAttributesMapping");
+var _DrawerPopupCssVars = require("../popup/DrawerPopupCssVars");
+var _DrawerBackdropCssVars = require("./DrawerBackdropCssVars");
+const stateAttributesMapping = {
+  ..._popupStateMapping.popupStateMapping,
+  ..._stateAttributesMapping.transitionStatusMapping
+};
+
+/**
+ * An overlay displayed beneath the popup.
+ * Renders a `<div>` element.
+ *
+ * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
+ */
+const DrawerBackdrop = exports.DrawerBackdrop = /*#__PURE__*/React.forwardRef(function DrawerBackdrop(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    forceRender = false,
+    ...elementProps
+  } = componentProps;
+  const {
+    store
+  } = (0, _DialogRootContext.useDialogRootContext)();
+  const open = store.useState('open');
+  const nested = store.useState('nested');
+  const mounted = store.useState('mounted');
+  const transitionStatus = store.useState('transitionStatus');
+  const state = {
+    open,
+    transitionStatus
+  };
+  return (0, _useRenderElement.useRenderElement)('div', componentProps, {
+    state,
+    ref: [store.context.backdropRef, forwardedRef],
+    stateAttributesMapping,
+    props: [{
+      role: 'presentation',
+      hidden: !mounted,
+      style: {
+        pointerEvents: !open ? 'none' : undefined,
+        userSelect: 'none',
+        WebkitUserSelect: 'none',
+        [_DrawerBackdropCssVars.DrawerBackdropCssVars.swipeProgress]: '0',
+        [_DrawerPopupCssVars.DrawerPopupCssVars.swipeStrength]: '1'
+      }
+    }, elementProps],
+    enabled: forceRender || !nested
+  });
+});
+if (process.env.NODE_ENV !== "production") DrawerBackdrop.displayName = "DrawerBackdrop";

package/drawer/backdrop/DrawerBackdropCssVars.d.ts

@@ -0,0 +1,7 @@
+export declare enum DrawerBackdropCssVars {
+  /**
+   * The swipe progress of the drawer gesture.
+   * @type {number}
+   */
+  swipeProgress = "--drawer-swipe-progress",
+}

package/drawer/backdrop/DrawerBackdropCssVars.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DrawerBackdropCssVars = void 0;
+let DrawerBackdropCssVars = exports.DrawerBackdropCssVars = /*#__PURE__*/function (DrawerBackdropCssVars) {
+  /**
+   * The swipe progress of the drawer gesture.
+   * @type {number}
+   */
+  DrawerBackdropCssVars["swipeProgress"] = "--drawer-swipe-progress";
+  return DrawerBackdropCssVars;
+}({});

package/drawer/backdrop/DrawerBackdropDataAttributes.d.ts

@@ -0,0 +1,18 @@
+export declare enum DrawerBackdropDataAttributes {
+  /**
+   * Present when the drawer is open.
+   */
+  open = "data-open",
+  /**
+   * Present when the drawer is closed.
+   */
+  closed = "data-closed",
+  /**
+   * Present when the drawer is animating in.
+   */
+  startingStyle = "data-starting-style",
+  /**
+   * Present when the drawer is animating out.
+   */
+  endingStyle = "data-ending-style",
+}

package/drawer/backdrop/DrawerBackdropDataAttributes.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DrawerBackdropDataAttributes = void 0;
+var _popupStateMapping = require("../../utils/popupStateMapping");
+let DrawerBackdropDataAttributes = exports.DrawerBackdropDataAttributes = function (DrawerBackdropDataAttributes) {
+  /**
+   * Present when the drawer is open.
+   */
+  DrawerBackdropDataAttributes[DrawerBackdropDataAttributes["open"] = _popupStateMapping.CommonPopupDataAttributes.open] = "open";
+  /**
+   * Present when the drawer is closed.
+   */
+  DrawerBackdropDataAttributes[DrawerBackdropDataAttributes["closed"] = _popupStateMapping.CommonPopupDataAttributes.closed] = "closed";
+  /**
+   * Present when the drawer is animating in.
+   */
+  DrawerBackdropDataAttributes[DrawerBackdropDataAttributes["startingStyle"] = _popupStateMapping.CommonPopupDataAttributes.startingStyle] = "startingStyle";
+  /**
+   * Present when the drawer is animating out.
+   */
+  DrawerBackdropDataAttributes[DrawerBackdropDataAttributes["endingStyle"] = _popupStateMapping.CommonPopupDataAttributes.endingStyle] = "endingStyle";
+  return DrawerBackdropDataAttributes;
+}({});

package/drawer/close/DrawerClose.d.ts

@@ -0,0 +1,23 @@
+import type * as React from 'react';
+import type { BaseUIComponentProps, NativeButtonProps } from "../../utils/types.js";
+/**
+ * A button that closes the drawer.
+ * Renders a `<button>` element.
+ *
+ * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
+ */
+export declare const DrawerClose: DrawerClose;
+export interface DrawerCloseProps extends NativeButtonProps, BaseUIComponentProps<'button', DrawerCloseState> {}
+export interface DrawerCloseState {
+  /**
+   * Whether the button is currently disabled.
+   */
+  disabled: boolean;
+}
+export interface DrawerClose {
+  (componentProps: DrawerCloseProps): React.JSX.Element;
+}
+export declare namespace DrawerClose {
+  type Props = DrawerCloseProps;
+  type State = DrawerCloseState;
+}

package/drawer/close/DrawerClose.js

@@ -0,0 +1,15 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DrawerClose = void 0;
+var _DialogClose = require("../../dialog/close/DialogClose");
+/**
+ * A button that closes the drawer.
+ * Renders a `<button>` element.
+ *
+ * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
+ */
+const DrawerClose = exports.DrawerClose = _DialogClose.DialogClose;

package/drawer/content/DrawerContent.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { BaseUIComponentProps } from "../../utils/types.js";
+/**
+ * A container for the drawer contents.
+ * Renders a `<div>` element.
+ *
+ * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
+ */
+export declare const DrawerContent: React.ForwardRefExoticComponent<Omit<DrawerContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export interface DrawerContentProps extends BaseUIComponentProps<'div', DrawerContentState> {}
+export interface DrawerContentState {}
+export declare namespace DrawerContent {
+  type Props = DrawerContentProps;
+  type State = DrawerContentState;
+}