curls/dist/cjs/Flex/styles.js

💪 Responsive, expressive UI primitives for React written with Style Hooks and Emotion

'use strict'

exports.__esModule = true
exports.alignSelf = exports.alignContent = exports.align = exports.justify = exports.wrap = exports.column = exports.row = exports.order = exports.basis = exports.shrink = exports.grow = exports.fluid = exports.fixed = exports.flex = void 0

var _core = require('@emotion/core')

var _utils = require('../utils')

var _styles = require('../Box/styles')

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 flex = _styles.d.flex
exports.flex = flex
const fixed = {
  name: '1tu59u4',
  styles: 'flex:0 0 auto;',
}
exports.fixed = fixed
const fluid = {
  name: '1ozmmu8',
  styles: 'flex:1 1 auto;max-width:none;',
}
exports.fluid = fluid
const grow = (0, _utils.memoValue)(value =>
  /*#__PURE__*/
  (0, _core.css)('flex-grow:', value === true ? 1 : value, ';')
)
exports.grow = grow
const shrink = (0, _utils.memoValue)(value =>
  /*#__PURE__*/
  (0, _core.css)('flex-shrink:', value === true ? 1 : value, ';')
)
exports.shrink = shrink
const basis = (0, _utils.memoTheme)((value, theme) =>
  /*#__PURE__*/
  (0, _core.css)(
    'flex-basis:',
    (0, _utils.unit)(value, (0, _utils.get)(theme.flex, 'basisUnit', dT)),
    ';'
  )
)
exports.basis = basis
const order = (0, _utils.memoValue)(value =>
  /*#__PURE__*/
  (0, _core.css)('order:', value, ';')
)
exports.order = order
const rowCSS = {
  name: '1l0z8uk',
  styles: 'flex-direction:row;',
}
const row = {
  [true]: rowCSS,
  row: rowCSS,
  reverse: {
    name: '8kj89b',
    styles: 'flex-direction:row-reverse;',
  },
}
exports.row = row
const columnCSS = {
  name: 'cgq59l',
  styles: 'flex-direction:column;',
}
const column = {
  [true]: columnCSS,
  column: columnCSS,
  reverse: {
    name: 'qpiomr',
    styles: 'flex-direction:column-reverse;',
  },
}
exports.column = column
const wrapCSS = {
  name: '1jkp9i7',
  styles: 'flex-wrap:wrap;',
}
const wrap = {
  [true]: wrapCSS,
  wrap: wrapCSS,
  no: {
    name: '1n0sxg9',
    styles: 'flex-wrap:nowrap;',
  },
  reverse: {
    name: 'hp4whp',
    styles: 'flex-wrap:wrap-reverse;',
  },
}
exports.wrap = wrap
const justify = {
  start: {
    name: '1fn0841',
    styles: 'justify-content:flex-start;',
  },
  end: {
    name: '1a9getn',
    styles: 'justify-content:flex-end;',
  },
  center: {
    name: '1tyndxa',
    styles: 'justify-content:center;',
  },
  around: {
    name: 'kp4oss',
    styles: 'justify-content:space-around;',
  },
  between: {
    name: 'x4dmss',
    styles: 'justify-content:space-between;',
  },
}
exports.justify = justify
const align = {
  start: {
    name: '1jfvg9w',
    styles: 'align-items:flex-start;',
  },
  end: {
    name: 'y1kcm0',
    styles: 'align-items:flex-end;',
  },
  center: {
    name: 'zcxndt',
    styles: 'align-items:center;',
  },
  stretch: {
    name: 'k51ack',
    styles: 'align-items:stretch;',
  },
  baseline: {
    name: '1y3jl3a',
    styles: 'align-items:baseline;',
  },
}
exports.align = align
const alignContent = {
  start: {
    name: '1crvgc7',
    styles: 'align-content:flex-start;',
  },
  end: {
    name: '4zx96o',
    styles: 'align-content:flex-end;',
  },
  center: {
    name: '1a5ho4p',
    styles: 'align-content:center;',
  },
  stretch: {
    name: 'zssg0i',
    styles: 'align-content:stretch;',
  },
  between: {
    name: '1c5t6ef',
    styles: 'align-content:space-between;',
  },
  around: {
    name: '1okulzr',
    styles: 'align-content:space-around;',
  },
}
exports.alignContent = alignContent
const alignSelf = {
  start: {
    name: '1bf7e4w',
    styles: 'align-self:flex-start;',
  },
  end: {
    name: '56sg73',
    styles: 'align-self:flex-end;',
  },
  center: {
    name: 'hoe9xz',
    styles: 'align-self:center;',
  },
  stretch: {
    name: 'fzqoy4',
    styles: 'align-self:stretch;',
  },
  baseline: {
    name: 'chwum8',
    styles: 'align-self:baseline;',
  },
}
exports.alignSelf = alignSelf