fela-stylesheet

v1.0.2
Fela helper to organize multiple rules in StyleSheets
fela fela-tools cssinjs

fela-stylesheet

npm downloads gzipped size

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.

Metadata

  • MIT
  • Whatever
  • Robin Frischmann
  • released 6/30/2016

Downloads

Maintainers