UNPKG

@ozen-ui/kit

Version:

React component library

20 lines (19 loc) 1.38 kB
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';