nano-slots/types/index.d.ts

A super lightweight modern alternative to [`react-slot-fill`](https://github.com/camwest/react-slot-fill) with familiar API.

/// <reference types="react" />
declare type Unsubscribe = () => void;
declare type Callback = (node?: React.ReactNode) => void;
interface Emitter<Names extends PropertyKey> {
    on(event: Names, cb: Callback): Unsubscribe;
    get(event: Names): React.ReactNode;
    emit(event: Names, node: React.ReactNode): Unsubscribe;
}
export interface ProviderProps {
    children: React.ReactNode;
}
export interface FillProps<Names extends PropertyKey = PropertyKey> {
    /** Names used for matching `Slot` */
    name: Names;
    /** Will be rendered inside matching `Slot` */
    children?: React.ReactNode;
}
export interface SlotProps<Names extends PropertyKey = PropertyKey> {
    /** Names used for matching `Fill` */
    name: Names;
    /** Fallback in case `Fill` not rendered */
    children?: React.ReactNode;
    /** Detect node appearance */
    onChange?(hasFilled: boolean): void;
}
export declare const SlotsProvider: (props: ProviderProps) => JSX.Element, Slot: (props: SlotProps<PropertyKey>) => JSX.Element, Fill: (props: FillProps<PropertyKey>) => null;
export default function createSlots<Names extends PropertyKey>(): {
    Provider: (props: ProviderProps) => JSX.Element;
    Slot: (props: SlotProps<Names>) => JSX.Element;
    Fill: (props: FillProps<Names>) => null;
};
/** @private Don't use! */
export declare function createEmitter<Names extends PropertyKey>(): Emitter<Names>;
export {};