From 01d7317c791dbf544df306a46016f4b188d66df2 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Thu, 12 Apr 2018 13:52:55 +0300
Subject: [PATCH 01/14] Initial support for loading .scss style files

---
 .babelrc         |   7 +
 .flowconfig      |   1 +
 package.json     |   4 +
 rn-cli.config.js |  10 +
 yarn.lock        | 502 +++++++++++++++++++++++++++++++++++++++++------
 5 files changed, 469 insertions(+), 55 deletions(-)
 create mode 100644 rn-cli.config.js

diff --git a/.babelrc b/.babelrc
index fd1883c13d1b6f..8b6ed031b14ae3 100644
--- a/.babelrc
+++ b/.babelrc
@@ -21,6 +21,13 @@
           ".android.js"
         ]
       }
+    ],
+    "react-native-classname-to-style",
+    [
+      "react-native-platform-specific-extensions",
+      {
+        "extensions": ["css", "scss", "sass"]
+      }
     ]
   ],
   "env": {
diff --git a/.flowconfig b/.flowconfig
index 46fcff168a2557..7b7c2dcedcb800 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -75,6 +75,7 @@ module.file_ext=.js
 module.file_ext=.jsx
 module.file_ext=.json
 module.file_ext=.ios.js
+module.file_ext=.scss
 
 munge_underscores=true
 
diff --git a/package.json b/package.json
index 474ad9aaef9887..eb3c209b18a3f9 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,8 @@
   "devDependencies": {
     "@wordpress/babel-preset-default": "^1.1.2",
     "babel-eslint": "^8.2.2",
+    "babel-plugin-react-native-classname-to-style": "^1.2.1",
+    "babel-plugin-react-native-platform-specific-extensions": "^1.0.1",
     "babel-plugin-react-require": "^3.0.0",
     "babel-plugin-transform-async-generator-functions": "^6.24.1",
     "babel-preset-react-native-stage-0": "^1.0.1",
@@ -25,6 +27,7 @@
     "jest-react-native": "^18.0.0",
     "prettier": "git+https://github.com/Automattic/calypso-prettier.git#calypso-1.9",
     "react-dom": "^16.2.0",
+    "react-native-sass-transformer": "^1.1.1",
     "react-test-renderer": "16.2.0",
     "remote-redux-devtools": "^0.5.12"
   },
@@ -49,6 +52,7 @@
     "js-beautify": "^1.7.5",
     "jsx-to-string": "^1.3.1",
     "memize": "^1.0.5",
+    "node-sass": "^4.8.3",
     "react": "16.2.0",
     "react-native": "0.52.0",
     "react-native-recyclerview-list": "git+https://github.com/wordpress-mobile/react-native-recyclerview-list.git#bfccbaab6b5954e18f8b0ed441ba38275853b79c",
diff --git a/rn-cli.config.js b/rn-cli.config.js
new file mode 100644
index 00000000000000..9f41e262b32d38
--- /dev/null
+++ b/rn-cli.config.js
@@ -0,0 +1,10 @@
+/** @format */
+
+module.exports = {
+	getTransformModulePath() {
+		return require.resolve( 'react-native-sass-transformer' );
+	},
+	getSourceExts() {
+		return [ 'scss', 'sass' ];
+	},
+};
diff --git a/yarn.lock b/yarn.lock
index 8b80758bd23b7c..6e5e48da3e2907 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -46,7 +46,7 @@
     esutils "^2.0.2"
     js-tokens "^3.0.0"
 
-"@babel/template@7.0.0-beta.44":
+"@babel/template@7.0.0-beta.44", "@babel/template@^7.0.0-beta.37":
   version "7.0.0-beta.44"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.0.0-beta.44.tgz#f8832f4fdcee5d59bf515e595fc5106c529b394f"
   dependencies:
@@ -282,6 +282,10 @@ array-filter@~0.0.0:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/array-filter/-/array-filter-0.0.1.tgz#7da8cf2e26628ed732803581fd21f67cacd2eeec"
 
+array-find-index@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/array-find-index/-/array-find-index-1.0.2.tgz#df010aa1287e164bbda6f9723b0a96a1ec4187a1"
+
 array-includes@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.0.3.tgz#184b48f62d92d7452bb31b323165c7f8bd02266d"
@@ -355,6 +359,10 @@ astral-regex@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9"
 
+async-foreach@^0.1.3:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/async-foreach/-/async-foreach-0.1.3.tgz#36121f845c0578172de419a97dbeb1d16ec34542"
+
 async-limiter@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.0.tgz#78faed8c3d074ab81f22b4e985d79e8738f720f8"
@@ -377,6 +385,10 @@ atob@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.0.tgz#ab2b150e51d7b122b9efc8d7340c06b6c41076bc"
 
+atob@~1.1.0:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/atob/-/atob-1.1.3.tgz#95f13629b12c3a51a5d215abdce2aa9f32f80773"
+
 aws-sign2@~0.6.0:
   version "0.6.0"
   resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.6.0.tgz#14342dd38dbcc94d0e5b87d763cd63612c0e794f"
@@ -633,6 +645,16 @@ babel-plugin-module-resolver@^3.1.0:
     reselect "^3.0.1"
     resolve "^1.4.0"
 
+babel-plugin-react-native-classname-to-style@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-react-native-classname-to-style/-/babel-plugin-react-native-classname-to-style-1.2.1.tgz#364182bbc7d1929242a7a09598f873c5e97350dd"
+
+babel-plugin-react-native-platform-specific-extensions@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-react-native-platform-specific-extensions/-/babel-plugin-react-native-platform-specific-extensions-1.0.1.tgz#659d789b7d231f31a61031442cbc779349a27966"
+  dependencies:
+    "@babel/template" "^7.0.0-beta.37"
+
 babel-plugin-react-require@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-react-require/-/babel-plugin-react-require-3.0.0.tgz#2e4e7b4496b93a654a1c80042276de4e4eeb20e3"
@@ -1489,6 +1511,13 @@ callsites@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/callsites/-/callsites-2.0.0.tgz#06eb84f00eea413da86affefacbffb36093b3c50"
 
+camelcase-keys@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
+  dependencies:
+    camelcase "^2.0.0"
+    map-obj "^1.0.0"
+
 camelcase@4.1.0, camelcase@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-4.1.0.tgz#d545635be1e33c542649c69173e5de6acfae34dd"
@@ -1497,9 +1526,21 @@ camelcase@^1.0.2:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
 
+camelcase@^2.0.0:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-2.1.1.tgz#7c1d16d679a1bbe59ca02cacecfb011e201f5a1f"
+
+camelcase@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a"
+
 caniuse-lite@^1.0.30000792:
-  version "1.0.30000827"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000827.tgz#2dad2354e4810c3c9bb1cfc57f655c270c25fa52"
+  version "1.0.30000828"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000828.tgz#048f98de213f7a3c047bf78a9523c611855d4fdd"
+
+caseless@~0.11.0:
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.11.0.tgz#715b96ea9841593cc33067923f5ec60ebda4f7d7"
 
 caseless@~0.12.0:
   version "0.12.0"
@@ -1873,6 +1914,13 @@ cross-env@^5.1.4:
     cross-spawn "^5.1.0"
     is-windows "^1.0.0"
 
+cross-spawn@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-3.0.1.tgz#1256037ecb9f0c5f79e3d6ef135e30770184b982"
+  dependencies:
+    lru-cache "^4.0.1"
+    which "^1.2.9"
+
 cross-spawn@^5.0.1, cross-spawn@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
@@ -1901,6 +1949,39 @@ csrf@~3.0.0:
     tsscmp "1.0.5"
     uid-safe "2.1.4"
 
+css-color-keywords@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
+
+css-mediaquery@^0.1.2:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/css-mediaquery/-/css-mediaquery-0.1.2.tgz#6a2c37344928618631c54bd33cedd301da18bea0"
+
+css-to-react-native-transform@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/css-to-react-native-transform/-/css-to-react-native-transform-1.4.0.tgz#4bb4575e15461f7e117bf15bf10d04ec0f81bb17"
+  dependencies:
+    css "^2.2.1"
+    css-mediaquery "^0.1.2"
+    css-to-react-native "^2.1.2"
+
+css-to-react-native@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-2.1.2.tgz#c06d628467ef961c85ec358a90f3c87469fb0095"
+  dependencies:
+    css-color-keywords "^1.0.0"
+    fbjs "^0.8.5"
+    postcss-value-parser "^3.3.0"
+
+css@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/css/-/css-2.2.1.tgz#73a4c81de85db664d4ee674f7d47085e3b2d55dc"
+  dependencies:
+    inherits "^2.0.1"
+    source-map "^0.1.38"
+    source-map-resolve "^0.3.0"
+    urix "^0.1.0"
+
 cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0":
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.2.tgz#b8036170c79f07a90ff2f16e22284027a243848b"
@@ -1920,6 +2001,12 @@ csurf@~1.8.3:
     csrf "~3.0.0"
     http-errors "~1.3.1"
 
+currently-unhandled@^0.4.1:
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
+  dependencies:
+    array-find-index "^1.0.1"
+
 damerau-levenshtein@^1.0.0:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.4.tgz#03191c432cb6eea168bb77f3a55ffdccb8978514"
@@ -1964,7 +2051,7 @@ debug@~2.2.0:
   dependencies:
     ms "0.7.1"
 
-decamelize@^1.0.0, decamelize@^1.1.1:
+decamelize@^1.0.0, decamelize@^1.1.1, decamelize@^1.1.2:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
 
@@ -2602,7 +2689,7 @@ fbjs@^0.6.1:
     ua-parser-js "^0.7.9"
     whatwg-fetch "^0.9.0"
 
-fbjs@^0.8.14, fbjs@^0.8.16, fbjs@^0.8.9:
+fbjs@^0.8.14, fbjs@^0.8.16, fbjs@^0.8.5, fbjs@^0.8.9:
   version "0.8.16"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
   dependencies:
@@ -2834,6 +2921,22 @@ gauge@~2.7.3:
     strip-ansi "^3.0.1"
     wide-align "^1.1.0"
 
+gaze@^1.0.0:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/gaze/-/gaze-1.1.2.tgz#847224677adb8870d679257ed3388fdb61e40105"
+  dependencies:
+    globule "^1.0.0"
+
+generate-function@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/generate-function/-/generate-function-2.0.0.tgz#6858fe7c0969b7d4e9093337647ac79f60dfbe74"
+
+generate-object-property@^1.1.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/generate-object-property/-/generate-object-property-1.2.0.tgz#9c0e1c40308ce804f4783618b937fa88f99d50d0"
+  dependencies:
+    is-property "^1.0.0"
+
 get-caller-file@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-1.0.2.tgz#f702e63127e7e231c160a80c1554acb70d5047e5"
@@ -2842,6 +2945,10 @@ get-params@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/get-params/-/get-params-0.1.2.tgz#bae0dfaba588a0c60d7834c0d8dc2ff60eeef2fe"
 
+get-stdin@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-4.0.1.tgz#b968c6b0a04384324902e8bf1a5df32579a450fe"
+
 get-stream@3.0.0, get-stream@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
@@ -2879,7 +2986,17 @@ glob@^5.0.15:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^7.0.3, glob@^7.0.5, glob@^7.1.1, glob@^7.1.2:
+glob@^6.0.4:
+  version "6.0.4"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-6.0.4.tgz#0f08860f6a155127b2fadd4f9ce24b1aab6e4d22"
+  dependencies:
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "2 || 3"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
+glob@^7.0.0, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1, glob@^7.1.2, glob@~7.1.1:
   version "7.1.2"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15"
   dependencies:
@@ -2926,6 +3043,14 @@ globby@^5.0.0:
     pify "^2.0.0"
     pinkie-promise "^2.0.0"
 
+globule@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/globule/-/globule-1.2.0.tgz#1dc49c6822dd9e8a2fa00ba2a295006e8664bd09"
+  dependencies:
+    glob "~7.1.1"
+    lodash "~4.17.4"
+    minimatch "~3.0.2"
+
 glogg@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/glogg/-/glogg-1.0.1.tgz#dcf758e44789cc3f3d32c1f3562a3676e6a34810"
@@ -2993,6 +3118,15 @@ har-schema@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/har-schema/-/har-schema-2.0.0.tgz#a94c2224ebcac04782a0d9035521f24735b7ec92"
 
+har-validator@~2.0.6:
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-2.0.6.tgz#cdcbc08188265ad119b6a5a7c8ab70eecfb5d27d"
+  dependencies:
+    chalk "^1.1.1"
+    commander "^2.9.0"
+    is-my-json-valid "^2.12.4"
+    pinkie-promise "^2.0.0"
+
 har-validator@~4.2.1:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-4.2.1.tgz#33481d0f1bbff600dd203d75812a6a5fba002e2a"
@@ -3179,6 +3313,16 @@ imurmurhash@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
 
+in-publish@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/in-publish/-/in-publish-2.0.0.tgz#e20ff5e3a2afc2690320b6dc552682a9c7fadf51"
+
+indent-string@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/indent-string/-/indent-string-2.1.0.tgz#8e2d48348742121b4a8218b7a137e9a52049dc80"
+  dependencies:
+    repeating "^2.0.0"
+
 indexes-of@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/indexes-of/-/indexes-of-1.0.1.tgz#f30f716c8e2bd346c7b67d3df3915566a7c05607"
@@ -3368,6 +3512,20 @@ is-hexadecimal@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/is-hexadecimal/-/is-hexadecimal-1.0.1.tgz#6e084bbc92061fbb0971ec58b6ce6d404e24da69"
 
+is-my-ip-valid@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-my-ip-valid/-/is-my-ip-valid-1.0.0.tgz#7b351b8e8edd4d3995d4d066680e664d94696824"
+
+is-my-json-valid@^2.12.4:
+  version "2.17.2"
+  resolved "https://registry.yarnpkg.com/is-my-json-valid/-/is-my-json-valid-2.17.2.tgz#6b2103a288e94ef3de5cf15d29dd85fc4b78d65c"
+  dependencies:
+    generate-function "^2.0.0"
+    generate-object-property "^1.1.0"
+    is-my-ip-valid "^1.0.0"
+    jsonpointer "^4.0.0"
+    xtend "^4.0.0"
+
 is-number@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-2.1.0.tgz#01fcbbb393463a548f2f466cce16dece49db908f"
@@ -3428,6 +3586,10 @@ is-promise@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.1.0.tgz#79a2a9ece7f096e80f36d2b2f3bc16c1ff4bf3fa"
 
+is-property@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-property/-/is-property-1.0.2.tgz#57fe1c4e48474edd65b09911f26b1cd4095dda84"
+
 is-regex@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.4.tgz#5517489b547091b0930e095654ced25ee97e9491"
@@ -3886,7 +4048,7 @@ jest@^22.4.3:
     import-local "^1.0.0"
     jest-cli "^22.4.3"
 
-js-base64@^2.1.9:
+js-base64@^2.1.8, js-base64@^2.1.9:
   version "2.4.3"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.4.3.tgz#2e545ec2b0f2957f41356510205214e98fad6582"
 
@@ -4005,6 +4167,10 @@ jsonify@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/jsonify/-/jsonify-0.0.0.tgz#2c74b6ee41d93ca51b7b5aaee8f503631d252a73"
 
+jsonpointer@^4.0.0:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/jsonpointer/-/jsonpointer-4.0.1.tgz#4fd92cb34e0e9db3c89c8622ecf51f9b978c6cb9"
+
 jsprim@^1.2.2:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/jsprim/-/jsprim-1.4.1.tgz#313e66bc1e5cc06e438bc1b7499c2e5c56acb6a2"
@@ -4159,6 +4325,14 @@ lodash._root@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/lodash._root/-/lodash._root-3.0.1.tgz#fba1c4524c19ee9a5f8136b4609f017cf4ded692"
 
+lodash.assign@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/lodash.assign/-/lodash.assign-4.2.0.tgz#0d99f3ccd7a6d261d19bdaeb9245005d285808e7"
+
+lodash.clonedeep@^4.3.2:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef"
+
 lodash.escape@^3.0.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/lodash.escape/-/lodash.escape-3.2.0.tgz#995ee0dc18c1b48cc92effae71a10aab5b487698"
@@ -4181,6 +4355,10 @@ lodash.keys@^3.0.0:
     lodash.isarguments "^3.0.0"
     lodash.isarray "^3.0.0"
 
+lodash.mergewith@^4.6.0:
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz#639057e726c3afbdb3e7d42741caa8d6e4335927"
+
 lodash.pad@^4.1.0:
   version "4.5.1"
   resolved "https://registry.yarnpkg.com/lodash.pad/-/lodash.pad-4.5.1.tgz#4330949a833a7c8da22cc20f6a26c4d59debba70"
@@ -4234,7 +4412,7 @@ lodash@^3.5.0:
   version "3.10.1"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
 
-lodash@^4.0.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.16.6, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1:
+lodash@^4.0.0, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.16.6, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.6.1, lodash@~4.17.4:
   version "4.17.5"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
 
@@ -4248,6 +4426,13 @@ loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1:
   dependencies:
     js-tokens "^3.0.0"
 
+loud-rejection@^1.0.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/loud-rejection/-/loud-rejection-1.6.0.tgz#5b46f80147edee578870f086d04821cf998e551f"
+  dependencies:
+    currently-unhandled "^0.4.1"
+    signal-exit "^3.0.0"
+
 lru-cache@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-3.2.0.tgz#71789b3b7f5399bec8565dda38aa30d2a097efee"
@@ -4275,6 +4460,10 @@ map-cache@^0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/map-cache/-/map-cache-0.2.2.tgz#c32abd0bd6525d9b051645bb4f26ac5dc98a0dbf"
 
+map-obj@^1.0.0, map-obj@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
+
 map-visit@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/map-visit/-/map-visit-1.0.0.tgz#ecdca8f13144e660f1b5bd41f12f3479d98dfb8f"
@@ -4299,6 +4488,21 @@ memize@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/memize/-/memize-1.0.5.tgz#51d89e8407643dbc8cab98c6d56b889f9a3954e3"
 
+meow@^3.7.0:
+  version "3.7.0"
+  resolved "https://registry.yarnpkg.com/meow/-/meow-3.7.0.tgz#72cb668b425228290abbfa856892587308a801fb"
+  dependencies:
+    camelcase-keys "^2.0.0"
+    decamelize "^1.1.2"
+    loud-rejection "^1.0.0"
+    map-obj "^1.0.1"
+    minimist "^1.1.3"
+    normalize-package-data "^2.3.4"
+    object-assign "^4.0.1"
+    read-pkg-up "^1.0.1"
+    redent "^1.0.0"
+    trim-newlines "^1.0.0"
+
 merge-stream@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-1.0.1.tgz#4041202d508a342ba00174008df0c251b8c135e1"
@@ -4458,7 +4662,7 @@ min-document@^2.19.0:
   dependencies:
     dom-walk "^0.1.0"
 
-"minimatch@2 || 3", minimatch@3.0.4, minimatch@^3.0.0, minimatch@^3.0.2, minimatch@^3.0.3, minimatch@^3.0.4:
+"minimatch@2 || 3", minimatch@3.0.4, minimatch@^3.0.0, minimatch@^3.0.2, minimatch@^3.0.3, minimatch@^3.0.4, minimatch@~3.0.2:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
   dependencies:
@@ -4468,7 +4672,7 @@ minimist@0.0.8:
   version "0.0.8"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
 
-minimist@1.2.0, minimist@^1.1.0, minimist@^1.1.1, minimist@^1.2.0:
+minimist@1.2.0, minimist@^1.1.0, minimist@^1.1.1, minimist@^1.1.3, minimist@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
@@ -4528,7 +4732,7 @@ mute-stream@0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.7.tgz#3075ce93bc21b8fab43e1bc4da7e8115ed1e7bab"
 
-nan@^2.3.0:
+nan@^2.10.0, nan@^2.3.0:
   version "2.10.0"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.10.0.tgz#96d0cd610ebd58d4b4de9cc0c6828cda99c7548f"
 
@@ -4568,6 +4772,24 @@ node-fetch@^1.0.1, node-fetch@^1.3.3:
     encoding "^0.1.11"
     is-stream "^1.0.1"
 
+node-gyp@^3.3.1:
+  version "3.6.2"
+  resolved "https://registry.yarnpkg.com/node-gyp/-/node-gyp-3.6.2.tgz#9bfbe54562286284838e750eac05295853fa1c60"
+  dependencies:
+    fstream "^1.0.0"
+    glob "^7.0.3"
+    graceful-fs "^4.1.2"
+    minimatch "^3.0.2"
+    mkdirp "^0.5.0"
+    nopt "2 || 3"
+    npmlog "0 || 1 || 2 || 3 || 4"
+    osenv "0"
+    request "2"
+    rimraf "2"
+    semver "~5.3.0"
+    tar "^2.0.0"
+    which "1"
+
 node-int64@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/node-int64/-/node-int64-0.4.0.tgz#87a9065cdb355d3182d8f94ce11188b825c68a3b"
@@ -4597,6 +4819,36 @@ node-pre-gyp@^0.6.39:
     tar "^2.2.1"
     tar-pack "^3.4.0"
 
+node-sass@^4.8.3:
+  version "4.8.3"
+  resolved "https://registry.yarnpkg.com/node-sass/-/node-sass-4.8.3.tgz#d077cc20a08ac06f661ca44fb6f19cd2ed41debb"
+  dependencies:
+    async-foreach "^0.1.3"
+    chalk "^1.1.1"
+    cross-spawn "^3.0.0"
+    gaze "^1.0.0"
+    get-stdin "^4.0.1"
+    glob "^7.0.3"
+    in-publish "^2.0.0"
+    lodash.assign "^4.2.0"
+    lodash.clonedeep "^4.3.2"
+    lodash.mergewith "^4.6.0"
+    meow "^3.7.0"
+    mkdirp "^0.5.1"
+    nan "^2.10.0"
+    node-gyp "^3.3.1"
+    npmlog "^4.0.0"
+    request "~2.79.0"
+    sass-graph "^2.2.4"
+    stdout-stream "^1.4.0"
+    "true-case-path" "^1.0.2"
+
+"nopt@2 || 3", nopt@~3.0.1:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/nopt/-/nopt-3.0.6.tgz#c6465dbf08abcd4db359317f79ac68a646b28ff9"
+  dependencies:
+    abbrev "1"
+
 nopt@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/nopt/-/nopt-4.0.1.tgz#d0d4685afd5415193c8c7505602d0d17cd64474d"
@@ -4604,13 +4856,7 @@ nopt@^4.0.1:
     abbrev "1"
     osenv "^0.1.4"
 
-nopt@~3.0.1:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/nopt/-/nopt-3.0.6.tgz#c6465dbf08abcd4db359317f79ac68a646b28ff9"
-  dependencies:
-    abbrev "1"
-
-normalize-package-data@^2.3.2:
+normalize-package-data@^2.3.2, normalize-package-data@^2.3.4:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.4.0.tgz#12f95a307d58352075a04907b84ac8be98ac012f"
   dependencies:
@@ -4631,15 +4877,7 @@ npm-run-path@^2.0.0:
   dependencies:
     path-key "^2.0.0"
 
-npmlog@^2.0.4:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-2.0.4.tgz#98b52530f2514ca90d09ec5b22c8846722375692"
-  dependencies:
-    ansi "~0.3.1"
-    are-we-there-yet "~1.1.2"
-    gauge "~1.2.5"
-
-npmlog@^4.0.2:
+"npmlog@0 || 1 || 2 || 3 || 4", npmlog@^4.0.0, npmlog@^4.0.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-4.1.2.tgz#08a7f2a8bf734604779a9efa4ad5cc717abb954b"
   dependencies:
@@ -4648,6 +4886,14 @@ npmlog@^4.0.2:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
+npmlog@^2.0.4:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-2.0.4.tgz#98b52530f2514ca90d09ec5b22c8846722375692"
+  dependencies:
+    ansi "~0.3.1"
+    are-we-there-yet "~1.1.2"
+    gauge "~1.2.5"
+
 number-is-nan@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
@@ -4764,6 +5010,12 @@ os-homedir@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
 
+os-locale@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/os-locale/-/os-locale-1.4.0.tgz#20f9f17ae29ed345e8bde583b13d2009803c14d9"
+  dependencies:
+    lcid "^1.0.0"
+
 os-locale@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/os-locale/-/os-locale-2.1.0.tgz#42bc2900a6b5b8bd17376c8e882b65afccf24bf2"
@@ -4783,7 +5035,7 @@ os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
 
-osenv@^0.1.4:
+osenv@0, osenv@^0.1.4:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/osenv/-/osenv-0.1.5.tgz#85cdfafaeb28e8677f416e287592b5f3f49ea410"
   dependencies:
@@ -5005,6 +5257,10 @@ postcss-selector-parser@2.2.3:
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
+postcss-value-parser@^3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz#87f38f9f18f774a4ab4c8a232f5c5ce8872a9d15"
+
 postcss-values-parser@1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/postcss-values-parser/-/postcss-values-parser-1.3.1.tgz#2a6ceb39cecbbacd1d060f3b16f4c52dd6720c96"
@@ -5154,6 +5410,10 @@ qs@4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-4.0.0.tgz#c31d9b74ec27df75e543a86c78728ed8d4623607"
 
+qs@~6.3.0:
+  version "6.3.2"
+  resolved "https://registry.yarnpkg.com/qs/-/qs-6.3.2.tgz#e75bd5f6e268122a2a0e0bda630b2550c166502c"
+
 qs@~6.4.0:
   version "6.4.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.4.0.tgz#13e26d28ad6b0ffaa91312cd3bf708ed351e7233"
@@ -5228,6 +5488,13 @@ react-dom@^16.2.0:
   dependencies:
     prop-types "^15.6.0"
 
+react-native-sass-transformer@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/react-native-sass-transformer/-/react-native-sass-transformer-1.1.1.tgz#1f30f12812d9a9b816bca21eea5503a2bc6c15b0"
+  dependencies:
+    css-to-react-native-transform "^1.4.0"
+    semver "^5.4.1"
+
 react-native@0.52.0:
   version "0.52.0"
   resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.52.0.tgz#9784663a2aa40b30c87d4c9c06ef26cf8d419d91"
@@ -5406,6 +5673,13 @@ recast@^0.11.17:
     private "~0.1.5"
     source-map "~0.5.0"
 
+redent@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/redent/-/redent-1.0.0.tgz#cf916ab1fd5f1f16dfb20822dd6ec7f730c2afde"
+  dependencies:
+    indent-string "^2.1.0"
+    strip-indent "^1.0.1"
+
 redux-devtools-instrument@^1.3.3:
   version "1.8.3"
   resolved "https://registry.yarnpkg.com/redux-devtools-instrument/-/redux-devtools-instrument-1.8.3.tgz#c510d67ab4e5e4525acd6e410c25ab46b85aca7c"
@@ -5567,6 +5841,33 @@ request-promise-native@^1.0.5:
     stealthy-require "^1.1.0"
     tough-cookie ">=2.3.3"
 
+request@2, request@^2.79.0, request@^2.83.0:
+  version "2.85.0"
+  resolved "https://registry.yarnpkg.com/request/-/request-2.85.0.tgz#5a03615a47c61420b3eb99b7dba204f83603e1fa"
+  dependencies:
+    aws-sign2 "~0.7.0"
+    aws4 "^1.6.0"
+    caseless "~0.12.0"
+    combined-stream "~1.0.5"
+    extend "~3.0.1"
+    forever-agent "~0.6.1"
+    form-data "~2.3.1"
+    har-validator "~5.0.3"
+    hawk "~6.0.2"
+    http-signature "~1.2.0"
+    is-typedarray "~1.0.0"
+    isstream "~0.1.2"
+    json-stringify-safe "~5.0.1"
+    mime-types "~2.1.17"
+    oauth-sign "~0.8.2"
+    performance-now "^2.1.0"
+    qs "~6.5.1"
+    safe-buffer "^5.1.1"
+    stringstream "~0.0.5"
+    tough-cookie "~2.3.3"
+    tunnel-agent "^0.6.0"
+    uuid "^3.1.0"
+
 request@2.81.0:
   version "2.81.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.81.0.tgz#c6928946a0e06c5f8d6f8a9333469ffda46298a0"
@@ -5594,32 +5895,30 @@ request@2.81.0:
     tunnel-agent "^0.6.0"
     uuid "^3.0.0"
 
-request@^2.79.0, request@^2.83.0:
-  version "2.85.0"
-  resolved "https://registry.yarnpkg.com/request/-/request-2.85.0.tgz#5a03615a47c61420b3eb99b7dba204f83603e1fa"
+request@~2.79.0:
+  version "2.79.0"
+  resolved "https://registry.yarnpkg.com/request/-/request-2.79.0.tgz#4dfe5bf6be8b8cdc37fcf93e04b65577722710de"
   dependencies:
-    aws-sign2 "~0.7.0"
-    aws4 "^1.6.0"
-    caseless "~0.12.0"
+    aws-sign2 "~0.6.0"
+    aws4 "^1.2.1"
+    caseless "~0.11.0"
     combined-stream "~1.0.5"
-    extend "~3.0.1"
+    extend "~3.0.0"
     forever-agent "~0.6.1"
-    form-data "~2.3.1"
-    har-validator "~5.0.3"
-    hawk "~6.0.2"
-    http-signature "~1.2.0"
+    form-data "~2.1.1"
+    har-validator "~2.0.6"
+    hawk "~3.1.3"
+    http-signature "~1.1.0"
     is-typedarray "~1.0.0"
     isstream "~0.1.2"
     json-stringify-safe "~5.0.1"
-    mime-types "~2.1.17"
-    oauth-sign "~0.8.2"
-    performance-now "^2.1.0"
-    qs "~6.5.1"
-    safe-buffer "^5.1.1"
-    stringstream "~0.0.5"
-    tough-cookie "~2.3.3"
-    tunnel-agent "^0.6.0"
-    uuid "^3.1.0"
+    mime-types "~2.1.7"
+    oauth-sign "~0.8.1"
+    qs "~6.3.0"
+    stringstream "~0.0.4"
+    tough-cookie "~2.3.0"
+    tunnel-agent "~0.4.1"
+    uuid "^3.0.0"
 
 require-directory@^2.1.1:
   version "2.1.1"
@@ -5666,7 +5965,7 @@ resolve-from@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-3.0.0.tgz#b22c7af7d9d6881bc8b6e653335eebcb0a188748"
 
-resolve-url@^0.2.1:
+resolve-url@^0.2.1, resolve-url@~0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
 
@@ -5675,8 +5974,8 @@ resolve@1.1.7:
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
 
 resolve@^1.3.3, resolve@^1.4.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.7.0.tgz#2bdf5374811207285df0df652b78f118ab8f3c5e"
+  version "1.7.1"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.7.1.tgz#aadd656374fd298aee895bc026b8297418677fd3"
   dependencies:
     path-parse "^1.0.5"
 
@@ -5770,6 +6069,15 @@ sane@^2.0.0:
   optionalDependencies:
     fsevents "^1.1.1"
 
+sass-graph@^2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/sass-graph/-/sass-graph-2.2.4.tgz#13fbd63cd1caf0908b9fd93476ad43a51d1e0b49"
+  dependencies:
+    glob "^7.0.0"
+    lodash "^4.0.0"
+    scss-tokenizer "^0.2.3"
+    yargs "^7.0.0"
+
 sax@^1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
@@ -5798,6 +6106,13 @@ sc-formatter@~3.0.0:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/sc-formatter/-/sc-formatter-3.0.2.tgz#9abdb14e71873ce7157714d3002477bbdb33c4e6"
 
+scss-tokenizer@^0.2.3:
+  version "0.2.3"
+  resolved "https://registry.yarnpkg.com/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz#8eb06db9a9723333824d3f5530641149847ce5d1"
+  dependencies:
+    js-base64 "^2.1.8"
+    source-map "^0.4.2"
+
 "semver@2 || 3 || 4 || 5", semver@5.x, semver@^5.0.1, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.5.0.tgz#dc4bbc7a6ca9d916dee5d43516f0092b58f7b8ab"
@@ -5806,6 +6121,10 @@ semver@5.4.1:
   version "5.4.1"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.4.1.tgz#e059c09d8571f0540823733433505d3a2f00b18e"
 
+semver@~5.3.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-5.3.0.tgz#9b2ce5d3de02d17c6012ad326aa6b4d0cf54f94f"
+
 send@0.13.2:
   version "0.13.2"
   resolved "https://registry.yarnpkg.com/send/-/send-0.13.2.tgz#765e7607c8055452bba6f0b052595350986036de"
@@ -5996,6 +6315,15 @@ socketcluster-client@^5.3.1:
     sc-formatter "~3.0.0"
     ws "3.0.0"
 
+source-map-resolve@^0.3.0:
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.3.1.tgz#610f6122a445b8dd51535a2a71b783dfc1248761"
+  dependencies:
+    atob "~1.1.0"
+    resolve-url "~0.2.1"
+    source-map-url "~0.3.0"
+    urix "~0.1.0"
+
 source-map-resolve@^0.5.0:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.1.tgz#7ad0f593f2281598e854df80f19aae4b92d7a11a"
@@ -6022,6 +6350,16 @@ source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
 
+source-map-url@~0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.3.0.tgz#7ecaf13b57bcd09da8a40c5d269db33799d4aaf9"
+
+source-map@^0.1.38:
+  version "0.1.43"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.1.43.tgz#c24bc146ca517c1471f5dacbe2571b2b7f9e3346"
+  dependencies:
+    amdefine ">=0.0.4"
+
 source-map@^0.4.2, source-map@^0.4.4:
   version "0.4.4"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
@@ -6117,6 +6455,12 @@ statuses@~1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.3.1.tgz#faf51b9eb74aaef3b3acf4ad5f61abf24cb7b93e"
 
+stdout-stream@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/stdout-stream/-/stdout-stream-1.4.0.tgz#a2c7c8587e54d9427ea9edb3ac3f2cd522df378b"
+  dependencies:
+    readable-stream "^2.0.1"
+
 stealthy-require@^1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/stealthy-require/-/stealthy-require-1.1.1.tgz#35b09875b4ff49f26a777e509b3090a3226bf24b"
@@ -6193,6 +6537,12 @@ strip-eof@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/strip-eof/-/strip-eof-1.0.0.tgz#bb43ff5598a6eb05d89b59fcd129c983313606bf"
 
+strip-indent@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-1.0.1.tgz#0c7962a6adefa7bbd4ac366460a638552ae1a0a2"
+  dependencies:
+    get-stdin "^4.0.1"
+
 strip-json-comments@~2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
@@ -6251,7 +6601,7 @@ tar-pack@^3.4.0:
     tar "^2.2.1"
     uid-number "^0.0.6"
 
-tar@^2.2.1:
+tar@^2.0.0, tar@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/tar/-/tar-2.2.1.tgz#8e4d2a256c0e2185c6b18ad694aec968b83cb1d1"
   dependencies:
@@ -6351,6 +6701,10 @@ tr46@^1.0.0:
   dependencies:
     punycode "^2.1.0"
 
+trim-newlines@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-1.0.0.tgz#5887966bb582a4503a41eb524f7d35011815a613"
+
 trim-right@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
@@ -6367,6 +6721,12 @@ trough@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/trough/-/trough-1.0.1.tgz#a9fd8b0394b0ae8fff82e0633a0a36ccad5b5f86"
 
+"true-case-path@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/true-case-path/-/true-case-path-1.0.2.tgz#7ec91130924766c7f573be3020c34f8fdfd00d62"
+  dependencies:
+    glob "^6.0.4"
+
 tsscmp@1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/tsscmp/-/tsscmp-1.0.5.tgz#7dc4a33af71581ab4337da91d85ca5427ebd9a97"
@@ -6377,6 +6737,10 @@ tunnel-agent@^0.6.0:
   dependencies:
     safe-buffer "^5.0.1"
 
+tunnel-agent@~0.4.1:
+  version "0.4.3"
+  resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.4.3.tgz#6373db76909fe570e08d73583365ed828a74eeeb"
+
 tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   version "0.14.5"
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
@@ -6524,7 +6888,7 @@ unset-value@^1.0.0:
     has-value "^0.3.1"
     isobject "^3.0.0"
 
-urix@^0.1.0:
+urix@^0.1.0, urix@~0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72"
 
@@ -6668,11 +7032,15 @@ whatwg-url@^6.4.0:
     tr46 "^1.0.0"
     webidl-conversions "^4.0.1"
 
+which-module@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"
+
 which-module@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
 
-which@^1.2.12, which@^1.2.14, which@^1.2.9, which@^1.3.0:
+which@1, which@^1.2.12, which@^1.2.14, which@^1.2.9, which@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.0.tgz#ff04bdfc010ee547d780bec38e1ac1c2777d253a"
   dependencies:
@@ -6811,7 +7179,7 @@ xpipe@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/xpipe/-/xpipe-1.0.5.tgz#8dd8bf45fc3f7f55f0e054b878f43a62614dafdf"
 
-xtend@^4.0.1, xtend@~4.0.1:
+xtend@^4.0.0, xtend@^4.0.1, xtend@~4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
 
@@ -6823,6 +7191,12 @@ yallist@^2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-2.1.2.tgz#1c11f9218f076089a47dd512f93c6699a6a81d52"
 
+yargs-parser@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-5.0.0.tgz#275ecf0d7ffe05c77e64e7c86e4cd94bf0e1228a"
+  dependencies:
+    camelcase "^3.0.0"
+
 yargs-parser@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-7.0.0.tgz#8d0ac42f16ea55debd332caf4c4038b3e3f5dfd9"
@@ -6852,6 +7226,24 @@ yargs@^10.0.3:
     y18n "^3.2.1"
     yargs-parser "^8.1.0"
 
+yargs@^7.0.0:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-7.1.0.tgz#6ba318eb16961727f5d284f8ea003e8d6154d0c8"
+  dependencies:
+    camelcase "^3.0.0"
+    cliui "^3.2.0"
+    decamelize "^1.1.1"
+    get-caller-file "^1.0.1"
+    os-locale "^1.4.0"
+    read-pkg-up "^1.0.1"
+    require-directory "^2.1.1"
+    require-main-filename "^1.0.1"
+    set-blocking "^2.0.0"
+    string-width "^1.0.2"
+    which-module "^1.0.0"
+    y18n "^3.2.1"
+    yargs-parser "^5.0.0"
+
 yargs@^9.0.0:
   version "9.0.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-9.0.1.tgz#52acc23feecac34042078ee78c0c007f5085db4c"

From f359c38e71a1ba8323c78bda321a9643ee706343 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Thu, 12 Apr 2018 16:40:57 +0300
Subject: [PATCH 02/14] Load styles from the CSS module for block-manager

---
 block-management/block-manager.js   | 25 +++----------------------
 block-management/block-manager.scss | 20 ++++++++++++++++++++
 2 files changed, 23 insertions(+), 22 deletions(-)
 create mode 100644 block-management/block-manager.scss

diff --git a/block-management/block-manager.js b/block-management/block-manager.js
index 275279600e7edb..0c63bf4929972e 100644
--- a/block-management/block-manager.js
+++ b/block-management/block-manager.js
@@ -4,13 +4,15 @@
  */
 
 import React from 'react';
-import { Platform, Switch, StyleSheet, Text, View, FlatList } from 'react-native';
+import { Platform, Switch, Text, View, FlatList } from 'react-native';
 import RecyclerViewList, { DataSource } from 'react-native-recyclerview-list';
 import BlockHolder from './block-holder';
 import { ToolbarButton } from './constants';
 
 import type { BlockType } from '../store/';
 
+import styles from './block-manager.scss';
+
 // Gutenberg imports
 import { getBlockType, serialize } from '@gutenberg/blocks/api';
 
@@ -166,24 +168,3 @@ export default class BlockManager extends React.Component<PropsType, StateType>
 		);
 	}
 }
