@kadconsulting/dry
Version:
KAD Reusable Component Library
16 lines • 1.3 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import './ContentSection.scss';
import { forwardRef } from 'react';
import classnames from 'classnames';
/**
* A flexible content section that accepts any content as children.
* It expects two children: ContentSecion.Column1 and ContentSection.Column2.
*/
const ContentSectionComponent = forwardRef(({ id, className, mobileFlexDirection = 'column', ...props }, ref) => (_jsx("section", { id: id, ref: ref, className: classnames(className, 'dry-content-section'), ...props, children: _jsx("div", { className: classnames('dry-content-section__container', `dry-content-section__container--mobile-${mobileFlexDirection}`), children: props.children }) })));
const Column1 = forwardRef(({ id, className, ...props }, ref) => (_jsx("div", { id: id, ref: ref, className: classnames(className, 'dry-content-section__column1'), ...props, children: props.children })));
const Column2 = forwardRef(({ id, className, ...props }, ref) => (_jsx("div", { id: id, ref: ref, className: classnames(className, 'dry-content-section__column2'), ...props, children: props.children })));
const ContentSection = ContentSectionComponent;
ContentSection.Column1 = Column1;
ContentSection.Column2 = Column2;
export default ContentSection;
//# sourceMappingURL=ContentSection.js.map