Add extension detection on main ppx

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@davesnx/styled-ppx",
-  "version": "0.34.0",
+  "version": "0.34.1",
   "description": "Typed styled components in ReScript",
   "author": "David Sancho <dsnxmoreno@gmail.com>",
   "license": "MIT",
@@ -31,15 +31,17 @@
     "@opam/ocaml-migrate-parsetree": "2.4.0",
     "@opam/ocamlformat": "0.24.1",
     "@opam/ppx_deriving": "5.2.1",
-    "@opam/ppxlib": "0.27.0",
+    "@opam/ppxlib": "*",
     "@opam/reason": "3.8.1",
     "@opam/sedlex": "3.0",
     "@opam/patdiff": "v0.15.0",
     "@opam/utop": "2.10.0",
     "ocaml": "4.14.0"
   },
+  "resolutions": {
+    "@opam/ppxlib": "zth/ppxlib:ppxlib.opam#32f83395fb89693a873541298b6367449f23bc4a"
+  },
   "scripts": {
-    "scripts": "jq .scripts package.json",
     "test_typecheck": "esy dune build @native_typecheck_test",
     "test_css_support": "esy dune build @css_support_test",
     "test_ppx_snapshot": "esy dune build @ppx_snapshot_test",

packages/demo/rescript/src/index.res

@@ -58,7 +58,9 @@ switch ReactDOM.querySelector("#app") {
         <div className />
         <Dynamic a="23" />
         <Component> {React.string("test..")} </Component>
-        <App2> <Component> {React.string("Demo of...")} </Component> </App2>
+        <App2>
+          <Component> {React.string("Demo of...")} </Component>
+        </App2>
         <Link href="https://github.com/davesnx/styled-ppx"> {React.string("styled-ppx")} </Link>
         <Link href="https://github.com/davesnx/styled-ppx"> {React.string("styled-ppx")} </Link>
         <Link href="https://github.com/davesnx/styled-ppx"> {React.string("styled-ppx")} </Link>

packages/ppx/src/declarations_to_emotion.re

@@ -5,7 +5,7 @@ module Helper = Ast_helper;
 module Builder = Ppxlib.Ast_builder.Default;
 module Types = Parser.Types;
 
-module Option ={
+module Option = {
   include Option;
 
   let mapWithDefault = (f, default, opt) => {
@@ -14,7 +14,7 @@ module Option ={
     | None => default
     };
   };
-}
+};
 
 let txt = (~loc, txt) => {Location.loc: loc, txt};
 
@@ -835,8 +835,6 @@ let render_color = (~loc, value) => switch (value: Types.color) {
   | `Deprecated_system_color(_) => raise(Unsupported_feature)
   };
 
-/* and color = [%value.rec "<rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | 'currentColor' | <deprecated-system-color> | <interpolation> | <var()>"] */
-
 let color = apply(Parser.property_color, (~loc) => [%expr CssJs.color], render_color);
 let opacity =
   apply(

packages/ppx/src/file.re

@@ -0,0 +1,17 @@
+type extension = Reason | OCaml | ReScript;
+
+let detectFileSuffix = (path): result(extension, string) => {
+  switch (Filename.extension(path)) {
+    | "res" => Ok(ReScript)
+    | "re" => Ok(Reason)
+    | "ml" => Ok(OCaml)
+    | _ => Ok(Reason)
+  }
+};
+
+let detectExtension = (path) => {
+  switch (detectFileSuffix(path)) {
+    | Ok(extension) => extension
+    | Error(e) => failwith(e)
+  }
+};

packages/ppx/src/main.re

@@ -713,8 +713,8 @@ Driver.register_transformation(
      we rely on this order in native tests */
   ~instrument=Driver.Instrument.make(~position=Before, traverser#structure),
   ~rules=[
-    /* %cx without let binding */
-    /* which doesn't have CssJs.label */
+    /* %cx without let binding, it doesn't have CssJs.label
+      %cx is defined in traverser#structure */
     Context_free.Rule.extension(
       Extension.declare(
         "cx",