@yamada-ui/modal 1.3.13-dev-20241016074736 → 1.4.0-dev-20241016155802

package/dist/{chunk-VNQHFTL2.mjs → chunk-UWNNN2FG.mjs}

@@ -1,10 +1,10 @@
 "use client"
 import {
   ModalCloseButton
-} from "./chunk-PDW7A62B.mjs";
+} from "./chunk-DT5IIM35.mjs";
 import {
   useDrawer
-} from "./chunk-A7WOQJCA.mjs";
+} from "./chunk-EPC5EUXN.mjs";
 
 // src/drawer-close-button.tsx
 import { forwardRef } from "@yamada-ui/core";
@@ -31,4 +31,4 @@ DrawerCloseButton.__ui__ = "DrawerCloseButton";
 export {
   DrawerCloseButton
 };
-//# sourceMappingURL=chunk-VNQHFTL2.mjs.map
+//# sourceMappingURL=chunk-UWNNN2FG.mjs.map

package/dist/{chunk-L353QQ6S.mjs → chunk-X5STF2Y7.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   useModal
-} from "./chunk-A7WOQJCA.mjs";
+} from "./chunk-EPC5EUXN.mjs";
 
 // src/modal-footer.tsx
 import { forwardRef, ui } from "@yamada-ui/core";
@@ -33,4 +33,4 @@ ModalFooter.__ui__ = "ModalFooter";
 export {
   ModalFooter
 };
-//# sourceMappingURL=chunk-L353QQ6S.mjs.map
+//# sourceMappingURL=chunk-X5STF2Y7.mjs.map

package/dist/{chunk-W7WF42SC.mjs → chunk-Z7MBETMY.mjs}

@@ -1,10 +1,10 @@
 "use client"
 import {
   ModalFooter
-} from "./chunk-L353QQ6S.mjs";
+} from "./chunk-X5STF2Y7.mjs";
 import {
   useDialog
-} from "./chunk-A7WOQJCA.mjs";
+} from "./chunk-EPC5EUXN.mjs";
 
 // src/dialog-footer.tsx
 import { forwardRef } from "@yamada-ui/core";
@@ -31,4 +31,4 @@ DialogFooter.__ui__ = "DialogFooter";
 export {
   DialogFooter
 };
-//# sourceMappingURL=chunk-W7WF42SC.mjs.map
+//# sourceMappingURL=chunk-Z7MBETMY.mjs.map

package/dist/dialog-body.js

