siddharthkp · December 4, 2018 05:50 · Dec 4, 2018
diff --git a/temp.js b/temp.js
@@ -0,0 +1,35 @@
+import { spacing } from '@auth0/cosmos-tokens'
+
+const directions = ['top', 'bottom', 'left', 'right']
+
+/* this helper gets all the props of the component */
+const margin = ({ margin = {} }) => {
+  let styles = ''
+
+  directions.map(direction => {
+    if (typeof margin[direction] !== 'undefined') {
+      let rawValue = margin[direction]
+      let value
+
+      /*
+        if the value is a string, it's either a token (xsmall)
+        or has units (8em)
+
+        if it's a number, we assume it's pixels
+      */
+
+      if (typeof rawValue === 'string') {
+        if (spacing[rawValue]) value = spacing[rawValue]
+        else value = rawValue
+      } else {
+        value = rawValue + 'px'
+      }
+
+      // syntax: margin-top: margin.top
+      styles += `margin-${direction}: ${value};`
+    }
+  })
+  return styles
+}
+
+export default margin
No results found