-
-const styles = StyleSheet.create( {
-	container: {
-		flex: 1,
-		justifyContent: 'flex-start',
-		backgroundColor: '#caa',
-	},
-	list: {
-		flex: 1,
-		backgroundColor: '#ccc',
-	},
-	htmlView: {
-		flex: 1,
-		backgroundColor: '#fff',
-	},
-	switch: {
-		flexDirection: 'row',
-		justifyContent: 'flex-start',
-		alignItems: 'center',
-	},
-} );
diff --git a/block-management/block-manager.scss b/block-management/block-manager.scss
new file mode 100644
index 00000000000000..8b53ec2b98f8af
--- /dev/null
+++ b/block-management/block-manager.scss
@@ -0,0 +1,20 @@
+.container {
+    flex: 1;
+    justify-content: flex-start;
+    background-color: #caa;
+}
+
+.list {
+    flex: 1;
+    background-color: #ccc;
+}
+
+.htmlView {
+    flex: 1;
+    background-color: #fff;
+}
+
+.switch {
+    flex-direction: row;
+    justify-content: flex-start;
+}

From fcffc1d430195cab0a1fc4798c5fc15478c0fb62 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Thu, 12 Apr 2018 17:22:04 +0300
Subject: [PATCH 03/14] Load native CSS module in plain-text

