@cdx-ui/primitives 0.0.1-beta.51 → 0.0.1-beta.52

package/lib/module/dialog/createDialogPopup.js

@@ -0,0 +1,152 @@
+"use strict";
+
+import { forwardRef, useCallback } from 'react';
+import { KeyboardAvoidingView, Modal, Platform, StyleSheet, View } from 'react-native';
+import { FocusScope } from '@react-native-aria/focus';
+import { useEscapeKey } from '../overlay';
+import { createPortalFn } from '../utils/createPortal';
+import { dataAttributes } from '../utils/dataAttributes';
+import { useDialog } from './context';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const createDialogPopup = (BasePopup, BaseOverlay) => /*#__PURE__*/forwardRef(({
+  children,
+  forceMount = false,
+  avoidKeyboard = true,
+  keyboardVerticalOffset = 0,
+  ...props
+}, ref) => {
+  const {
+    open,
+    onOpenChange,
+    closeOnBackdropPress,
+    closeOnEscKey,
+    nativeID,
+    role
+  } = useDialog();
+  const handleClose = useCallback(() => {
+    onOpenChange(false);
+  }, [onOpenChange]);
+  useEscapeKey(open && closeOnEscKey, handleClose);
+  if (!(open || forceMount)) {
+    return null;
+  }
+  const overlayProps = {
+    ...(closeOnBackdropPress ? {
+      onPress: handleClose
+    } : {}),
+    accessible: false,
+    importantForAccessibility: 'no-hide-descendants',
+    ...dataAttributes({
+      slot: 'dialog-overlay'
+    })
+  };
+  const contentSlotAttrs = dataAttributes({
+    slot: 'dialog-popup',
+    state: open ? 'open' : 'closed'
+  });
+  const ariaProps = {
+    role,
+    'aria-modal': true,
+    'aria-labelledby': `${nativeID}-title`,
+    'aria-describedby': `${nativeID}-description`
+  };
+  if (Platform.OS === 'web' && createPortalFn) {
+    return createPortalFn(/*#__PURE__*/_jsx(FocusScope, {
+      contain: open,
+      restoreFocus: true,
+      autoFocus: open,
+      children: /*#__PURE__*/_jsxs(View, {
+        style: {
+          position: 'fixed',
+          inset: 0,
+          zIndex: 50,
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center'
+        },
+        children: [/*#__PURE__*/_jsx(BaseOverlay, {
+          ...overlayProps
+        }), /*#__PURE__*/_jsx(BasePopup, {
+          ref: ref,
+          ...contentSlotAttrs,
+          ...props,
+          ...ariaProps,
+          children: children
+        })]
+      })
+    }), document.body);
+  }
+
+  // Native layout uses two layers to support both backdrop dismiss and
+  // scrollable body content. The overlay Pressable fills the Modal via
+  // absolute positioning and handles backdrop taps. A second flex layer with
+  // pointerEvents="box-none" centers the content panel — "box-none" lets taps
+  // outside the panel pass through to the overlay while allowing the panel and
+  // its children to receive touches normally.
+  //
+  // That centering layer is a KeyboardAvoidingView so the panel (including its
+  // footer/actions, which sit at the bottom of a centered, max-h-capped panel)
+  // shifts up to clear the on-screen keyboard. `behavior` is platform-specific
+  // and the layer is a no-op while no input is focused. The RN Modal renders in
+  // its own window, so this MUST live here — a KeyboardAvoidingView wrapping the
+  // <Dialog> at the usage level cannot reach this subtree. Web is unaffected
+  // (the browser handles focus scrolling; there is no occluding keyboard).
+  //
+  // Critically, the content panel must NOT claim the JS touch responder
+  // (e.g. via onStartShouldSetResponder). Doing so triggers React Native's
+  // blockNativeResponder, which suppresses the native UIScrollView /
+  // ScrollView pan gesture recognizer and breaks any ScrollView inside
+  // Dialog.Content.
+  //
+  // Static StyleSheet used here because these are structural layout concerns
+  // of the primitive's modal chrome — not themeable styles. They must remain
+  // stable regardless of the styled layer's className.
+  const keyboardBehavior = avoidKeyboard ? Platform.select({
+    ios: 'padding',
+    default: 'height'
+  }) : undefined;
+  return /*#__PURE__*/_jsx(Modal, {
+    visible: open,
+    transparent: true,
+    statusBarTranslucent: true,
+    onRequestClose: handleClose,
+    children: /*#__PURE__*/_jsx(FocusScope, {
+      contain: open,
+      restoreFocus: true,
+      autoFocus: open,
+      children: /*#__PURE__*/_jsxs(View, {
+        style: styles.fill,
+        children: [/*#__PURE__*/_jsx(BaseOverlay, {
+          ...overlayProps
+        }), /*#__PURE__*/_jsx(KeyboardAvoidingView, {
+          style: styles.center,
+          pointerEvents: "box-none",
+          behavior: keyboardBehavior,
+          keyboardVerticalOffset: keyboardVerticalOffset,
+          children: /*#__PURE__*/_jsx(BasePopup, {
+            ref: ref,
+            ...contentSlotAttrs,
+            ...props,
+            ...ariaProps,
+            children: children
+          })
+        })]
+      })
+    })
+  });
+});
+
+// Structural layout for the native Modal chrome. These are not themeable —
+// they position the overlay and centering layers that the primitive manages
+// internally. Matches the pattern in OverlayContainer.tsx.
+const styles = StyleSheet.create({
+  fill: {
+    flex: 1
+  },
+  center: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center'
+  }
+});
+//# sourceMappingURL=createDialogPopup.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["forwardRef","useCallback","KeyboardAvoidingView","Modal","Platform","StyleSheet","View","FocusScope","useEscapeKey","createPortalFn","dataAttributes","useDialog","jsx","_jsx","jsxs","_jsxs","createDialogPopup","BasePopup","BaseOverlay","children","forceMount","avoidKeyboard","keyboardVerticalOffset","props","ref","open","onOpenChange","closeOnBackdropPress","closeOnEscKey","nativeID","role","handleClose","overlayProps","onPress","accessible","importantForAccessibility","slot","contentSlotAttrs","state","ariaProps","OS","contain","restoreFocus","autoFocus","style","position","inset","zIndex","display","alignItems","justifyContent","document","body","keyboardBehavior","select","ios","default","undefined","visible","transparent","statusBarTranslucent","onRequestClose","styles","fill","center","pointerEvents","behavior","create","flex"],"sourceRoot":"../../../src","sources":["dialog/createDialogPopup.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/dialog/index.js

