@koordinates/xstate-tree 4.3.0-beta.3 → 4.3.0-beta.5

package/lib/routing/Link.js

@@ -1,20 +1,32 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Link = void 0;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const useHref_1 = require("./useHref");
-/**
- * @public
- *
- * Renders an anchor tag pointing at the provided Route
- *
- * The query/params/meta props are conditionally required based on the
- * route passed as the To parameter
- */
-function Link({ to, children, testId, preloadOnHoverMs, preloadOnInteraction, onMouseDown: _onMouseDown, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave, ...rest }) {
+function LinkInner({ to, children, testId, preloadOnHoverMs, preloadOnInteraction, onMouseDown: _onMouseDown, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave, ...rest }, ref) {
     // @ts-ignore, these fields _might_ exist, so typechecking doesn't believe they exist
     // and everything that consumes params/query already checks for undefined
     const { params, query, meta, ...props } = rest;
@@ -42,9 +54,8 @@ function Link({ to, children, testId, preloadOnHoverMs, preloadOnInteraction, on
             }
         }
         : undefined;
-    return (react_1.default.createElement("a", { ...props, href: href, "data-testid": testId, onMouseDown: onMouseDown !== null && onMouseDown !== void 0 ? onMouseDown : _onMouseDown, onMouseEnter: onMouseEnter !== null && onMouseEnter !== void 0 ? onMouseEnter : _onMouseEnter, onMouseLeave: onMouseLeave !== null && onMouseLeave !== void 0 ? onMouseLeave : _onMouseLeave, onClick: (e) => {
+    return (react_1.default.createElement("a", { ...props, ref: ref, href: href, "data-testid": testId, onMouseDown: onMouseDown !== null && onMouseDown !== void 0 ? onMouseDown : _onMouseDown, onMouseEnter: onMouseEnter !== null && onMouseEnter !== void 0 ? onMouseEnter : _onMouseEnter, onMouseLeave: onMouseLeave !== null && onMouseLeave !== void 0 ? onMouseLeave : _onMouseLeave, onClick: (e) => {
             var _a;
-            e.preventDefault();
             if (((_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e)) === false) {
                 return;
             }
@@ -53,7 +64,16 @@ function Link({ to, children, testId, preloadOnHoverMs, preloadOnInteraction, on
             if (e.metaKey || e.ctrlKey) {
                 return;
             }
+            e.preventDefault();
             to.navigate({ params, query, meta });
         } }, children));
 }
-exports.Link = Link;
+/**
+ * @public
+ *
+ * Renders an anchor tag pointing at the provided Route
+ *
+ * The query/params/meta props are conditionally required based on the
+ * route passed as the To parameter
+ */
+exports.Link = (0, react_1.forwardRef)(LinkInner);

package/lib/xstate-tree.d.ts

@@ -355,7 +355,21 @@ export declare function lazy<TMachine extends AnyStateMachine>(factory: () => Pr
  * The query/params/meta props are conditionally required based on the
  * route passed as the To parameter
  */
-export declare function Link<TRoute extends AnyRoute>({ to, children, testId, preloadOnHoverMs, preloadOnInteraction, onMouseDown: _onMouseDown, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave, ...rest }: LinkProps<TRoute>): JSX.Element;
+export declare const Link: <TRoute extends AnyRoute>(props: {
+    to: TRoute;
+    children: React_2.ReactNode;
+    testId?: string | undefined;
+    /**
+     * onClick works as normal, but if you return false from it the navigation will not happen
+     */
+    onClick?: ((e: React_2.MouseEvent<HTMLAnchorElement>) => boolean | void) | undefined;
+    preloadOnInteraction?: boolean | undefined;
+    preloadOnHoverMs?: number | undefined;
+} & RouteArguments<TRoute extends Route<infer TParams, any, any, any> ? TParams : undefined, TRoute extends Route<any, infer TQuery, any, any> ? TQuery : undefined, TRoute extends Route<any, any, any, infer TMeta> ? TMeta : undefined> & Omit<React_2.AnchorHTMLAttributes<HTMLAnchorElement>, "href" | "onClick"> & {
+    ref?: React_2.ForwardedRef<HTMLAnchorElement> | undefined;
+}) => ReturnType<typeof LinkInner>;
+
+declare function LinkInner<TRoute extends AnyRoute>({ to, children, testId, preloadOnHoverMs, preloadOnInteraction, onMouseDown: _onMouseDown, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave, ...rest }: LinkProps<TRoute>, ref: React_2.ForwardedRef<HTMLAnchorElement>): JSX.Element;
 
 /**
  * @public

package/lib/xstateTree.js

@@ -152,7 +152,7 @@ function XstateTreeView({ interpreter }) {
     // This is needed because the inState function needs to be recreated if the
     // current state the machine is in changes. But _only_ then
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [current.value]);
+    [current === null || current === void 0 ? void 0 : current.value]);
     const selectorsProxy = (0, useConstant_1.useConstant)(() => {
         return new Proxy({}, {
             get: (_target, prop) => {
@@ -206,9 +206,10 @@ exports.XstateTreeView = XstateTreeView;
  * @internal
  */
 function recursivelySend(service, event) {
+    var _a;
     const children = ([...service.children.values()] || []).filter((s) => s.id.includes("-slot"));
     // If the service can't handle the event, don't send it
-    if (service.state.nextEvents.includes(event.type)) {
+    if ((_a = service.getSnapshot()) === null || _a === void 0 ? void 0 : _a.nextEvents.includes(event.type)) {
         try {
             service.send(event);
         }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@koordinates/xstate-tree",
   "main": "lib/index.js",
   "types": "lib/xstate-tree.d.ts",
-  "version": "4.3.0-beta.3",
+  "version": "4.3.0-beta.5",
   "license": "MIT",
   "description": "Build UIs with Actors using xstate and React",
   "keywords": [