---
 .babelrc  | 2 +-
 gutenberg | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/.babelrc b/.babelrc
index 8b6ed031b14ae3..f900b8976ed263 100644
--- a/.babelrc
+++ b/.babelrc
@@ -26,7 +26,7 @@
     [
       "react-native-platform-specific-extensions",
       {
-        "extensions": ["css", "scss", "sass"]
+        "extensions": ["native.scss", "css", "scss", "sass"]
       }
     ]
   ],
diff --git a/gutenberg b/gutenberg
index a2a1a04e980313..95b17a2a903b8e 160000
--- a/gutenberg
+++ b/gutenberg
@@ -1 +1 @@
-Subproject commit a2a1a04e9803137eef5bc9d704e12fa5b37164b6
+Subproject commit 95b17a2a903b8ee01e9baf5c20a8fea2f95101f2

From 4c51133d237b54a7892d649c91101a3c259b5dd4 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Thu, 12 Apr 2018 22:28:35 +0300
Subject: [PATCH 04/14] Use a CSS module for block-holder styling

---
 block-management/block-holder.js   | 22 +++-------------------
 block-management/block-holder.scss | 25 +++++++++++++++++++++++++
 2 files changed, 28 insertions(+), 19 deletions(-)
 create mode 100644 block-management/block-holder.scss

