@atlaskit/page-header 10.3.0 → 10.3.2
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 +12 -0
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/version.json +1 -1
- package/dist/esm/version.json +1 -1
- package/dist/types-ts4.0/PageHeader/index.d.ts +47 -0
- package/dist/types-ts4.0/PageHeader/styled.d.ts +54 -0
- package/dist/types-ts4.0/index.d.ts +1 -0
- package/package.json +13 -4
- package/report.api.md +4 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/page-header
|
|
2
2
|
|
|
3
|
+
## 10.3.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`9827dcb82b8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9827dcb82b8) - No-op change to introduce spacing tokens to design system components.
|
|
8
|
+
|
|
9
|
+
## 10.3.1
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
|
|
14
|
+
|
|
3
15
|
## 10.3.0
|
|
4
16
|
|
|
5
17
|
### Minor Changes
|
package/dist/cjs/version.json
CHANGED
package/dist/es2019/version.json
CHANGED
package/dist/esm/version.json
CHANGED
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { ReactElement, ReactNode } from 'react';
|
|
2
|
+
export declare type PageHeaderProps = {
|
|
3
|
+
/**
|
|
4
|
+
* Contents of the action bar to be rendered next to the page title.
|
|
5
|
+
*/
|
|
6
|
+
actions?: ReactElement;
|
|
7
|
+
/**
|
|
8
|
+
* Contents of the action bar to be rendered next to the page title. Typically a button group.
|
|
9
|
+
*/
|
|
10
|
+
bottomBar?: ReactElement;
|
|
11
|
+
/**
|
|
12
|
+
* Page breadcrumbs to be rendered above the title.
|
|
13
|
+
*/
|
|
14
|
+
breadcrumbs?: ReactElement;
|
|
15
|
+
/**
|
|
16
|
+
* Contents of the bottom bar to be rendered below the page title. Typically contains a search bar and/or filters.
|
|
17
|
+
*/
|
|
18
|
+
children?: ReactNode;
|
|
19
|
+
/**
|
|
20
|
+
* Content of the page title. The text wraps by default.
|
|
21
|
+
*/
|
|
22
|
+
disableTitleStyles?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Returns the inner ref to the DOM element of the title. This is exposed so the focus can be set.
|
|
25
|
+
*/
|
|
26
|
+
innerRef?: (element: HTMLElement) => void;
|
|
27
|
+
/**
|
|
28
|
+
* Prevent the title from wrapping across lines. This should be avoided.
|
|
29
|
+
*/
|
|
30
|
+
truncateTitle?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Used as id of inner h1 tag. This is exposed so the header text can be used as label of other element by aria-labeledby
|
|
33
|
+
*/
|
|
34
|
+
id?: string;
|
|
35
|
+
};
|
|
36
|
+
/**
|
|
37
|
+
* __Page header__
|
|
38
|
+
*
|
|
39
|
+
* A page header defines the top of a page. It contains a title and can be optionally combined with
|
|
40
|
+
* breadcrumbs buttons, search, and filters.
|
|
41
|
+
*
|
|
42
|
+
* - [Examples](https://atlassian.design/components/page-header/examples)
|
|
43
|
+
* - [Code](https://atlassian.design/components/page-header/code)
|
|
44
|
+
* - [Usage](https://atlassian.design/components/page-header/usage)
|
|
45
|
+
*/
|
|
46
|
+
declare const PageHeader: ({ innerRef, breadcrumbs, actions, bottomBar, children, id, disableTitleStyles, truncateTitle, }: PageHeaderProps) => JSX.Element;
|
|
47
|
+
export default PageHeader;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/** @jsx jsx */
|
|
2
|
+
import React from 'react';
|
|
3
|
+
/**
|
|
4
|
+
* __Outer wrapper__
|
|
5
|
+
*
|
|
6
|
+
* An outer wrapper that is the outermost component of the PageHeader component. It wraps around the PageHeader, its Actions,
|
|
7
|
+
* the BottomBar and its Breadcrumbs.
|
|
8
|
+
*
|
|
9
|
+
*/
|
|
10
|
+
export declare const OuterWrapper: React.FC<React.ReactNode>;
|
|
11
|
+
interface StyledTitleWrapperProps {
|
|
12
|
+
children?: React.ReactNode;
|
|
13
|
+
id?: string;
|
|
14
|
+
truncateTitle?: boolean;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* __Styled title wrapper__
|
|
18
|
+
*
|
|
19
|
+
* A styled title wrapper is a wrapper around the title that controls its the styles exclusively.
|
|
20
|
+
*
|
|
21
|
+
*/
|
|
22
|
+
export declare const StyledTitleWrapper: React.ForwardRefExoticComponent<StyledTitleWrapperProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
23
|
+
interface TitleProps {
|
|
24
|
+
truncateTitle?: boolean;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* __Title wrapper__
|
|
28
|
+
*
|
|
29
|
+
* A title wrapper is a wrapper around the title and the actions.
|
|
30
|
+
*
|
|
31
|
+
*/
|
|
32
|
+
export declare const TitleWrapper: React.FC<TitleProps>;
|
|
33
|
+
/**
|
|
34
|
+
* Title container
|
|
35
|
+
*
|
|
36
|
+
* A title container is a container that wraps around the title and its styles (if applied).
|
|
37
|
+
*
|
|
38
|
+
*/
|
|
39
|
+
export declare const TitleContainer: React.FC<TitleProps>;
|
|
40
|
+
/**
|
|
41
|
+
* __Actions wrapper__
|
|
42
|
+
*
|
|
43
|
+
* An actions wrapper is a wrapper for the actions, which appear on the top right of the PageHeader component.
|
|
44
|
+
*
|
|
45
|
+
*/
|
|
46
|
+
export declare const ActionsWrapper: React.FC;
|
|
47
|
+
/**
|
|
48
|
+
* __Bottom bar wrapper__
|
|
49
|
+
*
|
|
50
|
+
* A bottom bar wrapper is a wrapper for the bottom bar, which appears at the bottom of the PageHeader component.
|
|
51
|
+
*
|
|
52
|
+
*/
|
|
53
|
+
export declare const BottomBarWrapper: React.FC;
|
|
54
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './PageHeader';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/page-header",
|
|
3
|
-
"version": "10.3.
|
|
3
|
+
"version": "10.3.2",
|
|
4
4
|
"description": "A page header defines the top of a page. It contains a title and can be optionally combined with breadcrumbs buttons, search, and filters.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -12,10 +12,19 @@
|
|
|
12
12
|
"module": "dist/esm/index.js",
|
|
13
13
|
"module:es2019": "dist/es2019/index.js",
|
|
14
14
|
"types": "dist/types/index.d.ts",
|
|
15
|
+
"typesVersions": {
|
|
16
|
+
">=4.0 <4.5": {
|
|
17
|
+
"*": [
|
|
18
|
+
"dist/types-ts4.0/*",
|
|
19
|
+
"dist/types-ts4.0/index.d.ts"
|
|
20
|
+
]
|
|
21
|
+
}
|
|
22
|
+
},
|
|
15
23
|
"sideEffects": false,
|
|
16
24
|
"atlaskit:src": "src/index.tsx",
|
|
17
25
|
"homepage": "https://atlassian.design/components/page-header",
|
|
18
26
|
"atlassian": {
|
|
27
|
+
"disableProductCI": true,
|
|
19
28
|
"team": "Design System Team",
|
|
20
29
|
"releaseModel": "scheduled",
|
|
21
30
|
"website": {
|
|
@@ -39,16 +48,16 @@
|
|
|
39
48
|
"@atlaskit/ds-lib": "^2.0.1",
|
|
40
49
|
"@atlaskit/inline-edit": "^12.2.0",
|
|
41
50
|
"@atlaskit/page": "^12.2.0",
|
|
42
|
-
"@atlaskit/section-message": "^6.
|
|
51
|
+
"@atlaskit/section-message": "^6.3.0",
|
|
43
52
|
"@atlaskit/select": "^15.7.0",
|
|
44
53
|
"@atlaskit/ssr": "*",
|
|
45
|
-
"@atlaskit/textfield": "^5.
|
|
54
|
+
"@atlaskit/textfield": "^5.3.0",
|
|
46
55
|
"@atlaskit/visual-regression": "*",
|
|
47
56
|
"@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
|
|
48
57
|
"enzyme": "^3.10.0",
|
|
49
58
|
"react-dom": "^16.8.0",
|
|
50
59
|
"react-test-renderer": "^16.8.0",
|
|
51
|
-
"typescript": "4.
|
|
60
|
+
"typescript": "4.5.5"
|
|
52
61
|
},
|
|
53
62
|
"keywords": [
|
|
54
63
|
"atlaskit",
|
package/report.api.md
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
## API Report File for "@atlaskit/page-header"
|
|
1
|
+
## API Report File for "@atlaskit/page-header".
|
|
2
2
|
|
|
3
|
-
> Do not edit this file.
|
|
3
|
+
> Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
|
|
4
|
+
|
|
5
|
+
[Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
|
|
4
6
|
|
|
5
7
|
```ts
|
|
6
8
|
import { ReactElement } from 'react';
|