curls
Version:
💪 Responsive, expressive UI primitives for React written with Style Hooks and Emotion
372 lines (358 loc) • 8.95 kB
JavaScript
exports.__esModule = true
exports.p = exports.m = exports.br = exports.bw = exports.d = exports.pos = exports.l = exports.b = exports.r = exports.t = exports.maxH = exports.maxW = exports.minH = exports.minW = exports.h = exports.w = exports.bc = exports.bg = exports.sh = exports.z = exports.ov = void 0
var _core = require('@emotion/core')
var _utils = require('../utils')
var dT = _interopRequireWildcard(require('./defaultTheme'))
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
}
}
const ws = /\s+/,
overflow = {
auto: {
name: '1v8x7dw',
styles: 'overflow:auto;',
},
autoX: {
name: 'ayshjd',
styles: 'overflow-x:auto;',
},
autoY: {
name: '13v3rg8',
styles: 'overflow-y:auto;',
},
hidden: {
name: 'i6bazn',
styles: 'overflow:hidden;',
},
hiddenX: {
name: '1kzo3b9',
styles: 'overflow-x:hidden;',
},
hiddenY: {
name: '144vlu9',
styles: 'overflow-y:hidden;',
},
scroll: {
name: 'xdees7',
styles: 'overflow:scroll;',
},
scrollX: {
name: '13ad1he',
styles: 'overflow-x:scroll;',
},
scrollY: {
name: '15bvnbz',
styles: 'overflow-y:scroll;',
},
touch: {
name: '1ojwqei',
styles: '-webkit-overflow-scrolling:touch;',
},
}
const ov = (0, _utils.memoValue)(value => {
const vals = value.split(ws)
if (vals.length === 1) return overflow[value]
let CSS = [],
i = 0
for (; i < vals.length; i++)
CSS.push(
/*#__PURE__*/
(0, _core.css)(overflow[vals[i]], ';')
)
return CSS
}),
z = (0, _utils.memoValue)(value =>
/*#__PURE__*/
(0, _core.css)('z-index:', value, ';')
),
sh = (0, _utils.memoTheme)((v, t) =>
(0, _utils.get)(t.box, 'getBoxShadow', dT)(v, t)
),
bg = (value, theme) => (0, _utils.colorize)('background', value, theme),
// colorize memoizes
bc = (value, theme) => (0, _utils.colorize)('border-color', value, theme),
// colorize memoizes
w = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)('width:', (0, _utils.unit)(v, t.sizeUnit), ';')
),
h = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)('height:', (0, _utils.unit)(v, t.sizeUnit), ';')
),
minW = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)('min-width:', (0, _utils.unit)(v, t.sizeUnit), ';')
),
minH = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)('min-height:', (0, _utils.unit)(v, t.sizeUnit), ';')
),
maxW = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)('max-width:', (0, _utils.unit)(v, t.sizeUnit), ';')
),
maxH = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)('max-height:', (0, _utils.unit)(v, t.sizeUnit), ';')
),
t = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)(
'top:',
(0, _utils.unit)(v, (0, _utils.get)(t.box, 'posUnit', dT)),
';'
)
),
r = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)(
'right:',
(0, _utils.unit)(v, (0, _utils.get)(t.box, 'posUnit', dT)),
';'
)
),
b = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)(
'bottom:',
(0, _utils.unit)(v, (0, _utils.get)(t.box, 'posUnit', dT)),
';'
)
),
l = (0, _utils.memoTheme)((v, t) =>
/*#__PURE__*/
(0, _core.css)(
'left:',
(0, _utils.unit)(v, (0, _utils.get)(t.box, 'posUnit', dT)),
';'
)
),
pos = {
relative: {
name: '79elbk',
styles: 'position:relative;',
},
absolute: {
name: '12efcmn',
styles: 'position:absolute;',
},
fixed: {
name: '1b7bwed',
styles: 'position:fixed;',
},
sticky: {
name: 'jkcygd',
styles: 'position:relative;position:sticky;top:0;',
},
static: {
name: '1vu2yqv',
styles: 'position:static;',
},
unset: {
name: '8dn4zy',
styles: 'position:unset;',
},
initial: {
name: '17d8e68',
styles: 'position:initial;',
},
inherit: {
name: '18nsqm8',
styles: 'position:inherit;',
},
},
d = {
block: {
name: '13o7eu2',
styles: 'display:block;',
},
inlineBlock: {
name: '1baulvz',
styles: 'display:inline-block;',
},
flex: {
name: 'k008qs',
styles: 'display:flex;',
},
inlineFlex: {
name: 'vxcmzt',
styles: 'display:inline-flex;',
},
inline: {
name: '6n7j50',
styles: 'display:inline;',
},
grid: {
name: 'lgj0h8',
styles: 'display:grid;',
},
inlineGrid: {
name: '19rux3o',
styles: 'display:inline-grid;',
},
table: {
name: 'z920ed',
styles: 'display:table;',
},
inlineTable: {
name: 'ngbczj',
styles: 'display:inline-table;',
},
tableCell: {
name: '2qghsv',
styles: 'display:table-cell;',
},
tableRow: {
name: 'ds3kc',
styles: 'display:table-row;',
},
tableColumn: {
name: '1qhzju6',
styles: 'display:table-column;',
},
contents: {
name: '1obf64m',
styles: 'display:contents;',
},
listItem: {
name: '1wt922f',
styles: 'display:list-item;',
},
none: {
name: '1hyfx7x',
styles: 'display:none;',
},
}
exports.d = d
exports.pos = pos
exports.l = l
exports.b = b
exports.r = r
exports.t = t
exports.maxH = maxH
exports.maxW = maxW
exports.minH = minH
exports.minW = minW
exports.h = h
exports.w = w
exports.bc = bc
exports.bg = bg
exports.sh = sh
exports.z = z
exports.ov = ov
const getDefaultScale = (property, scale, value, scaleUnit) => {
const scaleValue = scale[value]
if (process.env.NODE_ENV !== 'production')
if (scaleValue === void 0)
throw new Error(`Unrecognized scale value for '${property}': ${value}`)
return (
/*#__PURE__*/
(0, _core.css)(property, ':', (0, _utils.unit)(scaleValue, scaleUnit), ';')
)
}
const bw = (0, _utils.memoTheme)((value, theme) => {
const bwScale = (0, _utils.get)(theme.box, 'borderWidthScale', dT),
bwUnit = (0, _utils.get)(theme.box, 'borderWidthUnit', dT)
if ((0, _utils.isDirectional)(value))
return (
/*#__PURE__*/
(0, _core.css)(
'border-style:solid;',
(0, _utils.directionalScale)(
'border-{XYZ}-width',
bwScale,
value,
bwUnit
),
';'
)
)
else
return (
/*#__PURE__*/
(0, _core.css)(
'border-style:solid;',
getDefaultScale('border-width', bwScale, value, bwUnit)
)
)
})
exports.bw = bw
const borderRadiusDirections = {
_: ['top-right', 'bottom-right', 'bottom-left', 'top-left'],
t: ['top-right', 'top-left'],
r: ['top-right', 'bottom-right'],
b: ['bottom-right', 'bottom-left'],
l: ['top-left', 'bottom-left'],
tl: ['top-left'],
tr: ['top-right'],
br: ['bottom-right'],
bl: ['bottom-left'],
}
const br = (0, _utils.memoTheme)((value, theme) => {
const brScale = (0, _utils.get)(theme.box, 'borderRadiusScale', dT),
brUnit = (0, _utils.get)(theme.box, 'borderRadiusUnit', dT)
if ((0, _utils.isDirectional)(value)) {
return (0, _utils.directionalScale)(
'border-{XYZ}-radius',
brScale,
value,
brUnit,
borderRadiusDirections
)
} else return getDefaultScale('border-radius', brScale, value, brUnit)
})
exports.br = br
var _ref = {
name: '42igfv',
styles: 'margin:auto;',
}
const m = (0, _utils.memoTheme)((value, theme) => {
const {spacingScale, spacingUnit} = theme
if ((0, _utils.isDirectional)(value))
return (0, _utils.directionalScale)(
'margin-{XYZ}',
spacingScale,
value,
spacingUnit
)
else
return typeof value === 'string' && value.trim() === 'auto'
? _ref
: getDefaultScale('margin', spacingScale, value, spacingUnit)
})
exports.m = m
const p = (0, _utils.memoTheme)((value, theme) => {
const {spacingScale, spacingUnit} = theme
if ((0, _utils.isDirectional)(value))
return (0, _utils.directionalScale)(
'padding-{XYZ}',
spacingScale,
value,
spacingUnit
)
else return getDefaultScale('padding', spacingScale, value, spacingUnit)
})
exports.p = p