@atlaskit/textfield 8.0.1 → 8.0.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/textfield
 
+## 8.0.2
+
+### Patch Changes
+
+- [#126525](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/126525)
+  [`69b96eb748121`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/69b96eb748121) -
+  Update dependencies and remove old codemods.
+
 ## 8.0.1
 
 ### Patch Changes

package/dist/cjs/text-field.js

@@ -29,7 +29,7 @@ var inputMediaDisabled = null;
 var analyticsParams = {
   componentName: 'textField',
   packageName: "@atlaskit/textfield",
-  packageVersion: "8.0.1"
+  packageVersion: "8.0.2"
 };
 var disabledStyle = {
   standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",

package/dist/es2019/text-field.js

@@ -13,7 +13,7 @@ const inputMediaDisabled = null;
 const analyticsParams = {
   componentName: 'textField',
   packageName: "@atlaskit/textfield",
-  packageVersion: "8.0.1"
+  packageVersion: "8.0.2"
 };
 const disabledStyle = {
   standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",

package/dist/esm/text-field.js

@@ -19,7 +19,7 @@ var inputMediaDisabled = null;
 var analyticsParams = {
   componentName: 'textField',
   packageName: "@atlaskit/textfield",
-  packageVersion: "8.0.1"
+  packageVersion: "8.0.2"
 };
 var disabledStyle = {
   standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/textfield",
-	"version": "8.0.1",
+	"version": "8.0.2",
 	"description": "A text field is an input that allows a user to write or edit text.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -28,7 +28,7 @@
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tokens": "^4.3.0",
+		"@atlaskit/tokens": "^4.5.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.2"
 	},
@@ -36,19 +36,22 @@
 		"react": "^18.2.0"
 	},
 	"devDependencies": {
-		"@af/accessibility-testing": "*",
-		"@af/integration-testing": "*",
-		"@af/visual-regression": "*",
-		"@atlaskit/codemod-utils": "^4.2.3",
+		"@af/accessibility-testing": "^2.0.0",
+		"@af/integration-testing": "^0.5.0",
+		"@af/visual-regression": "^1.3.0",
+		"@atlaskit/avatar": "^25.0.0",
+		"@atlaskit/button": "^21.1.0",
+		"@atlaskit/docs": "^10.0.0",
 		"@atlaskit/ds-lib": "^4.0.0",
-		"@atlaskit/ssr": "*",
-		"@atlaskit/visual-regression": "*",
-		"@atlassian/feature-flags-test-utils": "*",
-		"@testing-library/dom": "^10.1.0",
+		"@atlaskit/form": "^12.0.0",
+		"@atlaskit/icon": "^25.0.0",
+		"@atlaskit/link": "^3.0.0",
+		"@atlaskit/primitives": "^14.1.0",
+		"@atlaskit/section-message": "^8.1.0",
+		"@atlaskit/ssr": "^0.4.0",
 		"@testing-library/react": "^13.4.0",
-		"jscodeshift": "^0.13.0",
+		"@testing-library/user-event": "^14.4.3",
 		"react-dom": "^18.2.0",
-		"storybook-addon-performance": "^0.17.3",
 		"typescript": "~5.4.2"
 	},
 	"keywords": [

package/codemods/5.0.0-lite-mode.tsx

@@ -1,13 +0,0 @@
-import { removeThemeImports } from './migrations/remove-imports';
-import { removeThemeProp } from './migrations/remove-props';
-import { renameThemeAppearanceImport, renamethemeTokensImport } from './migrations/rename-imports';
-import { createTransformer } from './migrations/utils';
-
-const transformer = createTransformer('@atlaskit/textfield', [
-	removeThemeProp,
-	removeThemeImports,
-	renamethemeTokensImport,
-	renameThemeAppearanceImport,
-]);
-
-export default transformer;

package/codemods/5.6.0-deprecate-disabled.tsx

@@ -1,7 +0,0 @@
-import { createTransformer } from '@atlaskit/codemod-utils';
-
-import { renameDisabledToIsDisabled } from './migrations/rename-disabled-to-isdisabled';
-
-const transformer = createTransformer([renameDisabledToIsDisabled]);
-
-export default transformer;

package/codemods/__tests__/5.0.0-lite-mode.tsx

@@ -1,87 +0,0 @@
-jest.autoMockOff();
-
-import transformer from '../5.0.0-lite-mode';
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('TextField code-mods', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-      import Textfield, { ThemeProps, ThemeAppearance , themeTokens as ColorTokens, ThemeTokens } from '@atlaskit/textfield';
-      import customeTheme from './theme';
-      import React from 'react';
-
-      const SimpleTextfield = () => {
-        return (
-          <Textfield
-            theme={customTheme}
-          />
-        );
-      }
-    `,
-		`
-      /* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
-      has now been removed due to its poor performance characteristics. We have not replaced
-      theme with an equivalent API due to minimal usage of the \`theme\` prop.
-      The appearance of TextField will have likely changed. */
-      /* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
-      has now been removed due to its poor performance characteristics. */
-      import Textfield, { Appearance, TextFieldColors as ColorTokens } from '@atlaskit/textfield';
-      import customeTheme from './theme';
-      import React from 'react';
-
-      const SimpleTextfield = () => {
-        return <Textfield />;
-      }
-    `,
-		'should remove theme & its imports from Textfield and leave a comment',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-      import Textfield, { ThemeProps, ThemeTokens } from '@atlaskit/textfield';
-      import React from 'react';
-
-      const SimpleTextfield = () => {
-        return (
-          <Textfield
-            theme={(theme, props: ThemeProps) => {
-              const { container, input, ...rest } = theme(props);
-              return {
-                ...rest,
-                container: {
-                  ...container,
-                  padding: 5,
-                  border: '2px solid orange',
-                },
-                input: {
-                  ...input,
-                  fontSize: 20,
-                  border: '2px solid green',
-                },
-              };
-            }}
-          />
-        );
-      }
-    `,
-		`
-      /* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
-      has now been removed due to its poor performance characteristics. We have not replaced
-      theme with an equivalent API due to minimal usage of the \`theme\` prop.
-      The appearance of TextField will have likely changed. */
-      /* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
-      has now been removed due to its poor performance characteristics. */
-      import Textfield from '@atlaskit/textfield';
-      import React from 'react';
-
-      const SimpleTextfield = () => {
-        return <Textfield />;
-      }
-    `,
-		'should remove theme prop & its imports from Textfield and leave a comment',
-	);
-});

package/codemods/__tests__/remove-imports.tsx

@@ -1,62 +0,0 @@
-jest.autoMockOff();
-
-import { removeThemeImports } from '../migrations/remove-imports';
-import { createTransformer } from '../migrations/utils';
-
-const transformer = createTransformer('@atlaskit/textfield', [removeThemeImports]);
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-const importToDoComment = `
-/* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
-    has now been removed due to its poor performance characteristics. */`;
-
-describe('Remove imports', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import Textfield, { Theme, ThemeProps, ThemeTokens } from '@atlaskit/textfield';
-    `,
-		`
-    ${importToDoComment}
-    import Textfield from '@atlaskit/textfield';
-  `,
-		'should remove theme imports from Textfield and leave a comment',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import Textfield, { ThemeProps as TextfieldThemeProp, Theme as TextFieldTheme, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
-    `,
-		`
-    ${importToDoComment}
-    import Textfield from '@atlaskit/textfield';
-  `,
-		'should remove theme imports with alias name from Textfield and leave a comment',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { TextFieldProps, ThemeProps, Theme, ThemeTokens } from '@atlaskit/textfield';
-    `,
-		`
-    ${importToDoComment}
-    import { TextFieldProps } from '@atlaskit/textfield';
-    `,
-		'should remove theme imports & leave other imports from Textfield and leave a comment',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { ThemeProps, ThemeTokens, Theme } from '@atlaskit/textfield';
-    `,
-		`
-    ${importToDoComment}
-    `,
-		'should remove theme imports & remove whole line if no default import from Textfield and leave a comment',
-	);
-});

