object-flatten

Flatten a nested object based on a predicate function. The keys are rewritten to path.to.nested.object.

Install

$ npm install --save object-flatten

Example

See test/index.js for full examples.

import flatten, { isLast } from 'object-flatten'

const flattened = flatten(isLast, {
  margin: {
    auto: { marginLeft: 'auto', marginRight: 'auto' }
  }
})

This returns you a flattened object:

{
  'margin.auto': { marginLeft: 'auto', marginRight: 'auto' }
}

Usage

obj = flattenObject(predicate, obj)

Default export Returns a flattened object.

• predicate A function which decides when to stop flattening. It is invoked on each property in the object with the signature property => true|false.

isLast

Predicate function which flattens until the deepest object.

flatten(isLast, some: { very: { deep: { prop: true } } })
// { 'some.very.deep: { prop: true } }

isNotObject

Predicate function which flattens as deep as possible.

flatten(isNotObject, some: { very: { deep: { prop: true } } })
// { 'some.very.deep.prop': true } }

Advanced Use Case

The main use case I had in mind, is together with unistyle. Let's say we have a positions.js module which contains:

export default {
  relative: { position: 'relative' },
  absolute: { position: 'absolute' },
  fixed: { position: 'fixed' },
  top0: { top: 0 },
  bottom0: { bottom: 0 },
  left0: { left: 0 },
  right0: { right: 0 },
  
  zindex: [
    new Error('index should be between 1 and 4'),
    { zIndex: 1 },
    { zIndex: 2 },
    { zIndex: 3 },
    { zIndex: 4 }
  ]
}

Then you can use this with your preferred virtual dom library and cngen:

import { margin } from './style/white-space'
const Container = ({ size, children }) => {
  return (
    <div class={cngen(margin.auto)}>
      {children}
    </div>
  )
}

The problem comes in when you want to generate your css with this sort of structure. What you have to do is to flatten the object manually:

export default classnameify({
    ...positions,
    ...positions.zindex
})

Now imagine that this structure can be even more deep and the manual flattening becomes unmaintainable. This is where object-flatten helps:

export default {
    ...flattenObject(isLast, positions)
}

Run Tests

$ npm test

License

MIT