@atlaskit/form 14.2.0 → 14.2.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/form
 
+## 14.2.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 14.2.1
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 14.2.0
 
 ### Minor Changes
@@ -978,7 +990,6 @@
   had no effect when used.
 
   The props which were removed from the typings are:
-
   - `error`
   - `fieldId`
   - `valid`
@@ -1575,7 +1586,6 @@
 
   Remove namespace imports from React, ReactDom, and PropTypes- Updated dependencies
   [6548261c9a](https://bitbucket.org/atlassian/atlassian-frontend/commits/6548261c9a):
-
   - @atlaskit/docs@8.3.2
   - @atlaskit/visual-regression@0.1.9
   - @atlaskit/button@13.3.7
@@ -1893,7 +1903,6 @@
 ### Minor Changes
 
 - [minor][7bbf303d01](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/7bbf303d01):
-
   - Improved form validation user experience when field validation and submission validation used
     together on the same field
   - Improved form validation docs
@@ -1982,13 +1991,11 @@
 ## 6.0.1
 
 - [patch][19bbcb44ed](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/19bbcb44ed):
-
   - Upgrade final-form dependency. No behavioural or API changes.
 
 ## 6.0.0
 
 - [major][7c17b35107](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/7c17b35107):
-
   - Updates react and react-dom peer dependencies to react@^16.8.0 and react-dom@^16.8.0. To use
     this package, please ensure you use at least this version of react and react-dom.
 
@@ -2011,7 +2018,6 @@
 ## 5.2.8
 
 - [patch][cb7ec50eca](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/cb7ec50eca):
-
   - Internal changes only. Form is compatible with SSR.
 
 ## 5.2.7
@@ -2045,7 +2051,6 @@
 ## 5.2.6
 
 - [patch][9b0bdd73c2](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/9b0bdd73c2):
-
   - Remove unused inline edit dependency from package
 
 ## 5.2.5
@@ -2093,7 +2098,6 @@
 ## 5.2.2
 
 - [patch][a1217df379](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/a1217df379):
-
   - Internal changes only. Form is now compatible with ssr.
 
 ## 5.2.1
@@ -2128,13 +2132,11 @@
 ## 5.2.0
 
 - [minor][fe7683f9d6](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/fe7683f9d6):
-
   - Feature: Submit form on Cmd + Enter on Mac and Ctrl + Enter on Mac and Windows
 
 ## 5.1.8
 
 - [patch][76299208e6](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/76299208e6):
-
   - Drop ES5 from all the flow modules
 
   ### Dropping CJS support in all @atlaskit packages
@@ -2186,7 +2188,6 @@
 ## 5.1.6
 
 - [patch][887c85ffdc](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/887c85ffdc):
-
   - Form now provides a `getValues` function to it's child render function. The `getValues` function
     returns an object containing the current value of all fields.
 
@@ -2201,13 +2202,11 @@
 ## 5.1.4
 
 - [patch][0c0f20c9cf](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/0c0f20c9cf):
-
   - Fix typo in Field.js
 
 ## 5.1.3
 
 - [patch][a360a3d2b6](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/a360a3d2b6):
-
   - Bugfix: field entry in form state gets deleted when Field is unmounted
   - Bugfix: Shallow equal check in Field works correctly across different types
 
@@ -2238,20 +2237,17 @@
 ## 5.1.1
 
 - [patch][58e7bc1](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/58e7bc1):
-
   - Added example of Form use within a ModalDialog - no changes required
 
 ## 5.1.0
 
 - [minor][b36a82f](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/b36a82f):
-
   - **feature:** Uses context to automatically assosiate a message to field. No upgrade changes
     required. Can remove fieldId prop on Message components if you are using that prop currently.
 
 ## 5.0.0
 
 - [major][647a46f](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/647a46f):
-
   - **Breaking:** this version is a major overhaul of the package.
     - **Conceptual changes:** The `Form` component must be the source of truth for the form state.
       This means you keep track of far less state in your application.
@@ -2374,13 +2370,11 @@
 ## 4.0.15
 
 - [patch][e6d3f57](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/e6d3f57):
-
   - Check that content children of FormSection are valid elements before cloning
 
 ## 4.0.14
 
 - [patch][c8d935f](https://bitbucket.org/atlassian/atlaskit-mk-2/commits/c8d935f" d):
-
   - Fixing form header styles
 
 ## 4.0.13

package/codemods/__tests__/not-yet-migrate-to-simplified-form.test.tsx

@@ -460,23 +460,23 @@ const formElement = (
   import Form from '@atlaskit/form';
 
   const FormComponent1 = () => (
-    <Form onSubmit={() => {}} autocomplete="off" id="foo" name="bar" noValidate><input /></Form>
+    <Form onSubmit={() => {}} noValidate name="bar" id="foo" autocomplete="off"><input /></Form>
   );
 
   const FormComponent2 = () => (
     <>
-      <Form onSubmit={() => {}} autocomplete="off" id="foo" name="bar" noValidate><input /></Form>
+      <Form onSubmit={() => {}} noValidate name="bar" id="foo" autocomplete="off"><input /></Form>
     </>
   );
 
   class FormComponent3 extends React.Component {
     render() {
-      return (<Form onSubmit={() => {}} autocomplete="off" id="foo" name="bar" noValidate><input /></Form>);
+      return (<Form onSubmit={() => {}} noValidate name="bar" id="foo" autocomplete="off"><input /></Form>);
     }
   }
 
   const formElement = (
-    <Form onSubmit={() => {}} autocomplete="off" id="foo" name="bar" noValidate><input /></Form>
+    <Form onSubmit={() => {}} noValidate name="bar" id="foo" autocomplete="off"><input /></Form>
   );
 `,
 			'should migrate existing props on `form` into their respective props on `Form`',
@@ -540,23 +540,23 @@ const formElement = (
   import Form from '@atlaskit/form';
 
   const FormComponent1 = () => (
-    <Form onSubmit={() => {}} label="foo" labelId="bar"><input /></Form>
+    <Form onSubmit={() => {}} labelId="bar" label="foo"><input /></Form>
   );
 
   const FormComponent2 = () => (
     <>
-      <Form onSubmit={() => {}} label="foo" labelId="bar"><input /></Form>
+      <Form onSubmit={() => {}} labelId="bar" label="foo"><input /></Form>
     </>
   );
 
   class FormComponent3 extends React.Component {
     render() {
-      return (<Form onSubmit={() => {}} label="foo" labelId="bar"><input /></Form>);
+      return (<Form onSubmit={() => {}} labelId="bar" label="foo"><input /></Form>);
     }
   }
 
   const formElement = (
-    <Form onSubmit={() => {}} label="foo" labelId="bar"><input /></Form>
+    <Form onSubmit={() => {}} labelId="bar" label="foo"><input /></Form>
   );
         `,
 			'should migrate existing props on `form` into different names',
@@ -622,26 +622,26 @@ const formElement = (
   const FormComponent1 = () => (
     <Form
       onSubmit={() => {}}
+      noValidate
+      name="bar"
+      id="foo"
+      autocomplete="off"
       formProps={{
         quu: "qux"
-      }}
-      autocomplete="off"
-      id="foo"
-      name="bar"
-      noValidate><input /></Form>
+      }}><input /></Form>
   );
 
   const FormComponent2 = () => (
     <>
       <Form
         onSubmit={() => {}}
+        noValidate
+        name="bar"
+        id="foo"
+        autocomplete="off"
         formProps={{
           quu: "qux"
-        }}
-        autocomplete="off"
-        id="foo"
-        name="bar"
-        noValidate><input /></Form>
+        }}><input /></Form>
     </>
   );
 
