import { ICSSInJSStyle, SiteVariablesPrepared } from '@fluentui/styles';
import * as React from 'react';
declare type CSSBorderStyles = Pick<React.CSSProperties, 'borderWidth' | 'borderRadius'>;
declare type BorderPadding = Record<'top' | 'bottom' | 'left' | 'right', string>;
declare type BorderFocusStyles = CSSBorderStyles & {
    variables?: SiteVariablesPrepared | {
        borderWidth: string;
        borderRadius: string;
        focusBorderRadius?: string;
        focusInnerBorderColor: string;
        focusOuterBorderColor: string;
        focusInnerBorderWidth?: string;
        focusOuterBorderWidth?: string;
        zIndexes: {
            foreground: string;
        };
    };
    focusBorderRadius?: string;
    focusInnerBorderColor?: string;
    focusOuterBorderColor?: string;
    focusInnerBorderWidth?: string;
    focusOuterBorderWidth?: string;
    borderPadding?: string | BorderPadding;
    zIndex?: string;
};
/**
 * Returns style object that can be used for styling components on focus state.
 * NOTE: the element where this is used needs to have relative positioning so that the
 * pseudo elements created on focus can be properly positioned.
 */
export declare const getBorderFocusStyles: (args: BorderFocusStyles) => Record<':focus' | ':focus-visible', ICSSInJSStyle>;
export {};