@tamagui/dialog 1.0.1-beta.138 → 1.0.1-beta.141

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
File without changes
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Dialog.tsx"],
4
- "sourcesContent": ["import { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n GetProps,\n MediaPropKeys,\n Slot,\n TamaguiElement,\n Theme,\n composeEventHandlers,\n isWeb,\n styled,\n useGet,\n useId,\n useMedia,\n useThemeName,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContext, createContextScope } from '@tamagui/create-context'\nimport { Dismissable, DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport { PortalHost, PortalItem, PortalItemProps } from '@tamagui/portal'\nimport { RemoveScroll } from '@tamagui/remove-scroll'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { H2, Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nconst DIALOG_NAME = 'Dialog'\n\ntype ScopedProps<P> = P & { __scopeDialog?: Scope }\n\nconst [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)\n\ntype RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>\n\ninterface DialogProps {\n sheetBreakpoint?: MediaPropKeys | false\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?(open: boolean): void\n modal?: boolean\n\n /**\n * @see https://github.com/theKashey/react-remove-scroll#usage\n */\n allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\ntype NonNull<A> = Exclude<A, void | null>\n\ntype DialogContextValue = {\n triggerRef: React.RefObject<TamaguiElement>\n contentRef: React.RefObject<TamaguiElement>\n contentId: string\n titleId: string\n descriptionId: string\n onOpenToggle(): void\n open: NonNull<DialogProps['open']>\n onOpenChange: NonNull<DialogProps['onOpenChange']>\n modal: NonNull<DialogProps['modal']>\n allowPinchZoom: NonNull<DialogProps['allowPinchZoom']>\n sheetBreakpoint: NonNull<DialogProps['sheetBreakpoint']>\n scopeKey: string\n}\n\nconst [DialogProvider, useDialogContext] = createDialogContext<DialogContextValue>(DIALOG_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'DialogTrigger'\n\nconst DialogTriggerFrame = styled(YStack, {\n name: TRIGGER_NAME,\n})\n\ninterface DialogTriggerProps extends YStackProps {}\n\nconst DialogTrigger = React.forwardRef<TamaguiElement, DialogTriggerProps>(\n (props: ScopedProps<DialogTriggerProps>, forwardedRef) => {\n const { __scopeDialog, ...triggerProps } = props\n const context = useDialogContext(TRIGGER_NAME, __scopeDialog)\n const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n return (\n <DialogTriggerFrame\n tag=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={context.open}\n aria-controls={context.contentId}\n data-state={getState(context.open)}\n {...triggerProps}\n ref={composedTriggerRef}\n onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n />\n )\n }\n)\n\nDialogTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'DialogPortal'\n\ntype PortalContextValue = { forceMount?: true }\nconst [PortalProvider, usePortalContext] = createDialogContext<PortalContextValue>(PORTAL_NAME, {\n forceMount: undefined,\n})\n\ntype DialogPortalProps = Omit<PortalItemProps, 'asChild'> &\n YStackProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n }\n\nexport const DialogPortalFrame = styled(YStack, {\n alignItems: 'center',\n justifyContent: 'center',\n fullscreen: true,\n zIndex: 100,\n ...(isWeb && {\n maxHeight: '100vh',\n }),\n})\n\nconst DialogPortal: React.FC<DialogPortalProps> = DialogPortalFrame.extractable(\n (props: ScopedProps<DialogPortalProps>) => {\n const { __scopeDialog, forceMount, children, ...frameProps } = props\n const themeName = useThemeName()\n const context = useDialogContext(PORTAL_NAME, __scopeDialog)\n const isShowing = forceMount || context.open\n const contents = <AnimatePresence>{isShowing ? children : null}</AnimatePresence>\n const isSheet = useShowDialogSheet(context)\n if (!context.modal || isSheet) {\n return contents\n }\n return (\n <PortalItem>\n {/* until we can use react-native portals natively */}\n {/* have to re-propogate context, sketch */}\n <DialogProvider scope={__scopeDialog} {...context}>\n <Theme name={themeName}>\n <PortalProvider scope={__scopeDialog} forceMount={forceMount}>\n <DialogPortalFrame pointerEvents={isShowing ? 'auto' : 'none'} {...frameProps}>\n {contents}\n </DialogPortalFrame>\n </PortalProvider>\n </Theme>\n </DialogProvider>\n </PortalItem>\n )\n }\n)\n\nDialogPortal.displayName = PORTAL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'DialogOverlay'\n\nconst DialogOverlayFrame = styled(ThemeableStack, {\n name: OVERLAY_NAME,\n backgrounded: true,\n fullscreen: true,\n})\n\ninterface DialogOverlayProps extends YStackProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogOverlay = React.forwardRef<TamaguiElement, DialogOverlayProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogOverlayProps>, forwardedRef) => {\n const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...overlayProps } = props\n const context = useDialogContext(OVERLAY_NAME, __scopeDialog)\n const showSheet = useShowDialogSheet(context)\n\n if (!forceMount) {\n if (!context.modal || showSheet) {\n return null\n }\n }\n\n return <DialogOverlayImpl context={context} {...overlayProps} ref={forwardedRef} />\n }\n)\n\nDialogOverlay.displayName = OVERLAY_NAME\n\ntype DialogOverlayImplProps = GetProps<typeof DialogOverlayFrame> & {\n context: DialogContextValue\n}\n\nconst DialogOverlayImpl = React.forwardRef<TamaguiElement, DialogOverlayImplProps>(\n (props, forwardedRef) => {\n const { context, ...overlayProps } = props\n\n return (\n // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`\n // ie. when `Overlay` and `Content` are siblings\n <RemoveScroll\n enabled={context.open}\n as={Slot}\n allowPinchZoom={context.allowPinchZoom}\n shards={[context.contentRef]}\n // causes lots of bugs on touch web on site\n removeScrollBar={false}\n >\n <DialogOverlayFrame\n data-state={getState(context.open)}\n // We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.\n pointerEvents={context.open ? 'auto' : 'none'}\n {...overlayProps}\n ref={forwardedRef}\n />\n </RemoveScroll>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'DialogContent'\n\nconst DialogContentFrame = styled(ThemeableStack, {\n name: CONTENT_NAME,\n tag: 'dialog',\n position: 'relative',\n backgrounded: true,\n padded: true,\n radiused: true,\n elevate: true,\n\n variants: {\n size: {\n '...size': (val, extras) => {\n return {}\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\ntype DialogContentFrameProps = GetProps<typeof DialogContentFrame>\n\ninterface DialogContentProps\n extends DialogContentFrameProps,\n Omit<DialogContentTypeProps, 'context'> {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogContent = DialogContentFrame.extractable(\n React.forwardRef<TamaguiElement, DialogContentProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogContentProps>, forwardedRef) => {\n const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...contentProps } = props\n const context = useDialogContext(CONTENT_NAME, __scopeDialog)\n\n return (\n <>\n {context.modal ? (\n <DialogContentModal context={context} {...contentProps} ref={forwardedRef} />\n ) : (\n <DialogContentNonModal context={context} {...contentProps} ref={forwardedRef} />\n )}\n </>\n )\n }\n )\n)\n\nDialogContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ninterface DialogContentTypeProps\n extends Omit<DialogContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n context: DialogContextValue\n}\n\nconst DialogContentModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n ({ children, context, ...props }: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef)\n\n // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n React.useEffect(() => {\n if (!context.open) return\n const content = contentRef.current\n if (content) return hideOthers(content)\n }, [context.open])\n\n return (\n <DialogContentImpl\n {...props}\n context={context}\n ref={composedRefs}\n // we make sure focus isn't trapped once `DialogContent` has been closed\n // (closed !== unmounted when animating out)\n trapFocus={context.open}\n disableOutsidePointerEvents\n onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n event.preventDefault()\n context.triggerRef.current?.focus()\n })}\n onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {\n const originalEvent = event['detail'].originalEvent\n const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n // If the event is a right-click, we shouldn't close because\n // it is effectively as if we right-clicked the `Overlay`.\n if (isRightClick) event.preventDefault()\n })}\n // When focus is trapped, a `focusout` event may still happen.\n // We make sure we don't trigger our `onDismiss` in such case.\n onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) =>\n event.preventDefault()\n )}\n >\n {children}\n </DialogContentImpl>\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\nconst DialogContentNonModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n (props: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const hasInteractedOutsideRef = React.useRef(false)\n\n return (\n <DialogContentImpl\n {...props}\n ref={forwardedRef}\n trapFocus={false}\n disableOutsidePointerEvents={false}\n onCloseAutoFocus={(event) => {\n console.log('on close autofocus')\n props.onCloseAutoFocus?.(event)\n\n if (!event.defaultPrevented) {\n if (!hasInteractedOutsideRef.current) {\n props.context.triggerRef.current?.focus()\n }\n // Always prevent auto focus because we either focus manually or want user agent focus\n event.preventDefault()\n }\n\n hasInteractedOutsideRef.current = false\n }}\n onInteractOutside={(event) => {\n props.onInteractOutside?.(event)\n\n if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n // Prevent dismissing when clicking the trigger.\n // As the trigger is already setup to close, without doing so would\n // cause it to close and immediately open.\n //\n // We use `onInteractOutside` as some browsers also\n // focus on pointer down, creating the same issue.\n const target = event.target as HTMLElement\n const trigger = props.context.triggerRef.current\n if (!(trigger instanceof HTMLElement)) return\n const targetIsTrigger = trigger.contains(target)\n if (targetIsTrigger) event.preventDefault()\n }}\n />\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DialogContentImplProps = DialogContentFrameProps &\n Omit<DismissableProps, 'onDismiss'> & {\n /**\n * When `true`, focus cannot escape the `Content` via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapFocus?: FocusScopeProps['trapped']\n\n /**\n * Event handler called when auto-focusing on open.\n * Can be prevented.\n */\n onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n /**\n * Event handler called when auto-focusing on close.\n * Can be prevented.\n */\n onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n context: DialogContextValue\n }\n\nconst DialogContentImpl = React.forwardRef<TamaguiElement, DialogContentImplProps>(\n (props: ScopedProps<DialogContentImplProps>, forwardedRef) => {\n const {\n __scopeDialog,\n trapFocus,\n onOpenAutoFocus,\n onCloseAutoFocus,\n disableOutsidePointerEvents,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n context,\n ...contentProps\n } = props\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, contentRef)\n const showSheet = useShowDialogSheet(context)\n\n const contents = (\n <DialogContentFrame\n id={context.contentId}\n aria-describedby={context.descriptionId}\n aria-labelledby={context.titleId}\n data-state={getState(context.open)}\n {...contentProps}\n />\n )\n\n if (showSheet) {\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n {contentProps.children}\n </PortalItem>\n )\n }\n\n if (!isWeb) {\n return contents\n }\n\n return (\n <>\n <FocusScope\n loop\n trapped={trapFocus}\n onMountAutoFocus={onOpenAutoFocus}\n forceUnmount={!context.open}\n onUnmountAutoFocus={onCloseAutoFocus}\n >\n <Dismissable\n disableOutsidePointerEvents={context.open && disableOutsidePointerEvents}\n forceUnmount={!context.open}\n onEscapeKeyDown={onEscapeKeyDown}\n onPointerDownOutside={onPointerDownOutside}\n onFocusOutside={onFocusOutside}\n onInteractOutside={onInteractOutside}\n // @ts-ignore\n ref={composedRefs}\n onDismiss={() => context.onOpenChange(false)}\n >\n {contents}\n </Dismissable>\n </FocusScope>\n {process.env.NODE_ENV === 'development' && (\n <>\n <TitleWarning titleId={context.titleId} />\n <DescriptionWarning contentRef={contentRef} descriptionId={context.descriptionId} />\n </>\n )}\n </>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'DialogSheetContents'\n\nexport const DialogSheetContents = ({ __scopeDialog }: ScopedProps<{}>) => {\n const context = useDialogContext(SHEET_CONTENTS_NAME, __scopeDialog)\n return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nDialogSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'DialogTitle'\nconst DialogTitleFrame = styled(H2, {\n name: TITLE_NAME,\n})\n\ntype DialogTitleProps = GetProps<typeof DialogTitleFrame>\n\nconst DialogTitle = React.forwardRef<TamaguiElement, DialogTitleProps>(\n (props: ScopedProps<DialogTitleProps>, forwardedRef) => {\n const { __scopeDialog, ...titleProps } = props\n const context = useDialogContext(TITLE_NAME, __scopeDialog)\n return <DialogTitleFrame id={context.titleId} {...titleProps} ref={forwardedRef} />\n }\n)\n\nDialogTitle.displayName = TITLE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogDescriptionFrame = styled(Paragraph, {\n name: 'DialogDescription',\n})\n\ntype DialogDescriptionProps = GetProps<typeof DialogDescriptionFrame>\n\nconst DESCRIPTION_NAME = 'DialogDescription'\n\nconst DialogDescription = React.forwardRef<TamaguiElement, DialogDescriptionProps>(\n (props: ScopedProps<DialogDescriptionProps>, forwardedRef) => {\n const { __scopeDialog, ...descriptionProps } = props\n const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog)\n return (\n <DialogDescriptionFrame id={context.descriptionId} {...descriptionProps} ref={forwardedRef} />\n )\n }\n)\n\nDialogDescription.displayName = DESCRIPTION_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'DialogClose'\n\ntype DialogCloseProps = YStackProps\n\nconst DialogClose = React.forwardRef<TamaguiElement, DialogCloseProps>(\n (props: ScopedProps<DialogCloseProps>, forwardedRef) => {\n const { __scopeDialog, ...closeProps } = props\n const context = useDialogContext(CLOSE_NAME, __scopeDialog)\n const isSheet = useShowDialogSheet(context)\n\n if (isSheet) {\n return null\n }\n\n return (\n <YStack\n tag=\"button\"\n {...closeProps}\n ref={forwardedRef}\n onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n />\n )\n }\n)\n\nDialogClose.displayName = CLOSE_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n return open ? 'open' : 'closed'\n}\n\nconst TITLE_WARNING_NAME = 'DialogTitleWarning'\n\nconst [DialogWarningProvider, useWarningContext] = createContext(TITLE_WARNING_NAME, {\n contentName: CONTENT_NAME,\n titleName: TITLE_NAME,\n docsSlug: 'dialog',\n})\n\ntype TitleWarningProps = { titleId?: string }\n\nconst TitleWarning: React.FC<TitleWarningProps> = ({ titleId }) => {\n const titleWarningContext = useWarningContext(TITLE_WARNING_NAME)\n\n const MESSAGE = `\\`${titleWarningContext.contentName}\\` requires a \\`${titleWarningContext.titleName}\\` for the component to be accessible for screen reader users.\n\nIf you want to hide the \\`${titleWarningContext.titleName}\\`, you can wrap it with our VisuallyHidden component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`\n\n React.useEffect(() => {\n if (!isWeb) return\n if (titleId) {\n const hasTitle = document.getElementById(titleId)\n if (!hasTitle) throw new Error(MESSAGE)\n }\n }, [MESSAGE, titleId])\n\n return null\n}\n\nconst DESCRIPTION_WARNING_NAME = 'DialogDescriptionWarning'\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<TamaguiElement>\n descriptionId?: string\n}\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef, descriptionId }) => {\n const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME)\n const MESSAGE = `Warning: Missing \\`Description\\` or \\`aria-describedby={undefined}\\` for {${descriptionWarningContext.contentName}}.`\n\n React.useEffect(() => {\n if (!isWeb) return\n const contentNode = contentRef.current\n if (!(contentNode instanceof HTMLElement)) {\n return\n }\n const describedById = contentNode.getAttribute('aria-describedby')\n // if we have an id and the user hasn't set aria-describedby={undefined}\n if (descriptionId && describedById) {\n const hasDescription = document.getElementById(descriptionId)\n if (!hasDescription) console.warn(MESSAGE)\n }\n }, [MESSAGE, contentRef, descriptionId])\n\n return null\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Dialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogInner = React.forwardRef<{ open: (val: boolean) => void }, DialogProps>(function Dialog(\n props: ScopedProps<DialogProps>,\n ref\n) {\n const {\n __scopeDialog,\n children,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n modal = true,\n allowPinchZoom = false,\n sheetBreakpoint = false,\n } = props\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const contentRef = React.useRef<TamaguiElement>(null)\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n })\n\n React.useImperativeHandle(\n ref,\n () => ({\n open: setOpen,\n }),\n [setOpen]\n )\n\n return (\n <DialogProvider\n scope={__scopeDialog}\n scopeKey={__scopeDialog ? Object.keys(__scopeDialog)[0] : ''}\n triggerRef={triggerRef}\n contentRef={contentRef}\n contentId={useId() || ''}\n titleId={useId() || ''}\n descriptionId={useId() || ''}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n modal={modal}\n allowPinchZoom={allowPinchZoom}\n sheetBreakpoint={sheetBreakpoint}\n >\n <DialogSheetController onChangeOpen={setOpen} __scopeDialog={__scopeDialog}>\n {children}\n </DialogSheetController>\n </DialogProvider>\n )\n})\n\nconst Dialog = withStaticProperties(DialogInner, {\n Trigger: DialogTrigger,\n Portal: DialogPortal,\n Overlay: DialogOverlay,\n Content: DialogContent,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n SheetContents: DialogSheetContents,\n Sheet,\n})\n\nconst DialogSheetController = (\n props: ScopedProps<{\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }>\n) => {\n const context = useDialogContext('DialogSheetController', props.__scopeDialog)\n const showSheet = useShowDialogSheet(context)\n const breakpointActive = useSheetBreakpointActive(context)\n const getShowSheet = useGet(showSheet)\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\nconst useSheetBreakpointActive = (context: DialogContextValue) => {\n const media = useMedia()\n return context.sheetBreakpoint ? media[context.sheetBreakpoint] : false\n}\n\nconst useShowDialogSheet = (context: DialogContextValue) => {\n const breakpointActive = useSheetBreakpointActive(context)\n return context.open === false ? false : breakpointActive\n}\n\nexport {\n createDialogScope,\n //\n Dialog,\n DialogTrigger,\n DialogPortal,\n DialogOverlay,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n //\n DialogWarningProvider,\n}\nexport type {\n DialogProps,\n DialogTriggerProps,\n DialogPortalProps,\n DialogOverlayProps,\n DialogContentProps,\n DialogTitleProps,\n DialogDescriptionProps,\n DialogCloseProps,\n}\n"],
4
+ "sourcesContent": ["import { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n GetProps,\n MediaQueryKey,\n Slot,\n TamaguiElement,\n Theme,\n composeEventHandlers,\n isWeb,\n styled,\n useGet,\n useId,\n useMedia,\n useThemeName,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContext, createContextScope } from '@tamagui/create-context'\nimport { Dismissable, DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport { PortalHost, PortalItem, PortalItemProps } from '@tamagui/portal'\nimport { RemoveScroll } from '@tamagui/remove-scroll'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { H2, Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nconst DIALOG_NAME = 'Dialog'\n\ntype ScopedProps<P> = P & { __scopeDialog?: Scope }\n\nconst [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)\n\ntype RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>\n\ninterface DialogProps {\n sheetBreakpoint?: MediaQueryKey | false\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?(open: boolean): void\n modal?: boolean\n\n /**\n * @see https://github.com/theKashey/react-remove-scroll#usage\n */\n allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\ntype NonNull<A> = Exclude<A, void | null>\n\ntype DialogContextValue = {\n triggerRef: React.RefObject<TamaguiElement>\n contentRef: React.RefObject<TamaguiElement>\n contentId: string\n titleId: string\n descriptionId: string\n onOpenToggle(): void\n open: NonNull<DialogProps['open']>\n onOpenChange: NonNull<DialogProps['onOpenChange']>\n modal: NonNull<DialogProps['modal']>\n allowPinchZoom: NonNull<DialogProps['allowPinchZoom']>\n sheetBreakpoint: NonNull<DialogProps['sheetBreakpoint']>\n scopeKey: string\n}\n\nconst [DialogProvider, useDialogContext] = createDialogContext<DialogContextValue>(DIALOG_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'DialogTrigger'\n\nconst DialogTriggerFrame = styled(YStack, {\n name: TRIGGER_NAME,\n})\n\ninterface DialogTriggerProps extends YStackProps {}\n\nconst DialogTrigger = React.forwardRef<TamaguiElement, DialogTriggerProps>(\n (props: ScopedProps<DialogTriggerProps>, forwardedRef) => {\n const { __scopeDialog, ...triggerProps } = props\n const context = useDialogContext(TRIGGER_NAME, __scopeDialog)\n const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n return (\n <DialogTriggerFrame\n tag=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={context.open}\n aria-controls={context.contentId}\n data-state={getState(context.open)}\n {...triggerProps}\n ref={composedTriggerRef}\n onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n />\n )\n }\n)\n\nDialogTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'DialogPortal'\n\ntype PortalContextValue = { forceMount?: true }\nconst [PortalProvider, usePortalContext] = createDialogContext<PortalContextValue>(PORTAL_NAME, {\n forceMount: undefined,\n})\n\ntype DialogPortalProps = Omit<PortalItemProps, 'asChild'> &\n YStackProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n }\n\nexport const DialogPortalFrame = styled(YStack, {\n alignItems: 'center',\n justifyContent: 'center',\n fullscreen: true,\n zIndex: 100,\n ...(isWeb && {\n maxHeight: '100vh',\n }),\n})\n\nconst DialogPortal: React.FC<DialogPortalProps> = DialogPortalFrame.extractable(\n (props: ScopedProps<DialogPortalProps>) => {\n const { __scopeDialog, forceMount, children, ...frameProps } = props\n const themeName = useThemeName()\n const context = useDialogContext(PORTAL_NAME, __scopeDialog)\n const isShowing = forceMount || context.open\n const contents = <AnimatePresence>{isShowing ? children : null}</AnimatePresence>\n const isSheet = useShowDialogSheet(context)\n if (!context.modal || isSheet) {\n return contents\n }\n return (\n <PortalItem>\n {/* until we can use react-native portals natively */}\n {/* have to re-propogate context, sketch */}\n <DialogProvider scope={__scopeDialog} {...context}>\n <Theme name={themeName}>\n <PortalProvider scope={__scopeDialog} forceMount={forceMount}>\n <DialogPortalFrame pointerEvents={isShowing ? 'auto' : 'none'} {...frameProps}>\n {contents}\n </DialogPortalFrame>\n </PortalProvider>\n </Theme>\n </DialogProvider>\n </PortalItem>\n )\n }\n)\n\nDialogPortal.displayName = PORTAL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'DialogOverlay'\n\nconst DialogOverlayFrame = styled(ThemeableStack, {\n name: OVERLAY_NAME,\n backgrounded: true,\n fullscreen: true,\n})\n\ninterface DialogOverlayProps extends YStackProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogOverlay = React.forwardRef<TamaguiElement, DialogOverlayProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogOverlayProps>, forwardedRef) => {\n const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...overlayProps } = props\n const context = useDialogContext(OVERLAY_NAME, __scopeDialog)\n const showSheet = useShowDialogSheet(context)\n\n if (!forceMount) {\n if (!context.modal || showSheet) {\n return null\n }\n }\n\n return <DialogOverlayImpl context={context} {...overlayProps} ref={forwardedRef} />\n }\n)\n\nDialogOverlay.displayName = OVERLAY_NAME\n\ntype DialogOverlayImplProps = GetProps<typeof DialogOverlayFrame> & {\n context: DialogContextValue\n}\n\nconst DialogOverlayImpl = React.forwardRef<TamaguiElement, DialogOverlayImplProps>(\n (props, forwardedRef) => {\n const { context, ...overlayProps } = props\n\n return (\n // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`\n // ie. when `Overlay` and `Content` are siblings\n <RemoveScroll\n enabled={context.open}\n as={Slot}\n allowPinchZoom={context.allowPinchZoom}\n shards={[context.contentRef]}\n // causes lots of bugs on touch web on site\n removeScrollBar={false}\n >\n <DialogOverlayFrame\n data-state={getState(context.open)}\n // We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.\n pointerEvents={context.open ? 'auto' : 'none'}\n {...overlayProps}\n ref={forwardedRef}\n />\n </RemoveScroll>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'DialogContent'\n\nconst DialogContentFrame = styled(ThemeableStack, {\n name: CONTENT_NAME,\n tag: 'dialog',\n position: 'relative',\n backgrounded: true,\n padded: true,\n radiused: true,\n elevate: true,\n\n variants: {\n size: {\n '...size': (val, extras) => {\n return {}\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\ntype DialogContentFrameProps = GetProps<typeof DialogContentFrame>\n\ninterface DialogContentProps\n extends DialogContentFrameProps,\n Omit<DialogContentTypeProps, 'context'> {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogContent = DialogContentFrame.extractable(\n React.forwardRef<TamaguiElement, DialogContentProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogContentProps>, forwardedRef) => {\n const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...contentProps } = props\n const context = useDialogContext(CONTENT_NAME, __scopeDialog)\n\n return (\n <>\n {context.modal ? (\n <DialogContentModal context={context} {...contentProps} ref={forwardedRef} />\n ) : (\n <DialogContentNonModal context={context} {...contentProps} ref={forwardedRef} />\n )}\n </>\n )\n }\n )\n)\n\nDialogContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ninterface DialogContentTypeProps\n extends Omit<DialogContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n context: DialogContextValue\n}\n\nconst DialogContentModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n ({ children, context, ...props }: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef)\n\n // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n React.useEffect(() => {\n if (!context.open) return\n const content = contentRef.current\n if (content) return hideOthers(content)\n }, [context.open])\n\n return (\n <DialogContentImpl\n {...props}\n context={context}\n ref={composedRefs}\n // we make sure focus isn't trapped once `DialogContent` has been closed\n // (closed !== unmounted when animating out)\n trapFocus={context.open}\n disableOutsidePointerEvents\n onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n event.preventDefault()\n context.triggerRef.current?.focus()\n })}\n onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {\n const originalEvent = event['detail'].originalEvent\n const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n // If the event is a right-click, we shouldn't close because\n // it is effectively as if we right-clicked the `Overlay`.\n if (isRightClick) event.preventDefault()\n })}\n // When focus is trapped, a `focusout` event may still happen.\n // We make sure we don't trigger our `onDismiss` in such case.\n onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) =>\n event.preventDefault()\n )}\n >\n {children}\n </DialogContentImpl>\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\nconst DialogContentNonModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n (props: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const hasInteractedOutsideRef = React.useRef(false)\n\n return (\n <DialogContentImpl\n {...props}\n ref={forwardedRef}\n trapFocus={false}\n disableOutsidePointerEvents={false}\n onCloseAutoFocus={(event) => {\n console.log('on close autofocus')\n props.onCloseAutoFocus?.(event)\n\n if (!event.defaultPrevented) {\n if (!hasInteractedOutsideRef.current) {\n props.context.triggerRef.current?.focus()\n }\n // Always prevent auto focus because we either focus manually or want user agent focus\n event.preventDefault()\n }\n\n hasInteractedOutsideRef.current = false\n }}\n onInteractOutside={(event) => {\n props.onInteractOutside?.(event)\n\n if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n // Prevent dismissing when clicking the trigger.\n // As the trigger is already setup to close, without doing so would\n // cause it to close and immediately open.\n //\n // We use `onInteractOutside` as some browsers also\n // focus on pointer down, creating the same issue.\n const target = event.target as HTMLElement\n const trigger = props.context.triggerRef.current\n if (!(trigger instanceof HTMLElement)) return\n const targetIsTrigger = trigger.contains(target)\n if (targetIsTrigger) event.preventDefault()\n }}\n />\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DialogContentImplProps = DialogContentFrameProps &\n Omit<DismissableProps, 'onDismiss'> & {\n /**\n * When `true`, focus cannot escape the `Content` via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapFocus?: FocusScopeProps['trapped']\n\n /**\n * Event handler called when auto-focusing on open.\n * Can be prevented.\n */\n onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n /**\n * Event handler called when auto-focusing on close.\n * Can be prevented.\n */\n onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n context: DialogContextValue\n }\n\nconst DialogContentImpl = React.forwardRef<TamaguiElement, DialogContentImplProps>(\n (props: ScopedProps<DialogContentImplProps>, forwardedRef) => {\n const {\n __scopeDialog,\n trapFocus,\n onOpenAutoFocus,\n onCloseAutoFocus,\n disableOutsidePointerEvents,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n context,\n ...contentProps\n } = props\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, contentRef)\n const showSheet = useShowDialogSheet(context)\n\n const contents = (\n <DialogContentFrame\n id={context.contentId}\n aria-describedby={context.descriptionId}\n aria-labelledby={context.titleId}\n data-state={getState(context.open)}\n {...contentProps}\n />\n )\n\n if (showSheet) {\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n {contentProps.children}\n </PortalItem>\n )\n }\n\n if (!isWeb) {\n return contents\n }\n\n return (\n <>\n <FocusScope\n loop\n trapped={trapFocus}\n onMountAutoFocus={onOpenAutoFocus}\n forceUnmount={!context.open}\n onUnmountAutoFocus={onCloseAutoFocus}\n >\n <Dismissable\n disableOutsidePointerEvents={context.open && disableOutsidePointerEvents}\n forceUnmount={!context.open}\n onEscapeKeyDown={onEscapeKeyDown}\n onPointerDownOutside={onPointerDownOutside}\n onFocusOutside={onFocusOutside}\n onInteractOutside={onInteractOutside}\n // @ts-ignore\n ref={composedRefs}\n onDismiss={() => context.onOpenChange(false)}\n >\n {contents}\n </Dismissable>\n </FocusScope>\n {process.env.NODE_ENV === 'development' && (\n <>\n <TitleWarning titleId={context.titleId} />\n <DescriptionWarning contentRef={contentRef} descriptionId={context.descriptionId} />\n </>\n )}\n </>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'DialogSheetContents'\n\nexport const DialogSheetContents = ({ __scopeDialog }: ScopedProps<{}>) => {\n const context = useDialogContext(SHEET_CONTENTS_NAME, __scopeDialog)\n return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nDialogSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'DialogTitle'\nconst DialogTitleFrame = styled(H2, {\n name: TITLE_NAME,\n})\n\ntype DialogTitleProps = GetProps<typeof DialogTitleFrame>\n\nconst DialogTitle = React.forwardRef<TamaguiElement, DialogTitleProps>(\n (props: ScopedProps<DialogTitleProps>, forwardedRef) => {\n const { __scopeDialog, ...titleProps } = props\n const context = useDialogContext(TITLE_NAME, __scopeDialog)\n return <DialogTitleFrame id={context.titleId} {...titleProps} ref={forwardedRef} />\n }\n)\n\nDialogTitle.displayName = TITLE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogDescriptionFrame = styled(Paragraph, {\n name: 'DialogDescription',\n})\n\ntype DialogDescriptionProps = GetProps<typeof DialogDescriptionFrame>\n\nconst DESCRIPTION_NAME = 'DialogDescription'\n\nconst DialogDescription = React.forwardRef<TamaguiElement, DialogDescriptionProps>(\n (props: ScopedProps<DialogDescriptionProps>, forwardedRef) => {\n const { __scopeDialog, ...descriptionProps } = props\n const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog)\n return (\n <DialogDescriptionFrame id={context.descriptionId} {...descriptionProps} ref={forwardedRef} />\n )\n }\n)\n\nDialogDescription.displayName = DESCRIPTION_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'DialogClose'\n\ntype DialogCloseProps = YStackProps\n\nconst DialogClose = React.forwardRef<TamaguiElement, DialogCloseProps>(\n (props: ScopedProps<DialogCloseProps>, forwardedRef) => {\n const { __scopeDialog, ...closeProps } = props\n const context = useDialogContext(CLOSE_NAME, __scopeDialog)\n const isSheet = useShowDialogSheet(context)\n\n if (isSheet) {\n return null\n }\n\n return (\n <YStack\n tag=\"button\"\n {...closeProps}\n ref={forwardedRef}\n onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n />\n )\n }\n)\n\nDialogClose.displayName = CLOSE_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n return open ? 'open' : 'closed'\n}\n\nconst TITLE_WARNING_NAME = 'DialogTitleWarning'\n\nconst [DialogWarningProvider, useWarningContext] = createContext(TITLE_WARNING_NAME, {\n contentName: CONTENT_NAME,\n titleName: TITLE_NAME,\n docsSlug: 'dialog',\n})\n\ntype TitleWarningProps = { titleId?: string }\n\nconst TitleWarning: React.FC<TitleWarningProps> = ({ titleId }) => {\n const titleWarningContext = useWarningContext(TITLE_WARNING_NAME)\n\n const MESSAGE = `\\`${titleWarningContext.contentName}\\` requires a \\`${titleWarningContext.titleName}\\` for the component to be accessible for screen reader users.\n\nIf you want to hide the \\`${titleWarningContext.titleName}\\`, you can wrap it with our VisuallyHidden component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`\n\n React.useEffect(() => {\n if (!isWeb) return\n if (titleId) {\n const hasTitle = document.getElementById(titleId)\n if (!hasTitle) throw new Error(MESSAGE)\n }\n }, [MESSAGE, titleId])\n\n return null\n}\n\nconst DESCRIPTION_WARNING_NAME = 'DialogDescriptionWarning'\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<TamaguiElement>\n descriptionId?: string\n}\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef, descriptionId }) => {\n const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME)\n const MESSAGE = `Warning: Missing \\`Description\\` or \\`aria-describedby={undefined}\\` for {${descriptionWarningContext.contentName}}.`\n\n React.useEffect(() => {\n if (!isWeb) return\n const contentNode = contentRef.current\n if (!(contentNode instanceof HTMLElement)) {\n return\n }\n const describedById = contentNode.getAttribute('aria-describedby')\n // if we have an id and the user hasn't set aria-describedby={undefined}\n if (descriptionId && describedById) {\n const hasDescription = document.getElementById(descriptionId)\n if (!hasDescription) console.warn(MESSAGE)\n }\n }, [MESSAGE, contentRef, descriptionId])\n\n return null\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Dialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogInner = React.forwardRef<{ open: (val: boolean) => void }, DialogProps>(function Dialog(\n props: ScopedProps<DialogProps>,\n ref\n) {\n const {\n __scopeDialog,\n children,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n modal = true,\n allowPinchZoom = false,\n sheetBreakpoint = false,\n } = props\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const contentRef = React.useRef<TamaguiElement>(null)\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n })\n\n React.useImperativeHandle(\n ref,\n () => ({\n open: setOpen,\n }),\n [setOpen]\n )\n\n return (\n <DialogProvider\n scope={__scopeDialog}\n scopeKey={__scopeDialog ? Object.keys(__scopeDialog)[0] : ''}\n triggerRef={triggerRef}\n contentRef={contentRef}\n contentId={useId() || ''}\n titleId={useId() || ''}\n descriptionId={useId() || ''}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n modal={modal}\n allowPinchZoom={allowPinchZoom}\n sheetBreakpoint={sheetBreakpoint}\n >\n <DialogSheetController onChangeOpen={setOpen} __scopeDialog={__scopeDialog}>\n {children}\n </DialogSheetController>\n </DialogProvider>\n )\n})\n\nconst Dialog = withStaticProperties(DialogInner, {\n Trigger: DialogTrigger,\n Portal: DialogPortal,\n Overlay: DialogOverlay,\n Content: DialogContent,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n SheetContents: DialogSheetContents,\n Sheet,\n})\n\nconst DialogSheetController = (\n props: ScopedProps<{\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }>\n) => {\n const context = useDialogContext('DialogSheetController', props.__scopeDialog)\n const showSheet = useShowDialogSheet(context)\n const breakpointActive = useSheetBreakpointActive(context)\n const getShowSheet = useGet(showSheet)\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\nconst useSheetBreakpointActive = (context: DialogContextValue) => {\n const media = useMedia()\n return context.sheetBreakpoint ? media[context.sheetBreakpoint] : false\n}\n\nconst useShowDialogSheet = (context: DialogContextValue) => {\n const breakpointActive = useSheetBreakpointActive(context)\n return context.open === false ? false : breakpointActive\n}\n\nexport {\n createDialogScope,\n //\n Dialog,\n DialogTrigger,\n DialogPortal,\n DialogOverlay,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n //\n DialogWarningProvider,\n}\nexport type {\n DialogProps,\n DialogTriggerProps,\n DialogPortalProps,\n DialogOverlayProps,\n DialogContentProps,\n DialogTitleProps,\n DialogDescriptionProps,\n DialogCloseProps,\n}\n"],
5
5
  "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/cjs/index.js CHANGED
