Use picomatch instead of regex (#369)

* Use picomatch instead of regex

* Fix test

Author: rockwotj

package.json

@@ -34,7 +34,8 @@
     "@babel/helper-annotate-as-pure": "^7.16.0",
     "@babel/helper-module-imports": "^7.16.0",
     "babel-plugin-syntax-jsx": "^6.18.0",
-    "lodash": "^4.17.11"
+    "lodash": "^4.17.11",
+    "picomatch": "^2.3.0"
   },
   "resolutions": {
     "babel-core": "7.0.0-bridge.0"

src/utils/detectors.js

@@ -1,18 +1,17 @@
-import escapeRegExp from 'lodash/escapeRegExp'
 import { useTopLevelImportPathMatchers } from './options'
 
 const VALID_TOP_LEVEL_IMPORT_PATH_MATCHERS = [
   'styled-components',
   'styled-components/no-tags',
   'styled-components/native',
   'styled-components/primitives',
-].map(literal => new RegExp(`^${escapeRegExp(literal)}$`))
+].map(literal => x => x === literal);
 
 export const isValidTopLevelImport = (x, state) => {
   return [
     ...VALID_TOP_LEVEL_IMPORT_PATH_MATCHERS,
     ...useTopLevelImportPathMatchers(state),
-  ].some(re => re.test(x));
+  ].some(isMatch => isMatch(x));
 }
 
 const localNameCache = {}

src/utils/options.js

@@ -1,3 +1,5 @@
+import pm from 'picomatch';
+
 function getOption({ opts }, name, defaultValue = true) {
   return opts[name] === undefined || opts[name] === null
     ? defaultValue
@@ -6,7 +8,7 @@ function getOption({ opts }, name, defaultValue = true) {
 
 export const useDisplayName = state => getOption(state, 'displayName')
 export const useTopLevelImportPathMatchers = state =>
-  getOption(state, 'topLevelImportPaths', []).map(pattern => new RegExp(pattern))
+  getOption(state, 'topLevelImportPaths', []).map(pattern => pm(pattern))
 export const useSSR = state => getOption(state, 'ssr', true)
 export const useFileName = state => getOption(state, 'fileName')
 export const useMeaninglessFileNames = state => getOption(state, 'meaninglessFileNames', ['index'])

test/fixtures/add-identifier-with-top-level-import-paths-and-named-import/.babelrc

@@ -6,7 +6,7 @@
         "displayName": true,
         "fileName": false,
         "ssr": true,
-        "topLevelImportPaths": [".*\/example$"],
+        "topLevelImportPaths": ["*(../)**/example"],
         "transpileTemplateLiterals": false
       }
     ]

test/fixtures/add-identifier-with-top-level-import-paths/.babelrc

@@ -8,7 +8,7 @@
         "ssr": true,
         "topLevelImportPaths": [
           "@xstyled/styled-components",
-          "@xstyled/styled-components/*"
+          "@xstyled/styled-components/*",
         ],
         "transpileTemplateLiterals": false
       }

test/fixtures/add-identifier-with-top-level-import-paths/code.js

@@ -1,4 +1,5 @@
-import styled from '@xstyled/styled-components/test'
+import styled from '@xstyled/styled-components'
+import unstyled from '@xstyled/styled-components-test'
 
 const Test = styled.div`
   width: 100%;
@@ -8,3 +9,4 @@ const styles = { One: styled.div`` }
 let Component
 Component = styled.div``
 const WrappedComponent = styled(Inner)``
+const NoTransformComponent = unstyled.div``;

test/fixtures/add-identifier-with-top-level-import-paths/output.js

@@ -1,4 +1,5 @@
-import styled from '@xstyled/styled-components/test';
+import styled from '@xstyled/styled-components';
+import unstyled from '@xstyled/styled-components-test';
 const Test = styled.div.withConfig({
   componentId: "sc-1mlyrvc-0"
 })`width:100%;`;
@@ -19,3 +20,4 @@ Component = styled.div.withConfig({
 const WrappedComponent = styled(Inner).withConfig({
   componentId: "sc-1mlyrvc-5"
 })``;
+const NoTransformComponent = unstyled.div``;

yarn.lock

@@ -3365,7 +3365,7 @@ picocolors@^1.0.0:
   resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
   integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
 
-picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3:
+picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3, picomatch@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.0.tgz#f1f061de8f6a4bf022892e2d128234fb98302972"
   integrity sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==