@loke/ui/dist/components/dialog/index.js

var __create=Object.create;var{getPrototypeOf:__getProtoOf,defineProperty:__defProp,getOwnPropertyNames:__getOwnPropNames,getOwnPropertyDescriptor:__getOwnPropDesc}=Object,__hasOwnProp=Object.prototype.hasOwnProperty;function __accessProp(key){return this[key]}var __toESMCache_node,__toESMCache_esm,__toESM=(mod,isNodeMode,target)=>{var canCache=mod!=null&&typeof mod==="object";if(canCache){var cache=isNodeMode?__toESMCache_node??=new WeakMap:__toESMCache_esm??=new WeakMap,cached=cache.get(mod);if(cached)return cached}target=mod!=null?__create(__getProtoOf(mod)):{};let to=isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target;for(let key of __getOwnPropNames(mod))if(!__hasOwnProp.call(to,key))__defProp(to,key,{get:__accessProp.bind(mod,key),enumerable:!0});if(canCache)cache.set(mod,to);return to},__toCommonJS=(from)=>{var entry=(__moduleCache??=new WeakMap).get(from),desc;if(entry)return entry;if(entry=__defProp({},"__esModule",{value:!0}),from&&typeof from==="object"||typeof from==="function"){for(var key of __getOwnPropNames(from))if(!__hasOwnProp.call(entry,key))__defProp(entry,key,{get:__accessProp.bind(from,key),enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable})}return __moduleCache.set(from,entry),entry},__moduleCache;var __returnValue=(v)=>v;function __exportSetter(name,newValue){this[name]=__returnValue.bind(null,newValue)}var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0,configurable:!0,set:__exportSetter.bind(all,name)})};var exports_dialog={};__export(exports_dialog,{createDialogScope:()=>createDialogScope,WarningProvider:()=>WarningProvider,Trigger:()=>Trigger,Title:()=>Title,Root:()=>Root,Portal:()=>Portal,Overlay:()=>Overlay,DialogTrigger:()=>DialogTrigger,DialogTitle:()=>DialogTitle,DialogPortal:()=>DialogPortal,DialogOverlay:()=>DialogOverlay,DialogDescription:()=>DialogDescription,DialogContent:()=>DialogContent,DialogClose:()=>DialogClose,Dialog:()=>Dialog,Description:()=>Description,Content:()=>Content,Close:()=>Close});module.exports=__toCommonJS(exports_dialog);var import_compose_events=require("@loke/ui/compose-events"),import_compose_refs=require("@loke/ui/compose-refs"),import_context=require("@loke/ui/context"),import_dismissable_layer=require("@loke/ui/dismissable-layer"),import_focus_guards=require("@loke/ui/focus-guards"),import_focus_scope=require("@loke/ui/focus-scope"),import_portal=require("@loke/ui/portal"),import_presence=require("@loke/ui/presence"),import_primitive=require("@loke/ui/primitive"),import_slot=require("@loke/ui/slot"),import_use_controllable_state=require("@loke/ui/use-controllable-state"),import_use_id=require("@loke/ui/use-id"),import_aria_hidden=require("aria-hidden"),import_react=require("react"),import_react_remove_scroll=require("react-remove-scroll"),jsx_runtime=require("react/jsx-runtime"),DIALOG_NAME="Dialog",[createDialogContext,createDialogScope]=import_context.createContextScope(DIALOG_NAME),[DialogProvider,useDialogContext]=createDialogContext(DIALOG_NAME),Dialog=(props)=>{let{__scopeDialog,children,open:openProp,defaultOpen,onOpenChange,modal=!0}=props,triggerRef=import_react.useRef(null),contentRef=import_react.useRef(null),[open,setOpen]=import_use_controllable_state.useControllableState({caller:DIALOG_NAME,defaultProp:defaultOpen??!1,onChange:onOpenChange,prop:openProp});return jsx_runtime.jsx(DialogProvider,{contentId:import_use_id.useId(),contentRef,descriptionId:import_use_id.useId(),modal,onOpenChange:setOpen,onOpenToggle:import_react.useCallback(()=>setOpen((prevOpen)=>!prevOpen),[setOpen]),open,scope:__scopeDialog,titleId:import_use_id.useId(),triggerRef,children})};Dialog.displayName=DIALOG_NAME;var TRIGGER_NAME="DialogTrigger",DialogTrigger=import_react.forwardRef((props,forwardedRef)=>{let{__scopeDialog,...triggerProps}=props,context=useDialogContext(TRIGGER_NAME,__scopeDialog),composedTriggerRef=import_compose_refs.useComposedRefs(forwardedRef,context.triggerRef);return jsx_runtime.jsx(import_primitive.Primitive.button,{"aria-controls":context.contentId,"aria-expanded":context.open,"aria-haspopup":"dialog","data-state":getState(context.open),type:"button",...triggerProps,onClick:import_compose_events.composeEventHandlers(props.onClick,context.onOpenToggle),ref:composedTriggerRef})});DialogTrigger.displayName=TRIGGER_NAME;var PORTAL_NAME="DialogPortal",[PortalProvider,usePortalContext]=createDialogContext(PORTAL_NAME,{forceMount:void 0}),DialogPortal=(props)=>{let{__scopeDialog,forceMount,children,container}=props,context=useDialogContext(PORTAL_NAME,__scopeDialog);return jsx_runtime.jsx(PortalProvider,{forceMount,scope:__scopeDialog,children:import_react.Children.map(children,(child)=>jsx_runtime.jsx(import_presence.Presence,{present:forceMount||context.open,children:jsx_runtime.jsx(import_portal.Portal,{asChild:!0,container,children:child})}))})};DialogPortal.displayName=PORTAL_NAME;var OVERLAY_NAME="DialogOverlay",DialogOverlay=import_react.forwardRef((props,forwardedRef)=>{let portalContext=usePortalContext(OVERLAY_NAME,props.__scopeDialog),{forceMount=portalContext.forceMount,...overlayProps}=props,context=useDialogContext(OVERLAY_NAME,props.__scopeDialog);return context.modal?jsx_runtime.jsx(import_presence.Presence,{present:forceMount||context.open,children:jsx_runtime.jsx(DialogOverlayImpl,{...overlayProps,ref:forwardedRef})}):null});DialogOverlay.displayName=OVERLAY_NAME;var Slot=import_slot.createSlot("DialogOverlay.RemoveScroll"),DialogOverlayImpl=import_react.forwardRef((props,forwardedRef)=>{let{__scopeDialog,...overlayProps}=props,context=useDialogContext(OVERLAY_NAME,__scopeDialog);return jsx_runtime.jsx(import_react_remove_scroll.RemoveScroll,{allowPinchZoom:!0,as:Slot,shards:[context.contentRef],children:jsx_runtime.jsx(import_primitive.Primitive.div,{"data-state":getState(context.open),...overlayProps,ref:forwardedRef,style:{pointerEvents:"auto",...overlayProps.style}})})}),CONTENT_NAME="DialogContent",DialogContent=import_react.forwardRef((props,forwardedRef)=>{let portalContext=usePortalContext(CONTENT_NAME,props.__scopeDialog),{forceMount=portalContext.forceMount,...contentProps}=props,context=useDialogContext(CONTENT_NAME,props.__scopeDialog);return jsx_runtime.jsx(import_presence.Presence,{present:forceMount||context.open,children:context.modal?jsx_runtime.jsx(DialogContentModal,{...contentProps,ref:forwardedRef}):jsx_runtime.jsx(DialogContentNonModal,{...contentProps,ref:forwardedRef})})});DialogContent.displayName=CONTENT_NAME;var DialogContentModal=import_react.forwardRef((props,forwardedRef)=>{let context=useDialogContext(CONTENT_NAME,props.__scopeDialog),contentRef=import_react.useRef(null),composedRefs=import_compose_refs.useComposedRefs(forwardedRef,context.contentRef,contentRef);return import_react.useEffect(()=>{let content=contentRef.current;if(content)return import_aria_hidden.hideOthers(content)},[]),jsx_runtime.jsx(DialogContentImpl,{...props,disableOutsidePointerEvents:!0,onCloseAutoFocus:import_compose_events.composeEventHandlers(props.onCloseAutoFocus,(event)=>{event.preventDefault(),context.triggerRef.current?.focus()}),onFocusOutside:import_compose_events.composeEventHandlers(props.onFocusOutside,(event)=>event.preventDefault()),onPointerDownOutside:import_compose_events.composeEventHandlers(props.onPointerDownOutside,(event)=>{let{originalEvent}=event.detail,ctrlLeftClick=originalEvent.button===0&&originalEvent.ctrlKey===!0;if(originalEvent.button===2||ctrlLeftClick)event.preventDefault()}),ref:composedRefs,trapFocus:context.open})}),DialogContentNonModal=import_react.forwardRef((props,forwardedRef)=>{let context=useDialogContext(CONTENT_NAME,props.__scopeDialog),hasInteractedOutsideRef=import_react.useRef(!1),hasPointerDownOutsideRef=import_react.useRef(!1);return jsx_runtime.jsx(DialogContentImpl,{...props,disableOutsidePointerEvents:!1,onCloseAutoFocus:(event)=>{if(props.onCloseAutoFocus?.(event),!event.defaultPrevented){if(!hasInteractedOutsideRef.current)context.triggerRef.current?.focus();event.preventDefault()}hasInteractedOutsideRef.current=!1,hasPointerDownOutsideRef.current=!1},onInteractOutside:(event)=>{if(props.onInteractOutside?.(event),!event.defaultPrevented){if(hasInteractedOutsideRef.current=!0,event.detail.originalEvent.type==="pointerdown")hasPointerDownOutsideRef.current=!0}let target=event.target;if(context.triggerRef.current?.contains(target))event.preventDefault();if(event.detail.originalEvent.type==="focusin"&&hasPointerDownOutsideRef.current)event.preventDefault()},ref:forwardedRef,trapFocus:!1})}),DialogContentImpl=import_react.forwardRef((props,forwardedRef)=>{let{__scopeDialog,trapFocus,onOpenAutoFocus,onCloseAutoFocus,...contentProps}=props,context=useDialogContext(CONTENT_NAME,__scopeDialog),contentRef=import_react.useRef(null),composedRefs=import_compose_refs.useComposedRefs(forwardedRef,contentRef);return import_focus_guards.useFocusGuards(),jsx_runtime.jsxs(jsx_runtime.Fragment,{children:[jsx_runtime.jsx(import_focus_scope.FocusScope,{asChild:!0,loop:!0,onMountAutoFocus:onOpenAutoFocus,onUnmountAutoFocus:onCloseAutoFocus,trapped:trapFocus,children:jsx_runtime.jsx(import_dismissable_layer.DismissableLayer,{"aria-describedby":context.descriptionId,"aria-labelledby":context.titleId,"data-state":getState(context.open),id:context.contentId,role:"dialog",...contentProps,onDismiss:()=>context.onOpenChange(!1),ref:composedRefs})}),process.env.NODE_ENV!=="production"&&jsx_runtime.jsxs(jsx_runtime.Fragment,{children:[jsx_runtime.jsx(TitleWarning,{titleId:context.titleId}),jsx_runtime.jsx(DescriptionWarning,{contentRef,descriptionId:context.descriptionId})]})]})}),TITLE_NAME="DialogTitle",DialogTitle=import_react.forwardRef((props,forwardedRef)=>{let{__scopeDialog,...titleProps}=props,context=useDialogContext(TITLE_NAME,__scopeDialog);return jsx_runtime.jsx(import_primitive.Primitive.h2,{id:context.titleId,...titleProps,ref:forwardedRef})});DialogTitle.displayName=TITLE_NAME;var DESCRIPTION_NAME="DialogDescription",DialogDescription=import_react.forwardRef((props,forwardedRef)=>{let{__scopeDialog,...descriptionProps}=props,context=useDialogContext(DESCRIPTION_NAME,__scopeDialog);return jsx_runtime.jsx(import_primitive.Primitive.p,{id:context.descriptionId,...descriptionProps,ref:forwardedRef})});DialogDescription.displayName=DESCRIPTION_NAME;var CLOSE_NAME="DialogClose",DialogClose=import_react.forwardRef((props,forwardedRef)=>{let{__scopeDialog,...closeProps}=props,context=useDialogContext(CLOSE_NAME,__scopeDialog);return jsx_runtime.jsx(import_primitive.Primitive.button,{type:"button",...closeProps,onClick:import_compose_events.composeEventHandlers(props.onClick,()=>context.onOpenChange(!1)),ref:forwardedRef})});DialogClose.displayName=CLOSE_NAME;function getState(open){return open?"open":"closed"}var TITLE_WARNING_NAME="DialogTitleWarning",[WarningProvider,useWarningContext]=import_context.createContext(TITLE_WARNING_NAME,{contentName:CONTENT_NAME,docsSlug:"dialog",titleName:TITLE_NAME}),TitleWarning=({titleId})=>{let titleWarningContext=useWarningContext(TITLE_WARNING_NAME),MESSAGE=`\`${titleWarningContext.contentName}\` requires a \`${titleWarningContext.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.

For more information, see https://loke-ds-url.com/components/${titleWarningContext.docsSlug}`;return import_react.useEffect(()=>{if(titleId){if(!document.getElementById(titleId))console.error(MESSAGE)}},[MESSAGE,titleId]),null},DESCRIPTION_WARNING_NAME="DialogDescriptionWarning",DescriptionWarning=({contentRef,descriptionId})=>{let MESSAGE=`Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${useWarningContext(DESCRIPTION_WARNING_NAME).contentName}}.`;return import_react.useEffect(()=>{let describedById=contentRef.current?.getAttribute("aria-describedby");if(descriptionId&&describedById){if(!document.getElementById(descriptionId))console.warn(MESSAGE)}},[MESSAGE,contentRef,descriptionId]),null},Root=Dialog,Trigger=DialogTrigger,Portal=DialogPortal,Overlay=DialogOverlay,Content=DialogContent,Title=DialogTitle,Description=DialogDescription,Close=DialogClose;