@atlaskit/calendar 16.3.1 → 16.3.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/calendar
 
+## 16.3.2
+
+### Patch Changes
+
+- [#114277](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/114277)
+  [`f10877b44dc55`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f10877b44dc55) -
+  Update depdencies and remove old codemods.
+
 ## 16.3.1
 
 ### Patch Changes

package/dist/cjs/calendar.js

@@ -38,7 +38,7 @@ var styles = {
 var analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "16.3.1"
+  packageVersion: "16.3.2"
 };
 var InnerCalendar = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_ref, ref) {
   var day = _ref.day,

package/dist/es2019/calendar.js

@@ -24,7 +24,7 @@ const styles = {
 const analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "16.3.1"
+  packageVersion: "16.3.2"
 };
 const InnerCalendar = /*#__PURE__*/forwardRef(function Calendar({
   day,

package/dist/esm/calendar.js

@@ -28,7 +28,7 @@ var styles = {
 var analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "16.3.1"
+  packageVersion: "16.3.2"
 };
 var InnerCalendar = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
   var day = _ref.day,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/calendar",
-	"version": "16.3.1",
+	"version": "16.3.2",
 	"description": "An interactive calendar for date selection experiences.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,10 +30,10 @@
 		"@atlaskit/css": "^0.8.0",
 		"@atlaskit/ds-lib": "^3.5.0",
 		"@atlaskit/heading": "^4.1.0",
-		"@atlaskit/icon": "^23.7.0",
+		"@atlaskit/icon": "^23.9.0",
 		"@atlaskit/locale": "^2.8.0",
 		"@atlaskit/platform-feature-flags": "*",
-		"@atlaskit/primitives": "^13.4.0",
+		"@atlaskit/primitives": "^13.5.0",
 		"@atlaskit/theme": "^15.0.0",
 		"@atlaskit/tokens": "^3.3.0",
 		"@babel/runtime": "^7.0.0",
@@ -55,13 +55,10 @@
 		"@atlaskit/ssr": "*",
 		"@atlaskit/visual-regression": "*",
 		"@atlassian/feature-flags-test-utils": "*",
-		"@testing-library/dom": "^10.1.0",
 		"@testing-library/react": "^13.4.0",
 		"@testing-library/user-event": "^14.4.3",
 		"jest-in-case": "^1.0.2",
-		"jscodeshift": "^0.13.0",
 		"react-dom": "^18.2.0",
-		"storybook-addon-performance": "^0.17.3",
 		"typescript": "~5.4.2"
 	},
 	"techstack": {

package/codemods/11.0.0-lite-mode.tsx

@@ -1,10 +0,0 @@
-import { flattenCertainInnerPropsAsProp } from './migrations/flatten-certain-inner-props-as-prop';
-import { removeInnerProps } from './migrations/remove-inner-props';
-import { createTransformer } from './utils';
-
-const transformer = createTransformer('@atlaskit/calendar', [
-	flattenCertainInnerPropsAsProp,
-	removeInnerProps,
-]);
-
-export default transformer;

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

@@ -1,166 +0,0 @@
-jest.autoMockOff();
-
-import transformer from '../11.0.0-lite-mode';
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Calendar code-mods', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar= () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']}
-          defaultMonth={12}
-          defaultYear={2020}
-          innerProps={{
-            className: 'myClass',
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-          testId="the-calendar"
-        />
-      );
-    }
-    `,
-		`
-    /* TODO: (from codemod) This file uses the @atlaskit/calendar \`innerProps\` which
-    has now been removed due to its poor performance characteristics. Codemod
-    has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-    Rest other properties if any inside innerProps will get auto-removed along with it,
-    & might have to be handled manually as per need. */
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar= () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']}
-          defaultMonth={12}
-          defaultYear={2020}
-          testId="the-calendar"
-          className={'myClass'}
-          style={{
-            border: '1px solid red',
-            display: 'inline-block',
-          }} />
-      );
-    }
-    `,
-		`should flatten style & className in innerProps as standalone prop
-      & then remove innerProps`,
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar= () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']}
-          defaultMonth={12}
-          defaultYear={2020}
-          innerProps={{
-            className: 'myClass',
-            theme: 'dark',
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-          testId="the-calendar"
-        />
-      );
-    }
-    `,
-		`
-    /* TODO: (from codemod) This file uses the @atlaskit/calendar \`innerProps\` which
-    has now been removed due to its poor performance characteristics. Codemod
-    has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-    Rest other properties if any inside innerProps will get auto-removed along with it,
-    & might have to be handled manually as per need. */
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar= () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']}
-          defaultMonth={12}
-          defaultYear={2020}
-          testId="the-calendar"
-          className={'myClass'}
-          style={{
-            border: '1px solid red',
-            display: 'inline-block',
-          }} />
-      );
-    }
-    `,
-		`should only flatten style & className in innerProps as standalone prop
-      & then remove innerProps`,
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar= () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']}
-          defaultMonth={12}
-          defaultYear={2020}
-          innerProps={{
-            dummyInnerProp: 'dummy'
-          }}
-          testId="the-calendar"
-        />
-      );
-    }
-    `,
-		`
-    /* TODO: (from codemod) This file uses the @atlaskit/calendar \`innerProps\` which
-    has now been removed due to its poor performance characteristics. Codemod
-    has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-    Rest other properties if any inside innerProps will get auto-removed along with it,
-    & might have to be handled manually as per need. */
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar= () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']}
-          defaultMonth={12}
-          defaultYear={2020}
-          testId="the-calendar" />
-      );
-    }
-    `,
-		`should not flatten any other prop apart from style & className in innerProps
-      & just remove innerProps`,
-	);
-});

package/codemods/__tests__/flatten-certain-inner-props-as-prop.tsx

@@ -1,156 +0,0 @@
-jest.autoMockOff();
-
-import { flattenCertainInnerPropsAsProp } from '../migrations/flatten-certain-inner-props-as-prop';
-import { createTransformer } from '../utils';
-
-const transformer = createTransformer('@atlaskit/calendar', [flattenCertainInnerPropsAsProp]);
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Flatten Inner Prop Style As Prop', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-            className: 'abc',
-          }}
-        />
-      )
-    };
-  `,
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-            className: 'abc',
-          }}
-          style={{
-            border: '1px solid red',
-            display: 'inline-block',
-          }}
-          className={'abc'} />
-      );
-    };
-  `,
-		'should flatten style & className properties in inner props as a new standalone props',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            className: 'abc',
-          }}
-        />
-      )
-    };
-  `,
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            className: 'abc',
-          }}
-          className={'abc'} />
-      );
-    };
-  `,
-		'should just flatten className property in inner props as a new standalone prop',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-        />
-      )
-    };
-  `,
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-          style={{
-            border: '1px solid red',
-            display: 'inline-block',
-          }} />
-      );
-    };
-  `,
-		'should just flatten style property in inner props as a new standalone prop',
-	);
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            theme: 'dark'
-          }}
-        />
-      )
-    };
-  `,
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            theme: 'dark'
-          }}
-        />
-      )
-    };
-  `,
-		'should not flatten any other prop in inner props if className & style prop is not present',
-	);
-});

package/codemods/__tests__/remove-inner-props.tsx

@@ -1,160 +0,0 @@
-jest.autoMockOff();
-
-import { removeInnerProps } from '../migrations/remove-inner-props';
-import { createTransformer } from '../utils';
-
-const transformer = createTransformer('@atlaskit/calendar', [removeInnerProps]);
-
-const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
-
-describe('Remove innerProps', () => {
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-        />
-      );
-    }
-  `,
-		`
-    /* TODO: (from codemod) This file uses the @atlaskit/calendar \`innerProps\` which
-    has now been removed due to its poor performance characteristics. Codemod
-    has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-    Rest other properties if any inside innerProps will get auto-removed along with it,
-    & might have to be handled manually as per need. */
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return <Calendar />;
-    }
-  `,
-		'should remove innerProps from Calendar and leave a TODO comment',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import AkCalendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return (
-        <AkCalendar
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-        />
-      );
-    }
-  `,
-		`
-    /* TODO: (from codemod) This file uses the @atlaskit/calendar \`innerProps\` which
-    has now been removed due to its poor performance characteristics. Codemod
-    has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-    Rest other properties if any inside innerProps will get auto-removed along with it,
-    & might have to be handled manually as per need. */
-    import React from 'react';
-    import AkCalendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return <AkCalendar />;
-    }
-  `,
-		'should also remove innerProps from some random default import name of Calendar (eg: AkCalendar) and leave a TODO comment',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-        defaultDisabled={['2020-12-04']}
-        defaultPreviouslySelected={['2020-12-06']}
-        defaultSelected={['2020-12-08']}
-          innerProps={{
-            style: {
-              border: '1px solid red',
-              display: 'inline-block',
-            },
-          }}
-        />
-      );
-    }
-  `,
-		`
-    /* TODO: (from codemod) This file uses the @atlaskit/calendar \`innerProps\` which
-    has now been removed due to its poor performance characteristics. Codemod
-    has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-    Rest other properties if any inside innerProps will get auto-removed along with it,
-    & might have to be handled manually as per need. */
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-          defaultDisabled={['2020-12-04']}
-          defaultPreviouslySelected={['2020-12-06']}
-          defaultSelected={['2020-12-08']} />
-      );
-    }
-  `,
-		'should remove innerProps from Calendar, leave a TODO comment & just keep other props intact',
-	);
-
-	defineInlineTest(
-		{ default: transformer, parser: 'tsx' },
-		{},
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-        defaultDisabled={['2020-12-04']}
-        defaultPreviouslySelected={['2020-12-06']}
-        defaultSelected={['2020-12-08']}
-        />
-      );
-    }
-  `,
-		`
-    import React from 'react';
-    import Calendar from '@atlaskit/calendar';
-
-    const SimpleCalendar = () => {
-      return (
-        <Calendar
-        defaultDisabled={['2020-12-04']}
-        defaultPreviouslySelected={['2020-12-06']}
-        defaultSelected={['2020-12-08']}
-        />
-      );
-    }
-  `,
-		'should not remove & leave a TODO comment when innerProps is itself not present',
-	);
-});

package/codemods/migrations/flatten-certain-inner-props-as-prop.tsx

@@ -1,11 +0,0 @@
-import { flattenCertainChildPropsAsProp } from '../utils';
-
-const component = '@atlaskit/calendar';
-const prop = 'innerProps';
-const childProps = ['style', 'className'];
-
-export const flattenCertainInnerPropsAsProp = flattenCertainChildPropsAsProp(
-	component,
-	prop,
-	childProps,
-);

package/codemods/migrations/remove-inner-props.tsx

@@ -1,11 +0,0 @@
-import { createRemoveFuncFor } from '../utils';
-
-const component = '@atlaskit/calendar';
-const prop = 'innerProps';
-const comment = `This file uses the @atlaskit/calendar \`innerProps\` which
-has now been removed due to its poor performance characteristics. Codemod
-has auto flattened 'className' & 'style' properties inside it if present as a standalone props to calendar.
-Rest other properties if any inside innerProps will get auto-removed along with it,
-& might have to be handled manually as per need.`;
-
-export const removeInnerProps = createRemoveFuncFor(component, prop, comment);

