@cdx-ui/primitives 0.0.1-beta.112 → 0.0.1-beta.113

package/lib/commonjs/dialog/DialogContent.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DialogContent = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _focus = require("@react-native-aria/focus");
+var _slot = require("../slot");
+var _overlay = require("../overlay");
+var _dataAttributes = require("../utils/dataAttributes");
+var _context = require("./context");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Dialog content panel primitive. Provides:
+ * - ARIA role, aria-modal, aria-labelledby/describedby
+ * - FocusScope (focus trap + restore + auto-focus)
+ * - Escape key dismissal (web)
+ * - Android hardware back button dismissal (native)
+ * - data-state attribute for CSS transition targeting
+ *
+ * Unstyled — the styled layer applies centering, background, border-radius, etc.
+ */
+const DialogContent = exports.DialogContent = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild = false,
+  forceMount = false,
+  children,
+  ...props
+}, ref) => {
+  const {
+    open,
+    onOpenChange,
+    closeOnEscKey,
+    nativeID,
+    role
+  } = (0, _context.useDialog)();
+  const handleClose = (0, _react.useCallback)(() => {
+    onOpenChange(false);
+  }, [onOpenChange]);
+  (0, _overlay.useEscapeKey)(open && closeOnEscKey, handleClose);
+  (0, _react.useEffect)(() => {
+    if (!open) return;
+    const backHandler = _reactNative.BackHandler.addEventListener('hardwareBackPress', () => {
+      onOpenChange(false);
+      return true;
+    });
+    return () => {
+      backHandler.remove();
+    };
+  }, [open, onOpenChange]);
+  if (!forceMount && !open) {
+    return null;
+  }
+  const Comp = asChild ? _slot.Slot : _reactNative.View;
+  const ariaProps = {
+    role,
+    'aria-modal': true,
+    'aria-labelledby': `${nativeID}-title`,
+    'aria-describedby': `${nativeID}-description`
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_focus.FocusScope, {
+    contain: open,
+    restoreFocus: true,
+    autoFocus: open,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+      ref: ref,
+      nativeID: nativeID,
+      ...ariaProps,
+      ...props,
+      ...(0, _dataAttributes.mergeDataAttributes)(props, forceMount ? undefined : (0, _dataAttributes.dataAttributes)({
+        state: open ? 'open' : 'closed'
+      })),
+      children: children
+    })
+  });
+});
+DialogContent.displayName = 'DialogContent';
+//# sourceMappingURL=DialogContent.js.map

package/lib/commonjs/dialog/DialogContent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_focus","_slot","_overlay","_dataAttributes","_context","_jsxRuntime","DialogContent","exports","forwardRef","asChild","forceMount","children","props","ref","open","onOpenChange","closeOnEscKey","nativeID","role","useDialog","handleClose","useCallback","useEscapeKey","useEffect","backHandler","BackHandler","addEventListener","remove","Comp","Slot","View","ariaProps","jsx","FocusScope","contain","restoreFocus","autoFocus","mergeDataAttributes","undefined","dataAttributes","state","displayName"],"sourceRoot":"../../../src","sources":["dialog/DialogContent.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,eAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AAAsC,IAAAO,WAAA,GAAAP,OAAA;AAKtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMQ,aAAa,GAAAC,OAAA,CAAAD,aAAA,gBAAG,IAAAE,iBAAU,EACrC,CAAC;EAAEC,OAAO,GAAG,KAAK;EAAEC,UAAU,GAAG,KAAK;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACpE,MAAM;IAAEC,IAAI;IAAEC,YAAY;IAAEC,aAAa;IAAEC,QAAQ;IAAEC;EAAK,CAAC,GAAG,IAAAC,kBAAS,EAAC,CAAC;EAEzE,MAAMC,WAAW,GAAG,IAAAC,kBAAW,EAAC,MAAM;IACpCN,YAAY,CAAC,KAAK,CAAC;EACrB,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,IAAAO,qBAAY,EAACR,IAAI,IAAIE,aAAa,EAAEI,WAAW,CAAC;EAEhD,IAAAG,gBAAS,EAAC,MAAM;IACd,IAAI,CAACT,IAAI,EAAE;IAEX,MAAMU,WAAW,GAAGC,wBAAW,CAACC,gBAAgB,CAAC,mBAAmB,EAAE,MAAM;MAC1EX,YAAY,CAAC,KAAK,CAAC;MACnB,OAAO,IAAI;IACb,CAAC,CAAC;IAEF,OAAO,MAAM;MACXS,WAAW,CAACG,MAAM,CAAC,CAAC;IACtB,CAAC;EACH,CAAC,EAAE,CAACb,IAAI,EAAEC,YAAY,CAAC,CAAC;EAExB,IAAI,CAACL,UAAU,IAAI,CAACI,IAAI,EAAE;IACxB,OAAO,IAAI;EACb;EAEA,MAAMc,IAAI,GAAGnB,OAAO,GAAGoB,UAAI,GAAGC,iBAAI;EAElC,MAAMC,SAAS,GAAG;IAChBb,IAAI;IACJ,YAAY,EAAE,IAAI;IAClB,iBAAiB,EAAE,GAAGD,QAAQ,QAAQ;IACtC,kBAAkB,EAAE,GAAGA,QAAQ;EACjC,CAAC;EAED,oBACE,IAAAZ,WAAA,CAAA2B,GAAA,EAAChC,MAAA,CAAAiC,UAAU;IAACC,OAAO,EAAEpB,IAAK;IAACqB,YAAY;IAACC,SAAS,EAAEtB,IAAK;IAAAH,QAAA,eACtD,IAAAN,WAAA,CAAA2B,GAAA,EAACJ,IAAI;MACHf,GAAG,EAAEA,GAAI;MACTI,QAAQ,EAAEA,QAAS;MAAA,GACfc,SAAS;MAAA,GACRnB,KAAK;MAAA,GACN,IAAAyB,mCAAmB,EACrBzB,KAAK,EACLF,UAAU,GAAG4B,SAAS,GAAG,IAAAC,8BAAc,EAAC;QAAEC,KAAK,EAAE1B,IAAI,GAAG,MAAM,GAAG;MAAS,CAAC,CAC7E,CAAC;MAAAH,QAAA,EAEAA;IAAQ,CACL;EAAC,CACG,CAAC;AAEjB,CACF,CAAC;AAEDL,aAAa,CAACmC,WAAW,GAAG,eAAe","ignoreList":[]}

