@ozen-ui/kit
Version:
React component library
20 lines (19 loc) • 1.38 kB
JavaScript
import { __assign, __rest } from "tslib";
import './Container.css';
import React from 'react';
import { classnames } from '@bem-react/classnames';
import { useThemeProps } from '../../hooks/useThemeProps';
import { cn } from '../../utils/classname';
import { polymorphicComponentWithRef, } from '../../utils/polymorphicComponentWithRef';
import { useGenerateGuttersCn } from './useGutters';
import { useGenerateMaxWidthCn } from './useMaxWidth';
export var cnContainer = cn('Container');
var containerGuttersVariant = ['xs', 's', 'm', 'l', 'xl', '2xl'];
var containerMaxWidthVariant = ['s', 'm', 'l', 'fullWidth'];
var containerPositionVariant = ['start', 'center'];
export var Container = polymorphicComponentWithRef(function (inProps, ref) {
var props = 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 = __rest(props, ["children", "className", "maxWidth", "position", "gutters", "as"]);
return (React.createElement(Tag, __assign({ className: classnames(cnContainer({ position: position }), useGenerateMaxWidthCn(cnContainer, maxWidth), useGenerateGuttersCn(cnContainer, gutters), className) }, other, { ref: ref }), children));
});
Container.displayName = 'Container';