package/codemods/__tests__/remove-prop.tsx

@@ -1,142 +0,0 @@
-jest.autoMockOff();
-
-import { removeThemeProp } from '../migrations/remove-props';
-import { createTransformer } from '../migrations/utils';
-
-const transformer = createTransformer('@atlaskit/textfield', [removeThemeProp]);
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-const themeToDoComment = `
-/* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
-    has now been removed due to its poor performance characteristics. We have not replaced
-    theme with an equivalent API due to minimal usage of the \`theme\` prop.
-    The appearance of TextField will have likely changed. */`;
-
-describe('Remove prop', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return (
-        <Textfield
-          theme={customTheme}
-        />
-      );
-    }
-  `,
-		`
-    ${themeToDoComment}
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return <Textfield />;
-    }
-  `,
-		'should remove theme from Textfield and leave a comment',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import TextField from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return (
-        <TextField
-          theme={customTheme}
-        />
-      );
-    }
-  `,
-		`
-    ${themeToDoComment}
-    import React from 'react';
-    import TextField from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return <TextField />;
-    }
-  `,
-		'should remove theme from TextField and leave a comment',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return (
-        <div>
-          <Textfield
-            theme={customTheme}
-          />
-          <Textfield
-            theme={customTheme}
-          />
-        </div>
-      );
-    }
-  `,
-		`
-    ${themeToDoComment}
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return (
-        <div>
-          <Textfield />
-          <Textfield />
-        </div>
-      );
-    }
-  `,
-		'should remove 2 usages of theme and add 1 comment',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Foo from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return (
-        <Foo
-          theme={customeTheme}
-        />
-      );
-    }
-  `,
-		`
-    ${themeToDoComment}
-    import React from 'react';
-    import Foo from '@atlaskit/textfield';
-    import customeTheme from './theme';
-
-    const SimpleTextfield = () => {
-      return <Foo />;
-    }
-  `,
-		'should remove theme prop when using an aliased name',
-	);
-});