package/lib/commonjs/dialog/DialogOverlay.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DialogOverlay = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _slot = require("../slot");
+var _dataAttributes = require("../utils/dataAttributes");
+var _context = require("./context");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Backdrop overlay that dismisses the dialog on press (when closeOnBackdropPress
+ * is enabled). Supports `forceMount` for exit animation coordination.
+ *
+ * Unstyled — the styled layer applies opacity/color via className.
+ */
+const DialogOverlay = exports.DialogOverlay = /*#__PURE__*/(0, _react.forwardRef)(({
+  asChild = false,
+  forceMount = false,
+  onPress,
+  ...props
+}, ref) => {
+  const {
+    open,
+    onOpenChange,
+    closeOnBackdropPress
+  } = (0, _context.useDialog)();
+  const handlePress = (0, _react.useCallback)(e => {
+    if (closeOnBackdropPress) {
+      onOpenChange(false);
+    }
+    if (typeof onPress === 'function') {
+      onPress(e);
+    }
+  }, [closeOnBackdropPress, onOpenChange, onPress]);
+  if (!forceMount && !open) {
+    return null;
+  }
+  const Comp = asChild ? _slot.Slot : _reactNative.Pressable;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+    ref: ref,
+    accessible: false,
+    importantForAccessibility: "no-hide-descendants",
+    onPress: handlePress,
+    ...props,
+    ...(0, _dataAttributes.mergeDataAttributes)(props, (0, _dataAttributes.dataAttributes)({
+      slot: 'dialog-overlay'
+    }))
+  });
+});
+DialogOverlay.displayName = 'DialogOverlay';
+//# sourceMappingURL=DialogOverlay.js.map

package/lib/commonjs/dialog/DialogOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_slot","_dataAttributes","_context","_jsxRuntime","DialogOverlay","exports","forwardRef","asChild","forceMount","onPress","props","ref","open","onOpenChange","closeOnBackdropPress","useDialog","handlePress","useCallback","e","Comp","Slot","Pressable","jsx","accessible","importantForAccessibility","mergeDataAttributes","dataAttributes","slot","displayName"],"sourceRoot":"../../../src","sources":["dialog/DialogOverlay.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,eAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AAAsC,IAAAK,WAAA,GAAAL,OAAA;AAKtC;AACA;AACA;AACA;AACA;AACA;AACO,MAAMM,aAAa,GAAAC,OAAA,CAAAD,aAAA,gBAAG,IAAAE,iBAAU,EACrC,CAAC;EAAEC,OAAO,GAAG,KAAK;EAAEC,UAAU,GAAG,KAAK;EAAEC,OAAO;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACnE,MAAM;IAAEC,IAAI;IAAEC,YAAY;IAAEC;EAAqB,CAAC,GAAG,IAAAC,kBAAS,EAAC,CAAC;EAEhE,MAAMC,WAAW,GAAG,IAAAC,kBAAW,EAC5BC,CAAM,IAAK;IACV,IAAIJ,oBAAoB,EAAE;MACxBD,YAAY,CAAC,KAAK,CAAC;IACrB;IACA,IAAI,OAAOJ,OAAO,KAAK,UAAU,EAAE;MACjCA,OAAO,CAACS,CAAC,CAAC;IACZ;EACF,CAAC,EACD,CAACJ,oBAAoB,EAAED,YAAY,EAAEJ,OAAO,CAC9C,CAAC;EAED,IAAI,CAACD,UAAU,IAAI,CAACI,IAAI,EAAE;IACxB,OAAO,IAAI;EACb;EAEA,MAAMO,IAAI,GAAGZ,OAAO,GAAGa,UAAI,GAAGC,sBAAS;EAEvC,oBACE,IAAAlB,WAAA,CAAAmB,GAAA,EAACH,IAAI;IACHR,GAAG,EAAEA,GAAI;IACTY,UAAU,EAAE,KAAM;IAClBC,yBAAyB,EAAC,qBAAqB;IAC/Cf,OAAO,EAAEO,WAAY;IAAA,GAChBN,KAAK;IAAA,GACN,IAAAe,mCAAmB,EAACf,KAAK,EAAE,IAAAgB,8BAAc,EAAC;MAAEC,IAAI,EAAE;IAAiB,CAAC,CAAC;EAAC,CAC3E,CAAC;AAEN,CACF,CAAC;AAEDvB,aAAa,CAACwB,WAAW,GAAG,eAAe","ignoreList":[]}

package/lib/commonjs/dialog/DialogPortal.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DialogPortal = DialogPortal;
+var _portal = require("../portal");
+var _context = require("./context");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Mounts dialog children into the shared PortalHost. Re-provides DialogContext
+ * inside the portal boundary (React context does not cross the portal store).
+ *
+ * When `forceMount` is false (default), the portal is unmounted when the
+ * dialog is closed. Set `forceMount={true}` to keep the portal mounted so
+ * exit animations can play before the styled layer removes it from the tree.
+ */
+function DialogPortal({
+  forceMount = false,
+  hostName,
+  children
+}) {
+  const ctx = (0, _context.useDialog)();
+  if (!forceMount && !ctx.open) {
+    return null;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_portal.Portal, {
+    name: `${ctx.nativeID}-portal`,
+    hostName: hostName,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.DialogProvider, {
+      value: ctx,
+      children: children
+    })
+  });
+}
+DialogPortal.displayName = 'DialogPortal';
+//# sourceMappingURL=DialogPortal.js.map