diff --git a/block-management/block-holder.js b/block-management/block-holder.js
index 81602a453b02e7..120dd9fba19506 100644
--- a/block-management/block-holder.js
+++ b/block-management/block-holder.js
@@ -4,11 +4,13 @@
  */
 
 import React from 'react';
-import { StyleSheet, View, Text, TouchableWithoutFeedback } from 'react-native';
+import { View, Text, TouchableWithoutFeedback } from 'react-native';
 import Toolbar from './toolbar';
 
 import type { BlockType } from '../store/';
 
+import styles from './block-holder.scss';
+
 // Gutenberg imports
 import { getBlockType } from '@gutenberg/blocks/api';
 
@@ -66,21 +68,3 @@ export default class BlockHolder extends React.Component<PropsType, StateType> {
 		);
 	}
 }
-
-const styles = StyleSheet.create( {
-	blockHolder: {
-		flex: 1,
-	},
-	blockContainer: {
-		backgroundColor: 'white',
-	},
-	blockContent: {
-		padding: 10,
-	},
-	blockTitle: {
-		backgroundColor: 'grey',
-		paddingLeft: 10,
-		paddingTop: 4,
-		paddingBottom: 4,
-	},
-} );
diff --git a/block-management/block-holder.scss b/block-management/block-holder.scss
new file mode 100644
index 00000000000000..98784ad2c836c2
--- /dev/null
+++ b/block-management/block-holder.scss
@@ -0,0 +1,25 @@
+.block_code {
+    font-family: monospace;
+}
+
+.blockHolder {
+    flex: 1;
+}
+
+.blockContainer {
+    background-color: white;
+}
+
+.blockContent {
+    padding-left: 10;
+    padding-right: 10;
+    padding-top: 10;
+    padding-bottom: 10;
+}
+
+.blockTitle {
+    background-color: grey;
+    padding-left: 10;
+    padding-top: 4;
+    padding-bottom: 4;
+}

