import React, { Component } from 'react';
import classNames from 'classnames';
import { keysOf } from '../common';
const gutterSizeToClassNameMap = {
    none: null,
    s: 'softFlexGrid--gutterSmall',
    m: 'softFlexGrid--gutterMedium',
    l: 'softFlexGrid--gutterLarge',
    xl: 'softFlexGrid--gutterXLarge',
};
// @ts-ignore
export const GUTTER_SIZES = keysOf(gutterSizeToClassNameMap);
const columnsToClassNameMap = {
    0: 'softFlexGrid--wrap',
    1: 'softFlexGrid--single',
    2: 'softFlexGrid--halves',
    3: 'softFlexGrid--thirds',
    4: 'softFlexGrid--fourths',
};
export const COLUMNS = Object.keys(columnsToClassNameMap).map((columns) => parseInt(columns, 10));
export class SoftFlexGrid extends Component {
    render() {
        let { children, className, gutterSize, responsive, columns, ...rest } = this.props;
        const classes = classNames('softFlexGrid', gutterSize ? gutterSizeToClassNameMap[gutterSize] : undefined, columns != null ? columnsToClassNameMap[columns] : undefined, {
            'softFlexGrid--responsive': responsive,
        }, className);
        return (React.createElement("div", Object.assign({ className: classes }, rest), children));
    }
}
SoftFlexGrid.defaultProps = { gutterSize: 'l', responsive: true, columns: 0 };
//# sourceMappingURL=SoftFlexGrid.js.map