Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add inline portal node support #45

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Keep exported types same
  • Loading branch information
aeharding committed Nov 18, 2024
commit b1fb2b62998cbb2abf4bdedaeca00498fcca9c44
14 changes: 5 additions & 9 deletions src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,19 +33,15 @@ interface PortalNodeBase<C extends Component<any>> {
// latest placeholder we replaced. This avoids some race conditions.
unmount(expectedPlaceholder?: Node): void;
}
export interface HtmlBlockPortalNode<C extends Component<any> = Component<any>> extends PortalNodeBase<C> {
export interface HtmlPortalNode<C extends Component<any> = Component<any>> extends PortalNodeBase<C> {
Copy link
Author

@aeharding aeharding Nov 18, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In order to avoid breaking change, I merged block/inline elements into this interface.

Alternatively, I could separate into HtmlBlockPortalNode/HtmlInlinePortalNode (breaking change due to export name change), or keep HtmlPortalNode the same as it used to be, and export HtmlInlinePortalNode in addition/separately (non breaking change)

element: HTMLElement;
elementType: typeof ELEMENT_TYPE_HTML_BLOCK;
}
export interface HtmlInlinePortalNode<C extends Component<any> = Component<any>> extends PortalNodeBase<C> {
element: HTMLElement;
elementType: typeof ELEMENT_TYPE_HTML_INLINE;
elementType: typeof ELEMENT_TYPE_HTML_BLOCK | typeof ELEMENT_TYPE_HTML_INLINE;
}
export interface SvgPortalNode<C extends Component<any> = Component<any>> extends PortalNodeBase<C> {
element: SVGElement;
elementType: typeof ELEMENT_TYPE_SVG;
}
type AnyPortalNode<C extends Component<any> = Component<any>> = HtmlBlockPortalNode<C> | HtmlInlinePortalNode<C> | SvgPortalNode<C>;
type AnyPortalNode<C extends Component<any> = Component<any>> = HtmlPortalNode<C> | SvgPortalNode<C>;


const validateElementType = (domElement: Element, elementType: ANY_ELEMENT_TYPE) => {
Expand Down Expand Up @@ -257,9 +253,9 @@ class OutPortal<C extends Component<any>> extends React.PureComponent<OutPortalP
}

const createHtmlPortalNode = createPortalNode.bind(null, ELEMENT_TYPE_HTML_BLOCK) as
<C extends Component<any> = Component<any>>(options?: Options) => HtmlBlockPortalNode<C>;
<C extends Component<any> = Component<any>>(options?: Options) => HtmlPortalNode<C>;
const createHtmlInlinePortalNode = createPortalNode.bind(null, ELEMENT_TYPE_HTML_INLINE) as
<C extends Component<any> = Component<any>>(options?: Options) => HtmlInlinePortalNode<C>;
<C extends Component<any> = Component<any>>(options?: Options) => HtmlPortalNode<C>;
const createSvgPortalNode = createPortalNode.bind(null, ELEMENT_TYPE_SVG) as
<C extends Component<any> = Component<any>>(options?: Options) => SvgPortalNode<C>;

Expand Down