css-in-props 0.9.3 → 0.9.4

package/package.json

@@ -3,7 +3,7 @@
   "description": "Utilize props as CSS methods",
   "private": false,
   "author": "symbo.ls",
-  "version": "0.9.3",
+  "version": "0.9.4",
   "repository": "https://github.com/symbo-ls/smbls",
   "main": "src/index.js",
   "files": [

package/src/index.js

@@ -1,4 +1,4 @@
 'use strict'
 
-export { set } from '@symbo.ls/scratch'
 export * from './transform'
+export * from './set'

package/src/registry.js

@@ -64,7 +64,7 @@ export const theme = {
   theme: props => props.theme ? getTheme(props.theme) : null,
 
   color: props => props.color ? ({ color: getColor(props.color) }) : null,
-  background: props => props.background ? ({ backgroundColor: getColor(props.background) }) : null,
+  background: props => props.background ? ({ background: getColor(props.background) }) : null,
 
   textStroke: props => props.textStroke ? diffStroke(props.textStroke) : null,
 

package/src/set.js

@@ -0,0 +1,8 @@
+'use strict'
+
+import { transformClassname, transformEmotion } from './transform'
+
+export const setClassname = (props, emotionCss) => {
+  const transform = transformClassname(props)
+  return transformEmotion(transform, emotionCss)
+}

package/src/transform/classname.js

@@ -10,7 +10,8 @@ export const transformClassname = props => {
 
   for (const key in props) {
     const setter = keySetters[key.slice(0, 1)]
-    const hasCSS = registry[key]
+    const reg = registry
+    const hasCSS = reg[key]
 
     if (setter) setter(key, props[key], CLASS_NAMES)
     else if (isFunction(hasCSS)) merge(CLASS_NAMES, hasCSS(props))

package/src/transform/emotion.js

@@ -1,20 +1,10 @@
 'use strict'
 
+import { isFunction } from '@domql/utils'
 import createEmotion from '@emotion/css/create-instance'
-// const ENV = process.env.NODE_ENV
 
-export const {
-  flush,
-  hydrate,
-  cx,
-  getRegisteredStyles,
-  injectGlobal,
-  keyframes,
-  css,
-  sheet,
-  cache
-} = createEmotion({
+const { css } = createEmotion({
   key: 'smbls'
 })
 
-export const transformEmotion = props => css(props)
+export const transformEmotion = (props, callback) => isFunction(callback) ? callback(props) : css(props)

package/src/transform/index.js

@@ -1,5 +1,5 @@
 'use strict'
 
-export * from './emotion'
 export * from './classname'
+export * from './emotion'
 export * from './subProps'