@@ -2,11 +2,11 @@
 
 import { createDialogRoot } from './createDialogRoot';
 import { createDialogTrigger } from './createDialogTrigger';
-import { createDialogContent } from './createDialogContent';
+import { createDialogPopup } from './createDialogPopup';
 import { createDialogHeader } from './createDialogHeader';
 import { createDialogTitle } from './createDialogTitle';
 import { createDialogDescription } from './createDialogDescription';
-import { createDialogBody } from './createDialogBody';
+import { createDialogContent } from './createDialogContent';
 import { createDialogFooter } from './createDialogFooter';
 import { createDialogClose } from './createDialogClose';
 import { DialogProvider, useDialog } from './context';
@@ -14,30 +14,30 @@ export { DialogProvider, useDialog };
 export function createDialog(BaseComponents) {
   const Root = createDialogRoot(BaseComponents.Root);
   const Trigger = createDialogTrigger(BaseComponents.Trigger);
-  const Content = createDialogContent(BaseComponents.Content, BaseComponents.Overlay);
+  const Popup = createDialogPopup(BaseComponents.Popup, BaseComponents.Overlay);
   const Header = createDialogHeader(BaseComponents.Header);
   const Title = createDialogTitle(BaseComponents.Title);
   const Description = createDialogDescription(BaseComponents.Description);
-  const Body = createDialogBody(BaseComponents.Body);
+  const Content = createDialogContent(BaseComponents.Content);
   const Footer = createDialogFooter(BaseComponents.Footer);
   const Close = createDialogClose(BaseComponents.Close);
   Root.displayName = 'DialogPrimitive.Root';
   Trigger.displayName = 'DialogPrimitive.Trigger';
-  Content.displayName = 'DialogPrimitive.Content';
+  Popup.displayName = 'DialogPrimitive.Popup';
   Header.displayName = 'DialogPrimitive.Header';
   Title.displayName = 'DialogPrimitive.Title';
   Description.displayName = 'DialogPrimitive.Description';
-  Body.displayName = 'DialogPrimitive.Body';
+  Content.displayName = 'DialogPrimitive.Content';
   Footer.displayName = 'DialogPrimitive.Footer';
   Close.displayName = 'DialogPrimitive.Close';
   return Object.assign(Root, {
     Root,
     Trigger,
-    Content,
+    Popup,
     Header,
     Title,
     Description,
-    Body,
+    Content,
     Footer,
     Close
   });

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

@@ -1 +1 @@
-{"version":3,"names":["createDialogRoot","createDialogTrigger","createDialogContent","createDialogHeader","createDialogTitle","createDialogDescription","createDialogBody","createDialogFooter","createDialogClose","DialogProvider","useDialog","createDialog","BaseComponents","Root","Trigger","Content","Overlay","Header","Title","Description","Body","Footer","Close","displayName","Object","assign"],"sourceRoot":"../../../src","sources":["dialog/index.tsx"],"mappings":";;AACA,SAASA,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,mBAAmB,QAAQ,uBAAuB;AAC3D,SAASC,mBAAmB,QAAQ,uBAAuB;AAC3D,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SAASC,uBAAuB,QAAQ,2BAA2B;AACnE,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SAASC,cAAc,EAAEC,SAAS,QAAQ,WAAW;AAGrD,SAASD,cAAc,EAAEC,SAAS;AAelC,OAAO,SAASC,YAAYA,CAW1BC,cAWD,EAAE;EACD,MAAMC,IAAI,GAAGb,gBAAgB,CAACY,cAAc,CAACC,IAAI,CAAC;EAClD,MAAMC,OAAO,GAAGb,mBAAmB,CAACW,cAAc,CAACE,OAAO,CAAC;EAC3D,MAAMC,OAAO,GAAGb,mBAAmB,CAACU,cAAc,CAACG,OAAO,EAAEH,cAAc,CAACI,OAAO,CAAC;EACnF,MAAMC,MAAM,GAAGd,kBAAkB,CAACS,cAAc,CAACK,MAAM,CAAC;EACxD,MAAMC,KAAK,GAAGd,iBAAiB,CAACQ,cAAc,CAACM,KAAK,CAAC;EACrD,MAAMC,WAAW,GAAGd,uBAAuB,CAACO,cAAc,CAACO,WAAW,CAAC;EACvE,MAAMC,IAAI,GAAGd,gBAAgB,CAACM,cAAc,CAACQ,IAAI,CAAC;EAClD,MAAMC,MAAM,GAAGd,kBAAkB,CAACK,cAAc,CAACS,MAAM,CAAC;EACxD,MAAMC,KAAK,GAAGd,iBAAiB,CAACI,cAAc,CAACU,KAAK,CAAC;EAErDT,IAAI,CAACU,WAAW,GAAG,sBAAsB;EACzCT,OAAO,CAACS,WAAW,GAAG,yBAAyB;EAC/CR,OAAO,CAACQ,WAAW,GAAG,yBAAyB;EAC/CN,MAAM,CAACM,WAAW,GAAG,wBAAwB;EAC7CL,KAAK,CAACK,WAAW,GAAG,uBAAuB;EAC3CJ,WAAW,CAACI,WAAW,GAAG,6BAA6B;EACvDH,IAAI,CAACG,WAAW,GAAG,sBAAsB;EACzCF,MAAM,CAACE,WAAW,GAAG,wBAAwB;EAC7CD,KAAK,CAACC,WAAW,GAAG,uBAAuB;EAE3C,OAAOC,MAAM,CAACC,MAAM,CAACZ,IAAI,EAAE;IACzBA,IAAI;IACJC,OAAO;IACPC,OAAO;IACPE,MAAM;IACNC,KAAK;IACLC,WAAW;IACXC,IAAI;IACJC,MAAM;IACNC;EACF,CAAC,CAAC;AAWJ","ignoreList":[]}
+{"version":3,"names":["createDialogRoot","createDialogTrigger","createDialogPopup","createDialogHeader","createDialogTitle","createDialogDescription","createDialogContent","createDialogFooter","createDialogClose","DialogProvider","useDialog","createDialog","BaseComponents","Root","Trigger","Popup","Overlay","Header","Title","Description","Content","Footer","Close","displayName","Object","assign"],"sourceRoot":"../../../src","sources":["dialog/index.tsx"],"mappings":";;AACA,SAASA,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,mBAAmB,QAAQ,uBAAuB;AAC3D,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SAASC,uBAAuB,QAAQ,2BAA2B;AACnE,SAASC,mBAAmB,QAAQ,uBAAuB;AAC3D,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SAASC,cAAc,EAAEC,SAAS,QAAQ,WAAW;AAGrD,SAASD,cAAc,EAAEC,SAAS;AAelC,OAAO,SAASC,YAAYA,CAW1BC,cAWD,EAAE;EACD,MAAMC,IAAI,GAAGb,gBAAgB,CAACY,cAAc,CAACC,IAAI,CAAC;EAClD,MAAMC,OAAO,GAAGb,mBAAmB,CAACW,cAAc,CAACE,OAAO,CAAC;EAC3D,MAAMC,KAAK,GAAGb,iBAAiB,CAACU,cAAc,CAACG,KAAK,EAAEH,cAAc,CAACI,OAAO,CAAC;EAC7E,MAAMC,MAAM,GAAGd,kBAAkB,CAACS,cAAc,CAACK,MAAM,CAAC;EACxD,MAAMC,KAAK,GAAGd,iBAAiB,CAACQ,cAAc,CAACM,KAAK,CAAC;EACrD,MAAMC,WAAW,GAAGd,uBAAuB,CAACO,cAAc,CAACO,WAAW,CAAC;EACvE,MAAMC,OAAO,GAAGd,mBAAmB,CAACM,cAAc,CAACQ,OAAO,CAAC;EAC3D,MAAMC,MAAM,GAAGd,kBAAkB,CAACK,cAAc,CAACS,MAAM,CAAC;EACxD,MAAMC,KAAK,GAAGd,iBAAiB,CAACI,cAAc,CAACU,KAAK,CAAC;EAErDT,IAAI,CAACU,WAAW,GAAG,sBAAsB;EACzCT,OAAO,CAACS,WAAW,GAAG,yBAAyB;EAC/CR,KAAK,CAACQ,WAAW,GAAG,uBAAuB;EAC3CN,MAAM,CAACM,WAAW,GAAG,wBAAwB;EAC7CL,KAAK,CAACK,WAAW,GAAG,uBAAuB;EAC3CJ,WAAW,CAACI,WAAW,GAAG,6BAA6B;EACvDH,OAAO,CAACG,WAAW,GAAG,yBAAyB;EAC/CF,MAAM,CAACE,WAAW,GAAG,wBAAwB;EAC7CD,KAAK,CAACC,WAAW,GAAG,uBAAuB;EAE3C,OAAOC,MAAM,CAACC,MAAM,CAACZ,IAAI,EAAE;IACzBA,IAAI;IACJC,OAAO;IACPC,KAAK;IACLE,MAAM;IACNC,KAAK;IACLC,WAAW;IACXC,OAAO;IACPC,MAAM;IACNC;EACF,CAAC,CAAC;AAWJ","ignoreList":[]}

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

@@ -1,4 +1,4 @@
-import type React from 'react';
+import React from 'react';
 import type { IDialogContentProps } from './types';
-export declare const createDialogContent: <ContentProps, OverlayProps>(BaseContent: React.ComponentType<ContentProps>, BaseOverlay: React.ComponentType<OverlayProps>) => React.ForwardRefExoticComponent<IDialogContentProps & React.RefAttributes<unknown>>;
+export declare const createDialogContent: <T>(BaseContent: React.ComponentType<T>) => React.ForwardRefExoticComponent<IDialogContentProps & React.RefAttributes<unknown>>;
 //# sourceMappingURL=createDialogContent.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"createDialogContent.d.ts","sourceRoot":"","sources":["../../../src/dialog/createDialogContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,eAAO,MAAM,mBAAmB,GAAI,YAAY,EAAE,YAAY,EAC5D,aAAa,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,EAC9C,aAAa,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,wFAiG5C,CAAC"}
+{"version":3,"file":"createDialogContent.d.ts","sourceRoot":"","sources":["../../../src/dialog/createDialogContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,eAAO,MAAM,mBAAmB,GAAI,CAAC,EAAG,aAAa,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,wFAOvE,CAAC"}

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

@@ -0,0 +1,4 @@
+import type React from 'react';
+import type { IDialogPopupProps } from './types';
+export declare const createDialogPopup: <PopupProps, OverlayProps>(BasePopup: React.ComponentType<PopupProps>, BaseOverlay: React.ComponentType<OverlayProps>) => React.ForwardRefExoticComponent<IDialogPopupProps & React.RefAttributes<unknown>>;
+//# sourceMappingURL=createDialogPopup.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"createDialogPopup.d.ts","sourceRoot":"","sources":["../../../src/dialog/createDialogPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,eAAO,MAAM,iBAAiB,GAAI,UAAU,EAAE,YAAY,EACxD,WAAW,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,EAC1C,aAAa,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,sFAyH7C,CAAC"}

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

@@ -2,17 +2,17 @@ import type React from 'react';
 import { DialogProvider, useDialog } from './context';
 import type { IDialogComponentType } from './types';
 export { DialogProvider, useDialog };
-export type { IDialogContextType, IDialogRootProps, IDialogTriggerProps, IDialogContentProps, IDialogOverlayProps, IDialogHeaderProps, IDialogTitleProps, IDialogDescriptionProps, IDialogBodyProps, IDialogFooterProps, IDialogCloseProps, } from './types';
-export declare function createDialog<RootProps, TriggerProps, ContentProps, OverlayProps, HeaderProps, TitleProps, DescriptionProps, BodyProps, FooterProps, CloseProps>(BaseComponents: {
+export type { IDialogContextType, IDialogRootProps, IDialogTriggerProps, IDialogPopupProps, IDialogOverlayProps, IDialogHeaderProps, IDialogTitleProps, IDialogDescriptionProps, IDialogContentProps, IDialogFooterProps, IDialogCloseProps, } from './types';
+export declare function createDialog<RootProps, TriggerProps, PopupProps, OverlayProps, HeaderProps, TitleProps, DescriptionProps, ContentProps, FooterProps, CloseProps>(BaseComponents: {
     Root: React.ComponentType<RootProps>;
     Trigger: React.ComponentType<TriggerProps>;
-    Content: React.ComponentType<ContentProps>;
+    Popup: React.ComponentType<PopupProps>;
     Overlay: React.ComponentType<OverlayProps>;
     Header: React.ComponentType<HeaderProps>;
     Title: React.ComponentType<TitleProps>;
     Description: React.ComponentType<DescriptionProps>;
-    Body: React.ComponentType<BodyProps>;
+    Content: React.ComponentType<ContentProps>;
     Footer: React.ComponentType<FooterProps>;
     Close: React.ComponentType<CloseProps>;
-}): IDialogComponentType<RootProps, TriggerProps, ContentProps, HeaderProps, TitleProps, DescriptionProps, BodyProps, FooterProps, CloseProps>;
+}): IDialogComponentType<RootProps, TriggerProps, PopupProps, HeaderProps, TitleProps, DescriptionProps, ContentProps, FooterProps, CloseProps>;
 //# 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,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAEpD,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,CAAC;AACrC,YAAY,EACV,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACvB,gBAAgB,EAChB,kBAAkB,EAClB,iBAAiB,GAClB,MAAM,SAAS,CAAC;AAEjB,wBAAgB,YAAY,CAC1B,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,SAAS,EACT,WAAW,EACX,UAAU,EACV,cAAc,EAAE;IAChB,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IACrC,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IAC3C,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IAC3C,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IACzC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACvC,WAAW,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACnD,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IACrC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IACzC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;CACxC,GA+BO,oBAAoB,CACxB,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,SAAS,EACT,WAAW,EACX,UAAU,CACX,CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/dialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAEpD,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,CAAC;AACrC,YAAY,EACV,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,EACvB,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,GAClB,MAAM,SAAS,CAAC;AAEjB,wBAAgB,YAAY,CAC1B,SAAS,EACT,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,UAAU,EACV,cAAc,EAAE;IAChB,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IACrC,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IAC3C,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACvC,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IACzC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACvC,WAAW,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACnD,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;IAC3C,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IACzC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;CACxC,GA+BO,oBAAoB,CACxB,SAAS,EACT,YAAY,EACZ,UAAU,EACV,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,UAAU,CACX,CACF"}

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

@@ -20,8 +20,19 @@ export interface IDialogRootProps {
 export interface IDialogTriggerProps extends PressableProps {
     readonly asChild?: boolean;
 }
-export interface IDialogContentProps extends ViewProps {
+export interface IDialogPopupProps extends ViewProps {
     readonly forceMount?: boolean;
+    /**
+     * Whether the popup 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 popup when keyboard avoidance
+     * is active. Forwarded to the underlying keyboard-avoiding layer on native.
+     * Defaults to `0`.
+     */
+    readonly keyboardVerticalOffset?: number;
 }
 export interface IDialogOverlayProps extends PressableProps {
 }
@@ -31,7 +42,7 @@ export interface IDialogTitleProps extends TextProps {
 }
 export interface IDialogDescriptionProps extends TextProps {
 }
-export interface IDialogBodyProps extends ViewProps {
+export interface IDialogContentProps extends ViewProps {
 }
 export interface IDialogFooterProps extends ViewProps {
 }
@@ -39,13 +50,13 @@ export interface IDialogCloseProps extends PressableProps {
     readonly asChild?: boolean;
     readonly accessibilityLabel?: string;
 }
-export type IDialogComponentType<RootProps, TriggerProps, ContentProps, HeaderProps, TitleProps, DescriptionProps, BodyProps, FooterProps, CloseProps, ContentRef = unknown, TriggerRef = unknown, CloseRef = unknown> = React.ForwardRefExoticComponent<PropsWithoutRef<RootProps & IDialogRootProps> & RefAttributes<unknown>> & {
+export type IDialogComponentType<RootProps, TriggerProps, PopupProps, HeaderProps, TitleProps, DescriptionProps, ContentProps, FooterProps, CloseProps, PopupRef = unknown, TriggerRef = unknown, CloseRef = unknown> = React.ForwardRefExoticComponent<PropsWithoutRef<RootProps & IDialogRootProps> & RefAttributes<unknown>> & {
     Trigger: React.ForwardRefExoticComponent<PropsWithoutRef<TriggerProps & IDialogTriggerProps> & RefAttributes<TriggerRef>>;
-    Content: React.ForwardRefExoticComponent<PropsWithoutRef<ContentProps & IDialogContentProps> & RefAttributes<ContentRef>>;
+    Popup: React.ForwardRefExoticComponent<PropsWithoutRef<PopupProps & IDialogPopupProps> & RefAttributes<PopupRef>>;
     Header: React.ForwardRefExoticComponent<PropsWithoutRef<HeaderProps & IDialogHeaderProps> & RefAttributes<unknown>>;
     Title: React.ForwardRefExoticComponent<PropsWithoutRef<TitleProps & IDialogTitleProps> & RefAttributes<unknown>>;
     Description: React.ForwardRefExoticComponent<PropsWithoutRef<DescriptionProps & IDialogDescriptionProps> & RefAttributes<unknown>>;
-    Body: React.ForwardRefExoticComponent<PropsWithoutRef<BodyProps & IDialogBodyProps> & RefAttributes<unknown>>;
+    Content: React.ForwardRefExoticComponent<PropsWithoutRef<ContentProps & IDialogContentProps> & RefAttributes<unknown>>;
     Footer: React.ForwardRefExoticComponent<PropsWithoutRef<FooterProps & IDialogFooterProps> & RefAttributes<unknown>>;
     Close: React.ForwardRefExoticComponent<PropsWithoutRef<CloseProps & IDialogCloseProps> & RefAttributes<CloseRef>>;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/dialog/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/dialog/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/primitives",
-  "version": "0.0.1-beta.51",
+  "version": "0.0.1-beta.52",
   "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.51"
+    "@cdx-ui/utils": "0.0.1-beta.52"
   },
   "devDependencies": {
     "@types/react": "*",

package/src/dialog/createDialogContent.tsx

@@ -1,122 +1,11 @@
-import type React from 'react';
-import { forwardRef, useCallback } from 'react';
-import { Modal, Platform, StyleSheet, View } from 'react-native';
-import { FocusScope } from '@react-native-aria/focus';
-import { useEscapeKey } from '../overlay';
-import { createPortalFn } from '../utils/createPortal';
-import { dataAttributes } from '../utils/dataAttributes';
-import { useDialog } from './context';
+import React, { forwardRef } from 'react';
 import type { IDialogContentProps } from './types';
 
-export const createDialogContent = <ContentProps, OverlayProps>(
-  BaseContent: React.ComponentType<ContentProps>,
-  BaseOverlay: React.ComponentType<OverlayProps>,
-) =>
-  forwardRef(({ children, forceMount = false, ...props }: IDialogContentProps, ref?: any) => {
-    const { open, onOpenChange, closeOnBackdropPress, closeOnEscKey, nativeID, role } = useDialog();
-
-    const handleClose = useCallback(() => {
-      onOpenChange(false);
-    }, [onOpenChange]);
-
-    useEscapeKey(open && closeOnEscKey, handleClose);
-
-    if (!(open || forceMount)) {
-      return null;
-    }
-
-    const overlayProps = {
-      ...(closeOnBackdropPress ? { onPress: handleClose } : {}),
-      accessible: false,
-      importantForAccessibility: 'no-hide-descendants' as const,
-      ...dataAttributes({ slot: 'dialog-overlay' }),
-    };
-
-    const contentSlotAttrs = dataAttributes({
-      slot: 'dialog-content',
-      state: open ? 'open' : 'closed',
-    });
-
-    const ariaProps = {
-      role,
-      'aria-modal': true,
-      'aria-labelledby': `${nativeID}-title`,
-      'aria-describedby': `${nativeID}-description`,
-    };
-
-    if (Platform.OS === 'web' && createPortalFn) {
-      return createPortalFn(
-        <FocusScope contain={open} restoreFocus autoFocus={open}>
-          <View
-            style={{
-              position: 'fixed' as any,
-              inset: 0 as any,
-              zIndex: 50,
-              display: 'flex' as any,
-              alignItems: 'center',
-              justifyContent: 'center',
-            }}
-          >
-            <BaseOverlay {...(overlayProps as any)} />
-            <BaseContent
-              ref={ref}
-              {...contentSlotAttrs}
-              {...(props as ContentProps)}
-              {...ariaProps}
-            >
-              {children}
-            </BaseContent>
-          </View>
-        </FocusScope>,
-        document.body,
-      );
-    }
-
-    // Native layout uses two layers to support both backdrop dismiss and
-    // scrollable body content. The overlay Pressable fills the Modal via
-    // absolute positioning and handles backdrop taps. A second absolute-fill
-    // View with pointerEvents="box-none" centers the content panel — "box-none"
-    // lets taps outside the panel pass through to the overlay while allowing
-    // the panel and its children to receive touches normally.
-    //
-    // Critically, the content panel must NOT claim the JS touch responder
-    // (e.g. via onStartShouldSetResponder). Doing so triggers React Native's
-    // blockNativeResponder, which suppresses the native UIScrollView /
-    // ScrollView pan gesture recognizer and breaks any ScrollView inside
-    // Dialog.Body.
-    //
-    // Static StyleSheet used here because these are structural layout concerns
-    // of the primitive's modal chrome — not themeable styles. They must remain
-    // stable regardless of the styled layer's className.
+export const createDialogContent = <T,>(BaseContent: React.ComponentType<T>) =>
+  forwardRef<unknown, IDialogContentProps>(({ children, ...props }, ref) => {
     return (
-      <Modal visible={open} transparent statusBarTranslucent onRequestClose={handleClose}>
-        <FocusScope contain={open} restoreFocus autoFocus={open}>
-          <View style={styles.fill}>
-            <BaseOverlay {...(overlayProps as any)} />
-            <View style={styles.center} pointerEvents="box-none">
-              <BaseContent
-                ref={ref}
-                {...contentSlotAttrs}
-                {...(props as ContentProps)}
-                {...ariaProps}
-              >
-                {children}
-              </BaseContent>
-            </View>
-          </View>
-        </FocusScope>
-      </Modal>
+      <BaseContent ref={ref} {...(props as T)}>
+        {children}
+      </BaseContent>
     );
   });
-
-// Structural layout for the native Modal chrome. These are not themeable —
-// they position the overlay and centering layers that the primitive manages
-// internally. Matches the pattern in OverlayContainer.tsx.
-const styles = StyleSheet.create({
-  fill: { flex: 1 },
-  center: {
-    ...StyleSheet.absoluteFillObject,
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-});

package/src/dialog/createDialogPopup.tsx

@@ -0,0 +1,146 @@
+import type React from 'react';
+import { forwardRef, useCallback } from 'react';
+import { KeyboardAvoidingView, Modal, Platform, StyleSheet, View } from 'react-native';
+import { FocusScope } from '@react-native-aria/focus';
+import { useEscapeKey } from '../overlay';
+import { createPortalFn } from '../utils/createPortal';
+import { dataAttributes } from '../utils/dataAttributes';
+import { useDialog } from './context';
+import type { IDialogPopupProps } from './types';
+
+export const createDialogPopup = <PopupProps, OverlayProps>(
+  BasePopup: React.ComponentType<PopupProps>,
+  BaseOverlay: React.ComponentType<OverlayProps>,
+) =>
+  forwardRef(
+    (
+      {
+        children,
+        forceMount = false,
+        avoidKeyboard = true,
+        keyboardVerticalOffset = 0,
+        ...props
+      }: IDialogPopupProps,
+      ref?: any,
+    ) => {
+      const { open, onOpenChange, closeOnBackdropPress, closeOnEscKey, nativeID, role } =
+        useDialog();
+
+      const handleClose = useCallback(() => {
+        onOpenChange(false);
+      }, [onOpenChange]);
+
+      useEscapeKey(open && closeOnEscKey, handleClose);
+
+      if (!(open || forceMount)) {
+        return null;
+      }
+
+      const overlayProps = {
+        ...(closeOnBackdropPress ? { onPress: handleClose } : {}),
+        accessible: false,
+        importantForAccessibility: 'no-hide-descendants' as const,
+        ...dataAttributes({ slot: 'dialog-overlay' }),
+      };
+
+      const contentSlotAttrs = dataAttributes({
+        slot: 'dialog-popup',
+        state: open ? 'open' : 'closed',
+      });
+
+      const ariaProps = {
+        role,
+        'aria-modal': true,
+        'aria-labelledby': `${nativeID}-title`,
+        'aria-describedby': `${nativeID}-description`,
+      };
+
+      if (Platform.OS === 'web' && createPortalFn) {
+        return createPortalFn(
+          <FocusScope contain={open} restoreFocus autoFocus={open}>
+            <View
+              style={{
+                position: 'fixed' as any,
+                inset: 0 as any,
+                zIndex: 50,
+                display: 'flex' as any,
+                alignItems: 'center',
+                justifyContent: 'center',
+              }}
+            >
+              <BaseOverlay {...(overlayProps as any)} />
+              <BasePopup ref={ref} {...contentSlotAttrs} {...(props as PopupProps)} {...ariaProps}>
+                {children}
+              </BasePopup>
+            </View>
+          </FocusScope>,
+          document.body,
+        );
+      }
+
+      // Native layout uses two layers to support both backdrop dismiss and
+      // scrollable body content. The overlay Pressable fills the Modal via
+      // absolute positioning and handles backdrop taps. A second flex layer with
+      // pointerEvents="box-none" centers the content panel — "box-none" lets taps
+      // outside the panel pass through to the overlay while allowing the panel and
+      // its children to receive touches normally.
+      //
+      // That centering layer is a KeyboardAvoidingView so the panel (including its
+      // footer/actions, which sit at the bottom of a centered, max-h-capped panel)
+      // shifts up to clear the on-screen keyboard. `behavior` is platform-specific
+      // and the layer is a no-op while no input is focused. The RN Modal renders in
+      // its own window, so this MUST live here — a KeyboardAvoidingView wrapping the
+      // <Dialog> at the usage level cannot reach this subtree. Web is unaffected
+      // (the browser handles focus scrolling; there is no occluding keyboard).
+      //
+      // Critically, the content panel must NOT claim the JS touch responder
+      // (e.g. via onStartShouldSetResponder). Doing so triggers React Native's
+      // blockNativeResponder, which suppresses the native UIScrollView /
+      // ScrollView pan gesture recognizer and breaks any ScrollView inside
+      // Dialog.Content.
+      //
+      // Static StyleSheet used here because these are structural layout concerns
+      // of the primitive's modal chrome — not themeable styles. They must remain
+      // stable regardless of the styled layer's className.
+      const keyboardBehavior = avoidKeyboard
+        ? Platform.select<'padding' | 'height'>({ ios: 'padding', default: 'height' })
+        : undefined;
+
+      return (
+        <Modal visible={open} transparent statusBarTranslucent onRequestClose={handleClose}>
+          <FocusScope contain={open} restoreFocus autoFocus={open}>
+            <View style={styles.fill}>
+              <BaseOverlay {...(overlayProps as any)} />
+              <KeyboardAvoidingView
+                style={styles.center}
+                pointerEvents="box-none"
+                behavior={keyboardBehavior}
+                keyboardVerticalOffset={keyboardVerticalOffset}
+              >
+                <BasePopup
+                  ref={ref}
+                  {...contentSlotAttrs}
+                  {...(props as PopupProps)}
+                  {...ariaProps}
+                >
+                  {children}
+                </BasePopup>
+              </KeyboardAvoidingView>
+            </View>
+          </FocusScope>
+        </Modal>
+      );
+    },
+  );
+
+// Structural layout for the native Modal chrome. These are not themeable —
+// they position the overlay and centering layers that the primitive manages
+// internally. Matches the pattern in OverlayContainer.tsx.
+const styles = StyleSheet.create({
+  fill: { flex: 1 },
+  center: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});