Fix over-purging issue in demo

Author: adamwathan

demo/tailwind.config.js

@@ -1,5 +1,30 @@
+const mdx = require('@mdx-js/mdx')
+
 module.exports = {
-  purge: ['./demo/pages/**/*.{js,mdx}', './demo/components/**/*.{js,mdx}'],
+  purge: {
+    mode: 'all',
+    content: ['./demo/pages/**/*.{js,mdx}', './demo/components/**/*.{js,mdx}'],
+    options: {
+      whitelist: ['html', 'body'],
+      extractors: [
+        {
+          extensions: ['mdx'],
+          extractor: (content) => {
+            content = mdx.sync(content)
+
+            // Capture as liberally as possible, including things like `h-(screen-1.5)`
+            const broadMatches = content.match(/[^<>"'`\s]*[^<>"'`\s:]/g) || []
+
+            // Capture classes within other delimiters like .block(class="w-1/2") in Pug
+            const innerMatches =
+              content.match(/[^<>"'`\s.(){}[\]#=%]*[^<>"'`\s.(){}[\]#=%:]/g) || []
+
+            return broadMatches.concat(innerMatches)
+          },
+        },
+      ],
+    },
+  },
   theme: {},
   variants: {},
   plugins: [require('../src/index.js')],

package.json

@@ -18,6 +18,7 @@
   },
   "devDependencies": {
     "@mdx-js/loader": "^1.0.19",
+    "@mdx-js/mdx": "^1.6.6",
     "@next/mdx": "^8.1.0",
     "autoprefixer": "^9.6.1",
     "clean-css": "^4.2.1",