@khanacademy/wonder-blocks-core - npm Package Compare versions

Comparing version 2.6.0 to 2.6.1

components/clickable-behavior.js

@@ -301,3 +301,62 @@ // @flow
 
-    async runCallbackAndMaybeNavigate(e: SyntheticEvent<>) {
+    navigateOrReset(shouldNavigate: boolean) {
+        if (shouldNavigate) {
+            const {history, href, skipClientNav} = this.props;
+            if (href) {
+                if (history && !skipClientNav) {
+                    history.push(href);
+                    this.setState({waiting: false});
+                } else {
+                    window.location.assign(href);
+                    // We don't bother clearing the waiting state, the full page
+                    // load navigation will do that for us by loading a new page.
+                }
+            }
+        } else {
+            this.setState({waiting: false});
+        }
+    }
+
+    handleSafeWithNav(
+        safeWithNav: () => Promise<mixed>,
+        shouldNavigate: boolean,
+    ) {
+        const {skipClientNav, history} = this.props;
+
+        if (history && !skipClientNav) {
+            // client-side nav
+            safeWithNav();
+
+            this.navigateOrReset(shouldNavigate);
+
+            return Promise.resolve();
+        } else {
+            if (!this.state.waiting) {
+                // We only show the spinner for safeWithNav when doing
+                // a full page load navigation since since the spinner is
+                // indicating that we're waiting for navigation to occur.
+                this.setState({waiting: true});
+            }
+            return safeWithNav()
+                .then(() => {
+                    if (!this.state.waiting) {
+                        // We only show the spinner for safeWithNav when doing
+                        // a full page load navigation since since the spinner is
+                        // indicating that we're waiting for navigation to occur.
+                        this.setState({waiting: true});
+                    }
+                    return;
+                })
+                .catch((error) => {
+                    // We ignore the error here so that we always
+                    // navigate when using safeWithNav regardless of
+                    // whether we're doing a client-side nav or not.
+                })
+                .finally(() => {
+                    this.navigateOrReset(shouldNavigate);
+                });
+        }
+    }
+
+    runCallbackAndMaybeNavigate(e: SyntheticEvent<>) {
         const {
@@ -307,4 +366,2 @@ onClick = undefined,
             safeWithNav = undefined,
-            skipClientNav,
-            history,
         } = this.props;
@@ -326,36 +383,20 @@ let shouldNavigate = true;
 
-        try {
-            if (beforeNav) {
-                this.setState({waiting: true});
-                await beforeNav();
-            }
-
-            if (safeWithNav) {
-                if (history && !skipClientNav) {
-                    // client-side nav
-                    safeWithNav();
-                } else {
-                    try {
-                        if (!this.state.waiting) {
-                            // We only show the spinner for safeWithNav when doing
-                            // a full page load navigation since since the spinner is
-                            // indicating that we're waiting for navigation to occur.
-                            this.setState({waiting: true});
-                        }
-                        await safeWithNav();
-                    } catch (error) {
-                        // We ignore the error here so that we always
-                        // navigate when using safeWithNav regardless of
-                        // whether we're doing a client-side nav or not.
+        if (beforeNav) {
+            this.setState({waiting: true});
+            beforeNav()
+                .then(() => {
+                    if (safeWithNav) {
+                        return this.handleSafeWithNav(
+                            safeWithNav,
+                            shouldNavigate,
+                        );
+                    } else {
+                        return this.navigateOrReset(shouldNavigate);
                     }
-                }
-            }
-        } catch (error) {
-            shouldNavigate = false;
-        }
-
-        if (shouldNavigate) {
-            this.maybeNavigate();
+                })
+                .catch(() => {});
+        } else if (safeWithNav) {
+            return this.handleSafeWithNav(safeWithNav, shouldNavigate);
         } else {
-            this.setState({waiting: false});
+            this.navigateOrReset(shouldNavigate);
         }
@@ -452,3 +493,3 @@ }
 
-    handleKeyUp = async (e: SyntheticKeyboardEvent<>) => {
+    handleKeyUp = (e: SyntheticKeyboardEvent<>) => {
         const keyCode = e.which || e.keyCode;
@@ -478,16 +519,2 @@ const {triggerOnEnter, triggerOnSpace} = getAppropriateTriggersForRole(
 
-    maybeNavigate = () => {
-        const {history, href, skipClientNav} = this.props;
-        if (href) {
-            if (history && !skipClientNav) {
-                history.push(href);
-                this.setState({waiting: false});
-            } else {
-                window.location.assign(href);
-                // We don't bother clearing the waiting state, the full page
-                // load navigation will do that for us by loading a new page.
-            }
-        }
-    };
-
     render() {
@@ -494,0 +521,0 @@ const handlers = this.props.disabled

dist/es/index.js

@@ -1,41 +0,5 @@
-import React__default, { Component, createElement, createContext } from 'react';
+import React, { Component, createElement, createContext } from 'react';
 import { StyleSheet, css } from 'aphrodite';
 import { withRouter } from 'react-router-dom';
 
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
-  try {
-    var info = gen[key](arg);
-    var value = info.value;
-  } catch (error) {
-    reject(error);
-    return;
-  }
-
-  if (info.done) {
-    resolve(value);
-  } else {
-    Promise.resolve(value).then(_next, _throw);
-  }
-}
-
-function _asyncToGenerator(fn) {
-  return function () {
-    var self = this,
-        args = arguments;
-    return new Promise(function (resolve, reject) {
-      var gen = fn.apply(self, args);
-
-      function _next(value) {
-        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
-      }
-
-      function _throw(err) {
-        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
-      }
-
-      _next(undefined);
-    });
-  };
-}
-
 function _classCallCheck(instance, Constructor) {
@@ -684,37 +648,21 @@ if (!(instance instanceof Constructor)) {
 
-    _defineProperty(_assertThisInitialized(_this), "handleKeyUp", /*#__PURE__*/function () {
-      var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(e) {
-        var keyCode, _getAppropriateTrigge2, triggerOnEnter, triggerOnSpace;
+    _defineProperty(_assertThisInitialized(_this), "handleKeyUp", function (e) {
+      var keyCode = e.which || e.keyCode;
 
-        return regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                keyCode = e.which || e.keyCode;
-                _getAppropriateTrigge2 = getAppropriateTriggersForRole(_this.props.role), triggerOnEnter = _getAppropriateTrigge2.triggerOnEnter, triggerOnSpace = _getAppropriateTrigge2.triggerOnSpace;
+      var _getAppropriateTrigge2 = getAppropriateTriggersForRole(_this.props.role),
+          triggerOnEnter = _getAppropriateTrigge2.triggerOnEnter,
+          triggerOnSpace = _getAppropriateTrigge2.triggerOnSpace;
 
-                if (triggerOnEnter && keyCode === keyCodes.enter || triggerOnSpace && keyCode === keyCodes.space) {
-                  _this.setState({
-                    pressed: false,
-                    focused: true
-                  });
+      if (triggerOnEnter && keyCode === keyCodes.enter || triggerOnSpace && keyCode === keyCodes.space) {
+        _this.setState({
+          pressed: false,
+          focused: true
+        });
 
-                  _this.runCallbackAndMaybeNavigate(e);
-                } else if (!triggerOnEnter && keyCode === keyCodes.enter) {
-                  _this.enterClick = false;
-                }
+        _this.runCallbackAndMaybeNavigate(e);
+      } else if (!triggerOnEnter && keyCode === keyCodes.enter) {
+        _this.enterClick = false;
+      }
+    });
 
-              case 3:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee);
-      }));
-
-      return function (_x) {
-        return _ref.apply(this, arguments);
-      };
-    }());
-
     _defineProperty(_assertThisInitialized(_this), "handleFocus", function (e) {
@@ -733,22 +681,2 @@ _this.setState({
 
-    _defineProperty(_assertThisInitialized(_this), "maybeNavigate", function () {
-      var _this$props2 = _this.props,
-          history = _this$props2.history,
-          href = _this$props2.href,
-          skipClientNav = _this$props2.skipClientNav;
-
-      if (href) {
-        if (history && !skipClientNav) {
-          history.push(href);
-
-          _this.setState({
-            waiting: false
-          });
-        } else {
-          window.location.assign(href); // We don't bother clearing the waiting state, the full page
-          // load navigation will do that for us by loading a new page.
-        }
-      }
-    });
-
     _this.state = startState;
@@ -762,110 +690,114 @@ _this.waitingForClick = false;
   _createClass(ClickableBehavior, [{
-    key: "runCallbackAndMaybeNavigate",
-    value: function () {
-      var _runCallbackAndMaybeNavigate = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(e) {
-        var _this$props3, _this$props3$onClick, onClick, _this$props3$beforeNa, beforeNav, _this$props3$safeWith, safeWithNav, skipClientNav, history, shouldNavigate;
+    key: "navigateOrReset",
+    value: function navigateOrReset(shouldNavigate) {
+      if (shouldNavigate) {
+        var _this$props2 = this.props,
+            history = _this$props2.history,
+            href = _this$props2.href,
+            skipClientNav = _this$props2.skipClientNav;
 
-        return regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                _this$props3 = this.props, _this$props3$onClick = _this$props3.onClick, onClick = _this$props3$onClick === void 0 ? undefined : _this$props3$onClick, _this$props3$beforeNa = _this$props3.beforeNav, beforeNav = _this$props3$beforeNa === void 0 ? undefined : _this$props3$beforeNa, _this$props3$safeWith = _this$props3.safeWithNav, safeWithNav = _this$props3$safeWith === void 0 ? undefined : _this$props3$safeWith, skipClientNav = _this$props3.skipClientNav, history = _this$props3.history;
-                shouldNavigate = true;
+        if (href) {
+          if (history && !skipClientNav) {
+            history.push(href);
+            this.setState({
+              waiting: false
+            });
+          } else {
+            window.location.assign(href); // We don't bother clearing the waiting state, the full page
+            // load navigation will do that for us by loading a new page.
+          }
+        }
+      } else {
+        this.setState({
+          waiting: false
+        });
+      }
+    }
+  }, {
+    key: "handleSafeWithNav",
+    value: function handleSafeWithNav(safeWithNav, shouldNavigate) {
+      var _this2 = this;
 
-                if (onClick) {
-                  onClick(e);
-                } // If onClick() has called e.preventDefault() then we shouldn't
-                // navigate.
+      var _this$props3 = this.props,
+          skipClientNav = _this$props3.skipClientNav,
+          history = _this$props3.history;
 
+      if (history && !skipClientNav) {
+        // client-side nav
+        safeWithNav();
+        this.navigateOrReset(shouldNavigate);
+        return Promise.resolve();
+      } else {
+        if (!this.state.waiting) {
+          // We only show the spinner for safeWithNav when doing
+          // a full page load navigation since since the spinner is
+          // indicating that we're waiting for navigation to occur.
+          this.setState({
+            waiting: true
+          });
+        }
 
-                if (e.defaultPrevented) {
-                  shouldNavigate = false;
-                } // Prevent navigation.
+        return safeWithNav().then(function () {
+          if (!_this2.state.waiting) {
+            // We only show the spinner for safeWithNav when doing
+            // a full page load navigation since since the spinner is
+            // indicating that we're waiting for navigation to occur.
+            _this2.setState({
+              waiting: true
+            });
+          }
 
+          return;
+        }).catch(function (error) {// We ignore the error here so that we always
+          // navigate when using safeWithNav regardless of
+          // whether we're doing a client-side nav or not.
+        }).finally(function () {
+          _this2.navigateOrReset(shouldNavigate);
+        });
+      }
+    }
+  }, {
+    key: "runCallbackAndMaybeNavigate",
+    value: function runCallbackAndMaybeNavigate(e) {
+      var _this3 = this;
 
-                e.preventDefault();
-                _context2.prev = 5;
+      var _this$props4 = this.props,
+          _this$props4$onClick = _this$props4.onClick,
+          onClick = _this$props4$onClick === void 0 ? undefined : _this$props4$onClick,
+          _this$props4$beforeNa = _this$props4.beforeNav,
+          beforeNav = _this$props4$beforeNa === void 0 ? undefined : _this$props4$beforeNa,
+          _this$props4$safeWith = _this$props4.safeWithNav,
+          safeWithNav = _this$props4$safeWith === void 0 ? undefined : _this$props4$safeWith;
+      var shouldNavigate = true;
 
-                if (!beforeNav) {
-                  _context2.next = 10;
-                  break;
-                }
+      if (onClick) {
+        onClick(e);
+      } // If onClick() has called e.preventDefault() then we shouldn't
+      // navigate.
 
-                this.setState({
-                  waiting: true
-                });
-                _context2.next = 10;
-                return beforeNav();
 
-              case 10:
-                if (!safeWithNav) {
-                  _context2.next = 23;
-                  break;
-                }
+      if (e.defaultPrevented) {
+        shouldNavigate = false;
+      } // Prevent navigation.
 
-                if (!(history && !skipClientNav)) {
-                  _context2.next = 15;
-                  break;
-                }
 
-                // client-side nav
-                safeWithNav();
-                _context2.next = 23;
-                break;
+      e.preventDefault();
 
-              case 15:
-                _context2.prev = 15;
-
-                if (!this.state.waiting) {
-                  // We only show the spinner for safeWithNav when doing
-                  // a full page load navigation since since the spinner is
-                  // indicating that we're waiting for navigation to occur.
-                  this.setState({
-                    waiting: true
-                  });
-                }
-
-                _context2.next = 19;
-                return safeWithNav();
-
-              case 19:
-                _context2.next = 23;
-                break;
-
-              case 21:
-                _context2.prev = 21;
-                _context2.t0 = _context2["catch"](15);
-
-              case 23:
-                _context2.next = 28;
-                break;
-
-              case 25:
-                _context2.prev = 25;
-                _context2.t1 = _context2["catch"](5);
-                shouldNavigate = false;
-
-              case 28:
-                if (shouldNavigate) {
-                  this.maybeNavigate();
-                } else {
-                  this.setState({
-                    waiting: false
-                  });
-                }
-
-              case 29:
-              case "end":
-                return _context2.stop();
-            }
+      if (beforeNav) {
+        this.setState({
+          waiting: true
+        });
+        beforeNav().then(function () {
+          if (safeWithNav) {
+            return _this3.handleSafeWithNav(safeWithNav, shouldNavigate);
+          } else {
+            return _this3.navigateOrReset(shouldNavigate);
           }
-        }, _callee2, this, [[5, 25], [15, 21]]);
-      }));
-
-      function runCallbackAndMaybeNavigate(_x2) {
-        return _runCallbackAndMaybeNavigate.apply(this, arguments);
+        }).catch(function () {});
+      } else if (safeWithNav) {
+        return this.handleSafeWithNav(safeWithNav, shouldNavigate);
+      } else {
+        this.navigateOrReset(shouldNavigate);
       }
-
-      return runCallbackAndMaybeNavigate;
-    }()
+    }
   }, {
@@ -1045,3 +977,3 @@ key: "render",
       var styleAttributes = processStyleList([styles.text, isHeader && styles.header, style]);
-      return /*#__PURE__*/React__default.createElement(Tag, _extends({}, otherProps, {
+      return /*#__PURE__*/React.createElement(Tag, _extends({}, otherProps, {
         style: styleAttributes.style,
@@ -1055,3 +987,3 @@ className: styleAttributes.className,
   return Text;
-}(React__default.Component);
+}(React.Component);
 
@@ -1058,0 +990,0 @@ _defineProperty(Text, "defaultProps", {

package.json

 {
   "name": "@khanacademy/wonder-blocks-core",
-  "version": "2.6.0",
+  "version": "2.6.1",
   "design": "v1",
@@ -16,3 +16,3 @@ "publishConfig": {
   "dependencies": {
-    "@khanacademy/wonder-blocks-spacing": "^2.1.13"
+    "@khanacademy/wonder-blocks-spacing": "^2.1.14"
   },
@@ -31,3 +31,3 @@ "peerDependencies": {
   "license": "MIT",
-  "gitHead": "65c91a0dcf5f6f6e3b235d40bab721ddfdd4f5cf"
+  "gitHead": "f01110e676c2caf00bc213d4283c02933b131017"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

398328

decreased by-0.76%

Lines of code

8206

decreased by-0.53%

Dependency changes

• Updated@khanacademy/wonder-blocks-spacing@^2.1.14