UNPKG

@yamada-ui/modal

Version:

Yamada UI modal component

141 lines (139 loc) 4.81 kB
"use client" import { Modal } from "./chunk-SA5RYCAR.mjs"; import { DialogBody } from "./chunk-I7XUEPCF.mjs"; import { DialogCloseButton } from "./chunk-3RGLB7UM.mjs"; import { DialogFooter } from "./chunk-XOD2SYPV.mjs"; import { DialogHeader } from "./chunk-6ZTN6KKG.mjs"; import { DialogOverlay } from "./chunk-V6LGJTK2.mjs"; import { DialogProvider } from "./chunk-64A25YOZ.mjs"; // src/dialog.tsx import { Button } from "@yamada-ui/button"; import { omitThemeProps, useComponentMultiStyle } from "@yamada-ui/core"; import { motionForwardRef } from "@yamada-ui/motion"; import { cx, findChild, getValidChildren, isEmpty, isUndefined, isValidElement, omitChildren } from "@yamada-ui/utils"; import { Fragment, jsx, jsxs } from "react/jsx-runtime"; var Dialog = motionForwardRef( ({ size, ...props }, ref) => { const [styles, mergedProps] = useComponentMultiStyle("Dialog", { size, ...props }); const { className, cancel, children, footer, header, other, success, withCloseButton = true, withOverlay = true, containerProps, onCancel, onClose, onOther, onSuccess, ...rest } = omitThemeProps(mergedProps); const validChildren = getValidChildren(children); const customDialogOverlay = findChild(validChildren, DialogOverlay); const customDialogCloseButton = findChild(validChildren, DialogCloseButton); const customDialogHeader = findChild(validChildren, DialogHeader); const customDialogBody = findChild(validChildren, DialogBody); const customDialogFooter = findChild(validChildren, DialogFooter); const cloneChildren = !isEmpty(validChildren) ? omitChildren( validChildren, DialogOverlay, DialogCloseButton, DialogHeader, DialogBody, DialogFooter ) : children; const css = { ...styles.container }; const cancelButtonProps = isValidElement(cancel) || isUndefined(cancel) ? { children: cancel } : cancel; const otherButtonProps = isValidElement(other) || isUndefined(other) ? { children: other } : other; const successButtonProps = isValidElement(success) || isUndefined(success) ? { children: success } : success; if (!cancelButtonProps.variant) cancelButtonProps.variant = "ghost"; if (!otherButtonProps.colorScheme) otherButtonProps.colorScheme = "secondary"; if (!successButtonProps.colorScheme) successButtonProps.colorScheme = "primary"; const hasCancelButton = !!cancelButtonProps.children; const hasOtherButton = !!otherButtonProps.children; const hasSuccessButton = !!successButtonProps.children; const hasFooter = hasCancelButton || hasOtherButton || hasSuccessButton; return /* @__PURE__ */ jsx(DialogProvider, { value: styles, children: /* @__PURE__ */ jsxs( Modal, { ref, className: cx("ui-dialog", className), __css: css, ...{ withCloseButton: false, withOverlay: false, containerProps, onClose, ...rest, size }, children: [ customDialogOverlay != null ? customDialogOverlay : withOverlay && size !== "full" ? /* @__PURE__ */ jsx(DialogOverlay, {}) : null, customDialogCloseButton != null ? customDialogCloseButton : withCloseButton && onClose ? /* @__PURE__ */ jsx(DialogCloseButton, {}) : null, customDialogHeader != null ? customDialogHeader : header ? /* @__PURE__ */ jsx(DialogHeader, { children: header }) : null, customDialogBody != null ? customDialogBody : cloneChildren ? /* @__PURE__ */ jsx(DialogBody, { children: cloneChildren }) : null, customDialogFooter != null ? customDialogFooter : footer || hasFooter ? /* @__PURE__ */ jsx(DialogFooter, { children: footer != null ? footer : /* @__PURE__ */ jsxs(Fragment, { children: [ hasCancelButton ? /* @__PURE__ */ jsx( Button, { onClick: () => onCancel == null ? void 0 : onCancel(onClose), ...cancelButtonProps } ) : null, hasOtherButton ? /* @__PURE__ */ jsx( Button, { onClick: () => onOther == null ? void 0 : onOther(onClose), ...otherButtonProps } ) : null, hasSuccessButton ? /* @__PURE__ */ jsx( Button, { onClick: () => onSuccess == null ? void 0 : onSuccess(onClose), ...successButtonProps } ) : null ] }) }) : null ] } ) }); } ); Dialog.displayName = "Dialog"; Dialog.__ui__ = "Dialog"; export { Dialog }; //# sourceMappingURL=chunk-AU6LRXN5.mjs.map