wix-style-react
Version:
wix-style-react
29 lines • 1.32 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { dataHooks } from './constants';
import { st, classes, vars } from './FluidColumns.st.css';
/** A fluid columns component*/
class FluidColumns extends React.PureComponent {
render() {
const { dataHook, className, cols, children } = this.props;
return (React.createElement("div", { className: st(classes.root, className), "data-hook": dataHook, style: { [vars.cols]: cols } }, React.Children.map(children, (child, index) => {
return (React.createElement("div", { key: index, "data-hook": dataHooks.item, className: classes.item }, child));
})));
}
}
FluidColumns.displayName = 'FluidColumns';
FluidColumns.propTypes = {
/** Applied as data-hook HTML attribute that can be used in the tests */
dataHook: PropTypes.string,
/** A css class to be applied to the component's root element */
className: PropTypes.string,
/** Define the number of columns. It is used for the grid in order to define how many features will be displayed in a row. The default value is 3. */
cols: PropTypes.number,
/** Children to render. */
children: PropTypes.node.isRequired,
};
FluidColumns.defaultProps = {
cols: 3,
};
export default FluidColumns;
//# sourceMappingURL=FluidColumns.js.map