@react-md/core 6.5.1 → 7.0.0

package/dist/dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { type HTMLAttributes, forwardRef, useState } from \"react\";\n\nimport { useSsr } from \"../SsrProvider.js\";\nimport {\n  type FocusContainerComponentProps,\n  useFocusContainer,\n} from \"../focus/useFocusContainer.js\";\nimport { Overlay } from \"../overlay/Overlay.js\";\nimport { Portal } from \"../portal/Portal.js\";\nimport { useScrollLock } from \"../scroll/useScrollLock.js\";\nimport {\n  type CSSTransitionClassNames,\n  type CSSTransitionComponentProps,\n  type TransitionActions,\n  type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useCSSTransition } from \"../transition/useCSSTransition.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n  type ConfigurableDialogContainerProps,\n  DialogContainer,\n} from \"./DialogContainer.js\";\nimport {\n  NestedDialogProvider,\n  useNestedDialogContext,\n} from \"./NestedDialogProvider.js\";\nimport {\n  DEFAULT_DIALOG_CLASSNAMES,\n  DEFAULT_DIALOG_TIMEOUT,\n  type DialogType,\n  type DialogWidth,\n  dialog,\n} from \"./styles.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\nconst noopBool = (): boolean => false;\n\nexport interface BaseDialogProps\n  extends\n    HTMLAttributes<HTMLDivElement>,\n    CSSTransitionComponentProps,\n    TransitionActions,\n    FocusContainerComponentProps {\n  /**\n   * @defaultValue `\"dialog-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * @defaultValue `\"centered\"`\n   */\n  type?: DialogType;\n\n  /**\n   * @see {@link DialogWidth}\n   * @defaultValue `\"auto\"`\n   */\n  width?: DialogWidth;\n\n  /**\n   * @defaultValue `\"dialog\"`\n   */\n  role?: \"dialog\" | \"alertdialog\" | \"menu\" | \"none\";\n\n  /**\n   * This value controls the visibility of the dialog.\n   */\n  visible: boolean;\n\n  /**\n   * This function should set the {@link visible} prop to false to hide the\n   * modal when:\n   * - the {@link modal} and {@link disableEscapeClose} props are `false` and\n   *   the user presses the `\"Escape\"` key.\n   * - The overlay element is clicked\n   */\n  onRequestClose: () => void;\n\n  /** @defaultValue `false` */\n  disableTransition?: boolean;\n\n  /** @defaultValue `-1` */\n  tabIndex?: number;\n\n  /**\n   * Set this value to `true` if the dialog should behave as a modal which\n   * prevents the modal from being closed by pressing the `\"Escape\"` key or\n   * clicking the overlay. The user **must** click one of the actions within the\n   * dialog instead.\n   *\n   * @defaultValue `false`\n   */\n  modal?: boolean;\n\n  /**\n   * Set this to `true` if the dialog should no longer use the `Portal`\n   * behavior.\n   *\n   * @defaultValue `false`\n   */\n  disablePortal?: boolean;\n\n  /**\n   * Set this to `true` if you want the page to still be scrollable while the\n   * dialog is visible. This should normally be `true` for popovers/fixed\n   * dialogs.\n   *\n   * @defaultValue `type === \"custom\"`\n   */\n  disableScrollLock?: boolean;\n\n  /**\n   * Set this to `true` to prevent the dialog from being closed when the\n   * `\"Escape\"` key is pressed. This is `true` by default when the {@link modal}\n   * prop is `true`\n   *\n   * @defaultValue `modal`\n   */\n  disableEscapeClose?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should not appear behind the dialog.\n   *\n   * Note: this was changed from `type === \"full-page\"` to `false` so that you\n   * can change between full-page and centered based on media queries. If the\n   * type changes the overlay would end up rendering above the dialog instead of\n   * behind.\n   *\n   * @see {@link overlayHidden}\n   * @defaultValue `false`\n   */\n  disableOverlay?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should be appear behind the dialog but\n   * have an `opacity: 0`. This is useful if you want to prevent other elements\n   * on the page from being clicked while the dialog is visible, but don't want\n   * a dark background. i.e. popovers/fixed dialogs.\n   *\n   * @defaultValue `false`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * Any additional props that should be passed to the overlay element if it is\n   * rendered.\n   */\n  overlayProps?: HTMLAttributes<HTMLSpanElement>;\n\n  /**\n   * Any additional props that should be passed to the container element when\n   * the `type !== \"custom\"`.\n   */\n  containerProps?: PropsWithRef<ConfigurableDialogContainerProps>;\n\n  /**\n   * @see {@link DEFAULT_DIALOG_TIMEOUT}\n   * @defaultValue `DEFAULT_DIALOG_TIMEOUT`\n   */\n  timeout?: TransitionTimeout;\n\n  /**\n   * @see {@link DEFAULT_DIALOG_CLASSNAMES}\n   * @defaultValue `DEFAULT_DIALOG_CLASSNAMES`\n   */\n  classNames?: CSSTransitionClassNames;\n\n  /**\n   * Set this to `true` if the `Dialog` should not gain the normal focus box\n   * shadow while it is focused. The `Dialog` should normally only gain focus\n   * when it becomes visible and no child elements have `autoFocus` enabled.\n   *\n   * @since 6.0.0\n   * @defaultValue `type === \"full-page\"`\n   */\n  disableFocusOutline?: boolean;\n}\n\nexport type DialogProps = LabelRequiredForA11y<BaseDialogProps>;\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Dialog } from \"@react-md/core/dialog/Dialog\";\n * import { DialogContent } from \"@react-md/core/dialog/DialogContent\";\n * import { DialogFooter } from \"@react-md/core/dialog/DialogFooter\";\n * import { DialogHeader } from \"@react-md/core/dialog/DialogHeader\";\n * import { DialogTitle } from \"@react-md/core/dialog/DialogTitle\";\n * import { Typography } from \"@react-md/core/typography/Typography\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *\n *   return (\n *     <>\n *       <Button onClick={toggle}>Toggle</Button>\n *       <Dialog\n *         aria-labelledby=\"dialog-title\"\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id=\"dialog-title\">Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </Dialog>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n * @since 6.0.0 The `Dialog` no longer supports focusing elements\n * within once it becomes visible. You must manually add `autoFocus` to a\n * element instead.\n */\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(\n  function Dialog(props, ref) {\n    const {\n      id: propId,\n      modal = false,\n      role = modal ? \"alertdialog\" : \"dialog\",\n      type = \"centered\",\n      width,\n      tabIndex = -1,\n      visible,\n      onRequestClose,\n      containerProps,\n      temporary = true,\n      className,\n      timeout = DEFAULT_DIALOG_TIMEOUT,\n      classNames = DEFAULT_DIALOG_CLASSNAMES,\n      disableTransition = false,\n      appear = false,\n      enter = true,\n      exit = true,\n      onEnter = noop,\n      onEntering = noop,\n      onEntered = noop,\n      onExit = noop,\n      onExiting = noop,\n      onExited = noop,\n      exitedHidden = true,\n      disableOverlay = false,\n      overlayProps,\n      overlayHidden,\n      onKeyDown = noop,\n      isFocusTypeDisabled = noopBool,\n      disablePortal: propDisablePortal,\n      disableScrollLock = false,\n      disableEscapeClose = modal,\n      disableFocusOutline = type === \"full-page\",\n      children,\n      ...remaining\n    } = props;\n    const id = useEnsuredId(propId, \"dialog\");\n\n    const ssr = useSsr();\n    const setChildVisible = useNestedDialogContext();\n\n    // this makes it so that as more non-full page dialogs become visible, the\n    // overlay does not become darker as more and more overlays are stacked upon\n    // each other. only the top-most overlay will have and active background\n    // color.\n    const [isChildVisible, setIsChildVisible] = useState(false);\n    const { eventHandlers, transitionOptions } = useFocusContainer({\n      nodeRef: ref,\n      activate: visible,\n      onEnter(appearing) {\n        onEnter(appearing);\n        setChildVisible(type !== \"full-page\");\n      },\n      onEntered(appear) {\n        onEntered(appear);\n        // this needs to be called onEnter and onEntered just in case the\n        // transition is disabled\n        setChildVisible(type !== \"full-page\");\n      },\n      onEntering,\n      onExit() {\n        onExit();\n        setChildVisible(false);\n      },\n      onExiting,\n      onExited() {\n        onExited();\n        // this needs to be called onExit and onExited just in case the\n        // transition is disabled\n        setChildVisible(false);\n      },\n      disableTransition,\n      onKeyDown(event) {\n        onKeyDown(event);\n        if (\n          event.isPropagationStopped() ||\n          modal ||\n          disableEscapeClose ||\n          event.key !== \"Escape\"\n        ) {\n          return;\n        }\n\n        // prevent parent dialogs from closing as well\n        event.stopPropagation();\n        onRequestClose();\n      },\n      isFocusTypeDisabled,\n    });\n    const { elementProps, stage, rendered, disablePortal } = useCSSTransition({\n      transitionIn: visible,\n      timeout,\n      classNames,\n      className: dialog({\n        type,\n        width,\n        fixed: type === \"custom\",\n        outline: !disableFocusOutline,\n        disableBoxShadow: isChildVisible,\n        className,\n      }),\n      appear: appear && !disableTransition && !ssr,\n      enter: enter && !disableTransition,\n      exit: exit && !disableTransition,\n      temporary,\n      exitedHidden,\n      disablePortal: propDisablePortal,\n      ...transitionOptions,\n    });\n    useScrollLock(!disableScrollLock && visible);\n\n    return (\n      <NestedDialogProvider value={setIsChildVisible}>\n        {!disableOverlay && (\n          <Overlay\n            visible={visible}\n            disableTransition={disableTransition}\n            temporary={temporary}\n            disablePortal={disablePortal}\n            {...overlayProps}\n            onClick={modal ? noop : onRequestClose}\n            clickable={!modal}\n            noOpacity={overlayHidden || isChildVisible}\n          />\n        )}\n        <Portal disabled={disablePortal}>\n          {rendered && (\n            <DialogContainer\n              enabled={type !== \"custom\"}\n              {...containerProps}\n              centered={type === \"centered\"}\n              displayNone={!temporary && exitedHidden && stage === \"exited\"}\n            >\n              <div\n                aria-modal={modal || undefined}\n                {...remaining}\n                {...elementProps}\n                {...eventHandlers}\n                id={id}\n                role={role}\n                tabIndex={tabIndex}\n              >\n                {children}\n              </div>\n            </DialogContainer>\n          )}\n        </Portal>\n      </NestedDialogProvider>\n    );\n  }\n);\n"],"names":["forwardRef","useState","useSsr","useFocusContainer","Overlay","Portal","useScrollLock","useCSSTransition","useEnsuredId","DialogContainer","NestedDialogProvider","useNestedDialogContext","DEFAULT_DIALOG_CLASSNAMES","DEFAULT_DIALOG_TIMEOUT","dialog","noop","noopBool","Dialog","props","ref","id","propId","modal","role","type","width","tabIndex","visible","onRequestClose","containerProps","temporary","className","timeout","classNames","disableTransition","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","exitedHidden","disableOverlay","overlayProps","overlayHidden","onKeyDown","isFocusTypeDisabled","disablePortal","propDisablePortal","disableScrollLock","disableEscapeClose","disableFocusOutline","children","remaining","ssr","setChildVisible","isChildVisible","setIsChildVisible","eventHandlers","transitionOptions","nodeRef","activate","appearing","event","isPropagationStopped","key","stopPropagation","elementProps","stage","rendered","transitionIn","fixed","outline","disableBoxShadow","value","onClick","clickable","noOpacity","disabled","enabled","centered","displayNone","div","aria-modal","undefined"],"mappings":"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"}
+{"version":3,"sources":["../../src/dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  type HTMLAttributes,\n  type ReactElement,\n  type Ref,\n  useState,\n} from \"react\";\n\nimport { useSsr } from \"../SsrProvider.js\";\nimport {\n  type FocusContainerComponentProps,\n  useFocusContainer,\n} from \"../focus/useFocusContainer.js\";\nimport { Overlay } from \"../overlay/Overlay.js\";\nimport { Portal } from \"../portal/Portal.js\";\nimport { useScrollLock } from \"../scroll/useScrollLock.js\";\nimport {\n  type CSSTransitionClassNames,\n  type CSSTransitionComponentProps,\n  type TransitionActions,\n  type TransitionTimeout,\n} from \"../transition/types.js\";\nimport { useCSSTransition } from \"../transition/useCSSTransition.js\";\nimport { type LabelRequiredForA11y, type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport {\n  type ConfigurableDialogContainerProps,\n  DialogContainer,\n} from \"./DialogContainer.js\";\nimport {\n  NestedDialogProvider,\n  useNestedDialogContext,\n} from \"./NestedDialogProvider.js\";\nimport {\n  DEFAULT_DIALOG_CLASSNAMES,\n  DEFAULT_DIALOG_TIMEOUT,\n  type DialogType,\n  type DialogWidth,\n  dialog,\n} from \"./styles.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\nconst noopBool = (): boolean => false;\n\nexport interface BaseDialogProps\n  extends\n    HTMLAttributes<HTMLDivElement>,\n    CSSTransitionComponentProps,\n    TransitionActions,\n    FocusContainerComponentProps {\n  ref?: Ref<HTMLDivElement>;\n\n  /**\n   * @defaultValue `\"dialog-\" + useId()`\n   */\n  id?: string;\n\n  /**\n   * @defaultValue `\"centered\"`\n   */\n  type?: DialogType;\n\n  /**\n   * @see {@link DialogWidth}\n   * @defaultValue `\"auto\"`\n   */\n  width?: DialogWidth;\n\n  /**\n   * @defaultValue `\"dialog\"`\n   */\n  role?: \"dialog\" | \"alertdialog\" | \"menu\" | \"none\";\n\n  /**\n   * This value controls the visibility of the dialog.\n   */\n  visible: boolean;\n\n  /**\n   * This function should set the {@link visible} prop to false to hide the\n   * modal when:\n   * - the {@link modal} and {@link disableEscapeClose} props are `false` and\n   *   the user presses the `\"Escape\"` key.\n   * - The overlay element is clicked\n   */\n  onRequestClose: () => void;\n\n  /** @defaultValue `false` */\n  disableTransition?: boolean;\n\n  /** @defaultValue `-1` */\n  tabIndex?: number;\n\n  /**\n   * Set this value to `true` if the dialog should behave as a modal which\n   * prevents the modal from being closed by pressing the `\"Escape\"` key or\n   * clicking the overlay. The user **must** click one of the actions within the\n   * dialog instead.\n   *\n   * @defaultValue `false`\n   */\n  modal?: boolean;\n\n  /**\n   * Set this to `true` if the dialog should no longer use the `Portal`\n   * behavior.\n   *\n   * @defaultValue `false`\n   */\n  disablePortal?: boolean;\n\n  /**\n   * Set this to `true` if you want the page to still be scrollable while the\n   * dialog is visible. This should normally be `true` for popovers/fixed\n   * dialogs.\n   *\n   * @defaultValue `type === \"custom\"`\n   */\n  disableScrollLock?: boolean;\n\n  /**\n   * Set this to `true` to prevent the dialog from being closed when the\n   * `\"Escape\"` key is pressed. This is `true` by default when the {@link modal}\n   * prop is `true`\n   *\n   * @defaultValue `modal`\n   */\n  disableEscapeClose?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should not appear behind the dialog.\n   *\n   * Note: this was changed from `type === \"full-page\"` to `false` so that you\n   * can change between full-page and centered based on media queries. If the\n   * type changes the overlay would end up rendering above the dialog instead of\n   * behind.\n   *\n   * @see {@link overlayHidden}\n   * @defaultValue `false`\n   */\n  disableOverlay?: boolean;\n\n  /**\n   * Set this to `true` if an overlay should be appear behind the dialog but\n   * have an `opacity: 0`. This is useful if you want to prevent other elements\n   * on the page from being clicked while the dialog is visible, but don't want\n   * a dark background. i.e. popovers/fixed dialogs.\n   *\n   * @defaultValue `false`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * Any additional props that should be passed to the overlay element if it is\n   * rendered.\n   */\n  overlayProps?: HTMLAttributes<HTMLSpanElement>;\n\n  /**\n   * Any additional props that should be passed to the container element when\n   * the `type !== \"custom\"`.\n   */\n  containerProps?: PropsWithRef<ConfigurableDialogContainerProps>;\n\n  /**\n   * @see {@link DEFAULT_DIALOG_TIMEOUT}\n   * @defaultValue `DEFAULT_DIALOG_TIMEOUT`\n   */\n  timeout?: TransitionTimeout;\n\n  /**\n   * @see {@link DEFAULT_DIALOG_CLASSNAMES}\n   * @defaultValue `DEFAULT_DIALOG_CLASSNAMES`\n   */\n  classNames?: CSSTransitionClassNames;\n\n  /**\n   * Set this to `true` if the `Dialog` should not gain the normal focus box\n   * shadow while it is focused. The `Dialog` should normally only gain focus\n   * when it becomes visible and no child elements have `autoFocus` enabled.\n   *\n   * @since 6.0.0\n   * @defaultValue `type === \"full-page\"`\n   */\n  disableFocusOutline?: boolean;\n}\n\nexport type DialogProps = LabelRequiredForA11y<BaseDialogProps>;\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Dialog } from \"@react-md/core/dialog/Dialog\";\n * import { DialogContent } from \"@react-md/core/dialog/DialogContent\";\n * import { DialogFooter } from \"@react-md/core/dialog/DialogFooter\";\n * import { DialogHeader } from \"@react-md/core/dialog/DialogHeader\";\n * import { DialogTitle } from \"@react-md/core/dialog/DialogTitle\";\n * import { Typography } from \"@react-md/core/typography/Typography\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *\n *   return (\n *     <>\n *       <Button onClick={toggle}>Toggle</Button>\n *       <Dialog\n *         aria-labelledby=\"dialog-title\"\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id=\"dialog-title\">Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </Dialog>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n * @since 6.0.0 The `Dialog` no longer supports focusing elements\n * within once it becomes visible. You must manually add `autoFocus` to a\n * element instead.\n */\nexport function Dialog(props: DialogProps): ReactElement {\n  const {\n    ref,\n    id: propId,\n    modal = false,\n    role = modal ? \"alertdialog\" : \"dialog\",\n    type = \"centered\",\n    width,\n    tabIndex = -1,\n    visible,\n    onRequestClose,\n    containerProps,\n    temporary = true,\n    className,\n    timeout = DEFAULT_DIALOG_TIMEOUT,\n    classNames = DEFAULT_DIALOG_CLASSNAMES,\n    disableTransition = false,\n    appear = false,\n    enter = true,\n    exit = true,\n    onEnter = noop,\n    onEntering = noop,\n    onEntered = noop,\n    onExit = noop,\n    onExiting = noop,\n    onExited = noop,\n    exitedHidden = true,\n    disableOverlay = false,\n    overlayProps,\n    overlayHidden,\n    onKeyDown = noop,\n    isFocusTypeDisabled = noopBool,\n    disablePortal: propDisablePortal,\n    disableScrollLock = false,\n    disableEscapeClose = modal,\n    disableFocusOutline = type === \"full-page\",\n    children,\n    ...remaining\n  } = props;\n  const id = useEnsuredId(propId, \"dialog\");\n\n  const ssr = useSsr();\n  const setChildVisible = useNestedDialogContext();\n\n  // this makes it so that as more non-full page dialogs become visible, the\n  // overlay does not become darker as more and more overlays are stacked upon\n  // each other. only the top-most overlay will have and active background\n  // color.\n  const [isChildVisible, setIsChildVisible] = useState(false);\n  const { eventHandlers, transitionOptions } = useFocusContainer({\n    nodeRef: ref,\n    activate: visible,\n    onEnter(appearing) {\n      onEnter(appearing);\n      setChildVisible(type !== \"full-page\");\n    },\n    onEntered(appear) {\n      onEntered(appear);\n      // this needs to be called onEnter and onEntered just in case the\n      // transition is disabled\n      setChildVisible(type !== \"full-page\");\n    },\n    onEntering,\n    onExit() {\n      onExit();\n      setChildVisible(false);\n    },\n    onExiting,\n    onExited() {\n      onExited();\n      // this needs to be called onExit and onExited just in case the\n      // transition is disabled\n      setChildVisible(false);\n    },\n    disableTransition,\n    onKeyDown(event) {\n      onKeyDown(event);\n      if (\n        event.isPropagationStopped() ||\n        modal ||\n        disableEscapeClose ||\n        event.key !== \"Escape\"\n      ) {\n        return;\n      }\n\n      // prevent parent dialogs from closing as well\n      event.stopPropagation();\n      onRequestClose();\n    },\n    isFocusTypeDisabled,\n  });\n  const { elementProps, stage, rendered, disablePortal } = useCSSTransition({\n    transitionIn: visible,\n    timeout,\n    classNames,\n    className: dialog({\n      type,\n      width,\n      fixed: type === \"custom\",\n      outline: !disableFocusOutline,\n      disableBoxShadow: isChildVisible,\n      className,\n    }),\n    appear: appear && !disableTransition && !ssr,\n    enter: enter && !disableTransition,\n    exit: exit && !disableTransition,\n    temporary,\n    exitedHidden,\n    disablePortal: propDisablePortal,\n    ...transitionOptions,\n  });\n  useScrollLock(!disableScrollLock && visible);\n\n  return (\n    <NestedDialogProvider value={setIsChildVisible}>\n      {!disableOverlay && (\n        <Overlay\n          visible={visible}\n          disableTransition={disableTransition}\n          temporary={temporary}\n          disablePortal={disablePortal}\n          {...overlayProps}\n          onClick={modal ? noop : onRequestClose}\n          clickable={!modal}\n          noOpacity={overlayHidden || isChildVisible}\n        />\n      )}\n      <Portal disabled={disablePortal}>\n        {rendered && (\n          <DialogContainer\n            enabled={type !== \"custom\"}\n            {...containerProps}\n            centered={type === \"centered\"}\n            displayNone={!temporary && exitedHidden && stage === \"exited\"}\n          >\n            <div\n              aria-modal={modal || undefined}\n              {...remaining}\n              {...elementProps}\n              {...eventHandlers}\n              id={id}\n              role={role}\n              tabIndex={tabIndex}\n            >\n              {children}\n            </div>\n          </DialogContainer>\n        )}\n      </Portal>\n    </NestedDialogProvider>\n  );\n}\n"],"names":["useState","useSsr","useFocusContainer","Overlay","Portal","useScrollLock","useCSSTransition","useEnsuredId","DialogContainer","NestedDialogProvider","useNestedDialogContext","DEFAULT_DIALOG_CLASSNAMES","DEFAULT_DIALOG_TIMEOUT","dialog","noop","noopBool","Dialog","props","ref","id","propId","modal","role","type","width","tabIndex","visible","onRequestClose","containerProps","temporary","className","timeout","classNames","disableTransition","appear","enter","exit","onEnter","onEntering","onEntered","onExit","onExiting","onExited","exitedHidden","disableOverlay","overlayProps","overlayHidden","onKeyDown","isFocusTypeDisabled","disablePortal","propDisablePortal","disableScrollLock","disableEscapeClose","disableFocusOutline","children","remaining","ssr","setChildVisible","isChildVisible","setIsChildVisible","eventHandlers","transitionOptions","nodeRef","activate","appearing","event","isPropagationStopped","key","stopPropagation","elementProps","stage","rendered","transitionIn","fixed","outline","disableBoxShadow","value","onClick","clickable","noOpacity","disabled","enabled","centered","displayNone","div","aria-modal","undefined"],"mappings":"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"}

