vcc-ui
Version:
A React library for building user interfaces at Volvo Cars
69 lines (68 loc) • 2.18 kB
JavaScript
export function stripFlowElement(el) {
return /^(p|h[1-6])$/.test(el) ? 'span' : el;
}
// TODO: can we refactor this to not look that ugly?
export function arrayifyResponsiveValue(value) {
if (typeof value === 'object') {
if (!Array.isArray(value)) {
const {
default: defaultValue,
fromM,
fromL,
fromXL
} = value;
return [defaultValue, fromM, fromL, fromXL];
}
const [defaultValue, fromM, fromL, fromXL] = value;
return [defaultValue, fromM, fromL, fromXL];
}
return [value, value, value, value];
}
export function populateResponsiveArray(value) {
return value.reduce((filled, item, index) => [...filled, item || filled[index - 1]], []);
}
export function normalizeResponsiveValue(value) {
return populateResponsiveArray(arrayifyResponsiveValue(value));
}
export function getBaseStyle() {
let style = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
const {
fromM,
fromL,
fromXL,
...baseStyle
} = style;
return baseStyle;
}
const breakpoints = ['fromM', 'fromL', 'fromXL'];
export function getStylesForEachBreakpoint(styles, breakpoint) {
const breakpointSpan = breakpoints.indexOf(breakpoint) + 1;
return breakpoints.slice(0, breakpointSpan).reduce((mergedStyles, breakpoint) => {
if (styles[breakpoint]) {
return {
...mergedStyles,
...styles[breakpoint]
};
}
return mergedStyles;
}, {});
}
export function mergeStyles(_ref, subStyle, breakpoint) {
let {
standard: {
styles
},
...subStyles
} = _ref;
const baseStyle = getBaseStyle(styles);
const baseSubStyle = getBaseStyle(subStyles[subStyle] ? subStyles[subStyle].styles : {});
return {
...baseStyle,
...baseSubStyle,
...getStylesForEachBreakpoint(styles, breakpoint)
};
}
export function getRenderedElement(isRootElement, as, variant, subStyle, theme) {
let defaultElement = as || typeof variant === 'string' && typeof subStyle === 'string' && theme.typeScale[variant][subStyle] && theme.typeScale[variant][subStyle].element || 'p';
return isRootElement ? defaultElement : stripFlowElement(defaultElement);
}