@atlaskit/navigation-system 5.18.1 → 5.19.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 (5) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/ui/page-layout/side-nav/toggle-button.js +3 -12
  3. package/dist/es2019/ui/page-layout/side-nav/toggle-button.js +4 -13
  4. package/dist/esm/ui/page-layout/side-nav/toggle-button.js +4 -13
  5. package/package.json +2 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlassian/navigation-system
2
2
 
3
+ ## 5.19.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`819adcd884291`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/819adcd884291) -
8
+ Tidy `platform_dst_nav4_side_nav_toggle_ref_fix` feature gate. This addresses a potential issue
9
+ with refs becoming stale.
10
+
3
11
  ## 5.18.1
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/ui/page-layout/side-nav/toggle-button.js CHANGED
@@ -66,11 +66,9 @@ var SideNavToggleButton = exports.SideNavToggleButton = function SideNavToggleBu
66
66
  isSideNavExpanded = _useState2[0],
67
67
  setIsSideNavExpanded = _useState2[1];
68
68
  var ref = (0, _react.useContext)(_toggleButtonContext.SideNavToggleButtonAttachRef);
69
- var elementRef = (0, _react.useRef)(null);
70
69
 
71
70
  /**
72
- * Attempts to address HOT-121458 by ensuring that the toggle button element
73
- * in context is always up to date.
71
+ * Addresses HOT-121458 by ensuring that the toggle button element in context is always up to date.
74
72
  *
75
73
  * My theory is that something to do with SSR, hydration and suspense was causing the
76
74
  * underlying HTML element to change but without causing the toggle button to remount.
@@ -82,15 +80,8 @@ var SideNavToggleButton = exports.SideNavToggleButton = function SideNavToggleBu
82
80
  element = _useState4[0],
83
81
  setElement = _useState4[1];
84
82
  (0, _react.useEffect)(function () {
85
- if ((0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_toggle_ref_fix')) {
86
- ref(element);
87
- }
83
+ ref(element);
88
84
  }, [element, ref]);
89
- (0, _react.useEffect)(function () {
90
- if (!(0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_toggle_ref_fix')) {
91
- ref(elementRef.current);
92
- }
93
- }, [elementRef, ref]);
94
85
  (0, _react.useEffect)(function () {
95
86
  var _window$matchMedia = window.matchMedia('(min-width: 64rem)'),
96
87
  matches = _window$matchMedia.matches;
@@ -181,7 +172,7 @@ var SideNavToggleButton = exports.SideNavToggleButton = function SideNavToggleBu
181
172
  testId: testId,
182
173
  isTooltipDisabled: false,
183
174
  interactionName: interactionName,
184
- ref: (0, _platformFeatureFlags.fg)('platform_dst_nav4_side_nav_toggle_ref_fix') ? setElement : elementRef,
175
+ ref: setElement,
185
176
  tooltip: tooltipProps
186
177
  });
187
178
  };
package/dist/es2019/ui/page-layout/side-nav/toggle-button.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /* toggle-button.tsx generated by @compiled/babel-plugin v0.38.1 */
2
2
  import "./toggle-button.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
- import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
4
+ import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
5
5
  import { bind } from 'bind-event-listener';
6
6
  import { useAnalyticsEvents } from '@atlaskit/analytics-next';
7
7
  import SidebarCollapseIcon from '@atlaskit/icon/core/sidebar-collapse';