@@ -50,7 +50,7 @@ var [DrawerProvider, useDrawer] = (0, import_utils.createContext)({
 var import_jsx_runtime = require("react/jsx-runtime");
 var ModalBody = (0, import_core.forwardRef)(
   ({ className, __css, ...rest }, ref) => {
-    const { scrollBehavior, styles } = useModal();
+    const { describedbyId, scrollBehavior, styles } = useModal();
     const css = {
       alignItems: "flex-start",
       display: "flex",
@@ -61,6 +61,7 @@ var ModalBody = (0, import_core.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_core.ui.div,
       {
+        id: describedbyId,
         ref,
         className: (0, import_utils2.cx)("ui-modal__body", className),
         __css: css,

package/dist/dialog-body.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dialog-body.tsx","../src/modal-body.tsx","../src/modal-context.ts"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalBodyProps } from \"./modal-body\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { ModalBody } from \"./modal-body\"\nimport { useDialog } from \"./modal-context\"\n\nexport interface DialogBodyProps extends ModalBodyProps {}\n\nexport const DialogBody = forwardRef<DialogBodyProps, \"main\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.body }\n\n    return (\n      <ModalBody\n        ref={ref}\n        className={cx(\"ui-dialog__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogBody.displayName = \"DialogBody\"\nDialogBody.__ui__ = \"DialogBody\"\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalBodyProps extends HTMLUIProps {}\n\nexport const ModalBody = forwardRef<ModalBodyProps, \"div\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { scrollBehavior, styles } = useModal()\n\n    const css: CSSUIObject = {\n      alignItems: \"flex-start\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      overflow: scrollBehavior === \"inside\" ? \"auto\" : undefined,\n      ...(__css ? __css : styles.body),\n    }\n\n    return (\n      <ui.div\n        ref={ref}\n        className={cx(\"ui-modal__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalBody.displayName = \"ModalBody\"\nModalBody.__ui__ = \"ModalBody\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACFnB,kBAA+B;AAC/B,IAAAC,gBAAmB;;;ACAnB,mBAA8B;AAMvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADTK;AAbC,IAAM,gBAAY;AAAA,EACvB,CAAC,EAAE,WAAW,OAAO,GAAG,KAAK,GAAG,QAAQ;AACtC,UAAM,EAAE,gBAAgB,OAAO,IAAI,SAAS;AAE5C,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU,mBAAmB,WAAW,SAAS;AAAA,MACjD,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,kBAAkB,SAAS;AAAA,QACzC,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,UAAU,cAAc;AACxB,UAAU,SAAS;;;ADfb,IAAAC,sBAAA;AAPC,IAAM,iBAAa;AAAA,EACxB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,KAAK;AAE1C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,mBAAmB,SAAS;AAAA,QAC1C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AACzB,WAAW,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}
+{"version":3,"sources":["../src/dialog-body.tsx","../src/modal-body.tsx","../src/modal-context.ts"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalBodyProps } from \"./modal-body\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { ModalBody } from \"./modal-body\"\nimport { useDialog } from \"./modal-context\"\n\nexport interface DialogBodyProps extends ModalBodyProps {}\n\nexport const DialogBody = forwardRef<DialogBodyProps, \"main\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.body }\n\n    return (\n      <ModalBody\n        ref={ref}\n        className={cx(\"ui-dialog__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogBody.displayName = \"DialogBody\"\nDialogBody.__ui__ = \"DialogBody\"\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalBodyProps extends HTMLUIProps {}\n\nexport const ModalBody = forwardRef<ModalBodyProps, \"div\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { describedbyId, scrollBehavior, styles } = useModal()\n\n    const css: CSSUIObject = {\n      alignItems: \"flex-start\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      overflow: scrollBehavior === \"inside\" ? \"auto\" : undefined,\n      ...(__css ? __css : styles.body),\n    }\n\n    return (\n      <ui.div\n        id={describedbyId}\n        ref={ref}\n        className={cx(\"ui-modal__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalBody.displayName = \"ModalBody\"\nModalBody.__ui__ = \"ModalBody\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  describedbyId: string\n  labelledbyId: string\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACFnB,kBAA+B;AAC/B,IAAAC,gBAAmB;;;ACAnB,mBAA8B;AAQvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADXK;AAbC,IAAM,gBAAY;AAAA,EACvB,CAAC,EAAE,WAAW,OAAO,GAAG,KAAK,GAAG,QAAQ;AACtC,UAAM,EAAE,eAAe,gBAAgB,OAAO,IAAI,SAAS;AAE3D,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,eAAe;AAAA,MACf,UAAU,mBAAmB,WAAW,SAAS;AAAA,MACjD,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,IAAI;AAAA,QACJ;AAAA,QACA,eAAW,kBAAG,kBAAkB,SAAS;AAAA,QACzC,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,UAAU,cAAc;AACxB,UAAU,SAAS;;;ADhBb,IAAAC,sBAAA;AAPC,IAAM,iBAAa;AAAA,EACxB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,KAAK;AAE1C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,mBAAmB,SAAS;AAAA,QAC1C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;AACzB,WAAW,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}

package/dist/dialog-body.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   DialogBody
-} from "./chunk-VMTMWWII.mjs";
-import "./chunk-ZDEVCYYC.mjs";
-import "./chunk-A7WOQJCA.mjs";
+} from "./chunk-EITLQG4B.mjs";
+import "./chunk-GBZ3BEXX.mjs";
+import "./chunk-EPC5EUXN.mjs";
 export {
   DialogBody
 };

package/dist/dialog-close-button.js

@@ -61,6 +61,7 @@ var ModalCloseButton = (0, import_core.forwardRef)(
       {
         ref,
         className: (0, import_utils2.cx)("ui-modal__close-button"),
+        "aria-label": "Close modal",
         onClick: (0, import_utils2.handlerAll)(onClick, (ev) => {
           ev.stopPropagation();
           onClose == null ? void 0 : onClose();
@@ -85,6 +86,7 @@ var DialogCloseButton = (0, import_core2.forwardRef)(
       {
         ref,
         className: (0, import_utils3.cx)("ui-dialog__close-button", className),
+        "aria-label": "Close dialog",
         __css: css,
         ...rest
       }

package/dist/dialog-close-button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dialog-close-button.tsx","../src/modal-close-button.tsx","../src/modal-context.ts"],"sourcesContent":["import type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject } from \"@yamada-ui/core\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { ModalCloseButton } from \"./modal-close-button\"\nimport { useDialog } from \"./modal-context\"\n\nexport interface DialogCloseButtonProps extends CloseButtonProps {}\n\nexport const DialogCloseButton = forwardRef<DialogCloseButtonProps, \"button\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.closeButton }\n\n    return (\n      <ModalCloseButton\n        ref={ref}\n        className={cx(\"ui-dialog__close-button\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogCloseButton.displayName = \"DialogCloseButton\"\nDialogCloseButton.__ui__ = \"DialogCloseButton\"\n","import type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject } from \"@yamada-ui/core\"\nimport { CloseButton } from \"@yamada-ui/close-button\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalCloseButtonProps extends CloseButtonProps {}\n\nexport const ModalCloseButton = forwardRef<ModalCloseButtonProps, \"button\">(\n  ({ onClick, __css, ...rest }, ref) => {\n    const { styles, onClose } = useModal()\n\n    const css: CSSUIObject = {\n      position: \"absolute\",\n      ...(__css ? __css : styles.closeButton),\n    }\n\n    return (\n      <CloseButton\n        ref={ref}\n        className={cx(\"ui-modal__close-button\")}\n        onClick={handlerAll(onClick, (ev) => {\n          ev.stopPropagation()\n          onClose?.()\n        })}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalCloseButton.displayName = \"ModalCloseButton\"\nModalCloseButton.__ui__ = \"ModalCloseButton\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACDnB,0BAA4B;AAC5B,kBAA2B;AAC3B,IAAAC,gBAA+B;;;ACF/B,mBAA8B;AAMvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADVK;AAVC,IAAM,uBAAmB;AAAA,EAC9B,CAAC,EAAE,SAAS,OAAO,GAAG,KAAK,GAAG,QAAQ;AACpC,UAAM,EAAE,QAAQ,QAAQ,IAAI,SAAS;AAErC,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,wBAAwB;AAAA,QACtC,aAAS,0BAAW,SAAS,CAAC,OAAO;AACnC,aAAG,gBAAgB;AACnB;AAAA,QACF,CAAC;AAAA,QACD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAC/B,iBAAiB,SAAS;;;ADlBpB,IAAAC,sBAAA;AAPC,IAAM,wBAAoB;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,YAAY;AAEjD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,2BAA2B,SAAS;AAAA,QAClD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,kBAAkB,cAAc;AAChC,kBAAkB,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}
+{"version":3,"sources":["../src/dialog-close-button.tsx","../src/modal-close-button.tsx","../src/modal-context.ts"],"sourcesContent":["import type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject } from \"@yamada-ui/core\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { ModalCloseButton } from \"./modal-close-button\"\nimport { useDialog } from \"./modal-context\"\n\nexport interface DialogCloseButtonProps extends CloseButtonProps {}\n\nexport const DialogCloseButton = forwardRef<DialogCloseButtonProps, \"button\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.closeButton }\n\n    return (\n      <ModalCloseButton\n        ref={ref}\n        className={cx(\"ui-dialog__close-button\", className)}\n        aria-label=\"Close dialog\"\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogCloseButton.displayName = \"DialogCloseButton\"\nDialogCloseButton.__ui__ = \"DialogCloseButton\"\n","import type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject } from \"@yamada-ui/core\"\nimport { CloseButton } from \"@yamada-ui/close-button\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalCloseButtonProps extends CloseButtonProps {}\n\nexport const ModalCloseButton = forwardRef<ModalCloseButtonProps, \"button\">(\n  ({ onClick, __css, ...rest }, ref) => {\n    const { styles, onClose } = useModal()\n\n    const css: CSSUIObject = {\n      position: \"absolute\",\n      ...(__css ? __css : styles.closeButton),\n    }\n\n    return (\n      <CloseButton\n        ref={ref}\n        className={cx(\"ui-modal__close-button\")}\n        aria-label=\"Close modal\"\n        onClick={handlerAll(onClick, (ev) => {\n          ev.stopPropagation()\n          onClose?.()\n        })}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalCloseButton.displayName = \"ModalCloseButton\"\nModalCloseButton.__ui__ = \"ModalCloseButton\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  describedbyId: string\n  labelledbyId: string\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACDnB,0BAA4B;AAC5B,kBAA2B;AAC3B,IAAAC,gBAA+B;;;ACF/B,mBAA8B;AAQvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADZK;AAVC,IAAM,uBAAmB;AAAA,EAC9B,CAAC,EAAE,SAAS,OAAO,GAAG,KAAK,GAAG,QAAQ;AACpC,UAAM,EAAE,QAAQ,QAAQ,IAAI,SAAS;AAErC,UAAM,MAAmB;AAAA,MACvB,UAAU;AAAA,MACV,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,wBAAwB;AAAA,QACtC,cAAW;AAAA,QACX,aAAS,0BAAW,SAAS,CAAC,OAAO;AACnC,aAAG,gBAAgB;AACnB;AAAA,QACF,CAAC;AAAA,QACD,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAC/B,iBAAiB,SAAS;;;ADnBpB,IAAAC,sBAAA;AAPC,IAAM,wBAAoB;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,YAAY;AAEjD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,2BAA2B,SAAS;AAAA,QAClD,cAAW;AAAA,QACX,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,kBAAkB,cAAc;AAChC,kBAAkB,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}

package/dist/dialog-close-button.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   DialogCloseButton
-} from "./chunk-LUSTM3GA.mjs";
-import "./chunk-PDW7A62B.mjs";
-import "./chunk-A7WOQJCA.mjs";
+} from "./chunk-U2DBPI7Y.mjs";
+import "./chunk-DT5IIM35.mjs";
+import "./chunk-EPC5EUXN.mjs";
 export {
   DialogCloseButton
 };

package/dist/dialog-footer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dialog-footer.tsx","../src/modal-context.ts","../src/modal-footer.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalFooterProps } from \"./modal-footer\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useDialog } from \"./modal-context\"\nimport { ModalFooter } from \"./modal-footer\"\n\nexport interface DialogFooterProps extends ModalFooterProps {}\n\nexport const DialogFooter = forwardRef<DialogFooterProps, \"footer\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.footer }\n\n    return (\n      <ModalFooter\n        ref={ref}\n        className={cx(\"ui-dialog__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogFooter.displayName = \"DialogFooter\"\nDialogFooter.__ui__ = \"DialogFooter\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalFooterProps extends HTMLUIProps<\"footer\"> {}\n\nexport const ModalFooter = forwardRef<ModalFooterProps, \"footer\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      justifyContent: \"flex-end\",\n      ...(__css ? __css : styles.footer),\n    }\n\n    return (\n      <ui.footer\n        ref={ref}\n        className={cx(\"ui-modal__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalFooter.displayName = \"ModalFooter\"\nModalFooter.__ui__ = \"ModalFooter\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACDnB,mBAA8B;AAMvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AC5BD,kBAA+B;AAC/B,IAAAC,gBAAmB;AAiBb;AAZC,IAAM,kBAAc;AAAA,EACzB,CAAC,EAAE,WAAW,OAAO,GAAG,KAAK,GAAG,QAAQ;AACtC,UAAM,EAAE,OAAO,IAAI,SAAS;AAE5B,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,oBAAoB,SAAS;AAAA,QAC3C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;;;AFdf,IAAAC,sBAAA;AAPC,IAAM,mBAAe;AAAA,EAC1B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,OAAO;AAE5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;AAC3B,aAAa,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}
+{"version":3,"sources":["../src/dialog-footer.tsx","../src/modal-context.ts","../src/modal-footer.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalFooterProps } from \"./modal-footer\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useDialog } from \"./modal-context\"\nimport { ModalFooter } from \"./modal-footer\"\n\nexport interface DialogFooterProps extends ModalFooterProps {}\n\nexport const DialogFooter = forwardRef<DialogFooterProps, \"footer\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.footer }\n\n    return (\n      <ModalFooter\n        ref={ref}\n        className={cx(\"ui-dialog__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogFooter.displayName = \"DialogFooter\"\nDialogFooter.__ui__ = \"DialogFooter\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  describedbyId: string\n  labelledbyId: string\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalFooterProps extends HTMLUIProps<\"footer\"> {}\n\nexport const ModalFooter = forwardRef<ModalFooterProps, \"footer\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      justifyContent: \"flex-end\",\n      ...(__css ? __css : styles.footer),\n    }\n\n    return (\n      <ui.footer\n        ref={ref}\n        className={cx(\"ui-modal__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalFooter.displayName = \"ModalFooter\"\nModalFooter.__ui__ = \"ModalFooter\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACDnB,mBAA8B;AAQvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AC9BD,kBAA+B;AAC/B,IAAAC,gBAAmB;AAiBb;AAZC,IAAM,kBAAc;AAAA,EACzB,CAAC,EAAE,WAAW,OAAO,GAAG,KAAK,GAAG,QAAQ;AACtC,UAAM,EAAE,OAAO,IAAI,SAAS;AAE5B,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,oBAAoB,SAAS;AAAA,QAC3C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;;;AFdf,IAAAC,sBAAA;AAPC,IAAM,mBAAe;AAAA,EAC1B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,OAAO;AAE5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;AAC3B,aAAa,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}

package/dist/dialog-footer.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   DialogFooter
-} from "./chunk-W7WF42SC.mjs";
-import "./chunk-L353QQ6S.mjs";
-import "./chunk-A7WOQJCA.mjs";
+} from "./chunk-Z7MBETMY.mjs";
+import "./chunk-X5STF2Y7.mjs";
+import "./chunk-EPC5EUXN.mjs";
 export {
   DialogFooter
 };

package/dist/dialog-header.js

@@ -48,7 +48,7 @@ var import_utils2 = require("@yamada-ui/utils");
 var import_jsx_runtime = require("react/jsx-runtime");
 var ModalHeader = (0, import_core.forwardRef)(
   ({ className, __css, ...rest }, ref) => {
-    const { styles } = useModal();
+    const { labelledbyId, styles } = useModal();
     const css = {
       alignItems: "center",
       display: "flex",
@@ -58,6 +58,7 @@ var ModalHeader = (0, import_core.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_core.ui.header,
       {
+        id: labelledbyId,
         ref,
         className: (0, import_utils2.cx)("ui-modal__header", className),
         __css: css,

package/dist/dialog-header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dialog-header.tsx","../src/modal-context.ts","../src/modal-header.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalHeaderProps } from \"./modal-header\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useDialog } from \"./modal-context\"\nimport { ModalHeader } from \"./modal-header\"\n\nexport interface DialogHeaderProps extends ModalHeaderProps {}\n\nexport const DialogHeader = forwardRef<DialogHeaderProps, \"header\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.header }\n\n    return (\n      <ModalHeader\n        ref={ref}\n        className={cx(\"ui-dialog__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogHeader.displayName = \"DialogHeader\"\nDialogHeader.__ui__ = \"DialogHeader\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalHeaderProps extends HTMLUIProps<\"header\"> {}\n\nexport const ModalHeader = forwardRef<ModalHeaderProps, \"header\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      justifyContent: \"flex-start\",\n      ...(__css ? __css : styles.header),\n    }\n\n    return (\n      <ui.header\n        ref={ref}\n        className={cx(\"ui-modal__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalHeader.displayName = \"ModalHeader\"\nModalHeader.__ui__ = \"ModalHeader\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACDnB,mBAA8B;AAMvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AC5BD,kBAA+B;AAC/B,IAAAC,gBAAmB;AAiBb;AAZC,IAAM,kBAAc;AAAA,EACzB,CAAC,EAAE,WAAW,OAAO,GAAG,KAAK,GAAG,QAAQ;AACtC,UAAM,EAAE,OAAO,IAAI,SAAS;AAE5B,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,oBAAoB,SAAS;AAAA,QAC3C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;;;AFdf,IAAAC,sBAAA;AAPC,IAAM,mBAAe;AAAA,EAC1B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,OAAO;AAE5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;AAC3B,aAAa,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}
+{"version":3,"sources":["../src/dialog-header.tsx","../src/modal-context.ts","../src/modal-header.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalHeaderProps } from \"./modal-header\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useDialog } from \"./modal-context\"\nimport { ModalHeader } from \"./modal-header\"\n\nexport interface DialogHeaderProps extends ModalHeaderProps {}\n\nexport const DialogHeader = forwardRef<DialogHeaderProps, \"header\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.header }\n\n    return (\n      <ModalHeader\n        ref={ref}\n        className={cx(\"ui-dialog__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogHeader.displayName = \"DialogHeader\"\nDialogHeader.__ui__ = \"DialogHeader\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  describedbyId: string\n  labelledbyId: string\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n","import type { CSSUIObject, HTMLUIProps } from \"@yamada-ui/core\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalHeaderProps extends HTMLUIProps<\"header\"> {}\n\nexport const ModalHeader = forwardRef<ModalHeaderProps, \"header\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { labelledbyId, styles } = useModal()\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      justifyContent: \"flex-start\",\n      ...(__css ? __css : styles.header),\n    }\n\n    return (\n      <ui.header\n        id={labelledbyId}\n        ref={ref}\n        className={cx(\"ui-modal__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalHeader.displayName = \"ModalHeader\"\nModalHeader.__ui__ = \"ModalHeader\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,eAA2B;AAC3B,IAAAC,gBAAmB;;;ACDnB,mBAA8B;AAQvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AC9BD,kBAA+B;AAC/B,IAAAC,gBAAmB;AAiBb;AAZC,IAAM,kBAAc;AAAA,EACzB,CAAC,EAAE,WAAW,OAAO,GAAG,KAAK,GAAG,QAAQ;AACtC,UAAM,EAAE,cAAc,OAAO,IAAI,SAAS;AAE1C,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,IAAI;AAAA,QACJ;AAAA,QACA,eAAW,kBAAG,oBAAoB,SAAS;AAAA,QAC3C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;AAC1B,YAAY,SAAS;;;AFff,IAAAC,sBAAA;AAPC,IAAM,mBAAe;AAAA,EAC1B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,OAAO;AAE5C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;AAC3B,aAAa,SAAS;","names":["import_core","import_utils","import_utils","import_jsx_runtime"]}

package/dist/dialog-header.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   DialogHeader
-} from "./chunk-37MTMX5B.mjs";
-import "./chunk-LYMMHCHF.mjs";
-import "./chunk-A7WOQJCA.mjs";
+} from "./chunk-CBL7CH2A.mjs";
+import "./chunk-DWQHOEUG.mjs";
+import "./chunk-EPC5EUXN.mjs";
 export {
   DialogHeader
 };

package/dist/dialog-overlay.js

@@ -71,6 +71,7 @@ var ModalOverlay = (0, import_motion.motionForwardRef)(
       {
         ref,
         className: (0, import_utils2.cx)("ui-modal__overlay", className),
+        "aria-hidden": true,
         custom: { duration },
         onClick: (0, import_utils2.handlerAll)(onClick, onOverlayClick, (ev) => {
           ev.stopPropagation();

package/dist/dialog-overlay.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dialog-overlay.tsx","../src/modal-context.ts","../src/modal-overlay.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOverlayProps } from \"./modal-overlay\"\nimport { motionForwardRef } from \"@yamada-ui/motion\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useDialog } from \"./modal-context\"\nimport { ModalOverlay } from \"./modal-overlay\"\n\nexport interface DialogOverlayProps extends ModalOverlayProps {}\n\nexport const DialogOverlay = motionForwardRef<DialogOverlayProps, \"div\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.overlay }\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        className={cx(\"ui-dialog__overlay\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogOverlay.displayName = \"DialogOverlay\"\nDialogOverlay.__ui__ = \"DialogOverlay\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport { motion, motionForwardRef } from \"@yamada-ui/motion\"\nimport { fadeProps } from \"@yamada-ui/transitions\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalOverlayProps extends MotionProps {}\n\nexport const ModalOverlay = motionForwardRef<ModalOverlayProps, \"div\">(\n  ({ className, onClick, __css, ...rest }, ref) => {\n    const {\n      animation,\n      closeOnOverlay,\n      duration,\n      styles,\n      onClose,\n      onOverlayClick,\n    } = useModal()\n\n    const css: CSSUIObject = {\n      h: \"100dvh\",\n      left: 0,\n      position: \"fixed\",\n      top: 0,\n      w: \"100vw\",\n      ...(__css ? __css : styles.overlay),\n    }\n\n    const props = animation !== \"none\" ? fadeProps : {}\n\n    return (\n      <motion.div\n        ref={ref}\n        className={cx(\"ui-modal__overlay\", className)}\n        custom={{ duration }}\n        onClick={handlerAll(onClick, onOverlayClick, (ev) => {\n          ev.stopPropagation()\n          if (closeOnOverlay) onClose?.()\n        })}\n        __css={css}\n        {...props}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalOverlay.displayName = \"ModalOverlay\"\nModalOverlay.__ui__ = \"ModalOverlay\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,iBAAiC;AACjC,IAAAC,gBAAmB;;;ACDnB,mBAA8B;AAMvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AC3BD,oBAAyC;AACzC,yBAA0B;AAC1B,IAAAC,gBAA+B;AA4BzB;AAvBC,IAAM,mBAAe;AAAA,EAC1B,CAAC,EAAE,WAAW,SAAS,OAAO,GAAG,KAAK,GAAG,QAAQ;AAC/C,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,SAAS;AAEb,UAAM,MAAmB;AAAA,MACvB,GAAG;AAAA,MACH,MAAM;AAAA,MACN,UAAU;AAAA,MACV,KAAK;AAAA,MACL,GAAG;AAAA,MACH,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,UAAM,QAAQ,cAAc,SAAS,+BAAY,CAAC;AAElD,WACE;AAAA,MAAC,qBAAO;AAAA,MAAP;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,QAAQ,EAAE,SAAS;AAAA,QACnB,aAAS,0BAAW,SAAS,gBAAgB,CAAC,OAAO;AACnD,aAAG,gBAAgB;AACnB,cAAI,eAAgB;AAAA,QACtB,CAAC;AAAA,QACD,OAAO;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;AAC3B,aAAa,SAAS;;;AFjChB,IAAAC,sBAAA;AAPC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,sBAAsB,SAAS;AAAA,QAC7C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;AAC5B,cAAc,SAAS;","names":["import_motion","import_utils","import_utils","import_jsx_runtime"]}
+{"version":3,"sources":["../src/dialog-overlay.tsx","../src/modal-context.ts","../src/modal-overlay.tsx"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOverlayProps } from \"./modal-overlay\"\nimport { motionForwardRef } from \"@yamada-ui/motion\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useDialog } from \"./modal-context\"\nimport { ModalOverlay } from \"./modal-overlay\"\n\nexport interface DialogOverlayProps extends ModalOverlayProps {}\n\nexport const DialogOverlay = motionForwardRef<DialogOverlayProps, \"div\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.overlay }\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        className={cx(\"ui-dialog__overlay\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nDialogOverlay.displayName = \"DialogOverlay\"\nDialogOverlay.__ui__ = \"DialogOverlay\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { ModalOptions } from \"./modal\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ModalContext extends ModalOptions {\n  describedbyId: string\n  labelledbyId: string\n  styles: { [key: string]: CSSUIObject | undefined }\n}\n\nexport const [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\ninterface DialogContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\ninterface DrawerContext {\n  [key: string]: CSSUIObject | undefined\n}\n\nexport const [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport { motion, motionForwardRef } from \"@yamada-ui/motion\"\nimport { fadeProps } from \"@yamada-ui/transitions\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal-context\"\n\nexport interface ModalOverlayProps extends MotionProps {}\n\nexport const ModalOverlay = motionForwardRef<ModalOverlayProps, \"div\">(\n  ({ className, onClick, __css, ...rest }, ref) => {\n    const {\n      animation,\n      closeOnOverlay,\n      duration,\n      styles,\n      onClose,\n      onOverlayClick,\n    } = useModal()\n\n    const css: CSSUIObject = {\n      h: \"100dvh\",\n      left: 0,\n      position: \"fixed\",\n      top: 0,\n      w: \"100vw\",\n      ...(__css ? __css : styles.overlay),\n    }\n\n    const props = animation !== \"none\" ? fadeProps : {}\n\n    return (\n      <motion.div\n        ref={ref}\n        className={cx(\"ui-modal__overlay\", className)}\n        aria-hidden\n        custom={{ duration }}\n        onClick={handlerAll(onClick, onOverlayClick, (ev) => {\n          ev.stopPropagation()\n          if (closeOnOverlay) onClose?.()\n        })}\n        __css={css}\n        {...props}\n        {...rest}\n      />\n    )\n  },\n)\n\nModalOverlay.displayName = \"ModalOverlay\"\nModalOverlay.__ui__ = \"ModalOverlay\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,iBAAiC;AACjC,IAAAC,gBAAmB;;;ACDnB,mBAA8B;AAQvB,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EACnE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAMM,IAAM,CAAC,gBAAgB,SAAS,QAAI,4BAA6B;AAAA,EACtE,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AC7BD,oBAAyC;AACzC,yBAA0B;AAC1B,IAAAC,gBAA+B;AA4BzB;AAvBC,IAAM,mBAAe;AAAA,EAC1B,CAAC,EAAE,WAAW,SAAS,OAAO,GAAG,KAAK,GAAG,QAAQ;AAC/C,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,IAAI,SAAS;AAEb,UAAM,MAAmB;AAAA,MACvB,GAAG;AAAA,MACH,MAAM;AAAA,MACN,UAAU;AAAA,MACV,KAAK;AAAA,MACL,GAAG;AAAA,MACH,GAAI,QAAQ,QAAQ,OAAO;AAAA,IAC7B;AAEA,UAAM,QAAQ,cAAc,SAAS,+BAAY,CAAC;AAElD,WACE;AAAA,MAAC,qBAAO;AAAA,MAAP;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,qBAAqB,SAAS;AAAA,QAC5C,eAAW;AAAA,QACX,QAAQ,EAAE,SAAS;AAAA,QACnB,aAAS,0BAAW,SAAS,gBAAgB,CAAC,OAAO;AACnD,aAAG,gBAAgB;AACnB,cAAI,eAAgB;AAAA,QACtB,CAAC;AAAA,QACD,OAAO;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;AAC3B,aAAa,SAAS;;;AFlChB,IAAAC,sBAAA;AAPC,IAAM,oBAAgB;AAAA,EAC3B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,SAAS,UAAU;AAEzB,UAAM,MAAmB,EAAE,GAAG,OAAO,QAAQ;AAE7C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,sBAAsB,SAAS;AAAA,QAC7C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;AAC5B,cAAc,SAAS;","names":["import_motion","import_utils","import_utils","import_jsx_runtime"]}

package/dist/dialog-overlay.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   DialogOverlay
-} from "./chunk-EDCPPJBS.mjs";
-import "./chunk-VB44U6WY.mjs";
-import "./chunk-A7WOQJCA.mjs";
+} from "./chunk-CTBGRQX2.mjs";
+import "./chunk-4VGCDKI3.mjs";
+import "./chunk-EPC5EUXN.mjs";
 export {
   DialogOverlay
 };

package/dist/dialog.js

@@ -56,7 +56,7 @@ var [DrawerProvider, useDrawer] = (0, import_utils.createContext)({
 var import_jsx_runtime = require("react/jsx-runtime");
 var ModalBody = (0, import_core.forwardRef)(
   ({ className, __css, ...rest }, ref) => {
-    const { scrollBehavior, styles } = useModal();
+    const { describedbyId, scrollBehavior, styles } = useModal();
     const css = {
       alignItems: "flex-start",
       display: "flex",
@@ -67,6 +67,7 @@ var ModalBody = (0, import_core.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_core.ui.div,
       {
+        id: describedbyId,
         ref,
         className: (0, import_utils2.cx)("ui-modal__body", className),
         __css: css,
@@ -119,6 +120,7 @@ var ModalCloseButton = (0, import_core3.forwardRef)(
       {
         ref,
         className: (0, import_utils4.cx)("ui-modal__close-button"),
+        "aria-label": "Close modal",
         onClick: (0, import_utils4.handlerAll)(onClick, (ev) => {
           ev.stopPropagation();
           onClose == null ? void 0 : onClose();
@@ -143,6 +145,7 @@ var DialogCloseButton = (0, import_core4.forwardRef)(
       {
         ref,
         className: (0, import_utils5.cx)("ui-dialog__close-button", className),
+        "aria-label": "Close dialog",
         __css: css,
         ...rest
       }
@@ -213,7 +216,7 @@ var import_utils8 = require("@yamada-ui/utils");
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var ModalHeader = (0, import_core7.forwardRef)(
   ({ className, __css, ...rest }, ref) => {
-    const { styles } = useModal();
+    const { labelledbyId, styles } = useModal();
     const css = {
       alignItems: "center",
       display: "flex",
@@ -223,6 +226,7 @@ var ModalHeader = (0, import_core7.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       import_core7.ui.header,
       {
+        id: labelledbyId,
         ref,
         className: (0, import_utils8.cx)("ui-modal__header", className),
         __css: css,
@@ -287,6 +291,7 @@ var ModalOverlay = (0, import_motion.motionForwardRef)(
       {
         ref,
         className: (0, import_utils10.cx)("ui-modal__overlay", className),
+        "aria-hidden": true,
         custom: { duration },
         onClick: (0, import_utils10.handlerAll)(onClick, onOverlayClick, (ev) => {
           ev.stopPropagation();
@@ -401,7 +406,7 @@ var DrawerContent = (0, import_motion3.motionForwardRef)(
     blankForDragProps,
     ...rest
   }, ref) => {
-    const { duration, isOpen, onClose } = useModal();
+    const { describedbyId, duration, isOpen, labelledbyId, onClose } = useModal();
     const styles = useDrawer();
     const placement = (0, import_use_value.useValue)(_placement);
     const validChildren = (0, import_utils14.getValidChildren)(children);
@@ -506,6 +511,9 @@ var DrawerContent = (0, import_motion3.motionForwardRef)(
       {
         ref,
         className: (0, import_utils14.cx)("ui-drawer", className),
+        "aria-describedby": describedbyId,
+        "aria-labelledby": labelledbyId,
+        "aria-modal": "true",
         drag: closeOnDrag ? getDragDirection() : false,
         dragConstraints: getDragDirectionRestriction(dragConstraints),
         dragElastic: getDragDirectionRestriction(dragElastic),
@@ -514,6 +522,7 @@ var DrawerContent = (0, import_motion3.motionForwardRef)(
         duration,
         isOpen,
         placement,
+        role: "dialog",
         tabIndex: -1,
         onDragEnd: (_, info) => {
           if (isCloseByDragInfo(info)) onClose == null ? void 0 : onClose();
@@ -605,7 +614,9 @@ var ModalContent = (0, import_motion5.motionForwardRef)(
   ({ className, children, __css, ...rest }, ref) => {
     const {
       animation,
+      describedbyId,
       duration,
+      labelledbyId,
       scrollBehavior,
       styles,
       withCloseButton,
@@ -632,6 +643,8 @@ var ModalContent = (0, import_motion5.motionForwardRef)(
       {
         ref,
         className: (0, import_utils16.cx)("ui-modal", className),
+        "aria-describedby": describedbyId,
+        "aria-labelledby": labelledbyId,
         "aria-modal": "true",
         role: "dialog",
         tabIndex: -1,
@@ -685,6 +698,8 @@ var Modal = (0, import_motion6.motionForwardRef)(
       onOverlayClick,
       ...rest
     } = (0, import_core12.omitThemeProps)(mergedProps);
+    const labelledbyId = (0, import_react2.useId)();
+    const describedbyId = (0, import_react2.useId)();
     const onKeyDown = (0, import_react2.useCallback)(
       (ev) => {
         if (ev.key !== "Escape") return;
@@ -723,8 +738,10 @@ var Modal = (0, import_motion6.motionForwardRef)(
         value: {
           animation,
           closeOnOverlay,
+          describedbyId,
           duration,
           isOpen,
+          labelledbyId,
           scrollBehavior,
           styles,
           withCloseButton,