import { InjectionKey, Ref } from 'vue';
export declare const breakpoints: readonly ["xs", "sm", "md", "lg", "xl"];
export declare const breakpointsUpDown: readonly ["smUp", "smDown", "mdUp", "mdDown", "lgUp", "lgDown", "xlUp", "xlDown"];
export type TBreakpoint = typeof breakpoints[number];
export type TBreakpointUpDown = typeof breakpointsUpDown[number];
export type TBreakpointMap = Record<TBreakpoint, string>;
export interface IDisplayOptions {
    mobileBreakpoint?: number | TBreakpoint;
    thresholds?: Partial<TDisplayThresholds>;
}
export interface IDisplayInstance {
    name: Ref<TBreakpoint>;
    xs: Ref<boolean>;
    sm: Ref<boolean>;
    md: Ref<boolean>;
    lg: Ref<boolean>;
    xl: Ref<boolean>;
    smUp: Ref<boolean>;
    mdUp: Ref<boolean>;
    lgUp: Ref<boolean>;
    xlUp: Ref<boolean>;
    smDown: Ref<boolean>;
    mdDown: Ref<boolean>;
    lgDown: Ref<boolean>;
    xlDown: Ref<boolean>;
    mobile: Ref<boolean>;
    mobileBreakpoint: Ref<number | TBreakpoint>;
    width: Ref<number>;
    height: Ref<number>;
    platform: Ref<TDisplayPlatform>;
    thresholds: Ref<TDisplayThresholds>;
    screenHeight: Ref<number>;
    screenWidth: Ref<number>;
    ssr: boolean;
    update(): void;
}
export type TDisplayThresholds = {
    [key in TBreakpoint]: number;
};
export type TDisplayPlatform = {
    android: boolean;
    ios: boolean;
    cordova: boolean;
    electron: boolean;
    chrome: boolean;
    edge: boolean;
    firefox: boolean;
    opera: boolean;
    win: boolean;
    mac: boolean;
    linux: boolean;
    touch: boolean;
    ssr: boolean;
};
export type TSSROptions = boolean | {
    clientWidth: number;
    clientHeight?: number;
};
export declare const DisplaySymbol: InjectionKey<IDisplayInstance>;
export declare function createDisplay(options?: IDisplayOptions, ssr?: TSSROptions): IDisplayInstance;
export declare function useDisplay(): IDisplayInstance;