File without changes
File without changes
File without changes
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Dialog.tsx"],
4
- "sourcesContent": ["import { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n GetProps,\n MediaPropKeys,\n Slot,\n TamaguiElement,\n Theme,\n composeEventHandlers,\n isWeb,\n styled,\n useGet,\n useId,\n useMedia,\n useThemeName,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContext, createContextScope } from '@tamagui/create-context'\nimport { Dismissable, DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport { PortalHost, PortalItem, PortalItemProps } from '@tamagui/portal'\nimport { RemoveScroll } from '@tamagui/remove-scroll'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { H2, Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nconst DIALOG_NAME = 'Dialog'\n\ntype ScopedProps<P> = P & { __scopeDialog?: Scope }\n\nconst [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)\n\ntype RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>\n\ninterface DialogProps {\n sheetBreakpoint?: MediaPropKeys | false\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?(open: boolean): void\n modal?: boolean\n\n /**\n * @see https://github.com/theKashey/react-remove-scroll#usage\n */\n allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\ntype NonNull<A> = Exclude<A, void | null>\n\ntype DialogContextValue = {\n triggerRef: React.RefObject<TamaguiElement>\n contentRef: React.RefObject<TamaguiElement>\n contentId: string\n titleId: string\n descriptionId: string\n onOpenToggle(): void\n open: NonNull<DialogProps['open']>\n onOpenChange: NonNull<DialogProps['onOpenChange']>\n modal: NonNull<DialogProps['modal']>\n allowPinchZoom: NonNull<DialogProps['allowPinchZoom']>\n sheetBreakpoint: NonNull<DialogProps['sheetBreakpoint']>\n scopeKey: string\n}\n\nconst [DialogProvider, useDialogContext] = createDialogContext<DialogContextValue>(DIALOG_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'DialogTrigger'\n\nconst DialogTriggerFrame = styled(YStack, {\n name: TRIGGER_NAME,\n})\n\ninterface DialogTriggerProps extends YStackProps {}\n\nconst DialogTrigger = React.forwardRef<TamaguiElement, DialogTriggerProps>(\n (props: ScopedProps<DialogTriggerProps>, forwardedRef) => {\n const { __scopeDialog, ...triggerProps } = props\n const context = useDialogContext(TRIGGER_NAME, __scopeDialog)\n const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n return (\n <DialogTriggerFrame\n tag=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={context.open}\n aria-controls={context.contentId}\n data-state={getState(context.open)}\n {...triggerProps}\n ref={composedTriggerRef}\n onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n />\n )\n }\n)\n\nDialogTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'DialogPortal'\n\ntype PortalContextValue = { forceMount?: true }\nconst [PortalProvider, usePortalContext] = createDialogContext<PortalContextValue>(PORTAL_NAME, {\n forceMount: undefined,\n})\n\ntype DialogPortalProps = Omit<PortalItemProps, 'asChild'> &\n YStackProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n }\n\nexport const DialogPortalFrame = styled(YStack, {\n alignItems: 'center',\n justifyContent: 'center',\n fullscreen: true,\n zIndex: 100,\n ...(isWeb && {\n maxHeight: '100vh',\n }),\n})\n\nconst DialogPortal: React.FC<DialogPortalProps> = DialogPortalFrame.extractable(\n (props: ScopedProps<DialogPortalProps>) => {\n const { __scopeDialog, forceMount, children, ...frameProps } = props\n const themeName = useThemeName()\n const context = useDialogContext(PORTAL_NAME, __scopeDialog)\n const isShowing = forceMount || context.open\n const contents = <AnimatePresence>{isShowing ? children : null}</AnimatePresence>\n const isSheet = useShowDialogSheet(context)\n if (!context.modal || isSheet) {\n return contents\n }\n return (\n <PortalItem>\n {/* until we can use react-native portals natively */}\n {/* have to re-propogate context, sketch */}\n <DialogProvider scope={__scopeDialog} {...context}>\n <Theme name={themeName}>\n <PortalProvider scope={__scopeDialog} forceMount={forceMount}>\n <DialogPortalFrame pointerEvents={isShowing ? 'auto' : 'none'} {...frameProps}>\n {contents}\n </DialogPortalFrame>\n </PortalProvider>\n </Theme>\n </DialogProvider>\n </PortalItem>\n )\n }\n)\n\nDialogPortal.displayName = PORTAL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'DialogOverlay'\n\nconst DialogOverlayFrame = styled(ThemeableStack, {\n name: OVERLAY_NAME,\n backgrounded: true,\n fullscreen: true,\n})\n\ninterface DialogOverlayProps extends YStackProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogOverlay = React.forwardRef<TamaguiElement, DialogOverlayProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogOverlayProps>, forwardedRef) => {\n const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...overlayProps } = props\n const context = useDialogContext(OVERLAY_NAME, __scopeDialog)\n const showSheet = useShowDialogSheet(context)\n\n if (!forceMount) {\n if (!context.modal || showSheet) {\n return null\n }\n }\n\n return <DialogOverlayImpl context={context} {...overlayProps} ref={forwardedRef} />\n }\n)\n\nDialogOverlay.displayName = OVERLAY_NAME\n\ntype DialogOverlayImplProps = GetProps<typeof DialogOverlayFrame> & {\n context: DialogContextValue\n}\n\nconst DialogOverlayImpl = React.forwardRef<TamaguiElement, DialogOverlayImplProps>(\n (props, forwardedRef) => {\n const { context, ...overlayProps } = props\n\n return (\n // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`\n // ie. when `Overlay` and `Content` are siblings\n <RemoveScroll\n enabled={context.open}\n as={Slot}\n allowPinchZoom={context.allowPinchZoom}\n shards={[context.contentRef]}\n // causes lots of bugs on touch web on site\n removeScrollBar={false}\n >\n <DialogOverlayFrame\n data-state={getState(context.open)}\n // We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.\n pointerEvents={context.open ? 'auto' : 'none'}\n {...overlayProps}\n ref={forwardedRef}\n />\n </RemoveScroll>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'DialogContent'\n\nconst DialogContentFrame = styled(ThemeableStack, {\n name: CONTENT_NAME,\n tag: 'dialog',\n position: 'relative',\n backgrounded: true,\n padded: true,\n radiused: true,\n elevate: true,\n\n variants: {\n size: {\n '...size': (val, extras) => {\n return {}\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\ntype DialogContentFrameProps = GetProps<typeof DialogContentFrame>\n\ninterface DialogContentProps\n extends DialogContentFrameProps,\n Omit<DialogContentTypeProps, 'context'> {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogContent = DialogContentFrame.extractable(\n React.forwardRef<TamaguiElement, DialogContentProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogContentProps>, forwardedRef) => {\n const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...contentProps } = props\n const context = useDialogContext(CONTENT_NAME, __scopeDialog)\n\n return (\n <>\n {context.modal ? (\n <DialogContentModal context={context} {...contentProps} ref={forwardedRef} />\n ) : (\n <DialogContentNonModal context={context} {...contentProps} ref={forwardedRef} />\n )}\n </>\n )\n }\n )\n)\n\nDialogContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ninterface DialogContentTypeProps\n extends Omit<DialogContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n context: DialogContextValue\n}\n\nconst DialogContentModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n ({ children, context, ...props }: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef)\n\n // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n React.useEffect(() => {\n if (!context.open) return\n const content = contentRef.current\n if (content) return hideOthers(content)\n }, [context.open])\n\n return (\n <DialogContentImpl\n {...props}\n context={context}\n ref={composedRefs}\n // we make sure focus isn't trapped once `DialogContent` has been closed\n // (closed !== unmounted when animating out)\n trapFocus={context.open}\n disableOutsidePointerEvents\n onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n event.preventDefault()\n context.triggerRef.current?.focus()\n })}\n onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {\n const originalEvent = event['detail'].originalEvent\n const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n // If the event is a right-click, we shouldn't close because\n // it is effectively as if we right-clicked the `Overlay`.\n if (isRightClick) event.preventDefault()\n })}\n // When focus is trapped, a `focusout` event may still happen.\n // We make sure we don't trigger our `onDismiss` in such case.\n onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) =>\n event.preventDefault()\n )}\n >\n {children}\n </DialogContentImpl>\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\nconst DialogContentNonModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n (props: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const hasInteractedOutsideRef = React.useRef(false)\n\n return (\n <DialogContentImpl\n {...props}\n ref={forwardedRef}\n trapFocus={false}\n disableOutsidePointerEvents={false}\n onCloseAutoFocus={(event) => {\n console.log('on close autofocus')\n props.onCloseAutoFocus?.(event)\n\n if (!event.defaultPrevented) {\n if (!hasInteractedOutsideRef.current) {\n props.context.triggerRef.current?.focus()\n }\n // Always prevent auto focus because we either focus manually or want user agent focus\n event.preventDefault()\n }\n\n hasInteractedOutsideRef.current = false\n }}\n onInteractOutside={(event) => {\n props.onInteractOutside?.(event)\n\n if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n // Prevent dismissing when clicking the trigger.\n // As the trigger is already setup to close, without doing so would\n // cause it to close and immediately open.\n //\n // We use `onInteractOutside` as some browsers also\n // focus on pointer down, creating the same issue.\n const target = event.target as HTMLElement\n const trigger = props.context.triggerRef.current\n if (!(trigger instanceof HTMLElement)) return\n const targetIsTrigger = trigger.contains(target)\n if (targetIsTrigger) event.preventDefault()\n }}\n />\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DialogContentImplProps = DialogContentFrameProps &\n Omit<DismissableProps, 'onDismiss'> & {\n /**\n * When `true`, focus cannot escape the `Content` via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapFocus?: FocusScopeProps['trapped']\n\n /**\n * Event handler called when auto-focusing on open.\n * Can be prevented.\n */\n onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n /**\n * Event handler called when auto-focusing on close.\n * Can be prevented.\n */\n onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n context: DialogContextValue\n }\n\nconst DialogContentImpl = React.forwardRef<TamaguiElement, DialogContentImplProps>(\n (props: ScopedProps<DialogContentImplProps>, forwardedRef) => {\n const {\n __scopeDialog,\n trapFocus,\n onOpenAutoFocus,\n onCloseAutoFocus,\n disableOutsidePointerEvents,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n context,\n ...contentProps\n } = props\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, contentRef)\n const showSheet = useShowDialogSheet(context)\n\n const contents = (\n <DialogContentFrame\n id={context.contentId}\n aria-describedby={context.descriptionId}\n aria-labelledby={context.titleId}\n data-state={getState(context.open)}\n {...contentProps}\n />\n )\n\n if (showSheet) {\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n {contentProps.children}\n </PortalItem>\n )\n }\n\n if (!isWeb) {\n return contents\n }\n\n return (\n <>\n <FocusScope\n loop\n trapped={trapFocus}\n onMountAutoFocus={onOpenAutoFocus}\n forceUnmount={!context.open}\n onUnmountAutoFocus={onCloseAutoFocus}\n >\n <Dismissable\n disableOutsidePointerEvents={context.open && disableOutsidePointerEvents}\n forceUnmount={!context.open}\n onEscapeKeyDown={onEscapeKeyDown}\n onPointerDownOutside={onPointerDownOutside}\n onFocusOutside={onFocusOutside}\n onInteractOutside={onInteractOutside}\n // @ts-ignore\n ref={composedRefs}\n onDismiss={() => context.onOpenChange(false)}\n >\n {contents}\n </Dismissable>\n </FocusScope>\n {process.env.NODE_ENV === 'development' && (\n <>\n <TitleWarning titleId={context.titleId} />\n <DescriptionWarning contentRef={contentRef} descriptionId={context.descriptionId} />\n </>\n )}\n </>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'DialogSheetContents'\n\nexport const DialogSheetContents = ({ __scopeDialog }: ScopedProps<{}>) => {\n const context = useDialogContext(SHEET_CONTENTS_NAME, __scopeDialog)\n return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nDialogSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'DialogTitle'\nconst DialogTitleFrame = styled(H2, {\n name: TITLE_NAME,\n})\n\ntype DialogTitleProps = GetProps<typeof DialogTitleFrame>\n\nconst DialogTitle = React.forwardRef<TamaguiElement, DialogTitleProps>(\n (props: ScopedProps<DialogTitleProps>, forwardedRef) => {\n const { __scopeDialog, ...titleProps } = props\n const context = useDialogContext(TITLE_NAME, __scopeDialog)\n return <DialogTitleFrame id={context.titleId} {...titleProps} ref={forwardedRef} />\n }\n)\n\nDialogTitle.displayName = TITLE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogDescriptionFrame = styled(Paragraph, {\n name: 'DialogDescription',\n})\n\ntype DialogDescriptionProps = GetProps<typeof DialogDescriptionFrame>\n\nconst DESCRIPTION_NAME = 'DialogDescription'\n\nconst DialogDescription = React.forwardRef<TamaguiElement, DialogDescriptionProps>(\n (props: ScopedProps<DialogDescriptionProps>, forwardedRef) => {\n const { __scopeDialog, ...descriptionProps } = props\n const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog)\n return (\n <DialogDescriptionFrame id={context.descriptionId} {...descriptionProps} ref={forwardedRef} />\n )\n }\n)\n\nDialogDescription.displayName = DESCRIPTION_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'DialogClose'\n\ntype DialogCloseProps = YStackProps\n\nconst DialogClose = React.forwardRef<TamaguiElement, DialogCloseProps>(\n (props: ScopedProps<DialogCloseProps>, forwardedRef) => {\n const { __scopeDialog, ...closeProps } = props\n const context = useDialogContext(CLOSE_NAME, __scopeDialog)\n const isSheet = useShowDialogSheet(context)\n\n if (isSheet) {\n return null\n }\n\n return (\n <YStack\n tag=\"button\"\n {...closeProps}\n ref={forwardedRef}\n onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n />\n )\n }\n)\n\nDialogClose.displayName = CLOSE_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n return open ? 'open' : 'closed'\n}\n\nconst TITLE_WARNING_NAME = 'DialogTitleWarning'\n\nconst [DialogWarningProvider, useWarningContext] = createContext(TITLE_WARNING_NAME, {\n contentName: CONTENT_NAME,\n titleName: TITLE_NAME,\n docsSlug: 'dialog',\n})\n\ntype TitleWarningProps = { titleId?: string }\n\nconst TitleWarning: React.FC<TitleWarningProps> = ({ titleId }) => {\n const titleWarningContext = useWarningContext(TITLE_WARNING_NAME)\n\n const MESSAGE = `\\`${titleWarningContext.contentName}\\` requires a \\`${titleWarningContext.titleName}\\` for the component to be accessible for screen reader users.\n\nIf you want to hide the \\`${titleWarningContext.titleName}\\`, you can wrap it with our VisuallyHidden component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`\n\n React.useEffect(() => {\n if (!isWeb) return\n if (titleId) {\n const hasTitle = document.getElementById(titleId)\n if (!hasTitle) throw new Error(MESSAGE)\n }\n }, [MESSAGE, titleId])\n\n return null\n}\n\nconst DESCRIPTION_WARNING_NAME = 'DialogDescriptionWarning'\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<TamaguiElement>\n descriptionId?: string\n}\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef, descriptionId }) => {\n const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME)\n const MESSAGE = `Warning: Missing \\`Description\\` or \\`aria-describedby={undefined}\\` for {${descriptionWarningContext.contentName}}.`\n\n React.useEffect(() => {\n if (!isWeb) return\n const contentNode = contentRef.current\n if (!(contentNode instanceof HTMLElement)) {\n return\n }\n const describedById = contentNode.getAttribute('aria-describedby')\n // if we have an id and the user hasn't set aria-describedby={undefined}\n if (descriptionId && describedById) {\n const hasDescription = document.getElementById(descriptionId)\n if (!hasDescription) console.warn(MESSAGE)\n }\n }, [MESSAGE, contentRef, descriptionId])\n\n return null\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Dialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogInner = React.forwardRef<{ open: (val: boolean) => void }, DialogProps>(function Dialog(\n props: ScopedProps<DialogProps>,\n ref\n) {\n const {\n __scopeDialog,\n children,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n modal = true,\n allowPinchZoom = false,\n sheetBreakpoint = false,\n } = props\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const contentRef = React.useRef<TamaguiElement>(null)\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n })\n\n React.useImperativeHandle(\n ref,\n () => ({\n open: setOpen,\n }),\n [setOpen]\n )\n\n return (\n <DialogProvider\n scope={__scopeDialog}\n scopeKey={__scopeDialog ? Object.keys(__scopeDialog)[0] : ''}\n triggerRef={triggerRef}\n contentRef={contentRef}\n contentId={useId() || ''}\n titleId={useId() || ''}\n descriptionId={useId() || ''}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n modal={modal}\n allowPinchZoom={allowPinchZoom}\n sheetBreakpoint={sheetBreakpoint}\n >\n <DialogSheetController onChangeOpen={setOpen} __scopeDialog={__scopeDialog}>\n {children}\n </DialogSheetController>\n </DialogProvider>\n )\n})\n\nconst Dialog = withStaticProperties(DialogInner, {\n Trigger: DialogTrigger,\n Portal: DialogPortal,\n Overlay: DialogOverlay,\n Content: DialogContent,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n SheetContents: DialogSheetContents,\n Sheet,\n})\n\nconst DialogSheetController = (\n props: ScopedProps<{\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }>\n) => {\n const context = useDialogContext('DialogSheetController', props.__scopeDialog)\n const showSheet = useShowDialogSheet(context)\n const breakpointActive = useSheetBreakpointActive(context)\n const getShowSheet = useGet(showSheet)\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\nconst useSheetBreakpointActive = (context: DialogContextValue) => {\n const media = useMedia()\n return context.sheetBreakpoint ? media[context.sheetBreakpoint] : false\n}\n\nconst useShowDialogSheet = (context: DialogContextValue) => {\n const breakpointActive = useSheetBreakpointActive(context)\n return context.open === false ? false : breakpointActive\n}\n\nexport {\n createDialogScope,\n //\n Dialog,\n DialogTrigger,\n DialogPortal,\n DialogOverlay,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n //\n DialogWarningProvider,\n}\nexport type {\n DialogProps,\n DialogTriggerProps,\n DialogPortalProps,\n DialogOverlayProps,\n DialogContentProps,\n DialogTitleProps,\n DialogDescriptionProps,\n DialogCloseProps,\n}\n"],
4
+ "sourcesContent": ["import { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n GetProps,\n MediaQueryKey,\n Slot,\n TamaguiElement,\n Theme,\n composeEventHandlers,\n isWeb,\n styled,\n useGet,\n useId,\n useMedia,\n useThemeName,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContext, createContextScope } from '@tamagui/create-context'\nimport { Dismissable, DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport { PortalHost, PortalItem, PortalItemProps } from '@tamagui/portal'\nimport { RemoveScroll } from '@tamagui/remove-scroll'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { H2, Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nconst DIALOG_NAME = 'Dialog'\n\ntype ScopedProps<P> = P & { __scopeDialog?: Scope }\n\nconst [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)\n\ntype RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>\n\ninterface DialogProps {\n sheetBreakpoint?: MediaQueryKey | false\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?(open: boolean): void\n modal?: boolean\n\n /**\n * @see https://github.com/theKashey/react-remove-scroll#usage\n */\n allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\ntype NonNull<A> = Exclude<A, void | null>\n\ntype DialogContextValue = {\n triggerRef: React.RefObject<TamaguiElement>\n contentRef: React.RefObject<TamaguiElement>\n contentId: string\n titleId: string\n descriptionId: string\n onOpenToggle(): void\n open: NonNull<DialogProps['open']>\n onOpenChange: NonNull<DialogProps['onOpenChange']>\n modal: NonNull<DialogProps['modal']>\n allowPinchZoom: NonNull<DialogProps['allowPinchZoom']>\n sheetBreakpoint: NonNull<DialogProps['sheetBreakpoint']>\n scopeKey: string\n}\n\nconst [DialogProvider, useDialogContext] = createDialogContext<DialogContextValue>(DIALOG_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'DialogTrigger'\n\nconst DialogTriggerFrame = styled(YStack, {\n name: TRIGGER_NAME,\n})\n\ninterface DialogTriggerProps extends YStackProps {}\n\nconst DialogTrigger = React.forwardRef<TamaguiElement, DialogTriggerProps>(\n (props: ScopedProps<DialogTriggerProps>, forwardedRef) => {\n const { __scopeDialog, ...triggerProps } = props\n const context = useDialogContext(TRIGGER_NAME, __scopeDialog)\n const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n return (\n <DialogTriggerFrame\n tag=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={context.open}\n aria-controls={context.contentId}\n data-state={getState(context.open)}\n {...triggerProps}\n ref={composedTriggerRef}\n onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n />\n )\n }\n)\n\nDialogTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'DialogPortal'\n\ntype PortalContextValue = { forceMount?: true }\nconst [PortalProvider, usePortalContext] = createDialogContext<PortalContextValue>(PORTAL_NAME, {\n forceMount: undefined,\n})\n\ntype DialogPortalProps = Omit<PortalItemProps, 'asChild'> &\n YStackProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n }\n\nexport const DialogPortalFrame = styled(YStack, {\n alignItems: 'center',\n justifyContent: 'center',\n fullscreen: true,\n zIndex: 100,\n ...(isWeb && {\n maxHeight: '100vh',\n }),\n})\n\nconst DialogPortal: React.FC<DialogPortalProps> = DialogPortalFrame.extractable(\n (props: ScopedProps<DialogPortalProps>) => {\n const { __scopeDialog, forceMount, children, ...frameProps } = props\n const themeName = useThemeName()\n const context = useDialogContext(PORTAL_NAME, __scopeDialog)\n const isShowing = forceMount || context.open\n const contents = <AnimatePresence>{isShowing ? children : null}</AnimatePresence>\n const isSheet = useShowDialogSheet(context)\n if (!context.modal || isSheet) {\n return contents\n }\n return (\n <PortalItem>\n {/* until we can use react-native portals natively */}\n {/* have to re-propogate context, sketch */}\n <DialogProvider scope={__scopeDialog} {...context}>\n <Theme name={themeName}>\n <PortalProvider scope={__scopeDialog} forceMount={forceMount}>\n <DialogPortalFrame pointerEvents={isShowing ? 'auto' : 'none'} {...frameProps}>\n {contents}\n </DialogPortalFrame>\n </PortalProvider>\n </Theme>\n </DialogProvider>\n </PortalItem>\n )\n }\n)\n\nDialogPortal.displayName = PORTAL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'DialogOverlay'\n\nconst DialogOverlayFrame = styled(ThemeableStack, {\n name: OVERLAY_NAME,\n backgrounded: true,\n fullscreen: true,\n})\n\ninterface DialogOverlayProps extends YStackProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogOverlay = React.forwardRef<TamaguiElement, DialogOverlayProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogOverlayProps>, forwardedRef) => {\n const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...overlayProps } = props\n const context = useDialogContext(OVERLAY_NAME, __scopeDialog)\n const showSheet = useShowDialogSheet(context)\n\n if (!forceMount) {\n if (!context.modal || showSheet) {\n return null\n }\n }\n\n return <DialogOverlayImpl context={context} {...overlayProps} ref={forwardedRef} />\n }\n)\n\nDialogOverlay.displayName = OVERLAY_NAME\n\ntype DialogOverlayImplProps = GetProps<typeof DialogOverlayFrame> & {\n context: DialogContextValue\n}\n\nconst DialogOverlayImpl = React.forwardRef<TamaguiElement, DialogOverlayImplProps>(\n (props, forwardedRef) => {\n const { context, ...overlayProps } = props\n\n return (\n // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`\n // ie. when `Overlay` and `Content` are siblings\n <RemoveScroll\n enabled={context.open}\n as={Slot}\n allowPinchZoom={context.allowPinchZoom}\n shards={[context.contentRef]}\n // causes lots of bugs on touch web on site\n removeScrollBar={false}\n >\n <DialogOverlayFrame\n data-state={getState(context.open)}\n // We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.\n pointerEvents={context.open ? 'auto' : 'none'}\n {...overlayProps}\n ref={forwardedRef}\n />\n </RemoveScroll>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'DialogContent'\n\nconst DialogContentFrame = styled(ThemeableStack, {\n name: CONTENT_NAME,\n tag: 'dialog',\n position: 'relative',\n backgrounded: true,\n padded: true,\n radiused: true,\n elevate: true,\n\n variants: {\n size: {\n '...size': (val, extras) => {\n return {}\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\ntype DialogContentFrameProps = GetProps<typeof DialogContentFrame>\n\ninterface DialogContentProps\n extends DialogContentFrameProps,\n Omit<DialogContentTypeProps, 'context'> {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogContent = DialogContentFrame.extractable(\n React.forwardRef<TamaguiElement, DialogContentProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogContentProps>, forwardedRef) => {\n const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...contentProps } = props\n const context = useDialogContext(CONTENT_NAME, __scopeDialog)\n\n return (\n <>\n {context.modal ? (\n <DialogContentModal context={context} {...contentProps} ref={forwardedRef} />\n ) : (\n <DialogContentNonModal context={context} {...contentProps} ref={forwardedRef} />\n )}\n </>\n )\n }\n )\n)\n\nDialogContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ninterface DialogContentTypeProps\n extends Omit<DialogContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n context: DialogContextValue\n}\n\nconst DialogContentModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n ({ children, context, ...props }: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef)\n\n // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n React.useEffect(() => {\n if (!context.open) return\n const content = contentRef.current\n if (content) return hideOthers(content)\n }, [context.open])\n\n return (\n <DialogContentImpl\n {...props}\n context={context}\n ref={composedRefs}\n // we make sure focus isn't trapped once `DialogContent` has been closed\n // (closed !== unmounted when animating out)\n trapFocus={context.open}\n disableOutsidePointerEvents\n onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n event.preventDefault()\n context.triggerRef.current?.focus()\n })}\n onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {\n const originalEvent = event['detail'].originalEvent\n const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n // If the event is a right-click, we shouldn't close because\n // it is effectively as if we right-clicked the `Overlay`.\n if (isRightClick) event.preventDefault()\n })}\n // When focus is trapped, a `focusout` event may still happen.\n // We make sure we don't trigger our `onDismiss` in such case.\n onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) =>\n event.preventDefault()\n )}\n >\n {children}\n </DialogContentImpl>\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\nconst DialogContentNonModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n (props: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const hasInteractedOutsideRef = React.useRef(false)\n\n return (\n <DialogContentImpl\n {...props}\n ref={forwardedRef}\n trapFocus={false}\n disableOutsidePointerEvents={false}\n onCloseAutoFocus={(event) => {\n console.log('on close autofocus')\n props.onCloseAutoFocus?.(event)\n\n if (!event.defaultPrevented) {\n if (!hasInteractedOutsideRef.current) {\n props.context.triggerRef.current?.focus()\n }\n // Always prevent auto focus because we either focus manually or want user agent focus\n event.preventDefault()\n }\n\n hasInteractedOutsideRef.current = false\n }}\n onInteractOutside={(event) => {\n props.onInteractOutside?.(event)\n\n if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n // Prevent dismissing when clicking the trigger.\n // As the trigger is already setup to close, without doing so would\n // cause it to close and immediately open.\n //\n // We use `onInteractOutside` as some browsers also\n // focus on pointer down, creating the same issue.\n const target = event.target as HTMLElement\n const trigger = props.context.triggerRef.current\n if (!(trigger instanceof HTMLElement)) return\n const targetIsTrigger = trigger.contains(target)\n if (targetIsTrigger) event.preventDefault()\n }}\n />\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DialogContentImplProps = DialogContentFrameProps &\n Omit<DismissableProps, 'onDismiss'> & {\n /**\n * When `true`, focus cannot escape the `Content` via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapFocus?: FocusScopeProps['trapped']\n\n /**\n * Event handler called when auto-focusing on open.\n * Can be prevented.\n */\n onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n /**\n * Event handler called when auto-focusing on close.\n * Can be prevented.\n */\n onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n context: DialogContextValue\n }\n\nconst DialogContentImpl = React.forwardRef<TamaguiElement, DialogContentImplProps>(\n (props: ScopedProps<DialogContentImplProps>, forwardedRef) => {\n const {\n __scopeDialog,\n trapFocus,\n onOpenAutoFocus,\n onCloseAutoFocus,\n disableOutsidePointerEvents,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n context,\n ...contentProps\n } = props\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, contentRef)\n const showSheet = useShowDialogSheet(context)\n\n const contents = (\n <DialogContentFrame\n id={context.contentId}\n aria-describedby={context.descriptionId}\n aria-labelledby={context.titleId}\n data-state={getState(context.open)}\n {...contentProps}\n />\n )\n\n if (showSheet) {\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n {contentProps.children}\n </PortalItem>\n )\n }\n\n if (!isWeb) {\n return contents\n }\n\n return (\n <>\n <FocusScope\n loop\n trapped={trapFocus}\n onMountAutoFocus={onOpenAutoFocus}\n forceUnmount={!context.open}\n onUnmountAutoFocus={onCloseAutoFocus}\n >\n <Dismissable\n disableOutsidePointerEvents={context.open && disableOutsidePointerEvents}\n forceUnmount={!context.open}\n onEscapeKeyDown={onEscapeKeyDown}\n onPointerDownOutside={onPointerDownOutside}\n onFocusOutside={onFocusOutside}\n onInteractOutside={onInteractOutside}\n // @ts-ignore\n ref={composedRefs}\n onDismiss={() => context.onOpenChange(false)}\n >\n {contents}\n </Dismissable>\n </FocusScope>\n {process.env.NODE_ENV === 'development' && (\n <>\n <TitleWarning titleId={context.titleId} />\n <DescriptionWarning contentRef={contentRef} descriptionId={context.descriptionId} />\n </>\n )}\n </>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'DialogSheetContents'\n\nexport const DialogSheetContents = ({ __scopeDialog }: ScopedProps<{}>) => {\n const context = useDialogContext(SHEET_CONTENTS_NAME, __scopeDialog)\n return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nDialogSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'DialogTitle'\nconst DialogTitleFrame = styled(H2, {\n name: TITLE_NAME,\n})\n\ntype DialogTitleProps = GetProps<typeof DialogTitleFrame>\n\nconst DialogTitle = React.forwardRef<TamaguiElement, DialogTitleProps>(\n (props: ScopedProps<DialogTitleProps>, forwardedRef) => {\n const { __scopeDialog, ...titleProps } = props\n const context = useDialogContext(TITLE_NAME, __scopeDialog)\n return <DialogTitleFrame id={context.titleId} {...titleProps} ref={forwardedRef} />\n }\n)\n\nDialogTitle.displayName = TITLE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogDescriptionFrame = styled(Paragraph, {\n name: 'DialogDescription',\n})\n\ntype DialogDescriptionProps = GetProps<typeof DialogDescriptionFrame>\n\nconst DESCRIPTION_NAME = 'DialogDescription'\n\nconst DialogDescription = React.forwardRef<TamaguiElement, DialogDescriptionProps>(\n (props: ScopedProps<DialogDescriptionProps>, forwardedRef) => {\n const { __scopeDialog, ...descriptionProps } = props\n const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog)\n return (\n <DialogDescriptionFrame id={context.descriptionId} {...descriptionProps} ref={forwardedRef} />\n )\n }\n)\n\nDialogDescription.displayName = DESCRIPTION_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'DialogClose'\n\ntype DialogCloseProps = YStackProps\n\nconst DialogClose = React.forwardRef<TamaguiElement, DialogCloseProps>(\n (props: ScopedProps<DialogCloseProps>, forwardedRef) => {\n const { __scopeDialog, ...closeProps } = props\n const context = useDialogContext(CLOSE_NAME, __scopeDialog)\n const isSheet = useShowDialogSheet(context)\n\n if (isSheet) {\n return null\n }\n\n return (\n <YStack\n tag=\"button\"\n {...closeProps}\n ref={forwardedRef}\n onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n />\n )\n }\n)\n\nDialogClose.displayName = CLOSE_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n return open ? 'open' : 'closed'\n}\n\nconst TITLE_WARNING_NAME = 'DialogTitleWarning'\n\nconst [DialogWarningProvider, useWarningContext] = createContext(TITLE_WARNING_NAME, {\n contentName: CONTENT_NAME,\n titleName: TITLE_NAME,\n docsSlug: 'dialog',\n})\n\ntype TitleWarningProps = { titleId?: string }\n\nconst TitleWarning: React.FC<TitleWarningProps> = ({ titleId }) => {\n const titleWarningContext = useWarningContext(TITLE_WARNING_NAME)\n\n const MESSAGE = `\\`${titleWarningContext.contentName}\\` requires a \\`${titleWarningContext.titleName}\\` for the component to be accessible for screen reader users.\n\nIf you want to hide the \\`${titleWarningContext.titleName}\\`, you can wrap it with our VisuallyHidden component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`\n\n React.useEffect(() => {\n if (!isWeb) return\n if (titleId) {\n const hasTitle = document.getElementById(titleId)\n if (!hasTitle) throw new Error(MESSAGE)\n }\n }, [MESSAGE, titleId])\n\n return null\n}\n\nconst DESCRIPTION_WARNING_NAME = 'DialogDescriptionWarning'\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<TamaguiElement>\n descriptionId?: string\n}\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef, descriptionId }) => {\n const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME)\n const MESSAGE = `Warning: Missing \\`Description\\` or \\`aria-describedby={undefined}\\` for {${descriptionWarningContext.contentName}}.`\n\n React.useEffect(() => {\n if (!isWeb) return\n const contentNode = contentRef.current\n if (!(contentNode instanceof HTMLElement)) {\n return\n }\n const describedById = contentNode.getAttribute('aria-describedby')\n // if we have an id and the user hasn't set aria-describedby={undefined}\n if (descriptionId && describedById) {\n const hasDescription = document.getElementById(descriptionId)\n if (!hasDescription) console.warn(MESSAGE)\n }\n }, [MESSAGE, contentRef, descriptionId])\n\n return null\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Dialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogInner = React.forwardRef<{ open: (val: boolean) => void }, DialogProps>(function Dialog(\n props: ScopedProps<DialogProps>,\n ref\n) {\n const {\n __scopeDialog,\n children,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n modal = true,\n allowPinchZoom = false,\n sheetBreakpoint = false,\n } = props\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const contentRef = React.useRef<TamaguiElement>(null)\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n })\n\n React.useImperativeHandle(\n ref,\n () => ({\n open: setOpen,\n }),\n [setOpen]\n )\n\n return (\n <DialogProvider\n scope={__scopeDialog}\n scopeKey={__scopeDialog ? Object.keys(__scopeDialog)[0] : ''}\n triggerRef={triggerRef}\n contentRef={contentRef}\n contentId={useId() || ''}\n titleId={useId() || ''}\n descriptionId={useId() || ''}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n modal={modal}\n allowPinchZoom={allowPinchZoom}\n sheetBreakpoint={sheetBreakpoint}\n >\n <DialogSheetController onChangeOpen={setOpen} __scopeDialog={__scopeDialog}>\n {children}\n </DialogSheetController>\n </DialogProvider>\n )\n})\n\nconst Dialog = withStaticProperties(DialogInner, {\n Trigger: DialogTrigger,\n Portal: DialogPortal,\n Overlay: DialogOverlay,\n Content: DialogContent,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n SheetContents: DialogSheetContents,\n Sheet,\n})\n\nconst DialogSheetController = (\n props: ScopedProps<{\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }>\n) => {\n const context = useDialogContext('DialogSheetController', props.__scopeDialog)\n const showSheet = useShowDialogSheet(context)\n const breakpointActive = useSheetBreakpointActive(context)\n const getShowSheet = useGet(showSheet)\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\nconst useSheetBreakpointActive = (context: DialogContextValue) => {\n const media = useMedia()\n return context.sheetBreakpoint ? media[context.sheetBreakpoint] : false\n}\n\nconst useShowDialogSheet = (context: DialogContextValue) => {\n const breakpointActive = useSheetBreakpointActive(context)\n return context.open === false ? false : breakpointActive\n}\n\nexport {\n createDialogScope,\n //\n Dialog,\n DialogTrigger,\n DialogPortal,\n DialogOverlay,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n //\n DialogWarningProvider,\n}\nexport type {\n DialogProps,\n DialogTriggerProps,\n DialogPortalProps,\n DialogOverlayProps,\n DialogContentProps,\n DialogTitleProps,\n DialogDescriptionProps,\n DialogCloseProps,\n}\n"],
5
5
  "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/esm/index.js CHANGED
