import { Responsive } from './util';

export declare const justifyValues: readonly [{
    readonly key: "start";
    readonly value: "flex-start";
}, {
    readonly key: "center";
    readonly value: "center";
}, {
    readonly key: "end";
    readonly value: "flex-end";
}, {
    readonly key: "between";
    readonly value: "space-between";
}, {
    readonly key: "stretch";
    readonly value: "stretch";
}];
export declare const justify: readonly [{
    readonly key: "justify";
    readonly className: "teddy-jc";
    readonly values: readonly [{
        readonly key: "start";
        readonly value: "flex-start";
    }, {
        readonly key: "center";
        readonly value: "center";
    }, {
        readonly key: "end";
        readonly value: "flex-end";
    }, {
        readonly key: "between";
        readonly value: "space-between";
    }, {
        readonly key: "stretch";
        readonly value: "stretch";
    }];
}];
/**
 * The alignment of the grid items. It can be  or a responsive value.
 * A responsive value is an object with the keys 'sm', 'md', 'lg', 'xl' and a value for the corresponding breakpoint.
 * @example align={{ sm: 'start', md: 'center' }}
 * @default 'start'
 */
export type Justify = Responsive<(typeof justifyValues)[number]['key']>;