Pass objects given to css through Emotion's css function to allow

for slight performance optimizations when caching `Style` objects.

Author: Madeline Trotter

.circleci/config.yml

@@ -0,0 +1,12 @@
+version: 2
+jobs:
+  build:
+    docker:
+      - image: node:10
+
+    steps:
+      - checkout
+
+      - run:
+          name: Build
+          command: make

bower.json

@@ -1,12 +1,7 @@
 {
   "name": "purescript-react-basic-emotion",
   "license": "Apache-2.0",
-  "ignore": [
-    "**/.*",
-    "node_modules",
-    "bower_components",
-    "output"
-  ],
+  "ignore": ["**/.*", "node_modules", "bower_components", "output"],
   "repository": {
     "type": "git",
     "url": "git://github.com/lumihq/purescript-react-basic-emotion.git"

src/React/Basic/Emotion.js

@@ -1,25 +1,25 @@
 "use strict";
 
-var Emotion = require("@emotion/core");
-var createElement = Emotion.jsx;
+const Emotion = require("@emotion/core");
+const createElement = Emotion.jsx;
 
 exports.emptyStyle = undefined;
 
 exports.emptyStyleProperty = undefined;
 
-function flattenDataProp(component, props) {
-  var data = null;
+const flattenDataProp = (component, props) => {
+  let data = null;
   if (typeof component === "string" && props._data != null) {
     data = { _data: undefined };
     Object.entries(props._data).forEach(function(entry) {
       data["data-" + entry[0]] = entry[1];
     });
   }
   return data == null ? props : Object.assign({}, props, data);
-}
+};
 
-exports.element_ = function(component, props, areChildrenDynamic) {
-  var args = [component, flattenDataProp(component, props)];
+exports.element_ = (component, props, areChildrenDynamic) => {
+  const args = [component, flattenDataProp(component, props)];
   return createElement.apply(
     null,
     areChildrenDynamic || props.children == null
@@ -28,8 +28,9 @@ exports.element_ = function(component, props, areChildrenDynamic) {
   );
 };
 
-exports.elementKeyed_ = function(component, props) {
-  return exports.element_(component, props, true);
-};
+exports.elementKeyed_ = (component, props) =>
+  exports.element_(component, props, true);
 
 exports.global = Emotion.Global;
+
+exports.css = _homogeneousDict => Emotion.css;

src/React/Basic/Emotion.purs

@@ -105,8 +105,7 @@ foreign import elementKeyed_ ::
 
 foreign import global :: ReactComponent { styles :: Style }
 
-css :: forall r. Homogeneous r StyleProperty => { | r } -> Style
-css = unsafeCoerce
+foreign import css :: forall r. Homogeneous r StyleProperty => { | r } -> Style
 
 nested :: Style -> StyleProperty
 nested = unsafeCoerce