diff --git a/modules/functions/blur.js b/modules/functions/blur.js
new file mode 100644
index 0000000..cbcc36d
--- /dev/null
+++ b/modules/functions/blur.js
@@ -0,0 +1,5 @@
+import applyUnitToNumber from '../utils/applyUnitToNumber'
+
+export default function blur(v) {
+ return 'blur(' + applyUnitToNumber(v) + ')'
+}
diff --git a/modules/functions/brightness.js b/modules/functions/brightness.js
new file mode 100644
index 0000000..9e5f05a
--- /dev/null
+++ b/modules/functions/brightness.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('brightness')
diff --git a/modules/functions/contrast.js b/modules/functions/contrast.js
new file mode 100644
index 0000000..209469b
--- /dev/null
+++ b/modules/functions/contrast.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('contrast')
diff --git a/modules/functions/drop-shadow.js b/modules/functions/drop-shadow.js
new file mode 100644
index 0000000..1aecea6
--- /dev/null
+++ b/modules/functions/drop-shadow.js
@@ -0,0 +1,9 @@
+import isObject from '../utils/isObject'
+import applyUnitToNumbers from '../utils/applyUnitToNumber'
+
+export default function dropShadow(x, y, blur, spread) {
+ const values = isObject(x) ? [ x.x, x.y, x.blur, x.spread ] : [ x, y, blur, spread ]
+ const filtred = values.filter(v => v != null)
+
+ return 'drop-shadow(' + applyUnitToNumbers(filtred) + ')'
+}
diff --git a/modules/functions/grayscale.js b/modules/functions/grayscale.js
new file mode 100644
index 0000000..7383a4e
--- /dev/null
+++ b/modules/functions/grayscale.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('grayscale')
diff --git a/modules/functions/hueRotate.js b/modules/functions/hueRotate.js
new file mode 100644
index 0000000..ee468af
--- /dev/null
+++ b/modules/functions/hueRotate.js
@@ -0,0 +1,5 @@
+import applyUnitToNumber from '../utils/applyUnitToNumber'
+
+export default function hueRotate(v) {
+ return 'hue-rotate(' + applyUnitToNumber(v, 'deg') + ')'
+}
diff --git a/modules/functions/invert.js b/modules/functions/invert.js
new file mode 100644
index 0000000..a628117
--- /dev/null
+++ b/modules/functions/invert.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('invert')
diff --git a/modules/functions/opacity.js b/modules/functions/opacity.js
new file mode 100644
index 0000000..2f8a377
--- /dev/null
+++ b/modules/functions/opacity.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('opacity')
diff --git a/modules/functions/perspective.js b/modules/functions/perspective.js
index 4282010..b171886 100644
--- a/modules/functions/perspective.js
+++ b/modules/functions/perspective.js
@@ -1,3 +1,3 @@
-export default function perspective(p) {
- return 'perspective(' + p + ')'
-}
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('perspective')
diff --git a/modules/functions/saturate.js b/modules/functions/saturate.js
new file mode 100644
index 0000000..d29da23
--- /dev/null
+++ b/modules/functions/saturate.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('saturate')
diff --git a/modules/functions/scaleX.js b/modules/functions/scaleX.js
index 1b525c4..bd91087 100644
--- a/modules/functions/scaleX.js
+++ b/modules/functions/scaleX.js
@@ -1,3 +1,3 @@
-export default function scaleX(x) {
- return 'scaleX(' + x + ')'
-}
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('scaleX')
diff --git a/modules/functions/scaleY.js b/modules/functions/scaleY.js
index 3cb1442..9ed1b0d 100644
--- a/modules/functions/scaleY.js
+++ b/modules/functions/scaleY.js
@@ -1,3 +1,3 @@
-export default function scaleY(y) {
- return 'scaleY(' + y + ')'
-}
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('scaleY')
diff --git a/modules/functions/scaleZ.js b/modules/functions/scaleZ.js
index 9eead56..eab022b 100644
--- a/modules/functions/scaleZ.js
+++ b/modules/functions/scaleZ.js
@@ -1,3 +1,3 @@
-export default function scaleZ(z) {
- return 'scaleZ(' + z + ')'
-}
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('scaleZ')
diff --git a/modules/functions/sepia.js b/modules/functions/sepia.js
new file mode 100644
index 0000000..78bc6cd
--- /dev/null
+++ b/modules/functions/sepia.js
@@ -0,0 +1,3 @@
+import simpleFunctionFactory from '../utils/simpleFunctionFactory'
+
+export default simpleFunctionFactory('sepia')
diff --git a/modules/index.js b/modules/index.js
index ad4a955..31ba8c3 100644
--- a/modules/index.js
+++ b/modules/index.js
@@ -1,7 +1,15 @@
+export blur from './functions/blur'
+export brightness from './functions/brightness'
+export contrast from './function/contrast'
+export dropShadow from './functions/dropShadow'
+export grayscale from './function/grayscale'
export hsl from './functions/hsl'
export hsla from './functions/hsla'
+export hueRotate from './functions/hueRotate'
+export invert from './functions/invert'
export matrix from './functions/matrix'
export matrix3d from './functions/matrix3d'
+export opacity from './functions/opacity'
export perspective from './functions/perspective'
export rgb from './functions/rgb'
export rgba from './functions/rgba'
@@ -10,11 +18,13 @@ export rotate3d from './functions/rotate3d'
export rotateX from './functions/rotateX'
export rotateY from './functions/rotateY'
export rotateZ from './functions/rotateZ'
+export saturate from './function/saturate'
export scale from './functions/scale'
export scale3d from './functions/scale3d'
export scaleX from './functions/scaleX'
export scaleY from './functions/scaleY'
export scaleZ from './functions/scaleZ'
+export sepia from './function/sepia'
export skew from './functions/skew'
export skewX from './functions/skewX'
export skewY from './functions/skewY'
diff --git a/modules/utils/simpleFunctionFactory.js b/modules/utils/simpleFunctionFactory.js
new file mode 100644
index 0000000..6aaf336
--- /dev/null
+++ b/modules/utils/simpleFunctionFactory.js
@@ -0,0 +1,5 @@
+export default function simpleFunctionFactory(cssfunction) {
+ return function (v) {
+ return cssfunction + '(' + v + ')'
+ }
+}
diff --git a/readme.md b/readme.md
index 5a3265a..d149222 100644
--- a/readme.md
+++ b/readme.md
@@ -4,12 +4,20 @@ This package ships functions that return the equivalent CSS function syntax.
There will be automatic value validation in non-production mode soon.
## Functions
-Right now we ship 25 functions.
+Right now we ship 35 functions.
+* `blur(v)`
+* `brightness(v)`
+* `contrast(v)`
+* `dropShadow(offsetX, offsetY, blurRadius, spreadRadius, color)`
+* `grayscale(v)`
* `hsl(h, s, l)`
* `hsla(h, s, l, a)`
+* `hueRotate(v)`
+* `invert(v)`
* `matrix(a, b, c, d, x, y)`
* `matrix3d(a1, b1, c1, d1, a2, b2, c2, d2, a3, b3, c3, d3, a4, b4, c4, d4)`
+* `opacity(v)`
* `perspective(p)`
* `rgb(r, g, b)`
* `rgba(r, g, b, a)`
@@ -18,11 +26,13 @@ Right now we ship 25 functions.
* `rotateX(x)`
* `rotateY(y)`
* `rotateZ(z)`
+* `saturate(v)`
* `scale(x, y)`
* `scale3d(x, y, z)`
* `scaleX(x)`
* `scaleY(y)`
* `scaleZ(z)`
+* `sepia(z)`
* `skew(x, y)`
* `skewX(x)`
* `skewY(y)`
@@ -82,6 +92,8 @@ const combined = multiple(
## Units
As the above example shows, we add default units to some numbers.
#### px
+* `blur`
+* `dropShadow`
* `translate`
* `translate3d`
* `translateX`
@@ -89,6 +101,7 @@ As the above example shows, we add default units to some numbers.
* `translateZ`
#### deg
+* `hueRotate`
* `rotate`
* `rotate3d`
* `rotateX`