From 712860c8f043d390132b2a63ffff680d3b05cd22 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Thu, 12 Apr 2018 22:29:17 +0300
Subject: [PATCH 05/14] Set the core/code styling

For now, only set the font to monospace.
---
 block-management/block-holder.js | 6 ++++++
 gutenberg                        | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/block-management/block-holder.js b/block-management/block-holder.js
index 120dd9fba19506..ebbd527c34c6da 100644
--- a/block-management/block-holder.js
+++ b/block-management/block-holder.js
@@ -38,12 +38,18 @@ export default class BlockHolder extends React.Component<PropsType, StateType> {
 		if ( blockType ) {
 			const Block = blockType.edit;
 
+			let style;
+			if ( blockType.name === 'core/code' ) {
+				style = styles.block_code;
+			}
+
 			// TODO: setAttributes needs to change the state/attributes
 			return (
 				<Block
 					attributes={ { ...this.props.attributes } }
 					// pass a curried version of onChanged with just one argument
 					setAttributes={ attrs => this.props.onChange( this.props.uid, attrs ) }
+					style={ style }
 				/>
 			);
 		}
diff --git a/gutenberg b/gutenberg
index 95b17a2a903b8e..737a4989899471 160000
--- a/gutenberg
+++ b/gutenberg
@@ -1 +1 @@
-Subproject commit 95b17a2a903b8ee01e9baf5c20a8fea2f95101f2
+Subproject commit 737a4989899471fceead2a9bef0952e196a9e163

From 9d86bf5bc30c0bd3c6fe925462ac620b362d7869 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Thu, 12 Apr 2018 23:15:11 +0300
Subject: [PATCH 06/14] Mock the CSS modules in Jest test for now

---
 __mocks__/styleMock.js |  3 +++
 jest.config.js         |  3 +++
 package.json           |  1 +
 yarn.lock              | 10 ++++++++++
 4 files changed, 17 insertions(+)
 create mode 100644 __mocks__/styleMock.js

diff --git a/__mocks__/styleMock.js b/__mocks__/styleMock.js
new file mode 100644
index 00000000000000..df87e369dca8ad
--- /dev/null
+++ b/__mocks__/styleMock.js
@@ -0,0 +1,3 @@
+/** @format */
+
+module.exports = {};
diff --git a/jest.config.js b/jest.config.js
index d54e3a6d26d770..aa929978194a1b 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -33,6 +33,9 @@ module.exports = {
 		'@wordpress/i18n': '<rootDir>/gutenberg/i18n',
 		'@wordpress/utils': '<rootDir>/gutenberg/utils',
 		'@gutenberg': '<rootDir>/gutenberg',
+
+		// Mock the CSS modules. See https://facebook.github.io/jest/docs/en/webpack.html#handling-static-assets
+		'\\.(scss)$': '<rootDir>/__mocks__/styleMock.js',
 	},
 	haste: {
 		defaultPlatform: rnPlatform,
diff --git a/package.json b/package.json
index eb3c209b18a3f9..fdd3d37a435cfb 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "eslint-plugin-react-native": "^3.2.1",
     "eslint-plugin-wordpress": "git+https://github.com/WordPress-Coding-Standards/eslint-plugin-wordpress.git#1774343f6226052a46b081e01db3fca8793cc9f1",
     "flow-bin": "0.56.0",
+    "identity-obj-proxy": "^3.0.0",
     "jest": "^22.4.3",
     "jest-react-native": "^18.0.0",
     "prettier": "git+https://github.com/Automattic/calypso-prettier.git#calypso-1.9",
diff --git a/yarn.lock b/yarn.lock
index 6e5e48da3e2907..64154c6a0126d1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3141,6 +3141,10 @@ har-validator@~5.0.3:
     ajv "^5.1.0"
     har-schema "^2.0.0"
 
+harmony-reflect@^1.4.6:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/harmony-reflect/-/harmony-reflect-1.6.0.tgz#9c28a77386ec225f7b5d370f9861ba09c4eea58f"
+
 has-ansi@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
@@ -3290,6 +3294,12 @@ iconv-lite@^0.4.17, iconv-lite@^0.4.5, iconv-lite@~0.4.13:
   dependencies:
     safer-buffer "^2.1.0"
 
+identity-obj-proxy@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/identity-obj-proxy/-/identity-obj-proxy-3.0.0.tgz#94d2bda96084453ef36fbc5aaec37e0f79f1fc14"
+  dependencies:
+    harmony-reflect "^1.4.6"
+
 ignore@3.3.7, ignore@^3.3.3, ignore@^3.3.6:
   version "3.3.7"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.7.tgz#612289bfb3c220e186a58118618d5be8c1bab021"

From 05b1dd80847bb77c4c5df5798f93accdd240fa30 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 12:38:43 +0300
Subject: [PATCH 07/14] Set Code block font to Courier

Platform-specific file resolution is not yet supported by the
react-native-sass-transformer so, just use a common denominator.
`monospace` is not supported on iO so, for now just use `courier` which
is common between the platforms.
---
 block-management/block-holder.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/block-management/block-holder.scss b/block-management/block-holder.scss
index 98784ad2c836c2..2e223dd59a4ef6 100644
--- a/block-management/block-holder.scss
+++ b/block-management/block-holder.scss
@@ -1,5 +1,5 @@
 .block_code {
-    font-family: monospace;
+    font-family: courier;
 }
 
 .blockHolder {

From 8d0821b1188e7908566f5a515e4dd1ef4aa2cf5e Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 12:48:21 +0300
Subject: [PATCH 08/14] Scss file for the toolbar as well

---
 block-management/toolbar.js   | 18 +++---------------
 block-management/toolbar.scss | 16 ++++++++++++++++
 2 files changed, 19 insertions(+), 15 deletions(-)
 create mode 100644 block-management/toolbar.scss

diff --git a/block-management/toolbar.js b/block-management/toolbar.js
index 701890e027eba3..7ee86289b7e537 100644
--- a/block-management/toolbar.js
+++ b/block-management/toolbar.js
@@ -2,9 +2,11 @@
  * @format */
 
 import React from 'react';
-import { StyleSheet, View, Button } from 'react-native';
+import { View, Button } from 'react-native';
 import { ToolbarButton } from './constants';
 
+import styles from './toolbar.scss';
+
 type PropsType = {
 	uid: string,
 	onButtonPressed: ( button: number, uid: string ) => void,
@@ -42,17 +44,3 @@ export default class Toolbar extends React.Component<PropsType> {
 		);
 	}
 }
-
-const styles = StyleSheet.create( {
-	toolbar: {
-		height: 34,
-		backgroundColor: 'white',
-		flexDirection: 'row',
-		justifyContent: 'space-between',
-		paddingLeft: 20,
-		paddingRight: 20,
-	},
-	toolbarButton: {
-		padding: 4,
-	},
-} );
diff --git a/block-management/toolbar.scss b/block-management/toolbar.scss
new file mode 100644
index 00000000000000..e0767336000220
--- /dev/null
+++ b/block-management/toolbar.scss
@@ -0,0 +1,16 @@
+.toolbar {
+    height: 34;
+    background-color: white;
+    flex-direction: row;
+    justify-content: space-between;
+    padding-left: 20;
+    padding-right: 20;
+}
+
+.toolbarButton {
+    padding-top: 4;
+    padding-right: 4;
+    padding-bottom: 4;
+    padding-left: 4;
+}
+

From 74c88a6c5afac24e43490895f2c380759ca8c823 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 14:08:10 +0300
Subject: [PATCH 09/14] No need for explicit mobile native extension

---
 .babelrc | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.babelrc b/.babelrc
index f900b8976ed263..8b6ed031b14ae3 100644
--- a/.babelrc
+++ b/.babelrc
@@ -26,7 +26,7 @@
     [
       "react-native-platform-specific-extensions",
       {
-        "extensions": ["native.scss", "css", "scss", "sass"]
+        "extensions": ["css", "scss", "sass"]
       }
     ]
   ],

From 583335de35a577ca0c02e895d7d92c928b68c40c Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 14:21:14 +0300
Subject: [PATCH 10/14] Platform specific font family for the code block

Notice the code duplication between the block-holder.android.scss and
block-holder.ios.scss files. This is needed because platform specific
scss @import statements are not supported yet.
---
 block-management/block-holder.android.scss    | 25 +++++++++++++++++++
 ...lock-holder.scss => block-holder.ios.scss} |  0
 2 files changed, 25 insertions(+)
 create mode 100644 block-management/block-holder.android.scss
 rename block-management/{block-holder.scss => block-holder.ios.scss} (100%)

