@atlaskit/help-layout 6.2.2 → 6.3.0

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,25 @@
1
1
  # @atlaskit/help-layout
2
2
 
3
+ ## 6.3.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#157993](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/157993)
8
+ [`c12accd6f87ad`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c12accd6f87ad) -
9
+ [ux] Adding back button for ai chat history
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
15
+ ## 6.2.3
16
+
17
+ ### Patch Changes
18
+
19
+ - [#154681](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/154681)
20
+ [`fb0a99c10712e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fb0a99c10712e) -
21
+ Renamed contentRender prop for AI enabled feature
22
+
3
23
  ## 6.2.2
4
24
 
5
25
  ### Patch Changes
@@ -14,5 +14,5 @@ var createAndFire = exports.createAndFire = x.createAndFireEvent('atlaskit');
14
14
  var defaultAnalyticsAttributes = exports.defaultAnalyticsAttributes = {
15
15
  componentName: 'helpPanel',
16
16
  packageName: "@atlaskit/help-layout",
17
- packageVersion: "6.2.2"
17
+ packageVersion: "6.3.0"
18
18
  };
@@ -1,4 +1,5 @@
1
1
  ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
2
+ ._4cvr1h6o{align-items:center}
2
3
  ._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
3
4
  ._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
4
5
  ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
@@ -13,25 +13,40 @@ var _runtime = require("@compiled/react/runtime");
13
13
  var _heading = _interopRequireDefault(require("@atlaskit/heading"));
14
14
  var _CloseButton = _interopRequireDefault(require("../Header/CloseButton"));
15
15
  var _compiled = require("@atlaskit/primitives/compiled");
16
+ var _new = require("@atlaskit/button/new");
16
17
  var _NewChatButton = require("./NewChatButton");
18
+ var _chevronLeftChevronLeftLarge = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-left--chevron-left-large"));
17
19
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
20
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
19
21
  var styles = {
20
- container: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi"
22
+ container: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _4cvr1h6o"
21
23
  };
22
24
  var DynamicHeader = exports.DynamicHeader = function DynamicHeader(_ref) {
23
25
  var title = _ref.title,
24
26
  onCloseButtonClick = _ref.onCloseButtonClick,
25
27
  onNewChatButtonClick = _ref.onNewChatButtonClick,
26
- newChatButtonDisabled = _ref.newChatButtonDisabled;
28
+ newChatButtonDisabled = _ref.newChatButtonDisabled,
29
+ onGoBackToHistoryList = _ref.onGoBackToHistoryList,
30
+ isBackButtonVisible = _ref.isBackButtonVisible;
27
31
  return /*#__PURE__*/React.createElement(_compiled.Flex, {
28
32
  direction: "row",
29
33
  justifyContent: "space-between",
30
34
  xcss: styles.container
31
- }, /*#__PURE__*/React.createElement(_heading.default, {
35
+ }, /*#__PURE__*/React.createElement(_compiled.Flex, {
36
+ direction: "row",
37
+ alignItems: "center",
38
+ justifyContent: "start",
39
+ gap: "space.050"
40
+ }, onGoBackToHistoryList && isBackButtonVisible && /*#__PURE__*/React.createElement(_new.IconButton, {
41
+ appearance: "subtle",
42
+ label: "Back",
43
+ icon: _chevronLeftChevronLeftLarge.default,
44
+ onClick: onGoBackToHistoryList,
45
+ testId: "back-button-history-item"
46
+ }), /*#__PURE__*/React.createElement(_heading.default, {
32
47
  size: "medium",
33
48
  testId: "header-title-side-nav"
34
- }, title), /*#__PURE__*/React.createElement(_compiled.Inline, {
49
+ }, title)), /*#__PURE__*/React.createElement(_compiled.Inline, {
35
50
  space: "space.050",
36
51
  alignBlock: "center"
37
52
  }, onNewChatButtonClick && /*#__PURE__*/React.createElement(_NewChatButton.NewChatButton, {
@@ -56,7 +56,7 @@ var BackButtonWithContext = function BackButtonWithContext(props) {
56
56
  data: {
57
57
  componentName: 'backButton',
58
58
  packageName: "@atlaskit/help-layout",
59
- packageVersion: "6.2.2"
59
+ packageVersion: "6.3.0"
60
60
  }
61
61
  }, /*#__PURE__*/_react.default.createElement(BackButton, props));
62
62
  };
@@ -55,7 +55,7 @@ var CloseButtonWithContext = function CloseButtonWithContext(props) {
55
55
  data: {
56
56
  componentName: 'closeButton',
57
57
  packageName: "@atlaskit/help-layout",
58
- packageVersion: "6.2.2"
58
+ packageVersion: "6.3.0"
59
59
  }
60
60
  }, /*#__PURE__*/_react.default.createElement(CloseButton, props));
61
61
  };
@@ -67,6 +67,8 @@ var SideNav = exports.SideNav = function SideNav(_ref) {
67
67
  title: sideNavTabs[activeIndex].header.title,
68
68
  onCloseButtonClick: sideNavTabs[activeIndex].header.onCloseButtonClick,
69
69
  onNewChatButtonClick: sideNavTabs[activeIndex].header.onNewChatButtonClick,
70
- newChatButtonDisabled: sideNavTabs[activeIndex].header.newChatButtonDisabled
71
- }), sideNavTabs[activeIndex].content));
70
+ newChatButtonDisabled: sideNavTabs[activeIndex].header.newChatButtonDisabled,
71
+ onGoBackToHistoryList: sideNavTabs[activeIndex].header.onGoBackToHistoryList,
72
+ isBackButtonVisible: sideNavTabs[activeIndex].header.isBackButtonVisible
73
+ }), sideNavTabs[activeIndex].contentRender()));
72
74
  };
@@ -5,5 +5,5 @@ export const createAndFire = x.createAndFireEvent('atlaskit');
5
5
  export const defaultAnalyticsAttributes = {
6
6
  componentName: 'helpPanel',
7
7
  packageName: "@atlaskit/help-layout",
8
- packageVersion: "6.2.2"
8
+ packageVersion: "6.3.0"
9
9
  };
@@ -1,4 +1,5 @@
1
1
  ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
2
+ ._4cvr1h6o{align-items:center}
2
3
  ._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
3
4
  ._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
4
5
  ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
@@ -5,24 +5,39 @@ import { ax, ix } from "@compiled/react/runtime";
5
5
  import Heading from '@atlaskit/heading';
6
6
  import CloseButton from '../Header/CloseButton';
7
7
  import { Flex, Inline } from '@atlaskit/primitives/compiled';
8
+ import { IconButton } from '@atlaskit/button/new';
8
9
  import { NewChatButton } from './NewChatButton';
10
+ import ChevronLeftLargeIcon from '@atlaskit/icon/utility/migration/chevron-left--chevron-left-large';
9
11
  const styles = {
10
- container: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi"
12
+ container: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _4cvr1h6o"
11
13
  };
12
14
  export const DynamicHeader = ({
13
15
  title,
14
16
  onCloseButtonClick,
15
17
  onNewChatButtonClick,
16
- newChatButtonDisabled
18
+ newChatButtonDisabled,
19
+ onGoBackToHistoryList,
20
+ isBackButtonVisible
17
21
  }) => {
18
22
  return /*#__PURE__*/React.createElement(Flex, {
19
23
  direction: "row",
20
24
  justifyContent: "space-between",
21
25
  xcss: styles.container
22
- }, /*#__PURE__*/React.createElement(Heading, {
26
+ }, /*#__PURE__*/React.createElement(Flex, {
27
+ direction: "row",
28
+ alignItems: "center",
29
+ justifyContent: "start",
30
+ gap: "space.050"
31
+ }, onGoBackToHistoryList && isBackButtonVisible && /*#__PURE__*/React.createElement(IconButton, {
32
+ appearance: "subtle",
33
+ label: "Back",
34
+ icon: ChevronLeftLargeIcon,
35
+ onClick: onGoBackToHistoryList,
36
+ testId: "back-button-history-item"
37
+ }), /*#__PURE__*/React.createElement(Heading, {
23
38
  size: "medium",
24
39
  testId: "header-title-side-nav"
25
- }, title), /*#__PURE__*/React.createElement(Inline, {
40
+ }, title)), /*#__PURE__*/React.createElement(Inline, {
26
41
  space: "space.050",
27
42
  alignBlock: "center"
28
43
  }, onNewChatButtonClick && /*#__PURE__*/React.createElement(NewChatButton, {
@@ -50,7 +50,7 @@ const BackButtonWithContext = props => {
50
50
  data: {
51
51
  componentName: 'backButton',
52
52
  packageName: "@atlaskit/help-layout",
53
- packageVersion: "6.2.2"
53
+ packageVersion: "6.3.0"
54
54
  }
55
55
  }, /*#__PURE__*/React.createElement(BackButton, props));
56
56
  };
@@ -51,7 +51,7 @@ const CloseButtonWithContext = props => {
51
51
  data: {
52
52
  componentName: 'closeButton',
53
53
  packageName: "@atlaskit/help-layout",
54
- packageVersion: "6.2.2"
54
+ packageVersion: "6.3.0"
55
55
  }
56
56
  }, /*#__PURE__*/React.createElement(CloseButton, props));
57
57
  };
@@ -52,6 +52,8 @@ export const SideNav = ({
52
52
  title: sideNavTabs[activeIndex].header.title,
53
53
  onCloseButtonClick: sideNavTabs[activeIndex].header.onCloseButtonClick,
54
54
  onNewChatButtonClick: sideNavTabs[activeIndex].header.onNewChatButtonClick,
55
- newChatButtonDisabled: sideNavTabs[activeIndex].header.newChatButtonDisabled
56
- }), sideNavTabs[activeIndex].content));
55
+ newChatButtonDisabled: sideNavTabs[activeIndex].header.newChatButtonDisabled,
56
+ onGoBackToHistoryList: sideNavTabs[activeIndex].header.onGoBackToHistoryList,
57
+ isBackButtonVisible: sideNavTabs[activeIndex].header.isBackButtonVisible
58
+ }), sideNavTabs[activeIndex].contentRender()));
57
59
  };
@@ -5,5 +5,5 @@ export var createAndFire = x.createAndFireEvent('atlaskit');
5
5
  export var defaultAnalyticsAttributes = {
6
6
  componentName: 'helpPanel',
7
7
  packageName: "@atlaskit/help-layout",
8
- packageVersion: "6.2.2"
8
+ packageVersion: "6.3.0"
9
9
  };
@@ -1,4 +1,5 @@
1
1
  ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
2
+ ._4cvr1h6o{align-items:center}
2
3
  ._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
3
4
  ._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
4
5
  ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
@@ -5,23 +5,38 @@ import { ax, ix } from "@compiled/react/runtime";
5
5
  import Heading from '@atlaskit/heading';
6
6
  import CloseButton from '../Header/CloseButton';
7
7
  import { Flex, Inline } from '@atlaskit/primitives/compiled';
8
+ import { IconButton } from '@atlaskit/button/new';
8
9
  import { NewChatButton } from './NewChatButton';
10
+ import ChevronLeftLargeIcon from '@atlaskit/icon/utility/migration/chevron-left--chevron-left-large';
9
11
  var styles = {
10
- container: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi"
12
+ container: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _4cvr1h6o"
11
13
  };
12
14
  export var DynamicHeader = function DynamicHeader(_ref) {
13
15
  var title = _ref.title,
14
16
  onCloseButtonClick = _ref.onCloseButtonClick,
15
17
  onNewChatButtonClick = _ref.onNewChatButtonClick,
16
- newChatButtonDisabled = _ref.newChatButtonDisabled;
18
+ newChatButtonDisabled = _ref.newChatButtonDisabled,
19
+ onGoBackToHistoryList = _ref.onGoBackToHistoryList,
20
+ isBackButtonVisible = _ref.isBackButtonVisible;
17
21
  return /*#__PURE__*/React.createElement(Flex, {
18
22
  direction: "row",
19
23
  justifyContent: "space-between",
20
24
  xcss: styles.container
21
- }, /*#__PURE__*/React.createElement(Heading, {
25
+ }, /*#__PURE__*/React.createElement(Flex, {
26
+ direction: "row",
27
+ alignItems: "center",
28
+ justifyContent: "start",
29
+ gap: "space.050"
30
+ }, onGoBackToHistoryList && isBackButtonVisible && /*#__PURE__*/React.createElement(IconButton, {
31
+ appearance: "subtle",
32
+ label: "Back",
33
+ icon: ChevronLeftLargeIcon,
34
+ onClick: onGoBackToHistoryList,
35
+ testId: "back-button-history-item"
36
+ }), /*#__PURE__*/React.createElement(Heading, {
22
37
  size: "medium",
23
38
  testId: "header-title-side-nav"
24
- }, title), /*#__PURE__*/React.createElement(Inline, {
39
+ }, title)), /*#__PURE__*/React.createElement(Inline, {
25
40
  space: "space.050",
26
41
  alignBlock: "center"
27
42
  }, onNewChatButtonClick && /*#__PURE__*/React.createElement(NewChatButton, {
@@ -49,7 +49,7 @@ var BackButtonWithContext = function BackButtonWithContext(props) {
49
49
  data: {
50
50
  componentName: 'backButton',
51
51
  packageName: "@atlaskit/help-layout",
52
- packageVersion: "6.2.2"
52
+ packageVersion: "6.3.0"
53
53
  }
54
54
  }, /*#__PURE__*/React.createElement(BackButton, props));
55
55
  };
@@ -48,7 +48,7 @@ var CloseButtonWithContext = function CloseButtonWithContext(props) {
48
48
  data: {
49
49
  componentName: 'closeButton',
50
50
  packageName: "@atlaskit/help-layout",
51
- packageVersion: "6.2.2"
51
+ packageVersion: "6.3.0"
52
52
  }
53
53
  }, /*#__PURE__*/React.createElement(CloseButton, props));
54
54
  };
@@ -57,6 +57,8 @@ export var SideNav = function SideNav(_ref) {
57
57
  title: sideNavTabs[activeIndex].header.title,
58
58
  onCloseButtonClick: sideNavTabs[activeIndex].header.onCloseButtonClick,
59
59
  onNewChatButtonClick: sideNavTabs[activeIndex].header.onNewChatButtonClick,
60
- newChatButtonDisabled: sideNavTabs[activeIndex].header.newChatButtonDisabled
61
- }), sideNavTabs[activeIndex].content));
60
+ newChatButtonDisabled: sideNavTabs[activeIndex].header.newChatButtonDisabled,
61
+ onGoBackToHistoryList: sideNavTabs[activeIndex].header.onGoBackToHistoryList,
62
+ isBackButtonVisible: sideNavTabs[activeIndex].header.isBackButtonVisible
63
+ }), sideNavTabs[activeIndex].contentRender()));
62
64
  };
@@ -4,4 +4,4 @@
4
4
  */
5
5
  /// <reference types="react" />
6
6
  import { type HeaderContent } from '../../model/HelpLayout';
7
- export declare const DynamicHeader: ({ title, onCloseButtonClick, onNewChatButtonClick, newChatButtonDisabled, }: HeaderContent) => JSX.Element;
7
+ export declare const DynamicHeader: ({ title, onCloseButtonClick, onNewChatButtonClick, newChatButtonDisabled, onGoBackToHistoryList, isBackButtonVisible, }: HeaderContent) => JSX.Element;
@@ -3,7 +3,7 @@
3
3
  * @jsx jsx
4
4
  */
5
5
  import React from 'react';
6
- import { TransitionStatus } from '../constants';
6
+ import { type TransitionStatus } from '../constants';
7
7
  export declare const HeaderContainer: ({ children }: {
8
8
  children: React.ReactNode;
9
9
  }) => JSX.Element;
@@ -13,11 +13,13 @@ export interface HeaderContent {
13
13
  onNewChatButtonClick?(event: React.MouseEvent<HTMLElement, MouseEvent>, analyticsEvent: UIAnalyticsEvent): void;
14
14
  onCloseButtonClick?(event: React.MouseEvent<HTMLElement, MouseEvent>, analyticsEvent: UIAnalyticsEvent): void;
15
15
  newChatButtonDisabled?: boolean;
16
+ onGoBackToHistoryList?(event: React.MouseEvent<HTMLElement, MouseEvent>, analyticsEvent: UIAnalyticsEvent): void;
17
+ isBackButtonVisible?: boolean;
16
18
  }
17
19
  export interface SideNavTab {
18
20
  icon: React.ReactNode;
19
21
  label: string;
20
- content: React.ReactNode;
22
+ contentRender: () => React.ReactNode;
21
23
  onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
22
24
  header: HeaderContent;
23
25
  }
@@ -4,4 +4,4 @@
4
4
  * @jsx jsx
5
5
  */
6
6
  import { type HeaderContent } from '../../model/HelpLayout';
7
- export declare const DynamicHeader: ({ title, onCloseButtonClick, onNewChatButtonClick, newChatButtonDisabled, }: HeaderContent) => JSX.Element;
7
+ export declare const DynamicHeader: ({ title, onCloseButtonClick, onNewChatButtonClick, newChatButtonDisabled, onGoBackToHistoryList, isBackButtonVisible, }: HeaderContent) => JSX.Element;
@@ -3,7 +3,7 @@
3
3
  * @jsx jsx
4
4
  */
5
5
  import React from 'react';
6
- import { TransitionStatus } from '../constants';
6
+ import { type TransitionStatus } from '../constants';
7
7
  export declare const HeaderContainer: ({ children }: {
8
8
  children: React.ReactNode;
9
9
  }) => JSX.Element;
@@ -13,11 +13,13 @@ export interface HeaderContent {
13
13
  onNewChatButtonClick?(event: React.MouseEvent<HTMLElement, MouseEvent>, analyticsEvent: UIAnalyticsEvent): void;
14
14
  onCloseButtonClick?(event: React.MouseEvent<HTMLElement, MouseEvent>, analyticsEvent: UIAnalyticsEvent): void;
15
15
  newChatButtonDisabled?: boolean;
16
+ onGoBackToHistoryList?(event: React.MouseEvent<HTMLElement, MouseEvent>, analyticsEvent: UIAnalyticsEvent): void;
17
+ isBackButtonVisible?: boolean;
16
18
  }
17
19
  export interface SideNavTab {
18
20
  icon: React.ReactNode;
19
21
  label: string;
20
- content: React.ReactNode;
22
+ contentRender: () => React.ReactNode;
21
23
  onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
22
24
  header: HeaderContent;
23
25
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/help-layout",
3
- "version": "6.2.2",
3
+ "version": "6.3.0",
4
4
  "description": "Layout for the atlaskit/help component.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -33,13 +33,13 @@
33
33
  },
34
34
  "dependencies": {
35
35
  "@atlaskit/analytics-next": "^11.0.0",
36
- "@atlaskit/button": "^23.0.0",
36
+ "@atlaskit/button": "^23.2.0",
37
37
  "@atlaskit/css": "^0.10.0",
38
38
  "@atlaskit/heading": "^5.2.0",
39
- "@atlaskit/icon": "^26.0.0",
40
- "@atlaskit/primitives": "^14.7.0",
39
+ "@atlaskit/icon": "^26.1.0",
40
+ "@atlaskit/primitives": "^14.8.0",
41
41
  "@atlaskit/theme": "^18.0.0",
42
- "@atlaskit/tokens": "^4.8.0",
42
+ "@atlaskit/tokens": "^4.9.0",
43
43
  "@atlaskit/tooltip": "^20.0.0",
44
44
  "@babel/runtime": "^7.0.0",
45
45
  "@compiled/react": "^0.18.3",