@base-ui-components/react
Version:
Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.
37 lines (35 loc) • 1.08 kB
JavaScript
'use client';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { useFloatingPortalNode } from "../floating-ui-react/index.js";
/**
* `FloatingPortal` includes tabbable logic handling for focus management.
* For components that don't need tabbable logic, use `FloatingPortalLite`.
* @internal
*/
import { jsxs as _jsxs } from "react/jsx-runtime";
export const FloatingPortalLite = /*#__PURE__*/React.forwardRef(function FloatingPortalLite(componentProps, forwardedRef) {
const {
children,
container,
className,
render,
...elementProps
} = componentProps;
const {
portalNode,
portalSubtree
} = useFloatingPortalNode({
container,
ref: forwardedRef,
componentProps,
elementProps
});
if (!portalSubtree && !portalNode) {
return null;
}
return /*#__PURE__*/_jsxs(React.Fragment, {
children: [portalSubtree, portalNode && /*#__PURE__*/ReactDOM.createPortal(children, portalNode)]
});
});
if (process.env.NODE_ENV !== "production") FloatingPortalLite.displayName = "FloatingPortalLite";