@@ -51,11 +51,9 @@ export const SideNavToggleButton = ({
51
51
  // initialized in SSR
52
52
  const [isSideNavExpanded, setIsSideNavExpanded] = useState(sideNavState === null || !fg('platform_dst_nav4_side_nav_default_collapsed_api') ? !defaultCollapsed : isSideNavExpandedOnDesktop);
53
53
  const ref = useContext(SideNavToggleButtonAttachRef);
54
- const elementRef = useRef(null);
55
54
 
56
55
  /**
57
- * Attempts to address HOT-121458 by ensuring that the toggle button element
58
- * in context is always up to date.
56
+ * Addresses HOT-121458 by ensuring that the toggle button element in context is always up to date.
59
57
  *
60
58
  * My theory is that something to do with SSR, hydration and suspense was causing the
61
59
  * underlying HTML element to change but without causing the toggle button to remount.
@@ -64,15 +62,8 @@ export const SideNavToggleButton = ({
64
62
  */
65
63
  const [element, setElement] = useState(null);
66
64
  useEffect(() => {
67
- if (fg('platform_dst_nav4_side_nav_toggle_ref_fix')) {
68
- ref(element);
69
- }
65
+ ref(element);
70
66
  }, [element, ref]);
71
- useEffect(() => {
72
- if (!fg('platform_dst_nav4_side_nav_toggle_ref_fix')) {
73
- ref(elementRef.current);
74
- }
75
- }, [elementRef, ref]);
76
67
  useEffect(() => {
77
68
  const {
78
69
  matches
@@ -164,7 +155,7 @@ export const SideNavToggleButton = ({
164
155
  testId: testId,
165
156
  isTooltipDisabled: false,
166
157
  interactionName: interactionName,
167
- ref: fg('platform_dst_nav4_side_nav_toggle_ref_fix') ? setElement : elementRef,
158
+ ref: setElement,
168
159
  tooltip: tooltipProps
169
160
  });
170
161
  };
package/dist/esm/ui/page-layout/side-nav/toggle-button.js CHANGED
@@ -5,7 +5,7 @@ import "./toggle-button.compiled.css";
5
5
  import { ax, ix } from "@compiled/react/runtime";
6
6
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
7
7
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
8
- import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
8
+ import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
9
9
  import { bind } from 'bind-event-listener';
10
10
  import { useAnalyticsEvents } from '@atlaskit/analytics-next';
11
11
  import SidebarCollapseIcon from '@atlaskit/icon/core/sidebar-collapse';
@@ -57,11 +57,9 @@ export var SideNavToggleButton = function SideNavToggleButton(_ref) {
57
57
  isSideNavExpanded = _useState2[0],
58
58
  setIsSideNavExpanded = _useState2[1];
59
59
  var ref = useContext(SideNavToggleButtonAttachRef);
60
- var elementRef = useRef(null);
61
60
 
62
61
  /**
63
- * Attempts to address HOT-121458 by ensuring that the toggle button element
64
- * in context is always up to date.
62
+ * Addresses HOT-121458 by ensuring that the toggle button element in context is always up to date.
65
63
  *
66
64
  * My theory is that something to do with SSR, hydration and suspense was causing the
67
65
  * underlying HTML element to change but without causing the toggle button to remount.
@@ -73,15 +71,8 @@ export var SideNavToggleButton = function SideNavToggleButton(_ref) {
73
71
  element = _useState4[0],
74
72
  setElement = _useState4[1];
75
73
  useEffect(function () {
76
- if (fg('platform_dst_nav4_side_nav_toggle_ref_fix')) {
77
- ref(element);
78
- }
74
+ ref(element);
79
75
  }, [element, ref]);
80
- useEffect(function () {
81
- if (!fg('platform_dst_nav4_side_nav_toggle_ref_fix')) {
82
- ref(elementRef.current);
83
- }
84
- }, [elementRef, ref]);
85
76
  useEffect(function () {
86
77
  var _window$matchMedia = window.matchMedia('(min-width: 64rem)'),
87
78
  matches = _window$matchMedia.matches;
@@ -172,7 +163,7 @@ export var SideNavToggleButton = function SideNavToggleButton(_ref) {
172
163
  testId: testId,
173
164
  isTooltipDisabled: false,
174
165
  interactionName: interactionName,
175
- ref: fg('platform_dst_nav4_side_nav_toggle_ref_fix') ? setElement : elementRef,
166
+ ref: setElement,
176
167
  tooltip: tooltipProps
177
168
  });
178
169
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/navigation-system",
3
- "version": "5.18.1",
3
+ "version": "5.19.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",
@@ -116,7 +116,7 @@
116
116
  "@atlaskit/skeleton": "^2.1.0",
117
117
  "@atlaskit/textfield": "^8.2.0",
118
118
  "@atlassian/feature-flags-test-utils": "^1.0.0",
119
- "@atlassian/gemini": "^1.27.0",
119
+ "@atlassian/gemini": "^1.28.0",
120
120
  "@atlassian/search-dialog": "^9.10.0",
121
121
  "@atlassian/ssr-tests": "workspace:^",
122
122
  "@atlassian/test-utils": "^1.0.0",
@@ -157,9 +157,6 @@
157
157
  "platform_dst_nav4_side_nav_default_collapsed_api": {
158
158
  "type": "boolean"
159
159
  },
160
- "platform_dst_nav4_side_nav_toggle_ref_fix": {
161
- "type": "boolean"
162
- },
163
160
  "platform-component-visual-refresh": {
164
161
  "type": "boolean",
165
162
  "referenceOnly": true