@dschz/solid-auto-sizer/dist/index.d.ts

SolidJS component that automatically measures and provides the width and height of its parent — useful for virtualized lists, grids, and charts.

import { JSX } from 'solid-js';

type Size = {
    readonly width: number;
    readonly height: number;
};
/**
 * The props for the AutoSizer component.
 */
type AutoSizerProps = {
    /** Optional CSS class for the container */
    readonly class?: string;
    /** Optional inline styles for the container */
    readonly style?: Omit<JSX.CSSProperties, "width" | "height">;
    /** Default width for initial render */
    readonly initialWidth?: number;
    /** Default height for initial render */
    readonly initialHeight?: number;
    /** Callback when size changes */
    readonly onResize?: (size: Size) => void;
    /** Render prop that receives the measured dimensions */
    readonly children: (size: Size) => JSX.Element;
};
/**
 * AutoSizer component that measures its container and provides dimensions to children.
 *
 * Similar to [react-virtualized-auto-sizer](https://github.com/bvaughn/react-virtualized-auto-sizer), this component uses ResizeObserver to
 * monitor its container size and re-renders children with updated dimensions.
 *
 * @example
 * ```tsx
 * // Standard usage - provides both width and height
 * <AutoSizer>
 *   {({ width, height }) => (
 *     <SolidUplot width={width} height={height} data={data} />
 *   )}
 * </AutoSizer>
 *
 * // Setting initial size
 * <AutoSizer initialWidth={400} initialHeight={300}>
 *   {({ width, height }) => (
 *     <SolidUplot width={width} height={height} data={data} />
 *   )}
 * </AutoSizer>
 * ```
 */
declare const AutoSizer: (props: AutoSizerProps) => JSX.Element;

export { AutoSizer };