@forge/react

Index: package/out/router/components/Router.js
===================================================================
--- package/out/router/components/Router.js
+++ package/out/router/components/Router.js
@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Router = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const bridge_1 = require("@forge/bridge");
+const RouterContext_1 = require("./RouterContext");
+const components_1 = require("../../components");
+const Fallback = ({ hasMatchedRouteRef, fallback }) => {
+    if (hasMatchedRouteRef.current) {
+        return null;
+    }
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: fallback });
+};
+/**
+ * Router provides client-side routing by allowing content to be rendered based on the current URL path.
+ *
+ * @see [Router](https://developer.atlassian.com/platform/forge/ui-kit/components/router/) in UI Kit documentation for more information
+ */
+const Router = ({ children, fallback = null }) => {
+    const [history, setHistory] = (0, react_1.useState)(null);
+    const [location, setLocation] = (0, react_1.useState)(null);
+    const [error, setError] = (0, react_1.useState)(null);
+    const hasMatchedRouteRef = (0, react_1.useRef)(false);
+    hasMatchedRouteRef.current = false;
+    (0, react_1.useEffect)(() => {
+        let unlisten;
+        bridge_1.view
+            .createHistory()
+            .then((history) => {
+            setHistory(history);
+            setLocation(history.location);
+            unlisten = history.listen((location) => {
+                // @ts-ignore - The history object returned by the bridge does not conform to the v5 types.
+                // Instead it uses v4 types, so we need to ignore this type error.
+                setLocation(location);
+            });
+        })
+            .catch(setError);
+        return () => {
+            unlisten?.();
+        };
+    }, []);
+    const routerContext = (0, react_1.useMemo)(() => {
+        if (!history || !location) {
+            return null;
+        }
+        return { history, location, hasMatchedRouteRef };
+    }, [history, location]);
+    if (error) {
+        return ((0, jsx_runtime_1.jsx)(components_1.SectionMessage, { appearance: "error", children: (0, jsx_runtime_1.jsx)(components_1.Text, { children: error.message }) }));
+    }
+    if (!routerContext) {
+        return ((0, jsx_runtime_1.jsx)(components_1.SectionMessage, { appearance: "error", children: (0, jsx_runtime_1.jsxs)(components_1.Text, { children: ["History is not defined. Check the list of", ' ', (0, jsx_runtime_1.jsx)(components_1.Link, { href: "https://developer.atlassian.com/platform/forge/ui-kit/components/router/#supported-modules", children: "supported modules" }), ' ', "for Router"] }) }));
+    }
+    return ((0, jsx_runtime_1.jsxs)(RouterContext_1.RouterContext.Provider, { value: routerContext, children: [children, (0, jsx_runtime_1.jsx)(Fallback, { hasMatchedRouteRef: hasMatchedRouteRef, fallback: fallback })] }));
+};
+exports.Router = Router;