merge (index.js)

styled-system · ui

Merges style objects into theme-resolved output via assign, handles nested parsers for design-system style merging.

import assign from 'object-assign'

export const merge = (a, b) => {
  let result = assign({}, a, b)
  for (const key in a) {
    if (!a[key] || typeof b[key] !== 'object') continue
    assign(result, {
      [key]: assign(a[key], b[key]),
    })
  }
  return result
}

// sort object-value responsive styles
const sort = obj => {
  const next = {}
  Object.keys(obj)
    .sort((a, b) => a.localeCompare(b, undefined, {
      numeric: true,
      sensitivity: 'base',
    }))
    .forEach(key => {
      next[key] = obj[key]
    })
  return next
}

const defaults = {
  breakpoints: [40, 52, 64].map(n => n + 'em'),
}
const createMediaQuery = n => `@media screen and (min-width: ${n})`
const getValue = (n, scale) => get(scale, n, n)

export const get = (obj, key, def, p, undef) => {
  key = key && 

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search 40K more like it.

Get a free API key