feat: parent child retrieval (#12106)

Signed-off-by: -LAN- <laipz8200@outlook.com>
Co-authored-by: -LAN- <laipz8200@outlook.com>
This commit is contained in:
Wu Tianwei
2024-12-26 12:01:51 +08:00
committed by GitHub
parent efdd54a670
commit 49feff082f
196 changed files with 9035 additions and 3115 deletions

View File

@@ -21,6 +21,7 @@ export type IToastProps = {
children?: ReactNode
onClose?: () => void
className?: string
customComponent?: ReactNode
}
type IToastContext = {
notify: (props: IToastProps) => void
@@ -35,6 +36,7 @@ const Toast = ({
message,
children,
className,
customComponent,
}: IToastProps) => {
const { close } = useToastContext()
// sometimes message is react node array. Not handle it.
@@ -49,8 +51,7 @@ const Toast = ({
'top-0',
'right-0',
)}>
<div className={`absolute inset-0 opacity-40 ${
(type === 'success' && 'bg-[linear-gradient(92deg,rgba(23,178,106,0.25)_0%,rgba(255,255,255,0.00)_100%)]')
<div className={`absolute inset-0 opacity-40 -z-10 ${(type === 'success' && 'bg-[linear-gradient(92deg,rgba(23,178,106,0.25)_0%,rgba(255,255,255,0.00)_100%)]')
|| (type === 'warning' && 'bg-[linear-gradient(92deg,rgba(247,144,9,0.25)_0%,rgba(255,255,255,0.00)_100%)]')
|| (type === 'error' && 'bg-[linear-gradient(92deg,rgba(240,68,56,0.25)_0%,rgba(255,255,255,0.00)_100%)]')
|| (type === 'info' && 'bg-[linear-gradient(92deg,rgba(11,165,236,0.25)_0%,rgba(255,255,255,0.00)_100%)]')
@@ -63,14 +64,17 @@ const Toast = ({
{type === 'warning' && <RiAlertFill className={`${size === 'md' ? 'w-5 h-5' : 'w-4 h-4'} text-text-warning-secondary`} aria-hidden="true" />}
{type === 'info' && <RiInformation2Fill className={`${size === 'md' ? 'w-5 h-5' : 'w-4 h-4'} text-text-accent`} aria-hidden="true" />}
</div>
<div className={`flex py-1 ${size === 'md' ? 'px-1' : 'px-0.5'} flex-col items-start gap-1 flex-grow`}>
<div className='text-text-primary system-sm-semibold'>{message}</div>
<div className={`flex py-1 ${size === 'md' ? 'px-1' : 'px-0.5'} flex-col items-start gap-1 flex-grow z-10`}>
<div className='flex items-center gap-1'>
<div className='text-text-primary system-sm-semibold'>{message}</div>
{customComponent}
</div>
{children && <div className='text-text-secondary system-xs-regular'>
{children}
</div>
}
</div>
<ActionButton className='z-[1000]' onClick={close}>
<ActionButton onClick={close}>
<RiCloseLine className='w-4 h-4 flex-shrink-0 text-text-tertiary' />
</ActionButton>
</div>
@@ -117,7 +121,8 @@ Toast.notify = ({
message,
duration,
className,
}: Pick<IToastProps, 'type' | 'size' | 'message' | 'duration' | 'className'>) => {
customComponent,
}: Pick<IToastProps, 'type' | 'size' | 'message' | 'duration' | 'className' | 'customComponent'>) => {
const defaultDuring = (type === 'success' || type === 'info') ? 3000 : 6000
if (typeof window === 'object') {
const holder = document.createElement('div')
@@ -133,7 +138,7 @@ Toast.notify = ({
}
},
}}>
<Toast type={type} size={size} message={message} duration={duration} className={className} />
<Toast type={type} size={size} message={message} duration={duration} className={className} customComponent={customComponent} />
</ToastContext.Provider>,
)
document.body.appendChild(holder)