platform-bible-react
    Preparing search index...

    Variable TooltipPortalContainerProviderConst

    TooltipPortalContainerProvider: (
        __namedParameters: {
            children: ReactNode;
            container: null | HTMLElement;
        },
    ) => Element = PortalContainerProvider

    Keeps descendant TooltipContent inside container instead of document.body. Use it when a tooltip sits inside an ancestor that stacks above the tooltip layer: content portalled to the body becomes a positioned sibling of that ancestor in the root stacking context, so the opaque first-run wizard gate at Z_INDEX_FIRST_RUN (700) hides tooltips at Z_INDEX_TOOLTIP (550) entirely.

    Contract:

    • Pass null for container until the ancestor element exists (the initial state of a ref-callback useState) to keep Radix's document.body default; once it exists, later opens portal into it.
    • The ancestor must wrap this provider, not the other way round, so only its own descendants are redirected.
    • Only affects tooltips mounted as React descendants; already-open tooltips are not re-portalled.

    PopoverPortalContainerProvider in popover.tsx does the same for popovers.

    Type declaration

      • (
            __namedParameters: {
                children: ReactNode;
                container: null | HTMLElement;
            },
        ): Element

      • Parameters

        • __namedParameters: { children: ReactNode; container: null | HTMLElement }

        Returns Element

    const [dialogEl, setDialogEl] = useState<HTMLDivElement | null>(null);

    <Dialog open>
      <DialogContent ref={setDialogEl} style={{ zIndex: Z_INDEX_FIRST_RUN }}>
        <TooltipPortalContainerProvider container={dialogEl}>
          <FirstRunShell ... />
        </TooltipPortalContainerProvider>
      </DialogContent>
    </Dialog>;

    Settings

    Member Visibility