@tamagui/dialog 1.13.3 → 1.14.0

package/dist/cjs/Dialog.js

@@ -1,645 +1,6 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var Dialog_exports = {};
-__export(Dialog_exports, {
-  Dialog: () => Dialog,
-  DialogClose: () => DialogClose,
-  DialogContent: () => DialogContent,
-  DialogDescription: () => DialogDescription,
-  DialogOverlay: () => DialogOverlay,
-  DialogOverlayFrame: () => DialogOverlayFrame,
-  DialogPortal: () => DialogPortal,
-  DialogPortalFrame: () => DialogPortalFrame,
-  DialogSheetContents: () => DialogSheetContents,
-  DialogTitle: () => DialogTitle,
-  DialogTrigger: () => DialogTrigger,
-  DialogWarningProvider: () => DialogWarningProvider,
-  createDialogScope: () => createDialogScope
-});
-module.exports = __toCommonJS(Dialog_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_adapt = require("@tamagui/adapt");
-var import_animate_presence = require("@tamagui/animate-presence");
-var import_aria_hidden = require("@tamagui/aria-hidden");
-var import_compose_refs = require("@tamagui/compose-refs");
-var import_core = require("@tamagui/core");
-var import_create_context = require("@tamagui/create-context");
-var import_dismissable = require("@tamagui/dismissable");
-var import_focus_scope = require("@tamagui/focus-scope");
-var import_portal = require("@tamagui/portal");
-var import_remove_scroll = require("@tamagui/remove-scroll");
-var import_sheet = require("@tamagui/sheet");
-var import_stacks = require("@tamagui/stacks");
-var import_text = require("@tamagui/text");
-var import_use_controllable_state = require("@tamagui/use-controllable-state");
-var React = __toESM(require("react"));
-const DIALOG_NAME = "Dialog";
-const [createDialogContext, createDialogScope] = (0, import_create_context.createContextScope)(DIALOG_NAME);
-const [DialogProvider, useDialogContext] = createDialogContext(DIALOG_NAME);
-const TRIGGER_NAME = "DialogTrigger";
-const DialogTriggerFrame = (0, import_core.styled)(import_stacks.YStack, {
-  name: TRIGGER_NAME
-});
-const DialogTrigger = React.forwardRef(
-  (props, forwardedRef) => {
-    const { __scopeDialog, ...triggerProps } = props;
-    const context = useDialogContext(TRIGGER_NAME, __scopeDialog);
-    const composedTriggerRef = (0, import_compose_refs.useComposedRefs)(forwardedRef, context.triggerRef);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      DialogTriggerFrame,
-      {
-        tag: "button",
-        "aria-haspopup": "dialog",
-        "aria-expanded": context.open,
-        "aria-controls": context.contentId,
-        "data-state": getState(context.open),
-        ...triggerProps,
-        ref: composedTriggerRef,
-        onPress: (0, import_core.composeEventHandlers)(props.onPress, context.onOpenToggle)
-      }
-    );
-  }
-);
-DialogTrigger.displayName = TRIGGER_NAME;
-const PORTAL_NAME = "DialogPortal";
-const [PortalProvider, usePortalContext] = createDialogContext(
-  PORTAL_NAME,
-  {
-    forceMount: void 0
-  }
-);
-const DialogPortalFrame = (0, import_core.styled)(import_stacks.YStack, {
-  alignItems: "center",
-  justifyContent: "center",
-  fullscreen: true,
-  zIndex: 100,
-  ...import_core.isWeb && {
-    maxHeight: "100vh",
-    position: "fixed"
-  }
-});
-const DialogPortalItem = (props) => {
-  const themeName = (0, import_core.useThemeName)();
-  const context = useDialogContext(PORTAL_NAME, props.__scopeDialog);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.PortalItem, { hostName: props.hostName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPortalItemContent, { ...props, themeName, context }) });
-};
-function DialogPortalItemContent(props) {
-  const {
-    __scopeDialog,
-    children,
-    context,
-    themeName,
-    space,
-    spaceDirection,
-    separator
-  } = props;
-  let childrenSpaced = children;
-  if (space || separator) {
-    childrenSpaced = (0, import_core.spacedChildren)({
-      children,
-      separator,
-      space,
-      direction: spaceDirection
-    });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogProvider, { scope: __scopeDialog, ...context, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Theme, { name: themeName, children: childrenSpaced }) });
-}
-const DialogPortal = (props) => {
-  const { __scopeDialog, forceMount, children, ...frameProps } = props;
-  const context = useDialogContext(PORTAL_NAME, __scopeDialog);
-  const isShowing = forceMount || context.open;
-  const [isFullyHidden, setIsFullyHidden] = React.useState(!isShowing);
-  if (isShowing && isFullyHidden) {
-    setIsFullyHidden(false);
-  }
-  const contents = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_animate_presence.AnimatePresence,
-    {
-      onExitComplete: () => {
-        setIsFullyHidden(true);
-      },
-      children: isShowing ? children : null
-    }
-  );
-  const isSheet = useShowDialogSheet(context);
-  if (isSheet) {
-    return children;
-  }
-  if (context.modal) {
-    if (isFullyHidden) {
-      return null;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPortalItem, { __scopeDialog, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PortalProvider, { scope: __scopeDialog, forceMount, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPortalFrame, { pointerEvents: isShowing ? "auto" : "none", ...frameProps, children: contents }) }) });
-  }
-  return contents;
-};
-DialogPortal.displayName = PORTAL_NAME;
-const OVERLAY_NAME = "DialogOverlay";
-const DialogOverlayFrame = (0, import_core.styled)(import_sheet.SheetOverlayFrame, {
-  name: OVERLAY_NAME
-});
-const DialogOverlay = DialogOverlayFrame.extractable(
-  React.forwardRef(
-    ({ __scopeDialog, ...props }, forwardedRef) => {
-      const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog);
-      const { forceMount = portalContext.forceMount, ...overlayProps } = props;
-      const context = useDialogContext(OVERLAY_NAME, __scopeDialog);
-      const showSheet = useShowDialogSheet(context);
-      if (!forceMount) {
-        if (!context.modal || showSheet) {
-          return null;
-        }
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogOverlayImpl, { context, ...overlayProps, ref: forwardedRef });
-    }
-  )
-);
-DialogOverlay.displayName = OVERLAY_NAME;
-const DialogOverlayImpl = React.forwardRef(
-  (props, forwardedRef) => {
-    const { context, ...overlayProps } = props;
-    return (
-      // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
-      // ie. when `Overlay` and `Content` are siblings
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        DialogOverlayFrame,
-        {
-          "data-state": getState(context.open),
-          pointerEvents: context.open ? "auto" : "none",
-          ...overlayProps,
-          ref: forwardedRef
-        }
-      )
-    );
-  }
-);
-const CONTENT_NAME = "DialogContent";
-const DialogContentFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
-  name: CONTENT_NAME,
-  tag: "dialog",
-  position: "relative",
-  backgrounded: true,
-  padded: true,
-  radiused: true,
-  elevate: true,
-  variants: {
-    size: {
-      "...size": (val, extras) => {
-        return {};
-      }
-    }
-  },
-  defaultVariants: {
-    size: "$true"
-  }
-});
-const DialogContent = DialogContentFrame.extractable(
-  React.forwardRef(
-    ({ __scopeDialog, ...props }, forwardedRef) => {
-      const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog);
-      const { forceMount = portalContext.forceMount, ...contentProps } = props;
-      const context = useDialogContext(CONTENT_NAME, __scopeDialog);
-      const contents = context.modal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogContentModal, { context, ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogContentNonModal, { context, ...contentProps, ref: forwardedRef });
-      if (!import_core.isWeb) {
-        return contents;
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_remove_scroll.RemoveScroll,
-        {
-          forwardProps: true,
-          enabled: context.open,
-          allowPinchZoom: context.allowPinchZoom,
-          shards: [context.contentRef],
-          removeScrollBar: false,
-          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "_dsp_contents", children: contents })
-        }
-      );
-    }
-  )
-);
-DialogContent.displayName = CONTENT_NAME;
-const DialogContentModal = React.forwardRef(
-  ({ children, context, ...props }, forwardedRef) => {
-    const contentRef = React.useRef(null);
-    const composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, context.contentRef, contentRef);
-    if (import_core.isWeb) {
-      React.useEffect(() => {
-        if (!context.open)
-          return;
-        const content = contentRef.current;
-        if (content)
-          return (0, import_aria_hidden.hideOthers)(content);
-      }, [context.open]);
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      DialogContentImpl,
-      {
-        ...props,
-        context,
-        ref: composedRefs,
-        disableOutsidePointerEvents: true,
-        onCloseAutoFocus: (0, import_core.composeEventHandlers)(props.onCloseAutoFocus, (event) => {
-          var _a;
-          event.preventDefault();
-          (_a = context.triggerRef.current) == null ? void 0 : _a.focus();
-        }),
-        onPointerDownOutside: (0, import_core.composeEventHandlers)(
-          props.onPointerDownOutside,
-          (event) => {
-            const originalEvent = event["detail"].originalEvent;
-            const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
-            const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
-            if (isRightClick)
-              event.preventDefault();
-          }
-        ),
-        onFocusOutside: (0, import_core.composeEventHandlers)(
-          props.onFocusOutside,
-          (event) => event.preventDefault()
-        ),
-        children
-      }
-    );
-  }
-);
-const DialogContentNonModal = React.forwardRef(
-  (props, forwardedRef) => {
-    const hasInteractedOutsideRef = React.useRef(false);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      DialogContentImpl,
-      {
-        ...props,
-        ref: forwardedRef,
-        trapFocus: false,
-        disableOutsidePointerEvents: false,
-        onCloseAutoFocus: (event) => {
-          var _a, _b;
-          (_a = props.onCloseAutoFocus) == null ? void 0 : _a.call(props, event);
-          if (!event.defaultPrevented) {
-            if (!hasInteractedOutsideRef.current) {
-              (_b = props.context.triggerRef.current) == null ? void 0 : _b.focus();
-            }
-            event.preventDefault();
-          }
-          hasInteractedOutsideRef.current = false;
-        },
-        onInteractOutside: (event) => {
-          var _a;
-          (_a = props.onInteractOutside) == null ? void 0 : _a.call(props, event);
-          if (!event.defaultPrevented)
-            hasInteractedOutsideRef.current = true;
-          const target = event.target;
-          const trigger = props.context.triggerRef.current;
-          if (!(trigger instanceof HTMLElement))
-            return;
-          const targetIsTrigger = trigger.contains(target);
-          if (targetIsTrigger)
-            event.preventDefault();
-        }
-      }
-    );
-  }
-);
-const DialogContentImpl = React.forwardRef(
-  (props, forwardedRef) => {
-    const {
-      __scopeDialog,
-      trapFocus,
-      onOpenAutoFocus,
-      onCloseAutoFocus,
-      disableOutsidePointerEvents,
-      onEscapeKeyDown,
-      onPointerDownOutside,
-      onFocusOutside,
-      onInteractOutside,
-      context,
-      ...contentProps
-    } = props;
-    const contentRef = React.useRef(null);
-    const composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef);
-    const showSheet = useShowDialogSheet(context);
-    const contents = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      DialogContentFrame,
-      {
-        id: context.contentId,
-        "aria-describedby": context.descriptionId,
-        "aria-labelledby": context.titleId,
-        "data-state": getState(context.open),
-        ...contentProps
-      }
-    );
-    if (showSheet) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogPortalItem, { hostName: getSheetContentsName(context), children: contentProps.children });
-    }
-    if (!import_core.isWeb) {
-      return contents;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_focus_scope.FocusScope,
-        {
-          loop: true,
-          trapped: trapFocus,
-          onMountAutoFocus: onOpenAutoFocus,
-          forceUnmount: !context.open,
-          onUnmountAutoFocus: onCloseAutoFocus,
-          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_dismissable.Dismissable,
-            {
-              disableOutsidePointerEvents: context.open && disableOutsidePointerEvents,
-              forceUnmount: !context.open,
-              onEscapeKeyDown,
-              onPointerDownOutside,
-              onFocusOutside,
-              onInteractOutside,
-              ref: composedRefs,
-              onDismiss: () => context.onOpenChange(false),
-              children: contents
-            }
-          )
-        }
-      ),
-      process.env.NODE_ENV === "development" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TitleWarning, { titleId: context.titleId }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          DescriptionWarning,
-          {
-            contentRef,
-            descriptionId: context.descriptionId
-          }
-        )
-      ] })
-    ] });
-  }
-);
-const TITLE_NAME = "DialogTitle";
-const DialogTitleFrame = (0, import_core.styled)(import_text.H2, {
-  name: TITLE_NAME
-});
-const DialogTitle = React.forwardRef(
-  (props, forwardedRef) => {
-    const { __scopeDialog, ...titleProps } = props;
-    const context = useDialogContext(TITLE_NAME, __scopeDialog);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogTitleFrame, { id: context.titleId, ...titleProps, ref: forwardedRef });
-  }
-);
-DialogTitle.displayName = TITLE_NAME;
-const DialogDescriptionFrame = (0, import_core.styled)(import_text.Paragraph, {
-  name: "DialogDescription"
-});
-const DESCRIPTION_NAME = "DialogDescription";
-const DialogDescription = React.forwardRef(
-  (props, forwardedRef) => {
-    const { __scopeDialog, ...descriptionProps } = props;
-    const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      DialogDescriptionFrame,
-      {
-        id: context.descriptionId,
-        ...descriptionProps,
-        ref: forwardedRef
-      }
-    );
-  }
-);
-DialogDescription.displayName = DESCRIPTION_NAME;
-const CLOSE_NAME = "DialogClose";
-const DialogClose = React.forwardRef(
-  (props, forwardedRef) => {
-    const { __scopeDialog, displayWhenAdapted, ...closeProps } = props;
-    const context = useDialogContext(CLOSE_NAME, __scopeDialog, {
-      warn: false,
-      fallback: {}
-    });
-    const isSheet = useShowDialogSheet(context);
-    if (isSheet && !displayWhenAdapted) {
-      return null;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_stacks.YStack,
-      {
-        tag: "button",
-        accessibilityLabel: "Dialog Close",
-        ...closeProps,
-        ref: forwardedRef,
-        onPress: (0, import_core.composeEventHandlers)(
-          props.onPress,
-          () => context.onOpenChange(false)
-        )
-      }
-    );
-  }
-);
-DialogClose.displayName = CLOSE_NAME;
-function getState(open) {
-  return open ? "open" : "closed";
-}
-const TITLE_WARNING_NAME = "DialogTitleWarning";
-const [DialogWarningProvider, useWarningContext] = (0, import_create_context.createContext)(TITLE_WARNING_NAME, {
-  contentName: CONTENT_NAME,
-  titleName: TITLE_NAME,
-  docsSlug: "dialog"
-});
-const TitleWarning = ({ titleId }) => {
-  if (process.env.NODE_ENV === "development") {
-    const titleWarningContext = useWarningContext(TITLE_WARNING_NAME);
-    const MESSAGE = `\`${titleWarningContext.contentName}\` requires a \`${titleWarningContext.titleName}\` for the component to be accessible for screen reader users.
+"use strict";var Ee=Object.create;var R=Object.defineProperty;var Oe=Object.getOwnPropertyDescriptor;var ve=Object.getOwnPropertyNames;var Ne=Object.getPrototypeOf,Re=Object.prototype.hasOwnProperty;var xe=(e,o)=>{for(var t in o)R(e,t,{get:o[t],enumerable:!0})},K=(e,o,t,n)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of ve(o))!Re.call(e,r)&&r!==t&&R(e,r,{get:()=>o[r],enumerable:!(n=Oe(o,r))||n.enumerable});return e};var Ie=(e,o,t)=>(t=e!=null?Ee(Ne(e)):{},K(o||!e||!e.__esModule?R(t,"default",{value:e,enumerable:!0}):t,e)),be=e=>K(R({},"__esModule",{value:!0}),e);var Ze={};xe(Ze,{Dialog:()=>fe,DialogClose:()=>V,DialogContent:()=>M,DialogDescription:()=>W,DialogOverlay:()=>_,DialogOverlayFrame:()=>$,DialogPortal:()=>w,DialogPortalFrame:()=>de,DialogSheetContents:()=>De,DialogTitle:()=>k,DialogTrigger:()=>A,DialogWarningProvider:()=>me,createDialogScope:()=>ge});module.exports=be(Ze);var a=require("react/jsx-runtime"),H=require("@tamagui/adapt"),se=require("@tamagui/animate-presence"),ie=require("@tamagui/aria-hidden"),F=require("@tamagui/compose-refs"),s=require("@tamagui/core"),L=require("@tamagui/create-context"),le=require("@tamagui/dismissable"),ce=require("@tamagui/focus-scope"),S=require("@tamagui/portal"),pe=require("@tamagui/remove-scroll"),P=require("@tamagui/sheet"),D=require("@tamagui/stacks"),G=require("@tamagui/text"),ue=require("@tamagui/use-controllable-state"),p=Ie(require("react"));const j="Dialog",[z,ge]=(0,L.createContextScope)(j),[U,d]=z(j),Y="DialogTrigger",Fe=(0,s.styled)(D.YStack,{name:Y}),A=p.forwardRef((e,o)=>{const{__scopeDialog:t,...n}=e,r=d(Y,t),l=(0,F.useComposedRefs)(o,r.triggerRef);return(0,a.jsx)(Fe,{tag:"button","aria-haspopup":"dialog","aria-expanded":r.open,"aria-controls":r.contentId,"data-state":Z(r.open),...n,ref:l,onPress:(0,s.composeEventHandlers)(e.onPress,r.onOpenToggle)})});A.displayName=Y;const x="DialogPortal",[Ae,q]=z(x,{forceMount:void 0}),de=(0,s.styled)(D.YStack,{alignItems:"center",justifyContent:"center",fullscreen:!0,zIndex:100,...s.isWeb&&{maxHeight:"100vh",position:"fixed"}}),J=e=>{const o=(0,s.useThemeName)(),t=d(x,e.__scopeDialog);return(0,a.jsx)(S.PortalItem,{hostName:e.hostName,children:(0,a.jsx)(we,{...e,themeName:o,context:t})})};function we(e){const{__scopeDialog:o,children:t,context:n,themeName:r,space:l,spaceDirection:i,separator:c}=e;let g=t;return(l||c)&&(g=(0,s.spacedChildren)({children:t,separator:c,space:l,direction:i})),(0,a.jsx)(U,{scope:o,...n,children:(0,a.jsx)(s.Theme,{name:r,children:g})})}const w=e=>{const{__scopeDialog:o,forceMount:t,children:n,...r}=e,l=d(x,o),i=t||l.open,[c,g]=p.useState(!i);i&&c&&g(!1);const m=(0,a.jsx)(se.AnimatePresence,{onExitComplete:()=>{g(!0)},children:i?n:null});return h(l)?n:l.modal?c?null:(0,a.jsx)(J,{__scopeDialog:o,children:(0,a.jsx)(Ae,{scope:o,forceMount:t,children:(0,a.jsx)(de,{pointerEvents:i?"auto":"none",...r,children:m})})}):m};w.displayName=x;const I="DialogOverlay",$=(0,s.styled)(P.SheetOverlayFrame,{name:I}),_=$.extractable(p.forwardRef(({__scopeDialog:e,...o},t)=>{const n=q(I,e),{forceMount:r=n.forceMount,...l}=o,i=d(I,e),c=h(i);return!r&&(!i.modal||c)?null:(0,a.jsx)(_e,{context:i,...l,ref:t})}));_.displayName=I;const _e=p.forwardRef((e,o)=>{const{context:t,...n}=e;return(0,a.jsx)($,{"data-state":Z(t.open),pointerEvents:t.open?"auto":"none",...n,ref:o})}),C="DialogContent",Q=(0,s.styled)(D.ThemeableStack,{name:C,tag:"dialog",position:"relative",backgrounded:!0,padded:!0,radiused:!0,elevate:!0,variants:{size:{"...size":(e,o)=>({})}},defaultVariants:{size:"$true"}}),M=Q.extractable(p.forwardRef(({__scopeDialog:e,...o},t)=>{const n=q(C,e),{forceMount:r=n.forceMount,...l}=o,i=d(C,e),c=i.modal?(0,a.jsx)(Me,{context:i,...l,ref:t}):(0,a.jsx)(ke,{context:i,...l,ref:t});return s.isWeb?(0,a.jsx)(pe.RemoveScroll,{forwardProps:!0,enabled:i.open,allowPinchZoom:i.allowPinchZoom,shards:[i.contentRef],removeScrollBar:!1,children:(0,a.jsx)("div",{className:"_dsp_contents",children:c})}):c}));M.displayName=C;const Me=p.forwardRef(({children:e,context:o,...t},n)=>{const r=p.useRef(null),l=(0,F.useComposedRefs)(n,o.contentRef,r);return s.isWeb&&p.useEffect(()=>{if(!o.open)return;const i=r.current;if(i)return(0,ie.hideOthers)(i)},[o.open]),(0,a.jsx)(X,{...t,context:o,ref:l,disableOutsidePointerEvents:!0,onCloseAutoFocus:(0,s.composeEventHandlers)(t.onCloseAutoFocus,i=>{var c;i.preventDefault(),(c=o.triggerRef.current)==null||c.focus()}),onPointerDownOutside:(0,s.composeEventHandlers)(t.onPointerDownOutside,i=>{const c=i.detail.originalEvent,g=c.button===0&&c.ctrlKey===!0;(c.button===2||g)&&i.preventDefault()}),onFocusOutside:(0,s.composeEventHandlers)(t.onFocusOutside,i=>i.preventDefault()),children:e})}),ke=p.forwardRef((e,o)=>{const t=p.useRef(!1);return(0,a.jsx)(X,{...e,ref:o,trapFocus:!1,disableOutsidePointerEvents:!1,onCloseAutoFocus:n=>{var r,l;(r=e.onCloseAutoFocus)==null||r.call(e,n),n.defaultPrevented||(t.current||(l=e.context.triggerRef.current)==null||l.focus(),n.preventDefault()),t.current=!1},onInteractOutside:n=>{var c;(c=e.onInteractOutside)==null||c.call(e,n),n.defaultPrevented||(t.current=!0);const r=n.target,l=e.context.triggerRef.current;if(!(l instanceof HTMLElement))return;l.contains(r)&&n.preventDefault()}})}),X=p.forwardRef((e,o)=>{const{__scopeDialog:t,trapFocus:n,onOpenAutoFocus:r,onCloseAutoFocus:l,disableOutsidePointerEvents:i,onEscapeKeyDown:c,onPointerDownOutside:g,onFocusOutside:m,onInteractOutside:y,context:u,...T}=e,E=p.useRef(null),O=(0,F.useComposedRefs)(o,E),v=h(u),N=(0,a.jsx)(Q,{id:u.contentId,"aria-describedby":u.descriptionId,"aria-labelledby":u.titleId,"data-state":Z(u.open),...T});return v?(0,a.jsx)(J,{hostName:re(u),children:T.children}):s.isWeb?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(ce.FocusScope,{loop:!0,trapped:n,onMountAutoFocus:r,forceUnmount:!u.open,onUnmountAutoFocus:l,children:(0,a.jsx)(le.Dismissable,{disableOutsidePointerEvents:u.open&&i,forceUnmount:!u.open,onEscapeKeyDown:c,onPointerDownOutside:g,onFocusOutside:m,onInteractOutside:y,ref:O,onDismiss:()=>u.onOpenChange(!1),children:N})}),process.env.NODE_ENV==="development"&&(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(He,{titleId:u.titleId}),(0,a.jsx)(Ge,{contentRef:E,descriptionId:u.descriptionId})]})]}):N}),b="DialogTitle",We=(0,s.styled)(G.H2,{name:b}),k=p.forwardRef((e,o)=>{const{__scopeDialog:t,...n}=e,r=d(b,t);return(0,a.jsx)(We,{id:r.titleId,...n,ref:o})});k.displayName=b;const Ve=(0,s.styled)(G.Paragraph,{name:"DialogDescription"}),ee="DialogDescription",W=p.forwardRef((e,o)=>{const{__scopeDialog:t,...n}=e,r=d(ee,t);return(0,a.jsx)(Ve,{id:r.descriptionId,...n,ref:o})});W.displayName=ee;const oe="DialogClose",V=p.forwardRef((e,o)=>{const{__scopeDialog:t,displayWhenAdapted:n,...r}=e,l=d(oe,t,{warn:!1,fallback:{}});return h(l)&&!n?null:(0,a.jsx)(D.YStack,{tag:"button",accessibilityLabel:"Dialog Close",...r,ref:o,onPress:(0,s.composeEventHandlers)(e.onPress,()=>l.onOpenChange(!1))})});V.displayName=oe;function Z(e){return e?"open":"closed"}const te="DialogTitleWarning",[me,ne]=(0,L.createContext)(te,{contentName:C,titleName:b,docsSlug:"dialog"}),He=({titleId:e})=>{if(process.env.NODE_ENV==="development"){const o=ne(te),t=`\`${o.contentName}\` requires a \`${o.titleName}\` for the component to be accessible for screen reader users.
 
-If you want to hide the \`${titleWarningContext.titleName}\`, you can wrap it with our VisuallyHidden component.
+If you want to hide the \`${o.titleName}\`, you can wrap it with our VisuallyHidden component.
 
-For more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`;
-    React.useEffect(() => {
-      if (!import_core.isWeb)
-        return;
-      if (titleId) {
-        const hasTitle = document.getElementById(titleId);
-        if (!hasTitle) {
-          console.warn(MESSAGE);
-        }
-      }
-    }, [MESSAGE, titleId]);
-  }
-  return null;
-};
-const DESCRIPTION_WARNING_NAME = "DialogDescriptionWarning";
-const DescriptionWarning = ({
-  contentRef,
-  descriptionId
-}) => {
-  if (process.env.NODE_ENV === "development") {
-    const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME);
-    const MESSAGE = `Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${descriptionWarningContext.contentName}}.`;
-    React.useEffect(() => {
-      if (!import_core.isWeb)
-        return;
-      const contentNode = contentRef.current;
-      if (!(contentNode instanceof HTMLElement)) {
-        return;
-      }
-      const describedById = contentNode.getAttribute("aria-describedby");
-      if (descriptionId && describedById) {
-        const hasDescription = document.getElementById(descriptionId);
-        if (!hasDescription) {
-          console.warn(MESSAGE);
-        }
-      }
-    }, [MESSAGE, contentRef, descriptionId]);
-  }
-  return null;
-};
-const Dialog = (0, import_core.withStaticProperties)(
-  React.forwardRef(function Dialog2(props, ref) {
-    const {
-      __scopeDialog,
-      children,
-      open: openProp,
-      defaultOpen = false,
-      onOpenChange,
-      modal = true,
-      allowPinchZoom = false
-    } = props;
-    const scopeId = (0, import_core.useId)();
-    const contentId = (0, import_core.useId)();
-    const titleId = (0, import_core.useId)();
-    const descriptionId = (0, import_core.useId)();
-    const scopeKey = __scopeDialog ? Object.keys(__scopeDialog)[0] : scopeId;
-    const sheetContentsName = getSheetContentsName({ scopeKey, contentId });
-    const triggerRef = React.useRef(null);
-    const contentRef = React.useRef(null);
-    const [open, setOpen] = (0, import_use_controllable_state.useControllableState)({
-      prop: openProp,
-      defaultProp: defaultOpen,
-      onChange: onOpenChange
-    });
-    const onOpenToggle = React.useCallback(() => {
-      setOpen((prevOpen) => !prevOpen);
-    }, [setOpen]);
-    const context = {
-      scope: __scopeDialog,
-      scopeKey,
-      triggerRef,
-      contentRef,
-      contentId,
-      titleId,
-      descriptionId,
-      open,
-      onOpenChange: setOpen,
-      onOpenToggle,
-      modal,
-      allowPinchZoom
-    };
-    const { when, AdaptProvider } = (0, import_adapt.useAdaptParent)({
-      Contents: React.useCallback(
-        (props2) => {
-          return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.PortalHost, { forwardProps: props2, name: sheetContentsName });
-        },
-        [sheetContentsName]
-      )
-    });
-    React.useImperativeHandle(
-      ref,
-      () => ({
-        open: setOpen
-      }),
-      [setOpen]
-    );
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AdaptProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogProvider, { ...context, sheetBreakpoint: when, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DialogSheetController, { onOpenChange: setOpen, __scopeDialog, children }) }) });
-  }),
-  {
-    Trigger: DialogTrigger,
-    Portal: DialogPortal,
-    Overlay: DialogOverlay,
-    Content: DialogContent,
-    Title: DialogTitle,
-    Description: DialogDescription,
-    Close: DialogClose,
-    Sheet: import_sheet.ControlledSheet,
-    Adapt: import_adapt.Adapt
-  }
-);
-const SHEET_CONTENTS_NAME = "DialogSheetContents";
-const DialogSheetContents = ({
-  name,
-  ...props
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_portal.PortalHost, { forwardProps: props, name });
-};
-DialogSheetContents.displayName = SHEET_CONTENTS_NAME;
-const getSheetContentsName = ({
-  scopeKey,
-  contentId
-}) => `${scopeKey || contentId}SheetContents`;
-const DialogSheetController = (props) => {
-  const context = useDialogContext("DialogSheetController", props.__scopeDialog);
-  const showSheet = useShowDialogSheet(context);
-  const breakpointActive = useSheetBreakpointActive(context);
-  const getShowSheet = (0, import_core.useGet)(showSheet);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_sheet.SheetController,
-    {
-      onOpenChange: (val) => {
-        if (getShowSheet()) {
-          props.onOpenChange(val);
-        }
-      },
-      open: context.open,
-      hidden: breakpointActive === false,
-      children: props.children
-    }
-  );
-};
-const useSheetBreakpointActive = (context) => {
-  const media = (0, import_core.useMedia)();
-  if (!context.sheetBreakpoint)
-    return false;
-  if (context.sheetBreakpoint === true)
-    return true;
-  return media[context.sheetBreakpoint];
-};
-const useShowDialogSheet = (context) => {
-  const breakpointActive = useSheetBreakpointActive(context);
-  return context.open === false ? false : breakpointActive;
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogOverlay,
-  DialogOverlayFrame,
-  DialogPortal,
-  DialogPortalFrame,
-  DialogSheetContents,
-  DialogTitle,
-  DialogTrigger,
-  DialogWarningProvider,
-  createDialogScope
-});
+For more information, see https://radix-ui.com/primitives/docs/components/${o.docsSlug}`;p.useEffect(()=>{s.isWeb&&e&&(document.getElementById(e)||console.warn(t))},[t,e])}return null},Le="DialogDescriptionWarning",Ge=({contentRef:e,descriptionId:o})=>{if(process.env.NODE_ENV==="development"){const n=`Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${ne(Le).contentName}}.`;p.useEffect(()=>{if(!s.isWeb)return;const r=e.current;if(!(r instanceof HTMLElement))return;const l=r.getAttribute("aria-describedby");o&&l&&(document.getElementById(o)||console.warn(n))},[n,e,o])}return null},fe=(0,s.withStaticProperties)(p.forwardRef(function(o,t){const{__scopeDialog:n,children:r,open:l,defaultOpen:i=!1,onOpenChange:c,modal:g=!0,allowPinchZoom:m=!1}=o,y=(0,s.useId)(),u=(0,s.useId)(),T=(0,s.useId)(),E=(0,s.useId)(),O=n?Object.keys(n)[0]:y,v=re({scopeKey:O,contentId:u}),N=p.useRef(null),Pe=p.useRef(null),[Ce,f]=(0,ue.useControllableState)({prop:l,defaultProp:i,onChange:c}),he=p.useCallback(()=>{f(B=>!B)},[f]),Se={scope:n,scopeKey:O,triggerRef:N,contentRef:Pe,contentId:u,titleId:T,descriptionId:E,open:Ce,onOpenChange:f,onOpenToggle:he,modal:g,allowPinchZoom:m},{when:ye,AdaptProvider:Te}=(0,H.useAdaptParent)({Contents:p.useCallback(B=>(0,a.jsx)(S.PortalHost,{forwardProps:B,name:v}),[v])});return p.useImperativeHandle(t,()=>({open:f}),[f]),(0,a.jsx)(Te,{children:(0,a.jsx)(U,{...Se,sheetBreakpoint:ye,children:(0,a.jsx)(Ye,{onOpenChange:f,__scopeDialog:n,children:r})})})}),{Trigger:A,Portal:w,Overlay:_,Content:M,Title:k,Description:W,Close:V,Sheet:P.ControlledSheet,Adapt:H.Adapt}),Be="DialogSheetContents",De=({name:e,...o})=>(0,a.jsx)(S.PortalHost,{forwardProps:o,name:e});De.displayName=Be;const re=({scopeKey:e,contentId:o})=>`${e||o}SheetContents`,Ye=e=>{const o=d("DialogSheetController",e.__scopeDialog),t=h(o),n=ae(o),r=(0,s.useGet)(t);return(0,a.jsx)(P.SheetController,{onOpenChange:l=>{r()&&e.onOpenChange(l)},open:o.open,hidden:n===!1,children:e.children})},ae=e=>{const o=(0,s.useMedia)();return e.sheetBreakpoint?e.sheetBreakpoint===!0?!0:o[e.sheetBreakpoint]:!1},h=e=>{const o=ae(e);return e.open===!1?!1:o};0&&(module.exports={Dialog,DialogClose,DialogContent,DialogDescription,DialogOverlay,DialogOverlayFrame,DialogPortal,DialogPortalFrame,DialogSheetContents,DialogTitle,DialogTrigger,DialogWarningProvider,createDialogScope});
 //# sourceMappingURL=Dialog.js.map