@atlaskit/navigation-system 8.1.0 → 8.2.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.
Files changed (11) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/cjs/ui/page-layout/panel-splitter/panel-splitter.compiled.css +0 -7
  3. package/dist/cjs/ui/page-layout/panel-splitter/panel-splitter.js +8 -11
  4. package/dist/cjs/ui/page-layout/side-nav/side-nav.js +1 -1
  5. package/dist/es2019/ui/page-layout/panel-splitter/panel-splitter.compiled.css +0 -7
  6. package/dist/es2019/ui/page-layout/panel-splitter/panel-splitter.js +8 -11
  7. package/dist/es2019/ui/page-layout/side-nav/side-nav.js +1 -1
  8. package/dist/esm/ui/page-layout/panel-splitter/panel-splitter.compiled.css +0 -7
  9. package/dist/esm/ui/page-layout/panel-splitter/panel-splitter.js +8 -11
  10. package/dist/esm/ui/page-layout/side-nav/side-nav.js +1 -1
  11. package/package.json +3 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlassian/navigation-system
2
2
 
3
+ ## 8.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`0535fe6d19c87`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0535fe6d19c87) -
8
+ Cleans up the `platform_dst_nav4_side_nav_resize_tooltip_feedback` feature gate. The
9
+ `SideNavPanelSplitter` tooltip now has improved visuals.
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
3
15
  ## 8.1.0
4
16
 
5
17
  ### Minor Changes
package/dist/cjs/ui/page-layout/panel-splitter/panel-splitter.compiled.css CHANGED
@@ -9,8 +9,6 @@
9
9
  ._1e0c1ule{display:block}
10
10
  ._1e0cglyw{display:none}
11
11
  ._1lww188d{transition-delay:.3s}
12
- ._1lww5cps{transition-delay:0ms}
13
- ._1oec1yx9{transition-duration:.1s}
14
12
  ._1oec6ebc{transition-duration:.15s}
15
13
  ._1pbykb7n{z-index:1}
16
14
  ._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
@@ -29,15 +27,10 @@
29
27
  ._syaz1kw7{color:inherit}
30
28
  ._u7coidpf{inset-block-end:0}
31
29
  ._y4tize3t{padding-inline-end:var(--ds-space-0,0)}
