UNPKG

1.79 kBJavaScriptView Raw
1"use client";
2
3import classNames from 'classnames';
4import * as React from 'react';
5import { useBootstrapPrefix, useBootstrapBreakpoints, useBootstrapMinBreakpoint } from './ThemeProvider';
6import { jsx as _jsx } from "react/jsx-runtime";
7export function useCol({
8 as,
9 bsPrefix,
10 className,
11 ...props
12}) {
13 bsPrefix = useBootstrapPrefix(bsPrefix, 'col');
14 const breakpoints = useBootstrapBreakpoints();
15 const minBreakpoint = useBootstrapMinBreakpoint();
16 const spans = [];
17 const classes = [];
18 breakpoints.forEach(brkPoint => {
19 const propValue = props[brkPoint];
20 delete props[brkPoint];
21 let span;
22 let offset;
23 let order;
24 if (typeof propValue === 'object' && propValue != null) {
25 ({
26 span,
27 offset,
28 order
29 } = propValue);
30 } else {
31 span = propValue;
32 }
33 const infix = brkPoint !== minBreakpoint ? `-${brkPoint}` : '';
34 if (span) spans.push(span === true ? `${bsPrefix}${infix}` : `${bsPrefix}${infix}-${span}`);
35 if (order != null) classes.push(`order${infix}-${order}`);
36 if (offset != null) classes.push(`offset${infix}-${offset}`);
37 });
38 return [{
39 ...props,
40 className: classNames(className, ...spans, ...classes)
41 }, {
42 as,
43 bsPrefix,
44 spans
45 }];
46}
47const Col = /*#__PURE__*/React.forwardRef(
48// Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
49(props, ref) => {
50 const [{
51 className,
52 ...colProps
53 }, {
54 as: Component = 'div',
55 bsPrefix,
56 spans
57 }] = useCol(props);
58 return /*#__PURE__*/_jsx(Component, {
59 ...colProps,
60 ref: ref,
61 className: classNames(className, !spans.length && bsPrefix)
62 });
63});
64Col.displayName = 'Col';
65export default Col;
\No newline at end of file