package/codemods/utils.tsx

@@ -1,192 +0,0 @@
-import type {
-	API,
-	ASTPath,
-	default as core,
-	FileInfo,
-	ImportDeclaration,
-	ImportSpecifier,
-	JSXAttribute,
-	ObjectExpression,
-	Options,
-	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 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 flattenCertainChildPropsAsProp =
-	(component: string, propName: string, childProps: string[]) =>
-	(j: core.JSCodeshift, source: Collection<Node>) => {
-		const defaultSpecifier = getDefaultSpecifier(j, source, component);
-		if (!defaultSpecifier) {
-			return;
-		}
-		source.findJSXElements(defaultSpecifier).forEach((element) => {
-			getJSXAttributesByName(j, element, propName).forEach((attribute) => {
-				j(attribute)
-					.find(j.JSXExpressionContainer)
-					.find(j.ObjectExpression)
-					.forEach((objectExpression) => {
-						objectExpression.node.properties.forEach((property) => {
-							childProps.forEach((childProp) => {
-								if (
-									property.type === 'ObjectProperty' &&
-									property.key.type === 'Identifier' &&
-									property.key.name === childProp &&
-									element.node.openingElement.attributes
-								) {
-									element.node.openingElement.attributes.push(
-										j.jsxAttribute(
-											j.jsxIdentifier(childProp),
-											j.jsxExpressionContainer(property.value as ObjectExpression),
-										),
-									);
-								}
-							});
-						});
-					});
-			});
-		});
-	};
-
-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' });
-	};