diff --git a/block-management/block-holder.android.scss b/block-management/block-holder.android.scss
new file mode 100644
index 00000000000000..98784ad2c836c2
--- /dev/null
+++ b/block-management/block-holder.android.scss
@@ -0,0 +1,25 @@
+.block_code {
+    font-family: monospace;
+}
+
+.blockHolder {
+    flex: 1;
+}
+
+.blockContainer {
+    background-color: white;
+}
+
+.blockContent {
+    padding-left: 10;
+    padding-right: 10;
+    padding-top: 10;
+    padding-bottom: 10;
+}
+
+.blockTitle {
+    background-color: grey;
+    padding-left: 10;
+    padding-top: 4;
+    padding-bottom: 4;
+}
diff --git a/block-management/block-holder.scss b/block-management/block-holder.ios.scss
similarity index 100%
rename from block-management/block-holder.scss
rename to block-management/block-holder.ios.scss

From dd23ef4e8455a8de02916bc719bab96fc98451a2 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 14:41:28 +0300
Subject: [PATCH 11/14] Mock scss loading for Flow

Since Flow+Haste can't properly resolve the platform-specific CSS
Modules.
---
 .flowconfig  | 3 +++
 package.json | 1 +
 yarn.lock    | 8 +++++++-
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/.flowconfig b/.flowconfig
index 7b7c2dcedcb800..e9f87627226ce2 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -84,6 +84,9 @@ module.name_mapper='@gutenberg' -> '<PROJECT_ROOT>/gutenberg'
 module.name_mapper='@wordpress/element' -> '<PROJECT_ROOT>/gutenberg/element'
 module.name_mapper='@wordpress/utils' -> '<PROJECT_ROOT>/gutenberg/utils'
 
