All files / src/Box styles.ts

100% Statements 8/8
100% Branches 6/6
100% Functions 3/3
100% Lines 5/5

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51          7650x                           7650x                                       7650x 7650x   7x                
import _get from 'lodash/get';
import { css, cssClass } from '../styled';
import { altitude, breakpoint, theme } from '../utils';
import { ThemeConfig } from '../types';
 
export const style = styleProps => cssClass`
  & {
    ${styleProps.style};
    ${buildVisibleAttributes(styleProps)};
  }
 
  ${styleProps.altitude &&
    css`
      & {
        ${altitude(styleProps.altitude)(styleProps)};
      }
    `};
`;
 
export const Box = styleProps => cssClass`
  margin: unset;
  padding: unset;
  border: unset;
  background: unset;
  font: unset;
  font-family: inherit;
  font-size: 100%;
  box-sizing: border-box;
 
  &:focus:not(:focus-visible) {
    outline: none;
  }
 
  & {
    ${theme(styleProps.themeKey, 'css.root')(styleProps)};
  }
`;
 
function buildVisibleAttributes(props: { hiddenBreakpoint?: string; showBreakpoint?: string; theme: ThemeConfig }) {
  let _breakpoint = props.hiddenBreakpoint || props.showBreakpoint;
  if (!_breakpoint) return;
 
  return breakpoint(
    _breakpoint,
    css`
      display: none !important;
    `,
    { show: Boolean(props.showBreakpoint) }
  )(props);
}