@atlaskit/pagination 15.0.2 → 15.1.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/pagination
 
+## 15.1.0
+
+### Minor Changes
+
+- [#109060](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109060)
+  [`4660ec858a305`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4660ec858a305) -
+  Update `React` from v16 to v18
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 15.0.2
 
 ### Patch Changes

package/dist/cjs/internal/components/render-ellipsis.js

@@ -1,4 +1,4 @@
-/* render-ellipsis.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* render-ellipsis.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/pagination.compiled.css

@@ -1,4 +1,10 @@
-._18s8ze3t{margin:var(--ds-space-0,0)}
-._1yt4ze3t{padding:var(--ds-space-0,0)}
-._18zr12x7{padding-inline:var(--ds-space-075,6px)}
-._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
+
+._18zr12x7{padding-inline:var(--ds-space-075,6px)}._18u0ze3t{margin-left:var(--ds-space-0,0)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._19pkze3t{margin-top:var(--ds-space-0,0)}
+._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
+._2hwxze3t{margin-right:var(--ds-space-0,0)}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._otyrze3t{margin-bottom:var(--ds-space-0,0)}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}

package/dist/cjs/pagination.js

@@ -1,4 +1,4 @@
-/* pagination.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* pagination.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -28,14 +28,14 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var styles = {
-  paginationMenu: "_1yt4ze3t _18s8ze3t",
+  paginationMenu: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _19pkze3t _2hwxze3t _otyrze3t _18u0ze3t",
   paginationMenuItem: "_1pfhze3t",
   navigatorIconWrapper: "_18zr12x7"
 };
 var analyticsAttributes = {
   componentName: 'pagination',
   packageName: "@atlaskit/pagination",
-  packageVersion: "15.0.2"
+  packageVersion: "15.1.0"
 };
 function NavigatorIcon(_ref) {
   var chevronDirection = _ref.chevronDirection;

package/dist/es2019/internal/components/render-ellipsis.js

@@ -1,4 +1,4 @@
-/* render-ellipsis.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* render-ellipsis.tsx generated by @compiled/babel-plugin v0.36.0 */
 import "./render-ellipsis.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';

package/dist/es2019/pagination.compiled.css

@@ -1,4 +1,10 @@
-._18s8ze3t{margin:var(--ds-space-0,0)}
-._1yt4ze3t{padding:var(--ds-space-0,0)}
-._18zr12x7{padding-inline:var(--ds-space-075,6px)}
-._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
+
+._18zr12x7{padding-inline:var(--ds-space-075,6px)}._18u0ze3t{margin-left:var(--ds-space-0,0)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._19pkze3t{margin-top:var(--ds-space-0,0)}
+._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
+._2hwxze3t{margin-right:var(--ds-space-0,0)}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._otyrze3t{margin-bottom:var(--ds-space-0,0)}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}

package/dist/es2019/pagination.js

@@ -1,4 +1,4 @@
-/* pagination.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* pagination.tsx generated by @compiled/babel-plugin v0.36.0 */
 import "./pagination.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef, memo } from 'react';
@@ -14,14 +14,14 @@ import renderDefaultEllipsis from './internal/components/render-ellipsis';
 import { emptyObject } from './internal/constants';
 import collapseRange from './internal/utils/collapse-range';
 const styles = {
-  paginationMenu: "_1yt4ze3t _18s8ze3t",
+  paginationMenu: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _19pkze3t _2hwxze3t _otyrze3t _18u0ze3t",
   paginationMenuItem: "_1pfhze3t",
   navigatorIconWrapper: "_18zr12x7"
 };
 const analyticsAttributes = {
   componentName: 'pagination',
   packageName: "@atlaskit/pagination",
-  packageVersion: "15.0.2"
+  packageVersion: "15.1.0"
 };
 function NavigatorIcon({
   chevronDirection

package/dist/esm/internal/components/render-ellipsis.js

@@ -1,4 +1,4 @@
-/* render-ellipsis.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* render-ellipsis.tsx generated by @compiled/babel-plugin v0.36.0 */
 import "./render-ellipsis.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';

package/dist/esm/pagination.compiled.css

@@ -1,4 +1,10 @@
-._18s8ze3t{margin:var(--ds-space-0,0)}
-._1yt4ze3t{padding:var(--ds-space-0,0)}
-._18zr12x7{padding-inline:var(--ds-space-075,6px)}
-._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
+
+._18zr12x7{padding-inline:var(--ds-space-075,6px)}._18u0ze3t{margin-left:var(--ds-space-0,0)}
+._19bvze3t{padding-left:var(--ds-space-0,0)}
+._19pkze3t{margin-top:var(--ds-space-0,0)}
+._1pfhze3t{margin-block-start:var(--ds-space-0,0)}
+._2hwxze3t{margin-right:var(--ds-space-0,0)}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._otyrze3t{margin-bottom:var(--ds-space-0,0)}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}

package/dist/esm/pagination.js

@@ -1,4 +1,4 @@
-/* pagination.tsx generated by @compiled/babel-plugin v0.35.0 */
+/* pagination.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./pagination.compiled.css";
@@ -18,14 +18,14 @@ import renderDefaultEllipsis from './internal/components/render-ellipsis';
 import { emptyObject } from './internal/constants';
 import collapseRange from './internal/utils/collapse-range';
 var styles = {
-  paginationMenu: "_1yt4ze3t _18s8ze3t",
+  paginationMenu: "_ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _19pkze3t _2hwxze3t _otyrze3t _18u0ze3t",
   paginationMenuItem: "_1pfhze3t",
   navigatorIconWrapper: "_18zr12x7"
 };
 var analyticsAttributes = {
   componentName: 'pagination',
   packageName: "@atlaskit/pagination",
-  packageVersion: "15.0.2"
+  packageVersion: "15.1.0"
 };
 function NavigatorIcon(_ref) {
   var chevronDirection = _ref.chevronDirection;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/pagination",
-	"version": "15.0.2",
+	"version": "15.1.0",
 	"description": "Pagination allows you to divide large amounts of content into smaller chunks across multiple pages.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -38,15 +38,15 @@
 		}
 	},
 	"dependencies": {
-		"@atlaskit/analytics-next": "^10.2.0",
-		"@atlaskit/button": "^20.3.0",
+		"@atlaskit/analytics-next": "^10.3.0",
+		"@atlaskit/button": "^20.4.0",
 		"@atlaskit/codemod-utils": "^4.2.0",
-		"@atlaskit/css": "^0.7.0",
-		"@atlaskit/ds-lib": "^3.3.0",
-		"@atlaskit/icon": "^23.4.0",
-		"@atlaskit/primitives": "^13.3.0",
-		"@atlaskit/tokens": "^3.1.0",
-		"@atlaskit/visually-hidden": "^1.5.0",
+		"@atlaskit/css": "^0.8.0",
+		"@atlaskit/ds-lib": "^3.5.0",
+		"@atlaskit/icon": "^23.5.0",
+		"@atlaskit/primitives": "^13.4.0",
+		"@atlaskit/tokens": "^3.3.0",
+		"@atlaskit/visually-hidden": "^1.6.0",
 		"@babel/runtime": "^7.0.0",
 		"memoize-one": "^6.0.0"
 	},
@@ -60,10 +60,10 @@
 		"@atlaskit/ssr": "*",
 		"@atlaskit/visual-regression": "*",
 		"@testing-library/dom": "^10.1.0",
-		"@testing-library/react": "^12.1.5",
+		"@testing-library/react": "^13.4.0",
 		"exenv": "^1.2.2",
 		"jscodeshift": "^0.13.0",
-		"react-dom": "^16.8.0",
+		"react-dom": "^18.2.0",
 		"storybook-addon-performance": "^0.17.3",
 		"tiny-invariant": "^1.2.0",
 		"typescript": "~5.4.2"

package/__perf__/default.tsx

@@ -1,5 +0,0 @@
-import React from 'react';
-
-import Pagination from '../src';
-
-export default () => <Pagination pages={[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]} />;

package/__perf__/examples.tsx

@@ -1,61 +0,0 @@
-import React from 'react';
-
-import { findByText, fireEvent } from '@testing-library/dom';
-import { type InteractionTaskArgs, type PublicInteractionTask } from 'storybook-addon-performance';
-import invariant from 'tiny-invariant';
-
-import Pagination from '../src';
-
-const getPageElement = (
-	container: HTMLElement,
-	textContent: string,
-): HTMLButtonElement | undefined =>
-	Array.from(container.querySelectorAll('button')).find(
-		(buttonElement: HTMLButtonElement) => buttonElement.textContent?.trim() === textContent,
-	);
-
-const PaginationPerformance = () => {
-	return <Pagination pages={[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]} />;
-};
-
-const interactionTasks: PublicInteractionTask[] = [
-	{
-		name: 'onChange (when ellipsis changes)',
-		description: 'Render pagination and change page along with ellipsis',
-		run: async ({ container, controls }: InteractionTaskArgs): Promise<void> => {
-			const lastPageElement = getPageElement(container, '10');
-
-			invariant(lastPageElement);
-
-			await controls.time(async () => {
-				fireEvent.click(lastPageElement!);
-
-				await findByText(container, '9', undefined, { timeout: 20000 });
-			});
-		},
-	},
-	{
-		name: `onChange (when ellipsis don't change)`,
-		description: 'Render pagination and change page',
-		run: async ({ container, controls }: InteractionTaskArgs): Promise<void> => {
-			const secondPageElement = getPageElement(container, '2');
-
-			invariant(secondPageElement);
-
-			await controls.time(async () => {
-				fireEvent.click(secondPageElement!);
-			});
-		},
-	},
-];
-
-PaginationPerformance.story = {
-	name: 'pagination',
-	parameters: {
-		performance: {
-			interactions: interactionTasks,
-		},
-	},
-};
-
-export default PaginationPerformance;

package/__perf__/pagination-with-large-no-of-pages.tsx

@@ -1,61 +0,0 @@
-import React from 'react';
-
-import { findByText, fireEvent } from '@testing-library/dom';
-import { type InteractionTaskArgs, type PublicInteractionTask } from 'storybook-addon-performance';
-import invariant from 'tiny-invariant';
-
-import Pagination from '../src';
-
-const getPageElement = (
-	container: HTMLElement,
-	textContent: string,
-): HTMLButtonElement | undefined =>
-	Array.from(container.querySelectorAll('button')).find(
-		(buttonElement: HTMLButtonElement) => buttonElement.textContent?.trim() === textContent,
-	);
-const pages1000 = new Array(1000).fill(0).map((p, index) => index + 1 + p);
-const PaginationPerformanceWith1000Pages = () => {
-	return <Pagination pages={pages1000} />;
-};
-
-const interactionTasks: PublicInteractionTask[] = [
-	{
-		name: 'onChange (when ellipsis changes)',
-		description: 'Render pagination and change page along with ellipsis',
-		run: async ({ container, controls }: InteractionTaskArgs): Promise<void> => {
-			const lastPageElement = getPageElement(container, '1000');
-
-			invariant(lastPageElement);
-
-			await controls.time(async () => {
-				fireEvent.click(lastPageElement!);
-
-				await findByText(container, '999', undefined, { timeout: 20000 });
-			});
-		},
-	},
-	{
-		name: `onChange (when ellipsis don't change)`,
-		description: 'Render pagination and change page',
-		run: async ({ container, controls }: InteractionTaskArgs): Promise<void> => {
-			const secondPageElement = getPageElement(container, '2');
-
-			invariant(secondPageElement);
-
-			await controls.time(async () => {
-				fireEvent.click(secondPageElement!);
-			});
-		},
-	},
-];
-
-PaginationPerformanceWith1000Pages.story = {
-	name: 'paginationWithLargeNumberOfPages',
-	parameters: {
-		performance: {
-			interactions: interactionTasks,
-		},
-	},
-};
-
-export default PaginationPerformanceWith1000Pages;