package/lib/commonjs/dialog/DialogPortal.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_portal","require","_context","_jsxRuntime","DialogPortal","forceMount","hostName","children","ctx","useDialog","open","jsx","Portal","name","nativeID","DialogProvider","value","displayName"],"sourceRoot":"../../../src","sources":["dialog/DialogPortal.tsx"],"mappings":";;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAAsD,IAAAE,WAAA,GAAAF,OAAA;AAKtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASG,YAAYA,CAAC;EAAEC,UAAU,GAAG,KAAK;EAAEC,QAAQ;EAAEC;AAA4B,CAAC,EAAE;EAC1F,MAAMC,GAAG,GAAG,IAAAC,kBAAS,EAAC,CAAC;EAEvB,IAAI,CAACJ,UAAU,IAAI,CAACG,GAAG,CAACE,IAAI,EAAE;IAC5B,OAAO,IAAI;EACb;EAEA,oBACE,IAAAP,WAAA,CAAAQ,GAAA,EAACX,OAAA,CAAAY,MAAM;IAACC,IAAI,EAAE,GAAGL,GAAG,CAACM,QAAQ,SAAU;IAACR,QAAQ,EAAEA,QAAS;IAAAC,QAAA,eACzD,IAAAJ,WAAA,CAAAQ,GAAA,EAACT,QAAA,CAAAa,cAAc;MAACC,KAAK,EAAER,GAAI;MAAAD,QAAA,EAAEA;IAAQ,CAAiB;EAAC,CACjD,CAAC;AAEb;AAEAH,YAAY,CAACa,WAAW,GAAG,cAAc","ignoreList":[]}

package/lib/commonjs/dialog/index.js

@@ -9,12 +9,30 @@ Object.defineProperty(exports, "DialogClose", {
     return _DialogClose.DialogClose;
   }
 });
+Object.defineProperty(exports, "DialogContent", {
+  enumerable: true,
+  get: function () {
+    return _DialogContent.DialogContent;
+  }
+});
+Object.defineProperty(exports, "DialogOverlay", {
+  enumerable: true,
+  get: function () {
+    return _DialogOverlay.DialogOverlay;
+  }
+});
 Object.defineProperty(exports, "DialogPopup", {
   enumerable: true,
   get: function () {
     return _DialogPopup.DialogPopup;
   }
 });