package/codemods/__tests__/rename-disabled-to-isdisabled.tsx

@@ -1,143 +0,0 @@
-jest.autoMockOff();
-
-import { createTransformer } from '@atlaskit/codemod-utils';
-
-import { renameDisabledToIsDisabled } from '../migrations/rename-disabled-to-isdisabled';
-
-const transformer = createTransformer([renameDisabledToIsDisabled]);
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Rename `disabled` prop to `isDisabled`', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      return <Textfield disabled />;
-    }
-  `,
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      return <Textfield isDisabled />;
-    }
-  `,
-		'should rename single line disabled to isDisabled',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      return (
-        <Textfield
-          name="basic"
-          aria-label="default text field"
-          disabled
-        />
-      );
-    }
-  `,
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      return (
-        <Textfield
-          name="basic"
-          aria-label="default text field"
-          isDisabled
-        />
-      );
-    }
-  `,
-		'should rename multiline disabled to isDisabled',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      const disabled = true;
-
-      return (
-        <Textfield
-          name="basic"
-          aria-label="default text field"
-          disabled={disabled}
-        />
-      );
-    }
-  `,
-		`
-    import React from 'react';
-    import Textfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      const disabled = true;
-
-      return (
-        <Textfield
-          name="basic"
-          aria-label="default text field"
-          isDisabled={disabled}
-        />
-      );
-    }
-  `,
-		'should rename disabled to isDisabled with indirection',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import AkTextfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      const disabled = true;
-
-      return (
-        <AkTextfield
-          name="basic"
-          aria-label="default text field"
-          disabled={disabled}
-        />
-      );
-    }
-  `,
-		`
-    import React from 'react';
-    import AkTextfield from '@atlaskit/textfield';
-
-    const SimpleTextfield = () => {
-      const disabled = true;
-
-      return (
-        <AkTextfield
-          name="basic"
-          aria-label="default text field"
-          isDisabled={disabled}
-        />
-      );
-    }
-  `,
-		'should rename disabled to isDisabled with indirection and different default import',
-	);
-});

package/codemods/__tests__/rename-imports.tsx

