2023-02-02 11:12:31 +00:00
|
|
|
import React, { ReactNode } from 'react';
|
2021-01-04 13:30:23 +00:00
|
|
|
|
2021-10-06 09:53:27 +00:00
|
|
|
import DialogPortal from './DialogPortal';
|
2021-01-04 13:30:23 +00:00
|
|
|
|
|
|
|
type Props = {
|
|
|
|
|
|
|
|
/**
|
|
|
|
* The component(s) to be displayed within the drawer portal.
|
|
|
|
*/
|
2023-02-02 11:12:31 +00:00
|
|
|
children: ReactNode;
|
2021-10-04 14:07:05 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Class name used to add custom styles to the portal.
|
|
|
|
*/
|
2023-02-02 11:12:31 +00:00
|
|
|
className?: string;
|
2021-01-04 13:30:23 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Component meant to render a drawer at the bottom of the screen,
|
|
|
|
* by creating a portal containing the component's children.
|
|
|
|
*
|
|
|
|
* @returns {ReactElement}
|
|
|
|
*/
|
2021-10-04 14:07:05 +00:00
|
|
|
function JitsiPortal({ children, className }: Props) {
|
2021-10-06 09:53:27 +00:00
|
|
|
return (
|
2021-10-04 14:07:05 +00:00
|
|
|
<DialogPortal className = { `drawer-portal ${className ?? ''}` }>
|
2021-10-06 09:53:27 +00:00
|
|
|
{ children }
|
|
|
|
</DialogPortal>
|
2021-01-04 13:30:23 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2021-10-04 14:07:05 +00:00
|
|
|
export default JitsiPortal;
|