fela-stylesheet

Organize multiple Fela Rules in StyleSheets. A simple helper to organize multiple rules within one single StyleSheet as used e.g. in React Native or react-look.

Installation

npm i --save fela-stylesheet

Assuming you are using npm as your package manager you can just npm install. Otherwise we also provide a UMD. You can easily use it via unpkg. It registers a FelaStyleSheet global.

<!-- (Development) Unminified version -->
<script src="https://unpkg.com/[email protected]/dist/fela-stylesheet.js"></script>
<!-- (Production) Minified version -->
<script src="https://unpkg.com/[email protected]/dist/fela-stylesheet.min.js"></script>

API

create(styles)

Transforms a set of either style objects or rules into a set of valid rules.

Arguments

1. styles (Object?): An object containing either plain style objects or valid rules.

Returns

(Object): An object containing only valid rules. It uses the same keys which were passed by styles.

Example

import { createRenderer } from 'fela'
import { create } from 'fela-stylesheet'

const rules = create({
  header: props => ({
    fontSize: props.size,
    color: 'red'
  }),
  title: {
    fontSize: '12px',
    lineHeight: 1.2
  }
})

const renderer = createRenderer()

renderer.renderRule(rules.header, { fontSize: '17px' })
renderer.renderRule(rules.title)

License

Fela is licensed under the MIT License. Documentation is licensed under Creative Common License. Created with ♥ by @rofrischmann and all the great contributors.