+Object.defineProperty(exports, "DialogPortal", {
+  enumerable: true,
+  get: function () {
+    return _DialogPortal.DialogPortal;
+  }
+});
 Object.defineProperty(exports, "DialogProvider", {
   enumerable: true,
   get: function () {
@@ -42,6 +60,9 @@ Object.defineProperty(exports, "useDialog", {
 var _context = require("./context");
 var _DialogRoot = require("./DialogRoot");
 var _DialogTrigger = require("./DialogTrigger");
+var _DialogPortal = require("./DialogPortal");
+var _DialogOverlay = require("./DialogOverlay");
+var _DialogContent = require("./DialogContent");
 var _DialogPopup = require("./DialogPopup");
 var _DialogClose = require("./DialogClose");
 //# sourceMappingURL=index.js.map

package/lib/commonjs/dialog/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_context","require","_DialogRoot","_DialogTrigger","_DialogPopup","_DialogClose"],"sourceRoot":"../../../src","sources":["dialog/index.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,YAAA,GAAAH,OAAA;AACA,IAAAI,YAAA,GAAAJ,OAAA","ignoreList":[]}
+{"version":3,"names":["_context","require","_DialogRoot","_DialogTrigger","_DialogPortal","_DialogOverlay","_DialogContent","_DialogPopup","_DialogClose"],"sourceRoot":"../../../src","sources":["dialog/index.tsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;AACA,IAAAI,cAAA,GAAAJ,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AACA,IAAAM,YAAA,GAAAN,OAAA;AACA,IAAAO,YAAA,GAAAP,OAAA","ignoreList":[]}

package/lib/module/dialog/DialogContent.js

@@ -0,0 +1,75 @@
+"use strict";
+
+import { forwardRef, useCallback, useEffect } from 'react';
+import { BackHandler, View } from 'react-native';
+import { FocusScope } from '@react-native-aria/focus';
+import { Slot } from '../slot';
+import { useEscapeKey } from '../overlay';
+import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
+import { useDialog } from './context';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Dialog content panel primitive. Provides:
+ * - ARIA role, aria-modal, aria-labelledby/describedby
+ * - FocusScope (focus trap + restore + auto-focus)
+ * - Escape key dismissal (web)
+ * - Android hardware back button dismissal (native)
+ * - data-state attribute for CSS transition targeting
+ *
+ * Unstyled — the styled layer applies centering, background, border-radius, etc.
+ */
+export const DialogContent = /*#__PURE__*/forwardRef(({
+  asChild = false,
+  forceMount = false,
+  children,
+  ...props
+}, ref) => {
+  const {
+    open,
+    onOpenChange,
+    closeOnEscKey,
+    nativeID,
+    role
+  } = useDialog();
+  const handleClose = useCallback(() => {
+    onOpenChange(false);
+  }, [onOpenChange]);
+  useEscapeKey(open && closeOnEscKey, handleClose);
+  useEffect(() => {
+    if (!open) return;
+    const backHandler = BackHandler.addEventListener('hardwareBackPress', () => {
+      onOpenChange(false);
+      return true;
+    });
+    return () => {
+      backHandler.remove();
+    };
+  }, [open, onOpenChange]);
+  if (!forceMount && !open) {
+    return null;
+  }
+  const Comp = asChild ? Slot : View;
+  const ariaProps = {
+    role,
+    'aria-modal': true,
+    'aria-labelledby': `${nativeID}-title`,
+    'aria-describedby': `${nativeID}-description`
+  };
+  return /*#__PURE__*/_jsx(FocusScope, {
+    contain: open,
+    restoreFocus: true,
+    autoFocus: open,
+    children: /*#__PURE__*/_jsx(Comp, {
+      ref: ref,
+      nativeID: nativeID,
+      ...ariaProps,
+      ...props,
+      ...mergeDataAttributes(props, forceMount ? undefined : dataAttributes({
+        state: open ? 'open' : 'closed'
+      })),
+      children: children
+    })
+  });
+});
+DialogContent.displayName = 'DialogContent';
+//# sourceMappingURL=DialogContent.js.map

package/lib/module/dialog/DialogContent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["forwardRef","useCallback","useEffect","BackHandler","View","FocusScope","Slot","useEscapeKey","dataAttributes","mergeDataAttributes","useDialog","jsx","_jsx","DialogContent","asChild","forceMount","children","props","ref","open","onOpenChange","closeOnEscKey","nativeID","role","handleClose","backHandler","addEventListener","remove","Comp","ariaProps","contain","restoreFocus","autoFocus","undefined","state","displayName"],"sourceRoot":"../../../src","sources":["dialog/DialogContent.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,WAAW,EAAEC,SAAS,QAA2B,OAAO;AAC7E,SAASC,WAAW,EAAEC,IAAI,QAAwB,cAAc;AAChE,SAASC,UAAU,QAAQ,0BAA0B;AACrD,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,YAAY,QAAQ,YAAY;AACzC,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,yBAAyB;AAC7E,SAASC,SAAS,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAKtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,gBAAGb,UAAU,CACrC,CAAC;EAAEc,OAAO,GAAG,KAAK;EAAEC,UAAU,GAAG,KAAK;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACpE,MAAM;IAAEC,IAAI;IAAEC,YAAY;IAAEC,aAAa;IAAEC,QAAQ;IAAEC;EAAK,CAAC,GAAGb,SAAS,CAAC,CAAC;EAEzE,MAAMc,WAAW,GAAGvB,WAAW,CAAC,MAAM;IACpCmB,YAAY,CAAC,KAAK,CAAC;EACrB,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElBb,YAAY,CAACY,IAAI,IAAIE,aAAa,EAAEG,WAAW,CAAC;EAEhDtB,SAAS,CAAC,MAAM;IACd,IAAI,CAACiB,IAAI,EAAE;IAEX,MAAMM,WAAW,GAAGtB,WAAW,CAACuB,gBAAgB,CAAC,mBAAmB,EAAE,MAAM;MAC1EN,YAAY,CAAC,KAAK,CAAC;MACnB,OAAO,IAAI;IACb,CAAC,CAAC;IAEF,OAAO,MAAM;MACXK,WAAW,CAACE,MAAM,CAAC,CAAC;IACtB,CAAC;EACH,CAAC,EAAE,CAACR,IAAI,EAAEC,YAAY,CAAC,CAAC;EAExB,IAAI,CAACL,UAAU,IAAI,CAACI,IAAI,EAAE;IACxB,OAAO,IAAI;EACb;EAEA,MAAMS,IAAI,GAAGd,OAAO,GAAGR,IAAI,GAAGF,IAAI;EAElC,MAAMyB,SAAS,GAAG;IAChBN,IAAI;IACJ,YAAY,EAAE,IAAI;IAClB,iBAAiB,EAAE,GAAGD,QAAQ,QAAQ;IACtC,kBAAkB,EAAE,GAAGA,QAAQ;EACjC,CAAC;EAED,oBACEV,IAAA,CAACP,UAAU;IAACyB,OAAO,EAAEX,IAAK;IAACY,YAAY;IAACC,SAAS,EAAEb,IAAK;IAAAH,QAAA,eACtDJ,IAAA,CAACgB,IAAI;MACHV,GAAG,EAAEA,GAAI;MACTI,QAAQ,EAAEA,QAAS;MAAA,GACfO,SAAS;MAAA,GACRZ,KAAK;MAAA,GACNR,mBAAmB,CACrBQ,KAAK,EACLF,UAAU,GAAGkB,SAAS,GAAGzB,cAAc,CAAC;QAAE0B,KAAK,EAAEf,IAAI,GAAG,MAAM,GAAG;MAAS,CAAC,CAC7E,CAAC;MAAAH,QAAA,EAEAA;IAAQ,CACL;EAAC,CACG,CAAC;AAEjB,CACF,CAAC;AAEDH,aAAa,CAACsB,WAAW,GAAG,eAAe","ignoreList":[]}

package/lib/module/dialog/DialogOverlay.js

@@ -0,0 +1,50 @@
+"use strict";
+
+import { forwardRef, useCallback } from 'react';
+import { Pressable } from 'react-native';
+import { Slot } from '../slot';
+import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
+import { useDialog } from './context';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Backdrop overlay that dismisses the dialog on press (when closeOnBackdropPress
+ * is enabled). Supports `forceMount` for exit animation coordination.
+ *
+ * Unstyled — the styled layer applies opacity/color via className.
+ */
+export const DialogOverlay = /*#__PURE__*/forwardRef(({
+  asChild = false,
+  forceMount = false,
+  onPress,
+  ...props
+}, ref) => {
+  const {
+    open,
+    onOpenChange,
+    closeOnBackdropPress
+  } = useDialog();
+  const handlePress = useCallback(e => {
+    if (closeOnBackdropPress) {
+      onOpenChange(false);
+    }
+    if (typeof onPress === 'function') {
+      onPress(e);
+    }
+  }, [closeOnBackdropPress, onOpenChange, onPress]);
+  if (!forceMount && !open) {
+    return null;
+  }
+  const Comp = asChild ? Slot : Pressable;
+  return /*#__PURE__*/_jsx(Comp, {
+    ref: ref,
+    accessible: false,
+    importantForAccessibility: "no-hide-descendants",
+    onPress: handlePress,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'dialog-overlay'
+    }))
+  });
+});
+DialogOverlay.displayName = 'DialogOverlay';
+//# sourceMappingURL=DialogOverlay.js.map

package/lib/module/dialog/DialogOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["forwardRef","useCallback","Pressable","Slot","dataAttributes","mergeDataAttributes","useDialog","jsx","_jsx","DialogOverlay","asChild","forceMount","onPress","props","ref","open","onOpenChange","closeOnBackdropPress","handlePress","e","Comp","accessible","importantForAccessibility","slot","displayName"],"sourceRoot":"../../../src","sources":["dialog/DialogOverlay.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,WAAW,QAA2B,OAAO;AAClE,SAASC,SAAS,QAA6B,cAAc;AAC7D,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,yBAAyB;AAC7E,SAASC,SAAS,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAKtC;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,gBAAGT,UAAU,CACrC,CAAC;EAAEU,OAAO,GAAG,KAAK;EAAEC,UAAU,GAAG,KAAK;EAAEC,OAAO;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACnE,MAAM;IAAEC,IAAI;IAAEC,YAAY;IAAEC;EAAqB,CAAC,GAAGX,SAAS,CAAC,CAAC;EAEhE,MAAMY,WAAW,GAAGjB,WAAW,CAC5BkB,CAAM,IAAK;IACV,IAAIF,oBAAoB,EAAE;MACxBD,YAAY,CAAC,KAAK,CAAC;IACrB;IACA,IAAI,OAAOJ,OAAO,KAAK,UAAU,EAAE;MACjCA,OAAO,CAACO,CAAC,CAAC;IACZ;EACF,CAAC,EACD,CAACF,oBAAoB,EAAED,YAAY,EAAEJ,OAAO,CAC9C,CAAC;EAED,IAAI,CAACD,UAAU,IAAI,CAACI,IAAI,EAAE;IACxB,OAAO,IAAI;EACb;EAEA,MAAMK,IAAI,GAAGV,OAAO,GAAGP,IAAI,GAAGD,SAAS;EAEvC,oBACEM,IAAA,CAACY,IAAI;IACHN,GAAG,EAAEA,GAAI;IACTO,UAAU,EAAE,KAAM;IAClBC,yBAAyB,EAAC,qBAAqB;IAC/CV,OAAO,EAAEM,WAAY;IAAA,GAChBL,KAAK;IAAA,GACNR,mBAAmB,CAACQ,KAAK,EAAET,cAAc,CAAC;MAAEmB,IAAI,EAAE;IAAiB,CAAC,CAAC;EAAC,CAC3E,CAAC;AAEN,CACF,CAAC;AAEDd,aAAa,CAACe,WAAW,GAAG,eAAe","ignoreList":[]}

package/lib/module/dialog/DialogPortal.js

@@ -0,0 +1,33 @@
+"use strict";
+
+import { Portal } from '../portal';
+import { DialogProvider, useDialog } from './context';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Mounts dialog children into the shared PortalHost. Re-provides DialogContext
+ * inside the portal boundary (React context does not cross the portal store).
+ *
+ * When `forceMount` is false (default), the portal is unmounted when the
+ * dialog is closed. Set `forceMount={true}` to keep the portal mounted so
+ * exit animations can play before the styled layer removes it from the tree.
+ */
+export function DialogPortal({
+  forceMount = false,
+  hostName,
+  children
+}) {
+  const ctx = useDialog();
+  if (!forceMount && !ctx.open) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(Portal, {
+    name: `${ctx.nativeID}-portal`,
+    hostName: hostName,
+    children: /*#__PURE__*/_jsx(DialogProvider, {
+      value: ctx,
+      children: children
+    })
+  });
+}
+DialogPortal.displayName = 'DialogPortal';
+//# sourceMappingURL=DialogPortal.js.map

package/lib/module/dialog/DialogPortal.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Portal","DialogProvider","useDialog","jsx","_jsx","DialogPortal","forceMount","hostName","children","ctx","open","name","nativeID","value","displayName"],"sourceRoot":"../../../src","sources":["dialog/DialogPortal.tsx"],"mappings":";;AAAA,SAASA,MAAM,QAAQ,WAAW;AAClC,SAASC,cAAc,EAAEC,SAAS,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAKtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,YAAYA,CAAC;EAAEC,UAAU,GAAG,KAAK;EAAEC,QAAQ;EAAEC;AAA4B,CAAC,EAAE;EAC1F,MAAMC,GAAG,GAAGP,SAAS,CAAC,CAAC;EAEvB,IAAI,CAACI,UAAU,IAAI,CAACG,GAAG,CAACC,IAAI,EAAE;IAC5B,OAAO,IAAI;EACb;EAEA,oBACEN,IAAA,CAACJ,MAAM;IAACW,IAAI,EAAE,GAAGF,GAAG,CAACG,QAAQ,SAAU;IAACL,QAAQ,EAAEA,QAAS;IAAAC,QAAA,eACzDJ,IAAA,CAACH,cAAc;MAACY,KAAK,EAAEJ,GAAI;MAAAD,QAAA,EAAEA;IAAQ,CAAiB;EAAC,CACjD,CAAC;AAEb;AAEAH,YAAY,CAACS,WAAW,GAAG,cAAc","ignoreList":[]}

package/lib/module/dialog/index.js

@@ -3,6 +3,9 @@
 export { DialogProvider, useDialog } from './context';
 export { DialogRoot } from './DialogRoot';
 export { DialogTrigger } from './DialogTrigger';
+export { DialogPortal } from './DialogPortal';
+export { DialogOverlay } from './DialogOverlay';
+export { DialogContent } from './DialogContent';
 export { DialogPopup } from './DialogPopup';
 export { DialogClose } from './DialogClose';
 //# sourceMappingURL=index.js.map

package/lib/module/dialog/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["DialogProvider","useDialog","DialogRoot","DialogTrigger","DialogPopup","DialogClose"],"sourceRoot":"../../../src","sources":["dialog/index.tsx"],"mappings":";;AAAA,SAASA,cAAc,EAAEC,SAAS,QAAQ,WAAW;AACrD,SAASC,UAAU,QAA8B,cAAc;AAC/D,SAASC,aAAa,QAAiC,iBAAiB;AACxE,SAASC,WAAW,QAA+B,eAAe;AAClE,SAASC,WAAW,QAA+B,eAAe","ignoreList":[]}
+{"version":3,"names":["DialogProvider","useDialog","DialogRoot","DialogTrigger","DialogPortal","DialogOverlay","DialogContent","DialogPopup","DialogClose"],"sourceRoot":"../../../src","sources":["dialog/index.tsx"],"mappings":";;AAAA,SAASA,cAAc,EAAEC,SAAS,QAAQ,WAAW;AACrD,SAASC,UAAU,QAA8B,cAAc;AAC/D,SAASC,aAAa,QAAiC,iBAAiB;AACxE,SAASC,YAAY,QAAgC,gBAAgB;AACrE,SAASC,aAAa,QAAiC,iBAAiB;AACxE,SAASC,aAAa,QAAiC,iBAAiB;AACxE,SAASC,WAAW,QAA+B,eAAe;AAClE,SAASC,WAAW,QAA+B,eAAe","ignoreList":[]}

package/lib/typescript/dialog/DialogContent.d.ts

@@ -0,0 +1,16 @@
+import { View } from 'react-native';
+import type { IDialogContentProps } from './types';
+export interface DialogContentProps extends IDialogContentProps {
+}
+/**
+ * Dialog content panel primitive. Provides:
+ * - ARIA role, aria-modal, aria-labelledby/describedby
+ * - FocusScope (focus trap + restore + auto-focus)
+ * - Escape key dismissal (web)
+ * - Android hardware back button dismissal (native)
+ * - data-state attribute for CSS transition targeting
+ *
+ * Unstyled — the styled layer applies centering, background, border-radius, etc.
+ */
+export declare const DialogContent: import("react").ForwardRefExoticComponent<DialogContentProps & import("react").RefAttributes<View>>;
+//# sourceMappingURL=DialogContent.d.ts.map

package/lib/typescript/dialog/DialogContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogContent.d.ts","sourceRoot":"","sources":["../../../src/dialog/DialogContent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,IAAI,EAAkB,MAAM,cAAc,CAAC;AAMjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,MAAM,WAAW,kBAAmB,SAAQ,mBAAmB;CAAG;AAElE;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,qGAqDzB,CAAC"}

package/lib/typescript/dialog/DialogOverlay.d.ts

@@ -0,0 +1,11 @@
+import type { IDialogOverlayProps } from './types';
+export interface DialogOverlayProps extends IDialogOverlayProps {
+}
+/**
+ * Backdrop overlay that dismisses the dialog on press (when closeOnBackdropPress
+ * is enabled). Supports `forceMount` for exit animation coordination.
+ *
+ * Unstyled — the styled layer applies opacity/color via className.
+ */
+export declare const DialogOverlay: import("react").ForwardRefExoticComponent<DialogOverlayProps & import("react").RefAttributes<import("react-native").View>>;
+//# sourceMappingURL=DialogOverlay.d.ts.map

package/lib/typescript/dialog/DialogOverlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogOverlay.d.ts","sourceRoot":"","sources":["../../../src/dialog/DialogOverlay.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,MAAM,WAAW,kBAAmB,SAAQ,mBAAmB;CAAG;AAElE;;;;;GAKG;AACH,eAAO,MAAM,aAAa,4HAiCzB,CAAC"}

package/lib/typescript/dialog/DialogPortal.d.ts

@@ -0,0 +1,16 @@
+import type { IDialogPortalProps } from './types';
+export interface DialogPortalProps extends IDialogPortalProps {
+}
+/**
+ * Mounts dialog children into the shared PortalHost. Re-provides DialogContext
+ * inside the portal boundary (React context does not cross the portal store).
+ *
+ * When `forceMount` is false (default), the portal is unmounted when the
+ * dialog is closed. Set `forceMount={true}` to keep the portal mounted so
+ * exit animations can play before the styled layer removes it from the tree.
+ */
+export declare function DialogPortal({ forceMount, hostName, children }: DialogPortalProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace DialogPortal {
+    var displayName: string;
+}
+//# sourceMappingURL=DialogPortal.d.ts.map

package/lib/typescript/dialog/DialogPortal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogPortal.d.ts","sourceRoot":"","sources":["../../../src/dialog/DialogPortal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;CAAG;AAEhE;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,EAAE,UAAkB,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,iBAAiB,kDAYzF;yBAZe,YAAY"}

package/lib/typescript/dialog/index.d.ts

@@ -1,7 +1,10 @@
 export { DialogProvider, useDialog } from './context';
 export { DialogRoot, type DialogRootProps } from './DialogRoot';
 export { DialogTrigger, type DialogTriggerProps } from './DialogTrigger';
+export { DialogPortal, type DialogPortalProps } from './DialogPortal';
+export { DialogOverlay, type DialogOverlayProps } from './DialogOverlay';
+export { DialogContent, type DialogContentProps } from './DialogContent';
 export { DialogPopup, type DialogPopupProps } from './DialogPopup';
 export { DialogClose, type DialogCloseProps } from './DialogClose';
-export type { IDialogContextType, IDialogRootProps, IDialogTriggerProps, IDialogPopupProps, IDialogCloseProps, } from './types';
+export type { IDialogContextType, IDialogRootProps, IDialogTriggerProps, IDialogPortalProps, IDialogOverlayProps, IDialogContentProps, IDialogPopupProps, IDialogCloseProps, } from './types';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/dialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/dialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,YAAY,EACV,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/dialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,YAAY,EACV,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,mBAAmB,EACnB,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,SAAS,CAAC"}

package/lib/typescript/dialog/types.d.ts

@@ -20,6 +20,30 @@ export interface IDialogRootProps {
 export interface IDialogTriggerProps extends PressableProps {
     readonly asChild?: boolean;
 }
+export interface IDialogPortalProps {
+    readonly forceMount?: boolean;
+    readonly hostName?: string;
+    readonly children: React.ReactNode;
+}
+export interface IDialogOverlayProps extends PressableProps {
+    readonly asChild?: boolean;
+    readonly forceMount?: boolean;
+}
+export interface IDialogContentProps extends ViewProps {
+    readonly asChild?: boolean;
+    readonly forceMount?: boolean;
+    /**
+     * Whether the content shifts up to clear the on-screen keyboard (native only).
+     * No-op on web. Defaults to `true`.
+     */
+    readonly avoidKeyboard?: boolean;
+    /**
+     * Distance (in px) between the keyboard and the content when keyboard avoidance
+     * is active. Forwarded to the underlying keyboard-avoiding layer on native.
+     * Defaults to `0`.
+     */
+    readonly keyboardVerticalOffset?: number;
+}
 export interface IDialogPopupProps extends ViewProps {
     readonly forceMount?: boolean;
     /**

package/lib/typescript/dialog/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9D,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C,QAAQ,CAAC,oBAAoB,EAAE,OAAO,CAAC;IACvC,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,IAAI,EAAE,QAAQ,GAAG,aAAa,CAAC;CACzC;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IACxC,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IACzC,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IACzD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,iBAAkB,SAAQ,SAAS;IAClD,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC;;;;OAIG;IACH,QAAQ,CAAC,sBAAsB,CAAC,EAAE,MAAM,CAAC;CAC1C;AAED,MAAM,WAAW,iBAAkB,SAAQ,cAAc;IACvD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CACtC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/dialog/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9D,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C,QAAQ,CAAC,oBAAoB,EAAE,OAAO,CAAC;IACvC,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,IAAI,EAAE,QAAQ,GAAG,aAAa,CAAC;CACzC;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IACxC,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAC;IACzC,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IACzD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IACzD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC;;;;OAIG;IACH,QAAQ,CAAC,sBAAsB,CAAC,EAAE,MAAM,CAAC;CAC1C;AAED,MAAM,WAAW,iBAAkB,SAAQ,SAAS;IAClD,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IACjC;;;;OAIG;IACH,QAAQ,CAAC,sBAAsB,CAAC,EAAE,MAAM,CAAC;CAC1C;AAED,MAAM,WAAW,iBAAkB,SAAQ,cAAc;IACvD,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CACtC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/primitives",
-  "version": "0.0.1-beta.112",
+  "version": "0.0.1-beta.113",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
   "react-native": "src/index.ts",
@@ -60,7 +60,7 @@
     "@react-stately/checkbox": "3.7.4",
     "@react-stately/radio": "3.12.0",
     "@react-stately/toggle": "3.9.4",
-    "@cdx-ui/utils": "0.0.1-beta.112"
+    "@cdx-ui/utils": "0.0.1-beta.113"
   },
   "devDependencies": {
     "@types/react": "19.1.17",

package/src/dialog/DialogContent.tsx

@@ -0,0 +1,77 @@
+import { forwardRef, useCallback, useEffect, type ComponentRef } from 'react';
+import { BackHandler, View, type ViewProps } from 'react-native';
+import { FocusScope } from '@react-native-aria/focus';
+import { Slot } from '../slot';
+import { useEscapeKey } from '../overlay';
+import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
+import { useDialog } from './context';
+import type { IDialogContentProps } from './types';
+
+export interface DialogContentProps extends IDialogContentProps {}
+
+/**
+ * Dialog content panel primitive. Provides:
+ * - ARIA role, aria-modal, aria-labelledby/describedby
+ * - FocusScope (focus trap + restore + auto-focus)
+ * - Escape key dismissal (web)
+ * - Android hardware back button dismissal (native)
+ * - data-state attribute for CSS transition targeting
+ *
+ * Unstyled — the styled layer applies centering, background, border-radius, etc.
+ */
+export const DialogContent = forwardRef<ComponentRef<typeof View>, DialogContentProps>(
+  ({ asChild = false, forceMount = false, children, ...props }, ref) => {
+    const { open, onOpenChange, closeOnEscKey, nativeID, role } = useDialog();
+
+    const handleClose = useCallback(() => {
+      onOpenChange(false);
+    }, [onOpenChange]);
+
+    useEscapeKey(open && closeOnEscKey, handleClose);
+
+    useEffect(() => {
+      if (!open) return;
+
+      const backHandler = BackHandler.addEventListener('hardwareBackPress', () => {
+        onOpenChange(false);
+        return true;
+      });
+
+      return () => {
+        backHandler.remove();
+      };
+    }, [open, onOpenChange]);
+
+    if (!forceMount && !open) {
+      return null;
+    }
+
+    const Comp = asChild ? Slot : View;
+
+    const ariaProps = {
+      role,
+      'aria-modal': true,
+      'aria-labelledby': `${nativeID}-title`,
+      'aria-describedby': `${nativeID}-description`,
+    };
+
+    return (
+      <FocusScope contain={open} restoreFocus autoFocus={open}>
+        <Comp
+          ref={ref}
+          nativeID={nativeID}
+          {...ariaProps}
+          {...(props as ViewProps)}
+          {...mergeDataAttributes(
+            props,
+            forceMount ? undefined : dataAttributes({ state: open ? 'open' : 'closed' }),
+          )}
+        >
+          {children}
+        </Comp>
+      </FocusScope>
+    );
+  },
+);
+
+DialogContent.displayName = 'DialogContent';

package/src/dialog/DialogOverlay.tsx

@@ -0,0 +1,51 @@
+import { forwardRef, useCallback, type ComponentRef } from 'react';
+import { Pressable, type PressableProps } from 'react-native';
+import { Slot } from '../slot';
+import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
+import { useDialog } from './context';
+import type { IDialogOverlayProps } from './types';
+
+export interface DialogOverlayProps extends IDialogOverlayProps {}
+
+/**
+ * Backdrop overlay that dismisses the dialog on press (when closeOnBackdropPress
+ * is enabled). Supports `forceMount` for exit animation coordination.
+ *
+ * Unstyled — the styled layer applies opacity/color via className.
+ */
+export const DialogOverlay = forwardRef<ComponentRef<typeof Pressable>, DialogOverlayProps>(
+  ({ asChild = false, forceMount = false, onPress, ...props }, ref) => {
+    const { open, onOpenChange, closeOnBackdropPress } = useDialog();
+
+    const handlePress = useCallback(
+      (e: any) => {
+        if (closeOnBackdropPress) {
+          onOpenChange(false);
+        }
+        if (typeof onPress === 'function') {
+          onPress(e);
+        }
+      },
+      [closeOnBackdropPress, onOpenChange, onPress],
+    );
+
+    if (!forceMount && !open) {
+      return null;
+    }
+
+    const Comp = asChild ? Slot : Pressable;
+
+    return (
+      <Comp
+        ref={ref}
+        accessible={false}
+        importantForAccessibility="no-hide-descendants"
+        onPress={handlePress}
+        {...(props as PressableProps)}
+        {...mergeDataAttributes(props, dataAttributes({ slot: 'dialog-overlay' }))}
+      />
+    );
+  },
+);
+
+DialogOverlay.displayName = 'DialogOverlay';

package/src/dialog/DialogPortal.tsx

@@ -0,0 +1,29 @@
+import { Portal } from '../portal';
+import { DialogProvider, useDialog } from './context';
+import type { IDialogPortalProps } from './types';
+
+export interface DialogPortalProps extends IDialogPortalProps {}
+
+/**
+ * Mounts dialog children into the shared PortalHost. Re-provides DialogContext
+ * inside the portal boundary (React context does not cross the portal store).
+ *
+ * When `forceMount` is false (default), the portal is unmounted when the
+ * dialog is closed. Set `forceMount={true}` to keep the portal mounted so
+ * exit animations can play before the styled layer removes it from the tree.
+ */
+export function DialogPortal({ forceMount = false, hostName, children }: DialogPortalProps) {
+  const ctx = useDialog();
+
+  if (!forceMount && !ctx.open) {
+    return null;
+  }
+
+  return (
+    <Portal name={`${ctx.nativeID}-portal`} hostName={hostName}>
+      <DialogProvider value={ctx}>{children}</DialogProvider>
+    </Portal>
+  );
+}
+
+DialogPortal.displayName = 'DialogPortal';

package/src/dialog/index.tsx

@@ -1,12 +1,18 @@
 export { DialogProvider, useDialog } from './context';
 export { DialogRoot, type DialogRootProps } from './DialogRoot';
 export { DialogTrigger, type DialogTriggerProps } from './DialogTrigger';
+export { DialogPortal, type DialogPortalProps } from './DialogPortal';
+export { DialogOverlay, type DialogOverlayProps } from './DialogOverlay';
+export { DialogContent, type DialogContentProps } from './DialogContent';
 export { DialogPopup, type DialogPopupProps } from './DialogPopup';
 export { DialogClose, type DialogCloseProps } from './DialogClose';
 export type {
   IDialogContextType,
   IDialogRootProps,
   IDialogTriggerProps,
+  IDialogPortalProps,
+  IDialogOverlayProps,
+  IDialogContentProps,
   IDialogPopupProps,
   IDialogCloseProps,
 } from './types';

package/src/dialog/types.ts

@@ -24,6 +24,33 @@ export interface IDialogTriggerProps extends PressableProps {
   readonly asChild?: boolean;
 }
 
+export interface IDialogPortalProps {
+  readonly forceMount?: boolean;
+  readonly hostName?: string;
+  readonly children: React.ReactNode;
+}
+
+export interface IDialogOverlayProps extends PressableProps {
+  readonly asChild?: boolean;
+  readonly forceMount?: boolean;
+}
+
+export interface IDialogContentProps extends ViewProps {
+  readonly asChild?: boolean;
+  readonly forceMount?: boolean;
+  /**
+   * Whether the content shifts up to clear the on-screen keyboard (native only).
+   * No-op on web. Defaults to `true`.
+   */
+  readonly avoidKeyboard?: boolean;
+  /**
+   * Distance (in px) between the keyboard and the content when keyboard avoidance
+   * is active. Forwarded to the underlying keyboard-avoiding layer on native.
+   * Defaults to `0`.
+   */
+  readonly keyboardVerticalOffset?: number;
+}
+
 export interface IDialogPopupProps extends ViewProps {
   readonly forceMount?: boolean;
   /**