@@ -650,13 +650,13 @@ const formElement = (
       return (
         <Form
           onSubmit={() => {}}
+          noValidate
+          name="bar"
+          id="foo"
+          autocomplete="off"
           formProps={{
             quu: "qux"
-          }}
-          autocomplete="off"
-          id="foo"
-          name="bar"
-          noValidate><input /></Form>
+          }}><input /></Form>
       );
     }
   }
@@ -664,13 +664,13 @@ const formElement = (
   const formElement = (
     <Form
       onSubmit={() => {}}
+      noValidate
+      name="bar"
+      id="foo"
+      autocomplete="off"
       formProps={{
         quu: "qux"
-      }}
-      autocomplete="off"
-      id="foo"
-      name="bar"
-      noValidate><input /></Form>
+      }}><input /></Form>
   );
         `,
 			'should migrate existing props on `form` into their respective props on `Form` and also use `formProps` if needed',

package/codemods/not-yet-migrate-to-simplified-form.tsx

@@ -1,20 +1,12 @@
 import {
 	type API,
+	type Collection,
 	type FileInfo,
 	type JSCodeshift,
 	type JSXAttribute,
 	type JSXElement,
 	type Options,
 } from 'jscodeshift';
-import { type Collection } from 'jscodeshift/src/Collection';
-
-import {
-	addJSXAttributeToJSXElement,
-	getImportDeclarationCollection,
-	getImportDefaultSpecifierCollection,
-	getImportDefaultSpecifierName,
-	hasImportDeclaration,
-} from './utils/helpers';
 
 const importPath = '@atlaskit/form';
 const EXISTING_FORM_ATTRIBUTES: Record<string, any> = {
@@ -26,6 +18,56 @@ const EXISTING_FORM_ATTRIBUTES: Record<string, any> = {
 	noValidate: 'noValidate',
 };
 
+const shouldSkipFile = (filePath: string): boolean =>
+	filePath.includes('__tests__') || filePath.includes('test');
+
+/**
+ * Helper functions for JSX manipulation
+ */
+function getImportDeclarationCollection(
+	j: JSCodeshift,
+	collection: Collection<any>,
+	importPath: string,
+): Collection<any> {
+	return collection.find(j.ImportDeclaration, {
+		source: { value: importPath },
+	});
+}
+
+function getImportDefaultSpecifierCollection(
+	j: JSCodeshift,
+	importDeclarationCollection: Collection<any>,
+): Collection<any> {
+	return importDeclarationCollection.find(j.ImportDefaultSpecifier);
+}
+
+function getImportDefaultSpecifierName(defaultImport: Collection<any>): string | null {
+	if (defaultImport.length === 0) {
+		return null;
+	}
+	return defaultImport.get(0).node.local.name;
+}
+
+function hasImportDeclaration(
+	j: JSCodeshift,
+	collection: Collection<any>,
+	importPath: string,
+): boolean {
+	return getImportDeclarationCollection(j, collection, importPath).length > 0;
+}
+
+function addJSXAttributeToJSXElement(
+	j: JSCodeshift,
+	jsxElementPath: any,
+	attribute: JSXAttribute,
+	position: number = 0,
+): void {
+	if (!jsxElementPath.node.openingElement.attributes) {
+		jsxElementPath.node.openingElement.attributes = [];
+	}
+	jsxElementPath.node.openingElement.attributes.splice(position, 0, attribute);
+}
+
 const convertToSimpleForm = (j: JSCodeshift, collection: Collection<any>) => {
 	const importDeclarationCollection = getImportDeclarationCollection(j, collection, importPath);
 	const defaultImport = getImportDefaultSpecifierCollection(j, importDeclarationCollection);
@@ -58,7 +100,7 @@ const convertToSimpleForm = (j: JSCodeshift, collection: Collection<any>) => {
 			return;
 		}
 
-		// if function child but more than just `fieldProps`, exit early
+		// if function child but more than just `formProps`, exit early
 		const args = childFunction.expression.params
 			.filter((arg) => arg.type === 'ObjectPattern' && 'properties' in arg)
 			.flatMap((arg) => arg.properties)
@@ -188,7 +230,13 @@ const convertToSimpleForm = (j: JSCodeshift, collection: Collection<any>) => {
 };
 
 export default function transformer(fileInfo: FileInfo, { jscodeshift: j }: API, options: Options) {
-	const { source } = fileInfo;
+	const { source, path } = fileInfo;
+
+	// Skip test files
+	if (path && shouldSkipFile(path)) {
+		return source;
+	}
+
 	const collection = j(source);
 
 	// If our component is not here, skip the file

package/dist/types/form.d.ts

@@ -13,7 +13,7 @@ type GetCurrentValue = <FormValues>(name: string) => FormValues[keyof FormValues
 export declare const FormContext: React.Context<{
     registerField: RegisterField;
     getCurrentValue: GetCurrentValue;
-    subscribe: FormApi["subscribe"];
+    subscribe: FormApi['subscribe'];
 }>;
 /**
  * __Is disabled context__
@@ -116,5 +116,5 @@ export interface FormProps<FormValues> {
  * - [Code](https://atlassian.design/components/form/code)
  * - [Usage](https://atlassian.design/components/form/usage)
  */
-declare const Form: <FormValues extends Record<string, any> = {}>(props: FormProps<FormValues> & React.RefAttributes<HTMLFormElement>) => React.ReactElement | null;
+declare const Form: <FormValues extends Record<string, any>>(props: FormProps<FormValues> & React.RefAttributes<HTMLFormElement>) => React.ReactElement | null;
 export default Form;

package/dist/types-ts4.5/form.d.ts

@@ -13,7 +13,7 @@ type GetCurrentValue = <FormValues>(name: string) => FormValues[keyof FormValues
 export declare const FormContext: React.Context<{
     registerField: RegisterField;
     getCurrentValue: GetCurrentValue;
-    subscribe: FormApi["subscribe"];
+    subscribe: FormApi['subscribe'];
 }>;
 /**
  * __Is disabled context__
@@ -116,5 +116,5 @@ export interface FormProps<FormValues> {
  * - [Code](https://atlassian.design/components/form/code)
  * - [Usage](https://atlassian.design/components/form/usage)
  */
-declare const Form: <FormValues extends Record<string, any> = {}>(props: FormProps<FormValues> & React.RefAttributes<HTMLFormElement>) => React.ReactElement | null;
+declare const Form: <FormValues extends Record<string, any>>(props: FormProps<FormValues> & React.RefAttributes<HTMLFormElement>) => React.ReactElement | null;
 export default Form;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/form",
-	"version": "14.2.0",
+	"version": "14.2.2",
 	"description": "A form allows users to input information.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -16,7 +16,7 @@
 		"**/*.compiled.css"
 	],
 	"atlaskit:src": "src/index.tsx",
-	"atlaskit:designLink": "https://atlassian.design/guidelines/product/patterns/forms",
+	"atlaskit:designLink": "https://atlassian.design/patterns/forms",
 	"atlassian": {
 		"team": "Design System Team",
 		"website": {
@@ -25,13 +25,13 @@
 		}
 	},
 	"dependencies": {
-		"@atlaskit/css": "^0.14.0",
+		"@atlaskit/css": "^0.15.0",
 		"@atlaskit/ds-lib": "^5.1.0",
 		"@atlaskit/heading": "^5.2.0",
-		"@atlaskit/icon": "^28.3.0",
+		"@atlaskit/icon": "^28.5.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^14.15.0",
-		"@atlaskit/tokens": "^6.3.0",
+		"@atlaskit/primitives": "^15.0.0",
+		"@atlaskit/tokens": "^7.0.0",
 		"@babel/runtime": "^7.0.0",
 		"final-form": "^4.20.3",
 		"final-form-focus": "^1.1.2",
@@ -45,14 +45,14 @@
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/banner": "^14.0.0",
-		"@atlaskit/button": "^23.4.0",
+		"@atlaskit/button": "^23.5.0",
 		"@atlaskit/checkbox": "^17.1.0",
 		"@atlaskit/codemod-utils": "^4.2.0",
-		"@atlaskit/datetime-picker": "^17.0.0",
-		"@atlaskit/docs": "^11.1.0",
+		"@atlaskit/datetime-picker": "^17.1.0",
+		"@atlaskit/docs": "^11.2.0",
 		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/lozenge": "^13.0.0",
-		"@atlaskit/modal-dialog": "^14.4.0",
+		"@atlaskit/modal-dialog": "^14.5.0",
 		"@atlaskit/radio": "^8.3.0",
 		"@atlaskit/range": "^9.2.0",
 		"@atlaskit/section-message": "^8.7.0",