@atlaskit/page-header 11.0.0 → 11.0.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 CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/page-header
2
2
 
3
+ ## 11.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`84c480f78de1e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/84c480f78de1e) -
8
+ Remove unncessary styling code that breaks in Parcel CSS transformation.
9
+
10
+ ## 11.0.1
11
+
12
+ ### Patch Changes
13
+
14
+ - [#169469](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/169469)
15
+ [`e9a8deefa644a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e9a8deefa644a) -
16
+ Updated types for PageHeader
17
+ - [#169469](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/169469)
18
+ [`9b8b32b12ca1e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9b8b32b12ca1e) -
19
+ Added optional test id to page header
20
+
3
21
  ## 11.0.0
4
22
 
5
23
  ### Major Changes
@@ -32,7 +32,8 @@ var PageHeader = function PageHeader(_ref) {
32
32
  _ref$disableTitleStyl = _ref.disableTitleStyles,
33
33
  disableTitleStyles = _ref$disableTitleStyl === void 0 ? false : _ref$disableTitleStyl,
34
34
  _ref$truncateTitle = _ref.truncateTitle,
35
- truncateTitle = _ref$truncateTitle === void 0 ? false : _ref$truncateTitle;
35
+ truncateTitle = _ref$truncateTitle === void 0 ? false : _ref$truncateTitle,
36
+ testId = _ref.testId;
36
37
  return /*#__PURE__*/_react.default.createElement(_styled.OuterWrapper, null, breadcrumbs, /*#__PURE__*/_react.default.createElement(_styled.TitleWrapper, {
37
38
  truncateTitle: truncateTitle
38
39
  }, /*#__PURE__*/_react.default.createElement(_styled.TitleContainer, {
@@ -40,7 +41,8 @@ var PageHeader = function PageHeader(_ref) {
40
41
  }, disableTitleStyles ? children : /*#__PURE__*/_react.default.createElement(_styled.StyledTitleWrapper, {
41
42
  ref: innerRef,
42
43
  truncateTitle: truncateTitle,
43
- id: id
44
+ id: id,
45
+ testId: testId
44
46
  }, children)), actions && /*#__PURE__*/_react.default.createElement(_styled.ActionsWrapper, null, actions)), bottomBar && /*#__PURE__*/_react.default.createElement(_styled.BottomBarWrapper, null, " ", bottomBar, " "));
45
47
  };
46
48
  var _default = exports.default = PageHeader;
@@ -12,7 +12,6 @@
12
12
  ._1n261q9c{flex-wrap:nowrap}
13
13
  ._1o9zidpf{flex-shrink:0}
14
14
  ._1o9zkb7n{flex-shrink:1}
15
- ._1oblusic >{text-align:right}
16
15
  ._1pfhidpf{margin-block-start:0}
17
16
  ._1pfhpxbi{margin-block-start:var(--ds-space-200,1pc)}
18
17
  ._1qu2glyw{outline-style:none}
@@ -52,11 +52,13 @@ var OuterWrapper = exports.OuterWrapper = function OuterWrapper(_ref) {
52
52
  var StyledTitleWrapper = exports.StyledTitleWrapper = /*#__PURE__*/_react.default.forwardRef(function (_ref2, ref) {
53
53
  var children = _ref2.children,
54
54
  id = _ref2.id,
55
- truncateTitle = _ref2.truncateTitle;
55
+ truncateTitle = _ref2.truncateTitle,
56
+ testId = _ref2.testId;
56
57
  return /*#__PURE__*/_react.default.createElement("h1", {
57
58
  ref: ref,
58
59
  tabIndex: -1,
59
60
  id: id,
61
+ "data-testid": testId && "".concat(testId, "--title"),
60
62
  className: (0, _runtime.ax)(["_syaz1fxt _11c81p5s _1dyz4jg8 _1pfhidpf _12ji1r31 _1qu2glyw _12y31o36", truncateTitle && "_1reo15vq _18m915vq _1bto1l2s _o5721q9c"])
61
63
  }, children);
62
64
  });
@@ -97,7 +99,7 @@ var TitleContainer = exports.TitleContainer = function TitleContainer(_ref4) {
97
99
  var ActionsWrapper = exports.ActionsWrapper = function ActionsWrapper(_ref5) {
98
100
  var children = _ref5.children;
99
101
  return /*#__PURE__*/_react.default.createElement("div", {
100
- className: (0, _runtime.ax)(["_p12f1osq _16jlidpf _1o9zidpf _i0dl1wug _6rthu2gc _ahbq1wug _bozgxy5q _o5721q9c _1oblusic"])
102
+ className: (0, _runtime.ax)(["_p12f1osq _16jlidpf _1o9zidpf _i0dl1wug _6rthu2gc _ahbq1wug _bozgxy5q _o5721q9c"])
101
103
  }, children);
102
104
  };
103
105
 
@@ -22,7 +22,8 @@ const PageHeader = ({
22
22
  children,
23
23
  id,
24
24
  disableTitleStyles = false,
25
- truncateTitle = false
25
+ truncateTitle = false,
26
+ testId
26
27
  }) => {
27
28
  return /*#__PURE__*/React.createElement(OuterWrapper, null, breadcrumbs, /*#__PURE__*/React.createElement(TitleWrapper, {
28
29
  truncateTitle: truncateTitle
@@ -31,7 +32,8 @@ const PageHeader = ({
31
32
  }, disableTitleStyles ? children : /*#__PURE__*/React.createElement(StyledTitleWrapper, {
32
33
  ref: innerRef,
33
34
  truncateTitle: truncateTitle,
34
- id: id
35
+ id: id,
36
+ testId: testId
35
37
  }, children)), actions && /*#__PURE__*/React.createElement(ActionsWrapper, null, actions)), bottomBar && /*#__PURE__*/React.createElement(BottomBarWrapper, null, " ", bottomBar, " "));
36
38
  };
37
39
  export default PageHeader;
@@ -12,7 +12,6 @@
12
12
  ._1n261q9c{flex-wrap:nowrap}
13
13
  ._1o9zidpf{flex-shrink:0}
14
14
  ._1o9zkb7n{flex-shrink:1}
15
- ._1oblusic >{text-align:right}
16
15
  ._1pfhidpf{margin-block-start:0}
17
16
  ._1pfhpxbi{margin-block-start:var(--ds-space-200,1pc)}
18
17
  ._1qu2glyw{outline-style:none}
@@ -43,12 +43,14 @@ export const OuterWrapper = ({
43
43
  export const StyledTitleWrapper = /*#__PURE__*/React.forwardRef(({
44
44
  children,
45
45
  id,
46
- truncateTitle
46
+ truncateTitle,
47
+ testId
47
48
  }, ref) => {
48
49
  return /*#__PURE__*/React.createElement("h1", {
49
50
  ref: ref,
50
51
  tabIndex: -1,
51
52
  id: id,
53
+ "data-testid": testId && `${testId}--title`,
52
54
  className: ax(["_syaz1fxt _11c81p5s _1dyz4jg8 _1pfhidpf _12ji1r31 _1qu2glyw _12y31o36", truncateTitle && "_1reo15vq _18m915vq _1bto1l2s _o5721q9c"])
53
55
  }, children);
54
56
  });
@@ -92,7 +94,7 @@ export const ActionsWrapper = ({
92
94
  children
93
95
  }) => {
94
96
  return /*#__PURE__*/React.createElement("div", {
95
- className: ax(["_p12f1osq _16jlidpf _1o9zidpf _i0dl1wug _6rthu2gc _ahbq1wug _bozgxy5q _o5721q9c _1oblusic"])
97
+ className: ax(["_p12f1osq _16jlidpf _1o9zidpf _i0dl1wug _6rthu2gc _ahbq1wug _bozgxy5q _o5721q9c"])
96
98
  }, children);
97
99
  };
98
100
 
@@ -24,7 +24,8 @@ var PageHeader = function PageHeader(_ref) {
24
24
  _ref$disableTitleStyl = _ref.disableTitleStyles,
25
25
  disableTitleStyles = _ref$disableTitleStyl === void 0 ? false : _ref$disableTitleStyl,
26
26
  _ref$truncateTitle = _ref.truncateTitle,
27
- truncateTitle = _ref$truncateTitle === void 0 ? false : _ref$truncateTitle;
27
+ truncateTitle = _ref$truncateTitle === void 0 ? false : _ref$truncateTitle,
28
+ testId = _ref.testId;
28
29
  return /*#__PURE__*/React.createElement(OuterWrapper, null, breadcrumbs, /*#__PURE__*/React.createElement(TitleWrapper, {
29
30
  truncateTitle: truncateTitle
30
31
  }, /*#__PURE__*/React.createElement(TitleContainer, {
@@ -32,7 +33,8 @@ var PageHeader = function PageHeader(_ref) {
32
33
  }, disableTitleStyles ? children : /*#__PURE__*/React.createElement(StyledTitleWrapper, {
33
34
  ref: innerRef,
34
35
  truncateTitle: truncateTitle,
35
- id: id
36
+ id: id,
37
+ testId: testId
36
38
  }, children)), actions && /*#__PURE__*/React.createElement(ActionsWrapper, null, actions)), bottomBar && /*#__PURE__*/React.createElement(BottomBarWrapper, null, " ", bottomBar, " "));
37
39
  };
38
40
  export default PageHeader;
@@ -12,7 +12,6 @@
12
12
  ._1n261q9c{flex-wrap:nowrap}
13
13
  ._1o9zidpf{flex-shrink:0}
14
14
  ._1o9zkb7n{flex-shrink:1}
15
- ._1oblusic >{text-align:right}
16
15
  ._1pfhidpf{margin-block-start:0}
17
16
  ._1pfhpxbi{margin-block-start:var(--ds-space-200,1pc)}
18
17
  ._1qu2glyw{outline-style:none}
@@ -45,11 +45,13 @@ export var OuterWrapper = function OuterWrapper(_ref) {
45
45
  export var StyledTitleWrapper = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
46
46
  var children = _ref2.children,
47
47
  id = _ref2.id,
48
- truncateTitle = _ref2.truncateTitle;
48
+ truncateTitle = _ref2.truncateTitle,
49
+ testId = _ref2.testId;
49
50
  return /*#__PURE__*/React.createElement("h1", {
50
51
  ref: ref,
51
52
  tabIndex: -1,
52
53
  id: id,
54
+ "data-testid": testId && "".concat(testId, "--title"),
53
55
  className: ax(["_syaz1fxt _11c81p5s _1dyz4jg8 _1pfhidpf _12ji1r31 _1qu2glyw _12y31o36", truncateTitle && "_1reo15vq _18m915vq _1bto1l2s _o5721q9c"])
54
56
  }, children);
55
57
  });
@@ -90,7 +92,7 @@ export var TitleContainer = function TitleContainer(_ref4) {
90
92
  export var ActionsWrapper = function ActionsWrapper(_ref5) {
91
93
  var children = _ref5.children;
92
94
  return /*#__PURE__*/React.createElement("div", {
93
- className: ax(["_p12f1osq _16jlidpf _1o9zidpf _i0dl1wug _6rthu2gc _ahbq1wug _bozgxy5q _o5721q9c _1oblusic"])
95
+ className: ax(["_p12f1osq _16jlidpf _1o9zidpf _i0dl1wug _6rthu2gc _ahbq1wug _bozgxy5q _o5721q9c"])
94
96
  }, children);
95
97
  };
96
98
 
@@ -32,6 +32,10 @@ export type PageHeaderProps = {
32
32
  * Used as the ID of the inner h1 tag. This is exposed so the header text can be used as label of other elements by aria-labelledby.
33
33
  */
34
34
  id?: string;
35
+ /**
36
+ * A testId prop is provided for specified elements, which is a unique string that appears as a data attribute data-testid in the rendered code, serving as a hook for automated tests.
37
+ */
38
+ testId?: string;
35
39
  };
36
40
  /**
37
41
  * __Page header__
@@ -43,5 +47,5 @@ export type PageHeaderProps = {
43
47
  * - [Code](https://atlassian.design/components/page-header/code)
44
48
  * - [Usage](https://atlassian.design/components/page-header/usage)
45
49
  */
46
- declare const PageHeader: ({ innerRef, breadcrumbs, actions, bottomBar, children, id, disableTitleStyles, truncateTitle, }: PageHeaderProps) => JSX.Element;
50
+ declare const PageHeader: ({ innerRef, breadcrumbs, actions, bottomBar, children, id, disableTitleStyles, truncateTitle, testId, }: PageHeaderProps) => JSX.Element;
47
51
  export default PageHeader;
@@ -17,6 +17,7 @@ interface StyledTitleWrapperProps {
17
17
  children?: React.ReactNode;
18
18
  id?: string;
19
19
  truncateTitle?: boolean;
20
+ testId?: string;
20
21
  }
21
22
  /**
22
23
  * __Styled title wrapper__.
@@ -32,6 +32,10 @@ export type PageHeaderProps = {
32
32
  * Used as the ID of the inner h1 tag. This is exposed so the header text can be used as label of other elements by aria-labelledby.
33
33
  */
34
34
  id?: string;
35
+ /**
36
+ * A testId prop is provided for specified elements, which is a unique string that appears as a data attribute data-testid in the rendered code, serving as a hook for automated tests.
37
+ */
38
+ testId?: string;
35
39
  };
36
40
  /**
37
41
  * __Page header__
@@ -43,5 +47,5 @@ export type PageHeaderProps = {
43
47
  * - [Code](https://atlassian.design/components/page-header/code)
44
48
  * - [Usage](https://atlassian.design/components/page-header/usage)
45
49
  */
46
- declare const PageHeader: ({ innerRef, breadcrumbs, actions, bottomBar, children, id, disableTitleStyles, truncateTitle, }: PageHeaderProps) => JSX.Element;
50
+ declare const PageHeader: ({ innerRef, breadcrumbs, actions, bottomBar, children, id, disableTitleStyles, truncateTitle, testId, }: PageHeaderProps) => JSX.Element;
47
51
  export default PageHeader;
@@ -17,6 +17,7 @@ interface StyledTitleWrapperProps {
17
17
  children?: React.ReactNode;
18
18
  id?: string;
19
19
  truncateTitle?: boolean;
20
+ testId?: string;
20
21
  }
21
22
  /**
22
23
  * __Styled title wrapper__.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/page-header",
3
- "version": "11.0.0",
3
+ "version": "11.0.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/"