seti-ramesesv1
Version:
Reusable components and context for Next.js apps
88 lines (83 loc) • 2.91 kB
JavaScript
import responsivePropType from '../responsivePropType/responsivePropType.js';
import style from '../style/style.js';
import compose from '../compose/compose.js';
import { createUnaryUnit, getValue } from '../spacing/spacing.js';
import { handleBreakpoints } from '../breakpoints/breakpoints.js';
// false positive
// eslint-disable-next-line react/function-component-definition
const gap = props => {
if (props.gap !== undefined && props.gap !== null) {
const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'gap');
const styleFromPropValue = propValue => ({
gap: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.gap, styleFromPropValue);
}
return null;
};
gap.propTypes = process.env.NODE_ENV !== 'production' ? {
gap: responsivePropType
} : {};
gap.filterProps = ['gap'];
// false positive
// eslint-disable-next-line react/function-component-definition
const columnGap = props => {
if (props.columnGap !== undefined && props.columnGap !== null) {
const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'columnGap');
const styleFromPropValue = propValue => ({
columnGap: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.columnGap, styleFromPropValue);
}
return null;
};
columnGap.propTypes = process.env.NODE_ENV !== 'production' ? {
columnGap: responsivePropType
} : {};
columnGap.filterProps = ['columnGap'];
// false positive
// eslint-disable-next-line react/function-component-definition
const rowGap = props => {
if (props.rowGap !== undefined && props.rowGap !== null) {
const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'rowGap');
const styleFromPropValue = propValue => ({
rowGap: getValue(transformer, propValue)
});
return handleBreakpoints(props, props.rowGap, styleFromPropValue);
}
return null;
};
rowGap.propTypes = process.env.NODE_ENV !== 'production' ? {
rowGap: responsivePropType
} : {};
rowGap.filterProps = ['rowGap'];
const gridColumn = style({
prop: 'gridColumn'
});
const gridRow = style({
prop: 'gridRow'
});
const gridAutoFlow = style({
prop: 'gridAutoFlow'
});
const gridAutoColumns = style({
prop: 'gridAutoColumns'
});
const gridAutoRows = style({
prop: 'gridAutoRows'
});
const gridTemplateColumns = style({
prop: 'gridTemplateColumns'
});
const gridTemplateRows = style({
prop: 'gridTemplateRows'
});
const gridTemplateAreas = style({
prop: 'gridTemplateAreas'
});
const gridArea = style({
prop: 'gridArea'
});
compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);
export { columnGap, gap, gridArea, gridAutoColumns, gridAutoFlow, gridAutoRows, gridColumn, gridRow, gridTemplateAreas, gridTemplateColumns, gridTemplateRows, rowGap };
//# sourceMappingURL=cssGrid.js.map