Replace snake-case and camelcase with change-case

I noticed this PR still hanging
gregberge#938, for this issue:
gregberge#937

This should resolve the suggestions by replacing both these old packages
with a new leaner one.

Using version 4.x of change-case, as 5.x has done a rewrite to ESM-only.

There is one behavior change in how pascalCase works (I haven't been
able to find any alternative library that retains the behavior of the
camelcase library wrt pascal-case after a leading number).

Author: stianjensen

packages/cli/package.json

@@ -35,12 +35,11 @@
     "@svgr/plugin-jsx": "workspace:*",
     "@svgr/plugin-prettier": "workspace:*",
     "@svgr/plugin-svgo": "workspace:*",
-    "camelcase": "^6.2.0",
     "chalk": "^4.1.2",
+    "change-case": "^4.0.0",
     "commander": "^9.4.1",
     "dashify": "^2.0.0",
-    "glob": "^8.0.3",
-    "snake-case": "^3.0.4"
+    "glob": "^8.0.3"
   },
   "devDependencies": {
     "@types/glob": "^8.1.0",

packages/cli/src/util.test.ts

@@ -39,7 +39,7 @@ describe('util', () => {
       expect(formatExportName('foo')).toBe('Foo')
       expect(formatExportName('foo-bar')).toBe('FooBar')
       expect(formatExportName('2foo')).toBe('Svg2foo')
-      expect(formatExportName('2foo-bar')).toBe('Svg2FooBar')
+      expect(formatExportName('2foo-bar')).toBe('Svg2fooBar')
     })
   })
 })

packages/cli/src/util.ts

@@ -6,10 +6,8 @@ import svgo from '@svgr/plugin-svgo'
 import jsx from '@svgr/plugin-jsx'
 import prettier from '@svgr/plugin-prettier'
 // @ts-ignore
-import camelCase from 'camelcase'
-// @ts-ignore
 import dashify from 'dashify'
-import { snakeCase } from 'snake-case'
+import { camelCase, pascalCase, snakeCase } from 'change-case'
 
 export function transformFilename(
   filename: string,
@@ -21,7 +19,7 @@ export function transformFilename(
     case 'camel':
       return camelCase(filename)
     case 'pascal':
-      return camelCase(filename, { pascalCase: true })
+      return pascalCase(filename)
     case 'snake':
       return snakeCase(filename)
     default:
@@ -64,12 +62,12 @@ export const politeWrite = (data: string, silent?: boolean): void => {
 
 export const formatExportName = (name: string): string => {
   if (/[-]/g.test(name) && /^\d/.test(name)) {
-    return `Svg${camelCase(name, { pascalCase: true })}`
+    return `Svg${pascalCase(name)}`
   }
 
   if (/^\d/.test(name)) {
     return `Svg${name}`
   }
 
-  return camelCase(name, { pascalCase: true })
+  return pascalCase(name)
 }

packages/core/package.json

@@ -40,9 +40,8 @@
   "dependencies": {
     "@babel/core": "^7.21.3",
     "@svgr/babel-preset": "workspace:*",
-    "camelcase": "^6.2.0",
-    "cosmiconfig": "^8.3.6",
-    "snake-case": "^3.0.4"
+    "change-case": "^4.0.0",
+    "cosmiconfig": "^8.3.6"
   },
   "devDependencies": {
     "svgo": "^3.0.2"

packages/core/src/state.ts

@@ -1,6 +1,5 @@
 import { parse as parsePath } from 'path'
-// @ts-ignore
-import camelCase from 'camelcase'
+import { pascalCase } from 'change-case'
 import type { ConfigPlugin } from './plugins'
 
 export interface State {
@@ -17,11 +16,8 @@ const VALID_CHAR_REGEX = /[^a-zA-Z0-9 _-]/g
 
 const getComponentName = (filePath?: string): string => {
   if (!filePath) return 'SvgComponent'
-  const pascalCaseFileName = camelCase(
+  const pascalCaseFileName = pascalCase(
     parsePath(filePath).name.replace(VALID_CHAR_REGEX, ''),
-    {
-      pascalCase: true,
-    },
   )
   return `Svg${pascalCaseFileName}`
 }