import React from 'react';
import { CSSProperties } from 'glamor';
import { ApphouseComponent } from '../components/component.interfaces';
export type ValueWithLabelDirection = 'row' | 'column';
export interface ValueWithLabelStyles {
    container?: CSSProperties;
    value?: CSSProperties;
    label?: CSSProperties;
}
export interface ValueWithLabelProps extends ApphouseComponent<ValueWithLabelStyles> {
    /**
     * The value of the component.
     */
    value?: string;
    /**
     * The label of the component.
     */
    label: string;
    /**
     * The direction in which the label and value will be displayed.
     * @optional
     * @default 'column'
     */
    direction?: ValueWithLabelDirection;
    /**
     * If true, the value will be truncated at this width.
     * It will be truncated and be displayed in 1 line.
     * @optional
     * @default false
     */
    truncateWidth?: number;
    /**
     * If true, the value will be bold.
     * @default false
     */
    bold?: boolean;
    /**
     * The children of the component.
     */
    children?: React.ReactNode;
}
export declare const ValueWithLabel: React.FC<ValueWithLabelProps>;