You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
32 lines
1.0 KiB
32 lines
1.0 KiB
import PropTypes from 'prop-types';
|
|
import { DEFAULT_BREAKPOINTS, DEFAULT_MIN_BREAKPOINT } from './ThemeProvider';
|
|
export function responsivePropType(propType) {
|
|
return PropTypes.oneOfType([propType, PropTypes.shape({
|
|
xs: propType,
|
|
sm: propType,
|
|
md: propType,
|
|
lg: propType,
|
|
xl: propType,
|
|
xxl: propType
|
|
})]);
|
|
}
|
|
export default function createUtilityClassName(utilityValues, breakpoints = DEFAULT_BREAKPOINTS, minBreakpoint = DEFAULT_MIN_BREAKPOINT) {
|
|
const classes = [];
|
|
Object.entries(utilityValues).forEach(([utilName, utilValue]) => {
|
|
if (utilValue != null) {
|
|
if (typeof utilValue === 'object') {
|
|
breakpoints.forEach(brkPoint => {
|
|
const bpValue = utilValue[brkPoint];
|
|
|
|
if (bpValue != null) {
|
|
const infix = brkPoint !== minBreakpoint ? `-${brkPoint}` : '';
|
|
classes.push(`${utilName}${infix}-${bpValue}`);
|
|
}
|
|
});
|
|
} else {
|
|
classes.push(`${utilName}-${utilValue}`);
|
|
}
|
|
}
|
|
});
|
|
return classes;
|
|
} |