diff --git a/src/__tests__/styled.test.js b/src/__tests__/styled.test.js
index 19bdea46..db320b54 100644
--- a/src/__tests__/styled.test.js
+++ b/src/__tests__/styled.test.js
@@ -28,7 +28,7 @@ describe('styled', () => {
expect(() => styled()()()).toThrow();
setup(pragma);
- const vnode = styled('div')``();
+ const vnode = styled('div')``({});
expect(pragma).toBeCalledTimes(1);
expect(vnode).toMatchVNode('div', {
@@ -75,7 +75,7 @@ describe('styled', () => {
`;
// Simulate a render
- let vnode = Tag();
+ let vnode = Tag({});
expect(vnode).toMatchVNode('tag', { className: 'go' });
// Simulate a render with
@@ -84,7 +84,7 @@ describe('styled', () => {
expect(vnode).toMatchVNode('foo', { className: 'go' });
// Simulate a render
- vnode = Tag();
+ vnode = Tag({});
expect(vnode).toMatchVNode('tag', { className: 'go' });
});
diff --git a/src/core/astish.js b/src/core/astish.js
index 6a7eb1df..c1b15edd 100644
--- a/src/core/astish.js
+++ b/src/core/astish.js
@@ -8,10 +8,7 @@ let empty = ' ';
* @param {String} val
* @returns {Object}
*/
-export let astish = (val) => {
- let tree = [{}];
- let block, left;
-
+export let astish = (val, tree = [{}], block, left) => {
while ((block = newRule.exec(val.replace(ruleClean, '')))) {
// Remove the current entry
if (block[4]) {
diff --git a/src/core/hash.js b/src/core/hash.js
index c660440a..681267bc 100644
--- a/src/core/hash.js
+++ b/src/core/hash.js
@@ -13,14 +13,12 @@ let cache = {};
* @param {Object} data
* @returns {String}
*/
-let stringify = (data) => {
+let stringify = (data, out = '') => {
if (typeof data == 'object') {
- let out = '';
for (let p in data) out += p + stringify(data[p]);
- return out;
- } else {
- return data;
+ data = out;
}
+ return data;
};
/**
@@ -53,14 +51,18 @@ export let hash = (compiled, sheet, global, append, keyframes) => {
);
}
- // If the global flag is set, save the current stringified and compiled CSS to `cache.g`
- // to allow replacing styles in instead of appending them.
- // This is required for using `createGlobalStyles` with themes
- let cssToReplace = global && cache.g ? cache.g : null;
- if (global) cache.g = cache[className];
-
// add or update
- update(cache[className], sheet, append, cssToReplace);
+ update(
+ cache[className],
+ sheet,
+ append,
+ // If the global flag is set, save the current stringified and compiled CSS to `cache.g`
+ // to allow replacing styles in instead of appending them.
+ // This is required for using `createGlobalStyles` with themes
+ global && cache.g ? cache.g : null
+ );
+
+ if (global) cache.g = cache[className];
// return hash
return className;
diff --git a/src/core/parse.js b/src/core/parse.js
index fb05f852..97206710 100644
--- a/src/core/parse.js
+++ b/src/core/parse.js
@@ -4,11 +4,7 @@
* @param {String} selector
* @param {String} wrapper
*/
-export let parse = (obj, selector) => {
- let outer = '';
- let blocks = '';
- let current = '';
-
+export let parse = (obj, selector, outer = '', blocks = '', current = '') => {
for (let key in obj) {
let val = obj[key];
diff --git a/src/core/to-hash.js b/src/core/to-hash.js
index 569b9bf0..522e6821 100644
--- a/src/core/to-hash.js
+++ b/src/core/to-hash.js
@@ -7,9 +7,7 @@
* @param {String} str
* @returns {String}
*/
-export let toHash = (str) => {
- let i = 0,
- out = 11;
+export let toHash = (str, i = 0, out = 11) => {
while (i < str.length) out = (101 * out + str.charCodeAt(i++)) >>> 0;
return 'go' + out;
};
diff --git a/src/core/update.js b/src/core/update.js
index 3bdf55e0..3f4c1a17 100644
--- a/src/core/update.js
+++ b/src/core/update.js
@@ -3,12 +3,9 @@ import { getSheet } from './get-sheet';
* Extracts and wipes the cache
* @returns {String}
*/
-export let extractCss = (target) => {
- let sheet = getSheet(target);
- let out = sheet.data;
- sheet.data = '';
- return out;
-};
+export let extractCss = (target, sheet = getSheet(target), out = sheet.data) => (
+ (sheet.data = ''), out
+);
/**
* Updates the target and keeps a local cache
diff --git a/src/css.js b/src/css.js
index 6d1d1610..2cfa1bf4 100644
--- a/src/css.js
+++ b/src/css.js
@@ -6,15 +6,14 @@ import { getSheet } from './core/get-sheet';
* css entry
* @param {String|Object|Function} val
*/
-function css(val) {
+function css(val, ..._args) {
let ctx = this || {};
let _val = val.call ? val(ctx.p) : val;
-
return hash(
_val.unshift
? _val.raw
? // Tagged templates
- compile(_val, [].slice.call(arguments, 1), ctx.p)
+ compile(_val, _args, ctx.p)
: // Regular arrays
_val.reduce((o, i) => Object.assign(o, i && i.call ? i(ctx.p) : i), {})
: _val,
diff --git a/src/styled.js b/src/styled.js
index 65bd6682..19cca5ea 100644
--- a/src/styled.js
+++ b/src/styled.js
@@ -1,16 +1,18 @@
import { css } from './css';
import { parse } from './core/parse';
-let h, useTheme, fwdProp;
-function setup(pragma, prefix, theme, forwardProps) {
- // This one needs to stay in here, so we won't have cyclic dependencies
- parse.p = prefix;
-
- // These are scope to this context
- h = pragma;
- useTheme = theme;
- fwdProp = forwardProps;
-}
+let h,
+ useTheme,
+ fwdProp,
+ setup = (..._args) =>
+ ([
+ // These are scope to this context
+ h,
+ // This one needs to stay in here, so we won't have cyclic dependencies
+ parse.p,
+ useTheme,
+ fwdProp
+ ] = _args);
/**
* styled function
@@ -20,50 +22,49 @@ function setup(pragma, prefix, theme, forwardProps) {
function styled(tag, forwardRef) {
let _ctx = this || {};
- return function wrapper() {
- let _args = arguments;
-
- function Styled(props, ref) {
- // Grab a shallow copy of the props
- let _props = Object.assign({}, props);
-
+ return function wrapper(..._args) {
+ function Styled(
+ props,
+ ref,
+ // Assign the _as with the provided `tag` value
+ _as = tag,
// Keep a local reference to the previous className
- let _previousClassName = _props.className || Styled.className;
+ _previousClassName = props.className || Styled.className
+ ) {
+ // Grab a shallow copy of the props
+ props = Object.assign({}, props);
// _ctx.p: is the props sent to the context
- _ctx.p = Object.assign({ theme: useTheme && useTheme() }, _props);
+ _ctx.p = Object.assign({ theme: useTheme && useTheme() }, props);
// Set a flag if the current components had a previous className
// similar to goober. This is the append/prepend flag
// The _empty_ space compresses better than `\s`
_ctx.o = / *go\d+/.test(_previousClassName);
- _props.className =
+ props.className =
// Define the new className
css.apply(_ctx, _args) + (_previousClassName ? ' ' + _previousClassName : '');
// If the forwardRef fun is defined we have the ref
if (forwardRef) {
- _props.ref = ref;
+ props.ref = ref;
}
- // Assign the _as with the provided `tag` value
- let _as = tag;
-
// If this is a string -- checking that is has a first valid char
if (tag[0]) {
// Try to assign the _as with the given _as value if any
- _as = _props.as || tag;
+ _as = props.as || tag;
// And remove it
- delete _props.as;
+ delete props.as;
}
// Handle the forward props filter if defined and _as is a string
if (fwdProp && _as[0]) {
- fwdProp(_props);
+ fwdProp(props);
}
- return h(_as, _props);
+ return h(_as, props);
}
return forwardRef ? forwardRef(Styled) : Styled;