package/dist/dialog/DialogContainer.d.ts

@@ -1,8 +1,9 @@
-import { type HTMLAttributes, type ReactNode } from "react";
+import { type HTMLAttributes, type ReactElement, type ReactNode, type Ref } from "react";
 /**
  * @since 6.0.0
  */
 export interface ConfigurableDialogContainerProps extends HTMLAttributes<HTMLDivElement> {
+    ref?: Ref<HTMLDivElement>;
     /**
      * Set to `true` to force the `Dialog` to be wrapped in a `DialogContainer`
      * div. This defaults to `true` for `type !== "custom"`.
@@ -23,4 +24,4 @@ export interface DialogContainerProps extends ConfigurableDialogContainerProps {
  * @since 6.0.0
  * @internal
  */
-export declare const DialogContainer: import("react").ForwardRefExoticComponent<DialogContainerProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function DialogContainer(props: DialogContainerProps): ReactElement;

package/dist/dialog/DialogContainer.js

@@ -1,11 +1,10 @@
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { dialogContainer } from "./styles.js";
 /**
  * @since 6.0.0
  * @internal
- */ export const DialogContainer = /*#__PURE__*/ forwardRef(function DialogContainer(props, ref) {
-    const { enabled, centered, displayNone, children, className, ...remaining } = props;
+ */ export function DialogContainer(props) {
+    const { ref, enabled, centered, displayNone, children, className, ...remaining } = props;
     if (!enabled) {
         return /*#__PURE__*/ _jsx(_Fragment, {
             children: children
@@ -21,6 +20,6 @@ import { dialogContainer } from "./styles.js";
         }),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=DialogContainer.js.map

package/dist/dialog/DialogContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogContainer.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { dialogContainer } from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableDialogContainerProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Set to `true` to force the `Dialog` to be wrapped in a `DialogContainer`\n   * div. This defaults to `true` for `type !== \"custom\"`.\n   */\n  enabled?: boolean;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport interface DialogContainerProps extends ConfigurableDialogContainerProps {\n  enabled: boolean;\n  centered: boolean;\n  displayNone: boolean;\n  children: ReactNode;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport const DialogContainer = forwardRef<HTMLDivElement, DialogContainerProps>(\n  function DialogContainer(props, ref) {\n    const {\n      enabled,\n      centered,\n      displayNone,\n      children,\n      className,\n      ...remaining\n    } = props;\n\n    if (!enabled) {\n      return <>{children}</>;\n    }\n\n    return (\n      <div\n        {...remaining}\n        ref={ref}\n        className={dialogContainer({\n          className,\n          centered,\n          displayNone,\n        })}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","dialogContainer","DialogContainer","props","ref","enabled","centered","displayNone","children","className","remaining","div"],"mappings":";AAAA,SAA8CA,UAAU,QAAQ,QAAQ;AAExE,SAASC,eAAe,QAAQ,cAAc;AAwB9C;;;CAGC,GACD,OAAO,MAAMC,gCAAkBF,WAC7B,SAASE,gBAAgBC,KAAK,EAAEC,GAAG;IACjC,MAAM,EACJC,OAAO,EACPC,QAAQ,EACRC,WAAW,EACXC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGP;IAEJ,IAAI,CAACE,SAAS;QACZ,qBAAO;sBAAGG;;IACZ;IAEA,qBACE,KAACG;QACE,GAAGD,SAAS;QACbN,KAAKA;QACLK,WAAWR,gBAAgB;YACzBQ;YACAH;YACAC;QACF;kBAECC;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogContainer.tsx"],"sourcesContent":["import {\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  type Ref,\n} from \"react\";\n\nimport { dialogContainer } from \"./styles.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableDialogContainerProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n\n  /**\n   * Set to `true` to force the `Dialog` to be wrapped in a `DialogContainer`\n   * div. This defaults to `true` for `type !== \"custom\"`.\n   */\n  enabled?: boolean;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport interface DialogContainerProps extends ConfigurableDialogContainerProps {\n  enabled: boolean;\n  centered: boolean;\n  displayNone: boolean;\n  children: ReactNode;\n}\n\n/**\n * @since 6.0.0\n * @internal\n */\nexport function DialogContainer(props: DialogContainerProps): ReactElement {\n  const {\n    ref,\n    enabled,\n    centered,\n    displayNone,\n    children,\n    className,\n    ...remaining\n  } = props;\n\n  if (!enabled) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div\n      {...remaining}\n      ref={ref}\n      className={dialogContainer({\n        className,\n        centered,\n        displayNone,\n      })}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["dialogContainer","DialogContainer","props","ref","enabled","centered","displayNone","children","className","remaining","div"],"mappings":";AAOA,SAASA,eAAe,QAAQ,cAAc;AA0B9C;;;CAGC,GACD,OAAO,SAASC,gBAAgBC,KAA2B;IACzD,MAAM,EACJC,GAAG,EACHC,OAAO,EACPC,QAAQ,EACRC,WAAW,EACXC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGP;IAEJ,IAAI,CAACE,SAAS;QACZ,qBAAO;sBAAGG;;IACZ;IAEA,qBACE,KAACG;QACE,GAAGD,SAAS;QACbN,KAAKA;QACLK,WAAWR,gBAAgB;YACzBQ;YACAH;YACAC;QACF;kBAECC;;AAGP"}

package/dist/dialog/DialogContent.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from "react";
+import { type HTMLAttributes, type ReactElement, type Ref } from "react";
 import { type DialogContentClassNameOptions } from "./styles.js";
 export interface DialogContentProps extends HTMLAttributes<HTMLDivElement>, DialogContentClassNameOptions {
+    ref?: Ref<HTMLDivElement>;
 }
 /**
  * The `DialogContent` component should be used as a child of the `Dialog`
@@ -9,4 +10,4 @@ export interface DialogContentProps extends HTMLAttributes<HTMLDivElement>, Dial
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
  */
-export declare const DialogContent: import("react").ForwardRefExoticComponent<DialogContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function DialogContent(props: DialogContentProps): ReactElement;

package/dist/dialog/DialogContent.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { dialogContent } from "./styles.js";
 /**
  * The `DialogContent` component should be used as a child of the `Dialog`
@@ -7,8 +6,8 @@ import { dialogContent } from "./styles.js";
  * or `FixedDialog` components for example usage.
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
- */ export const DialogContent = /*#__PURE__*/ forwardRef(function DialogContent(props, ref) {
-    const { children, className, disablePadding = false, ...remaining } = props;
+ */ export function DialogContent(props) {
+    const { ref, children, className, disablePadding = false, ...remaining } = props;
     return /*#__PURE__*/ _jsx("div", {
         ...remaining,
         ref: ref,
@@ -18,6 +17,6 @@ import { dialogContent } from "./styles.js";
         }),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=DialogContent.js.map

package/dist/dialog/DialogContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogContent.tsx"],"sourcesContent":["import { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type DialogContentClassNameOptions, dialogContent } from \"./styles.js\";\n\nexport interface DialogContentProps\n  extends HTMLAttributes<HTMLDivElement>, DialogContentClassNameOptions {}\n\n/**\n * The `DialogContent` component should be used as a child of the `Dialog`\n * component that applies some reasonable default styles. Look at the `Dialog`\n * or `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n */\nexport const DialogContent = forwardRef<HTMLDivElement, DialogContentProps>(\n  function DialogContent(props, ref) {\n    const { children, className, disablePadding = false, ...remaining } = props;\n    return (\n      <div\n        {...remaining}\n        ref={ref}\n        className={dialogContent({\n          className,\n          disablePadding,\n        })}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","dialogContent","DialogContent","props","ref","children","className","disablePadding","remaining","div"],"mappings":";AAAA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAA6CC,aAAa,QAAQ,cAAc;AAKhF;;;;;;CAMC,GACD,OAAO,MAAMC,8BAAgBF,WAC3B,SAASE,cAAcC,KAAK,EAAEC,GAAG;IAC/B,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,iBAAiB,KAAK,EAAE,GAAGC,WAAW,GAAGL;IACtE,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLE,WAAWL,cAAc;YACvBK;YACAC;QACF;kBAECF;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogContent.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactElement, type Ref } from \"react\";\n\nimport { type DialogContentClassNameOptions, dialogContent } from \"./styles.js\";\n\nexport interface DialogContentProps\n  extends HTMLAttributes<HTMLDivElement>, DialogContentClassNameOptions {\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * The `DialogContent` component should be used as a child of the `Dialog`\n * component that applies some reasonable default styles. Look at the `Dialog`\n * or `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n */\nexport function DialogContent(props: DialogContentProps): ReactElement {\n  const {\n    ref,\n    children,\n    className,\n    disablePadding = false,\n    ...remaining\n  } = props;\n\n  return (\n    <div\n      {...remaining}\n      ref={ref}\n      className={dialogContent({\n        className,\n        disablePadding,\n      })}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["dialogContent","DialogContent","props","ref","children","className","disablePadding","remaining","div"],"mappings":";AAEA,SAA6CA,aAAa,QAAQ,cAAc;AAOhF;;;;;;CAMC,GACD,OAAO,SAASC,cAAcC,KAAyB;IACrD,MAAM,EACJC,GAAG,EACHC,QAAQ,EACRC,SAAS,EACTC,iBAAiB,KAAK,EACtB,GAAGC,WACJ,GAAGL;IAEJ,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLE,WAAWL,cAAc;YACvBK;YACAC;QACF;kBAECF;;AAGP"}

package/dist/dialog/DialogFooter.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from "react";
+import { type HTMLAttributes, type ReactElement, type Ref } from "react";
 import { type DialogFooterClassNameOptions } from "./styles.js";
 export interface DialogFooterProps extends HTMLAttributes<HTMLDivElement>, DialogFooterClassNameOptions {
+    ref?: Ref<HTMLDivElement>;
 }
 /**
  * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles
@@ -8,4 +9,4 @@ export interface DialogFooterProps extends HTMLAttributes<HTMLDivElement>, Dialo
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
  */
-export declare const DialogFooter: import("react").ForwardRefExoticComponent<DialogFooterProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const DialogFooter: (props: DialogFooterProps) => ReactElement;

package/dist/dialog/DialogFooter.js

@@ -1,13 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { dialogFooter } from "./styles.js";
 /**
  * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles
  * applied. Look at the `Dialog` or `FixedDialog` components for example usage.
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
- */ export const DialogFooter = /*#__PURE__*/ forwardRef(function DialogFooter(props, ref) {
-    const { children, className, align = "end", ...remaining } = props;
+ */ export const DialogFooter = function DialogFooter(props) {
+    const { ref, children, className, align = "end", ...remaining } = props;
     return /*#__PURE__*/ _jsx("footer", {
         ...remaining,
         ref: ref,
@@ -17,6 +16,6 @@ import { dialogFooter } from "./styles.js";
         }),
         children: children
     });
-});
+};
 
 //# sourceMappingURL=DialogFooter.js.map

package/dist/dialog/DialogFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogFooter.tsx"],"sourcesContent":["import { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type DialogFooterClassNameOptions, dialogFooter } from \"./styles.js\";\n\nexport interface DialogFooterProps\n  extends HTMLAttributes<HTMLDivElement>, DialogFooterClassNameOptions {}\n\n/**\n * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles\n * applied. Look at the `Dialog` or `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n */\nexport const DialogFooter = forwardRef<HTMLDivElement, DialogFooterProps>(\n  function DialogFooter(props, ref) {\n    const { children, className, align = \"end\", ...remaining } = props;\n    return (\n      <footer\n        {...remaining}\n        ref={ref}\n        className={dialogFooter({\n          align,\n          className,\n        })}\n      >\n        {children}\n      </footer>\n    );\n  }\n);\n"],"names":["forwardRef","dialogFooter","DialogFooter","props","ref","children","className","align","remaining","footer"],"mappings":";AAAA,SAA8BA,UAAU,QAAQ,QAAQ;AAExD,SAA4CC,YAAY,QAAQ,cAAc;AAK9E;;;;;CAKC,GACD,OAAO,MAAMC,6BAAeF,WAC1B,SAASE,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,WAAW,GAAGL;IAC7D,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLE,WAAWL,aAAa;YACtBM;YACAD;QACF;kBAECD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogFooter.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactElement, type Ref } from \"react\";\n\nimport { type DialogFooterClassNameOptions, dialogFooter } from \"./styles.js\";\n\nexport interface DialogFooterProps\n  extends HTMLAttributes<HTMLDivElement>, DialogFooterClassNameOptions {\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * The `DialogFooter` is a simple `<footer>` with simple `display: flex` styles\n * applied. Look at the `Dialog` or `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n */\nexport const DialogFooter = function DialogFooter(\n  props: DialogFooterProps\n): ReactElement {\n  const { ref, children, className, align = \"end\", ...remaining } = props;\n\n  return (\n    <footer\n      {...remaining}\n      ref={ref}\n      className={dialogFooter({\n        align,\n        className,\n      })}\n    >\n      {children}\n    </footer>\n  );\n};\n"],"names":["dialogFooter","DialogFooter","props","ref","children","className","align","remaining","footer"],"mappings":";AAEA,SAA4CA,YAAY,QAAQ,cAAc;AAO9E;;;;;CAKC,GACD,OAAO,MAAMC,eAAe,SAASA,aACnCC,KAAwB;IAExB,MAAM,EAAEC,GAAG,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,WAAW,GAAGL;IAElE,qBACE,KAACM;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLE,WAAWL,aAAa;YACtBM;YACAD;QACF;kBAECD;;AAGP,EAAE"}

package/dist/dialog/DialogHeader.d.ts

@@ -1,9 +1,11 @@
+import { type ReactElement, type Ref } from "react";
 import { type BoxProps } from "../box/Box.js";
 import { type BoxAlignItems } from "../box/styles.js";
 /**
  * @since 6.0.0 Extends the `BoxProps`.
  */
 export interface DialogHeaderProps extends BoxProps {
+    ref?: Ref<HTMLDivElement>;
     /** @defaultValue `"center"` */
     align?: BoxAlignItems;
     /** @defaultValue `true` */
@@ -17,4 +19,4 @@ export interface DialogHeaderProps extends BoxProps {
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
  * @since 6.0.0 Extends the `Box` component.
  */
-export declare const DialogHeader: import("react").ForwardRefExoticComponent<DialogHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function DialogHeader(props: DialogHeaderProps): ReactElement;

package/dist/dialog/DialogHeader.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { Box } from "../box/Box.js";
 import { dialogHeader } from "./styles.js";
 /**
@@ -9,8 +8,8 @@ import { dialogHeader } from "./styles.js";
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
  * @since 6.0.0 Extends the `Box` component.
- */ export const DialogHeader = /*#__PURE__*/ forwardRef(function DialogHeader(props, ref) {
-    const { align = "center", disableWrap = true, children, className, ...remaining } = props;
+ */ export function DialogHeader(props) {
+    const { ref, align = "center", disableWrap = true, children, className, ...remaining } = props;
     return /*#__PURE__*/ _jsx(Box, {
         ...remaining,
         align: align,
@@ -21,6 +20,6 @@ import { dialogHeader } from "./styles.js";
         }),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=DialogHeader.js.map

package/dist/dialog/DialogHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogHeader.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { Box, type BoxProps } from \"../box/Box.js\";\nimport { type BoxAlignItems } from \"../box/styles.js\";\nimport { dialogHeader } from \"./styles.js\";\n\n/**\n * @since 6.0.0 Extends the `BoxProps`.\n */\nexport interface DialogHeaderProps extends BoxProps {\n  /** @defaultValue `\"center\"` */\n  align?: BoxAlignItems;\n\n  /** @defaultValue `true` */\n  disableWrap?: boolean;\n}\n\n/**\n * The `DialogHeader` component should be rendered within a `Dialog` component\n * and generally contains the `DialogTitle`. Look at the `Dialog` or\n * `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n * @since 6.0.0 Extends the `Box` component.\n */\nexport const DialogHeader = forwardRef<HTMLDivElement, DialogHeaderProps>(\n  function DialogHeader(props, ref) {\n    const {\n      align = \"center\",\n      disableWrap = true,\n      children,\n      className,\n      ...remaining\n    } = props;\n\n    return (\n      <Box\n        {...remaining}\n        align={align}\n        disableWrap={disableWrap}\n        ref={ref}\n        className={dialogHeader({ className })}\n      >\n        {children}\n      </Box>\n    );\n  }\n);\n"],"names":["forwardRef","Box","dialogHeader","DialogHeader","props","ref","align","disableWrap","children","className","remaining"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,GAAG,QAAuB,gBAAgB;AAEnD,SAASC,YAAY,QAAQ,cAAc;AAa3C;;;;;;;CAOC,GACD,OAAO,MAAMC,6BAAeH,WAC1B,SAASG,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,QAAQ,QAAQ,EAChBC,cAAc,IAAI,EAClBC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGN;IAEJ,qBACE,KAACH;QACE,GAAGS,SAAS;QACbJ,OAAOA;QACPC,aAAaA;QACbF,KAAKA;QACLI,WAAWP,aAAa;YAAEO;QAAU;kBAEnCD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogHeader.tsx"],"sourcesContent":["import { type ReactElement, type Ref } from \"react\";\n\nimport { Box, type BoxProps } from \"../box/Box.js\";\nimport { type BoxAlignItems } from \"../box/styles.js\";\nimport { dialogHeader } from \"./styles.js\";\n\n/**\n * @since 6.0.0 Extends the `BoxProps`.\n */\nexport interface DialogHeaderProps extends BoxProps {\n  ref?: Ref<HTMLDivElement>;\n\n  /** @defaultValue `\"center\"` */\n  align?: BoxAlignItems;\n\n  /** @defaultValue `true` */\n  disableWrap?: boolean;\n}\n\n/**\n * The `DialogHeader` component should be rendered within a `Dialog` component\n * and generally contains the `DialogTitle`. Look at the `Dialog` or\n * `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n * @since 6.0.0 Extends the `Box` component.\n */\nexport function DialogHeader(props: DialogHeaderProps): ReactElement {\n  const {\n    ref,\n    align = \"center\",\n    disableWrap = true,\n    children,\n    className,\n    ...remaining\n  } = props;\n\n  return (\n    <Box\n      {...remaining}\n      align={align}\n      disableWrap={disableWrap}\n      ref={ref}\n      className={dialogHeader({ className })}\n    >\n      {children}\n    </Box>\n  );\n}\n"],"names":["Box","dialogHeader","DialogHeader","props","ref","align","disableWrap","children","className","remaining"],"mappings":";AAEA,SAASA,GAAG,QAAuB,gBAAgB;AAEnD,SAASC,YAAY,QAAQ,cAAc;AAe3C;;;;;;;CAOC,GACD,OAAO,SAASC,aAAaC,KAAwB;IACnD,MAAM,EACJC,GAAG,EACHC,QAAQ,QAAQ,EAChBC,cAAc,IAAI,EAClBC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGN;IAEJ,qBACE,KAACH;QACE,GAAGS,SAAS;QACbJ,OAAOA;QACPC,aAAaA;QACbF,KAAKA;QACLI,WAAWP,aAAa;YAAEO;QAAU;kBAEnCD;;AAGP"}

package/dist/dialog/DialogTitle.d.ts

@@ -1,3 +1,4 @@
+import { type ReactElement, type Ref } from "react";
 import { type Margin } from "../cssUtils.js";
 import { type CustomTypographyComponent, type TypographyProps } from "../typography/Typography.js";
 import { type TypographyType } from "../typography/typographyStyles.js";
@@ -6,6 +7,7 @@ import { type TypographyType } from "../typography/typographyStyles.js";
  * `HTMLAttributes<HTMLHeadingElement>`.
  */
 export interface DialogTitleProps extends TypographyProps {
+    ref?: Ref<HTMLHeadingElement>;
     /** @defaultValue `"h2"` */
     as?: CustomTypographyComponent;
     /** @defaultValue `"headline-4"` */
@@ -20,4 +22,4 @@ export interface DialogTitleProps extends TypographyProps {
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
  */
-export declare const DialogTitle: import("react").ForwardRefExoticComponent<DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
+export declare function DialogTitle(props: DialogTitleProps): ReactElement;

package/dist/dialog/DialogTitle.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cnb } from "cnbuilder";
-import { forwardRef } from "react";
 import { Typography } from "../typography/Typography.js";
 /**
  * The `DialogTitle` component is a simple `Typography` component wrapper with
@@ -8,8 +7,8 @@ import { Typography } from "../typography/Typography.js";
  * `FixedDialog` components for example usage.
  *
  * @see {@link https://react-md.dev/components/dialog | Dialog Demos}
- */ export const DialogTitle = /*#__PURE__*/ forwardRef(function DialogTitle(props, ref) {
-    const { as = "h2", type = "headline-4", margin = "none", children, className, ...remaining } = props;
+ */ export function DialogTitle(props) {
+    const { ref, as = "h2", type = "headline-4", margin = "none", children, className, ...remaining } = props;
     return /*#__PURE__*/ _jsx(Typography, {
         ...remaining,
         ref: ref,
@@ -20,6 +19,6 @@ import { Typography } from "../typography/Typography.js";
         className: cnb("rmd-dialog__title", className),
         children: children
     });
-});
+}
 
 //# sourceMappingURL=DialogTitle.js.map

package/dist/dialog/DialogTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/DialogTitle.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { type Margin } from \"../cssUtils.js\";\nimport {\n  type CustomTypographyComponent,\n  Typography,\n  type TypographyProps,\n} from \"../typography/Typography.js\";\nimport { type TypographyType } from \"../typography/typographyStyles.js\";\n\n/**\n * @since 6.0.0 Inherits the `TypographyProps` instead of\n * `HTMLAttributes<HTMLHeadingElement>`.\n */\nexport interface DialogTitleProps extends TypographyProps {\n  /** @defaultValue `\"h2\"` */\n  as?: CustomTypographyComponent;\n\n  /** @defaultValue `\"headline-4\"` */\n  type?: TypographyType;\n\n  /** @defaultValue `\"none\"` */\n  margin?: Margin;\n}\n\n/**\n * The `DialogTitle` component is a simple `Typography` component wrapper with\n * sensible defaults to be rendered within a `Dialog`. Look at the `Dialog` or\n * `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n */\nexport const DialogTitle = forwardRef<HTMLHeadingElement, DialogTitleProps>(\n  function DialogTitle(props, ref) {\n    const {\n      as = \"h2\",\n      type = \"headline-4\",\n      margin = \"none\",\n      children,\n      className,\n      ...remaining\n    } = props;\n\n    return (\n      <Typography\n        {...remaining}\n        ref={ref}\n        as={as}\n        type={type}\n        margin={margin}\n        // Note: This class applies no styles at this time\n        className={cnb(\"rmd-dialog__title\", className)}\n      >\n        {children}\n      </Typography>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","Typography","DialogTitle","props","ref","as","type","margin","children","className","remaining"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAGnC,SAEEC,UAAU,QAEL,8BAA8B;AAkBrC;;;;;;CAMC,GACD,OAAO,MAAMC,4BAAcF,WACzB,SAASE,YAAYC,KAAK,EAAEC,GAAG;IAC7B,MAAM,EACJC,KAAK,IAAI,EACTC,OAAO,YAAY,EACnBC,SAAS,MAAM,EACfC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGP;IAEJ,qBACE,KAACF;QACE,GAAGS,SAAS;QACbN,KAAKA;QACLC,IAAIA;QACJC,MAAMA;QACNC,QAAQA;QACR,kDAAkD;QAClDE,WAAWV,IAAI,qBAAqBU;kBAEnCD;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/DialogTitle.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { type ReactElement, type Ref } from \"react\";\n\nimport { type Margin } from \"../cssUtils.js\";\nimport {\n  type CustomTypographyComponent,\n  Typography,\n  type TypographyProps,\n} from \"../typography/Typography.js\";\nimport { type TypographyType } from \"../typography/typographyStyles.js\";\n\n/**\n * @since 6.0.0 Inherits the `TypographyProps` instead of\n * `HTMLAttributes<HTMLHeadingElement>`.\n */\nexport interface DialogTitleProps extends TypographyProps {\n  ref?: Ref<HTMLHeadingElement>;\n\n  /** @defaultValue `\"h2\"` */\n  as?: CustomTypographyComponent;\n\n  /** @defaultValue `\"headline-4\"` */\n  type?: TypographyType;\n\n  /** @defaultValue `\"none\"` */\n  margin?: Margin;\n}\n\n/**\n * The `DialogTitle` component is a simple `Typography` component wrapper with\n * sensible defaults to be rendered within a `Dialog`. Look at the `Dialog` or\n * `FixedDialog` components for example usage.\n *\n * @see {@link https://react-md.dev/components/dialog | Dialog Demos}\n */\nexport function DialogTitle(props: DialogTitleProps): ReactElement {\n  const {\n    ref,\n    as = \"h2\",\n    type = \"headline-4\",\n    margin = \"none\",\n    children,\n    className,\n    ...remaining\n  } = props;\n\n  return (\n    <Typography\n      {...remaining}\n      ref={ref}\n      as={as}\n      type={type}\n      margin={margin}\n      // Note: This class applies no styles at this time\n      className={cnb(\"rmd-dialog__title\", className)}\n    >\n      {children}\n    </Typography>\n  );\n}\n"],"names":["cnb","Typography","DialogTitle","props","ref","as","type","margin","children","className","remaining"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAIhC,SAEEC,UAAU,QAEL,8BAA8B;AAoBrC;;;;;;CAMC,GACD,OAAO,SAASC,YAAYC,KAAuB;IACjD,MAAM,EACJC,GAAG,EACHC,KAAK,IAAI,EACTC,OAAO,YAAY,EACnBC,SAAS,MAAM,EACfC,QAAQ,EACRC,SAAS,EACT,GAAGC,WACJ,GAAGP;IAEJ,qBACE,KAACF;QACE,GAAGS,SAAS;QACbN,KAAKA;QACLC,IAAIA;QACJC,MAAMA;QACNC,QAAQA;QACR,kDAAkD;QAClDE,WAAWT,IAAI,qBAAqBS;kBAEnCD;;AAGP"}

package/dist/dialog/FixedDialog.d.ts

@@ -1,10 +1,11 @@
-import { type RefObject } from "react";
+import { type ReactElement, type Ref, type RefObject } from "react";
 import { type CalculateFixedPositionOptions, type PositionAnchor } from "../positioning/types.js";
 import { type LabelRequiredForA11y } from "../types.js";
 import { type BaseDialogProps } from "./Dialog.js";
 export interface BaseFixedDialogProps extends Omit<BaseDialogProps, "type"> {
+    ref?: Ref<HTMLDivElement>;
     anchor?: PositionAnchor;
-    fixedTo: RefObject<HTMLElement>;
+    fixedTo: RefObject<HTMLElement | null>;
     options?: CalculateFixedPositionOptions;
     getFixedPositionOptions?: () => CalculateFixedPositionOptions;
     /**
@@ -70,4 +71,4 @@ export type FixedDialogProps = LabelRequiredForA11y<BaseFixedDialogProps>;
  *
  * @see {@link https://react-md.dev/components/dialog#fixed-dialog | FixedDialog Demos}
  */
-export declare const FixedDialog: import("react").ForwardRefExoticComponent<FixedDialogProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare function FixedDialog(props: FixedDialogProps): ReactElement;

package/dist/dialog/FixedDialog.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useRef } from "react";
+import { useRef } from "react";
 import { TOP_INNER_RIGHT_ANCHOR } from "../positioning/constants.js";
 import { useFixedPositioning } from "../positioning/useFixedPositioning.js";
 import { DEFAULT_SCALE_CLASSNAMES } from "../transition/useScaleTransition.js";
@@ -60,8 +60,8 @@ const noop = ()=>{
  * ```
  *
  * @see {@link https://react-md.dev/components/dialog#fixed-dialog | FixedDialog Demos}
- */ export const FixedDialog = /*#__PURE__*/ forwardRef(function FixedDialog(props, nodeRef) {
-    const { fixedTo, style: propStyle, classNames = DEFAULT_SCALE_CLASSNAMES, children, anchor = TOP_INNER_RIGHT_ANCHOR, options, getFixedPositionOptions, onEnter = noop, onEntering, onEntered = noop, onExited, onRequestClose, overlayHidden = true, disableScrollLock = true, isFocusTypeDisabled = noop, ...remaining } = props;
+ */ export function FixedDialog(props) {
+    const { ref: nodeRef, fixedTo, style: propStyle, classNames = DEFAULT_SCALE_CLASSNAMES, children, anchor = TOP_INNER_RIGHT_ANCHOR, options, getFixedPositionOptions, onEnter = noop, onEntering, onEntered = noop, onExited, onRequestClose, overlayHidden = true, disableScrollLock = true, isFocusTypeDisabled = noop, ...remaining } = props;
     const disableExitFocus = useRef(false);
     const { ref, style, callbacks } = useFixedPositioning({
         nodeRef,
@@ -101,6 +101,6 @@ const noop = ()=>{
         isFocusTypeDisabled: (type)=>isFocusTypeDisabled(type) || type === "unmount" && disableExitFocus.current,
         children: children
     });
-});
+}
 
 //# sourceMappingURL=FixedDialog.js.map

package/dist/dialog/FixedDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/dialog/FixedDialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { type RefObject, forwardRef, useRef } from \"react\";\n\nimport { TOP_INNER_RIGHT_ANCHOR } from \"../positioning/constants.js\";\nimport {\n  type CalculateFixedPositionOptions,\n  type PositionAnchor,\n} from \"../positioning/types.js\";\nimport { useFixedPositioning } from \"../positioning/useFixedPositioning.js\";\nimport { DEFAULT_SCALE_CLASSNAMES } from \"../transition/useScaleTransition.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { type BaseDialogProps, Dialog } from \"./Dialog.js\";\n\nexport interface BaseFixedDialogProps extends Omit<BaseDialogProps, \"type\"> {\n  anchor?: PositionAnchor;\n  fixedTo: RefObject<HTMLElement>;\n  options?: CalculateFixedPositionOptions;\n  getFixedPositionOptions?: () => CalculateFixedPositionOptions;\n\n  /**\n   * @defaultValue `true`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * @defaultValue `true`\n   */\n  disableScrollLock?: boolean;\n}\n\nexport type FixedDialogProps = LabelRequiredForA11y<BaseFixedDialogProps>;\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Dialog } from \"@react-md/core/dialog/Dialog\";\n * import { DialogContent } from \"@react-md/core/dialog/DialogContent\";\n * import { DialogFooter } from \"@react-md/core/dialog/DialogFooter\";\n * import { DialogHeader } from \"@react-md/core/dialog/DialogHeader\";\n * import { DialogTitle } from \"@react-md/core/dialog/DialogTitle\";\n * import { FixedDialog } from \"@react-md/core/dialog/FixedDialog\";\n * import { Typography } from \"@react-md/core/typography/Typography\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import { useId, useRef, type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *   const titleId = useId();\n *   const fixedTo = useRef<HTMLButtonElement>(null)\n *\n *   return (\n *     <>\n *       <Button ref={fixedTo} onClick={toggle}>Toggle</Button>\n *       <FixedDialog\n *         aria-labelledby={titleId}\n *         fixedTo={fixedTo}\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id={titleId}>Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </FixedDialog>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/dialog#fixed-dialog | FixedDialog Demos}\n */\nexport const FixedDialog = forwardRef<HTMLDivElement, FixedDialogProps>(\n  function FixedDialog(props, nodeRef) {\n    const {\n      fixedTo,\n      style: propStyle,\n      classNames = DEFAULT_SCALE_CLASSNAMES,\n      children,\n      anchor = TOP_INNER_RIGHT_ANCHOR,\n      options,\n      getFixedPositionOptions,\n      onEnter = noop,\n      onEntering,\n      onEntered = noop,\n      onExited,\n      onRequestClose,\n      overlayHidden = true,\n      disableScrollLock = true,\n      isFocusTypeDisabled = noop,\n      ...remaining\n    } = props;\n\n    const disableExitFocus = useRef(false);\n    const { ref, style, callbacks } = useFixedPositioning({\n      nodeRef,\n      style: propStyle,\n      transformOrigin: true,\n      onEnter(appearing) {\n        onEnter(appearing);\n        disableExitFocus.current = false;\n      },\n      onEntering,\n      onEntered(appearing) {\n        onEntered(appearing);\n        disableExitFocus.current = false;\n      },\n      onExited,\n      anchor,\n      fixedTo,\n      onScroll(_event, data) {\n        if (!data.visible) {\n          disableExitFocus.current = true;\n          onRequestClose();\n        }\n      },\n      ...options,\n      getFixedPositionOptions,\n    });\n\n    return (\n      <Dialog\n        {...remaining}\n        {...callbacks}\n        ref={ref}\n        type=\"custom\"\n        style={style}\n        classNames={classNames}\n        onRequestClose={onRequestClose}\n        overlayHidden={overlayHidden}\n        disableScrollLock={disableScrollLock}\n        isFocusTypeDisabled={(type) =>\n          isFocusTypeDisabled(type) ||\n          (type === \"unmount\" && disableExitFocus.current)\n        }\n      >\n        {children}\n      </Dialog>\n    );\n  }\n);\n"],"names":["forwardRef","useRef","TOP_INNER_RIGHT_ANCHOR","useFixedPositioning","DEFAULT_SCALE_CLASSNAMES","Dialog","noop","FixedDialog","props","nodeRef","fixedTo","style","propStyle","classNames","children","anchor","options","getFixedPositionOptions","onEnter","onEntering","onEntered","onExited","onRequestClose","overlayHidden","disableScrollLock","isFocusTypeDisabled","remaining","disableExitFocus","ref","callbacks","transformOrigin","appearing","current","onScroll","_event","data","visible","type"],"mappings":"AAAA;;AAEA,SAAyBA,UAAU,EAAEC,MAAM,QAAQ,QAAQ;AAE3D,SAASC,sBAAsB,QAAQ,8BAA8B;AAKrE,SAASC,mBAAmB,QAAQ,wCAAwC;AAC5E,SAASC,wBAAwB,QAAQ,sCAAsC;AAE/E,SAA+BC,MAAM,QAAQ,cAAc;AAqB3D,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDC,GACD,OAAO,MAAMC,4BAAcP,WACzB,SAASO,YAAYC,KAAK,EAAEC,OAAO;IACjC,MAAM,EACJC,OAAO,EACPC,OAAOC,SAAS,EAChBC,aAAaT,wBAAwB,EACrCU,QAAQ,EACRC,SAASb,sBAAsB,EAC/Bc,OAAO,EACPC,uBAAuB,EACvBC,UAAUZ,IAAI,EACda,UAAU,EACVC,YAAYd,IAAI,EAChBe,QAAQ,EACRC,cAAc,EACdC,gBAAgB,IAAI,EACpBC,oBAAoB,IAAI,EACxBC,sBAAsBnB,IAAI,EAC1B,GAAGoB,WACJ,GAAGlB;IAEJ,MAAMmB,mBAAmB1B,OAAO;IAChC,MAAM,EAAE2B,GAAG,EAAEjB,KAAK,EAAEkB,SAAS,EAAE,GAAG1B,oBAAoB;QACpDM;QACAE,OAAOC;QACPkB,iBAAiB;QACjBZ,SAAQa,SAAS;YACfb,QAAQa;YACRJ,iBAAiBK,OAAO,GAAG;QAC7B;QACAb;QACAC,WAAUW,SAAS;YACjBX,UAAUW;YACVJ,iBAAiBK,OAAO,GAAG;QAC7B;QACAX;QACAN;QACAL;QACAuB,UAASC,MAAM,EAAEC,IAAI;YACnB,IAAI,CAACA,KAAKC,OAAO,EAAE;gBACjBT,iBAAiBK,OAAO,GAAG;gBAC3BV;YACF;QACF;QACA,GAAGN,OAAO;QACVC;IACF;IAEA,qBACE,KAACZ;QACE,GAAGqB,SAAS;QACZ,GAAGG,SAAS;QACbD,KAAKA;QACLS,MAAK;QACL1B,OAAOA;QACPE,YAAYA;QACZS,gBAAgBA;QAChBC,eAAeA;QACfC,mBAAmBA;QACnBC,qBAAqB,CAACY,OACpBZ,oBAAoBY,SACnBA,SAAS,aAAaV,iBAAiBK,OAAO;kBAGhDlB;;AAGP,GACA"}
+{"version":3,"sources":["../../src/dialog/FixedDialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ReactElement, type Ref, type RefObject, useRef } from \"react\";\n\nimport { TOP_INNER_RIGHT_ANCHOR } from \"../positioning/constants.js\";\nimport {\n  type CalculateFixedPositionOptions,\n  type PositionAnchor,\n} from \"../positioning/types.js\";\nimport { useFixedPositioning } from \"../positioning/useFixedPositioning.js\";\nimport { DEFAULT_SCALE_CLASSNAMES } from \"../transition/useScaleTransition.js\";\nimport { type LabelRequiredForA11y } from \"../types.js\";\nimport { type BaseDialogProps, Dialog } from \"./Dialog.js\";\n\nexport interface BaseFixedDialogProps extends Omit<BaseDialogProps, \"type\"> {\n  ref?: Ref<HTMLDivElement>;\n\n  anchor?: PositionAnchor;\n  fixedTo: RefObject<HTMLElement | null>;\n  options?: CalculateFixedPositionOptions;\n  getFixedPositionOptions?: () => CalculateFixedPositionOptions;\n\n  /**\n   * @defaultValue `true`\n   */\n  overlayHidden?: boolean;\n\n  /**\n   * @defaultValue `true`\n   */\n  disableScrollLock?: boolean;\n}\n\nexport type FixedDialogProps = LabelRequiredForA11y<BaseFixedDialogProps>;\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n * **Client Component**\n *\n * @example Simple Example\n * ```tsx\n * import { Button } from \"@react-md/core/button/Button\";\n * import { Dialog } from \"@react-md/core/dialog/Dialog\";\n * import { DialogContent } from \"@react-md/core/dialog/DialogContent\";\n * import { DialogFooter } from \"@react-md/core/dialog/DialogFooter\";\n * import { DialogHeader } from \"@react-md/core/dialog/DialogHeader\";\n * import { DialogTitle } from \"@react-md/core/dialog/DialogTitle\";\n * import { FixedDialog } from \"@react-md/core/dialog/FixedDialog\";\n * import { Typography } from \"@react-md/core/typography/Typography\";\n * import { useToggle } from \"@react-md/core/useToggle\";\n * import { useId, useRef, type ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   const {\n *     toggle,\n *     disable: onRequestClose,\n *     toggled: visible,\n *   } = useToggle(false);\n *   const titleId = useId();\n *   const fixedTo = useRef<HTMLButtonElement>(null)\n *\n *   return (\n *     <>\n *       <Button ref={fixedTo} onClick={toggle}>Toggle</Button>\n *       <FixedDialog\n *         aria-labelledby={titleId}\n *         fixedTo={fixedTo}\n *         visible={visible}\n *         onRequestClose={onRequestClose}\n *       >\n *         <DialogHeader>\n *           <DialogTitle id={titleId}>Simple Dialog</DialogTitle>\n *         </DialogHeader>\n *         <DialogContent>\n *           <Typography margin=\"none\">This is some text in a dialog.</Typography>\n *         </DialogContent>\n *         <DialogFooter>\n *           <Button onClick={onRequestClose}>\n *             Close\n *           </Button>\n *         </DialogFooter>\n *       </FixedDialog>\n *     </>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/dialog#fixed-dialog | FixedDialog Demos}\n */\nexport function FixedDialog(props: FixedDialogProps): ReactElement {\n  const {\n    ref: nodeRef,\n    fixedTo,\n    style: propStyle,\n    classNames = DEFAULT_SCALE_CLASSNAMES,\n    children,\n    anchor = TOP_INNER_RIGHT_ANCHOR,\n    options,\n    getFixedPositionOptions,\n    onEnter = noop,\n    onEntering,\n    onEntered = noop,\n    onExited,\n    onRequestClose,\n    overlayHidden = true,\n    disableScrollLock = true,\n    isFocusTypeDisabled = noop,\n    ...remaining\n  } = props;\n\n  const disableExitFocus = useRef(false);\n  const { ref, style, callbacks } = useFixedPositioning({\n    nodeRef,\n    style: propStyle,\n    transformOrigin: true,\n    onEnter(appearing) {\n      onEnter(appearing);\n      disableExitFocus.current = false;\n    },\n    onEntering,\n    onEntered(appearing) {\n      onEntered(appearing);\n      disableExitFocus.current = false;\n    },\n    onExited,\n    anchor,\n    fixedTo,\n    onScroll(_event, data) {\n      if (!data.visible) {\n        disableExitFocus.current = true;\n        onRequestClose();\n      }\n    },\n    ...options,\n    getFixedPositionOptions,\n  });\n\n  return (\n    <Dialog\n      {...remaining}\n      {...callbacks}\n      ref={ref}\n      type=\"custom\"\n      style={style}\n      classNames={classNames}\n      onRequestClose={onRequestClose}\n      overlayHidden={overlayHidden}\n      disableScrollLock={disableScrollLock}\n      isFocusTypeDisabled={(type) =>\n        isFocusTypeDisabled(type) ||\n        (type === \"unmount\" && disableExitFocus.current)\n      }\n    >\n      {children}\n    </Dialog>\n  );\n}\n"],"names":["useRef","TOP_INNER_RIGHT_ANCHOR","useFixedPositioning","DEFAULT_SCALE_CLASSNAMES","Dialog","noop","FixedDialog","props","ref","nodeRef","fixedTo","style","propStyle","classNames","children","anchor","options","getFixedPositionOptions","onEnter","onEntering","onEntered","onExited","onRequestClose","overlayHidden","disableScrollLock","isFocusTypeDisabled","remaining","disableExitFocus","callbacks","transformOrigin","appearing","current","onScroll","_event","data","visible","type"],"mappings":"AAAA;;AAEA,SAAsDA,MAAM,QAAQ,QAAQ;AAE5E,SAASC,sBAAsB,QAAQ,8BAA8B;AAKrE,SAASC,mBAAmB,QAAQ,wCAAwC;AAC5E,SAASC,wBAAwB,QAAQ,sCAAsC;AAE/E,SAA+BC,MAAM,QAAQ,cAAc;AAuB3D,MAAMC,OAAO;AACX,aAAa;AACf;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDC,GACD,OAAO,SAASC,YAAYC,KAAuB;IACjD,MAAM,EACJC,KAAKC,OAAO,EACZC,OAAO,EACPC,OAAOC,SAAS,EAChBC,aAAaV,wBAAwB,EACrCW,QAAQ,EACRC,SAASd,sBAAsB,EAC/Be,OAAO,EACPC,uBAAuB,EACvBC,UAAUb,IAAI,EACdc,UAAU,EACVC,YAAYf,IAAI,EAChBgB,QAAQ,EACRC,cAAc,EACdC,gBAAgB,IAAI,EACpBC,oBAAoB,IAAI,EACxBC,sBAAsBpB,IAAI,EAC1B,GAAGqB,WACJ,GAAGnB;IAEJ,MAAMoB,mBAAmB3B,OAAO;IAChC,MAAM,EAAEQ,GAAG,EAAEG,KAAK,EAAEiB,SAAS,EAAE,GAAG1B,oBAAoB;QACpDO;QACAE,OAAOC;QACPiB,iBAAiB;QACjBX,SAAQY,SAAS;YACfZ,QAAQY;YACRH,iBAAiBI,OAAO,GAAG;QAC7B;QACAZ;QACAC,WAAUU,SAAS;YACjBV,UAAUU;YACVH,iBAAiBI,OAAO,GAAG;QAC7B;QACAV;QACAN;QACAL;QACAsB,UAASC,MAAM,EAAEC,IAAI;YACnB,IAAI,CAACA,KAAKC,OAAO,EAAE;gBACjBR,iBAAiBI,OAAO,GAAG;gBAC3BT;YACF;QACF;QACA,GAAGN,OAAO;QACVC;IACF;IAEA,qBACE,KAACb;QACE,GAAGsB,SAAS;QACZ,GAAGE,SAAS;QACbpB,KAAKA;QACL4B,MAAK;QACLzB,OAAOA;QACPE,YAAYA;QACZS,gBAAgBA;QAChBC,eAAeA;QACfC,mBAAmBA;QACnBC,qBAAqB,CAACW,OACpBX,oBAAoBW,SACnBA,SAAS,aAAaT,iBAAiBI,OAAO;kBAGhDjB;;AAGP"}

package/dist/divider/Divider.d.ts

@@ -1,10 +1,11 @@
-import { type HTMLAttributes } from "react";
+import { type HTMLAttributes, type ReactElement, type Ref } from "react";
 import { type DividerClassNameOptions } from "./styles.js";
 export type DividerElement = HTMLHRElement | HTMLDivElement;
 /**
  * @since 6.0.0 Extends the {@link DividerClassNameOptions}
  */
 export interface DividerProps extends HTMLAttributes<DividerElement>, DividerClassNameOptions {
+    ref?: Ref<DividerElement>;
 }
 /**
  * @example Simple Example
@@ -19,4 +20,4 @@ export interface DividerProps extends HTMLAttributes<DividerElement>, DividerCla
  *
  * @see {@link https://react-md.dev/components/divider | Divider Demos}
  */
-export declare const Divider: import("react").ForwardRefExoticComponent<DividerProps & import("react").RefAttributes<DividerElement>>;
+export declare function Divider(props: DividerProps): ReactElement;

package/dist/divider/Divider.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { divider } from "./styles.js";
 /**
  * @example Simple Example
@@ -13,8 +12,8 @@ import { divider } from "./styles.js";
  * ```
  *
  * @see {@link https://react-md.dev/components/divider | Divider Demos}
- */ export const Divider = /*#__PURE__*/ forwardRef(function Divider(props, ref) {
-    const { inset = false, vertical = false, role = "separator", className, ...remaining } = props;
+ */ export function Divider(props) {
+    const { ref, inset = false, vertical = false, role = "separator", className, ...remaining } = props;
     const Component = vertical ? "div" : "hr";
     return /*#__PURE__*/ _jsx(Component, {
         ...remaining,
@@ -26,6 +25,6 @@ import { divider } from "./styles.js";
             className
         })
     });
-});
+}
 
 //# sourceMappingURL=Divider.js.map

package/dist/divider/Divider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/divider/Divider.tsx"],"sourcesContent":["import { type ElementType, type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type DividerClassNameOptions, divider } from \"./styles.js\";\n\nexport type DividerElement = HTMLHRElement | HTMLDivElement;\n\n/**\n * @since 6.0.0 Extends the {@link DividerClassNameOptions}\n */\nexport interface DividerProps\n  extends HTMLAttributes<DividerElement>, DividerClassNameOptions {}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Divider } from \"@react-md/core/divider/Divider\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return  <Divider />;\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/divider | Divider Demos}\n */\nexport const Divider = forwardRef<DividerElement, DividerProps>(\n  function Divider(props, ref) {\n    const {\n      inset = false,\n      vertical = false,\n      role = \"separator\",\n      className,\n      ...remaining\n    } = props;\n\n    const Component = (vertical ? \"div\" : \"hr\") as ElementType;\n\n    return (\n      <Component\n        {...remaining}\n        ref={ref}\n        role={role}\n        className={divider({\n          inset,\n          vertical,\n          className,\n        })}\n      />\n    );\n  }\n);\n"],"names":["forwardRef","divider","Divider","props","ref","inset","vertical","role","className","remaining","Component"],"mappings":";AAAA,SAAgDA,UAAU,QAAQ,QAAQ;AAE1E,SAAuCC,OAAO,QAAQ,cAAc;AAUpE;;;;;;;;;;;;CAYC,GACD,OAAO,MAAMC,wBAAUF,WACrB,SAASE,QAAQC,KAAK,EAAEC,GAAG;IACzB,MAAM,EACJC,QAAQ,KAAK,EACbC,WAAW,KAAK,EAChBC,OAAO,WAAW,EAClBC,SAAS,EACT,GAAGC,WACJ,GAAGN;IAEJ,MAAMO,YAAaJ,WAAW,QAAQ;IAEtC,qBACE,KAACI;QACE,GAAGD,SAAS;QACbL,KAAKA;QACLG,MAAMA;QACNC,WAAWP,QAAQ;YACjBI;YACAC;YACAE;QACF;;AAGN,GACA"}
+{"version":3,"sources":["../../src/divider/Divider.tsx"],"sourcesContent":["import {\n  type ElementType,\n  type HTMLAttributes,\n  type ReactElement,\n  type Ref,\n} from \"react\";\n\nimport { type DividerClassNameOptions, divider } from \"./styles.js\";\n\nexport type DividerElement = HTMLHRElement | HTMLDivElement;\n\n/**\n * @since 6.0.0 Extends the {@link DividerClassNameOptions}\n */\nexport interface DividerProps\n  extends HTMLAttributes<DividerElement>, DividerClassNameOptions {\n  ref?: Ref<DividerElement>;\n}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Divider } from \"@react-md/core/divider/Divider\";\n * import type { ReactElement } from \"react\";\n *\n * function Example(): ReactElement {\n *   return  <Divider />;\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/divider | Divider Demos}\n */\nexport function Divider(props: DividerProps): ReactElement {\n  const {\n    ref,\n    inset = false,\n    vertical = false,\n    role = \"separator\",\n    className,\n    ...remaining\n  } = props;\n\n  const Component = (vertical ? \"div\" : \"hr\") as ElementType;\n\n  return (\n    <Component\n      {...remaining}\n      ref={ref}\n      role={role}\n      className={divider({\n        inset,\n        vertical,\n        className,\n      })}\n    />\n  );\n}\n"],"names":["divider","Divider","props","ref","inset","vertical","role","className","remaining","Component"],"mappings":";AAOA,SAAuCA,OAAO,QAAQ,cAAc;AAYpE;;;;;;;;;;;;CAYC,GACD,OAAO,SAASC,QAAQC,KAAmB;IACzC,MAAM,EACJC,GAAG,EACHC,QAAQ,KAAK,EACbC,WAAW,KAAK,EAChBC,OAAO,WAAW,EAClBC,SAAS,EACT,GAAGC,WACJ,GAAGN;IAEJ,MAAMO,YAAaJ,WAAW,QAAQ;IAEtC,qBACE,KAACI;QACE,GAAGD,SAAS;QACbL,KAAKA;QACLG,MAAMA;QACNC,WAAWP,QAAQ;YACjBI;YACAC;YACAE;QACF;;AAGN"}

package/dist/draggable/useDraggable.d.ts

@@ -1,5 +1,5 @@
-import { type HTMLAttributes, type Ref, type RefCallback } from "react";
-import { type NonNullRef, type UseStateInitializer, type UseStateSetter } from "../types.js";
+import { type HTMLAttributes, type Ref, type RefCallback, type RefObject } from "react";
+import { type UseStateInitializer, type UseStateSetter } from "../types.js";
 /**
  * @since 6.0.0
  */
@@ -243,7 +243,7 @@ export interface DraggableImplementation<E extends HTMLElement = HTMLElement> ex
      * for manually persisting the value into local storage once the user has
      * stopped dragging.
      */
-    draggedOnce: NonNullRef<boolean>;
+    draggedOnce: RefObject<boolean>;
     value: number;
     setValue: UseStateSetter<number>;
     dragging: boolean;