arc-theme - npm Package Compare versions

Comparing version 0.1.1 to 0.2.0

index.js

 'use strict';
 
 const get = require('lodash/get');
+const assign = require('lodash/assign');
 
@@ -40,2 +41,28 @@ const theme = {};
 
+theme.font = path => props => theme.get(['fonts', path], (props || {}).theme);
+
+theme.color = (i, p, e) => props => {
+	props = props || {};
+	const args = [i, p, e];
+	const exceptions = args.find(arg => typeof arg === 'object') || {};
+	const path = args.find(arg => typeof arg === 'string') || props.color;
+	let index = args.find(arg => typeof arg === 'number');
+
+	if (typeof index === 'undefined') {
+		throw new Error('[color] You must pass index');
+	}
+	if (typeof path === 'undefined') {
+		throw new Error('[color] You must pass color path');
+	}
+
+	if (Object.keys(exceptions).indexOf(path) >= 0) {
+		index = exceptions[path];
+	}
+
+	return theme.getColor([path, index], props.reverse, props.theme);
+};
+
+theme.reverseColor = (i, p, e) => props =>
+	theme.color(i, p, e)(assign({}, props, {reverse: !(props || {}).reverse}));
+
 module.exports = theme;

package.json

 {
   "name": "arc-theme",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "ARc theming utilities and resources",
@@ -5,0 +5,0 @@ "license": "MIT",

readme.md

@@ -57,3 +57,40 @@ # arc-theme [![Build Status](https://travis-ci.org/diegohaz/arc-theme.svg?branch=master)](https://travis-ci.org/diegohaz/arc-theme) [![Coverage Status](https://coveralls.io/repos/github/diegohaz/arc-theme/badge.svg?branch=master)](https://coveralls.io/github/diegohaz/arc-theme?branch=master)
 
+### Utilities for [`styled-components`](https://github.com/styled-components/styled-components)
 
+```jsx
+import styled from 'components'
+import { font, color, reverseColor } from 'arc-theme'
+
+const Div = styled.div`
+	font-family: ${font('primary')};
+	color: ${color(0)};
+	background-color: ${reverseColor('grayscale', 0)}
+`
+
+// color = theme.colors.primary[0]
+// background-color = theme.reverseColors.grayscale[0]
+<Div color="primary" />
+
+// color = theme.reverseColors.primary[0]
+// background-color = theme.colors.primary[0]
+<Div color="primary" reverse />
+```
+
+```jsx
+import styled from 'components'
+import { font, color, reverseColor } from 'arc-theme'
+
+const Div = styled.div`
+	font-family: ${font('primary')};
+	color: ${color({ grayscale: 0 }, 1)};
+`
+
+// color = theme.colors.primary[1]
+<Div color="primary" />
+
+// Because we defined the exception { grayscale: 0 }
+// color = theme.colors.grayscale[0]
+<Div color="grayscale" />
+```
+
 ## API
@@ -83,5 +120,26 @@
 
+### font(path: String)(props: Object)
 
+Returns the font in `props.theme.fonts[path]` or `theme.fonts[path]`.
+
+This is the same as `get(['fonts', path], props.theme)`.
+
+### color(index: Number, [path: String], [exceptions: Object])(props: Object)
+
+Returns the color in `props.theme.colors[path][index]` or `theme.colors[path][index]`. `colors` will be `reverseColors` if `props.reverse` is `true`.
+
+This is the same as `getColor([path || props.path][index], props.reverse, props.theme)`.
+
+Arguments could be passed in any order.
+
+### reverseColor(index: Number, [path: String], [exceptions: Object])(props: Object)
+
+Returns the color in `props.theme.reverseColors[path][index]` or `theme.reverseColors[path][index]`. `reverseColors` will be `colors` if `props.reverse` is `true`.
+
+This is the same as `getColor([path || props.path][index], !props.reverse, props.theme)`.
+
+Arguments could be passed in any order.
+
 ## License
 
 MIT © [Diego Haz](https://github.com/diegohaz)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8352

increased by48.11%

Lines of code

52

increased by67.74%

Number of lines in readme file

144

increased by67.44%

No dependency changes