feat(react/dialogs): port cheatsheet

This commit is contained in:
Elian Doran
2025-08-05 20:35:53 +03:00
parent bde4545afc
commit 7202f47716
12 changed files with 230 additions and 217 deletions

View File

@@ -10,6 +10,7 @@ interface ModalProps {
children: ComponentChildren;
footer?: ComponentChildren;
footerAlignment?: "right" | "between";
minWidth?: string;
maxWidth?: number;
zIndex?: number;
/**
@@ -40,7 +41,7 @@ interface ModalProps {
formRef?: RefObject<HTMLFormElement>;
}
export default function Modal({ children, className, size, title, footer, footerAlignment, onShown, onSubmit, helpPageId, maxWidth, zIndex, scrollable, onHidden: onHidden, modalRef: _modalRef, formRef: _formRef }: ModalProps) {
export default function Modal({ children, className, size, title, footer, footerAlignment, onShown, onSubmit, helpPageId, minWidth, maxWidth, zIndex, scrollable, onHidden: onHidden, modalRef: _modalRef, formRef: _formRef }: ModalProps) {
const modalRef = _modalRef ?? useRef<HTMLDivElement>(null);
const formRef = _formRef ?? useRef<HTMLFormElement>(null);
@@ -76,6 +77,9 @@ export default function Modal({ children, className, size, title, footer, footer
if (maxWidth) {
documentStyle.maxWidth = `${maxWidth}px`;
}
if (minWidth) {
documentStyle.minWidth = minWidth;
}
return (
<div className={`modal fade mx-auto ${className}`} tabIndex={-1} style={dialogStyle} role="dialog" ref={modalRef}>