@atlaskit/button 17.17.1 → 17.17.3

package/codemods/optimistic-15.0.0-lite-mode.tsx

@@ -1,81 +1,72 @@
 import { type NodePath } from 'ast-types/lib/node-path';
-import type {
-  API,
-  default as core,
-  FileInfo,
-  JSXElement,
-  Node,
-  Options,
-} from 'jscodeshift';
+import type { API, default as core, FileInfo, JSXElement, Node, Options } from 'jscodeshift';
 import { type Collection } from 'jscodeshift/src/Collection';
 
 import { convertButtonType, transformButton } from './helpers/15.0.0-runner';
 import {
-  addCommentBefore,
-  addCommentToStartOfFile,
-  addToImport,
-  changeImportFor,
-  getDefaultSpecifierName,
-  getSafeImportName,
-  isOnlyUsingNameForJSX,
-  isUsingProp,
-  isUsingSupportedSpread,
-  type Nullable,
-  tryCreateImport,
+	addCommentBefore,
+	addCommentToStartOfFile,
+	addToImport,
+	changeImportFor,
+	getDefaultSpecifierName,
+	getSafeImportName,
+	isOnlyUsingNameForJSX,
+	isUsingProp,
+	isUsingSupportedSpread,
+	type Nullable,
+	tryCreateImport,
 } from './helpers/helpers-generic';
 
 function changeUsage({
-  j,
-  base,
-  packageName,
+	j,
+	base,
+	packageName,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<Node>;
-  packageName: string;
+	j: core.JSCodeshift;
+	base: Collection<Node>;
+	packageName: string;
 }): void {
-  // 1. Are we using the default export?
-  // If not: we can exit early!
-  const defaultName: Nullable<string> = getDefaultSpecifierName({
-    j,
-    base,
-    packageName,
-  });
-  if (defaultName == null) {
-    return;
-  }
+	// 1. Are we using the default export?
+	// If not: we can exit early!
+	const defaultName: Nullable<string> = getDefaultSpecifierName({
+		j,
+		base,
+		packageName,
+	});
+	if (defaultName == null) {
+		return;
+	}
 
-  // Only supporting cases where default identifier is only used in JSX
-  const isSupported: boolean = isOnlyUsingNameForJSX({
-    j,
-    base,
-    name: defaultName,
-  });
+	// Only supporting cases where default identifier is only used in JSX
+	const isSupported: boolean = isOnlyUsingNameForJSX({
+		j,
+		base,
+		name: defaultName,
+	});
 
-  if (!isSupported) {
-    tryCreateImport({
-      j,
-      base,
-      relativeToPackage: '@atlaskit/button',
-      packageName: '@atlaskit/button/standard-button',
-    });
-    addToImport({
-      j,
-      base,
-      // we can safely use the default name, because it was being used before
-      importSpecifier: j.importDefaultSpecifier(j.identifier(defaultName)),
-      packageName: '@atlaskit/button/standard-button',
-    });
+	if (!isSupported) {
+		tryCreateImport({
+			j,
+			base,
+			relativeToPackage: '@atlaskit/button',
+			packageName: '@atlaskit/button/standard-button',
+		});
+		addToImport({
+			j,
+			base,
+			// we can safely use the default name, because it was being used before
+			importSpecifier: j.importDefaultSpecifier(j.identifier(defaultName)),
+			packageName: '@atlaskit/button/standard-button',
+		});
 
-    addCommentBefore({
-      j,
-      target: base
-        .find(j.ImportDeclaration)
-        .filter(
-          (declaration) =>
-            declaration.value.source.value ===
-            '@atlaskit/button/standard-button',
-        ),
-      message: `
+		addCommentBefore({
+			j,
+			target: base
+				.find(j.ImportDeclaration)
+				.filter(
+					(declaration) => declaration.value.source.value === '@atlaskit/button/standard-button',
+				),
+			message: `
         This file does not exclusively use Button in JSX.
         The codemod is unable to know which button variant, so it is using
         the standard button: "@atlaskit/button/standard-button".
@@ -83,203 +74,189 @@ function changeUsage({
         Please validate this decision.
         You might need to change the usage of Button to either LoadingButton or CustomThemeButton
       `,
-    });
-    return;
-  }
+		});
+		return;
+	}
 
-  // Find usages of the Button component
-  // There are three possible import statements:
-  //  1. import Button from '@atlaskit/button/standard';
-  //  2. import LoadingButton from '@atlaskit/button/loading-button';
-  //  3. import CustomThemeButton from '@atlaskit/button/custom-theme-button';
+	// Find usages of the Button component
+	// There are three possible import statements:
+	//  1. import Button from '@atlaskit/button/standard';
+	//  2. import LoadingButton from '@atlaskit/button/loading-button';
+	//  3. import CustomThemeButton from '@atlaskit/button/custom-theme-button';
 
-  // What to do if any of the names clash?
-  // - In the case of clash: prefix with 'DS' (eg import DSLoadingButton from '@atlaskit/button/loading-button';)
+	// What to do if any of the names clash?
+	// - In the case of clash: prefix with 'DS' (eg import DSLoadingButton from '@atlaskit/button/loading-button';)
 
-  // What to do if old Button was aliased? eg "AkButton"
-  // - We cannot use that existing alias as we might have three different Button imports in the file
-  // - We automatically will be be swapping to the standard names with 'DS' prefix for all imports
+	// What to do if old Button was aliased? eg "AkButton"
+	// - We cannot use that existing alias as we might have three different Button imports in the file
+	// - We automatically will be be swapping to the standard names with 'DS' prefix for all imports
 
-  type Groups = {
-    standard: NodePath<JSXElement, JSXElement>[];
-    loading: NodePath<JSXElement, JSXElement>[];
-    customTheme: NodePath<JSXElement, JSXElement>[];
-  };
+	type Groups = {
+		standard: NodePath<JSXElement, JSXElement>[];
+		loading: NodePath<JSXElement, JSXElement>[];
+		customTheme: NodePath<JSXElement, JSXElement>[];
+	};
 
-  const groups: Groups = {
-    standard: [],
-    loading: [],
-    customTheme: [],
-  };
+	const groups: Groups = {
+		standard: [],
+		loading: [],
+		customTheme: [],
+	};
 
-  base.findJSXElements(defaultName).forEach((path) => {
-    const hasThemeProp: boolean = isUsingProp({
-      j,
-      base,
-      element: path,
-      propName: 'theme',
-    });
+	base.findJSXElements(defaultName).forEach((path) => {
+		const hasThemeProp: boolean = isUsingProp({
+			j,
+			base,
+			element: path,
+			propName: 'theme',
+		});
 
-    if (hasThemeProp) {
-      groups.customTheme.push(path);
-      return;
-    }
+		if (hasThemeProp) {
+			groups.customTheme.push(path);
+			return;
+		}
 
-    if (!isUsingSupportedSpread({ j, base, element: path })) {
-      addCommentToStartOfFile({
-        j,
-        base,
-        message: `
+		if (!isUsingSupportedSpread({ j, base, element: path })) {
+			addCommentToStartOfFile({
+				j,
+				base,
+				message: `
           Detected spreading props (<Button {...props} />) that was too complex for our codemod to understand
           Our codemod will only look at inline objects, or objects defined in the same file (ObjectExpression's)
           We have opted for our safest upgrade component in this file: '<CustomThemeButton />'
         `,
-      });
-      groups.customTheme.push(path);
-      return;
-    }
+			});
+			groups.customTheme.push(path);
+			return;
+		}
 
-    const isUsingThemeInFile: boolean =
-      base
-        .find(j.ImportDeclaration)
-        .filter(
-          (declaration) =>
-            declaration.value.source.value ===
-            '@atlaskit/button/custom-theme-button',
-        )
-        .find(j.ImportSpecifier)
-        .filter((specifier) => specifier.value.imported.name === 'Theme')
-        .length > 0;
+		const isUsingThemeInFile: boolean =
+			base
+				.find(j.ImportDeclaration)
+				.filter(
+					(declaration) =>
+						declaration.value.source.value === '@atlaskit/button/custom-theme-button',
+				)
+				.find(j.ImportSpecifier)
+				.filter((specifier) => specifier.value.imported.name === 'Theme').length > 0;
 
-    if (isUsingThemeInFile) {
-      addCommentToStartOfFile({
-        j,
-        base,
-        message: `
+		if (isUsingThemeInFile) {
+			addCommentToStartOfFile({
+				j,
+				base,
+				message: `
           Using "import { Theme } from '@atlaskit/button/custom-theme-button" in a file
           will cause all buttons in that file to be safely converted to a <CustomThemeButton/>
         `,
-      });
+			});
 
-      groups.customTheme.push(path);
-      return;
-    }
+			groups.customTheme.push(path);
+			return;
+		}
 
-    const hasIsLoadingProp: boolean = isUsingProp({
-      j,
-      base,
-      element: path,
-      propName: 'isLoading',
-    });
+		const hasIsLoadingProp: boolean = isUsingProp({
+			j,
+			base,
+			element: path,
+			propName: 'isLoading',
+		});
 
-    if (hasIsLoadingProp) {
-      groups.loading.push(path);
-      return;
-    }
+		if (hasIsLoadingProp) {
+			groups.loading.push(path);
+			return;
+		}
 
-    groups.standard.push(path);
-    return;
-  });
+		groups.standard.push(path);
+		return;
+	});
 
-  convertButtonType({
-    j,
-    base,
-    elements: groups.standard,
-    name: getSafeImportName({
-      j,
-      base,
-      currentDefaultSpecifierName: defaultName,
-      desiredName: 'Button',
-      fallbackName: 'DSButton',
-    }),
-    newPackageName: '@atlaskit/button/standard-button',
-  });
+	convertButtonType({
+		j,
+		base,
+		elements: groups.standard,
+		name: getSafeImportName({
+			j,
+			base,
+			currentDefaultSpecifierName: defaultName,
+			desiredName: 'Button',
+			fallbackName: 'DSButton',
+		}),
+		newPackageName: '@atlaskit/button/standard-button',
+	});
 
-  convertButtonType({
-    j,
-    base,
-    elements: groups.loading,
-    newPackageName: '@atlaskit/button/loading-button',
-    name: getSafeImportName({
-      j,
-      base,
-      desiredName: 'LoadingButton',
-      fallbackName: 'DSLoadingButton',
-      currentDefaultSpecifierName: defaultName,
-    }),
-  });
-  convertButtonType({
-    j,
-    base,
-    elements: groups.customTheme,
-    newPackageName: '@atlaskit/button/custom-theme-button',
-    name: getSafeImportName({
-      j,
-      base,
-      currentDefaultSpecifierName: defaultName,
-      desiredName: 'CustomThemeButton',
-      fallbackName: 'DSCustomThemeButton',
-    }),
-  });
+	convertButtonType({
+		j,
+		base,
+		elements: groups.loading,
+		newPackageName: '@atlaskit/button/loading-button',
+		name: getSafeImportName({
+			j,
+			base,
+			desiredName: 'LoadingButton',
+			fallbackName: 'DSLoadingButton',
+			currentDefaultSpecifierName: defaultName,
+		}),
+	});
+	convertButtonType({
+		j,
+		base,
+		elements: groups.customTheme,
+		newPackageName: '@atlaskit/button/custom-theme-button',
+		name: getSafeImportName({
+			j,
+			base,
+			currentDefaultSpecifierName: defaultName,
+			desiredName: 'CustomThemeButton',
+			fallbackName: 'DSCustomThemeButton',
+		}),
+	});
 }
 
-export default function transformer(
-  file: FileInfo,
-  { jscodeshift: j }: API,
-  options: Options,
-) {
-  return transformButton({
-    j,
-    file,
-    custom: (base: Collection<any>) => {
-      changeImportFor({
-        j,
-        base,
-        option: {
-          type: 'keep-name',
-          name: 'ButtonProps',
-          behaviour: 'keep-as-named-import',
-        },
-        oldPackagePath: '@atlaskit/button',
-        newPackagePath: '@atlaskit/button/types',
-      });
+export default function transformer(file: FileInfo, { jscodeshift: j }: API, options: Options) {
+	return transformButton({
+		j,
+		file,
+		custom: (base: Collection<any>) => {
+			changeImportFor({
+				j,
+				base,
+				option: {
+					type: 'keep-name',
+					name: 'ButtonProps',
+					behaviour: 'keep-as-named-import',
+				},
+				oldPackagePath: '@atlaskit/button',
+				newPackagePath: '@atlaskit/button/types',
+			});
 
-      const isUsingButtonPropsType: boolean =
-        base
-          .find(j.ImportDeclaration)
-          .filter(
-            (declaration) =>
-              declaration.value.source.value === '@atlaskit/button/types',
-          )
-          .find(j.ImportSpecifier)
-          .filter(
-            (specifier) => specifier.value.imported.name === 'ButtonProps',
-          ).length > 0;
+			const isUsingButtonPropsType: boolean =
+				base
+					.find(j.ImportDeclaration)
+					.filter((declaration) => declaration.value.source.value === '@atlaskit/button/types')
+					.find(j.ImportSpecifier)
+					.filter((specifier) => specifier.value.imported.name === 'ButtonProps').length > 0;
 
-      if (isUsingButtonPropsType) {
-        const target = base
-          .find(j.ImportDeclaration)
-          .filter(
-            (declaration) =>
-              declaration.value.source.value === '@atlaskit/button/types',
-          );
-        addCommentBefore({
-          j,
-          target,
-          message: `
+			if (isUsingButtonPropsType) {
+				const target = base
+					.find(j.ImportDeclaration)
+					.filter((declaration) => declaration.value.source.value === '@atlaskit/button/types');
+				addCommentBefore({
+					j,
+					target,
+					message: `
       Verify ButtonProps is the right prop type
       You might need the LoadingButtonProps, CustomButtonProps types which can be imported from '@atlaskit/button/types'
     `,
-        });
-      }
+				});
+			}
 
-      changeUsage({
-        j,
-        base,
-        packageName: '@atlaskit/button',
-      });
-    },
-  });
+			changeUsage({
+				j,
+				base,
+				packageName: '@atlaskit/button',
+			});
+		},
+	});
 }
 
 // Note: not exporting a 'parser' because doing so