@@ -1,82 +0,0 @@
-jest.autoMockOff();
-
-import { renameThemeAppearanceImport, renamethemeTokensImport } from '../migrations/rename-imports';
-import { createTransformer } from '../migrations/utils';
-
-const transformer = createTransformer('@atlaskit/textfield', [
-	renamethemeTokensImport,
-	renameThemeAppearanceImport,
-]);
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Rename imports', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { themeTokens, ThemeAppearance } from '@atlaskit/textfield';
-    `,
-		`
-    import { TextFieldColors, Appearance } from '@atlaskit/textfield';
-    `,
-		'should rename themeTokens & ThemeAppearance to TextFieldColors & Appearance',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import Textfield, { ThemeAppearance, themeTokens } from '@atlaskit/textfield';
-    `,
-		`
-    import Textfield, { Appearance, TextFieldColors } from '@atlaskit/textfield';
-  `,
-		'should rename themeTokens & Appearance to TextFieldColors  & Appearance and keep Textfield default import as is',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import Textfield, { TextFieldProps, themeTokens } from '@atlaskit/textfield';
-    `,
-		`
-    import Textfield, { TextFieldProps, TextFieldColors } from '@atlaskit/textfield';
-  `,
-		'should rename themeTokens to TextFieldColors and keep TextFieldProps as is',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import Textfield, { TextFieldProps, themeTokens as MyLifeMyColors } from '@atlaskit/textfield';
-    `,
-		`
-    import Textfield, { TextFieldProps, TextFieldColors as MyLifeMyColors } from '@atlaskit/textfield';
-  `,
-		'should rename themeTokens to TextFieldColors and keep its alias name as is',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import Textfield, { ThemeProps as TextfieldThemeProp,
-      ThemeAppearance as TextFieldAppearance, Theme as TextFieldTheme, themeTokens as MyLifeMyColors, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
-    `,
-		`
-    import Textfield, { ThemeProps as TextfieldThemeProp,
-      Appearance as TextFieldAppearance, Theme as TextFieldTheme, TextFieldColors as MyLifeMyColors, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
-  `,
-		'should rename themeTokens to TextFieldColors, ThemeAppearance to Appearance and keep its alias name as is even when there are multiple name exports with alias',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import { themeTokens, TextFieldProps } from '@atlaskit/textfield';
-    `,
-		`
-    import { TextFieldColors, TextFieldProps } from '@atlaskit/textfield';
-    `,
-		'should rename themeTokens to TextFieldColors and keep TextFieldProps named import as is',
-	);
-});

package/codemods/migrations/remove-imports.tsx

@@ -1,8 +0,0 @@
-import { createRemoveImportsFor } from './utils';
-
-export const removeThemeImports = createRemoveImportsFor({
-	importsToRemove: ['ThemeProps', 'ThemeTokens', 'Theme'],
-	packagePath: '@atlaskit/textfield',
-	comment: `This file uses exports used to help theme @atlaskit/textfield which
-  has now been removed due to its poor performance characteristics.`,
-});

package/codemods/migrations/remove-props.tsx

@@ -1,10 +0,0 @@
-import { createRemoveFuncFor } from './utils';
-
-const component = '@atlaskit/textfield';
-const prop = 'theme';
-const comment = `This file uses the @atlaskit/textfield \`theme\` prop which
-has now been removed due to its poor performance characteristics. We have not replaced
-theme with an equivalent API due to minimal usage of the \`theme\` prop.
-The appearance of TextField will have likely changed.`;
-
-export const removeThemeProp = createRemoveFuncFor(component, prop, comment);

package/codemods/migrations/rename-disabled-to-isdisabled.tsx

@@ -1,7 +0,0 @@
-import { createRenameFuncFor } from '@atlaskit/codemod-utils';
-
-const component = '@atlaskit/textfield';
-const from = 'disabled';
-const to = 'isDisabled';
-
-export const renameDisabledToIsDisabled = createRenameFuncFor(component, from, to);

package/codemods/migrations/rename-imports.tsx

@@ -1,15 +0,0 @@
-import { createRenameJSXFunc } from './utils';
-
-export const renamethemeTokensImport = createRenameJSXFunc(
-	'@atlaskit/textfield',
-	'themeTokens',
-	'TextFieldColors',
-	'DSTextFieldColors',
-);
-
-export const renameThemeAppearanceImport = createRenameJSXFunc(
-	'@atlaskit/textfield',
-	'ThemeAppearance',
-	'Appearance',
-	'DSTextFieldAppearance',
-);

package/codemods/migrations/utils.tsx

