@atlaskit/pagination 14.2.2 → 14.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/codemods/migrations/rename-pagination-prop-types.tsx +6 -5
- package/dist/cjs/pagination.js +1 -1
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/pagination.js +1 -1
- package/dist/es2019/version.json +1 -1
- package/dist/esm/pagination.js +1 -1
- package/dist/esm/version.json +1 -1
- package/package.json +3 -11
- package/report.api.md +18 -62
- package/dist/types-ts4.0/entry-points/types.d.ts +0 -1
- package/dist/types-ts4.0/index.d.ts +0 -2
- package/dist/types-ts4.0/internal/components/navigator.d.ts +0 -22
- package/dist/types-ts4.0/internal/components/page.d.ts +0 -17
- package/dist/types-ts4.0/internal/components/render-ellipsis.d.ts +0 -6
- package/dist/types-ts4.0/internal/constants.d.ts +0 -1
- package/dist/types-ts4.0/internal/utils/collapse-range.d.ts +0 -9
- package/dist/types-ts4.0/pagination.d.ts +0 -6
- package/dist/types-ts4.0/types.d.ts +0 -75
package/CHANGELOG.md
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { renameNamedImportWithAliasName } from '@atlaskit/codemod-utils';
|
|
2
2
|
|
|
3
|
-
export const renamePaginationPropTypeToPaginationProps =
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
export const renamePaginationPropTypeToPaginationProps =
|
|
4
|
+
renameNamedImportWithAliasName(
|
|
5
|
+
'@atlaskit/pagination',
|
|
6
|
+
'PaginationPropTypes',
|
|
7
|
+
'PaginationProps',
|
|
8
|
+
);
|
package/dist/cjs/pagination.js
CHANGED
|
@@ -42,7 +42,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
42
42
|
var analyticsAttributes = {
|
|
43
43
|
componentName: 'pagination',
|
|
44
44
|
packageName: "@atlaskit/pagination",
|
|
45
|
-
packageVersion: "14.2.
|
|
45
|
+
packageVersion: "14.2.3"
|
|
46
46
|
};
|
|
47
47
|
var navStyles = (0, _react2.css)({
|
|
48
48
|
display: 'flex'
|
package/dist/cjs/version.json
CHANGED
|
@@ -14,7 +14,7 @@ import collapseRange from './internal/utils/collapse-range';
|
|
|
14
14
|
const analyticsAttributes = {
|
|
15
15
|
componentName: 'pagination',
|
|
16
16
|
packageName: "@atlaskit/pagination",
|
|
17
|
-
packageVersion: "14.2.
|
|
17
|
+
packageVersion: "14.2.3"
|
|
18
18
|
};
|
|
19
19
|
const navStyles = css({
|
|
20
20
|
display: 'flex'
|
package/dist/es2019/version.json
CHANGED
package/dist/esm/pagination.js
CHANGED
|
@@ -21,7 +21,7 @@ import collapseRange from './internal/utils/collapse-range';
|
|
|
21
21
|
var analyticsAttributes = {
|
|
22
22
|
componentName: 'pagination',
|
|
23
23
|
packageName: "@atlaskit/pagination",
|
|
24
|
-
packageVersion: "14.2.
|
|
24
|
+
packageVersion: "14.2.3"
|
|
25
25
|
};
|
|
26
26
|
var navStyles = css({
|
|
27
27
|
display: 'flex'
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/pagination",
|
|
3
|
-
"version": "14.2.
|
|
3
|
+
"version": "14.2.3",
|
|
4
4
|
"description": "Pagination allows you to divide large amounts of content into smaller chunks across multiple pages.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -13,14 +13,6 @@
|
|
|
13
13
|
"module": "dist/esm/index.js",
|
|
14
14
|
"module:es2019": "dist/es2019/index.js",
|
|
15
15
|
"types": "dist/types/index.d.ts",
|
|
16
|
-
"typesVersions": {
|
|
17
|
-
">=4.0 <4.5": {
|
|
18
|
-
"*": [
|
|
19
|
-
"dist/types-ts4.0/*",
|
|
20
|
-
"dist/types-ts4.0/index.d.ts"
|
|
21
|
-
]
|
|
22
|
-
}
|
|
23
|
-
},
|
|
24
16
|
"sideEffects": false,
|
|
25
17
|
"atlaskit:src": "src/index.tsx",
|
|
26
18
|
"af:exports": {
|
|
@@ -38,11 +30,11 @@
|
|
|
38
30
|
},
|
|
39
31
|
"dependencies": {
|
|
40
32
|
"@atlaskit/analytics-next": "^8.0.0",
|
|
41
|
-
"@atlaskit/button": "^16.
|
|
33
|
+
"@atlaskit/button": "^16.4.0",
|
|
42
34
|
"@atlaskit/codemod-utils": "^4.1.0",
|
|
43
35
|
"@atlaskit/ds-lib": "^2.1.0",
|
|
44
36
|
"@atlaskit/icon": "^21.11.0",
|
|
45
|
-
"@atlaskit/tokens": "^0.
|
|
37
|
+
"@atlaskit/tokens": "^0.11.0",
|
|
46
38
|
"@babel/runtime": "^7.0.0",
|
|
47
39
|
"@emotion/react": "^11.7.1",
|
|
48
40
|
"memoize-one": "^6.0.0"
|
package/report.api.md
CHANGED
|
@@ -1,6 +1,10 @@
|
|
|
1
|
-
## API Report File for "@atlaskit/pagination"
|
|
1
|
+
## API Report File for "@atlaskit/pagination"
|
|
2
2
|
|
|
3
|
-
> Do not edit this file.
|
|
3
|
+
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
|
|
4
|
+
|
|
5
|
+
<!--
|
|
6
|
+
Generated API Report version: 2.0
|
|
7
|
+
-->
|
|
4
8
|
|
|
5
9
|
[Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
|
|
6
10
|
|
|
@@ -13,10 +17,12 @@ import type { ReactElement } from 'react';
|
|
|
13
17
|
import type { SyntheticEvent } from 'react';
|
|
14
18
|
import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
15
19
|
|
|
16
|
-
|
|
20
|
+
// @public (undocumented)
|
|
21
|
+
const _default: typeof InnerPagination;
|
|
17
22
|
export default _default;
|
|
18
23
|
|
|
19
|
-
|
|
24
|
+
// @public (undocumented)
|
|
25
|
+
function InnerPagination<T>(
|
|
20
26
|
{
|
|
21
27
|
components,
|
|
22
28
|
defaultSelectedIndex,
|
|
@@ -36,81 +42,31 @@ declare function InnerPagination<T>(
|
|
|
36
42
|
ref: React.Ref<HTMLDivElement>,
|
|
37
43
|
): jsx.JSX.Element;
|
|
38
44
|
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
*/
|
|
45
|
+
// @public (undocumented)
|
|
46
|
+
export interface PaginationPropTypes<T = unknown> {
|
|
47
|
+
analyticsContext?: Record<string, any>;
|
|
43
48
|
components?: {
|
|
44
49
|
Page?: React.ElementType;
|
|
45
50
|
Previous?: React.ElementType;
|
|
46
51
|
Next?: React.ElementType;
|
|
47
52
|
};
|
|
48
|
-
/**
|
|
49
|
-
* Index of the page to be selected by default
|
|
50
|
-
*/
|
|
51
53
|
defaultSelectedIndex?: number;
|
|
52
|
-
/**
|
|
53
|
-
* Helper function to get text displayed on the page button. It is helpful in scenarios when page the page passed in is an object
|
|
54
|
-
*/
|
|
55
54
|
getPageLabel?: (page: T, pageIndex: number) => number | string;
|
|
56
|
-
/**
|
|
57
|
-
* The aria-label for the pagination wrapper
|
|
58
|
-
*/
|
|
59
55
|
label?: string;
|
|
60
|
-
/**
|
|
61
|
-
* The aria-label for the next button
|
|
62
|
-
*/
|
|
63
|
-
nextLabel?: string;
|
|
64
|
-
/**
|
|
65
|
-
* The aria-label for the previous button
|
|
66
|
-
*/
|
|
67
|
-
previousLabel?: string;
|
|
68
|
-
/**
|
|
69
|
-
* Style to spread on the container element
|
|
70
|
-
*/
|
|
71
|
-
style?: CSSProperties;
|
|
72
|
-
/**
|
|
73
|
-
* Maximum number of pages to be displayed in the pagination
|
|
74
|
-
*/
|
|
75
56
|
max?: number;
|
|
76
|
-
|
|
77
|
-
* The onChange handler which is called when the page is changed
|
|
78
|
-
*/
|
|
57
|
+
nextLabel?: string;
|
|
79
58
|
onChange?: (
|
|
80
59
|
event: SyntheticEvent,
|
|
81
60
|
page: T,
|
|
82
61
|
analyticsEvent?: UIAnalyticsEvent,
|
|
83
62
|
) => void;
|
|
84
|
-
/**
|
|
85
|
-
* Array of the pages to display
|
|
86
|
-
*/
|
|
87
63
|
pages: T[];
|
|
88
|
-
|
|
89
|
-
* Index of the selected page. This will make this pagination controlled
|
|
90
|
-
*/
|
|
91
|
-
selectedIndex?: number;
|
|
92
|
-
/**
|
|
93
|
-
* The react Node returned from the function is rendered instead of the default ellipsis node
|
|
94
|
-
*/
|
|
64
|
+
previousLabel?: string;
|
|
95
65
|
renderEllipsis?: (arg: { key: string }) => ReactElement;
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
*/
|
|
99
|
-
analyticsContext?: Record<string, any>;
|
|
100
|
-
/**
|
|
101
|
-
* A `testId` prop is provided for specified elements,
|
|
102
|
-
* which is a unique string that appears as a data attribute `data-testid`
|
|
103
|
-
* in the rendered code, serving as a hook for automated tests.
|
|
104
|
-
*
|
|
105
|
-
* Will set data-testid on these elements when defined:
|
|
106
|
-
* - Pagination nav wrapper - {testId}
|
|
107
|
-
* - Page - {testId}--page-{page index}
|
|
108
|
-
* - Current page - {testId}--current-page-{page index}
|
|
109
|
-
* - Left navigator - {testId}--left-navigator
|
|
110
|
-
* - Right navigator - {testId}--right-navigator
|
|
111
|
-
*/
|
|
66
|
+
selectedIndex?: number;
|
|
67
|
+
style?: CSSProperties;
|
|
112
68
|
testId?: string;
|
|
113
69
|
}
|
|
114
70
|
|
|
115
|
-
|
|
71
|
+
// (No @packageDocumentation comment for this package)
|
|
116
72
|
```
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export type { PaginationPropTypes } from '../types';
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
/** @jsx jsx */
|
|
2
|
-
import React, { ReactElement, SyntheticEvent } from 'react';
|
|
3
|
-
import { jsx } from '@emotion/react';
|
|
4
|
-
export declare type NavigatorProps<T> = {
|
|
5
|
-
/**
|
|
6
|
-
* This will be passed in as aria-label to button. This is what screen reader will read
|
|
7
|
-
*/
|
|
8
|
-
'aria-label'?: string;
|
|
9
|
-
/**
|
|
10
|
-
* Is the navigator disabled
|
|
11
|
-
*/
|
|
12
|
-
isDisabled?: boolean;
|
|
13
|
-
iconBefore: ReactElement;
|
|
14
|
-
pages: T[];
|
|
15
|
-
testId?: string;
|
|
16
|
-
/**
|
|
17
|
-
* This function is called with the when user clicks on navigator
|
|
18
|
-
*/
|
|
19
|
-
onClick?: (event: SyntheticEvent) => void;
|
|
20
|
-
component?: React.ElementType<any>;
|
|
21
|
-
};
|
|
22
|
-
export default function Navigator<T>(props: NavigatorProps<T>): jsx.JSX.Element;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ButtonProps } from '@atlaskit/button/standard-button';
|
|
3
|
-
import type { Appearance } from '@atlaskit/button/types';
|
|
4
|
-
declare type Diff<T, U> = T extends U ? never : T;
|
|
5
|
-
declare type PageProps = Diff<ButtonProps, {
|
|
6
|
-
appearance?: Appearance;
|
|
7
|
-
autoFocus: boolean;
|
|
8
|
-
isDisabled: boolean;
|
|
9
|
-
isLoading: boolean;
|
|
10
|
-
spacing: 'compact' | 'default' | 'none';
|
|
11
|
-
shouldFitContainer: boolean;
|
|
12
|
-
type: 'button' | 'submit';
|
|
13
|
-
}> & {
|
|
14
|
-
page?: any;
|
|
15
|
-
};
|
|
16
|
-
export default function Page(props: PageProps): JSX.Element;
|
|
17
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const emptyObject: {};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { ReactElement } from 'react';
|
|
2
|
-
declare const collapseRange: <T>(pages: T[], current: number, { max, ellipsis, transform, }: {
|
|
3
|
-
max: number;
|
|
4
|
-
ellipsis: (arg: {
|
|
5
|
-
key: string;
|
|
6
|
-
}) => ReactElement;
|
|
7
|
-
transform: (page: T, index: number, testId?: string | undefined) => ReactElement;
|
|
8
|
-
}, testId?: string | undefined) => ReactElement[];
|
|
9
|
-
export default collapseRange;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { jsx } from '@emotion/react';
|
|
3
|
-
import { PaginationPropTypes } from './types';
|
|
4
|
-
declare function InnerPagination<T>({ components, defaultSelectedIndex, selectedIndex, label, previousLabel, nextLabel, style, max, onChange, pages, getPageLabel, renderEllipsis, analyticsContext, testId, }: PaginationPropTypes<T>, ref: React.Ref<HTMLDivElement>): jsx.JSX.Element;
|
|
5
|
-
declare const _default: typeof InnerPagination;
|
|
6
|
-
export default _default;
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import type { CSSProperties, ReactElement, SyntheticEvent } from 'react';
|
|
2
|
-
import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
3
|
-
export interface PaginationPropTypes<T = unknown> {
|
|
4
|
-
/**
|
|
5
|
-
* Replace the built-in Page, Previous, Next and/ or Ellipsis component
|
|
6
|
-
*/
|
|
7
|
-
components?: {
|
|
8
|
-
Page?: React.ElementType;
|
|
9
|
-
Previous?: React.ElementType;
|
|
10
|
-
Next?: React.ElementType;
|
|
11
|
-
};
|
|
12
|
-
/**
|
|
13
|
-
* Index of the page to be selected by default
|
|
14
|
-
*/
|
|
15
|
-
defaultSelectedIndex?: number;
|
|
16
|
-
/**
|
|
17
|
-
* Helper function to get text displayed on the page button. It is helpful in scenarios when page the page passed in is an object
|
|
18
|
-
*/
|
|
19
|
-
getPageLabel?: (page: T, pageIndex: number) => number | string;
|
|
20
|
-
/**
|
|
21
|
-
* The aria-label for the pagination wrapper
|
|
22
|
-
*/
|
|
23
|
-
label?: string;
|
|
24
|
-
/**
|
|
25
|
-
* The aria-label for the next button
|
|
26
|
-
*/
|
|
27
|
-
nextLabel?: string;
|
|
28
|
-
/**
|
|
29
|
-
* The aria-label for the previous button
|
|
30
|
-
*/
|
|
31
|
-
previousLabel?: string;
|
|
32
|
-
/**
|
|
33
|
-
* Style to spread on the container element
|
|
34
|
-
*/
|
|
35
|
-
style?: CSSProperties;
|
|
36
|
-
/**
|
|
37
|
-
* Maximum number of pages to be displayed in the pagination
|
|
38
|
-
*/
|
|
39
|
-
max?: number;
|
|
40
|
-
/**
|
|
41
|
-
* The onChange handler which is called when the page is changed
|
|
42
|
-
*/
|
|
43
|
-
onChange?: (event: SyntheticEvent, page: T, analyticsEvent?: UIAnalyticsEvent) => void;
|
|
44
|
-
/**
|
|
45
|
-
* Array of the pages to display
|
|
46
|
-
*/
|
|
47
|
-
pages: T[];
|
|
48
|
-
/**
|
|
49
|
-
* Index of the selected page. This will make this pagination controlled
|
|
50
|
-
*/
|
|
51
|
-
selectedIndex?: number;
|
|
52
|
-
/**
|
|
53
|
-
* The react Node returned from the function is rendered instead of the default ellipsis node
|
|
54
|
-
*/
|
|
55
|
-
renderEllipsis?: (arg: {
|
|
56
|
-
key: string;
|
|
57
|
-
}) => ReactElement;
|
|
58
|
-
/**
|
|
59
|
-
* Additional information to be included in the `context` of analytics events
|
|
60
|
-
*/
|
|
61
|
-
analyticsContext?: Record<string, any>;
|
|
62
|
-
/**
|
|
63
|
-
* A `testId` prop is provided for specified elements,
|
|
64
|
-
* which is a unique string that appears as a data attribute `data-testid`
|
|
65
|
-
* in the rendered code, serving as a hook for automated tests.
|
|
66
|
-
*
|
|
67
|
-
* Will set data-testid on these elements when defined:
|
|
68
|
-
* - Pagination nav wrapper - {testId}
|
|
69
|
-
* - Page - {testId}--page-{page index}
|
|
70
|
-
* - Current page - {testId}--current-page-{page index}
|
|
71
|
-
* - Left navigator - {testId}--left-navigator
|
|
72
|
-
* - Right navigator - {testId}--right-navigator
|
|
73
|
-
*/
|
|
74
|
-
testId?: string;
|
|
75
|
-
}
|