package/dist/cjs/new-button/variants/default/button.js

@@ -10,7 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireDefault(require("react"));
 var _pressable = _interopRequireDefault(require("@atlaskit/primitives/pressable"));
 var _useDefaultButton = _interopRequireDefault(require("./use-default-button"));
-var _excluded = ["analyticsContext", "interactionName", "autoFocus", "appearance", "spacing", "isDisabled", "isSelected", "iconBefore", "isLoading", "UNSAFE_iconAfter_size", "iconAfter", "UNSAFE_iconBefore_size", "children", "shouldFitContainer", "overlay", "onClick", "onMouseDownCapture", "onMouseUpCapture", "onKeyDownCapture", "onKeyUpCapture", "onTouchStartCapture", "onTouchEndCapture", "onPointerDownCapture", "onPointerUpCapture", "onClickCapture", "type", "testId"];
+var _excluded = ["analyticsContext", "appearance", "autoFocus", "children", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isLoading", "isSelected", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "overlay", "shouldFitContainer", "spacing", "testId", "type", "UNSAFE_iconAfter_size", "UNSAFE_iconBefore_size"];
 /**
  * __Button__
  *
@@ -22,33 +22,33 @@ var _excluded = ["analyticsContext", "interactionName", "autoFocus", "appearance
  */
 var Button = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef(function Button(_ref, ref) {
   var analyticsContext = _ref.analyticsContext,
-    interactionName = _ref.interactionName,
-    autoFocus = _ref.autoFocus,
     appearance = _ref.appearance,
-    spacing = _ref.spacing,
-    isDisabled = _ref.isDisabled,
-    isSelected = _ref.isSelected,
+    autoFocus = _ref.autoFocus,
+    children = _ref.children,
+    iconAfter = _ref.iconAfter,
     iconBefore = _ref.iconBefore,
+    interactionName = _ref.interactionName,
+    isDisabled = _ref.isDisabled,
     isLoading = _ref.isLoading,
-    UNSAFE_iconAfter_size = _ref.UNSAFE_iconAfter_size,
-    iconAfter = _ref.iconAfter,
-    UNSAFE_iconBefore_size = _ref.UNSAFE_iconBefore_size,
-    children = _ref.children,
-    shouldFitContainer = _ref.shouldFitContainer,
-    overlay = _ref.overlay,
+    isSelected = _ref.isSelected,
     onClick = _ref.onClick,
-    onMouseDownCapture = _ref.onMouseDownCapture,
-    onMouseUpCapture = _ref.onMouseUpCapture,
+    onClickCapture = _ref.onClickCapture,
     onKeyDownCapture = _ref.onKeyDownCapture,
     onKeyUpCapture = _ref.onKeyUpCapture,
-    onTouchStartCapture = _ref.onTouchStartCapture,
-    onTouchEndCapture = _ref.onTouchEndCapture,
+    onMouseDownCapture = _ref.onMouseDownCapture,
+    onMouseUpCapture = _ref.onMouseUpCapture,
     onPointerDownCapture = _ref.onPointerDownCapture,
     onPointerUpCapture = _ref.onPointerUpCapture,
-    onClickCapture = _ref.onClickCapture,
+    onTouchEndCapture = _ref.onTouchEndCapture,
+    onTouchStartCapture = _ref.onTouchStartCapture,
+    overlay = _ref.overlay,
+    shouldFitContainer = _ref.shouldFitContainer,
+    spacing = _ref.spacing,
+    testId = _ref.testId,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'button' : _ref$type,
-    testId = _ref.testId,
+    UNSAFE_iconAfter_size = _ref.UNSAFE_iconAfter_size,
+    UNSAFE_iconBefore_size = _ref.UNSAFE_iconBefore_size,
     rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var baseProps = (0, _useDefaultButton.default)({
     analyticsContext: analyticsContext,
@@ -56,28 +56,28 @@ var Button = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     autoFocus: autoFocus,
     buttonType: 'button',
     children: children,
-    iconBefore: iconBefore,
-    UNSAFE_iconBefore_size: UNSAFE_iconBefore_size,
     iconAfter: iconAfter,
-    UNSAFE_iconAfter_size: UNSAFE_iconAfter_size,
+    iconBefore: iconBefore,
     interactionName: interactionName,
     isDisabled: isDisabled,
-    isSelected: isSelected,
     isLoading: isLoading,
+    isSelected: isSelected,
     onClick: onClick,
-    onMouseDownCapture: onMouseDownCapture,
-    onMouseUpCapture: onMouseUpCapture,
+    onClickCapture: onClickCapture,
     onKeyDownCapture: onKeyDownCapture,
     onKeyUpCapture: onKeyUpCapture,
-    onTouchStartCapture: onTouchStartCapture,
-    onTouchEndCapture: onTouchEndCapture,
+    onMouseDownCapture: onMouseDownCapture,
+    onMouseUpCapture: onMouseUpCapture,
     onPointerDownCapture: onPointerDownCapture,
     onPointerUpCapture: onPointerUpCapture,
-    onClickCapture: onClickCapture,
+    onTouchEndCapture: onTouchEndCapture,
+    onTouchStartCapture: onTouchStartCapture,
     overlay: overlay,
     ref: ref,
     shouldFitContainer: shouldFitContainer,
-    spacing: spacing
+    spacing: spacing,
+    UNSAFE_iconAfter_size: UNSAFE_iconAfter_size,
+    UNSAFE_iconBefore_size: UNSAFE_iconBefore_size
   });
   return /*#__PURE__*/_react.default.createElement(_pressable.default
   // TODO: Remove spread props