feat: ignore className and other attrs in JSX extraction

examples/by-features/extractions/a.ts → examples/by-features/extractions/a.tsx

@@ -1,2 +1,4 @@
 const world = 'World'
 const a = `Hello ${world}`
+
+const foo = <div className="h1 mt-4"/>

src/extraction/parsers/babel.ts

@@ -3,13 +3,23 @@ import { parse } from '@babel/parser'
 import traverse from '@babel/traverse'
 import { DefaultDynamicExtractionsRules, DefaultExtractionRules, ExtractionRule } from '../rules'
 import { shouldExtract } from '../shouldExtract'
+import { ExtractionBabelOptions } from './options'
 import { DetectionResult } from '~/core/types'
 
+const defaultOptions: Required<ExtractionBabelOptions> = {
+  ignoredJSXAttributes: ['class', 'className', 'key', 'style', 'ref', 'onClick'],
+}
+
 export function detect(
   input: string,
   rules: ExtractionRule[] = DefaultExtractionRules,
   dynamicRules: ExtractionRule[] = DefaultDynamicExtractionsRules,
+  userOptions: ExtractionBabelOptions = {},
 ) {
+  const {
+    ignoredJSXAttributes,
+  } = Object.assign({}, defaultOptions, userOptions)
+
   const detections: DetectionResult[] = []
 
   const ast = parse(input, {
@@ -57,8 +67,8 @@ export function detect(
   }
 
   function recordIgnore(path: any) {
-    const fullStart = path?.node?.start
-    const fullEnd = path?.node?.end
+    const fullStart = path?.node?.start ?? path?.start
+    const fullEnd = path?.node?.end ?? path?.end
 
     if (!fullStart || !fullEnd)
       return
@@ -80,6 +90,13 @@ export function detect(
     JSXText(path: any) {
       handlePath(path, 'jsx-text')
     },
+    // scan for jsx attributes
+    JSXElement(path: any) {
+      path?.node?.openingElement?.attributes?.forEach((i: any) => {
+        if (ignoredJSXAttributes.includes(i?.name?.name))
+          recordIgnore(i)
+      })
+    },
     // ignore `console.xxx`
     CallExpression(path: any) {
       const callee = path.get('callee')

src/extraction/parsers/options.ts

@@ -27,3 +27,12 @@ export interface ExtractionHTMLOptions {
    */
   inlineText?: boolean
 }
+
+export interface ExtractionBabelOptions {
+  /**
+   * HTML tags to be ignored
+   *
+   * @default ['class', 'className', 'key', 'style', 'ref', 'onClick']
+   */
+  ignoredJSXAttributes?: string[]
+}