32
- ._1cg4fnf5:focus-within{transition-duration:.2s}
33
- ._1dr21ylx:focus-within{transition-property:color}
34
30
  ._vp7g6x5g:focus-within{color:var(--ds-text-selected,#1868db)}
35
- ._1gavfnf5:hover{transition-delay:.2s}
36
- ._1s5z1ylx:hover{transition-property:color}
37
31
  ._30l36x5g:hover{color:var(--ds-text-selected,#1868db)}
38
32
  ._d0al11mm:hover{cursor:col-resize}
39
33
  ._d0aluf7j:hover{cursor:ew-resize}
40
- ._le1bfnf5:hover{transition-duration:.2s}
41
34
  ._1gglglyw:active{transition:none}
42
35
  ._9h8h12zz:active{color:var(--ds-link-pressed,#1558bc)}
43
36
  @media (min-width:48rem){._181n1ule{display:block}}
package/dist/cjs/ui/page-layout/panel-splitter/panel-splitter.js CHANGED
@@ -21,7 +21,6 @@ var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
21
21
  var _useId = require("@atlaskit/ds-lib/use-id");
22
22
  var _useStableRef = _interopRequireDefault(require("@atlaskit/ds-lib/use-stable-ref"));
23
23
  var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
24
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
25
24
  var _combine = require("@atlaskit/pragmatic-drag-and-drop/combine");
26
25
  var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
27
26
  var _blockDraggingToIframes = require("@atlaskit/pragmatic-drag-and-drop/element/block-dragging-to-iframes");
@@ -54,10 +53,8 @@ var containerStyles = {
54
53
  positionStart: "_1e02zeo2"
55
54
  };
56
55
  var grabAreaStyles = {
57
- root: "_1bsbl52n _4t3i1osq _kqswstnw _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _syaz1j28 _bfhk1j28 _k8m01ylx _d0aluf7j _vp7g6x5g _30l36x5g _1gglglyw _9h8h12zz",
58
- fullHeightSidebar: "_d0al11mm",
59
- oldTransition: "_1oec1yx9 _1lww5cps _1gavfnf5 _1dr21ylx _1s5z1ylx _1cg4fnf5 _le1bfnf5",
60
- newTransition: "_1oec6ebc _1lww188d _6fl41ytf"
56
+ root: "_1bsbl52n _4t3i1osq _kqswstnw _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _syaz1j28 _bfhk1j28 _1oec6ebc _1lww188d _6fl41ytf _k8m01ylx _d0aluf7j _vp7g6x5g _30l36x5g _1gglglyw _9h8h12zz",
57
+ fullHeightSidebar: "_d0al11mm"
61
58
  };
62
59
  var lineStyles = {
63
60
  root: "_kqswstnw _1e0c1ule _1bsb1l7b _4t3i1osq _syaz1kw7 _bfhk1r31 _1e021v6z"
@@ -124,12 +121,12 @@ var MaybeTooltip = function MaybeTooltip(_ref2) {
124
121
  testId: testId,
125
122
  content: tooltipContent,
126
123
  shortcut: shortcut,
127
- position: (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? 'mouse-y' : 'mouse',
124
+ position: "mouse-y",
128
125
  mousePosition: "right",
129
126
  isScreenReaderAnnouncementDisabled: true,
130
- component: (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? PanelSplitterTooltip : undefined,
131
- UNSAFE_shouldAlwaysFadeIn: (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback'),
132
- UNSAFE_shouldRenderToParent: (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback')
127
+ component: PanelSplitterTooltip,
128
+ UNSAFE_shouldAlwaysFadeIn: true,
129
+ UNSAFE_shouldRenderToParent: true
133
130
  }, children);
134
131
  }
135
132
  return children;
@@ -402,12 +399,12 @@ var PortaledPanelSplitter = function PortaledPanelSplitter(_ref3) {
402
399
  }, /*#__PURE__*/React.createElement(MaybeTooltip, {
403
400
  tooltipContent: tooltipContent,
404
401
  shortcut: shortcut,
405
- testId: testId && (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? "".concat(testId, "-tooltip") : undefined
402
+ testId: testId ? "".concat(testId, "-tooltip") : undefined
406
403
  }, /*#__PURE__*/React.createElement("div", {
407
404
  ref: splitterRef,
408
405
  "data-testid": testId,
409
406
  onDoubleClick: onDoubleClick,
410
- className: (0, _runtime.ax)([grabAreaStyles.root, isFhsEnabled && grabAreaStyles.fullHeightSidebar, (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? grabAreaStyles.newTransition : grabAreaStyles.oldTransition])
407
+ className: (0, _runtime.ax)([grabAreaStyles.root, isFhsEnabled && grabAreaStyles.fullHeightSidebar])
411
408
  }, /*#__PURE__*/React.createElement(_visuallyHidden.default, null, /*#__PURE__*/React.createElement("input", {
412
409
  type: "range",
413
410
  value: rangeInputValue,
package/dist/cjs/ui/page-layout/side-nav/side-nav.js CHANGED
@@ -227,7 +227,7 @@ function SideNavInternal(_ref) {
227
227
  if (openLayerObserver && openLayerObserver.getCount({
228
228
  namespace: _constants.openLayerObserverTopNavStartNamespace,
229
229
  type: 'popup'
230
- }) > 0 && (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_resize_tooltip_feedback')) {
230
+ }) > 0) {
231
231
  return;
232
232
  }
233
233
  var prevFlyoutState = flyoutStateRef.current;
package/dist/es2019/ui/page-layout/panel-splitter/panel-splitter.compiled.css CHANGED
@@ -9,8 +9,6 @@
9
9
  ._1e0c1ule{display:block}
10
10
  ._1e0cglyw{display:none}
11
11
  ._1lww188d{transition-delay:.3s}
12
- ._1lww5cps{transition-delay:0ms}
13
- ._1oec1yx9{transition-duration:.1s}
14
12
  ._1oec6ebc{transition-duration:.15s}
15
13
  ._1pbykb7n{z-index:1}
16
14
  ._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
@@ -29,15 +27,10 @@
29
27
  ._syaz1kw7{color:inherit}
30
28
  ._u7coidpf{inset-block-end:0}
31
29
  ._y4tize3t{padding-inline-end:var(--ds-space-0,0)}
32
- ._1cg4fnf5:focus-within{transition-duration:.2s}
33
- ._1dr21ylx:focus-within{transition-property:color}
34
30
  ._vp7g6x5g:focus-within{color:var(--ds-text-selected,#1868db)}
35
- ._1gavfnf5:hover{transition-delay:.2s}
36
- ._1s5z1ylx:hover{transition-property:color}
37
31
  ._30l36x5g:hover{color:var(--ds-text-selected,#1868db)}
38
32
  ._d0al11mm:hover{cursor:col-resize}
39
33
  ._d0aluf7j:hover{cursor:ew-resize}
40
- ._le1bfnf5:hover{transition-duration:.2s}
41
34
  ._1gglglyw:active{transition:none}
42
35
  ._9h8h12zz:active{color:var(--ds-link-pressed,#1558bc)}
43
36
  @media (min-width:48rem){._181n1ule{display:block}}
package/dist/es2019/ui/page-layout/panel-splitter/panel-splitter.js CHANGED
@@ -10,7 +10,6 @@ import invariant from 'tiny-invariant';
10
10
  import { useId } from '@atlaskit/ds-lib/use-id';
11
11
  import useStableRef from '@atlaskit/ds-lib/use-stable-ref';
12
12
  import { useOpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer';
13
- import { fg } from '@atlaskit/platform-feature-flags';
14
13
  import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
15
14
  import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
16
15
  import { blockDraggingToIFrames } from '@atlaskit/pragmatic-drag-and-drop/element/block-dragging-to-iframes';
@@ -42,10 +41,8 @@ const containerStyles = {
42
41
  positionStart: "_1e02zeo2"
43
42
  };
44
43
  const grabAreaStyles = {
45
- root: "_1bsbl52n _4t3i1osq _kqswstnw _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _syaz1j28 _bfhk1j28 _k8m01ylx _d0aluf7j _vp7g6x5g _30l36x5g _1gglglyw _9h8h12zz",
46
- fullHeightSidebar: "_d0al11mm",
47
- oldTransition: "_1oec1yx9 _1lww5cps _1gavfnf5 _1dr21ylx _1s5z1ylx _1cg4fnf5 _le1bfnf5",
48
- newTransition: "_1oec6ebc _1lww188d _6fl41ytf"
44
+ root: "_1bsbl52n _4t3i1osq _kqswstnw _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _syaz1j28 _bfhk1j28 _1oec6ebc _1lww188d _6fl41ytf _k8m01ylx _d0aluf7j _vp7g6x5g _30l36x5g _1gglglyw _9h8h12zz",
45
+ fullHeightSidebar: "_d0al11mm"
49
46
  };
50
47
  const lineStyles = {
51
48
  root: "_kqswstnw _1e0c1ule _1bsb1l7b _4t3i1osq _syaz1kw7 _bfhk1r31 _1e021v6z"
@@ -112,12 +109,12 @@ const MaybeTooltip = ({
112
109
  testId: testId,
113
110
  content: tooltipContent,
114
111
  shortcut: shortcut,
115
- position: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? 'mouse-y' : 'mouse',
112
+ position: "mouse-y",
116
113
  mousePosition: "right",
117
114
  isScreenReaderAnnouncementDisabled: true,
118
- component: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? PanelSplitterTooltip : undefined,
119
- UNSAFE_shouldAlwaysFadeIn: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback'),
120
- UNSAFE_shouldRenderToParent: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback')
115
+ component: PanelSplitterTooltip,
116
+ UNSAFE_shouldAlwaysFadeIn: true,
117
+ UNSAFE_shouldRenderToParent: true
121
118
  }, children);
122
119
  }
123
120
  return children;
@@ -379,12 +376,12 @@ const PortaledPanelSplitter = ({
379
376
  }, /*#__PURE__*/React.createElement(MaybeTooltip, {
380
377
  tooltipContent: tooltipContent,
381
378
  shortcut: shortcut,
382
- testId: testId && fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? `${testId}-tooltip` : undefined
379
+ testId: testId ? `${testId}-tooltip` : undefined
383
380
  }, /*#__PURE__*/React.createElement("div", {
384
381
  ref: splitterRef,
385
382
  "data-testid": testId,
386
383
  onDoubleClick: onDoubleClick,
387
- className: ax([grabAreaStyles.root, isFhsEnabled && grabAreaStyles.fullHeightSidebar, fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? grabAreaStyles.newTransition : grabAreaStyles.oldTransition])
384
+ className: ax([grabAreaStyles.root, isFhsEnabled && grabAreaStyles.fullHeightSidebar])
388
385
  }, /*#__PURE__*/React.createElement(VisuallyHidden, null, /*#__PURE__*/React.createElement("input", {
389
386
  type: "range",
390
387
  value: rangeInputValue,
package/dist/es2019/ui/page-layout/side-nav/side-nav.js CHANGED
@@ -206,7 +206,7 @@ function SideNavInternal({
206
206
  if (openLayerObserver && openLayerObserver.getCount({
207
207
  namespace: openLayerObserverTopNavStartNamespace,
208
208
  type: 'popup'
209
- }) > 0 && fg('platform_dst_nav4_side_nav_resize_tooltip_feedback')) {
209
+ }) > 0) {
210
210
  return;
211
211
  }
212
212
  const prevFlyoutState = flyoutStateRef.current;
package/dist/esm/ui/page-layout/panel-splitter/panel-splitter.compiled.css CHANGED
@@ -9,8 +9,6 @@
9
9
  ._1e0c1ule{display:block}
10
10
  ._1e0cglyw{display:none}
11
11
  ._1lww188d{transition-delay:.3s}
12
- ._1lww5cps{transition-delay:0ms}
13
- ._1oec1yx9{transition-duration:.1s}
14
12
  ._1oec6ebc{transition-duration:.15s}
15
13
  ._1pbykb7n{z-index:1}
16
14
  ._1q51ze3t{padding-block-start:var(--ds-space-0,0)}
@@ -29,15 +27,10 @@
29
27
  ._syaz1kw7{color:inherit}
30
28
  ._u7coidpf{inset-block-end:0}
31
29
  ._y4tize3t{padding-inline-end:var(--ds-space-0,0)}
32
- ._1cg4fnf5:focus-within{transition-duration:.2s}
33
- ._1dr21ylx:focus-within{transition-property:color}
34
30
  ._vp7g6x5g:focus-within{color:var(--ds-text-selected,#1868db)}
35
- ._1gavfnf5:hover{transition-delay:.2s}
36
- ._1s5z1ylx:hover{transition-property:color}
37
31
  ._30l36x5g:hover{color:var(--ds-text-selected,#1868db)}
38
32
  ._d0al11mm:hover{cursor:col-resize}
39
33
  ._d0aluf7j:hover{cursor:ew-resize}
40
- ._le1bfnf5:hover{transition-duration:.2s}
41
34
  ._1gglglyw:active{transition:none}
42
35
  ._9h8h12zz:active{color:var(--ds-link-pressed,#1558bc)}
43
36
  @media (min-width:48rem){._181n1ule{display:block}}
package/dist/esm/ui/page-layout/panel-splitter/panel-splitter.js CHANGED
@@ -16,7 +16,6 @@ import invariant from 'tiny-invariant';
16
16
  import { useId } from '@atlaskit/ds-lib/use-id';
17
17
  import useStableRef from '@atlaskit/ds-lib/use-stable-ref';
18
18
  import { useOpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer';
19
- import { fg } from '@atlaskit/platform-feature-flags';
20
19
  import { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';
21
20
  import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
22
21
  import { blockDraggingToIFrames } from '@atlaskit/pragmatic-drag-and-drop/element/block-dragging-to-iframes';
@@ -45,10 +44,8 @@ var containerStyles = {
45
44
  positionStart: "_1e02zeo2"
46
45
  };
47
46
  var grabAreaStyles = {
48
- root: "_1bsbl52n _4t3i1osq _kqswstnw _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _syaz1j28 _bfhk1j28 _k8m01ylx _d0aluf7j _vp7g6x5g _30l36x5g _1gglglyw _9h8h12zz",
49
- fullHeightSidebar: "_d0al11mm",
50
- oldTransition: "_1oec1yx9 _1lww5cps _1gavfnf5 _1dr21ylx _1s5z1ylx _1cg4fnf5 _le1bfnf5",
51
- newTransition: "_1oec6ebc _1lww188d _6fl41ytf"
47
+ root: "_1bsbl52n _4t3i1osq _kqswstnw _1q51ze3t _y4tize3t _85i5ze3t _bozgze3t _syaz1j28 _bfhk1j28 _1oec6ebc _1lww188d _6fl41ytf _k8m01ylx _d0aluf7j _vp7g6x5g _30l36x5g _1gglglyw _9h8h12zz",
48
+ fullHeightSidebar: "_d0al11mm"
52
49
  };
53
50
  var lineStyles = {
54
51
  root: "_kqswstnw _1e0c1ule _1bsb1l7b _4t3i1osq _syaz1kw7 _bfhk1r31 _1e021v6z"
@@ -115,12 +112,12 @@ var MaybeTooltip = function MaybeTooltip(_ref2) {
115
112
  testId: testId,
116
113
  content: tooltipContent,
117
114
  shortcut: shortcut,
118
- position: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? 'mouse-y' : 'mouse',
115
+ position: "mouse-y",
119
116
  mousePosition: "right",
120
117
  isScreenReaderAnnouncementDisabled: true,
121
- component: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? PanelSplitterTooltip : undefined,
122
- UNSAFE_shouldAlwaysFadeIn: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback'),
123
- UNSAFE_shouldRenderToParent: fg('platform_dst_nav4_side_nav_resize_tooltip_feedback')
118
+ component: PanelSplitterTooltip,
119
+ UNSAFE_shouldAlwaysFadeIn: true,
120
+ UNSAFE_shouldRenderToParent: true
124
121
  }, children);
125
122
  }
126
123
  return children;
@@ -393,12 +390,12 @@ var PortaledPanelSplitter = function PortaledPanelSplitter(_ref3) {
393
390
  }, /*#__PURE__*/React.createElement(MaybeTooltip, {
394
391
  tooltipContent: tooltipContent,
395
392
  shortcut: shortcut,
396
- testId: testId && fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? "".concat(testId, "-tooltip") : undefined
393
+ testId: testId ? "".concat(testId, "-tooltip") : undefined
397
394
  }, /*#__PURE__*/React.createElement("div", {
398
395
  ref: splitterRef,
399
396
  "data-testid": testId,
400
397
  onDoubleClick: onDoubleClick,
401
- className: ax([grabAreaStyles.root, isFhsEnabled && grabAreaStyles.fullHeightSidebar, fg('platform_dst_nav4_side_nav_resize_tooltip_feedback') ? grabAreaStyles.newTransition : grabAreaStyles.oldTransition])
398
+ className: ax([grabAreaStyles.root, isFhsEnabled && grabAreaStyles.fullHeightSidebar])
402
399
  }, /*#__PURE__*/React.createElement(VisuallyHidden, null, /*#__PURE__*/React.createElement("input", {
403
400
  type: "range",
404
401
  value: rangeInputValue,
package/dist/esm/ui/page-layout/side-nav/side-nav.js CHANGED
@@ -217,7 +217,7 @@ function SideNavInternal(_ref) {
217
217
  if (openLayerObserver && openLayerObserver.getCount({
218
218
  namespace: openLayerObserverTopNavStartNamespace,
219
219
  type: 'popup'
220
- }) > 0 && fg('platform_dst_nav4_side_nav_resize_tooltip_feedback')) {
220
+ }) > 0) {
221
221
  return;
222
222
  }
223
223
  var prevFlyoutState = flyoutStateRef.current;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/navigation-system",
3
- "version": "8.1.0",
3
+ "version": "8.2.0",
4
4
  "description": "The latest navigation system for Atlassian apps.",
5
5
  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
6
6
  "author": "Atlassian Pty Ltd",
@@ -86,7 +86,7 @@
86
86
  "@atlaskit/primitives": "^19.0.0",
87
87
  "@atlaskit/side-nav-items": "^1.13.0",
88
88
  "@atlaskit/tokens": "^13.0.0",
89
- "@atlaskit/tooltip": "^21.1.0",
89
+ "@atlaskit/tooltip": "^21.2.0",
90
90
  "@atlaskit/visually-hidden": "^3.0.0",
91
91
  "@babel/runtime": "^7.0.0",
92
92
  "@compiled/react": "^0.20.0",
@@ -111,7 +111,7 @@
111
111
  "@atlaskit/link": "^3.4.0",
112
112
  "@atlaskit/lozenge": "^13.7.0",
113
113
  "@atlaskit/menu": "^8.5.0",
114
- "@atlaskit/modal-dialog": "^14.17.0",
114
+ "@atlaskit/modal-dialog": "^14.18.0",
115
115
  "@atlaskit/onboarding": "^14.6.0",
116
116
  "@atlaskit/page-header": "^12.1.0",
117
117
  "@atlaskit/page-layout": "^4.3.0",
@@ -156,9 +156,6 @@
156
156
  "platform_dst_nav4_top_nav_increase_height": {
157
157
  "type": "boolean"
158
158
  },
159
- "platform_dst_nav4_side_nav_resize_tooltip_feedback": {
160
- "type": "boolean"
161
- },
162
159
  "platform-component-visual-refresh": {
163
160
  "type": "boolean",
164
161
  "referenceOnly": true