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

refactor: use separately extracted props

Browse Source
This commit is contained in:
p-sw 2024-05-28 22:20:43 +09:00
parent dcbad53d39
commit 7fc2a64d29
1 changed files with 25 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
packages/react/components/Dialog.tsx
View File

@ -113,13 +113,17 @@ interface DialogOverlay
const DialogOverlay = React.forwardRef<HTMLDivElement, DialogOverlay>( const DialogOverlay = React.forwardRef<HTMLDivElement, DialogOverlay>(
(props, ref) => { (props, ref) => {
const [{ opened }, setContext] = useDialogContext(); const [{ opened }, setContext] = useDialogContext();
const [variantProps, { children, closeOnClick, onClick, ...otherProps }] = const [variantProps, otherPropsCompressed] = resolveDialogOverlayVariant({
resolveDialogOverlayVariant({ ...props, opened }); ...props,
opened,
});
const { children, closeOnClick, onClick, ...otherPropsExtracted } =
otherPropsCompressed;
return ( return (
<> <>
{ReactDOM.createPortal( {ReactDOM.createPortal(
<div <div
{...otherProps} {...otherPropsExtracted}
ref={ref} ref={ref}
className={dialogOverlayVariant(variantProps)} className={dialogOverlayVariant(variantProps)}
onClick={(e) => { onClick={(e) => {
@ -192,11 +196,14 @@ interface DialogContent
const DialogContent = React.forwardRef<HTMLDivElement, DialogContent>( const DialogContent = React.forwardRef<HTMLDivElement, DialogContent>(
(props, ref) => { (props, ref) => {
const [{ opened }] = useDialogContext(); const [{ opened }] = useDialogContext();
const [variantProps, { children, ...otherProps }] = const [variantProps, otherPropsCompressed] = resolveDialogContentVariant({
resolveDialogContentVariant({ ...props, opened }); ...props,
opened,
});
const { children, ...otherPropsExtracted } = otherPropsCompressed;
return ( return (
<div <div
{...otherProps} {...otherPropsExtracted}
ref={ref} ref={ref}
className={dialogContentVariant(variantProps)} className={dialogContentVariant(variantProps)}
> >
@ -254,11 +261,12 @@ interface DialogHeaderProps
const DialogHeader = React.forwardRef<HTMLElement, DialogHeaderProps>( const DialogHeader = React.forwardRef<HTMLElement, DialogHeaderProps>(
(props, ref) => { (props, ref) => {
const [variantProps, { children, ...otherProps }] = const [variantProps, otherPropsCompressed] =
resolveDialogHeaderVariant(props); resolveDialogHeaderVariant(props);
const { children, ...otherPropsExtracted } = otherPropsCompressed;
return ( return (
<header <header
{...otherProps} {...otherPropsExtracted}
ref={ref} ref={ref}
className={dialogHeaderVariant(variantProps)} className={dialogHeaderVariant(variantProps)}
> >
@ -328,11 +336,12 @@ interface DialogSubtitleProps
const DialogTitle = React.forwardRef<HTMLHeadingElement, DialogTitleProps>( const DialogTitle = React.forwardRef<HTMLHeadingElement, DialogTitleProps>(
(props, ref) => { (props, ref) => {
const [variantProps, { children, ...otherProps }] = const [variantProps, otherPropsCompressed] =
resolveDialogTitleVariant(props); resolveDialogTitleVariant(props);
const { children, ...otherPropsExtracted } = otherPropsCompressed;
return ( return (
<h1 <h1
{...otherProps} {...otherPropsExtracted}
ref={ref} ref={ref}
className={dialogTitleVariant(variantProps)} className={dialogTitleVariant(variantProps)}
> >
@ -346,11 +355,12 @@ const DialogSubtitle = React.forwardRef<
HTMLHeadingElement, HTMLHeadingElement,
DialogSubtitleProps DialogSubtitleProps
>((props, ref) => { >((props, ref) => {
const [variantProps, { children, ...otherProps }] = const [variantProps, otherPropsCompressed] =
resolveDialogSubtitleVariant(props); resolveDialogSubtitleVariant(props);
const { children, ...otherPropsExtracted } = otherPropsCompressed;
return ( return (
<h2 <h2
{...otherProps} {...otherPropsExtracted}
ref={ref} ref={ref}
className={dialogSubtitleVariant(variantProps)} className={dialogSubtitleVariant(variantProps)}
> >
@ -385,11 +395,12 @@ interface DialogFooterProps
const DialogFooter = React.forwardRef<HTMLDivElement, DialogFooterProps>( const DialogFooter = React.forwardRef<HTMLDivElement, DialogFooterProps>(
(props, ref) => { (props, ref) => {
const [variantProps, { children, ...otherProps }] = const [variantProps, otherPropsCompressed] =
resolveDialogFooterVariant(props); resolveDialogFooterVariant(props);
const { children, ...otherPropsExtracted } = otherPropsCompressed;
return ( return (
<div <div
{...otherProps} {...otherPropsExtracted}
ref={ref} ref={ref}
className={dialogFooterVariant(variantProps)} className={dialogFooterVariant(variantProps)}
> >