feat: allow spaces in variables

__tests__/lib/mdast/index.test.ts

@@ -9,6 +9,9 @@ import tablesJson from './tables/out.json';
 import variablesMdx from './variables/in.mdx?raw';
 import variablesJson from './variables/out.json';
 
+import variablesWithSpacesMdx from './variables-with-spaces/in.mdx?raw';
+import variablesWithSpacesJson from './variables-with-spaces/out.json';
+
 import inlineImagesMdx from './images/inline/in.mdx?raw';
 import inlineImagesJson from './images/inline/out.json';
 
@@ -28,6 +31,11 @@ describe('mdast transformer', async () => {
     expect(mdast(variablesMdx)).toStrictEqualExceptPosition(variablesJson);
   });
 
+  it.only('parses variables with spaces', () => {
+    // @ts-ignore
+    expect(mdast(variablesWithSpacesMdx)).toStrictEqualExceptPosition(variablesWithSpacesJson);
+  });
+
   it('parses inline images', () => {
     // @ts-ignore
     expect(mdast(inlineImagesMdx)).toStrictEqualExceptPosition(inlineImagesJson);

__tests__/lib/mdast/variables-with-spaces/in.mdx

@@ -0,0 +1 @@
+Hello, { user['this is cursed'] }

__tests__/lib/mdast/variables-with-spaces/out.json

@@ -0,0 +1,72 @@
+{
+  "children": [
+    {
+      "children": [
+        {
+          "position": {
+            "end": {
+              "column": 8,
+              "line": 1,
+              "offset": 7
+            },
+            "start": {
+              "column": 1,
+              "line": 1,
+              "offset": 0
+            }
+          },
+          "type": "text",
+          "value": "Hello, "
+        },
+        {
+          "data": {
+            "hName": "Variable",
+            "hProperties": {
+              "name": "this is cursed"
+            }
+          },
+          "position": {
+            "end": {
+              "column": 19,
+              "line": 1,
+              "offset": 18
+            },
+            "start": {
+              "column": 8,
+              "line": 1,
+              "offset": 7
+            }
+          },
+          "type": "readme-variable",
+          "value": "{ user['this is cursed'] }"
+        }
+      ],
+      "position": {
+        "end": {
+          "column": 19,
+          "line": 1,
+          "offset": 18
+        },
+        "start": {
+          "column": 1,
+          "line": 1,
+          "offset": 0
+        }
+      },
+      "type": "paragraph"
+    }
+  ],
+  "position": {
+    "end": {
+      "column": 1,
+      "line": 2,
+      "offset": 19
+    },
+    "start": {
+      "column": 1,
+      "line": 1,
+      "offset": 0
+    }
+  },
+  "type": "root"
+}

__tests__/lib/mdast/variables/in.mdx

@@ -1 +1 @@
-Hello, { user.name }
+Hello, {user.name}

__tests__/lib/mdast/variables/out.json

@@ -38,7 +38,7 @@
             }
           },
           "type": "readme-variable",
-          "value": "{ user.name }"
+          "value": "{user.name}"
         }
       ],
       "position": {

processor/transform/variables.ts

@@ -12,8 +12,18 @@ const variables =
     visit(tree, (node, index, parent) => {
       if (!['mdxFlowExpression', 'mdxTextExpression'].includes(node.type) || !('value' in node)) return;
 
-      const match = node.value.match(/^\s*user\.(?<value>\S*)\s*$/);
-      if (!match) return;
+      // @ts-expect-error - estree is not defined on our mdx types?!
+      if (node.data.estree.type !== 'Program') return;
+      // @ts-expect-error - estree is not defined on our mdx types?!
+      const [expression] = node.data.estree.body;
+      if (
+        !expression ||
+        expression.type !== 'ExpressionStatement' ||
+        expression.expression.property?.type !== 'Literal'
+      )
+        return;
+
+      const name = expression.expression.property.value;
 
       let variable = asMdx
         ? ({
@@ -23,7 +33,7 @@ const variables =
               {
                 type: 'mdxJsxAttribute',
                 name: 'name',
-                value: match.groups.value,
+                value: name,
               },
             ],
             children: [],
@@ -34,7 +44,7 @@ const variables =
             data: {
               hName: 'Variable',
               hProperties: {
-                name: match.groups.value,
+                name,
               },
             },
             value: `{${node.value}}`,