@ozen-ui/kit
Version:
React component library
48 lines (47 loc) • 2.21 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Grid = exports.cnGrid = exports.gridJustifyVariant = exports.gridAlignVariant = exports.gridGapVariant = exports.gridColsVariant = void 0;
var tslib_1 = require("tslib");
require("./Grid.css");
var react_1 = tslib_1.__importDefault(require("react"));
var classnames_1 = require("@bem-react/classnames");
var useThemeProps_1 = require("../../hooks/useThemeProps");
var classname_1 = require("../../utils/classname");
var polymorphicComponentWithRef_1 = require("../../utils/polymorphicComponentWithRef");
var constants_1 = require("./constants");
var useGrid_1 = require("./useGrid");
exports.gridColsVariant = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
exports.gridGapVariant = [
'0',
'xs',
's',
'm',
'l',
'xl',
'2xl',
'3xl',
'4xl',
'5xl',
'6xl',
'7xl',
'8xl',
];
exports.gridAlignVariant = ['start', 'end', 'center'];
exports.gridJustifyVariant = ['start', 'end', 'center'];
exports.cnGrid = (0, classname_1.cn)('Grid');
exports.Grid = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
var props = (0, useThemeProps_1.useThemeProps)({
props: inProps,
name: 'Grid',
});
var _a = props.cols, cols = _a === void 0 ? constants_1.GRID_DEFAULT_COLS : _a, _b = props.gap, gap = _b === void 0 ? constants_1.GRID_DEFAULT_GAP : _b, _c = props.as, Tag = _c === void 0 ? constants_1.GRID_DEFAULT_TAG : _c, colGap = props.colGap, rowGap = props.rowGap, align = props.align, justify = props.justify, children = props.children, className = props.className, other = tslib_1.__rest(props, ["cols", "gap", "as", "colGap", "rowGap", "align", "justify", "children", "className"]);
return (react_1.default.createElement(Tag, tslib_1.__assign({ className: (0, classnames_1.classnames)((0, exports.cnGrid)({}), (0, useGrid_1.useGenerateGridModsCn)(exports.cnGrid, {
cols: cols,
gap: gap,
colGap: colGap,
rowGap: rowGap,
align: align,
justify: justify,
}), className) }, other, { ref: ref }), children));
});
exports.Grid.displayName = 'Grid';