diff --git a/src/StyleSheet/index.js b/src/StyleSheet/index.js new file mode 100644 index 0000000..6a083c6 --- /dev/null +++ b/src/StyleSheet/index.js @@ -0,0 +1,62 @@ +const makeStyleSheet = () => { + const state = { + id: 0, + CSSRules: {} + } + + const addRule = (id, styles) => { + state.CSSRules[id] = styles + } + + const getRule = (id) => { + return state.CSSRules[id] + } + + const hasRule = (id) => { + return !!getRule(id) + } + + const removeRule = (id) => { + state.CSSRules[id] = undefined + } + + const makeRule = (CSSRules) => { + state.id = state.id + 1 + return { id: state.id, CSSRules } + } + + const makeStyles = (props) => { + return generateStyles(props) + } + + return { + addRule, + getRule, + hasRule, + removeRule, + makeRule, + makeStyles, + CSSRules: state.CSSRules + } +} + +/** + * Creates the tokenized styles based. + */ +export const generateStyles = ({id, props, CSSRules}) => { + const parsedCSSRules = typeof CSSRules === 'function' + ? CSSRules(props) : CSSRules + + return tokenize(id, parsedCSSRules) +} + +/** + * Renders the CSSRule with tokenized with the unique ID. + * + * @param {string} id + * @param {string} CSSRules + * @returns {string} + */ +export const tokenize = (id, CSSRules) => `/* ${id} */\n${CSSRules.trim()}\n` + +export default makeStyleSheet diff --git a/src/utilities/id.js b/src/utilities/id.js deleted file mode 100644 index aef1e9c..0000000 --- a/src/utilities/id.js +++ /dev/null @@ -1,5 +0,0 @@ -/** - * Source - * https://gist.github.com/jed/982883 - */ -export function uuid (a) { return a ? (0 | Math.random() * 16).toString(16) : ('' + 1e7 + -1e3 + -4e3 + -8e3 + -1e11).replace(/1|0/g, uuid) } diff --git a/src/withStyles/__tests__/withStyles.test.js b/src/withStyles/__tests__/withStyles.test.js index 64b87ef..93c67ce 100644 --- a/src/withStyles/__tests__/withStyles.test.js +++ b/src/withStyles/__tests__/withStyles.test.js @@ -1,6 +1,8 @@ import React from 'react' import { mount } from 'enzyme' -import withStyles, { removeStyle } from '../index' +import withStyles from '../index' + +const removeStyle = withStyles.StyleSheet.removeRule describe('HOC Composition', () => { const Button = props => (