@@ -1,335 +0,0 @@
-import {
-	type API,
-	type ASTPath,
-	type default as core,
-	type FileInfo,
-	type Identifier,
-	type ImportDeclaration,
-	type ImportSpecifier,
-	type JSXAttribute,
-	type Options,
-	type Program,
-} from 'jscodeshift';
-import { type Collection } from 'jscodeshift/src/Collection';
-
-export type Nullable<T> = T | null;
-
-export function getDefaultSpecifier(j: core.JSCodeshift, source: any, specifier: string) {
-	const specifiers = source
-		.find(j.ImportDeclaration)
-		.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
-		.find(j.ImportDefaultSpecifier);
-
-	if (!specifiers.length) {
-		return null;
-	}
-	return specifiers.nodes()[0]!.local!.name;
-}
-export function getNamedSpecifier(
-	j: core.JSCodeshift,
-	source: any,
-	specifier: string,
-	importName: string,
-) {
-	const specifiers = source
-		.find(j.ImportDeclaration)
-		.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
-		.find(j.ImportSpecifier)
-		.filter((path: ASTPath<ImportSpecifier>) => path.node.imported.name === importName);
-
-	if (!specifiers.length) {
-		return null;
-	}
-	return specifiers.nodes()[0]!.local!.name;
-}
-
-export function getJSXAttributesByName(
-	j: core.JSCodeshift,
-	element: ASTPath<any>,
-	attributeName: string,
-): Collection<JSXAttribute> {
-	return j(element)
-		.find(j.JSXOpeningElement)
-		.find(j.JSXAttribute)
-		.filter((attribute) => {
-			const matches = j(attribute)
-				.find(j.JSXIdentifier)
-				.filter((identifier) => identifier.value.name === attributeName);
-			return Boolean(matches.length);
-		});
-}
-
-export function hasImportDeclaration(j: core.JSCodeshift, source: any, importPath: string) {
-	const imports = source
-		.find(j.ImportDeclaration)
-		.filter(
-			(path: ASTPath<ImportDeclaration>) =>
-				typeof path.node.source.value === 'string' && path.node.source.value.startsWith(importPath),
-		);
-
-	return Boolean(imports.length);
-}
-// not replacing newlines (which \s does)
-const spacesAndTabs: RegExp = /[ \t]{2,}/g;
-const lineStartWithSpaces: RegExp = /^[ \t]*/gm;
-
-function clean(value: string): string {
-	return (
-		value
-			.replace(spacesAndTabs, ' ')
-			.replace(lineStartWithSpaces, '')
-			// using .trim() to clear the any newlines before the first text and after last text
-			.trim()
-	);
-}
-
-export function addCommentToStartOfFile({
-	j,
-	base,
-	message,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<Node>;
-	message: string;
-}) {
-	addCommentBefore({
-		j,
-		target: base.find(j.Program),
-		message,
-	});
-}
-
-export function addCommentBefore({
-	j,
-	target,
-	message,
-}: {
-	j: core.JSCodeshift;
-	target: Collection<Program> | Collection<ImportDeclaration>;
-	message: string;
-}) {
-	const content: string = ` TODO: (from codemod) ${clean(message)} `;
-	target.forEach((path: ASTPath<Program | ImportDeclaration>) => {
-		path.value.comments = path.value.comments || [];
-
-		const exists = path.value.comments.find((comment) => comment.value === content);
-
-		// avoiding duplicates of the same comment
-		if (exists) {
-			return;
-		}
-
-		path.value.comments.push(j.commentBlock(content));
-	});
-}
-
-export function doesIdentifierExist({
-	j,
-	base,
-	name,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	name: string;
-}): boolean {
-	return (
-		base
-			.find(j.Identifier)
-			.filter((identifer: ASTPath<Identifier>) => identifer.value.name === name).length > 0
-	);
-}
-
-export function getSafeImportName({
-	j,
-	base,
-	currentDefaultSpecifierName,
-	desiredName,
-	fallbackName,
-}: {
-	j: core.JSCodeshift;
-	base: Collection<any>;
-	currentDefaultSpecifierName: string;
-	desiredName: string;
-	fallbackName: string;
-}) {
-	if (currentDefaultSpecifierName === desiredName) {
-		return desiredName;
-	}
-
-	const isUsed: boolean = doesIdentifierExist({ j, base, name: desiredName });
-
-	return isUsed ? fallbackName : desiredName;
-}
-
-export const createRemoveFuncFor =
-	(component: string, prop: string, comment?: string) =>
-	(j: core.JSCodeshift, source: Collection<Node>) => {
-		const defaultSpecifier = getDefaultSpecifier(j, source, component);
-
-		if (!defaultSpecifier) {
-			return;
-		}
-
-		source.findJSXElements(defaultSpecifier).forEach((element) => {
-			getJSXAttributesByName(j, element, prop).forEach((attribute) => {
-				j(attribute).remove();
-				if (comment) {
-					addCommentToStartOfFile({ j, base: source, message: comment });
-				}
-			});
-		});
-	};
-
-export const createRemoveImportsFor =
-	({
-		importsToRemove,
-		packagePath,
-		comment,
-	}: {
-		importsToRemove: string[];
-		packagePath: string;
-		comment: string;
-	}) =>
-	(j: core.JSCodeshift, source: Collection<Node>) => {
-		const isUsingName: boolean =
-			source.find(j.ImportDeclaration).filter((path) => path.node.source.value === packagePath)
-				.length > 0;
-		if (!isUsingName) {
-			return;
-		}
-
-		const existingAliases: Nullable<string>[] =
-			source
-				.find(j.ImportDeclaration)
-				.filter((path) => path.node.source.value === packagePath)
-				.find(j.ImportSpecifier)
-				.nodes()
-				.map((specifier): Nullable<string> => {
-					if (!importsToRemove.includes(specifier.imported.name)) {
-						return null;
-					}
-					// If aliased: return the alias
-					if (specifier.local && !importsToRemove.includes(specifier.local.name)) {
-						return specifier.local.name;
-					}
-
-					return null;
-				})
-				.filter(Boolean) || null;
-
-		// Add comments
-		source
-			.find(j.ImportDeclaration)
-			.filter((path) => path.node.source.value === packagePath)
-			.find(j.ImportSpecifier)
-			.filter((importSpecifier) => {
-				const identifier = j(importSpecifier).find(j.Identifier).get();
-				if (
-					importsToRemove.includes(identifier.value.name) ||
-					existingAliases.includes(identifier.value.name)
-				) {
-					addCommentToStartOfFile({ j, base: source, message: comment });
-					return true;
-				}
-				return false;
-			})
-			.remove();
-
-		// Remove entire import if it is empty
-		const isEmptyNamedImport =
-			source
-				.find(j.ImportDeclaration)
-				.filter((path) => path.node.source.value === packagePath)
-				.find(j.ImportSpecifier)
-				.find(j.Identifier).length === 0;
-
-		if (isEmptyNamedImport) {
-			const isEmptyDefaultImport =
-				source
-					.find(j.ImportDeclaration)
-					.filter((path) => path.node.source.value === packagePath)
-					.find(j.ImportDefaultSpecifier)
-					.find(j.Identifier).length === 0;
-
-			isEmptyDefaultImport
-				? source
-						.find(j.ImportDeclaration)
-						.filter((path) => path.node.source.value === packagePath)
-						.remove()
-				: source
-						.find(j.ImportDeclaration)
-						.filter((path) => path.node.source.value === packagePath)
-						.find(j.ImportSpecifier)
-						.remove();
-		}
-	};
-
-export const createRenameJSXFunc =
-	(packagePath: string, from: string, to: string, fallback: string | undefined = undefined) =>
-	(j: core.JSCodeshift, source: any) => {
-		const namedSpecifier = getNamedSpecifier(j, source, packagePath, from);
-
-		const toName = fallback
-			? getSafeImportName({
-					j,
-					base: source,
-					currentDefaultSpecifierName: namedSpecifier,
-					desiredName: to,
-					fallbackName: fallback,
-				})
-			: to;
-
-		const existingAlias: Nullable<string> =
-			source
-				.find(j.ImportDeclaration)
-				.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === packagePath)
-				.find(j.ImportSpecifier)
-				.nodes()
-				.map((specifier: ImportSpecifier): Nullable<string> => {
-					if (from !== specifier.imported.name) {
-						return null;
-					}
-					// If aliased: return the alias
-					if (specifier.local && from !== specifier.local.name) {
-						return specifier.local.name;
-					}
-
-					return null;
-				})
-				.filter(Boolean)[0] || null;
-
-		source
-			.find(j.ImportDeclaration)
-			.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === packagePath)
-			.find(j.ImportSpecifier)
-			.filter((importSpecifier: ImportSpecifier) => {
-				const identifier = j(importSpecifier).find(j.Identifier).get();
-				if (from === identifier.value.name || existingAlias === identifier.value.name) {
-					return true;
-				}
-				return false;
-			})
-			.replaceWith(
-				[
-					j.importSpecifier(
-						j.identifier(toName),
-						existingAlias ? j.identifier(existingAlias) : null,
-					),
-				],
-				j.literal(packagePath),
-			);
-	};
-
-export const createTransformer =
-	(component: string, migrates: { (j: core.JSCodeshift, source: Collection<Node>): void }[]) =>
-	(fileInfo: FileInfo, { jscodeshift: j }: API, options: Options) => {
-		const source: Collection<Node> = j(fileInfo.source);
-
-		if (!hasImportDeclaration(j, source, component)) {
-			return fileInfo.source;
-		}
-
-		migrates.forEach((tf) => tf(j, source));
-
-		return source.toSource(options.printOptions || { quote: 'single' });
-	};