@micromag/editor 0.3.498 → 0.3.500

package/lib/index.js

@@ -198,7 +198,7 @@ if (typeof history !== "undefined" && typeof window[patchKey] === "undefined") {
 
 var _excluded$d = ["children"],
   _excluded2$1 = ["path", "nest", "match"],
-  _excluded3 = ["to", "href", "onClick", "asChild", "children", "replace", "state"];
+  _excluded3 = ["to", "href", "onClick", "asChild", "children", "className", "replace", "state"];
 
 /*
  * Transforms `path` into its relative `base` version
@@ -241,7 +241,11 @@ var defaultRouter = {
   base: "",
   // this option is used to override the current location during SSR
   ssrPath: undefined,
-  ssrSearch: undefined
+  ssrSearch: undefined,
+  // customizes how `href` props are transformed for <Link />
+  hrefs: function hrefs(x) {
+    return x;
+  }
 };
 var RouterCtx = React.createContext(defaultRouter);
 
@@ -305,6 +309,7 @@ var matchRoute = function matchRoute(parser, route, path, loose) {
  */
 
 var Router = function Router(_ref3) {
+  var _props$ssrPath$split, _props$ssrPath, _props$hrefs, _props$hook;
   var children = _ref3.children,
     props = _objectWithoutProperties(_ref3, _excluded$d);
   // the router we will inherit from - it is the closest router in the tree,
@@ -315,6 +320,16 @@ var Router = function Router(_ref3) {
   // holds to the context value: the router object
   var value = parent;
 
+  // when `ssrPath` contains a `?` character, we can extract the search from it
+  var _ref4 = (_props$ssrPath$split = (_props$ssrPath = props.ssrPath) === null || _props$ssrPath === void 0 ? void 0 : _props$ssrPath.split("?")) !== null && _props$ssrPath$split !== void 0 ? _props$ssrPath$split : [],
+    _ref5 = _slicedToArray(_ref4, 2),
+    path = _ref5[0],
+    search = _ref5[1];
+  if (search) props.ssrSearch = search, props.ssrPath = path;
+
+  // hooks can define their own `href` formatter (e.g. for hash location)
+  props.hrefs = (_props$hrefs = props.hrefs) !== null && _props$hrefs !== void 0 ? _props$hrefs : (_props$hook = props.hook) === null || _props$hook === void 0 ? void 0 : _props$hook.hrefs;
+
   // what is happening below: to avoid unnecessary rerenders in child components,
   // we ensure that the router object reference is stable, unless there are any
   // changes that require reload (e.g. `base` prop changes -> all components that
@@ -344,9 +359,9 @@ var Router = function Router(_ref3) {
     children: children
   });
 };
-var h_route = function h_route(_ref4, params) {
-  var children = _ref4.children,
-    component = _ref4.component;
+var h_route = function h_route(_ref6, params) {
+  var children = _ref6.children,
+    component = _ref6.component;
   // React-Router style `component` prop
   if (component) return React.createElement(component, {
     params: params
@@ -355,22 +370,22 @@ var h_route = function h_route(_ref4, params) {
   // support render prop or plain children
   return typeof children === "function" ? children(params) : children;
 };
-var Route = function Route(_ref5) {
-  var path = _ref5.path,
-    nest = _ref5.nest,
-    match = _ref5.match,
-    renderProps = _objectWithoutProperties(_ref5, _excluded2$1);
+var Route = function Route(_ref7) {
+  var path = _ref7.path,
+    nest = _ref7.nest,
+    match = _ref7.match,
+    renderProps = _objectWithoutProperties(_ref7, _excluded2$1);
   var router = useRouter();
   var _useLocationFromRoute = useLocationFromRouter(router),
     _useLocationFromRoute2 = _slicedToArray(_useLocationFromRoute, 1),
     location = _useLocationFromRoute2[0];
-  var _ref6 = // `match` is a special prop to give up control to the parent,
+  var _ref8 = // `match` is a special prop to give up control to the parent,
     // it is used by the `Switch` to avoid double matching
     match !== null && match !== void 0 ? match : matchRoute(router.parser, path, location, nest),
-    _ref7 = _slicedToArray(_ref6, 3),
-    matches = _ref7[0],
-    params = _ref7[1],
-    base = _ref7[2];
+    _ref9 = _slicedToArray(_ref8, 3),
+    matches = _ref9[0],
+    params = _ref9[1],
+    base = _ref9[2];
   if (!matches) return null;
   var children = base ? React.createElement(Router, {
     base: base
@@ -384,13 +399,15 @@ React.forwardRef(function (props, ref) {
   var router = useRouter();
   var _useLocationFromRoute3 = useLocationFromRouter(router),
     _useLocationFromRoute4 = _slicedToArray(_useLocationFromRoute3, 2),
+    path = _useLocationFromRoute4[0],
     navigate = _useLocationFromRoute4[1];
   var to = props.to,
     _props$href = props.href,
     _href = _props$href === void 0 ? to : _props$href,
     _onClick = props.onClick,
     asChild = props.asChild,
-    children = props.children;
+    children = props.children,
+    cls = props.className;
     props.replace;
     props.state;
     var restProps = _objectWithoutProperties(props, _excluded3);
@@ -398,7 +415,7 @@ React.forwardRef(function (props, ref) {
     // ignores the navigation when clicked using right mouse button or
     // by holding a special modifier key: ctrl, command, win, alt, shift
     if (event.ctrlKey || event.metaKey || event.altKey || event.shiftKey || event.button !== 0) return;
-    _onClick && _onClick(event); // TODO: is it safe to use _onClick?.(event)
+    _onClick === null || _onClick === void 0 || _onClick(event);
     if (!event.defaultPrevented) {
       event.preventDefault();
       navigate(_href, props);
@@ -406,26 +423,28 @@ React.forwardRef(function (props, ref) {
   });
 
   // handle nested routers and absolute paths
-  var href = _href[0] === "~" ? _href.slice(1) : router.base + _href;
+  var href = router.hrefs(_href[0] === "~" ? _href.slice(1) : router.base + _href, router // pass router as a second argument for convinience
+  );
   return asChild && React.isValidElement(children) ? React.cloneElement(children, {
-    href: href,
-    onClick: onClick
+    onClick: onClick,
+    href: href
   }) : React.createElement("a", _objectSpread(_objectSpread({}, restProps), {}, {
-    href: href,
     onClick: onClick,
+    href: href,
+    // `className` can be a function to apply the class if this link is active
+    className: cls !== null && cls !== void 0 && cls.call ? cls(path === href) : cls,
     children: children,
     ref: ref
   }));
 });
 var flattenChildren = function flattenChildren(children) {
-  var _ref8;
-  return Array.isArray(children) ? (_ref8 = []).concat.apply(_ref8, _toConsumableArray(children.map(function (c) {
-    return c && c.type === React.Fragment ? flattenChildren(c.props.children) : flattenChildren(c);
-  }))) : [children];
+  return Array.isArray(children) ? children.flatMap(function (c) {
+    return flattenChildren(c && c.type === React.Fragment ? c.props.children : c);
+  }) : [children];
 };
-var Switch = function Switch(_ref9) {
-  var children = _ref9.children,
-    location = _ref9.location;
+var Switch = function Switch(_ref10) {
+  var children = _ref10.children,
+    location = _ref10.location;
   var router = useRouter();
   var _useLocationFromRoute5 = useLocationFromRouter(router),
     _useLocationFromRoute6 = _slicedToArray(_useLocationFromRoute5, 1),
@@ -550,7 +569,8 @@ function useRouteMatcher() {
   return matcher;
 }
 function createPathToRegexpParser(opts) {
-  return function (path, loose) {
+  return function (fullPath, loose) {
+    var path = fullPath.replace(/^(https?:\/\/[^/]+)\/?/, '/');
     var keys = [];
     var isWildcard = path.match(/(\/|^)\*$/) !== null;
     var pattern = pathToRegexp.pathToRegexp(isWildcard ? path.replace(/(\/|^)\*$/, '$1(.*)') : path, keys, _objectSpread({

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/editor",
-    "version": "0.3.498",
+    "version": "0.3.500",
     "private": false,
     "description": "",
     "keywords": [
@@ -73,10 +73,10 @@
         "@fortawesome/free-solid-svg-icons": "^5.15.1",
         "@fortawesome/react-fontawesome": "^0.1.13",
         "@micromag/core": "^0.3.497",
-        "@micromag/elements": "^0.3.497",
+        "@micromag/elements": "^0.3.500",
         "@micromag/fields": "^0.3.497",
-        "@micromag/screens": "^0.3.497",
-        "@micromag/viewer": "^0.3.498",
+        "@micromag/screens": "^0.3.500",
+        "@micromag/viewer": "^0.3.500",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -91,5 +91,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "0241852143b11b4cd1d6e7abf1b05b9c73513692"
+    "gitHead": "ec754f9301e9fbd5c7ee1e929acb5355c732cfd6"
 }