smarthr-ui 20.1.2 → 20.3.0

package/CHANGELOG.md

@@ -2,6 +2,33 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [20.3.0](https://github.com/kufu/smarthr-ui/compare/v20.2.1...v20.3.0) (2022-04-18)
+
+
+### Features
+
+* use ReactNode for i18n ([#2428](https://github.com/kufu/smarthr-ui/issues/2428)) ([a50cb2f](https://github.com/kufu/smarthr-ui/commit/a50cb2f48f2897bfa5516e96c49f8d1a7e0e16c2))
+
+### [20.2.1](https://github.com/kufu/smarthr-ui/compare/v20.2.0...v20.2.1) (2022-04-14)
+
+
+### Bug Fixes
+
+* fix timing of appending portal ([#2424](https://github.com/kufu/smarthr-ui/issues/2424)) ([29cd62a](https://github.com/kufu/smarthr-ui/commit/29cd62afd113c840b81abeef3326e583c774ba61))
+* ダイアログのフォーカストラップを抜けてしまう問題を修正 ([#2404](https://github.com/kufu/smarthr-ui/issues/2404)) ([91c3b90](https://github.com/kufu/smarthr-ui/commit/91c3b90721c33bbcb9d1a8d0d50561873cf4c356))
+
+## [20.2.0](https://github.com/kufu/smarthr-ui/compare/v20.1.2...v20.2.0) (2022-04-12)
+
+
+### Features
+
+* string to ReactNode ([#2400](https://github.com/kufu/smarthr-ui/issues/2400)) ([200947d](https://github.com/kufu/smarthr-ui/commit/200947dd4483e6171c61c35c1753763d3828a12f))
+
+
+### Bug Fixes
+
+* ダイアログのポータルが DOM に追加される前に子のライフサイクルが開始されないように修正 ([#2403](https://github.com/kufu/smarthr-ui/issues/2403)) ([062a564](https://github.com/kufu/smarthr-ui/commit/062a5645cbebccf25f0de7ef4e1113e764379066))
+
 ### [20.1.2](https://github.com/kufu/smarthr-ui/compare/v20.1.1...v20.1.2) (2022-04-06)
 
 

package/esm/components/Dialog/ActionDialog.d.ts

@@ -1,9 +1,9 @@
-import React, { HTMLAttributes } from 'react';
+import React, { HTMLAttributes, RefObject } from 'react';
 import { DialogContentInnerProps } from './DialogContentInner';
 import { ActionDialogContentInnerProps } from './ActionDialogContentInner';
 declare type Props = Omit<ActionDialogContentInnerProps, 'titleId'> & {
     onClickClose: () => void;
-    portalParent?: HTMLElement;
+    portalParent?: HTMLElement | RefObject<HTMLElement>;
 } & Pick<DialogContentInnerProps, 'isOpen' | 'onClickOverlay' | 'onPressEscape' | 'width' | 'top' | 'right' | 'bottom' | 'left' | 'id'>;
 declare type ElementProps = Omit<HTMLAttributes<HTMLDivElement>, keyof Props>;
 export declare const ActionDialog: React.VFC<Props & ElementProps>;

package/esm/components/Dialog/ActionDialog.js

@@ -1,19 +1,11 @@
-import React, { useCallback, useEffect, useRef } from 'react';
-import { createPortal } from 'react-dom';
+import React, { useCallback } from 'react';
 import { useId } from '../../hooks/useId';
+import { useDialogPortal } from './useDialogPortal';
 import { DialogContentInner } from './DialogContentInner';
 import { ActionDialogContentInner } from './ActionDialogContentInner';
 export const ActionDialog = ({ children, title, subtitle, closeText, actionText, actionTheme, onClickAction, onClickClose, responseMessage, actionDisabled = false, closeDisabled, className = '', portalParent, ...props }) => {
-    const portalContainer = useRef(document.createElement('div')).current;
+    const { Portal } = useDialogPortal(portalParent);
     const titleId = useId();
-    useEffect(() => {
-        // SSR を考慮し、useEffect 内で初期値 document.body を指定
-        const pp = portalParent || document.body;
-        pp.appendChild(portalContainer);
-        return () => {
-            pp.removeChild(portalContainer);
-        };
-    }, [portalContainer, portalParent]);
     const handleClickClose = useCallback(() => {
         if (!props.isOpen) {
             return;
@@ -26,7 +18,8 @@ export const ActionDialog = ({ children, title, subtitle, closeText, actionText,
         }
         onClickAction(onClickClose);
     }, [onClickAction, onClickClose, props.isOpen]);
-    return createPortal(React.createElement(DialogContentInner, { ariaLabelledby: titleId, className: className, ...props },
-        React.createElement(ActionDialogContentInner, { title: title, titleId: titleId, subtitle: subtitle, closeText: closeText, actionText: actionText, actionTheme: actionTheme, actionDisabled: actionDisabled, closeDisabled: closeDisabled, onClickClose: handleClickClose, onClickAction: handleClickAction, responseMessage: responseMessage }, children)), portalContainer);
+    return (React.createElement(Portal, null,
+        React.createElement(DialogContentInner, { ariaLabelledby: titleId, className: className, ...props },
+            React.createElement(ActionDialogContentInner, { title: title, titleId: titleId, subtitle: subtitle, closeText: closeText, actionText: actionText, actionTheme: actionTheme, actionDisabled: actionDisabled, closeDisabled: closeDisabled, onClickClose: handleClickClose, onClickAction: handleClickAction, responseMessage: responseMessage }, children))));
 };
 //# sourceMappingURL=ActionDialog.js.map

package/esm/components/Dialog/ActionDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/ActionDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAClF,OAAO,EAAE,wBAAwB,EAAiC,MAAM,4BAA4B,CAAA;AAmBpG,MAAM,CAAC,MAAM,YAAY,GAAoC,CAAC,EAC5D,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,EACX,aAAa,EACb,YAAY,EACZ,eAAe,EACf,cAAc,GAAG,KAAK,EACtB,aAAa,EACb,SAAS,GAAG,EAAE,EACd,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAA;IACrE,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IAEvB,SAAS,CAAC,GAAG,EAAE;QACb,6CAA6C;QAC7C,MAAM,EAAE,GAAG,YAAY,IAAI,QAAQ,CAAC,IAAI,CAAA;QACxC,EAAE,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAC/B,OAAO,GAAG,EAAE;YACV,EAAE,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QACjC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAA;IAEnC,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAM;SACP;QACD,YAAY,EAAE,CAAA;IAChB,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAEhC,MAAM,iBAAiB,GAAG,WAAW,CAAC,GAAG,EAAE;QACzC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAM;SACP;QACD,aAAa,CAAC,YAAY,CAAC,CAAA;IAC7B,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAE/C,OAAO,YAAY,CACjB,oBAAC,kBAAkB,IAAC,cAAc,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,KAAM,KAAK;QAC1E,oBAAC,wBAAwB,IACvB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,gBAAgB,EAC9B,aAAa,EAAE,iBAAiB,EAChC,eAAe,EAAE,eAAe,IAE/B,QAAQ,CACgB,CACR,EACrB,eAAe,CAChB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"ActionDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/ActionDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6B,WAAW,EAAE,MAAM,OAAO,CAAA;AAErE,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAClF,OAAO,EAAE,wBAAwB,EAAiC,MAAM,4BAA4B,CAAA;AAmBpG,MAAM,CAAC,MAAM,YAAY,GAAoC,CAAC,EAC5D,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,EACX,aAAa,EACb,YAAY,EACZ,eAAe,EACf,cAAc,GAAG,KAAK,EACtB,aAAa,EACb,SAAS,GAAG,EAAE,EACd,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,GAAG,eAAe,CAAC,YAAY,CAAC,CAAA;IAChD,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IAEvB,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAM;SACP;QACD,YAAY,EAAE,CAAA;IAChB,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAEhC,MAAM,iBAAiB,GAAG,WAAW,CAAC,GAAG,EAAE;QACzC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAM;SACP;QACD,aAAa,CAAC,YAAY,CAAC,CAAA;IAC7B,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAE/C,OAAO,CACL,oBAAC,MAAM;QACL,oBAAC,kBAAkB,IAAC,cAAc,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,KAAM,KAAK;YAC1E,oBAAC,wBAAwB,IACvB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,gBAAgB,EAC9B,aAAa,EAAE,iBAAiB,EAChC,eAAe,EAAE,eAAe,IAE/B,QAAQ,CACgB,CACR,CACd,CACV,CAAA;AACH,CAAC,CAAA"}

package/esm/components/Dialog/Dialog.d.ts

@@ -1,7 +1,7 @@
-import React, { HTMLAttributes } from 'react';
+import React, { HTMLAttributes, RefObject } from 'react';
 import { DialogContentInnerProps } from './DialogContentInner';
 declare type Props = DialogContentInnerProps & {
-    portalParent?: HTMLElement;
+    portalParent?: HTMLElement | RefObject<HTMLElement>;
 };
 declare type ElementProps = Omit<HTMLAttributes<HTMLDivElement>, keyof Props>;
 export declare const Dialog: React.VFC<Props & ElementProps>;

package/esm/components/Dialog/Dialog.js

@@ -1,16 +1,9 @@
-import React, { useEffect, useRef } from 'react';
-import { createPortal } from 'react-dom';
+import React from 'react';
+import { useDialogPortal } from './useDialogPortal';
 import { DialogContentInner } from './DialogContentInner';
 export const Dialog = ({ children, className = '', portalParent, ...props }) => {
-    const portalContainer = useRef(document.createElement('div')).current;
-    useEffect(() => {
-        // SSR を考慮し、useEffect 内で初期値 document.body を指定
-        const pp = portalParent || document.body;
-        pp.appendChild(portalContainer);
-        return () => {
-            pp.removeChild(portalContainer);
-        };
-    }, [portalContainer, portalParent]);
-    return createPortal(React.createElement(DialogContentInner, { className: className, ...props }, children), portalContainer);
+    const { Portal } = useDialogPortal(portalParent);
+    return (React.createElement(Portal, null,
+        React.createElement(DialogContentInner, { className: className, ...props }, children)));
 };
 //# sourceMappingURL=Dialog.js.map

package/esm/components/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AACxC,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAKlF,MAAM,CAAC,MAAM,MAAM,GAAoC,CAAC,EACtD,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAA;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,6CAA6C;QAC7C,MAAM,EAAE,GAAG,YAAY,IAAI,QAAQ,CAAC,IAAI,CAAA;QACxC,EAAE,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAC/B,OAAO,GAAG,EAAE;YACV,EAAE,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QACjC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAA;IAEnC,OAAO,YAAY,CACjB,oBAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,KAAM,KAAK,IAChD,QAAQ,CACU,EACrB,eAAe,CAChB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAA;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAKlF,MAAM,CAAC,MAAM,MAAM,GAAoC,CAAC,EACtD,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,GAAG,eAAe,CAAC,YAAY,CAAC,CAAA;IAEhD,OAAO,CACL,oBAAC,MAAM;QACL,oBAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,KAAM,KAAK,IAChD,QAAQ,CACU,CACd,CACV,CAAA;AACH,CAAC,CAAA"}

package/esm/components/Dialog/DialogWrapper.js

@@ -1,5 +1,5 @@
-import React, { createContext, useEffect, useMemo, useRef, useState } from 'react';
-import { createPortal } from 'react-dom';
+import React, { createContext, useMemo, useState } from 'react';
+import { useDialogPortal } from './useDialogPortal';
 export const DialogContext = createContext({
     onClickTrigger: () => {
         /* noop */
@@ -12,17 +12,11 @@ export const DialogContext = createContext({
 });
 export const DialogWrapper = ({ children }) => {
     const [active, setActive] = useState(false);
-    const element = useRef(document.createElement('div')).current;
-    useEffect(() => {
-        document.body.appendChild(element);
-        return () => {
-            document.body.removeChild(element);
-        };
-    }, [element]);
+    const { Portal } = useDialogPortal();
     // This is the root container of a dialog content located in outside the DOM tree
     const DialogContentRoot = useMemo(() => (props) => {
-        return createPortal(props.children, element);
-    }, [element]);
+        return React.createElement(Portal, null, props.children);
+    }, [Portal]);
     // set the displayName explicit for DevTools
     DialogContentRoot.displayName = 'DialogContentRoot';
     return (React.createElement(DialogContext.Provider, { value: {

package/esm/components/Dialog/DialogWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogWrapper.js","sourceRoot":"","sources":["../../../src/components/Dialog/DialogWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AASxC,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAoB;IAC5D,cAAc,EAAE,GAAG,EAAE;QACnB,UAAU;IACZ,CAAC;IACD,YAAY,EAAE,GAAG,EAAE;QACjB,UAAU;IACZ,CAAC;IACD,iBAAiB,EAAE,GAAG,EAAE,CAAC,IAAI;IAC7B,MAAM,EAAE,KAAK;CACd,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,aAAa,GAA8C,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACvF,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAA;IAE7D,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAA;QAElC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAA;QACpC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,iFAAiF;IACjF,MAAM,iBAAiB,GAAG,OAAO,CAC/B,GAAG,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE;QACd,OAAO,YAAY,CAAC,KAAK,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;IAC9C,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAA;IACD,4CAA4C;IAC5C,iBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAA;IAEnD,OAAO,CACL,oBAAC,aAAa,CAAC,QAAQ,IACrB,KAAK,EAAE;YACL,cAAc,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;YACrC,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC;YACpC,iBAAiB;YACjB,MAAM;SACP,IAEA,QAAQ,CACc,CAC1B,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"DialogWrapper.js","sourceRoot":"","sources":["../../../src/components/Dialog/DialogWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE/D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AASnD,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAoB;IAC5D,cAAc,EAAE,GAAG,EAAE;QACnB,UAAU;IACZ,CAAC;IACD,YAAY,EAAE,GAAG,EAAE;QACjB,UAAU;IACZ,CAAC;IACD,iBAAiB,EAAE,GAAG,EAAE,CAAC,IAAI;IAC7B,MAAM,EAAE,KAAK;CACd,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,aAAa,GAA8C,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACvF,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC3C,MAAM,EAAE,MAAM,EAAE,GAAG,eAAe,EAAE,CAAA;IAEpC,iFAAiF;IACjF,MAAM,iBAAiB,GAAG,OAAO,CAC/B,GAAG,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE;QACd,OAAO,oBAAC,MAAM,QAAE,KAAK,CAAC,QAAQ,CAAU,CAAA;IAC1C,CAAC,EACD,CAAC,MAAM,CAAC,CACT,CAAA;IACD,4CAA4C;IAC5C,iBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAA;IAEnD,OAAO,CACL,oBAAC,aAAa,CAAC,QAAQ,IACrB,KAAK,EAAE;YACL,cAAc,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;YACrC,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC;YACpC,iBAAiB;YACjB,MAAM;SACP,IAEA,QAAQ,CACc,CAC1B,CAAA;AACH,CAAC,CAAA"}

package/esm/components/Dialog/FocusTrap.js

@@ -14,7 +14,8 @@ export const FocusTrap = ({ children }) => {
         const firstTabbale = tabbables[0];
         const lastTabbale = tabbables[tabbables.length - 1];
         const currentFocused = Array.from(tabbables).find((elm) => elm === e.target);
-        if (e.shiftKey && currentFocused === firstTabbale) {
+        if (e.shiftKey &&
+            (currentFocused === firstTabbale || document.activeElement === focusTargetRef.current)) {
             lastTabbale.focus();
             e.preventDefault();
         }

package/esm/components/Dialog/FocusTrap.js.map

@@ -1 +1 @@
-{"version":3,"file":"FocusTrap.js","sourceRoot":"","sources":["../../../src/components/Dialog/FocusTrap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAM9C,MAAM,CAAC,MAAM,SAAS,GAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACpD,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;IAC/C,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAEnD,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAgB,EAAE,EAAE;QACrD,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,IAAI,GAAG,CAAC,OAAO,KAAK,IAAI,EAAE;YAC3C,OAAM;SACP;QACD,MAAM,SAAS,GAAG,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAA;QAC1E,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;YAC1B,OAAM;SACP;QACD,MAAM,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC,CAAA;QACjC,MAAM,WAAW,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QACnD,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,CAAC,CAAA;QAC5E,IAAI,CAAC,CAAC,QAAQ,IAAI,cAAc,KAAK,YAAY,EAAE;YACjD,WAAW,CAAC,KAAK,EAAE,CAAA;YACnB,CAAC,CAAC,cAAc,EAAE,CAAA;SACnB;aAAM,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,cAAc,KAAK,WAAW,EAAE;YACxD,YAAY,CAAC,KAAK,EAAE,CAAA;YACpB,CAAC,CAAC,cAAc,EAAE,CAAA;SACnB;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACjD,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACtD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAA;IAEnB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAA;QAC7C,cAAc,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;QAE/B,OAAO,GAAG,EAAE;YACV,4BAA4B;YAC5B,IAAI,cAAc,YAAY,WAAW,EAAE;gBACzC,cAAc,CAAC,KAAK,EAAE,CAAA;aACvB;QACH,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG;QAEX,6BAAK,GAAG,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,CAAC,GAAI;QACzC,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"FocusTrap.js","sourceRoot":"","sources":["../../../src/components/Dialog/FocusTrap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAM9C,MAAM,CAAC,MAAM,SAAS,GAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACpD,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;IAC/C,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAEnD,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAgB,EAAE,EAAE;QACrD,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,IAAI,GAAG,CAAC,OAAO,KAAK,IAAI,EAAE;YAC3C,OAAM;SACP;QACD,MAAM,SAAS,GAAG,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAA;QAC1E,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;YAC1B,OAAM;SACP;QACD,MAAM,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC,CAAA;QACjC,MAAM,WAAW,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QACnD,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,CAAC,CAAA;QAC5E,IACE,CAAC,CAAC,QAAQ;YACV,CAAC,cAAc,KAAK,YAAY,IAAI,QAAQ,CAAC,aAAa,KAAK,cAAc,CAAC,OAAO,CAAC,EACtF;YACA,WAAW,CAAC,KAAK,EAAE,CAAA;YACnB,CAAC,CAAC,cAAc,EAAE,CAAA;SACnB;aAAM,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,cAAc,KAAK,WAAW,EAAE;YACxD,YAAY,CAAC,KAAK,EAAE,CAAA;YACpB,CAAC,CAAC,cAAc,EAAE,CAAA;SACnB;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACjD,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACtD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAA;IAEnB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAA;QAC7C,cAAc,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;QAE/B,OAAO,GAAG,EAAE;YACV,4BAA4B;YAC5B,IAAI,cAAc,YAAY,WAAW,EAAE;gBACzC,cAAc,CAAC,KAAK,EAAE,CAAA;aACvB;QACH,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG;QAEX,6BAAK,GAAG,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,CAAC,GAAI;QACzC,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA"}

package/esm/components/Dialog/MessageDialog.d.ts

@@ -1,8 +1,8 @@
-import React, { HTMLAttributes } from 'react';
+import React, { HTMLAttributes, RefObject } from 'react';
 import { DialogContentInnerProps } from './DialogContentInner';
 import { MessageDialogContentInnerProps } from './MessageDialogContentInner';
-declare type Props = MessageDialogContentInnerProps & Pick<DialogContentInnerProps, 'isOpen' | 'onClickOverlay' | 'onPressEscape' | 'width' | 'top' | 'right' | 'bottom' | 'left' | 'id'> & {
-    portalParent?: HTMLElement;
+declare type Props = Omit<MessageDialogContentInnerProps, 'titleId'> & Pick<DialogContentInnerProps, 'isOpen' | 'onClickOverlay' | 'onPressEscape' | 'width' | 'top' | 'right' | 'bottom' | 'left' | 'id'> & {
+    portalParent?: HTMLElement | RefObject<HTMLElement>;
 };
 declare type ElementProps = Omit<HTMLAttributes<HTMLDivElement>, keyof Props>;
 export declare const MessageDialog: React.VFC<Props & ElementProps>;

package/esm/components/Dialog/MessageDialog.js

@@ -1,24 +1,19 @@
-import React, { useCallback, useEffect, useRef } from 'react';
-import { createPortal } from 'react-dom';
+import React, { useCallback } from 'react';
+import { useDialogPortal } from './useDialogPortal';
 import { DialogContentInner } from './DialogContentInner';
 import { MessageDialogContentInner, } from './MessageDialogContentInner';
+import { useId } from '../../hooks/useId';
 export const MessageDialog = ({ title, subtitle, description, closeText, onClickClose, className = '', portalParent, ...props }) => {
-    const portalContainer = useRef(document.createElement('div')).current;
-    useEffect(() => {
-        // SSR を考慮し、useEffect 内で初期値 document.body を指定
-        const pp = portalParent || document.body;
-        pp.appendChild(portalContainer);
-        return () => {
-            pp.removeChild(portalContainer);
-        };
-    }, [portalContainer, portalParent]);
+    const { Portal } = useDialogPortal(portalParent);
     const handleClickClose = useCallback(() => {
         if (!props.isOpen) {
             return;
         }
         onClickClose();
     }, [onClickClose, props.isOpen]);
-    return createPortal(React.createElement(DialogContentInner, { ariaLabel: subtitle ? `${subtitle} ${title}` : title, className: className, ...props },
-        React.createElement(MessageDialogContentInner, { title: title, subtitle: subtitle, description: description, closeText: closeText, onClickClose: handleClickClose })), portalContainer);
+    const titleId = useId();
+    return (React.createElement(Portal, null,
+        React.createElement(DialogContentInner, { "aria-labelledby": titleId, className: className, ...props },
+            React.createElement(MessageDialogContentInner, { title: title, titleId: titleId, subtitle: subtitle, description: description, closeText: closeText, onClickClose: handleClickClose }))));
 };
 //# sourceMappingURL=MessageDialog.js.map

package/esm/components/Dialog/MessageDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/MessageDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAClF,OAAO,EACL,yBAAyB,GAE1B,MAAM,6BAA6B,CAAA;AAiBpC,MAAM,CAAC,MAAM,aAAa,GAAoC,CAAC,EAC7D,KAAK,EACL,QAAQ,EACR,WAAW,EACX,SAAS,EACT,YAAY,EACZ,SAAS,GAAG,EAAE,EACd,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAA;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,6CAA6C;QAC7C,MAAM,EAAE,GAAG,YAAY,IAAI,QAAQ,CAAC,IAAI,CAAA;QACxC,EAAE,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAC/B,OAAO,GAAG,EAAE;YACV,EAAE,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QACjC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAA;IAEnC,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAM;SACP;QACD,YAAY,EAAE,CAAA;IAChB,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAEhC,OAAO,YAAY,CACjB,oBAAC,kBAAkB,IACjB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,QAAQ,IAAI,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,EACpD,SAAS,EAAE,SAAS,KAChB,KAAK;QAET,oBAAC,yBAAyB,IACxB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,gBAAgB,GAC9B,CACiB,EACrB,eAAe,CAChB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"MessageDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/MessageDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6B,WAAW,EAAE,MAAM,OAAO,CAAA;AAErE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAClF,OAAO,EACL,yBAAyB,GAE1B,MAAM,6BAA6B,CAAA;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAiBzC,MAAM,CAAC,MAAM,aAAa,GAAoC,CAAC,EAC7D,KAAK,EACL,QAAQ,EACR,WAAW,EACX,SAAS,EACT,YAAY,EACZ,SAAS,GAAG,EAAE,EACd,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,GAAG,eAAe,CAAC,YAAY,CAAC,CAAA;IAChD,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;YACjB,OAAM;SACP;QACD,YAAY,EAAE,CAAA;IAChB,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAChC,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IAEvB,OAAO,CACL,oBAAC,MAAM;QACL,oBAAC,kBAAkB,uBAAkB,OAAO,EAAE,SAAS,EAAE,SAAS,KAAM,KAAK;YAC3E,oBAAC,yBAAyB,IACxB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,gBAAgB,GAC9B,CACiB,CACd,CACV,CAAA;AACH,CAAC,CAAA"}

package/esm/components/Dialog/MessageDialogContent.d.ts

@@ -1,7 +1,7 @@
 import React, { HTMLAttributes } from 'react';
 import { DialogContentInnerProps } from './DialogContentInner';
 import { BaseProps } from './MessageDialogContentInner';
-declare type Props = BaseProps & Pick<DialogContentInnerProps, 'width' | 'top' | 'right' | 'bottom' | 'left' | 'id'>;
+declare type Props = Omit<BaseProps, 'titleId'> & Pick<DialogContentInnerProps, 'width' | 'top' | 'right' | 'bottom' | 'left' | 'id'>;
 declare type ElementProps = Omit<HTMLAttributes<HTMLDivElement>, keyof Props>;
 export declare const MessageDialogContent: React.VFC<Props & ElementProps>;
 export {};

package/esm/components/Dialog/MessageDialogContent.js

@@ -2,6 +2,7 @@ import React, { useCallback, useContext } from 'react';
 import { DialogContext } from './DialogWrapper';
 import { DialogContentInner } from './DialogContentInner';
 import { MessageDialogContentInner } from './MessageDialogContentInner';
+import { useId } from '../../hooks/useId';
 export const MessageDialogContent = ({ title, description, closeText, className = '', ...props }) => {
     const { DialogContentRoot, onClickClose, active } = useContext(DialogContext);
     const handleClickClose = useCallback(() => {
@@ -10,8 +11,9 @@ export const MessageDialogContent = ({ title, description, closeText, className
         }
         onClickClose();
     }, [active, onClickClose]);
+    const titleId = useId();
     return (React.createElement(DialogContentRoot, null,
-        React.createElement(DialogContentInner, { onClickOverlay: onClickClose, onPressEscape: onClickClose, isOpen: active, ariaLabel: title, className: className, ...props },
-            React.createElement(MessageDialogContentInner, { title: title, description: description, closeText: closeText, onClickClose: handleClickClose }))));
+        React.createElement(DialogContentInner, { onClickOverlay: onClickClose, onPressEscape: onClickClose, isOpen: active, className: className, ...props },
+            React.createElement(MessageDialogContentInner, { title: title, titleId: titleId, description: description, closeText: closeText, onClickClose: handleClickClose }))));
 };
 //# sourceMappingURL=MessageDialogContent.js.map

package/esm/components/Dialog/MessageDialogContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageDialogContent.js","sourceRoot":"","sources":["../../../src/components/Dialog/MessageDialogContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEtE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAClF,OAAO,EAAa,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAMlF,MAAM,CAAC,MAAM,oBAAoB,GAAoC,CAAC,EACpE,KAAK,EACL,WAAW,EACX,SAAS,EACT,SAAS,GAAG,EAAE,EACd,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,aAAa,CAAC,CAAA;IAE7E,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,MAAM,EAAE;YACX,OAAM;SACP;QACD,YAAY,EAAE,CAAA;IAChB,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAA;IAE1B,OAAO,CACL,oBAAC,iBAAiB;QAChB,oBAAC,kBAAkB,IACjB,cAAc,EAAE,YAAY,EAC5B,aAAa,EAAE,YAAY,EAC3B,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,KAAK,EAChB,SAAS,EAAE,SAAS,KAChB,KAAK;YAET,oBAAC,yBAAyB,IACxB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,gBAAgB,GAC9B,CACiB,CACH,CACrB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"MessageDialogContent.js","sourceRoot":"","sources":["../../../src/components/Dialog/MessageDialogContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkB,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEtE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAA2B,MAAM,sBAAsB,CAAA;AAClF,OAAO,EAAa,yBAAyB,EAAE,MAAM,6BAA6B,CAAA;AAClF,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAMzC,MAAM,CAAC,MAAM,oBAAoB,GAAoC,CAAC,EACpE,KAAK,EACL,WAAW,EACX,SAAS,EACT,SAAS,GAAG,EAAE,EACd,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,aAAa,CAAC,CAAA;IAE7E,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,MAAM,EAAE;YACX,OAAM;SACP;QACD,YAAY,EAAE,CAAA;IAChB,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAA;IAC1B,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IAEvB,OAAO,CACL,oBAAC,iBAAiB;QAChB,oBAAC,kBAAkB,IACjB,cAAc,EAAE,YAAY,EAC5B,aAAa,EAAE,YAAY,EAC3B,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,KAChB,KAAK;YAET,oBAAC,yBAAyB,IACxB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,gBAAgB,GAC9B,CACiB,CACH,CACrB,CAAA;AACH,CAAC,CAAA"}

package/esm/components/Dialog/MessageDialogContentInner.d.ts

@@ -3,8 +3,9 @@ export declare type BaseProps = {
     /**
      * Title of the dialog.
      */
-    title: string;
-    subtitle?: string;
+    title: React.ReactNode;
+    subtitle?: React.ReactNode;
+    titleId: string;
     /**
      * Description of the dialog.
      */
@@ -12,7 +13,7 @@ export declare type BaseProps = {
     /**
      * Label of close button.
      */
-    closeText: string;
+    closeText: React.ReactNode;
 };
 export declare type MessageDialogContentInnerProps = BaseProps & {
     /**

package/esm/components/Dialog/MessageDialogContentInner.js

@@ -6,14 +6,14 @@ import { useOffsetHeight } from './dialogHelper';
 import { Stack } from '../Layout';
 import { SecondaryButton } from '../Button';
 import { Text } from '../Text';
-export const MessageDialogContentInner = ({ title, subtitle, description, closeText, onClickClose, }) => {
+export const MessageDialogContentInner = ({ title, subtitle, titleId, description, closeText, onClickClose, }) => {
     const classNames = useClassNames().dialog;
     const theme = useTheme();
     const { offsetHeight, titleRef, bottomRef } = useOffsetHeight();
     return (React.createElement(React.Fragment, null,
         React.createElement(TitleArea, { gap: 0.25, themes: theme, ref: titleRef, className: classNames.titleArea },
             subtitle && (React.createElement(Text, { as: "p", size: "S", leading: "TIGHT", color: "TEXT_GREY", className: classNames.subtitle }, subtitle)),
-            React.createElement(Text, { as: "p", size: "L", leading: "TIGHT", className: classNames.title }, title)),
+            React.createElement(Text, { as: "p", id: titleId, size: "L", leading: "TIGHT", className: classNames.title }, title)),
         React.createElement(Description, { themes: theme, offsetHeight: offsetHeight, className: classNames.description }, description),
         React.createElement(Bottom, { themes: theme, ref: bottomRef, className: classNames.buttonArea },
             React.createElement(SecondaryButton, { onClick: onClickClose, className: classNames.closeButton }, closeText))));

package/esm/components/Dialog/MessageDialogContentInner.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageDialogContentInner.js","sourceRoot":"","sources":["../../../src/components/Dialog/MessageDialogContentInner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAc,MAAM,OAAO,CAAA;AAClC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAS,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAC3C,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAyB9B,MAAM,CAAC,MAAM,yBAAyB,GAAwC,CAAC,EAC7E,KAAK,EACL,QAAQ,EACR,WAAW,EACX,SAAS,EACT,YAAY,GACb,EAAE,EAAE;IACH,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC,MAAM,CAAA;IACzC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,eAAe,EAAE,CAAA;IAE/D,OAAO,CACL;QACE,oBAAC,SAAS,IAAC,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,CAAC,SAAS;YAChF,QAAQ,IAAI,CACX,oBAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,WAAW,EAAC,SAAS,EAAE,UAAU,CAAC,QAAQ,IACnF,QAAQ,CACJ,CACR;YACD,oBAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAE,UAAU,CAAC,KAAK,IAC9D,KAAK,CACD,CACG;QACZ,oBAAC,WAAW,IAAC,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,CAAC,WAAW,IACtF,WAAW,CACA;QACd,oBAAC,MAAM,IAAC,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,CAAC,UAAU;YACrE,oBAAC,eAAe,IAAC,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,CAAC,WAAW,IACtE,SAAS,CACM,CACX,CACR,CACJ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,CAC7B,CAAC,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;qBACrB,MAAM,CAAC,SAAS;eACtB,OAAO,CAAC,EAAE,IAAI,OAAO,CAAC,CAAC;GACnC,CACF,CAAA;AACD,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAyC;IACnE,CAAC,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,YAAY,EAAE,EAAE,EAAE;IAC1D,OAAO,GAAG,CAAA;iCACmB,YAAY;;mBAE1B,aAAa,CAAC,GAAG,CAAC;mBAClB,QAAQ,CAAC,CAAC;;KAExB,CAAA;AACH,CAAC;CACF,CAAA;AACD,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAmB;IACxC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IACf,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,GAAG,MAAM,CAAA;IACxC,OAAO,GAAG,CAAA;;;iBAGG,aAAa,CAAC,CAAC,CAAC,IAAI,aAAa,CAAC,GAAG,CAAC;oBACnC,MAAM,CAAC,SAAS;KAC/B,CAAA;AACH,CAAC;CACF,CAAA"}
+{"version":3,"file":"MessageDialogContentInner.js","sourceRoot":"","sources":["../../../src/components/Dialog/MessageDialogContentInner.tsx"],"names":[],"mappings":"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"}

package/esm/components/Dialog/ModelessDialog.d.ts

@@ -1,4 +1,4 @@
-import React, { MouseEvent, ReactNode } from 'react';
+import React, { MouseEvent, ReactNode, RefObject } from 'react';
 import { BaseElementProps } from '../Base';
 declare type Props = {
     /**
@@ -52,7 +52,7 @@ declare type Props = {
     /**
      * ポータルの container となる DOM 要素を追加する親要素
      */
-    portalParent?: HTMLElement;
+    portalParent?: HTMLElement | RefObject<HTMLElement>;
 };
 export declare const ModelessDialog: React.VFC<Props & BaseElementProps>;
 export {};

package/esm/components/Dialog/ModelessDialog.js

@@ -1,5 +1,4 @@
 import React, { useCallback, useEffect, useLayoutEffect, useRef, useState, } from 'react';
-import { createPortal } from 'react-dom';
 import styled, { css } from 'styled-components';
 import Draggable from 'react-draggable';
 import { useTheme } from '../../hooks/useTheme';
@@ -8,10 +7,11 @@ import { useHandleEscape } from '../../hooks/useHandleEscape';
 import { Base } from '../Base';
 import { SecondaryButton } from '../Button';
 import { FaGripHorizontalIcon, FaTimesIcon } from '../Icon';
+import { useDialogPortal } from './useDialogPortal';
 import { DialogOverlap } from './DialogOverlap';
 import { useClassNames } from './useClassNames';
 export const ModelessDialog = ({ header, children, footer, isOpen, onClickClose, onPressEscape, width, height, top, left, right, bottom, portalParent, className = '', ...props }) => {
-    const portalContainer = useRef(document.createElement('div')).current;
+    const { Portal, isReady } = useDialogPortal(portalParent);
     const wrapperRef = useRef(null);
     const focusTargetRef = useRef(null);
     const [wrapperPosition, setWrapperPosition] = useState(undefined);
@@ -21,14 +21,6 @@ export const ModelessDialog = ({ header, children, footer, isOpen, onClickClose,
         y: 0,
     });
     const theme = useTheme();
-    useEffect(() => {
-        // SSR を考慮し、useEffect 内で初期値 document.body を指定
-        const pp = portalParent || document.body;
-        pp.appendChild(portalContainer);
-        return () => {
-            pp.removeChild(portalContainer);
-        };
-    }, [portalContainer, portalParent]);
     useEffect(() => {
         if (wrapperRef.current instanceof Element) {
             setWrapperPosition(wrapperRef.current.getBoundingClientRect());
@@ -40,14 +32,14 @@ export const ModelessDialog = ({ header, children, footer, isOpen, onClickClose,
         }
     }, [isOpen, onPressEscape]));
     useLayoutEffect(() => {
-        if (isOpen) {
+        if (isOpen && isReady) {
             setPosition({ x: 0, y: 0 });
             focusTargetRef.current?.focus();
         }
-    }, [isOpen]);
+    }, [isOpen, isReady]);
     useEffect(() => {
         // 中央寄せの座標計算を行う
-        if (!wrapperRef.current || !isOpen) {
+        if (!wrapperRef.current || !isOpen || !isReady) {
             return;
         }
         const isXCenter = left === undefined && right === undefined;
@@ -59,7 +51,7 @@ export const ModelessDialog = ({ header, children, footer, isOpen, onClickClose,
                 left: isXCenter ? window.innerWidth / 2 - rect.width / 2 : undefined,
             });
         }
-    }, [bottom, isOpen, left, right, top]);
+    }, [bottom, isOpen, isReady, left, right, top]);
     const handleArrowKey = useCallback((e) => {
         if (!isOpen || document.activeElement !== e.currentTarget) {
             return;
@@ -98,36 +90,37 @@ export const ModelessDialog = ({ header, children, footer, isOpen, onClickClose,
     }, [isOpen]);
     const labelId = useId();
     const classNames = useClassNames().modelessDialog;
-    return createPortal(React.createElement(DialogOverlap, { isOpen: isOpen },
-        React.createElement(Draggable, { handle: `.${classNames.handle}`, onStart: (_, data) => setPosition({ x: data.x, y: data.y }), onDrag: (_, data) => {
-                setPosition((prev) => {
-                    return {
-                        x: prev.x + data.deltaX,
-                        y: prev.y + data.deltaY,
-                    };
-                });
-            }, position: position },
-            React.createElement(Layout, { className: `${className} ${classNames.wrapper}`, style: {
-                    top: centering.top !== undefined ? centering.top : top,
-                    left: centering.left !== undefined ? centering.left : left,
-                    right,
-                    bottom,
-                    width,
-                    height,
-                }, ref: wrapperRef, role: "dialog", "aria-labelledby": labelId, ...props },
-                React.createElement(Box, { isWidthAuto: width === undefined, left: left, right: right, themes: theme, className: classNames.box },
-                    React.createElement("div", { tabIndex: -1, ref: focusTargetRef }),
-                    React.createElement(Header, { className: classNames.header, themes: theme },
-                        React.createElement(Title, { id: labelId, themes: theme }, header),
-                        React.createElement(DialogHandler, { className: classNames.handle, themes: theme, tabIndex: 0, role: "slider", "aria-label": "\u30C0\u30A4\u30A2\u30ED\u30B0\u306E\u4F4D\u7F6E", "aria-valuetext": wrapperPosition &&
-                                `上から${Math.trunc(wrapperPosition.top)}px、
+    return (React.createElement(Portal, null,
+        React.createElement(DialogOverlap, { isOpen: isOpen },
+            React.createElement(Draggable, { handle: `.${classNames.handle}`, onStart: (_, data) => setPosition({ x: data.x, y: data.y }), onDrag: (_, data) => {
+                    setPosition((prev) => {
+                        return {
+                            x: prev.x + data.deltaX,
+                            y: prev.y + data.deltaY,
+                        };
+                    });
+                }, position: position },
+                React.createElement(Layout, { className: `${className} ${classNames.wrapper}`, style: {
+                        top: centering.top !== undefined ? centering.top : top,
+                        left: centering.left !== undefined ? centering.left : left,
+                        right,
+                        bottom,
+                        width,
+                        height,
+                    }, ref: wrapperRef, role: "dialog", "aria-labelledby": labelId, ...props },
+                    React.createElement(Box, { isWidthAuto: width === undefined, left: left, right: right, themes: theme, className: classNames.box },
+                        React.createElement("div", { tabIndex: -1, ref: focusTargetRef }),
+                        React.createElement(Header, { className: classNames.header, themes: theme },
+                            React.createElement(Title, { id: labelId, themes: theme }, header),
+                            React.createElement(DialogHandler, { className: classNames.handle, themes: theme, tabIndex: 0, role: "slider", "aria-label": "\u30C0\u30A4\u30A2\u30ED\u30B0\u306E\u4F4D\u7F6E", "aria-valuetext": wrapperPosition &&
+                                    `上から${Math.trunc(wrapperPosition.top)}px、
                   左から${Math.trunc(wrapperPosition.left)}px`, onKeyDown: handleArrowKey },
-                            React.createElement(FaGripHorizontalIcon, null)),
-                        React.createElement(CloseButtonLayout, null,
-                            React.createElement(SecondaryButton, { type: "button", size: "s", square: true, onClick: onClickClose, className: classNames.closeButton },
-                                React.createElement(FaTimesIcon, { visuallyHiddenText: "\u9589\u3058\u308B" })))),
-                    React.createElement(Content, { className: classNames.content }, children),
-                    footer && (React.createElement(Footer, { className: classNames.footer, themes: theme }, footer)))))), portalContainer);
+                                React.createElement(FaGripHorizontalIcon, null)),
+                            React.createElement(CloseButtonLayout, null,
+                                React.createElement(SecondaryButton, { type: "button", size: "s", square: true, onClick: onClickClose, className: classNames.closeButton },
+                                    React.createElement(FaTimesIcon, { visuallyHiddenText: "\u9589\u3058\u308B" })))),
+                        React.createElement(Content, { className: classNames.content }, children),
+                        footer && (React.createElement(Footer, { className: classNames.footer, themes: theme }, footer))))))));
 };
 const Layout = styled.div `
   position: fixed;

package/esm/components/Dialog/ModelessDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModelessDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/ModelessDialog.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ModelessDialog.js","sourceRoot":"","sources":["../../../src/components/Dialog/ModelessDialog.tsx"],"names":[],"mappings":"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"}

package/esm/components/Dialog/useDialogPortal.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode, RefObject, VFC } from 'react';
+export declare function useDialogPortal(parent?: HTMLElement | RefObject<HTMLElement>): {
+    Portal: VFC<{
+        children: ReactNode;
+    }>;
+    isReady: boolean;
+};

package/esm/components/Dialog/useDialogPortal.js

@@ -0,0 +1,29 @@
+import { useCallback, useLayoutEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+export function useDialogPortal(parent) {
+    const portalContainer = useRef(document.createElement('div')).current;
+    const [isReady, setIsReady] = useState(false);
+    useLayoutEffect(() => {
+        const parentElement = parent != null && 'current' in parent ? parent.current : parent;
+        // SSR を考慮し、useEffect 内で初期値 document.body を指定
+        const actualParent = parentElement || document.body;
+        actualParent.appendChild(portalContainer);
+        setIsReady(true);
+        return () => {
+            setIsReady(false);
+            actualParent.removeChild(portalContainer);
+        };
+    }, [portalContainer, parent]);
+    const Portal = useCallback(({ children }) => {
+        if (!isReady) {
+            // コンテナの append が完了するまでは子のライフサイクルを開始させない
+            return null;
+        }
+        return createPortal(children, portalContainer);
+    }, [isReady, portalContainer]);
+    return {
+        Portal,
+        isReady,
+    };
+}
+//# sourceMappingURL=useDialogPortal.js.map

package/esm/components/Dialog/useDialogPortal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDialogPortal.js","sourceRoot":"","sources":["../../../src/components/Dialog/useDialogPortal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACjG,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,MAAM,UAAU,eAAe,CAAC,MAA6C;IAC3E,MAAM,eAAe,GAAG,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAA;IACrE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE7C,eAAe,CAAC,GAAG,EAAE;QACnB,MAAM,aAAa,GAAG,MAAM,IAAI,IAAI,IAAI,SAAS,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAA;QACrF,6CAA6C;QAC7C,MAAM,YAAY,GAAG,aAAa,IAAI,QAAQ,CAAC,IAAI,CAAA;QACnD,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QACzC,UAAU,CAAC,IAAI,CAAC,CAAA;QAChB,OAAO,GAAG,EAAE;YACV,UAAU,CAAC,KAAK,CAAC,CAAA;YACjB,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAC3C,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAA;IAE7B,MAAM,MAAM,GAAiC,WAAW,CACtD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;QACf,IAAI,CAAC,OAAO,EAAE;YACZ,wCAAwC;YACxC,OAAO,IAAI,CAAA;SACZ;QACD,OAAO,YAAY,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAA;IAChD,CAAC,EACD,CAAC,OAAO,EAAE,eAAe,CAAC,CAC3B,CAAA;IAED,OAAO;QACL,MAAM;QACN,OAAO;KACR,CAAA;AACH,CAAC"}

package/esm/components/InformationPanel/InformationPanel.d.ts

@@ -3,7 +3,7 @@ import { BaseElementProps } from '../Base';
 import { HeadingTagTypes } from '../Heading';
 declare type Props = {
     /** パネルのタイトル */
-    title: string;
+    title: React.ReactNode;
     /** タイトル部分の HTML タグ */
     titleTag?: HeadingTagTypes;
     /** 表示する情報のタイプ */
@@ -11,9 +11,9 @@ declare type Props = {
     /** `true` のとき、開閉ボタンを表示する */
     togglable?: boolean;
     /** 開くボタンのラベル */
-    openButtonLabel?: string;
+    openButtonLabel?: React.ReactNode;
     /** 閉じるボタンのラベル */
-    closeButtonLabel?: string;
+    closeButtonLabel?: React.ReactNode;
     /** パネルの開閉の状態 */
     active?: boolean;
     /** コンポーネントに適用するクラス名 */