Repository: material-ui
Issue: [codemod] jss-to-styled will not apply to standalone style files
Labels: new feature,package: codemod,ready to take

### Duplicates

- [X] I have searched the existing issues

### Latest version

- [X] I have tested the latest version

### Current behavior 😯

When running the migration steps to migrate JSS to emotion [documented here](https://mui.com/guides/migration-v4/#migrate-from-jss) 

We run: 

```
npx @mui/codemod v5.0.0/jss-to-styled src
``` 

However, any styles contained a single file without an accompanying component where they are used, will not migrate properly. You will get this error: 

```
 ERR /Users/davidjohnston/git/sandbox/mui-migrate/src/MyComponent.styles.ts Transformation error (Cannot read properties of null (reading 'match'))
TypeError: Cannot read properties of null (reading 'match')
    at transformer (/Users/davidjohnston/.npm/_npx/62df030d7e52d1d4/node_modules/@mui/codemod/node/v5.0.0/jss-to-styled.js:370:43)
All done. 
Results: 
1 errors
7 unmodified
0 skipped
0 ok
Time elapsed: 0.587seconds 
```


ie. 

This is OK: 
```

import React from 'react';
import makeStyles from '@mui/styles/makeStyles';


export type MyComponentProps = {
};


const useStyles = makeStyles(
  ({ spacing, palette }) => ({
    root: {
        padding: spacing(2),
        border: "solid 1px red",
    }
  })
);



export const MyComponent = (props: MyComponentProps) => {
  const {  } = props;
  const {root} = useStyles();


  return (
    <div className ={root}>
        this is a component
    </div>
  );
};

```

This is not: 
```

//styles.ts
import makeStyles from '@mui/styles/makeStyles';

export const useStyles = makeStyles(
    ({ spacing, palette }) => ({
      root: {
          padding: spacing(2),
          border: "solid 1px red",
      }
    })
  );
  




//MyComponent.tsx
import React from 'react';
import { useStyles } from './styles';

export type MyComponentProps = {
};





export const MyComponent = (props: MyComponentProps) => {
  const {  } = props;
  const {root} = useStyles();


  return (
    <div className ={root}>
        this is a component
    </div>
  );
};

```




### Expected behavior 🤔

I mean, I guess make the tool work for this import. 

### Steps to reproduce 🕹

Steps:

1. Check out this repo: https://github.com/dwjohnston/migrate-mui/tree/migrate-emotion
2. Note there is MyComponent.tsx and MyComponent2.tsx
3. run `npx @mui/codemod v5.0.0/jss-to-styled src`
4. Note how MyComponent migrates, but MyComponent2 does not. 


### Context 🔦

Migrating to v5. The code base I'm working in has the convention of keeping styles for components in a styles.ts file. 

### Your environment 🌎

<details>
  <summary>`npx @mui/envinfo`</summary>

```
  System:
    OS: macOS 12.3.1
  Binaries:
    Node: 16.14.0 - /usr/local/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 8.3.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 100.0.4896.75
    Edge: Not Found
    Firefox: Not Found
    Safari: 15.4
  npmPackages:
    @emotion/react: ^11.8.2 => 11.8.2 
    @emotion/styled: ^11.8.1 => 11.8.1 
    @mui/base:  5.0.0-alpha.74 
    @mui/icons-material: ^5.5.1 => 5.5.1 
    @mui/lab: ^5.0.0-alpha.75 => 5.0.0-alpha.75 
    @mui/material: ^5.5.3 => 5.5.3 
    @mui/private-theming:  5.5.3 
    @mui/styled-engine:  5.5.2 
    @mui/styles: ^5.5.3 => 5.5.3 
    @mui/system:  5.5.3 
    @mui/types:  7.1.3 
    @mui/utils:  5.5.3 
    @types/react: 17.0.42 => 17.0.42 
    react: 17.0.2 => 17.0.2 
    react-dom: 17.0.1 => 17.0.1 
    styled-components: ^5.2.1 => 5.3.3 
    typescript: 4.2.2 => 4.2.2 

npm notice 
npm notice New minor version of npm available! 8.3.1 -> 8.6.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.6.0
npm notice Run npm install -g npm@8.6.0 to update!
npm notice 

```
</details>