import { Signal, TNode } from '@tempots/dom';
export type Breakpoints = {
    [_ in string]: number;
};
export interface BreakpointInfo<T extends Breakpoints, K extends keyof T = keyof T & string> {
    value: Signal<{
        width: number;
        breakpoint: K;
    }>;
    breakpoints: T;
    asList: [number, K][];
    is: <K extends string & keyof T>(value: BreakPointComparison<K>, width: number) => boolean;
}
export type Operator = '!=' | '<=' | '>=' | '<' | '>' | '=';
export type BreakPointComparison<K extends string> = K | `${Operator}${K}`;
export declare function compareBreakpoint<T extends Breakpoints, K extends string & keyof T = keyof T & string>(sortedList: [number, keyof T][], value: BreakPointComparison<K>, width: number): boolean;
export declare function findBreakpoint<T extends Breakpoints>(sortedList: [number, keyof T][], width: number): keyof T;
export interface WithBreakpointOptions<T extends Breakpoints> {
    breakpoints: T;
    mode?: 'element' | 'viewport';
}
export declare function WithBreakpoint<T extends Breakpoints>(fn: (info: BreakpointInfo<T>) => TNode, { breakpoints, mode }: WithBreakpointOptions<T>): import("@tempots/dom").Renderable<import("@tempots/dom").DOMContext>;
export type BeatUIBreakpoints = {
    zero: number;
    xs: number;
    sm: number;
    md: number;
    lg: number;
    xl: number;
};
export type BeatUIBreakpoint = keyof BeatUIBreakpoints;
export declare function WithBeatUIBreakpoint(fn: (info: BreakpointInfo<BeatUIBreakpoints>) => TNode): import("@tempots/dom").Renderable;
export type TWElementBreakpoints = {
    zero: number;
    '3xs': number;
    '2xs': number;
    xs: number;
    sm: number;
    md: number;
    lg: number;
    xl: number;
    '2xl': number;
    '3xl': number;
    '4xl': number;
    '5xl': number;
    '6xl': number;
};
export declare function WithBeatUIElementBreakpoint(fn: (info: BreakpointInfo<TWElementBreakpoints>) => TNode): import("@tempots/dom").Renderable;
