@carbon/react
Version:
React components for the Carbon Design System
65 lines (59 loc) • 1.98 kB
JavaScript
/**
* Copyright IBM Corp. 2016, 2023
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
;
Object.defineProperty(exports, '__esModule', { value: true });
var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var cx = require('classnames');
var PropTypes = require('prop-types');
var React = require('react');
var usePrefix = require('../../internal/usePrefix.js');
function Row({
as: BaseComponent = 'div',
condensed = false,
narrow = false,
className: containerClassName,
children,
...rest
}) {
const prefix = usePrefix.usePrefix();
const className = cx(containerClassName, {
[`${prefix}--row`]: true,
[`${prefix}--row--condensed`]: condensed,
[`${prefix}--row--narrow`]: narrow
});
// TypeScript type validation reports conflicts on different instances of keyof JSX.IntrinsicElements
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
const BaseComponentAsAny = BaseComponent;
return /*#__PURE__*/React.createElement(BaseComponentAsAny, _rollupPluginBabelHelpers.extends({
className: className
}, rest), children);
}
Row.propTypes = {
/**
* Provide a custom element to render instead of the default <div>
*/
as: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType]),
/**
* Pass in content that will be rendered within the `Row`
*/
children: PropTypes.node,
/**
* Specify a custom className to be applied to the `Row`
*/
className: PropTypes.string,
/**
* Specify a single row as condensed.Rows that are adjacent
* and are condensed will have 2px of margin between them to match gutter.
*/
condensed: PropTypes.bool,
/**
* Specify a single row as narrow. The container will hang
* 16px into the gutter.
*/
narrow: PropTypes.bool
};
exports.default = Row;