@atlaskit/navigation-system 2.1.1 → 2.1.2

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlassian/navigation-system
 
+## 2.1.2
+
+### Patch Changes
+
+- [`e276abaa88f28`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e276abaa88f28) -
+  The `SideNavToggleButton`, `useExpandSideNav` and `useToggleSideNav` functions have been updated
+  to not throw an error if the side nav state is not initialised (for example, if the `SideNav` has
+  not mounted yet).
+
 ## 2.1.1
 
 ### Patch Changes

package/dist/cjs/ui/page-layout/side-nav/use-expand-side-nav.js

@@ -1,12 +1,10 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useExpandSideNav = useExpandSideNav;
 var _react = require("react");
-var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
 var _visibilityContext = require("./visibility-context");
 /**
  * __useExpandSideNav__
@@ -24,7 +22,11 @@ function useExpandSideNav() {
       matches = _window$matchMedia.matches;
     if (matches) {
       setSideNavState(function (currentState) {
-        (0, _tinyInvariant.default)(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
 
         // Skip the re-render if it's a no-op change
         if (currentState.desktop === 'expanded' && currentState.flyout === 'closed') {
@@ -38,7 +40,11 @@ function useExpandSideNav() {
       });
     } else {
       setSideNavState(function (currentState) {
-        (0, _tinyInvariant.default)(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
 
         // Skip the re-render if it's a no-op change
         if (currentState.mobile === 'expanded' && currentState.flyout === 'closed') {

package/dist/cjs/ui/page-layout/side-nav/use-toggle-side-nav.js

@@ -1,12 +1,10 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useToggleSideNav = useToggleSideNav;
 var _react = require("react");
-var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
 var _visibilityContext = require("./visibility-context");
 /**
  * __useToggleSideNav__
@@ -24,7 +22,11 @@ function useToggleSideNav() {
       matches = _window$matchMedia.matches;
     if (matches) {
       setSideNavState(function (currentState) {
-        (0, _tinyInvariant.default)(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
         return {
           mobile: currentState.mobile,
           desktop: currentState.desktop === 'expanded' ? 'collapsed' : 'expanded',
@@ -33,7 +35,11 @@ function useToggleSideNav() {
       });
     } else {
       setSideNavState(function (currentState) {
-        (0, _tinyInvariant.default)(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
         return {
           desktop: currentState.desktop,
           mobile: currentState.mobile === 'expanded' ? 'collapsed' : 'expanded',

package/dist/es2019/ui/page-layout/side-nav/use-expand-side-nav.js

@@ -1,5 +1,4 @@
 import { useCallback, useContext } from 'react';
-import invariant from 'tiny-invariant';
 import { SetSideNavVisibilityState } from './visibility-context';
 /**
  * __useExpandSideNav__
@@ -18,7 +17,11 @@ export function useExpandSideNav() {
     } = window.matchMedia('(min-width: 64rem)');
     if (matches) {
       setSideNavState(currentState => {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
 
         // Skip the re-render if it's a no-op change
         if (currentState.desktop === 'expanded' && currentState.flyout === 'closed') {
@@ -32,7 +35,11 @@ export function useExpandSideNav() {
       });
     } else {
       setSideNavState(currentState => {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
 
         // Skip the re-render if it's a no-op change
         if (currentState.mobile === 'expanded' && currentState.flyout === 'closed') {

package/dist/es2019/ui/page-layout/side-nav/use-toggle-side-nav.js

@@ -1,5 +1,4 @@
 import { useCallback, useContext } from 'react';
-import invariant from 'tiny-invariant';
 import { SetSideNavVisibilityState } from './visibility-context';
 /**
  * __useToggleSideNav__
@@ -18,7 +17,11 @@ export function useToggleSideNav() {
     } = window.matchMedia('(min-width: 64rem)');
     if (matches) {
       setSideNavState(currentState => {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
         return {
           mobile: currentState.mobile,
           desktop: currentState.desktop === 'expanded' ? 'collapsed' : 'expanded',
@@ -27,7 +30,11 @@ export function useToggleSideNav() {
       });
     } else {
       setSideNavState(currentState => {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
         return {
           desktop: currentState.desktop,
           mobile: currentState.mobile === 'expanded' ? 'collapsed' : 'expanded',

package/dist/esm/ui/page-layout/side-nav/use-expand-side-nav.js

@@ -1,5 +1,4 @@
 import { useCallback, useContext } from 'react';
-import invariant from 'tiny-invariant';
 import { SetSideNavVisibilityState } from './visibility-context';
 /**
  * __useExpandSideNav__
@@ -17,7 +16,11 @@ export function useExpandSideNav() {
       matches = _window$matchMedia.matches;
     if (matches) {
       setSideNavState(function (currentState) {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
 
         // Skip the re-render if it's a no-op change
         if (currentState.desktop === 'expanded' && currentState.flyout === 'closed') {
@@ -31,7 +34,11 @@ export function useExpandSideNav() {
       });
     } else {
       setSideNavState(function (currentState) {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
 
         // Skip the re-render if it's a no-op change
         if (currentState.mobile === 'expanded' && currentState.flyout === 'closed') {

package/dist/esm/ui/page-layout/side-nav/use-toggle-side-nav.js

@@ -1,5 +1,4 @@
 import { useCallback, useContext } from 'react';
-import invariant from 'tiny-invariant';
 import { SetSideNavVisibilityState } from './visibility-context';
 /**
  * __useToggleSideNav__
@@ -17,7 +16,11 @@ export function useToggleSideNav() {
       matches = _window$matchMedia.matches;
     if (matches) {
       setSideNavState(function (currentState) {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
         return {
           mobile: currentState.mobile,
           desktop: currentState.desktop === 'expanded' ? 'collapsed' : 'expanded',
@@ -26,7 +29,11 @@ export function useToggleSideNav() {
       });
     } else {
       setSideNavState(function (currentState) {
-        invariant(currentState, 'Side nav state should not be null');
+        // No-op if the side nav state has not been initialised yet
+        // e.g. if the SideNav has not been mounted yet
+        if (!currentState) {
+          return null;
+        }
         return {
           desktop: currentState.desktop,
           mobile: currentState.mobile === 'expanded' ? 'collapsed' : 'expanded',

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/navigation-system",
-	"version": "2.1.1",
+	"version": "2.1.2",
 	"description": "The latest navigation system for Atlassian apps.",
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
 	"author": "Atlassian Pty Ltd",