File without changes
File without changes
@@ -124,9 +124,8 @@ const DialogContentModal = React.forwardRef(({ children, context, ...props }, fo
124
124
  return hideOthers(content);
125
125
  }, [context.open]);
126
126
  return <DialogContentImpl {...props} context={context} ref={composedRefs} trapFocus={context.open} disableOutsidePointerEvents onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {
127
- var _a;
128
127
  event.preventDefault();
129
- (_a = context.triggerRef.current) == null ? void 0 : _a.focus();
128
+ context.triggerRef.current?.focus();
130
129
  })} onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {
131
130
  const originalEvent = event["detail"].originalEvent;
132
131
  const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
@@ -138,19 +137,17 @@ const DialogContentModal = React.forwardRef(({ children, context, ...props }, fo
138
137
  const DialogContentNonModal = React.forwardRef((props, forwardedRef) => {
139
138
  const hasInteractedOutsideRef = React.useRef(false);
140
139
  return <DialogContentImpl {...props} ref={forwardedRef} trapFocus={false} disableOutsidePointerEvents={false} onCloseAutoFocus={(event) => {
141
- var _a, _b;
142
140
  console.log("on close autofocus");
143
- (_a = props.onCloseAutoFocus) == null ? void 0 : _a.call(props, event);
141
+ props.onCloseAutoFocus?.(event);
144
142
  if (!event.defaultPrevented) {
145
143
  if (!hasInteractedOutsideRef.current) {
146
- (_b = props.context.triggerRef.current) == null ? void 0 : _b.focus();
144
+ props.context.triggerRef.current?.focus();
147
145
  }
148
146
  event.preventDefault();
149
147
  }
150
148
  hasInteractedOutsideRef.current = false;
151
149
  }} onInteractOutside={(event) => {
152
- var _a;
153
- (_a = props.onInteractOutside) == null ? void 0 : _a.call(props, event);
150
+ props.onInteractOutside?.(event);
154
151
  if (!event.defaultPrevented)
155
152
  hasInteractedOutsideRef.current = true;
156
153
  const target = event.target;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Dialog.tsx"],
4
- "sourcesContent": ["import { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n GetProps,\n MediaPropKeys,\n Slot,\n TamaguiElement,\n Theme,\n composeEventHandlers,\n isWeb,\n styled,\n useGet,\n useId,\n useMedia,\n useThemeName,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContext, createContextScope } from '@tamagui/create-context'\nimport { Dismissable, DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport { PortalHost, PortalItem, PortalItemProps } from '@tamagui/portal'\nimport { RemoveScroll } from '@tamagui/remove-scroll'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { H2, Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nconst DIALOG_NAME = 'Dialog'\n\ntype ScopedProps<P> = P & { __scopeDialog?: Scope }\n\nconst [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)\n\ntype RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>\n\ninterface DialogProps {\n sheetBreakpoint?: MediaPropKeys | false\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?(open: boolean): void\n modal?: boolean\n\n /**\n * @see https://github.com/theKashey/react-remove-scroll#usage\n */\n allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\ntype NonNull<A> = Exclude<A, void | null>\n\ntype DialogContextValue = {\n triggerRef: React.RefObject<TamaguiElement>\n contentRef: React.RefObject<TamaguiElement>\n contentId: string\n titleId: string\n descriptionId: string\n onOpenToggle(): void\n open: NonNull<DialogProps['open']>\n onOpenChange: NonNull<DialogProps['onOpenChange']>\n modal: NonNull<DialogProps['modal']>\n allowPinchZoom: NonNull<DialogProps['allowPinchZoom']>\n sheetBreakpoint: NonNull<DialogProps['sheetBreakpoint']>\n scopeKey: string\n}\n\nconst [DialogProvider, useDialogContext] = createDialogContext<DialogContextValue>(DIALOG_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'DialogTrigger'\n\nconst DialogTriggerFrame = styled(YStack, {\n name: TRIGGER_NAME,\n})\n\ninterface DialogTriggerProps extends YStackProps {}\n\nconst DialogTrigger = React.forwardRef<TamaguiElement, DialogTriggerProps>(\n (props: ScopedProps<DialogTriggerProps>, forwardedRef) => {\n const { __scopeDialog, ...triggerProps } = props\n const context = useDialogContext(TRIGGER_NAME, __scopeDialog)\n const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n return (\n <DialogTriggerFrame\n tag=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={context.open}\n aria-controls={context.contentId}\n data-state={getState(context.open)}\n {...triggerProps}\n ref={composedTriggerRef}\n onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n />\n )\n }\n)\n\nDialogTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'DialogPortal'\n\ntype PortalContextValue = { forceMount?: true }\nconst [PortalProvider, usePortalContext] = createDialogContext<PortalContextValue>(PORTAL_NAME, {\n forceMount: undefined,\n})\n\ntype DialogPortalProps = Omit<PortalItemProps, 'asChild'> &\n YStackProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n }\n\nexport const DialogPortalFrame = styled(YStack, {\n alignItems: 'center',\n justifyContent: 'center',\n fullscreen: true,\n zIndex: 100,\n ...(isWeb && {\n maxHeight: '100vh',\n }),\n})\n\nconst DialogPortal: React.FC<DialogPortalProps> = DialogPortalFrame.extractable(\n (props: ScopedProps<DialogPortalProps>) => {\n const { __scopeDialog, forceMount, children, ...frameProps } = props\n const themeName = useThemeName()\n const context = useDialogContext(PORTAL_NAME, __scopeDialog)\n const isShowing = forceMount || context.open\n const contents = <AnimatePresence>{isShowing ? children : null}</AnimatePresence>\n const isSheet = useShowDialogSheet(context)\n if (!context.modal || isSheet) {\n return contents\n }\n return (\n <PortalItem>\n {/* until we can use react-native portals natively */}\n {/* have to re-propogate context, sketch */}\n <DialogProvider scope={__scopeDialog} {...context}>\n <Theme name={themeName}>\n <PortalProvider scope={__scopeDialog} forceMount={forceMount}>\n <DialogPortalFrame pointerEvents={isShowing ? 'auto' : 'none'} {...frameProps}>\n {contents}\n </DialogPortalFrame>\n </PortalProvider>\n </Theme>\n </DialogProvider>\n </PortalItem>\n )\n }\n)\n\nDialogPortal.displayName = PORTAL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'DialogOverlay'\n\nconst DialogOverlayFrame = styled(ThemeableStack, {\n name: OVERLAY_NAME,\n backgrounded: true,\n fullscreen: true,\n})\n\ninterface DialogOverlayProps extends YStackProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogOverlay = React.forwardRef<TamaguiElement, DialogOverlayProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogOverlayProps>, forwardedRef) => {\n const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...overlayProps } = props\n const context = useDialogContext(OVERLAY_NAME, __scopeDialog)\n const showSheet = useShowDialogSheet(context)\n\n if (!forceMount) {\n if (!context.modal || showSheet) {\n return null\n }\n }\n\n return <DialogOverlayImpl context={context} {...overlayProps} ref={forwardedRef} />\n }\n)\n\nDialogOverlay.displayName = OVERLAY_NAME\n\ntype DialogOverlayImplProps = GetProps<typeof DialogOverlayFrame> & {\n context: DialogContextValue\n}\n\nconst DialogOverlayImpl = React.forwardRef<TamaguiElement, DialogOverlayImplProps>(\n (props, forwardedRef) => {\n const { context, ...overlayProps } = props\n\n return (\n // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`\n // ie. when `Overlay` and `Content` are siblings\n <RemoveScroll\n enabled={context.open}\n as={Slot}\n allowPinchZoom={context.allowPinchZoom}\n shards={[context.contentRef]}\n // causes lots of bugs on touch web on site\n removeScrollBar={false}\n >\n <DialogOverlayFrame\n data-state={getState(context.open)}\n // We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.\n pointerEvents={context.open ? 'auto' : 'none'}\n {...overlayProps}\n ref={forwardedRef}\n />\n </RemoveScroll>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'DialogContent'\n\nconst DialogContentFrame = styled(ThemeableStack, {\n name: CONTENT_NAME,\n tag: 'dialog',\n position: 'relative',\n backgrounded: true,\n padded: true,\n radiused: true,\n elevate: true,\n\n variants: {\n size: {\n '...size': (val, extras) => {\n return {}\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\ntype DialogContentFrameProps = GetProps<typeof DialogContentFrame>\n\ninterface DialogContentProps\n extends DialogContentFrameProps,\n Omit<DialogContentTypeProps, 'context'> {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogContent = DialogContentFrame.extractable(\n React.forwardRef<TamaguiElement, DialogContentProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogContentProps>, forwardedRef) => {\n const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...contentProps } = props\n const context = useDialogContext(CONTENT_NAME, __scopeDialog)\n\n return (\n <>\n {context.modal ? (\n <DialogContentModal context={context} {...contentProps} ref={forwardedRef} />\n ) : (\n <DialogContentNonModal context={context} {...contentProps} ref={forwardedRef} />\n )}\n </>\n )\n }\n )\n)\n\nDialogContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ninterface DialogContentTypeProps\n extends Omit<DialogContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n context: DialogContextValue\n}\n\nconst DialogContentModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n ({ children, context, ...props }: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef)\n\n // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n React.useEffect(() => {\n if (!context.open) return\n const content = contentRef.current\n if (content) return hideOthers(content)\n }, [context.open])\n\n return (\n <DialogContentImpl\n {...props}\n context={context}\n ref={composedRefs}\n // we make sure focus isn't trapped once `DialogContent` has been closed\n // (closed !== unmounted when animating out)\n trapFocus={context.open}\n disableOutsidePointerEvents\n onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n event.preventDefault()\n context.triggerRef.current?.focus()\n })}\n onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {\n const originalEvent = event['detail'].originalEvent\n const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n // If the event is a right-click, we shouldn't close because\n // it is effectively as if we right-clicked the `Overlay`.\n if (isRightClick) event.preventDefault()\n })}\n // When focus is trapped, a `focusout` event may still happen.\n // We make sure we don't trigger our `onDismiss` in such case.\n onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) =>\n event.preventDefault()\n )}\n >\n {children}\n </DialogContentImpl>\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\nconst DialogContentNonModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n (props: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const hasInteractedOutsideRef = React.useRef(false)\n\n return (\n <DialogContentImpl\n {...props}\n ref={forwardedRef}\n trapFocus={false}\n disableOutsidePointerEvents={false}\n onCloseAutoFocus={(event) => {\n console.log('on close autofocus')\n props.onCloseAutoFocus?.(event)\n\n if (!event.defaultPrevented) {\n if (!hasInteractedOutsideRef.current) {\n props.context.triggerRef.current?.focus()\n }\n // Always prevent auto focus because we either focus manually or want user agent focus\n event.preventDefault()\n }\n\n hasInteractedOutsideRef.current = false\n }}\n onInteractOutside={(event) => {\n props.onInteractOutside?.(event)\n\n if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n // Prevent dismissing when clicking the trigger.\n // As the trigger is already setup to close, without doing so would\n // cause it to close and immediately open.\n //\n // We use `onInteractOutside` as some browsers also\n // focus on pointer down, creating the same issue.\n const target = event.target as HTMLElement\n const trigger = props.context.triggerRef.current\n if (!(trigger instanceof HTMLElement)) return\n const targetIsTrigger = trigger.contains(target)\n if (targetIsTrigger) event.preventDefault()\n }}\n />\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DialogContentImplProps = DialogContentFrameProps &\n Omit<DismissableProps, 'onDismiss'> & {\n /**\n * When `true`, focus cannot escape the `Content` via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapFocus?: FocusScopeProps['trapped']\n\n /**\n * Event handler called when auto-focusing on open.\n * Can be prevented.\n */\n onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n /**\n * Event handler called when auto-focusing on close.\n * Can be prevented.\n */\n onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n context: DialogContextValue\n }\n\nconst DialogContentImpl = React.forwardRef<TamaguiElement, DialogContentImplProps>(\n (props: ScopedProps<DialogContentImplProps>, forwardedRef) => {\n const {\n __scopeDialog,\n trapFocus,\n onOpenAutoFocus,\n onCloseAutoFocus,\n disableOutsidePointerEvents,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n context,\n ...contentProps\n } = props\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, contentRef)\n const showSheet = useShowDialogSheet(context)\n\n const contents = (\n <DialogContentFrame\n id={context.contentId}\n aria-describedby={context.descriptionId}\n aria-labelledby={context.titleId}\n data-state={getState(context.open)}\n {...contentProps}\n />\n )\n\n if (showSheet) {\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n {contentProps.children}\n </PortalItem>\n )\n }\n\n if (!isWeb) {\n return contents\n }\n\n return (\n <>\n <FocusScope\n loop\n trapped={trapFocus}\n onMountAutoFocus={onOpenAutoFocus}\n forceUnmount={!context.open}\n onUnmountAutoFocus={onCloseAutoFocus}\n >\n <Dismissable\n disableOutsidePointerEvents={context.open && disableOutsidePointerEvents}\n forceUnmount={!context.open}\n onEscapeKeyDown={onEscapeKeyDown}\n onPointerDownOutside={onPointerDownOutside}\n onFocusOutside={onFocusOutside}\n onInteractOutside={onInteractOutside}\n // @ts-ignore\n ref={composedRefs}\n onDismiss={() => context.onOpenChange(false)}\n >\n {contents}\n </Dismissable>\n </FocusScope>\n {process.env.NODE_ENV === 'development' && (\n <>\n <TitleWarning titleId={context.titleId} />\n <DescriptionWarning contentRef={contentRef} descriptionId={context.descriptionId} />\n </>\n )}\n </>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'DialogSheetContents'\n\nexport const DialogSheetContents = ({ __scopeDialog }: ScopedProps<{}>) => {\n const context = useDialogContext(SHEET_CONTENTS_NAME, __scopeDialog)\n return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nDialogSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'DialogTitle'\nconst DialogTitleFrame = styled(H2, {\n name: TITLE_NAME,\n})\n\ntype DialogTitleProps = GetProps<typeof DialogTitleFrame>\n\nconst DialogTitle = React.forwardRef<TamaguiElement, DialogTitleProps>(\n (props: ScopedProps<DialogTitleProps>, forwardedRef) => {\n const { __scopeDialog, ...titleProps } = props\n const context = useDialogContext(TITLE_NAME, __scopeDialog)\n return <DialogTitleFrame id={context.titleId} {...titleProps} ref={forwardedRef} />\n }\n)\n\nDialogTitle.displayName = TITLE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogDescriptionFrame = styled(Paragraph, {\n name: 'DialogDescription',\n})\n\ntype DialogDescriptionProps = GetProps<typeof DialogDescriptionFrame>\n\nconst DESCRIPTION_NAME = 'DialogDescription'\n\nconst DialogDescription = React.forwardRef<TamaguiElement, DialogDescriptionProps>(\n (props: ScopedProps<DialogDescriptionProps>, forwardedRef) => {\n const { __scopeDialog, ...descriptionProps } = props\n const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog)\n return (\n <DialogDescriptionFrame id={context.descriptionId} {...descriptionProps} ref={forwardedRef} />\n )\n }\n)\n\nDialogDescription.displayName = DESCRIPTION_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'DialogClose'\n\ntype DialogCloseProps = YStackProps\n\nconst DialogClose = React.forwardRef<TamaguiElement, DialogCloseProps>(\n (props: ScopedProps<DialogCloseProps>, forwardedRef) => {\n const { __scopeDialog, ...closeProps } = props\n const context = useDialogContext(CLOSE_NAME, __scopeDialog)\n const isSheet = useShowDialogSheet(context)\n\n if (isSheet) {\n return null\n }\n\n return (\n <YStack\n tag=\"button\"\n {...closeProps}\n ref={forwardedRef}\n onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n />\n )\n }\n)\n\nDialogClose.displayName = CLOSE_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n return open ? 'open' : 'closed'\n}\n\nconst TITLE_WARNING_NAME = 'DialogTitleWarning'\n\nconst [DialogWarningProvider, useWarningContext] = createContext(TITLE_WARNING_NAME, {\n contentName: CONTENT_NAME,\n titleName: TITLE_NAME,\n docsSlug: 'dialog',\n})\n\ntype TitleWarningProps = { titleId?: string }\n\nconst TitleWarning: React.FC<TitleWarningProps> = ({ titleId }) => {\n const titleWarningContext = useWarningContext(TITLE_WARNING_NAME)\n\n const MESSAGE = `\\`${titleWarningContext.contentName}\\` requires a \\`${titleWarningContext.titleName}\\` for the component to be accessible for screen reader users.\n\nIf you want to hide the \\`${titleWarningContext.titleName}\\`, you can wrap it with our VisuallyHidden component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`\n\n React.useEffect(() => {\n if (!isWeb) return\n if (titleId) {\n const hasTitle = document.getElementById(titleId)\n if (!hasTitle) throw new Error(MESSAGE)\n }\n }, [MESSAGE, titleId])\n\n return null\n}\n\nconst DESCRIPTION_WARNING_NAME = 'DialogDescriptionWarning'\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<TamaguiElement>\n descriptionId?: string\n}\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef, descriptionId }) => {\n const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME)\n const MESSAGE = `Warning: Missing \\`Description\\` or \\`aria-describedby={undefined}\\` for {${descriptionWarningContext.contentName}}.`\n\n React.useEffect(() => {\n if (!isWeb) return\n const contentNode = contentRef.current\n if (!(contentNode instanceof HTMLElement)) {\n return\n }\n const describedById = contentNode.getAttribute('aria-describedby')\n // if we have an id and the user hasn't set aria-describedby={undefined}\n if (descriptionId && describedById) {\n const hasDescription = document.getElementById(descriptionId)\n if (!hasDescription) console.warn(MESSAGE)\n }\n }, [MESSAGE, contentRef, descriptionId])\n\n return null\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Dialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogInner = React.forwardRef<{ open: (val: boolean) => void }, DialogProps>(function Dialog(\n props: ScopedProps<DialogProps>,\n ref\n) {\n const {\n __scopeDialog,\n children,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n modal = true,\n allowPinchZoom = false,\n sheetBreakpoint = false,\n } = props\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const contentRef = React.useRef<TamaguiElement>(null)\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n })\n\n React.useImperativeHandle(\n ref,\n () => ({\n open: setOpen,\n }),\n [setOpen]\n )\n\n return (\n <DialogProvider\n scope={__scopeDialog}\n scopeKey={__scopeDialog ? Object.keys(__scopeDialog)[0] : ''}\n triggerRef={triggerRef}\n contentRef={contentRef}\n contentId={useId() || ''}\n titleId={useId() || ''}\n descriptionId={useId() || ''}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n modal={modal}\n allowPinchZoom={allowPinchZoom}\n sheetBreakpoint={sheetBreakpoint}\n >\n <DialogSheetController onChangeOpen={setOpen} __scopeDialog={__scopeDialog}>\n {children}\n </DialogSheetController>\n </DialogProvider>\n )\n})\n\nconst Dialog = withStaticProperties(DialogInner, {\n Trigger: DialogTrigger,\n Portal: DialogPortal,\n Overlay: DialogOverlay,\n Content: DialogContent,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n SheetContents: DialogSheetContents,\n Sheet,\n})\n\nconst DialogSheetController = (\n props: ScopedProps<{\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }>\n) => {\n const context = useDialogContext('DialogSheetController', props.__scopeDialog)\n const showSheet = useShowDialogSheet(context)\n const breakpointActive = useSheetBreakpointActive(context)\n const getShowSheet = useGet(showSheet)\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\nconst useSheetBreakpointActive = (context: DialogContextValue) => {\n const media = useMedia()\n return context.sheetBreakpoint ? media[context.sheetBreakpoint] : false\n}\n\nconst useShowDialogSheet = (context: DialogContextValue) => {\n const breakpointActive = useSheetBreakpointActive(context)\n return context.open === false ? false : breakpointActive\n}\n\nexport {\n createDialogScope,\n //\n Dialog,\n DialogTrigger,\n DialogPortal,\n DialogOverlay,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n //\n DialogWarningProvider,\n}\nexport type {\n DialogProps,\n DialogTriggerProps,\n DialogPortalProps,\n DialogOverlayProps,\n DialogContentProps,\n DialogTitleProps,\n DialogDescriptionProps,\n DialogCloseProps,\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { AnimatePresence } from '@tamagui/animate-presence'\nimport { hideOthers } from '@tamagui/aria-hidden'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n GetProps,\n MediaQueryKey,\n Slot,\n TamaguiElement,\n Theme,\n composeEventHandlers,\n isWeb,\n styled,\n useGet,\n useId,\n useMedia,\n useThemeName,\n withStaticProperties,\n} from '@tamagui/core'\nimport { Scope, createContext, createContextScope } from '@tamagui/create-context'\nimport { Dismissable, DismissableProps } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\nimport { PortalHost, PortalItem, PortalItemProps } from '@tamagui/portal'\nimport { RemoveScroll } from '@tamagui/remove-scroll'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { H2, Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nconst DIALOG_NAME = 'Dialog'\n\ntype ScopedProps<P> = P & { __scopeDialog?: Scope }\n\nconst [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)\n\ntype RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>\n\ninterface DialogProps {\n sheetBreakpoint?: MediaQueryKey | false\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?(open: boolean): void\n modal?: boolean\n\n /**\n * @see https://github.com/theKashey/react-remove-scroll#usage\n */\n allowPinchZoom?: RemoveScrollProps['allowPinchZoom']\n}\n\ntype NonNull<A> = Exclude<A, void | null>\n\ntype DialogContextValue = {\n triggerRef: React.RefObject<TamaguiElement>\n contentRef: React.RefObject<TamaguiElement>\n contentId: string\n titleId: string\n descriptionId: string\n onOpenToggle(): void\n open: NonNull<DialogProps['open']>\n onOpenChange: NonNull<DialogProps['onOpenChange']>\n modal: NonNull<DialogProps['modal']>\n allowPinchZoom: NonNull<DialogProps['allowPinchZoom']>\n sheetBreakpoint: NonNull<DialogProps['sheetBreakpoint']>\n scopeKey: string\n}\n\nconst [DialogProvider, useDialogContext] = createDialogContext<DialogContextValue>(DIALOG_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'DialogTrigger'\n\nconst DialogTriggerFrame = styled(YStack, {\n name: TRIGGER_NAME,\n})\n\ninterface DialogTriggerProps extends YStackProps {}\n\nconst DialogTrigger = React.forwardRef<TamaguiElement, DialogTriggerProps>(\n (props: ScopedProps<DialogTriggerProps>, forwardedRef) => {\n const { __scopeDialog, ...triggerProps } = props\n const context = useDialogContext(TRIGGER_NAME, __scopeDialog)\n const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef)\n return (\n <DialogTriggerFrame\n tag=\"button\"\n aria-haspopup=\"dialog\"\n aria-expanded={context.open}\n aria-controls={context.contentId}\n data-state={getState(context.open)}\n {...triggerProps}\n ref={composedTriggerRef}\n onPress={composeEventHandlers(props.onPress, context.onOpenToggle)}\n />\n )\n }\n)\n\nDialogTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogPortal\n * -----------------------------------------------------------------------------------------------*/\n\nconst PORTAL_NAME = 'DialogPortal'\n\ntype PortalContextValue = { forceMount?: true }\nconst [PortalProvider, usePortalContext] = createDialogContext<PortalContextValue>(PORTAL_NAME, {\n forceMount: undefined,\n})\n\ntype DialogPortalProps = Omit<PortalItemProps, 'asChild'> &\n YStackProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n }\n\nexport const DialogPortalFrame = styled(YStack, {\n alignItems: 'center',\n justifyContent: 'center',\n fullscreen: true,\n zIndex: 100,\n ...(isWeb && {\n maxHeight: '100vh',\n }),\n})\n\nconst DialogPortal: React.FC<DialogPortalProps> = DialogPortalFrame.extractable(\n (props: ScopedProps<DialogPortalProps>) => {\n const { __scopeDialog, forceMount, children, ...frameProps } = props\n const themeName = useThemeName()\n const context = useDialogContext(PORTAL_NAME, __scopeDialog)\n const isShowing = forceMount || context.open\n const contents = <AnimatePresence>{isShowing ? children : null}</AnimatePresence>\n const isSheet = useShowDialogSheet(context)\n if (!context.modal || isSheet) {\n return contents\n }\n return (\n <PortalItem>\n {/* until we can use react-native portals natively */}\n {/* have to re-propogate context, sketch */}\n <DialogProvider scope={__scopeDialog} {...context}>\n <Theme name={themeName}>\n <PortalProvider scope={__scopeDialog} forceMount={forceMount}>\n <DialogPortalFrame pointerEvents={isShowing ? 'auto' : 'none'} {...frameProps}>\n {contents}\n </DialogPortalFrame>\n </PortalProvider>\n </Theme>\n </DialogProvider>\n </PortalItem>\n )\n }\n)\n\nDialogPortal.displayName = PORTAL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogOverlay\n * -----------------------------------------------------------------------------------------------*/\n\nconst OVERLAY_NAME = 'DialogOverlay'\n\nconst DialogOverlayFrame = styled(ThemeableStack, {\n name: OVERLAY_NAME,\n backgrounded: true,\n fullscreen: true,\n})\n\ninterface DialogOverlayProps extends YStackProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogOverlay = React.forwardRef<TamaguiElement, DialogOverlayProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogOverlayProps>, forwardedRef) => {\n const portalContext = usePortalContext(OVERLAY_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...overlayProps } = props\n const context = useDialogContext(OVERLAY_NAME, __scopeDialog)\n const showSheet = useShowDialogSheet(context)\n\n if (!forceMount) {\n if (!context.modal || showSheet) {\n return null\n }\n }\n\n return <DialogOverlayImpl context={context} {...overlayProps} ref={forwardedRef} />\n }\n)\n\nDialogOverlay.displayName = OVERLAY_NAME\n\ntype DialogOverlayImplProps = GetProps<typeof DialogOverlayFrame> & {\n context: DialogContextValue\n}\n\nconst DialogOverlayImpl = React.forwardRef<TamaguiElement, DialogOverlayImplProps>(\n (props, forwardedRef) => {\n const { context, ...overlayProps } = props\n\n return (\n // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`\n // ie. when `Overlay` and `Content` are siblings\n <RemoveScroll\n enabled={context.open}\n as={Slot}\n allowPinchZoom={context.allowPinchZoom}\n shards={[context.contentRef]}\n // causes lots of bugs on touch web on site\n removeScrollBar={false}\n >\n <DialogOverlayFrame\n data-state={getState(context.open)}\n // We re-enable pointer-events prevented by `Dialog.Content` to allow scrolling the overlay.\n pointerEvents={context.open ? 'auto' : 'none'}\n {...overlayProps}\n ref={forwardedRef}\n />\n </RemoveScroll>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'DialogContent'\n\nconst DialogContentFrame = styled(ThemeableStack, {\n name: CONTENT_NAME,\n tag: 'dialog',\n position: 'relative',\n backgrounded: true,\n padded: true,\n radiused: true,\n elevate: true,\n\n variants: {\n size: {\n '...size': (val, extras) => {\n return {}\n },\n },\n },\n\n defaultVariants: {\n size: '$4',\n },\n})\n\ntype DialogContentFrameProps = GetProps<typeof DialogContentFrame>\n\ninterface DialogContentProps\n extends DialogContentFrameProps,\n Omit<DialogContentTypeProps, 'context'> {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n}\n\nconst DialogContent = DialogContentFrame.extractable(\n React.forwardRef<TamaguiElement, DialogContentProps>(\n ({ __scopeDialog, ...props }: ScopedProps<DialogContentProps>, forwardedRef) => {\n const portalContext = usePortalContext(CONTENT_NAME, __scopeDialog)\n const { forceMount = portalContext.forceMount, ...contentProps } = props\n const context = useDialogContext(CONTENT_NAME, __scopeDialog)\n\n return (\n <>\n {context.modal ? (\n <DialogContentModal context={context} {...contentProps} ref={forwardedRef} />\n ) : (\n <DialogContentNonModal context={context} {...contentProps} ref={forwardedRef} />\n )}\n </>\n )\n }\n )\n)\n\nDialogContent.displayName = CONTENT_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\ninterface DialogContentTypeProps\n extends Omit<DialogContentImplProps, 'trapFocus' | 'disableOutsidePointerEvents'> {\n context: DialogContextValue\n}\n\nconst DialogContentModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n ({ children, context, ...props }: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef)\n\n // aria-hide everything except the content (better supported equivalent to setting aria-modal)\n React.useEffect(() => {\n if (!context.open) return\n const content = contentRef.current\n if (content) return hideOthers(content)\n }, [context.open])\n\n return (\n <DialogContentImpl\n {...props}\n context={context}\n ref={composedRefs}\n // we make sure focus isn't trapped once `DialogContent` has been closed\n // (closed !== unmounted when animating out)\n trapFocus={context.open}\n disableOutsidePointerEvents\n onCloseAutoFocus={composeEventHandlers(props.onCloseAutoFocus, (event) => {\n event.preventDefault()\n context.triggerRef.current?.focus()\n })}\n onPointerDownOutside={composeEventHandlers(props.onPointerDownOutside, (event) => {\n const originalEvent = event['detail'].originalEvent\n const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true\n const isRightClick = originalEvent.button === 2 || ctrlLeftClick\n // If the event is a right-click, we shouldn't close because\n // it is effectively as if we right-clicked the `Overlay`.\n if (isRightClick) event.preventDefault()\n })}\n // When focus is trapped, a `focusout` event may still happen.\n // We make sure we don't trigger our `onDismiss` in such case.\n onFocusOutside={composeEventHandlers(props.onFocusOutside, (event) =>\n event.preventDefault()\n )}\n >\n {children}\n </DialogContentImpl>\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\nconst DialogContentNonModal = React.forwardRef<TamaguiElement, DialogContentTypeProps>(\n (props: ScopedProps<DialogContentTypeProps>, forwardedRef) => {\n const hasInteractedOutsideRef = React.useRef(false)\n\n return (\n <DialogContentImpl\n {...props}\n ref={forwardedRef}\n trapFocus={false}\n disableOutsidePointerEvents={false}\n onCloseAutoFocus={(event) => {\n console.log('on close autofocus')\n props.onCloseAutoFocus?.(event)\n\n if (!event.defaultPrevented) {\n if (!hasInteractedOutsideRef.current) {\n props.context.triggerRef.current?.focus()\n }\n // Always prevent auto focus because we either focus manually or want user agent focus\n event.preventDefault()\n }\n\n hasInteractedOutsideRef.current = false\n }}\n onInteractOutside={(event) => {\n props.onInteractOutside?.(event)\n\n if (!event.defaultPrevented) hasInteractedOutsideRef.current = true\n\n // Prevent dismissing when clicking the trigger.\n // As the trigger is already setup to close, without doing so would\n // cause it to close and immediately open.\n //\n // We use `onInteractOutside` as some browsers also\n // focus on pointer down, creating the same issue.\n const target = event.target as HTMLElement\n const trigger = props.context.triggerRef.current\n if (!(trigger instanceof HTMLElement)) return\n const targetIsTrigger = trigger.contains(target)\n if (targetIsTrigger) event.preventDefault()\n }}\n />\n )\n }\n)\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DialogContentImplProps = DialogContentFrameProps &\n Omit<DismissableProps, 'onDismiss'> & {\n /**\n * When `true`, focus cannot escape the `Content` via keyboard,\n * pointer, or a programmatic focus.\n * @defaultValue false\n */\n trapFocus?: FocusScopeProps['trapped']\n\n /**\n * Event handler called when auto-focusing on open.\n * Can be prevented.\n */\n onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus']\n\n /**\n * Event handler called when auto-focusing on close.\n * Can be prevented.\n */\n onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus']\n\n context: DialogContextValue\n }\n\nconst DialogContentImpl = React.forwardRef<TamaguiElement, DialogContentImplProps>(\n (props: ScopedProps<DialogContentImplProps>, forwardedRef) => {\n const {\n __scopeDialog,\n trapFocus,\n onOpenAutoFocus,\n onCloseAutoFocus,\n disableOutsidePointerEvents,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n context,\n ...contentProps\n } = props\n const contentRef = React.useRef<HTMLDivElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, contentRef)\n const showSheet = useShowDialogSheet(context)\n\n const contents = (\n <DialogContentFrame\n id={context.contentId}\n aria-describedby={context.descriptionId}\n aria-labelledby={context.titleId}\n data-state={getState(context.open)}\n {...contentProps}\n />\n )\n\n if (showSheet) {\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n {contentProps.children}\n </PortalItem>\n )\n }\n\n if (!isWeb) {\n return contents\n }\n\n return (\n <>\n <FocusScope\n loop\n trapped={trapFocus}\n onMountAutoFocus={onOpenAutoFocus}\n forceUnmount={!context.open}\n onUnmountAutoFocus={onCloseAutoFocus}\n >\n <Dismissable\n disableOutsidePointerEvents={context.open && disableOutsidePointerEvents}\n forceUnmount={!context.open}\n onEscapeKeyDown={onEscapeKeyDown}\n onPointerDownOutside={onPointerDownOutside}\n onFocusOutside={onFocusOutside}\n onInteractOutside={onInteractOutside}\n // @ts-ignore\n ref={composedRefs}\n onDismiss={() => context.onOpenChange(false)}\n >\n {contents}\n </Dismissable>\n </FocusScope>\n {process.env.NODE_ENV === 'development' && (\n <>\n <TitleWarning titleId={context.titleId} />\n <DescriptionWarning contentRef={contentRef} descriptionId={context.descriptionId} />\n </>\n )}\n </>\n )\n }\n)\n\n/* -------------------------------------------------------------------------------------------------\n * DialogSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'DialogSheetContents'\n\nexport const DialogSheetContents = ({ __scopeDialog }: ScopedProps<{}>) => {\n const context = useDialogContext(SHEET_CONTENTS_NAME, __scopeDialog)\n return <PortalHost name={`${context.scopeKey}SheetContents`}></PortalHost>\n}\n\nDialogSheetContents.displayName = SHEET_CONTENTS_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogTitle\n * -----------------------------------------------------------------------------------------------*/\n\nconst TITLE_NAME = 'DialogTitle'\nconst DialogTitleFrame = styled(H2, {\n name: TITLE_NAME,\n})\n\ntype DialogTitleProps = GetProps<typeof DialogTitleFrame>\n\nconst DialogTitle = React.forwardRef<TamaguiElement, DialogTitleProps>(\n (props: ScopedProps<DialogTitleProps>, forwardedRef) => {\n const { __scopeDialog, ...titleProps } = props\n const context = useDialogContext(TITLE_NAME, __scopeDialog)\n return <DialogTitleFrame id={context.titleId} {...titleProps} ref={forwardedRef} />\n }\n)\n\nDialogTitle.displayName = TITLE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogDescription\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogDescriptionFrame = styled(Paragraph, {\n name: 'DialogDescription',\n})\n\ntype DialogDescriptionProps = GetProps<typeof DialogDescriptionFrame>\n\nconst DESCRIPTION_NAME = 'DialogDescription'\n\nconst DialogDescription = React.forwardRef<TamaguiElement, DialogDescriptionProps>(\n (props: ScopedProps<DialogDescriptionProps>, forwardedRef) => {\n const { __scopeDialog, ...descriptionProps } = props\n const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog)\n return (\n <DialogDescriptionFrame id={context.descriptionId} {...descriptionProps} ref={forwardedRef} />\n )\n }\n)\n\nDialogDescription.displayName = DESCRIPTION_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * DialogClose\n * -----------------------------------------------------------------------------------------------*/\n\nconst CLOSE_NAME = 'DialogClose'\n\ntype DialogCloseProps = YStackProps\n\nconst DialogClose = React.forwardRef<TamaguiElement, DialogCloseProps>(\n (props: ScopedProps<DialogCloseProps>, forwardedRef) => {\n const { __scopeDialog, ...closeProps } = props\n const context = useDialogContext(CLOSE_NAME, __scopeDialog)\n const isSheet = useShowDialogSheet(context)\n\n if (isSheet) {\n return null\n }\n\n return (\n <YStack\n tag=\"button\"\n {...closeProps}\n ref={forwardedRef}\n onPress={composeEventHandlers(props.onPress, () => context.onOpenChange(false))}\n />\n )\n }\n)\n\nDialogClose.displayName = CLOSE_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open: boolean) {\n return open ? 'open' : 'closed'\n}\n\nconst TITLE_WARNING_NAME = 'DialogTitleWarning'\n\nconst [DialogWarningProvider, useWarningContext] = createContext(TITLE_WARNING_NAME, {\n contentName: CONTENT_NAME,\n titleName: TITLE_NAME,\n docsSlug: 'dialog',\n})\n\ntype TitleWarningProps = { titleId?: string }\n\nconst TitleWarning: React.FC<TitleWarningProps> = ({ titleId }) => {\n const titleWarningContext = useWarningContext(TITLE_WARNING_NAME)\n\n const MESSAGE = `\\`${titleWarningContext.contentName}\\` requires a \\`${titleWarningContext.titleName}\\` for the component to be accessible for screen reader users.\n\nIf you want to hide the \\`${titleWarningContext.titleName}\\`, you can wrap it with our VisuallyHidden component.\n\nFor more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`\n\n React.useEffect(() => {\n if (!isWeb) return\n if (titleId) {\n const hasTitle = document.getElementById(titleId)\n if (!hasTitle) throw new Error(MESSAGE)\n }\n }, [MESSAGE, titleId])\n\n return null\n}\n\nconst DESCRIPTION_WARNING_NAME = 'DialogDescriptionWarning'\n\ntype DescriptionWarningProps = {\n contentRef: React.RefObject<TamaguiElement>\n descriptionId?: string\n}\n\nconst DescriptionWarning: React.FC<DescriptionWarningProps> = ({ contentRef, descriptionId }) => {\n const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME)\n const MESSAGE = `Warning: Missing \\`Description\\` or \\`aria-describedby={undefined}\\` for {${descriptionWarningContext.contentName}}.`\n\n React.useEffect(() => {\n if (!isWeb) return\n const contentNode = contentRef.current\n if (!(contentNode instanceof HTMLElement)) {\n return\n }\n const describedById = contentNode.getAttribute('aria-describedby')\n // if we have an id and the user hasn't set aria-describedby={undefined}\n if (descriptionId && describedById) {\n const hasDescription = document.getElementById(descriptionId)\n if (!hasDescription) console.warn(MESSAGE)\n }\n }, [MESSAGE, contentRef, descriptionId])\n\n return null\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Dialog\n * -----------------------------------------------------------------------------------------------*/\n\nconst DialogInner = React.forwardRef<{ open: (val: boolean) => void }, DialogProps>(function Dialog(\n props: ScopedProps<DialogProps>,\n ref\n) {\n const {\n __scopeDialog,\n children,\n open: openProp,\n defaultOpen = false,\n onOpenChange,\n modal = true,\n allowPinchZoom = false,\n sheetBreakpoint = false,\n } = props\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const contentRef = React.useRef<TamaguiElement>(null)\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n })\n\n React.useImperativeHandle(\n ref,\n () => ({\n open: setOpen,\n }),\n [setOpen]\n )\n\n return (\n <DialogProvider\n scope={__scopeDialog}\n scopeKey={__scopeDialog ? Object.keys(__scopeDialog)[0] : ''}\n triggerRef={triggerRef}\n contentRef={contentRef}\n contentId={useId() || ''}\n titleId={useId() || ''}\n descriptionId={useId() || ''}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen])}\n modal={modal}\n allowPinchZoom={allowPinchZoom}\n sheetBreakpoint={sheetBreakpoint}\n >\n <DialogSheetController onChangeOpen={setOpen} __scopeDialog={__scopeDialog}>\n {children}\n </DialogSheetController>\n </DialogProvider>\n )\n})\n\nconst Dialog = withStaticProperties(DialogInner, {\n Trigger: DialogTrigger,\n Portal: DialogPortal,\n Overlay: DialogOverlay,\n Content: DialogContent,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n SheetContents: DialogSheetContents,\n Sheet,\n})\n\nconst DialogSheetController = (\n props: ScopedProps<{\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }>\n) => {\n const context = useDialogContext('DialogSheetController', props.__scopeDialog)\n const showSheet = useShowDialogSheet(context)\n const breakpointActive = useSheetBreakpointActive(context)\n const getShowSheet = useGet(showSheet)\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\nconst useSheetBreakpointActive = (context: DialogContextValue) => {\n const media = useMedia()\n return context.sheetBreakpoint ? media[context.sheetBreakpoint] : false\n}\n\nconst useShowDialogSheet = (context: DialogContextValue) => {\n const breakpointActive = useSheetBreakpointActive(context)\n return context.open === false ? false : breakpointActive\n}\n\nexport {\n createDialogScope,\n //\n Dialog,\n DialogTrigger,\n DialogPortal,\n DialogOverlay,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n //\n DialogWarningProvider,\n}\nexport type {\n DialogProps,\n DialogTriggerProps,\n DialogPortalProps,\n DialogOverlayProps,\n DialogContentProps,\n DialogTitleProps,\n DialogDescriptionProps,\n DialogCloseProps,\n}\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/jsx/index.js CHANGED
File without changes
File without changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/dialog",
3
- "version": "1.0.1-beta.138",
3
+ "version": "1.0.1-beta.141",
4
4
  "source": "src/index.ts",
5
5
  "types": "./types/index.d.ts",
6
6
  "main": "dist/cjs",
@@ -23,21 +23,21 @@
23
23
  "clean:build": "tamagui-build clean:build"
24
24
  },
25
25
  "dependencies": {
26
- "@tamagui/animate-presence": "^1.0.1-beta.138",
27
- "@tamagui/aria-hidden": "^1.0.1-beta.138",
28
- "@tamagui/compose-refs": "^1.0.1-beta.138",
29
- "@tamagui/core": "^1.0.1-beta.138",
30
- "@tamagui/create-context": "^1.0.1-beta.138",
31
- "@tamagui/dismissable": "^1.0.1-beta.138",
32
- "@tamagui/focus-scope": "^1.0.1-beta.138",
33
- "@tamagui/polyfill-dev": "^1.0.1-beta.138",
34
- "@tamagui/popper": "^1.0.1-beta.138",
35
- "@tamagui/portal": "^1.0.1-beta.138",
36
- "@tamagui/remove-scroll": "^1.0.1-beta.138",
37
- "@tamagui/sheet": "^1.0.1-beta.138",
38
- "@tamagui/stacks": "^1.0.1-beta.138",
39
- "@tamagui/text": "^1.0.1-beta.138",
40
- "@tamagui/use-controllable-state": "^1.0.1-beta.138"
26
+ "@tamagui/animate-presence": "^1.0.1-beta.141",
27
+ "@tamagui/aria-hidden": "^1.0.1-beta.141",
28
+ "@tamagui/compose-refs": "^1.0.1-beta.141",
29
+ "@tamagui/core": "^1.0.1-beta.141",
30
+ "@tamagui/create-context": "^1.0.1-beta.141",
31
+ "@tamagui/dismissable": "^1.0.1-beta.141",
32
+ "@tamagui/focus-scope": "^1.0.1-beta.141",
33
+ "@tamagui/polyfill-dev": "^1.0.1-beta.141",
34
+ "@tamagui/popper": "^1.0.1-beta.141",
35
+ "@tamagui/portal": "^1.0.1-beta.141",
36
+ "@tamagui/remove-scroll": "^1.0.1-beta.141",
37
+ "@tamagui/sheet": "^1.0.1-beta.141",
38
+ "@tamagui/stacks": "^1.0.1-beta.141",
39
+ "@tamagui/text": "^1.0.1-beta.141",
40
+ "@tamagui/use-controllable-state": "^1.0.1-beta.141"
41
41
  },
42
42
  "peerDependencies": {
43
43
  "react": "*",
@@ -45,7 +45,7 @@
45
45
  "react-native": "*"
46
46
  },
47
47
  "devDependencies": {
48
- "@tamagui/build": "^1.0.1-beta.138",
48
+ "@tamagui/build": "^1.0.1-beta.141",
49
49
  "@types/react-dom": "^18.0.3",
50
50
  "@types/react-native": "^0.69.2",
51
51
  "react": "*",
package/src/Dialog.tsx CHANGED
@@ -3,7 +3,7 @@ import { hideOthers } from '@tamagui/aria-hidden'
3
3
  import { useComposedRefs } from '@tamagui/compose-refs'
4
4
  import {
5
5
  GetProps,
6
- MediaPropKeys,
6
+ MediaQueryKey,
7
7
  Slot,
8
8
  TamaguiElement,
9
9
  Theme,
@@ -36,7 +36,7 @@ const [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME)
36
36
  type RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>
37
37
 
38
38
  interface DialogProps {
39
- sheetBreakpoint?: MediaPropKeys | false
39
+ sheetBreakpoint?: MediaQueryKey | false
40
40
  children?: React.ReactNode
41
41
  open?: boolean
42
42
  defaultOpen?: boolean
package/types/Dialog.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { GetProps, MediaPropKeys, TamaguiElement } from '@tamagui/core';
1
+ import { GetProps, MediaQueryKey, TamaguiElement } from '@tamagui/core';
2
2
  import { Scope } from '@tamagui/create-context';
3
3
  import { DismissableProps } from '@tamagui/dismissable';
4
4
  import { FocusScopeProps } from '@tamagui/focus-scope';
@@ -12,7 +12,7 @@ declare type ScopedProps<P> = P & {
12
12
  declare const createDialogScope: import("@tamagui/create-context").CreateScope;
13
13
  declare type RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>;
14
14
  interface DialogProps {
15
- sheetBreakpoint?: MediaPropKeys | false;
15
+ sheetBreakpoint?: MediaQueryKey | false;
16
16
  children?: React.ReactNode;
17
17
  open?: boolean;
18
18
  defaultOpen?: boolean;