curls
Version:
💪 Responsive, expressive UI primitives for React written with Style Hooks and Emotion
108 lines (89 loc) • 2.7 kB
JavaScript
exports.__esModule = true
exports.FlexGrid = exports.useFlexGrid = void 0
var _core = require('@style-hooks/core')
var _createComponent = _interopRequireDefault(require('../createComponent'))
var _Box = require('../Box/Box')
var _utils = require('../utils')
var styles = _interopRequireWildcard(require('./styles'))
function _interopRequireWildcard(obj) {
if (obj && obj.__esModule) {
return obj
} else {
var newObj = {}
if (obj != null) {
for (var key in obj) {
if (Object.prototype.hasOwnProperty.call(obj, key)) {
var desc =
Object.defineProperty && Object.getOwnPropertyDescriptor
? Object.getOwnPropertyDescriptor(obj, key)
: {}
if (desc.get || desc.set) {
Object.defineProperty(newObj, key, desc)
} else {
newObj[key] = obj[key]
}
}
}
}
newObj.default = obj
return newObj
}
}
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {default: obj}
}
function _extends() {
_extends =
Object.assign ||
function(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i]
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key]
}
}
}
return target
}
return _extends.apply(this, arguments)
}
const useFlexGrid = props => {
let theme = (0, _core.useTheme)(),
found = false,
nextProps = _extends(
{},
{
__gridBreakpoints: {},
}
),
breakpointOrder = (0, _utils.getBreakpointOrder)(theme.breakpoints),
i = 0
for (; i < breakpointOrder.length; i++) {
const bp = breakpointOrder[i]
if (props[bp] !== void 0) {
nextProps.__gridBreakpoints[bp] = props[bp]
found = true
}
}
if (found === false) return props
const propKeys = Object.keys(props)
for (i = 0; i < propKeys.length; i++) {
const key = propKeys[i]
if (nextProps.__gridBreakpoints[key] === void 0)
nextProps[key] = props[key]
}
return (0, _core.useStyles)('flexGrid', styles, nextProps)
},
FlexGrid = (0, _createComponent.default)('div', props =>
(0, _Box.useBox)(useFlexGrid(props))
)
exports.FlexGrid = FlexGrid
exports.useFlexGrid = useFlexGrid
if (process.env.NODE_ENV !== 'production') {
const propTypes = require('../Box/propTypes').default,
flexPropTypes = require('../Flex/propTypes').default
FlexGrid.displayName = 'FlexGrid'
FlexGrid.propTypes = _extends({}, flexPropTypes, propTypes)
}