+; mock/ignore style files
+module.name_mapper='.*\(.scss\)' -> 'empty/object'
+
 suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
 suppress_type=$FlowFixMeProps
diff --git a/package.json b/package.json
index fdd3d37a435cfb..8f00bdb6d07dba 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "babel-plugin-transform-async-generator-functions": "^6.24.1",
     "babel-preset-react-native-stage-0": "^1.0.1",
     "cross-env": "^5.1.4",
+    "empty": "^0.10.1",
     "eslint": "^4.19.1",
     "eslint-config-wordpress": "^2.0.0",
     "eslint-plugin-flowtype": "^2.46.1",
diff --git a/yarn.lock b/yarn.lock
index 64154c6a0126d1..5a78de5cc772cd 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2232,6 +2232,12 @@ emoji-regex@6.5.1, emoji-regex@^6.1.0:
   version "6.5.1"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.5.1.tgz#9baea929b155565c11ea41c6626eaa65cef992c2"
 
+empty@^0.10.1:
+  version "0.10.1"
+  resolved "https://registry.yarnpkg.com/empty/-/empty-0.10.1.tgz#de22fbe9fd0c0bc60cd904943a30eb222b67e042"
+  dependencies:
+    envify "^3.4.0"
+
 encodeurl@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
@@ -2242,7 +2248,7 @@ encoding@^0.1.11:
   dependencies:
     iconv-lite "~0.4.13"
 
