p-sw/pswui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: give ServerSideDocumentFallback callback

Browse Source
This commit is contained in:
p-sw 2024-07-20 02:44:36 +09:00
parent d0af00db63
commit ad62a4ed86
2 changed files with 43 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
packages/react/components/Dialog/Component.tsx
View File

@ -95,30 +95,32 @@ const DialogOverlay = React.forwardRef<HTMLDivElement, DialogOverlay>(
return ( return (
<ServerSideDocumentFallback> <ServerSideDocumentFallback>
{ReactDOM.createPortal( {() =>
<div ReactDOM.createPortal(
{...otherPropsExtracted}
id={ids.dialog}
ref={ref}
className={dialogOverlayVariant(variantProps)}
onClick={(e) => {
if (closeOnClick) {
setContext((p) => ({ ...p, opened: false }));
}
onClick?.(e);
}}
>
<div <div
className={ {...otherPropsExtracted}
"w-screen max-w-full min-h-screen flex flex-col justify-center items-center" id={ids.dialog}
} ref={ref}
className={dialogOverlayVariant(variantProps)}
onClick={(e) => {
if (closeOnClick) {
setContext((p) => ({ ...p, opened: false }));
}
onClick?.(e);
}}
> >
{/* Layer for overflow positioning */} <div
{children} className={
</div> "w-screen max-w-full min-h-screen flex flex-col justify-center items-center"
</div>, }
document.body, >
)} {/* Layer for overflow positioning */}
{children}
</div>
</div>,
document.body,
)
}
</ServerSideDocumentFallback> </ServerSideDocumentFallback>
); );
}, },

36
packages/react/components/Drawer.tsx
View File

@ -127,23 +127,25 @@ const DrawerOverlay = forwardRef<HTMLDivElement, DrawerOverlayProps>(
return ( return (
<ServerSideDocumentFallback> <ServerSideDocumentFallback>
{createPortal( {() =>
<Comp createPortal(
{...restPropsExtracted} <Comp
className={drawerOverlayVariant({ {...restPropsExtracted}
...variantProps, className={drawerOverlayVariant({
opened: state.isDragging ? true : state.opened, ...variantProps,
})} opened: state.isDragging ? true : state.opened,
onClick={onOutsideClick} })}
style={{ onClick={onOutsideClick}
backdropFilter, style={{
WebkitBackdropFilter: backdropFilter, backdropFilter,
transitionDuration: state.isDragging ? "0s" : undefined, WebkitBackdropFilter: backdropFilter,
}} transitionDuration: state.isDragging ? "0s" : undefined,
ref={ref} }}
/>, ref={ref}
document.body, />,
)} document.body,
)
}
</ServerSideDocumentFallback> </ServerSideDocumentFallback>
); );
}, },