@meonode/ui/dist/hoc/portal.hoc.d.ts

A structured approach to component composition with built-in theming, prop separation, and dynamic children handling.

import type { ComponentNode, NodeInstance, PortalLauncher, PortalProps } from '../node.type';
/**
 * Creates a portal component with a fixed set of providers by passing an array of `NodeInstance`s.
 * The content component will be rendered within these providers. This method is considered deprecated.
 * @deprecated Use `Portal(provider: NodeInstance<any>, component: ...)` instead for fixed providers.
 * Passing an array of providers for fixed setup is deprecated and will trigger a console warning.
 * @param provider An array of `NodeInstance`s that will wrap the portal content. Each NodeInstance
 * should represent a React context provider (e.g., `ThemeProvider({ theme })`).
 * @param component The React component function that defines the portal's content. It receives
 * props of type `PortalProps<P>` and should return a `ComponentNode`.
 * @returns A launcher function that, when called, creates and controls the portal instance.
 * @example
 * ```ts
 * // Example of a deprecated usage with an array of fixed providers:
 * const DeprecatedThemedModal = Portal(
 * [ThemeProvider({ theme: 'dark' }), LanguageProvider({ lang: 'en' })],
 * (props) => Div({ children: props.children, style: { background: props.nodetheme?.background } })
 * );
 *
 * const deprecatedModalInstance = DeprecatedThemedModal({ children: "Deprecated content" });
 * // A console warning will be logged when DeprecatedThemedModal is created.
 * deprecatedModalInstance.unmount();
 * ```
 */
export declare function Portal<P extends Record<string, any>>(provider: NodeInstance<any>[], component: (props: PortalProps<P>) => ComponentNode): PortalLauncher<P>;
/**
 * Creates a portal component with a single fixed provider.
 * The content component will be rendered within this provider. This is the preferred method
 * for providing fixed context to your portal content.
 * @param provider A single `NodeInstance` that will wrap the portal content. This should typically
 * be a React context provider (e.g., `ThemeProvider({ theme })`).
 * @param component The React component function that defines the portal's content. It receives
 * props of type `PortalProps<P>` and should return a `ComponentNode`.
 * @returns A launcher function that, when called, creates and controls the portal instance.
 * @example
 * ```ts
 * // Example of preferred usage with a single fixed provider:
 * const ThemedModal = Portal(
 * ThemeProvider({ theme: 'light' }),
 * (props) => Div({ children: props.children, style: { background: props.nodetheme?.background } })
 * );
 *
 * const modalInstance = ThemedModal({ children: "Preferred content" });
 * modalInstance.unmount();
 * ```
 */
export declare function Portal<P extends Record<string, any>>(provider: NodeInstance<any>, component: (props: PortalProps<P>) => ComponentNode): PortalLauncher<P>;
/**
 * Creates a basic portal component without any fixed providers.
 * Dynamic providers can still be passed as props when launching the portal instance.
 * @param component The React component function that defines the portal's content. It receives
 * props of type `PortalProps<P>` and should return a `ComponentNode`.
 * @returns A launcher function that, when called, creates and controls the portal instance.
 * @example
 * ```ts
 * // Example of basic usage without fixed providers:
 * const BasicModal = Portal(
 * (props) => Div({ children: props.children, style: { padding: '20px', border: '1px solid black' } })
 * );
 *
 * const basicModalInstance = BasicModal({ children: "Hello from a basic portal!" });
 * basicModalInstance.unmount();
 *
 * // Example with dynamic providers when launching:
 * const DynamicThemedModal = Portal(
 * (props) => Div({ children: props.children, style: { background: props.nodetheme?.background || 'white' } })
 * );
 *
 * const dynamicModalInstance = DynamicThemedModal({
 * providers: ThemeProvider({ theme: 'blue' }), // Dynamic provider
 * children: "Content with dynamic theme"
 * });
 * dynamicModalInstance.unmount();
 * ```
 */
export declare function Portal<P extends Record<string, any>>(component: (props: PortalProps<P>) => ComponentNode): PortalLauncher<P>;
//# sourceMappingURL=portal.hoc.d.ts.map