fix: Keep the filename convention of using *.block.css.

Author: chriseppstein

package.json

@@ -19,6 +19,7 @@
     "@types/chai": "^3.5.2",
     "@types/debug": "0.0.29",
     "@types/loader-utils": "^1.1.3",
+    "@types/minimatch": "^2.0.29",
     "@types/mocha": "^2.2.41",
     "@types/node": "^8.0.0",
     "@types/prettier": "^1.8.0",

packages/@css-blocks/jsx/package.json

@@ -60,6 +60,7 @@
     "babel-types": "7.0.0-beta.3",
     "babylon": "7.0.0-beta.46",
     "debug": "^2.6.8",
+    "minimatch": "^3.0.4",
     "object.values": "^1.0.4",
     "opticss": "^0.3.0"
   }

packages/@css-blocks/jsx/src/utils/isBlockFilename.ts

@@ -1,4 +1,5 @@
-import * as path from "path";
+import * as minimatch from "minimatch";
+const BLOCK_PATTERN = new minimatch.Minimatch("*.block.*", { matchBase: true });
 export function isBlockFilename(filename: string): boolean {
-    return path.parse(filename).ext === ".css";
+    return BLOCK_PATTERN.match(filename);
 }

packages/@css-blocks/jsx/test/analyzer/typed-file-analysis.ts

@@ -14,7 +14,7 @@ export class Test {
 
   @test "Is able to parse vanilla without a `jsx` extension."() {
     mock({
-      "bar.css": `
+      "bar.block.css": `
         :scope { color: blue; }
         .pretty { color: red; }
         .pretty[state|color=yellow] {
@@ -24,7 +24,7 @@ export class Test {
     });
 
     return parse(`
-      import bar from 'bar.css';
+      import bar from 'bar.block.css';
       import objstr from 'obj-str';
 
       let style = objstr({
@@ -44,7 +44,7 @@ export class Test {
 
   @test "Is able to parse typescript"() {
     mock({
-      "bar.css": `
+      "bar.block.css": `
         :scope { color: blue; }
         .pretty { color: red; }
         .pretty[state|color=yellow] {
@@ -54,7 +54,7 @@ export class Test {
     });
 
     return parse(`
-      import bar from 'bar.css';
+      import bar from 'bar.block.css';
       import objstr from 'obj-str';
 
       function fooGood<T extends { x: number }>(obj: T): T {
@@ -84,7 +84,7 @@ export class Test {
 
   @test "Is able to parse flow"() {
     mock({
-      "bar.css": `
+      "bar.block.css": `
         :scope { color: blue; }
         .pretty { color: red; }
         .pretty[state|color=yellow] {
@@ -94,7 +94,7 @@ export class Test {
     });
 
     return parse(`
-      import bar from 'bar.css';
+      import bar from 'bar.block.css';
       import objstr from 'obj-str';
 
       let color: string = "yellow";

yarn.lock

@@ -1070,6 +1070,10 @@
   version "3.0.3"
   resolved "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
 
+"@types/minimatch@^2.0.29":
+  version "2.0.29"
+  resolved "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz#5002e14f75e2d71e564281df0431c8c1b4a2a36a"
+
 "@types/mocha@^2.2.41":
   version "2.2.48"
   resolved "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.48.tgz#3523b126a0b049482e1c3c11877460f76622ffab"