@ozen-ui/kit
Version:
React component library
23 lines (22 loc) • 1.71 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Container = exports.cnContainer = void 0;
var tslib_1 = require("tslib");
require("./Container.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 useGutters_1 = require("./useGutters");
var useMaxWidth_1 = require("./useMaxWidth");
exports.cnContainer = (0, classname_1.cn)('Container');
var containerGuttersVariant = ['xs', 's', 'm', 'l', 'xl', '2xl'];
var containerMaxWidthVariant = ['s', 'm', 'l', 'fullWidth'];
var containerPositionVariant = ['start', 'center'];
exports.Container = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (inProps, ref) {
var props = (0, useThemeProps_1.useThemeProps)({ props: inProps, name: 'Container' });
var children = props.children, className = props.className, maxWidth = props.maxWidth, position = props.position, gutters = props.gutters, _a = props.as, Tag = _a === void 0 ? 'div' : _a, other = tslib_1.__rest(props, ["children", "className", "maxWidth", "position", "gutters", "as"]);
return (react_1.default.createElement(Tag, tslib_1.__assign({ className: (0, classnames_1.classnames)((0, exports.cnContainer)({ position: position }), (0, useMaxWidth_1.useGenerateMaxWidthCn)(exports.cnContainer, maxWidth), (0, useGutters_1.useGenerateGuttersCn)(exports.cnContainer, gutters), className) }, other, { ref: ref }), children));
});
exports.Container.displayName = 'Container';