-envify@^3.0.0:
+envify@^3.0.0, envify@^3.4.0:
   version "3.4.1"
   resolved "https://registry.yarnpkg.com/envify/-/envify-3.4.1.tgz#d7122329e8df1688ba771b12501917c9ce5cbce8"
   dependencies:

From 686c0a37d936f8f87acf12282ac0b5e81e920a4b Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 15:24:55 +0300
Subject: [PATCH 12/14] Enable Prettier for the scss files

---
 block-management/block-holder.android.scss | 24 ++++++++++++----------
 block-management/block-holder.ios.scss     | 24 ++++++++++++----------
 block-management/block-manager.scss        | 20 ++++++++++--------
 block-management/toolbar.scss              | 23 +++++++++++----------
 package.json                               |  7 ++++---
 5 files changed, 53 insertions(+), 45 deletions(-)

diff --git a/block-management/block-holder.android.scss b/block-management/block-holder.android.scss
index 98784ad2c836c2..9d5929fd994837 100644
--- a/block-management/block-holder.android.scss
+++ b/block-management/block-holder.android.scss
@@ -1,25 +1,27 @@
+/** @format */
+
 .block_code {
-    font-family: monospace;
+	font-family: monospace;
 }
 
 .blockHolder {
-    flex: 1;
+	flex: 1;
 }
 
 .blockContainer {
-    background-color: white;
+	background-color: white;
 }
 
 .blockContent {
-    padding-left: 10;
-    padding-right: 10;
-    padding-top: 10;
-    padding-bottom: 10;
+	padding-left: 10;
+	padding-right: 10;
+	padding-top: 10;
+	padding-bottom: 10;
 }
 
 .blockTitle {
-    background-color: grey;
-    padding-left: 10;
-    padding-top: 4;
-    padding-bottom: 4;
+	background-color: grey;
+	padding-left: 10;
+	padding-top: 4;
+	padding-bottom: 4;
 }
diff --git a/block-management/block-holder.ios.scss b/block-management/block-holder.ios.scss
index 2e223dd59a4ef6..6eee11cdbaeb12 100644
--- a/block-management/block-holder.ios.scss
+++ b/block-management/block-holder.ios.scss
@@ -1,25 +1,27 @@
+/** @format */
+
 .block_code {
-    font-family: courier;
+	font-family: courier;
 }
 
 .blockHolder {
-    flex: 1;
+	flex: 1;
 }
 
 .blockContainer {
-    background-color: white;
+	background-color: white;
 }
 
 .blockContent {
-    padding-left: 10;
-    padding-right: 10;
-    padding-top: 10;
-    padding-bottom: 10;
+	padding-left: 10;
+	padding-right: 10;
+	padding-top: 10;
+	padding-bottom: 10;
 }
 
 .blockTitle {
-    background-color: grey;
-    padding-left: 10;
-    padding-top: 4;
-    padding-bottom: 4;
+	background-color: grey;
+	padding-left: 10;
+	padding-top: 4;
+	padding-bottom: 4;
 }
diff --git a/block-management/block-manager.scss b/block-management/block-manager.scss
index 8b53ec2b98f8af..4ab1dd351be77b 100644
--- a/block-management/block-manager.scss
+++ b/block-management/block-manager.scss
@@ -1,20 +1,22 @@
+/** @format */
+
 .container {
-    flex: 1;
-    justify-content: flex-start;
-    background-color: #caa;
+	flex: 1;
+	justify-content: flex-start;
+	background-color: #caa;
 }
 
 .list {
-    flex: 1;
-    background-color: #ccc;
+	flex: 1;
+	background-color: #ccc;
 }
 
 .htmlView {
-    flex: 1;
-    background-color: #fff;
+	flex: 1;
+	background-color: #fff;
 }
 
 .switch {
-    flex-direction: row;
-    justify-content: flex-start;
+	flex-direction: row;
+	justify-content: flex-start;
 }
diff --git a/block-management/toolbar.scss b/block-management/toolbar.scss
index e0767336000220..ed000fd0f3dbc7 100644
--- a/block-management/toolbar.scss
+++ b/block-management/toolbar.scss
@@ -1,16 +1,17 @@
+/** @format */
+
 .toolbar {
-    height: 34;
-    background-color: white;
-    flex-direction: row;
-    justify-content: space-between;
-    padding-left: 20;
-    padding-right: 20;
+	height: 34;
+	background-color: white;
+	flex-direction: row;
+	justify-content: space-between;
+	padding-left: 20;
+	padding-right: 20;
 }
 
 .toolbarButton {
-    padding-top: 4;
-    padding-right: 4;
-    padding-bottom: 4;
-    padding-left: 4;
+	padding-top: 4;
+	padding-right: 4;
+	padding-bottom: 4;
+	padding-left: 4;
 }
-
diff --git a/package.json b/package.json
index 8f00bdb6d07dba..20a4729795a9b7 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,8 @@
   "version": "0.1.0",
   "private": true,
   "config": {
-    "jsfiles": "index.js app/*.js app/**/*.js block-management/*.js block-management/**/*.js store/*.js store/**/*.js"
+    "jsfiles": "index.js app/*.js app/**/*.js block-management/*.js block-management/**/*.js store/*.js store/**/*.js",
+    "scssfiles": "app/*.js app/**/*.scss block-management/*.scss block-management/**/*.scss store/*.scss store/**/*.scss"
   },
   "devDependencies": {
     "@wordpress/babel-preset-default": "^1.1.2",
@@ -40,8 +41,8 @@
     "test": "cross-env NODE_ENV=test node node_modules/jest/bin/jest.js --verbose --config jest.config.js",
     "test:debug": "cross-env NODE_ENV=test node --inspect-brk node_modules/jest/bin/jest.js --runInBand --verbose --config jest.config.js",
     "flow": "flow",
-    "prettier": "prettier --write $npm_package_config_jsfiles",
-    "prettier:check": "prettier -l $npm_package_config_jsfiles",
+    "prettier": "prettier --write $npm_package_config_jsfiles $npm_package_config_scssfiles",
+    "prettier:check": "prettier -l $npm_package_config_jsfiles $npm_package_config_scssfiles",
     "clean": "yarn test --clearCache; watchman watch-del-all; rm -rf node_modules; rm -f yarn.lock; rm -rf $TMPDIR/react-*; rm -rf $TMPDIR/metro-cache-*; rm -rf $TMPDIR/jest_*",
     "clean:install": "yarn clean; yarn",
     "lint": "eslint $npm_package_config_jsfiles",

From 590fea50057c56c6d72354f73f8abfddad4c49e7 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 16:38:49 +0300
Subject: [PATCH 13/14] Explicitly set flexBasis to auto

It seems that `flex: 1` is not interpreted correctly (flexGrow ends up
0 which causes the list to effectively collapse on iOS. For some
reason, it doesn't cause a problem on Android).
---
 block-management/block-holder.ios.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/block-management/block-holder.ios.scss b/block-management/block-holder.ios.scss
index 6eee11cdbaeb12..962cf50038e717 100644
--- a/block-management/block-holder.ios.scss
+++ b/block-management/block-holder.ios.scss
@@ -5,7 +5,7 @@
 }
 
 .blockHolder {
-	flex: 1;
+	flex: 1 1 auto;
 }
 
 .blockContainer {

From 89d79114f7eb847f50b5e4300408c2e415880093 Mon Sep 17 00:00:00 2001
From: Stefanos Togkoulidis <stefanostogoulidis@gmail.com>
Date: Mon, 16 Apr 2018 17:59:21 +0300
Subject: [PATCH 14/14] Only list scss files in "scssfiles"

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 20a4729795a9b7..099f241e575586 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "config": {
     "jsfiles": "index.js app/*.js app/**/*.js block-management/*.js block-management/**/*.js store/*.js store/**/*.js",
-    "scssfiles": "app/*.js app/**/*.scss block-management/*.scss block-management/**/*.scss store/*.scss store/**/*.scss"
+    "scssfiles": "app/*.scss app/**/*.scss block-management/*.scss block-management/**/*.scss store/*.scss store/**/*.scss"
   },
   "devDependencies": {
     "@wordpress/babel-preset-default": "^1.1.2",